[Summary view] [Print] [Text view]

   1  /******/ (() => { // webpackBootstrap
   2  /******/     var __webpack_modules__ = ({
   3  
   4  /***/ 66:
   5  /***/ ((module) => {
   6  
   7  "use strict";
   8  
   9  
  10  var isMergeableObject = function isMergeableObject(value) {
  11      return isNonNullObject(value)
  12          && !isSpecial(value)
  13  };
  14  
  15  function isNonNullObject(value) {
  16      return !!value && typeof value === 'object'
  17  }
  18  
  19  function isSpecial(value) {
  20      var stringValue = Object.prototype.toString.call(value);
  21  
  22      return stringValue === '[object RegExp]'
  23          || stringValue === '[object Date]'
  24          || isReactElement(value)
  25  }
  26  
  27  // see https://github.com/facebook/react/blob/b5ac963fb791d1298e7f396236383bc955f916c1/src/isomorphic/classic/element/ReactElement.js#L21-L25
  28  var canUseSymbol = typeof Symbol === 'function' && Symbol.for;
  29  var REACT_ELEMENT_TYPE = canUseSymbol ? Symbol.for('react.element') : 0xeac7;
  30  
  31  function isReactElement(value) {
  32      return value.$$typeof === REACT_ELEMENT_TYPE
  33  }
  34  
  35  function emptyTarget(val) {
  36      return Array.isArray(val) ? [] : {}
  37  }
  38  
  39  function cloneUnlessOtherwiseSpecified(value, options) {
  40      return (options.clone !== false && options.isMergeableObject(value))
  41          ? deepmerge(emptyTarget(value), value, options)
  42          : value
  43  }
  44  
  45  function defaultArrayMerge(target, source, options) {
  46      return target.concat(source).map(function(element) {
  47          return cloneUnlessOtherwiseSpecified(element, options)
  48      })
  49  }
  50  
  51  function getMergeFunction(key, options) {
  52      if (!options.customMerge) {
  53          return deepmerge
  54      }
  55      var customMerge = options.customMerge(key);
  56      return typeof customMerge === 'function' ? customMerge : deepmerge
  57  }
  58  
  59  function getEnumerableOwnPropertySymbols(target) {
  60      return Object.getOwnPropertySymbols
  61          ? Object.getOwnPropertySymbols(target).filter(function(symbol) {
  62              return Object.propertyIsEnumerable.call(target, symbol)
  63          })
  64          : []
  65  }
  66  
  67  function getKeys(target) {
  68      return Object.keys(target).concat(getEnumerableOwnPropertySymbols(target))
  69  }
  70  
  71  function propertyIsOnObject(object, property) {
  72      try {
  73          return property in object
  74      } catch(_) {
  75          return false
  76      }
  77  }
  78  
  79  // Protects from prototype poisoning and unexpected merging up the prototype chain.
  80  function propertyIsUnsafe(target, key) {
  81      return propertyIsOnObject(target, key) // Properties are safe to merge if they don't exist in the target yet,
  82          && !(Object.hasOwnProperty.call(target, key) // unsafe if they exist up the prototype chain,
  83              && Object.propertyIsEnumerable.call(target, key)) // and also unsafe if they're nonenumerable.
  84  }
  85  
  86  function mergeObject(target, source, options) {
  87      var destination = {};
  88      if (options.isMergeableObject(target)) {
  89          getKeys(target).forEach(function(key) {
  90              destination[key] = cloneUnlessOtherwiseSpecified(target[key], options);
  91          });
  92      }
  93      getKeys(source).forEach(function(key) {
  94          if (propertyIsUnsafe(target, key)) {
  95              return
  96          }
  97  
  98          if (propertyIsOnObject(target, key) && options.isMergeableObject(source[key])) {
  99              destination[key] = getMergeFunction(key, options)(target[key], source[key], options);
 100          } else {
 101              destination[key] = cloneUnlessOtherwiseSpecified(source[key], options);
 102          }
 103      });
 104      return destination
 105  }
 106  
 107  function deepmerge(target, source, options) {
 108      options = options || {};
 109      options.arrayMerge = options.arrayMerge || defaultArrayMerge;
 110      options.isMergeableObject = options.isMergeableObject || isMergeableObject;
 111      // cloneUnlessOtherwiseSpecified is added to `options` so that custom arrayMerge()
 112      // implementations can use it. The caller may not replace it.
 113      options.cloneUnlessOtherwiseSpecified = cloneUnlessOtherwiseSpecified;
 114  
 115      var sourceIsArray = Array.isArray(source);
 116      var targetIsArray = Array.isArray(target);
 117      var sourceAndTargetTypesMatch = sourceIsArray === targetIsArray;
 118  
 119      if (!sourceAndTargetTypesMatch) {
 120          return cloneUnlessOtherwiseSpecified(source, options)
 121      } else if (sourceIsArray) {
 122          return options.arrayMerge(target, source, options)
 123      } else {
 124          return mergeObject(target, source, options)
 125      }
 126  }
 127  
 128  deepmerge.all = function deepmergeAll(array, options) {
 129      if (!Array.isArray(array)) {
 130          throw new Error('first argument should be an array')
 131      }
 132  
 133      return array.reduce(function(prev, next) {
 134          return deepmerge(prev, next, options)
 135      }, {})
 136  };
 137  
 138  var deepmerge_1 = deepmerge;
 139  
 140  module.exports = deepmerge_1;
 141  
 142  
 143  /***/ }),
 144  
 145  /***/ 7734:
 146  /***/ ((module) => {
 147  
 148  "use strict";
 149  
 150  
 151  // do not edit .js files directly - edit src/index.jst
 152  
 153  
 154    var envHasBigInt64Array = typeof BigInt64Array !== 'undefined';
 155  
 156  
 157  module.exports = function equal(a, b) {
 158    if (a === b) return true;
 159  
 160    if (a && b && typeof a == 'object' && typeof b == 'object') {
 161      if (a.constructor !== b.constructor) return false;
 162  
 163      var length, i, keys;
 164      if (Array.isArray(a)) {
 165        length = a.length;
 166        if (length != b.length) return false;
 167        for (i = length; i-- !== 0;)
 168          if (!equal(a[i], b[i])) return false;
 169        return true;
 170      }
 171  
 172  
 173      if ((a instanceof Map) && (b instanceof Map)) {
 174        if (a.size !== b.size) return false;
 175        for (i of a.entries())
 176          if (!b.has(i[0])) return false;
 177        for (i of a.entries())
 178          if (!equal(i[1], b.get(i[0]))) return false;
 179        return true;
 180      }
 181  
 182      if ((a instanceof Set) && (b instanceof Set)) {
 183        if (a.size !== b.size) return false;
 184        for (i of a.entries())
 185          if (!b.has(i[0])) return false;
 186        return true;
 187      }
 188  
 189      if (ArrayBuffer.isView(a) && ArrayBuffer.isView(b)) {
 190        length = a.length;
 191        if (length != b.length) return false;
 192        for (i = length; i-- !== 0;)
 193          if (a[i] !== b[i]) return false;
 194        return true;
 195      }
 196  
 197  
 198      if (a.constructor === RegExp) return a.source === b.source && a.flags === b.flags;
 199      if (a.valueOf !== Object.prototype.valueOf) return a.valueOf() === b.valueOf();
 200      if (a.toString !== Object.prototype.toString) return a.toString() === b.toString();
 201  
 202      keys = Object.keys(a);
 203      length = keys.length;
 204      if (length !== Object.keys(b).length) return false;
 205  
 206      for (i = length; i-- !== 0;)
 207        if (!Object.prototype.hasOwnProperty.call(b, keys[i])) return false;
 208  
 209      for (i = length; i-- !== 0;) {
 210        var key = keys[i];
 211  
 212        if (!equal(a[key], b[key])) return false;
 213      }
 214  
 215      return true;
 216    }
 217  
 218    // true if both NaN, false otherwise
 219    return a!==a && b!==b;
 220  };
 221  
 222  
 223  /***/ }),
 224  
 225  /***/ 8924:
 226  /***/ ((__unused_webpack_module, exports) => {
 227  
 228  // Copyright (c) 2014 Rafael Caricio. All rights reserved.
 229  // Use of this source code is governed by a BSD-style license that can be
 230  // found in the LICENSE file.
 231  
 232  var GradientParser = {};
 233  
 234  GradientParser.parse = (function() {
 235  
 236    var tokens = {
 237      linearGradient: /^(\-(webkit|o|ms|moz)\-)?(linear\-gradient)/i,
 238      repeatingLinearGradient: /^(\-(webkit|o|ms|moz)\-)?(repeating\-linear\-gradient)/i,
 239      radialGradient: /^(\-(webkit|o|ms|moz)\-)?(radial\-gradient)/i,
 240      repeatingRadialGradient: /^(\-(webkit|o|ms|moz)\-)?(repeating\-radial\-gradient)/i,
 241      sideOrCorner: /^to (left (top|bottom)|right (top|bottom)|left|right|top|bottom)/i,
 242      extentKeywords: /^(closest\-side|closest\-corner|farthest\-side|farthest\-corner|contain|cover)/,
 243      positionKeywords: /^(left|center|right|top|bottom)/i,
 244      pixelValue: /^(-?(([0-9]*\.[0-9]+)|([0-9]+\.?)))px/,
 245      percentageValue: /^(-?(([0-9]*\.[0-9]+)|([0-9]+\.?)))\%/,
 246      emValue: /^(-?(([0-9]*\.[0-9]+)|([0-9]+\.?)))em/,
 247      angleValue: /^(-?(([0-9]*\.[0-9]+)|([0-9]+\.?)))deg/,
 248      startCall: /^\(/,
 249      endCall: /^\)/,
 250      comma: /^,/,
 251      hexColor: /^\#([0-9a-fA-F]+)/,
 252      literalColor: /^([a-zA-Z]+)/,
 253      rgbColor: /^rgb/i,
 254      rgbaColor: /^rgba/i,
 255      number: /^(([0-9]*\.[0-9]+)|([0-9]+\.?))/
 256    };
 257  
 258    var input = '';
 259  
 260    function error(msg) {
 261      var err = new Error(input + ': ' + msg);
 262      err.source = input;
 263      throw err;
 264    }
 265  
 266    function getAST() {
 267      var ast = matchListDefinitions();
 268  
 269      if (input.length > 0) {
 270        error('Invalid input not EOF');
 271      }
 272  
 273      return ast;
 274    }
 275  
 276    function matchListDefinitions() {
 277      return matchListing(matchDefinition);
 278    }
 279  
 280    function matchDefinition() {
 281      return matchGradient(
 282              'linear-gradient',
 283              tokens.linearGradient,
 284              matchLinearOrientation) ||
 285  
 286            matchGradient(
 287              'repeating-linear-gradient',
 288              tokens.repeatingLinearGradient,
 289              matchLinearOrientation) ||
 290  
 291            matchGradient(
 292              'radial-gradient',
 293              tokens.radialGradient,
 294              matchListRadialOrientations) ||
 295  
 296            matchGradient(
 297              'repeating-radial-gradient',
 298              tokens.repeatingRadialGradient,
 299              matchListRadialOrientations);
 300    }
 301  
 302    function matchGradient(gradientType, pattern, orientationMatcher) {
 303      return matchCall(pattern, function(captures) {
 304  
 305        var orientation = orientationMatcher();
 306        if (orientation) {
 307          if (!scan(tokens.comma)) {
 308            error('Missing comma before color stops');
 309          }
 310        }
 311  
 312        return {
 313          type: gradientType,
 314          orientation: orientation,
 315          colorStops: matchListing(matchColorStop)
 316        };
 317      });
 318    }
 319  
 320    function matchCall(pattern, callback) {
 321      var captures = scan(pattern);
 322  
 323      if (captures) {
 324        if (!scan(tokens.startCall)) {
 325          error('Missing (');
 326        }
 327  
 328        result = callback(captures);
 329  
 330        if (!scan(tokens.endCall)) {
 331          error('Missing )');
 332        }
 333  
 334        return result;
 335      }
 336    }
 337  
 338    function matchLinearOrientation() {
 339      return matchSideOrCorner() ||
 340        matchAngle();
 341    }
 342  
 343    function matchSideOrCorner() {
 344      return match('directional', tokens.sideOrCorner, 1);
 345    }
 346  
 347    function matchAngle() {
 348      return match('angular', tokens.angleValue, 1);
 349    }
 350  
 351    function matchListRadialOrientations() {
 352      var radialOrientations,
 353          radialOrientation = matchRadialOrientation(),
 354          lookaheadCache;
 355  
 356      if (radialOrientation) {
 357        radialOrientations = [];
 358        radialOrientations.push(radialOrientation);
 359  
 360        lookaheadCache = input;
 361        if (scan(tokens.comma)) {
 362          radialOrientation = matchRadialOrientation();
 363          if (radialOrientation) {
 364            radialOrientations.push(radialOrientation);
 365          } else {
 366            input = lookaheadCache;
 367          }
 368        }
 369      }
 370  
 371      return radialOrientations;
 372    }
 373  
 374    function matchRadialOrientation() {
 375      var radialType = matchCircle() ||
 376        matchEllipse();
 377  
 378      if (radialType) {
 379        radialType.at = matchAtPosition();
 380      } else {
 381        var defaultPosition = matchPositioning();
 382        if (defaultPosition) {
 383          radialType = {
 384            type: 'default-radial',
 385            at: defaultPosition
 386          };
 387        }
 388      }
 389  
 390      return radialType;
 391    }
 392  
 393    function matchCircle() {
 394      var circle = match('shape', /^(circle)/i, 0);
 395  
 396      if (circle) {
 397        circle.style = matchLength() || matchExtentKeyword();
 398      }
 399  
 400      return circle;
 401    }
 402  
 403    function matchEllipse() {
 404      var ellipse = match('shape', /^(ellipse)/i, 0);
 405  
 406      if (ellipse) {
 407        ellipse.style =  matchDistance() || matchExtentKeyword();
 408      }
 409  
 410      return ellipse;
 411    }
 412  
 413    function matchExtentKeyword() {
 414      return match('extent-keyword', tokens.extentKeywords, 1);
 415    }
 416  
 417    function matchAtPosition() {
 418      if (match('position', /^at/, 0)) {
 419        var positioning = matchPositioning();
 420  
 421        if (!positioning) {
 422          error('Missing positioning value');
 423        }
 424  
 425        return positioning;
 426      }
 427    }
 428  
 429    function matchPositioning() {
 430      var location = matchCoordinates();
 431  
 432      if (location.x || location.y) {
 433        return {
 434          type: 'position',
 435          value: location
 436        };
 437      }
 438    }
 439  
 440    function matchCoordinates() {
 441      return {
 442        x: matchDistance(),
 443        y: matchDistance()
 444      };
 445    }
 446  
 447    function matchListing(matcher) {
 448      var captures = matcher(),
 449        result = [];
 450  
 451      if (captures) {
 452        result.push(captures);
 453        while (scan(tokens.comma)) {
 454          captures = matcher();
 455          if (captures) {
 456            result.push(captures);
 457          } else {
 458            error('One extra comma');
 459          }
 460        }
 461      }
 462  
 463      return result;
 464    }
 465  
 466    function matchColorStop() {
 467      var color = matchColor();
 468  
 469      if (!color) {
 470        error('Expected color definition');
 471      }
 472  
 473      color.length = matchDistance();
 474      return color;
 475    }
 476  
 477    function matchColor() {
 478      return matchHexColor() ||
 479        matchRGBAColor() ||
 480        matchRGBColor() ||
 481        matchLiteralColor();
 482    }
 483  
 484    function matchLiteralColor() {
 485      return match('literal', tokens.literalColor, 0);
 486    }
 487  
 488    function matchHexColor() {
 489      return match('hex', tokens.hexColor, 1);
 490    }
 491  
 492    function matchRGBColor() {
 493      return matchCall(tokens.rgbColor, function() {
 494        return  {
 495          type: 'rgb',
 496          value: matchListing(matchNumber)
 497        };
 498      });
 499    }
 500  
 501    function matchRGBAColor() {
 502      return matchCall(tokens.rgbaColor, function() {
 503        return  {
 504          type: 'rgba',
 505          value: matchListing(matchNumber)
 506        };
 507      });
 508    }
 509  
 510    function matchNumber() {
 511      return scan(tokens.number)[1];
 512    }
 513  
 514    function matchDistance() {
 515      return match('%', tokens.percentageValue, 1) ||
 516        matchPositionKeyword() ||
 517        matchLength();
 518    }
 519  
 520    function matchPositionKeyword() {
 521      return match('position-keyword', tokens.positionKeywords, 1);
 522    }
 523  
 524    function matchLength() {
 525      return match('px', tokens.pixelValue, 1) ||
 526        match('em', tokens.emValue, 1);
 527    }
 528  
 529    function match(type, pattern, captureIndex) {
 530      var captures = scan(pattern);
 531      if (captures) {
 532        return {
 533          type: type,
 534          value: captures[captureIndex]
 535        };
 536      }
 537    }
 538  
 539    function scan(regexp) {
 540      var captures,
 541          blankCaptures;
 542  
 543      blankCaptures = /^[\n\r\t\s]+/.exec(input);
 544      if (blankCaptures) {
 545          consume(blankCaptures[0].length);
 546      }
 547  
 548      captures = regexp.exec(input);
 549      if (captures) {
 550          consume(captures[0].length);
 551      }
 552  
 553      return captures;
 554    }
 555  
 556    function consume(size) {
 557      input = input.substr(size);
 558    }
 559  
 560    return function(code) {
 561      input = code.toString();
 562      return getAST();
 563    };
 564  })();
 565  
 566  exports.parse = (GradientParser || {}).parse;
 567  
 568  
 569  /***/ }),
 570  
 571  /***/ 9664:
 572  /***/ ((module) => {
 573  
 574  module.exports =
 575  /******/ (function(modules) { // webpackBootstrap
 576  /******/     // The module cache
 577  /******/     var installedModules = {};
 578  /******/
 579  /******/     // The require function
 580  /******/ 	function __nested_webpack_require_187__(moduleId) {
 581  /******/
 582  /******/         // Check if module is in cache
 583  /******/         if(installedModules[moduleId])
 584  /******/             return installedModules[moduleId].exports;
 585  /******/
 586  /******/         // Create a new module (and put it into the cache)
 587  /******/         var module = installedModules[moduleId] = {
 588  /******/             exports: {},
 589  /******/             id: moduleId,
 590  /******/             loaded: false
 591  /******/         };
 592  /******/
 593  /******/         // Execute the module function
 594  /******/         modules[moduleId].call(module.exports, module, module.exports, __nested_webpack_require_187__);
 595  /******/
 596  /******/         // Flag the module as loaded
 597  /******/         module.loaded = true;
 598  /******/
 599  /******/         // Return the exports of the module
 600  /******/         return module.exports;
 601  /******/     }
 602  /******/
 603  /******/
 604  /******/     // expose the modules object (__webpack_modules__)
 605  /******/     __nested_webpack_require_187__.m = modules;
 606  /******/
 607  /******/     // expose the module cache
 608  /******/     __nested_webpack_require_187__.c = installedModules;
 609  /******/
 610  /******/     // __webpack_public_path__
 611  /******/     __nested_webpack_require_187__.p = "";
 612  /******/
 613  /******/     // Load entry module and return exports
 614  /******/     return __nested_webpack_require_187__(0);
 615  /******/ })
 616  /************************************************************************/
 617  /******/ ([
 618  /* 0 */
 619  /***/ (function(module, exports, __nested_webpack_require_1468__) {
 620  
 621      module.exports = __nested_webpack_require_1468__(1);
 622  
 623  
 624  /***/ }),
 625  /* 1 */
 626  /***/ (function(module, exports, __nested_webpack_require_1587__) {
 627  
 628      'use strict';
 629      
 630      Object.defineProperty(exports, "__esModule", {
 631        value: true
 632      });
 633      
 634      var _utils = __nested_webpack_require_1587__(2);
 635      
 636      Object.defineProperty(exports, 'combineChunks', {
 637        enumerable: true,
 638        get: function get() {
 639          return _utils.combineChunks;
 640        }
 641      });
 642      Object.defineProperty(exports, 'fillInChunks', {
 643        enumerable: true,
 644        get: function get() {
 645          return _utils.fillInChunks;
 646        }
 647      });
 648      Object.defineProperty(exports, 'findAll', {
 649        enumerable: true,
 650        get: function get() {
 651          return _utils.findAll;
 652        }
 653      });
 654      Object.defineProperty(exports, 'findChunks', {
 655        enumerable: true,
 656        get: function get() {
 657          return _utils.findChunks;
 658        }
 659      });
 660  
 661  /***/ }),
 662  /* 2 */
 663  /***/ (function(module, exports) {
 664  
 665      'use strict';
 666      
 667      Object.defineProperty(exports, "__esModule", {
 668        value: true
 669      });
 670      
 671      
 672      /**
 673       * Creates an array of chunk objects representing both higlightable and non highlightable pieces of text that match each search word.
 674       * @return Array of "chunks" (where a Chunk is { start:number, end:number, highlight:boolean })
 675       */
 676      var findAll = exports.findAll = function findAll(_ref) {
 677        var autoEscape = _ref.autoEscape,
 678            _ref$caseSensitive = _ref.caseSensitive,
 679            caseSensitive = _ref$caseSensitive === undefined ? false : _ref$caseSensitive,
 680            _ref$findChunks = _ref.findChunks,
 681            findChunks = _ref$findChunks === undefined ? defaultFindChunks : _ref$findChunks,
 682            sanitize = _ref.sanitize,
 683            searchWords = _ref.searchWords,
 684            textToHighlight = _ref.textToHighlight;
 685        return fillInChunks({
 686          chunksToHighlight: combineChunks({
 687            chunks: findChunks({
 688              autoEscape: autoEscape,
 689              caseSensitive: caseSensitive,
 690              sanitize: sanitize,
 691              searchWords: searchWords,
 692              textToHighlight: textToHighlight
 693            })
 694          }),
 695          totalLength: textToHighlight ? textToHighlight.length : 0
 696        });
 697      };
 698      
 699      /**
 700       * Takes an array of {start:number, end:number} objects and combines chunks that overlap into single chunks.
 701       * @return {start:number, end:number}[]
 702       */
 703      
 704      
 705      var combineChunks = exports.combineChunks = function combineChunks(_ref2) {
 706        var chunks = _ref2.chunks;
 707      
 708        chunks = chunks.sort(function (first, second) {
 709          return first.start - second.start;
 710        }).reduce(function (processedChunks, nextChunk) {
 711          // First chunk just goes straight in the array...
 712          if (processedChunks.length === 0) {
 713            return [nextChunk];
 714          } else {
 715            // ... subsequent chunks get checked to see if they overlap...
 716            var prevChunk = processedChunks.pop();
 717            if (nextChunk.start <= prevChunk.end) {
 718              // It may be the case that prevChunk completely surrounds nextChunk, so take the
 719              // largest of the end indeces.
 720              var endIndex = Math.max(prevChunk.end, nextChunk.end);
 721              processedChunks.push({ highlight: false, start: prevChunk.start, end: endIndex });
 722            } else {
 723              processedChunks.push(prevChunk, nextChunk);
 724            }
 725            return processedChunks;
 726          }
 727        }, []);
 728      
 729        return chunks;
 730      };
 731      
 732      /**
 733       * Examine text for any matches.
 734       * If we find matches, add them to the returned array as a "chunk" object ({start:number, end:number}).
 735       * @return {start:number, end:number}[]
 736       */
 737      var defaultFindChunks = function defaultFindChunks(_ref3) {
 738        var autoEscape = _ref3.autoEscape,
 739            caseSensitive = _ref3.caseSensitive,
 740            _ref3$sanitize = _ref3.sanitize,
 741            sanitize = _ref3$sanitize === undefined ? defaultSanitize : _ref3$sanitize,
 742            searchWords = _ref3.searchWords,
 743            textToHighlight = _ref3.textToHighlight;
 744      
 745        textToHighlight = sanitize(textToHighlight);
 746      
 747        return searchWords.filter(function (searchWord) {
 748          return searchWord;
 749        }) // Remove empty words
 750        .reduce(function (chunks, searchWord) {
 751          searchWord = sanitize(searchWord);
 752      
 753          if (autoEscape) {
 754            searchWord = escapeRegExpFn(searchWord);
 755          }
 756      
 757          var regex = new RegExp(searchWord, caseSensitive ? 'g' : 'gi');
 758      
 759          var match = void 0;
 760          while (match = regex.exec(textToHighlight)) {
 761            var _start = match.index;
 762            var _end = regex.lastIndex;
 763            // We do not return zero-length matches
 764            if (_end > _start) {
 765              chunks.push({ highlight: false, start: _start, end: _end });
 766            }
 767      
 768            // Prevent browsers like Firefox from getting stuck in an infinite loop
 769            // See http://www.regexguru.com/2008/04/watch-out-for-zero-length-matches/
 770            if (match.index === regex.lastIndex) {
 771              regex.lastIndex++;
 772            }
 773          }
 774      
 775          return chunks;
 776        }, []);
 777      };
 778      // Allow the findChunks to be overridden in findAll,
 779      // but for backwards compatibility we export as the old name
 780      exports.findChunks = defaultFindChunks;
 781      
 782      /**
 783       * Given a set of chunks to highlight, create an additional set of chunks
 784       * to represent the bits of text between the highlighted text.
 785       * @param chunksToHighlight {start:number, end:number}[]
 786       * @param totalLength number
 787       * @return {start:number, end:number, highlight:boolean}[]
 788       */
 789      
 790      var fillInChunks = exports.fillInChunks = function fillInChunks(_ref4) {
 791        var chunksToHighlight = _ref4.chunksToHighlight,
 792            totalLength = _ref4.totalLength;
 793      
 794        var allChunks = [];
 795        var append = function append(start, end, highlight) {
 796          if (end - start > 0) {
 797            allChunks.push({
 798              start: start,
 799              end: end,
 800              highlight: highlight
 801            });
 802          }
 803        };
 804      
 805        if (chunksToHighlight.length === 0) {
 806          append(0, totalLength, false);
 807        } else {
 808          var lastIndex = 0;
 809          chunksToHighlight.forEach(function (chunk) {
 810            append(lastIndex, chunk.start, false);
 811            append(chunk.start, chunk.end, true);
 812            lastIndex = chunk.end;
 813          });
 814          append(lastIndex, totalLength, false);
 815        }
 816        return allChunks;
 817      };
 818      
 819  	function defaultSanitize(string) {
 820        return string;
 821      }
 822      
 823  	function escapeRegExpFn(string) {
 824        return string.replace(/[\-\[\]\/\{\}\(\)\*\+\?\.\\\^\$\|]/g, '\\$&');
 825      }
 826  
 827  /***/ })
 828  /******/ ]);
 829  
 830  
 831  /***/ }),
 832  
 833  /***/ 1880:
 834  /***/ ((module, __unused_webpack_exports, __webpack_require__) => {
 835  
 836  "use strict";
 837  
 838  
 839  var reactIs = __webpack_require__(1178);
 840  
 841  /**
 842   * Copyright 2015, Yahoo! Inc.
 843   * Copyrights licensed under the New BSD License. See the accompanying LICENSE file for terms.
 844   */
 845  var REACT_STATICS = {
 846    childContextTypes: true,
 847    contextType: true,
 848    contextTypes: true,
 849    defaultProps: true,
 850    displayName: true,
 851    getDefaultProps: true,
 852    getDerivedStateFromError: true,
 853    getDerivedStateFromProps: true,
 854    mixins: true,
 855    propTypes: true,
 856    type: true
 857  };
 858  var KNOWN_STATICS = {
 859    name: true,
 860    length: true,
 861    prototype: true,
 862    caller: true,
 863    callee: true,
 864    arguments: true,
 865    arity: true
 866  };
 867  var FORWARD_REF_STATICS = {
 868    '$$typeof': true,
 869    render: true,
 870    defaultProps: true,
 871    displayName: true,
 872    propTypes: true
 873  };
 874  var MEMO_STATICS = {
 875    '$$typeof': true,
 876    compare: true,
 877    defaultProps: true,
 878    displayName: true,
 879    propTypes: true,
 880    type: true
 881  };
 882  var TYPE_STATICS = {};
 883  TYPE_STATICS[reactIs.ForwardRef] = FORWARD_REF_STATICS;
 884  TYPE_STATICS[reactIs.Memo] = MEMO_STATICS;
 885  
 886  function getStatics(component) {
 887    // React v16.11 and below
 888    if (reactIs.isMemo(component)) {
 889      return MEMO_STATICS;
 890    } // React v16.12 and above
 891  
 892  
 893    return TYPE_STATICS[component['$$typeof']] || REACT_STATICS;
 894  }
 895  
 896  var defineProperty = Object.defineProperty;
 897  var getOwnPropertyNames = Object.getOwnPropertyNames;
 898  var getOwnPropertySymbols = Object.getOwnPropertySymbols;
 899  var getOwnPropertyDescriptor = Object.getOwnPropertyDescriptor;
 900  var getPrototypeOf = Object.getPrototypeOf;
 901  var objectPrototype = Object.prototype;
 902  function hoistNonReactStatics(targetComponent, sourceComponent, blacklist) {
 903    if (typeof sourceComponent !== 'string') {
 904      // don't hoist over string (html) components
 905      if (objectPrototype) {
 906        var inheritedComponent = getPrototypeOf(sourceComponent);
 907  
 908        if (inheritedComponent && inheritedComponent !== objectPrototype) {
 909          hoistNonReactStatics(targetComponent, inheritedComponent, blacklist);
 910        }
 911      }
 912  
 913      var keys = getOwnPropertyNames(sourceComponent);
 914  
 915      if (getOwnPropertySymbols) {
 916        keys = keys.concat(getOwnPropertySymbols(sourceComponent));
 917      }
 918  
 919      var targetStatics = getStatics(targetComponent);
 920      var sourceStatics = getStatics(sourceComponent);
 921  
 922      for (var i = 0; i < keys.length; ++i) {
 923        var key = keys[i];
 924  
 925        if (!KNOWN_STATICS[key] && !(blacklist && blacklist[key]) && !(sourceStatics && sourceStatics[key]) && !(targetStatics && targetStatics[key])) {
 926          var descriptor = getOwnPropertyDescriptor(sourceComponent, key);
 927  
 928          try {
 929            // Avoid failures from read-only properties
 930            defineProperty(targetComponent, key, descriptor);
 931          } catch (e) {}
 932        }
 933      }
 934    }
 935  
 936    return targetComponent;
 937  }
 938  
 939  module.exports = hoistNonReactStatics;
 940  
 941  
 942  /***/ }),
 943  
 944  /***/ 2950:
 945  /***/ ((__unused_webpack_module, exports) => {
 946  
 947  "use strict";
 948  /** @license React v16.13.1
 949   * react-is.production.min.js
 950   *
 951   * Copyright (c) Facebook, Inc. and its affiliates.
 952   *
 953   * This source code is licensed under the MIT license found in the
 954   * LICENSE file in the root directory of this source tree.
 955   */
 956  
 957  var b="function"===typeof Symbol&&Symbol.for,c=b?Symbol.for("react.element"):60103,d=b?Symbol.for("react.portal"):60106,e=b?Symbol.for("react.fragment"):60107,f=b?Symbol.for("react.strict_mode"):60108,g=b?Symbol.for("react.profiler"):60114,h=b?Symbol.for("react.provider"):60109,k=b?Symbol.for("react.context"):60110,l=b?Symbol.for("react.async_mode"):60111,m=b?Symbol.for("react.concurrent_mode"):60111,n=b?Symbol.for("react.forward_ref"):60112,p=b?Symbol.for("react.suspense"):60113,q=b?
 958  Symbol.for("react.suspense_list"):60120,r=b?Symbol.for("react.memo"):60115,t=b?Symbol.for("react.lazy"):60116,v=b?Symbol.for("react.block"):60121,w=b?Symbol.for("react.fundamental"):60117,x=b?Symbol.for("react.responder"):60118,y=b?Symbol.for("react.scope"):60119;
 959  function z(a){if("object"===typeof a&&null!==a){var u=a.$$typeof;switch(u){case c:switch(a=a.type,a){case l:case m:case e:case g:case f:case p:return a;default:switch(a=a&&a.$$typeof,a){case k:case n:case t:case r:case h:return a;default:return u}}case d:return u}}}function A(a){return z(a)===m}exports.AsyncMode=l;exports.ConcurrentMode=m;exports.ContextConsumer=k;exports.ContextProvider=h;exports.Element=c;exports.ForwardRef=n;exports.Fragment=e;exports.Lazy=t;exports.Memo=r;exports.Portal=d;
 960  exports.Profiler=g;exports.StrictMode=f;exports.Suspense=p;exports.isAsyncMode=function(a){return A(a)||z(a)===l};exports.isConcurrentMode=A;exports.isContextConsumer=function(a){return z(a)===k};exports.isContextProvider=function(a){return z(a)===h};exports.isElement=function(a){return"object"===typeof a&&null!==a&&a.$$typeof===c};exports.isForwardRef=function(a){return z(a)===n};exports.isFragment=function(a){return z(a)===e};exports.isLazy=function(a){return z(a)===t};
 961  exports.isMemo=function(a){return z(a)===r};exports.isPortal=function(a){return z(a)===d};exports.isProfiler=function(a){return z(a)===g};exports.isStrictMode=function(a){return z(a)===f};exports.isSuspense=function(a){return z(a)===p};
 962  exports.isValidElementType=function(a){return"string"===typeof a||"function"===typeof a||a===e||a===m||a===g||a===f||a===p||a===q||"object"===typeof a&&null!==a&&(a.$$typeof===t||a.$$typeof===r||a.$$typeof===h||a.$$typeof===k||a.$$typeof===n||a.$$typeof===w||a.$$typeof===x||a.$$typeof===y||a.$$typeof===v)};exports.typeOf=z;
 963  
 964  
 965  /***/ }),
 966  
 967  /***/ 1178:
 968  /***/ ((module, __unused_webpack_exports, __webpack_require__) => {
 969  
 970  "use strict";
 971  
 972  
 973  if (true) {
 974    module.exports = __webpack_require__(2950);
 975  } else {}
 976  
 977  
 978  /***/ }),
 979  
 980  /***/ 9681:
 981  /***/ ((module) => {
 982  
 983  var characterMap = {
 984      "À": "A",
 985      "Á": "A",
 986      "Â": "A",
 987      "Ã": "A",
 988      "Ä": "A",
 989      "Å": "A",
 990      "Ấ": "A",
 991      "Ắ": "A",
 992      "Ẳ": "A",
 993      "Ẵ": "A",
 994      "Ặ": "A",
 995      "Æ": "AE",
 996      "Ầ": "A",
 997      "Ằ": "A",
 998      "Ȃ": "A",
 999      "Ả": "A",
1000      "Ạ": "A",
1001      "Ẩ": "A",
1002      "Ẫ": "A",
1003      "Ậ": "A",
1004      "Ç": "C",
1005      "Ḉ": "C",
1006      "È": "E",
1007      "É": "E",
1008      "Ê": "E",
1009      "Ë": "E",
1010      "Ế": "E",
1011      "Ḗ": "E",
1012      "Ề": "E",
1013      "Ḕ": "E",
1014      "Ḝ": "E",
1015      "Ȇ": "E",
1016      "Ẻ": "E",
1017      "Ẽ": "E",
1018      "Ẹ": "E",
1019      "Ể": "E",
1020      "Ễ": "E",
1021      "Ệ": "E",
1022      "Ì": "I",
1023      "Í": "I",
1024      "Î": "I",
1025      "Ï": "I",
1026      "Ḯ": "I",
1027      "Ȋ": "I",
1028      "Ỉ": "I",
1029      "Ị": "I",
1030      "Ð": "D",
1031      "Ñ": "N",
1032      "Ò": "O",
1033      "Ó": "O",
1034      "Ô": "O",
1035      "Õ": "O",
1036      "Ö": "O",
1037      "Ø": "O",
1038      "Ố": "O",
1039      "Ṍ": "O",
1040      "Ṓ": "O",
1041      "Ȏ": "O",
1042      "Ỏ": "O",
1043      "Ọ": "O",
1044      "Ổ": "O",
1045      "Ỗ": "O",
1046      "Ộ": "O",
1047      "Ờ": "O",
1048      "Ở": "O",
1049      "Ỡ": "O",
1050      "Ớ": "O",
1051      "Ợ": "O",
1052      "Ù": "U",
1053      "Ú": "U",
1054      "Û": "U",
1055      "Ü": "U",
1056      "Ủ": "U",
1057      "Ụ": "U",
1058      "Ử": "U",
1059      "Ữ": "U",
1060      "Ự": "U",
1061      "Ý": "Y",
1062      "à": "a",
1063      "á": "a",
1064      "â": "a",
1065      "ã": "a",
1066      "ä": "a",
1067      "å": "a",
1068      "ấ": "a",
1069      "ắ": "a",
1070      "ẳ": "a",
1071      "ẵ": "a",
1072      "ặ": "a",
1073      "æ": "ae",
1074      "ầ": "a",
1075      "ằ": "a",
1076      "ȃ": "a",
1077      "ả": "a",
1078      "ạ": "a",
1079      "ẩ": "a",
1080      "ẫ": "a",
1081      "ậ": "a",
1082      "ç": "c",
1083      "ḉ": "c",
1084      "è": "e",
1085      "é": "e",
1086      "ê": "e",
1087      "ë": "e",
1088      "ế": "e",
1089      "ḗ": "e",
1090      "ề": "e",
1091      "ḕ": "e",
1092      "ḝ": "e",
1093      "ȇ": "e",
1094      "ẻ": "e",
1095      "ẽ": "e",
1096      "ẹ": "e",
1097      "ể": "e",
1098      "ễ": "e",
1099      "ệ": "e",
1100      "ì": "i",
1101      "í": "i",
1102      "î": "i",
1103      "ï": "i",
1104      "ḯ": "i",
1105      "ȋ": "i",
1106      "ỉ": "i",
1107      "ị": "i",
1108      "ð": "d",
1109      "ñ": "n",
1110      "ò": "o",
1111      "ó": "o",
1112      "ô": "o",
1113      "õ": "o",
1114      "ö": "o",
1115      "ø": "o",
1116      "ố": "o",
1117      "ṍ": "o",
1118      "ṓ": "o",
1119      "ȏ": "o",
1120      "ỏ": "o",
1121      "ọ": "o",
1122      "ổ": "o",
1123      "ỗ": "o",
1124      "ộ": "o",
1125      "ờ": "o",
1126      "ở": "o",
1127      "ỡ": "o",
1128      "ớ": "o",
1129      "ợ": "o",
1130      "ù": "u",
1131      "ú": "u",
1132      "û": "u",
1133      "ü": "u",
1134      "ủ": "u",
1135      "ụ": "u",
1136      "ử": "u",
1137      "ữ": "u",
1138      "ự": "u",
1139      "ý": "y",
1140      "ÿ": "y",
1141      "Ā": "A",
1142      "ā": "a",
1143      "Ă": "A",
1144      "ă": "a",
1145      "Ą": "A",
1146      "ą": "a",
1147      "Ć": "C",
1148      "ć": "c",
1149      "Ĉ": "C",
1150      "ĉ": "c",
1151      "Ċ": "C",
1152      "ċ": "c",
1153      "Č": "C",
1154      "č": "c",
1155      "C̆": "C",
1156      "c̆": "c",
1157      "Ď": "D",
1158      "ď": "d",
1159      "Đ": "D",
1160      "đ": "d",
1161      "Ē": "E",
1162      "ē": "e",
1163      "Ĕ": "E",
1164      "ĕ": "e",
1165      "Ė": "E",
1166      "ė": "e",
1167      "Ę": "E",
1168      "ę": "e",
1169      "Ě": "E",
1170      "ě": "e",
1171      "Ĝ": "G",
1172      "Ǵ": "G",
1173      "ĝ": "g",
1174      "ǵ": "g",
1175      "Ğ": "G",
1176      "ğ": "g",
1177      "Ġ": "G",
1178      "ġ": "g",
1179      "Ģ": "G",
1180      "ģ": "g",
1181      "Ĥ": "H",
1182      "ĥ": "h",
1183      "Ħ": "H",
1184      "ħ": "h",
1185      "Ḫ": "H",
1186      "ḫ": "h",
1187      "Ĩ": "I",
1188      "ĩ": "i",
1189      "Ī": "I",
1190      "ī": "i",
1191      "Ĭ": "I",
1192      "ĭ": "i",
1193      "Į": "I",
1194      "į": "i",
1195      "İ": "I",
1196      "ı": "i",
1197      "IJ": "IJ",
1198      "ij": "ij",
1199      "Ĵ": "J",
1200      "ĵ": "j",
1201      "Ķ": "K",
1202      "ķ": "k",
1203      "Ḱ": "K",
1204      "ḱ": "k",
1205      "K̆": "K",
1206      "k̆": "k",
1207      "Ĺ": "L",
1208      "ĺ": "l",
1209      "Ļ": "L",
1210      "ļ": "l",
1211      "Ľ": "L",
1212      "ľ": "l",
1213      "Ŀ": "L",
1214      "ŀ": "l",
1215      "Ł": "l",
1216      "ł": "l",
1217      "Ḿ": "M",
1218      "ḿ": "m",
1219      "M̆": "M",
1220      "m̆": "m",
1221      "Ń": "N",
1222      "ń": "n",
1223      "Ņ": "N",
1224      "ņ": "n",
1225      "Ň": "N",
1226      "ň": "n",
1227      "ʼn": "n",
1228      "N̆": "N",
1229      "n̆": "n",
1230      "Ō": "O",
1231      "ō": "o",
1232      "Ŏ": "O",
1233      "ŏ": "o",
1234      "Ő": "O",
1235      "ő": "o",
1236      "Œ": "OE",
1237      "œ": "oe",
1238      "P̆": "P",
1239      "p̆": "p",
1240      "Ŕ": "R",
1241      "ŕ": "r",
1242      "Ŗ": "R",
1243      "ŗ": "r",
1244      "Ř": "R",
1245      "ř": "r",
1246      "R̆": "R",
1247      "r̆": "r",
1248      "Ȓ": "R",
1249      "ȓ": "r",
1250      "Ś": "S",
1251      "ś": "s",
1252      "Ŝ": "S",
1253      "ŝ": "s",
1254      "Ş": "S",
1255      "Ș": "S",
1256      "ș": "s",
1257      "ş": "s",
1258      "Š": "S",
1259      "š": "s",
1260      "Ţ": "T",
1261      "ţ": "t",
1262      "ț": "t",
1263      "Ț": "T",
1264      "Ť": "T",
1265      "ť": "t",
1266      "Ŧ": "T",
1267      "ŧ": "t",
1268      "T̆": "T",
1269      "t̆": "t",
1270      "Ũ": "U",
1271      "ũ": "u",
1272      "Ū": "U",
1273      "ū": "u",
1274      "Ŭ": "U",
1275      "ŭ": "u",
1276      "Ů": "U",
1277      "ů": "u",
1278      "Ű": "U",
1279      "ű": "u",
1280      "Ų": "U",
1281      "ų": "u",
1282      "Ȗ": "U",
1283      "ȗ": "u",
1284      "V̆": "V",
1285      "v̆": "v",
1286      "Ŵ": "W",
1287      "ŵ": "w",
1288      "Ẃ": "W",
1289      "ẃ": "w",
1290      "X̆": "X",
1291      "x̆": "x",
1292      "Ŷ": "Y",
1293      "ŷ": "y",
1294      "Ÿ": "Y",
1295      "Y̆": "Y",
1296      "y̆": "y",
1297      "Ź": "Z",
1298      "ź": "z",
1299      "Ż": "Z",
1300      "ż": "z",
1301      "Ž": "Z",
1302      "ž": "z",
1303      "ſ": "s",
1304      "ƒ": "f",
1305      "Ơ": "O",
1306      "ơ": "o",
1307      "Ư": "U",
1308      "ư": "u",
1309      "Ǎ": "A",
1310      "ǎ": "a",
1311      "Ǐ": "I",
1312      "ǐ": "i",
1313      "Ǒ": "O",
1314      "ǒ": "o",
1315      "Ǔ": "U",
1316      "ǔ": "u",
1317      "Ǖ": "U",
1318      "ǖ": "u",
1319      "Ǘ": "U",
1320      "ǘ": "u",
1321      "Ǚ": "U",
1322      "ǚ": "u",
1323      "Ǜ": "U",
1324      "ǜ": "u",
1325      "Ứ": "U",
1326      "ứ": "u",
1327      "Ṹ": "U",
1328      "ṹ": "u",
1329      "Ǻ": "A",
1330      "ǻ": "a",
1331      "Ǽ": "AE",
1332      "ǽ": "ae",
1333      "Ǿ": "O",
1334      "ǿ": "o",
1335      "Þ": "TH",
1336      "þ": "th",
1337      "Ṕ": "P",
1338      "ṕ": "p",
1339      "Ṥ": "S",
1340      "ṥ": "s",
1341      "X́": "X",
1342      "x́": "x",
1343      "Ѓ": "Г",
1344      "ѓ": "г",
1345      "Ќ": "К",
1346      "ќ": "к",
1347      "A̋": "A",
1348      "a̋": "a",
1349      "E̋": "E",
1350      "e̋": "e",
1351      "I̋": "I",
1352      "i̋": "i",
1353      "Ǹ": "N",
1354      "ǹ": "n",
1355      "Ồ": "O",
1356      "ồ": "o",
1357      "Ṑ": "O",
1358      "ṑ": "o",
1359      "Ừ": "U",
1360      "ừ": "u",
1361      "Ẁ": "W",
1362      "ẁ": "w",
1363      "Ỳ": "Y",
1364      "ỳ": "y",
1365      "Ȁ": "A",
1366      "ȁ": "a",
1367      "Ȅ": "E",
1368      "ȅ": "e",
1369      "Ȉ": "I",
1370      "ȉ": "i",
1371      "Ȍ": "O",
1372      "ȍ": "o",
1373      "Ȑ": "R",
1374      "ȑ": "r",
1375      "Ȕ": "U",
1376      "ȕ": "u",
1377      "B̌": "B",
1378      "b̌": "b",
1379      "Č̣": "C",
1380      "č̣": "c",
1381      "Ê̌": "E",
1382      "ê̌": "e",
1383      "F̌": "F",
1384      "f̌": "f",
1385      "Ǧ": "G",
1386      "ǧ": "g",
1387      "Ȟ": "H",
1388      "ȟ": "h",
1389      "J̌": "J",
1390      "ǰ": "j",
1391      "Ǩ": "K",
1392      "ǩ": "k",
1393      "M̌": "M",
1394      "m̌": "m",
1395      "P̌": "P",
1396      "p̌": "p",
1397      "Q̌": "Q",
1398      "q̌": "q",
1399      "Ř̩": "R",
1400      "ř̩": "r",
1401      "Ṧ": "S",
1402      "ṧ": "s",
1403      "V̌": "V",
1404      "v̌": "v",
1405      "W̌": "W",
1406      "w̌": "w",
1407      "X̌": "X",
1408      "x̌": "x",
1409      "Y̌": "Y",
1410      "y̌": "y",
1411      "A̧": "A",
1412      "a̧": "a",
1413      "B̧": "B",
1414      "b̧": "b",
1415      "Ḑ": "D",
1416      "ḑ": "d",
1417      "Ȩ": "E",
1418      "ȩ": "e",
1419      "Ɛ̧": "E",
1420      "ɛ̧": "e",
1421      "Ḩ": "H",
1422      "ḩ": "h",
1423      "I̧": "I",
1424      "i̧": "i",
1425      "Ɨ̧": "I",
1426      "ɨ̧": "i",
1427      "M̧": "M",
1428      "m̧": "m",
1429      "O̧": "O",
1430      "o̧": "o",
1431      "Q̧": "Q",
1432      "q̧": "q",
1433      "U̧": "U",
1434      "u̧": "u",
1435      "X̧": "X",
1436      "x̧": "x",
1437      "Z̧": "Z",
1438      "z̧": "z",
1439      "й":"и",
1440      "Й":"И",
1441      "ё":"е",
1442      "Ё":"Е",
1443  };
1444  
1445  var chars = Object.keys(characterMap).join('|');
1446  var allAccents = new RegExp(chars, 'g');
1447  var firstAccent = new RegExp(chars, '');
1448  
1449  function matcher(match) {
1450      return characterMap[match];
1451  }
1452  
1453  var removeAccents = function(string) {
1454      return string.replace(allAccents, matcher);
1455  };
1456  
1457  var hasAccents = function(string) {
1458      return !!string.match(firstAccent);
1459  };
1460  
1461  module.exports = removeAccents;
1462  module.exports.has = hasAccents;
1463  module.exports.remove = removeAccents;
1464  
1465  
1466  /***/ }),
1467  
1468  /***/ 8477:
1469  /***/ ((__unused_webpack_module, exports, __webpack_require__) => {
1470  
1471  "use strict";
1472  /**
1473   * @license React
1474   * use-sync-external-store-shim.production.min.js
1475   *
1476   * Copyright (c) Facebook, Inc. and its affiliates.
1477   *
1478   * This source code is licensed under the MIT license found in the
1479   * LICENSE file in the root directory of this source tree.
1480   */
1481  var e=__webpack_require__(1609);function h(a,b){return a===b&&(0!==a||1/a===1/b)||a!==a&&b!==b}var k="function"===typeof Object.is?Object.is:h,l=e.useState,m=e.useEffect,n=e.useLayoutEffect,p=e.useDebugValue;function q(a,b){var d=b(),f=l({inst:{value:d,getSnapshot:b}}),c=f[0].inst,g=f[1];n(function(){c.value=d;c.getSnapshot=b;r(c)&&g({inst:c})},[a,d,b]);m(function(){r(c)&&g({inst:c});return a(function(){r(c)&&g({inst:c})})},[a]);p(d);return d}
1482  function r(a){var b=a.getSnapshot;a=a.value;try{var d=b();return!k(a,d)}catch(f){return!0}}function t(a,b){return b()}var u="undefined"===typeof window||"undefined"===typeof window.document||"undefined"===typeof window.document.createElement?t:q;exports.useSyncExternalStore=void 0!==e.useSyncExternalStore?e.useSyncExternalStore:u;
1483  
1484  
1485  /***/ }),
1486  
1487  /***/ 422:
1488  /***/ ((module, __unused_webpack_exports, __webpack_require__) => {
1489  
1490  "use strict";
1491  
1492  
1493  if (true) {
1494    module.exports = __webpack_require__(8477);
1495  } else {}
1496  
1497  
1498  /***/ }),
1499  
1500  /***/ 1609:
1501  /***/ ((module) => {
1502  
1503  "use strict";
1504  module.exports = window["React"];
1505  
1506  /***/ })
1507  
1508  /******/     });
1509  /************************************************************************/
1510  /******/     // The module cache
1511  /******/     var __webpack_module_cache__ = {};
1512  /******/     
1513  /******/     // The require function
1514  /******/ 	function __webpack_require__(moduleId) {
1515  /******/         // Check if module is in cache
1516  /******/         var cachedModule = __webpack_module_cache__[moduleId];
1517  /******/         if (cachedModule !== undefined) {
1518  /******/             return cachedModule.exports;
1519  /******/         }
1520  /******/         // Create a new module (and put it into the cache)
1521  /******/         var module = __webpack_module_cache__[moduleId] = {
1522  /******/             // no module.id needed
1523  /******/             // no module.loaded needed
1524  /******/             exports: {}
1525  /******/         };
1526  /******/     
1527  /******/         // Execute the module function
1528  /******/         __webpack_modules__[moduleId](module, module.exports, __webpack_require__);
1529  /******/     
1530  /******/         // Return the exports of the module
1531  /******/         return module.exports;
1532  /******/     }
1533  /******/     
1534  /************************************************************************/
1535  /******/     /* webpack/runtime/compat get default export */
1536  /******/     (() => {
1537  /******/         // getDefaultExport function for compatibility with non-harmony modules
1538  /******/         __webpack_require__.n = (module) => {
1539  /******/             var getter = module && module.__esModule ?
1540  /******/                 () => (module['default']) :
1541  /******/                 () => (module);
1542  /******/             __webpack_require__.d(getter, { a: getter });
1543  /******/             return getter;
1544  /******/         };
1545  /******/     })();
1546  /******/     
1547  /******/     /* webpack/runtime/create fake namespace object */
1548  /******/     (() => {
1549  /******/         var getProto = Object.getPrototypeOf ? (obj) => (Object.getPrototypeOf(obj)) : (obj) => (obj.__proto__);
1550  /******/         var leafPrototypes;
1551  /******/         // create a fake namespace object
1552  /******/         // mode & 1: value is a module id, require it
1553  /******/         // mode & 2: merge all properties of value into the ns
1554  /******/         // mode & 4: return value when already ns object
1555  /******/         // mode & 16: return value when it's Promise-like
1556  /******/         // mode & 8|1: behave like require
1557  /******/         __webpack_require__.t = function(value, mode) {
1558  /******/             if(mode & 1) value = this(value);
1559  /******/             if(mode & 8) return value;
1560  /******/             if(typeof value === 'object' && value) {
1561  /******/                 if((mode & 4) && value.__esModule) return value;
1562  /******/                 if((mode & 16) && typeof value.then === 'function') return value;
1563  /******/             }
1564  /******/             var ns = Object.create(null);
1565  /******/             __webpack_require__.r(ns);
1566  /******/             var def = {};
1567  /******/             leafPrototypes = leafPrototypes || [null, getProto({}), getProto([]), getProto(getProto)];
1568  /******/             for(var current = mode & 2 && value; typeof current == 'object' && !~leafPrototypes.indexOf(current); current = getProto(current)) {
1569  /******/                 Object.getOwnPropertyNames(current).forEach((key) => (def[key] = () => (value[key])));
1570  /******/             }
1571  /******/             def['default'] = () => (value);
1572  /******/             __webpack_require__.d(ns, def);
1573  /******/             return ns;
1574  /******/         };
1575  /******/     })();
1576  /******/     
1577  /******/     /* webpack/runtime/define property getters */
1578  /******/     (() => {
1579  /******/         // define getter functions for harmony exports
1580  /******/         __webpack_require__.d = (exports, definition) => {
1581  /******/             for(var key in definition) {
1582  /******/                 if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {
1583  /******/                     Object.defineProperty(exports, key, { enumerable: true, get: definition[key] });
1584  /******/                 }
1585  /******/             }
1586  /******/         };
1587  /******/     })();
1588  /******/     
1589  /******/     /* webpack/runtime/hasOwnProperty shorthand */
1590  /******/     (() => {
1591  /******/         __webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))
1592  /******/     })();
1593  /******/     
1594  /******/     /* webpack/runtime/make namespace object */
1595  /******/     (() => {
1596  /******/         // define __esModule on exports
1597  /******/         __webpack_require__.r = (exports) => {
1598  /******/             if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
1599  /******/                 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
1600  /******/             }
1601  /******/             Object.defineProperty(exports, '__esModule', { value: true });
1602  /******/         };
1603  /******/     })();
1604  /******/     
1605  /******/     /* webpack/runtime/nonce */
1606  /******/     (() => {
1607  /******/         __webpack_require__.nc = undefined;
1608  /******/     })();
1609  /******/     
1610  /************************************************************************/
1611  var __webpack_exports__ = {};
1612  // This entry need to be wrapped in an IIFE because it need to be in strict mode.
1613  (() => {
1614  "use strict";
1615  // ESM COMPAT FLAG
1616  __webpack_require__.r(__webpack_exports__);
1617  
1618  // EXPORTS
1619  __webpack_require__.d(__webpack_exports__, {
1620    AlignmentMatrixControl: () => (/* reexport */ alignment_matrix_control),
1621    AnglePickerControl: () => (/* reexport */ angle_picker_control),
1622    Animate: () => (/* reexport */ animate),
1623    Autocomplete: () => (/* reexport */ Autocomplete),
1624    BaseControl: () => (/* reexport */ base_control),
1625    BlockQuotation: () => (/* reexport */ external_wp_primitives_namespaceObject.BlockQuotation),
1626    Button: () => (/* reexport */ build_module_button),
1627    ButtonGroup: () => (/* reexport */ button_group),
1628    Card: () => (/* reexport */ card_component),
1629    CardBody: () => (/* reexport */ card_body_component),
1630    CardDivider: () => (/* reexport */ card_divider_component),
1631    CardFooter: () => (/* reexport */ card_footer_component),
1632    CardHeader: () => (/* reexport */ card_header_component),
1633    CardMedia: () => (/* reexport */ card_media_component),
1634    CheckboxControl: () => (/* reexport */ checkbox_control),
1635    Circle: () => (/* reexport */ external_wp_primitives_namespaceObject.Circle),
1636    ClipboardButton: () => (/* reexport */ ClipboardButton),
1637    ColorIndicator: () => (/* reexport */ color_indicator),
1638    ColorPalette: () => (/* reexport */ color_palette),
1639    ColorPicker: () => (/* reexport */ LegacyAdapter),
1640    ComboboxControl: () => (/* reexport */ combobox_control),
1641    Composite: () => (/* reexport */ Composite),
1642    CustomGradientPicker: () => (/* reexport */ custom_gradient_picker),
1643    CustomSelectControl: () => (/* reexport */ custom_select_control),
1644    Dashicon: () => (/* reexport */ dashicon),
1645    DatePicker: () => (/* reexport */ date),
1646    DateTimePicker: () => (/* reexport */ build_module_date_time),
1647    Disabled: () => (/* reexport */ disabled),
1648    Draggable: () => (/* reexport */ draggable),
1649    DropZone: () => (/* reexport */ drop_zone),
1650    DropZoneProvider: () => (/* reexport */ DropZoneProvider),
1651    Dropdown: () => (/* reexport */ dropdown),
1652    DropdownMenu: () => (/* reexport */ dropdown_menu),
1653    DuotonePicker: () => (/* reexport */ duotone_picker),
1654    DuotoneSwatch: () => (/* reexport */ duotone_swatch),
1655    ExternalLink: () => (/* reexport */ external_link),
1656    Fill: () => (/* reexport */ slot_fill_Fill),
1657    Flex: () => (/* reexport */ flex_component),
1658    FlexBlock: () => (/* reexport */ flex_block_component),
1659    FlexItem: () => (/* reexport */ flex_item_component),
1660    FocalPointPicker: () => (/* reexport */ focal_point_picker),
1661    FocusReturnProvider: () => (/* reexport */ with_focus_return_Provider),
1662    FocusableIframe: () => (/* reexport */ FocusableIframe),
1663    FontSizePicker: () => (/* reexport */ font_size_picker),
1664    FormFileUpload: () => (/* reexport */ form_file_upload),
1665    FormToggle: () => (/* reexport */ form_toggle),
1666    FormTokenField: () => (/* reexport */ form_token_field),
1667    G: () => (/* reexport */ external_wp_primitives_namespaceObject.G),
1668    GradientPicker: () => (/* reexport */ gradient_picker),
1669    Guide: () => (/* reexport */ guide),
1670    GuidePage: () => (/* reexport */ GuidePage),
1671    HorizontalRule: () => (/* reexport */ external_wp_primitives_namespaceObject.HorizontalRule),
1672    Icon: () => (/* reexport */ build_module_icon),
1673    IconButton: () => (/* reexport */ deprecated),
1674    IsolatedEventContainer: () => (/* reexport */ isolated_event_container),
1675    KeyboardShortcuts: () => (/* reexport */ keyboard_shortcuts),
1676    Line: () => (/* reexport */ external_wp_primitives_namespaceObject.Line),
1677    MenuGroup: () => (/* reexport */ menu_group),
1678    MenuItem: () => (/* reexport */ menu_item),
1679    MenuItemsChoice: () => (/* reexport */ menu_items_choice),
1680    Modal: () => (/* reexport */ modal),
1681    NavigableMenu: () => (/* reexport */ navigable_container_menu),
1682    Notice: () => (/* reexport */ build_module_notice),
1683    NoticeList: () => (/* reexport */ list),
1684    Panel: () => (/* reexport */ panel),
1685    PanelBody: () => (/* reexport */ body),
1686    PanelHeader: () => (/* reexport */ panel_header),
1687    PanelRow: () => (/* reexport */ row),
1688    Path: () => (/* reexport */ external_wp_primitives_namespaceObject.Path),
1689    Placeholder: () => (/* reexport */ placeholder),
1690    Polygon: () => (/* reexport */ external_wp_primitives_namespaceObject.Polygon),
1691    Popover: () => (/* reexport */ popover),
1692    ProgressBar: () => (/* reexport */ progress_bar),
1693    QueryControls: () => (/* reexport */ query_controls),
1694    RadioControl: () => (/* reexport */ radio_control),
1695    RangeControl: () => (/* reexport */ range_control),
1696    Rect: () => (/* reexport */ external_wp_primitives_namespaceObject.Rect),
1697    ResizableBox: () => (/* reexport */ resizable_box),
1698    ResponsiveWrapper: () => (/* reexport */ responsive_wrapper),
1699    SVG: () => (/* reexport */ external_wp_primitives_namespaceObject.SVG),
1700    SandBox: () => (/* reexport */ sandbox),
1701    ScrollLock: () => (/* reexport */ scroll_lock),
1702    SearchControl: () => (/* reexport */ search_control),
1703    SelectControl: () => (/* reexport */ select_control),
1704    Slot: () => (/* reexport */ slot_fill_Slot),
1705    SlotFillProvider: () => (/* reexport */ Provider),
1706    Snackbar: () => (/* reexport */ snackbar),
1707    SnackbarList: () => (/* reexport */ snackbar_list),
1708    Spinner: () => (/* reexport */ spinner),
1709    TabPanel: () => (/* reexport */ tab_panel),
1710    TabbableContainer: () => (/* reexport */ tabbable),
1711    TextControl: () => (/* reexport */ text_control),
1712    TextHighlight: () => (/* reexport */ text_highlight),
1713    TextareaControl: () => (/* reexport */ textarea_control),
1714    TimePicker: () => (/* reexport */ date_time_time),
1715    Tip: () => (/* reexport */ build_module_tip),
1716    ToggleControl: () => (/* reexport */ toggle_control),
1717    Toolbar: () => (/* reexport */ toolbar),
1718    ToolbarButton: () => (/* reexport */ toolbar_button),
1719    ToolbarDropdownMenu: () => (/* reexport */ toolbar_dropdown_menu),
1720    ToolbarGroup: () => (/* reexport */ toolbar_group),
1721    ToolbarItem: () => (/* reexport */ toolbar_item),
1722    Tooltip: () => (/* reexport */ tooltip),
1723    TreeSelect: () => (/* reexport */ tree_select),
1724    VisuallyHidden: () => (/* reexport */ visually_hidden_component),
1725    __experimentalAlignmentMatrixControl: () => (/* reexport */ alignment_matrix_control),
1726    __experimentalApplyValueToSides: () => (/* reexport */ applyValueToSides),
1727    __experimentalBorderBoxControl: () => (/* reexport */ border_box_control_component),
1728    __experimentalBorderControl: () => (/* reexport */ border_control_component),
1729    __experimentalBoxControl: () => (/* reexport */ box_control),
1730    __experimentalConfirmDialog: () => (/* reexport */ confirm_dialog_component),
1731    __experimentalDimensionControl: () => (/* reexport */ dimension_control),
1732    __experimentalDivider: () => (/* reexport */ divider_component),
1733    __experimentalDropdownContentWrapper: () => (/* reexport */ dropdown_content_wrapper),
1734    __experimentalElevation: () => (/* reexport */ elevation_component),
1735    __experimentalGrid: () => (/* reexport */ grid_component),
1736    __experimentalHStack: () => (/* reexport */ h_stack_component),
1737    __experimentalHasSplitBorders: () => (/* reexport */ hasSplitBorders),
1738    __experimentalHeading: () => (/* reexport */ heading_component),
1739    __experimentalInputControl: () => (/* reexport */ input_control),
1740    __experimentalInputControlPrefixWrapper: () => (/* reexport */ input_prefix_wrapper),
1741    __experimentalInputControlSuffixWrapper: () => (/* reexport */ input_suffix_wrapper),
1742    __experimentalIsDefinedBorder: () => (/* reexport */ isDefinedBorder),
1743    __experimentalIsEmptyBorder: () => (/* reexport */ isEmptyBorder),
1744    __experimentalItem: () => (/* reexport */ item_component),
1745    __experimentalItemGroup: () => (/* reexport */ item_group_component),
1746    __experimentalNavigation: () => (/* reexport */ navigation),
1747    __experimentalNavigationBackButton: () => (/* reexport */ back_button),
1748    __experimentalNavigationGroup: () => (/* reexport */ group),
1749    __experimentalNavigationItem: () => (/* reexport */ navigation_item),
1750    __experimentalNavigationMenu: () => (/* reexport */ navigation_menu),
1751    __experimentalNavigatorBackButton: () => (/* reexport */ NavigatorBackButton),
1752    __experimentalNavigatorButton: () => (/* reexport */ NavigatorButton),
1753    __experimentalNavigatorProvider: () => (/* reexport */ NavigatorProvider),
1754    __experimentalNavigatorScreen: () => (/* reexport */ NavigatorScreen),
1755    __experimentalNavigatorToParentButton: () => (/* reexport */ NavigatorToParentButton),
1756    __experimentalNumberControl: () => (/* reexport */ number_control),
1757    __experimentalPaletteEdit: () => (/* reexport */ palette_edit),
1758    __experimentalParseQuantityAndUnitFromRawValue: () => (/* reexport */ parseQuantityAndUnitFromRawValue),
1759    __experimentalRadio: () => (/* reexport */ radio_group_radio),
1760    __experimentalRadioGroup: () => (/* reexport */ radio_group),
1761    __experimentalScrollable: () => (/* reexport */ scrollable_component),
1762    __experimentalSpacer: () => (/* reexport */ spacer_component),
1763    __experimentalStyleProvider: () => (/* reexport */ style_provider),
1764    __experimentalSurface: () => (/* reexport */ surface_component),
1765    __experimentalText: () => (/* reexport */ text_component),
1766    __experimentalToggleGroupControl: () => (/* reexport */ toggle_group_control_component),
1767    __experimentalToggleGroupControlOption: () => (/* reexport */ toggle_group_control_option_component),
1768    __experimentalToggleGroupControlOptionIcon: () => (/* reexport */ toggle_group_control_option_icon_component),
1769    __experimentalToolbarContext: () => (/* reexport */ toolbar_context),
1770    __experimentalToolsPanel: () => (/* reexport */ tools_panel_component),
1771    __experimentalToolsPanelContext: () => (/* reexport */ ToolsPanelContext),
1772    __experimentalToolsPanelItem: () => (/* reexport */ tools_panel_item_component),
1773    __experimentalTreeGrid: () => (/* reexport */ tree_grid),
1774    __experimentalTreeGridCell: () => (/* reexport */ cell),
1775    __experimentalTreeGridItem: () => (/* reexport */ tree_grid_item),
1776    __experimentalTreeGridRow: () => (/* reexport */ tree_grid_row),
1777    __experimentalTruncate: () => (/* reexport */ truncate_component),
1778    __experimentalUnitControl: () => (/* reexport */ unit_control),
1779    __experimentalUseCustomUnits: () => (/* reexport */ useCustomUnits),
1780    __experimentalUseNavigator: () => (/* reexport */ useNavigator),
1781    __experimentalUseSlot: () => (/* reexport */ useSlot),
1782    __experimentalUseSlotFills: () => (/* reexport */ useSlotFills),
1783    __experimentalVStack: () => (/* reexport */ v_stack_component),
1784    __experimentalView: () => (/* reexport */ component),
1785    __experimentalZStack: () => (/* reexport */ z_stack_component),
1786    __unstableAnimatePresence: () => (/* reexport */ AnimatePresence),
1787    __unstableComposite: () => (/* reexport */ legacy_Composite),
1788    __unstableCompositeGroup: () => (/* reexport */ legacy_CompositeGroup),
1789    __unstableCompositeItem: () => (/* reexport */ legacy_CompositeItem),
1790    __unstableDisclosureContent: () => (/* reexport */ disclosure_DisclosureContent),
1791    __unstableGetAnimateClassName: () => (/* reexport */ getAnimateClassName),
1792    __unstableMotion: () => (/* reexport */ motion),
1793    __unstableMotionContext: () => (/* reexport */ MotionContext),
1794    __unstableUseAutocompleteProps: () => (/* reexport */ useAutocompleteProps),
1795    __unstableUseCompositeState: () => (/* reexport */ useCompositeState),
1796    __unstableUseNavigateRegions: () => (/* reexport */ useNavigateRegions),
1797    createSlotFill: () => (/* reexport */ createSlotFill),
1798    navigateRegions: () => (/* reexport */ navigate_regions),
1799    privateApis: () => (/* reexport */ privateApis),
1800    useBaseControlProps: () => (/* reexport */ useBaseControlProps),
1801    withConstrainedTabbing: () => (/* reexport */ with_constrained_tabbing),
1802    withFallbackStyles: () => (/* reexport */ with_fallback_styles),
1803    withFilters: () => (/* reexport */ withFilters),
1804    withFocusOutside: () => (/* reexport */ with_focus_outside),
1805    withFocusReturn: () => (/* reexport */ with_focus_return),
1806    withNotices: () => (/* reexport */ with_notices),
1807    withSpokenMessages: () => (/* reexport */ with_spoken_messages)
1808  });
1809  
1810  // NAMESPACE OBJECT: ./node_modules/@wordpress/components/build-module/text/styles.js
1811  var text_styles_namespaceObject = {};
1812  __webpack_require__.r(text_styles_namespaceObject);
1813  __webpack_require__.d(text_styles_namespaceObject, {
1814    Text: () => (Text),
1815    block: () => (styles_block),
1816    destructive: () => (destructive),
1817    highlighterText: () => (highlighterText),
1818    muted: () => (muted),
1819    positive: () => (positive),
1820    upperCase: () => (upperCase)
1821  });
1822  
1823  // NAMESPACE OBJECT: ./node_modules/@wordpress/components/build-module/toggle-group-control/toggle-group-control-option-base/styles.js
1824  var toggle_group_control_option_base_styles_namespaceObject = {};
1825  __webpack_require__.r(toggle_group_control_option_base_styles_namespaceObject);
1826  __webpack_require__.d(toggle_group_control_option_base_styles_namespaceObject, {
1827    ButtonContentView: () => (ButtonContentView),
1828    LabelView: () => (LabelView),
1829    ou: () => (backdropView),
1830    uG: () => (buttonView),
1831    eh: () => (labelBlock)
1832  });
1833  
1834  ;// CONCATENATED MODULE: external ["wp","primitives"]
1835  const external_wp_primitives_namespaceObject = window["wp"]["primitives"];
1836  ;// CONCATENATED MODULE: ./node_modules/clsx/dist/clsx.mjs
1837  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);
1838  ;// CONCATENATED MODULE: external ["wp","i18n"]
1839  const external_wp_i18n_namespaceObject = window["wp"]["i18n"];
1840  ;// CONCATENATED MODULE: external ["wp","compose"]
1841  const external_wp_compose_namespaceObject = window["wp"]["compose"];
1842  ;// CONCATENATED MODULE: external ["wp","element"]
1843  const external_wp_element_namespaceObject = window["wp"]["element"];
1844  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/3YLGPPWQ.js
1845  "use client";
1846  var __defProp = Object.defineProperty;
1847  var __defProps = Object.defineProperties;
1848  var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
1849  var __getOwnPropSymbols = Object.getOwnPropertySymbols;
1850  var __hasOwnProp = Object.prototype.hasOwnProperty;
1851  var __propIsEnum = Object.prototype.propertyIsEnumerable;
1852  var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
1853  var _3YLGPPWQ_spreadValues = (a, b) => {
1854    for (var prop in b || (b = {}))
1855      if (__hasOwnProp.call(b, prop))
1856        __defNormalProp(a, prop, b[prop]);
1857    if (__getOwnPropSymbols)
1858      for (var prop of __getOwnPropSymbols(b)) {
1859        if (__propIsEnum.call(b, prop))
1860          __defNormalProp(a, prop, b[prop]);
1861      }
1862    return a;
1863  };
1864  var _3YLGPPWQ_spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
1865  var __objRest = (source, exclude) => {
1866    var target = {};
1867    for (var prop in source)
1868      if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
1869        target[prop] = source[prop];
1870    if (source != null && __getOwnPropSymbols)
1871      for (var prop of __getOwnPropSymbols(source)) {
1872        if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
1873          target[prop] = source[prop];
1874      }
1875    return target;
1876  };
1877  
1878  
1879  
1880  ;// CONCATENATED MODULE: ./node_modules/@ariakit/core/esm/__chunks/3YLGPPWQ.js
1881  "use client";
1882  var _3YLGPPWQ_defProp = Object.defineProperty;
1883  var _3YLGPPWQ_defProps = Object.defineProperties;
1884  var _3YLGPPWQ_getOwnPropDescs = Object.getOwnPropertyDescriptors;
1885  var _3YLGPPWQ_getOwnPropSymbols = Object.getOwnPropertySymbols;
1886  var _3YLGPPWQ_hasOwnProp = Object.prototype.hasOwnProperty;
1887  var _3YLGPPWQ_propIsEnum = Object.prototype.propertyIsEnumerable;
1888  var _3YLGPPWQ_defNormalProp = (obj, key, value) => key in obj ? _3YLGPPWQ_defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
1889  var _chunks_3YLGPPWQ_spreadValues = (a, b) => {
1890    for (var prop in b || (b = {}))
1891      if (_3YLGPPWQ_hasOwnProp.call(b, prop))
1892        _3YLGPPWQ_defNormalProp(a, prop, b[prop]);
1893    if (_3YLGPPWQ_getOwnPropSymbols)
1894      for (var prop of _3YLGPPWQ_getOwnPropSymbols(b)) {
1895        if (_3YLGPPWQ_propIsEnum.call(b, prop))
1896          _3YLGPPWQ_defNormalProp(a, prop, b[prop]);
1897      }
1898    return a;
1899  };
1900  var _chunks_3YLGPPWQ_spreadProps = (a, b) => _3YLGPPWQ_defProps(a, _3YLGPPWQ_getOwnPropDescs(b));
1901  var _3YLGPPWQ_objRest = (source, exclude) => {
1902    var target = {};
1903    for (var prop in source)
1904      if (_3YLGPPWQ_hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
1905        target[prop] = source[prop];
1906    if (source != null && _3YLGPPWQ_getOwnPropSymbols)
1907      for (var prop of _3YLGPPWQ_getOwnPropSymbols(source)) {
1908        if (exclude.indexOf(prop) < 0 && _3YLGPPWQ_propIsEnum.call(source, prop))
1909          target[prop] = source[prop];
1910      }
1911    return target;
1912  };
1913  
1914  
1915  
1916  ;// CONCATENATED MODULE: ./node_modules/@ariakit/core/esm/__chunks/PBFD2E7P.js
1917  "use client";
1918  
1919  
1920  // src/utils/misc.ts
1921  function noop(..._) {
1922  }
1923  function shallowEqual(a, b) {
1924    if (a === b) return true;
1925    if (!a) return false;
1926    if (!b) return false;
1927    if (typeof a !== "object") return false;
1928    if (typeof b !== "object") return false;
1929    const aKeys = Object.keys(a);
1930    const bKeys = Object.keys(b);
1931    const { length } = aKeys;
1932    if (bKeys.length !== length) return false;
1933    for (const key of aKeys) {
1934      if (a[key] !== b[key]) {
1935        return false;
1936      }
1937    }
1938    return true;
1939  }
1940  function applyState(argument, currentValue) {
1941    if (isUpdater(argument)) {
1942      const value = isLazyValue(currentValue) ? currentValue() : currentValue;
1943      return argument(value);
1944    }
1945    return argument;
1946  }
1947  function isUpdater(argument) {
1948    return typeof argument === "function";
1949  }
1950  function isLazyValue(value) {
1951    return typeof value === "function";
1952  }
1953  function isObject(arg) {
1954    return typeof arg === "object" && arg != null;
1955  }
1956  function isEmpty(arg) {
1957    if (Array.isArray(arg)) return !arg.length;
1958    if (isObject(arg)) return !Object.keys(arg).length;
1959    if (arg == null) return true;
1960    if (arg === "") return true;
1961    return false;
1962  }
1963  function isInteger(arg) {
1964    if (typeof arg === "number") {
1965      return Math.floor(arg) === arg;
1966    }
1967    return String(Math.floor(Number(arg))) === arg;
1968  }
1969  function PBFD2E7P_hasOwnProperty(object, prop) {
1970    if (typeof Object.hasOwn === "function") {
1971      return Object.hasOwn(object, prop);
1972    }
1973    return Object.prototype.hasOwnProperty.call(object, prop);
1974  }
1975  function chain(...fns) {
1976    return (...args) => {
1977      for (const fn of fns) {
1978        if (typeof fn === "function") {
1979          fn(...args);
1980        }
1981      }
1982    };
1983  }
1984  function cx(...args) {
1985    return args.filter(Boolean).join(" ") || void 0;
1986  }
1987  function normalizeString(str) {
1988    return str.normalize("NFD").replace(/[\u0300-\u036f]/g, "");
1989  }
1990  function omit(object, keys) {
1991    const result = _chunks_3YLGPPWQ_spreadValues({}, object);
1992    for (const key of keys) {
1993      if (PBFD2E7P_hasOwnProperty(result, key)) {
1994        delete result[key];
1995      }
1996    }
1997    return result;
1998  }
1999  function pick(object, paths) {
2000    const result = {};
2001    for (const key of paths) {
2002      if (PBFD2E7P_hasOwnProperty(object, key)) {
2003        result[key] = object[key];
2004      }
2005    }
2006    return result;
2007  }
2008  function identity(value) {
2009    return value;
2010  }
2011  function beforePaint(cb = noop) {
2012    const raf = requestAnimationFrame(cb);
2013    return () => cancelAnimationFrame(raf);
2014  }
2015  function afterPaint(cb = noop) {
2016    let raf = requestAnimationFrame(() => {
2017      raf = requestAnimationFrame(cb);
2018    });
2019    return () => cancelAnimationFrame(raf);
2020  }
2021  function invariant(condition, message) {
2022    if (condition) return;
2023    if (typeof message !== "string") throw new Error("Invariant failed");
2024    throw new Error(message);
2025  }
2026  function getKeys(obj) {
2027    return Object.keys(obj);
2028  }
2029  function isFalsyBooleanCallback(booleanOrCallback, ...args) {
2030    const result = typeof booleanOrCallback === "function" ? booleanOrCallback(...args) : booleanOrCallback;
2031    if (result == null) return false;
2032    return !result;
2033  }
2034  function disabledFromProps(props) {
2035    return props.disabled || props["aria-disabled"] === true || props["aria-disabled"] === "true";
2036  }
2037  function removeUndefinedValues(obj) {
2038    const result = {};
2039    for (const key in obj) {
2040      if (obj[key] !== void 0) {
2041        result[key] = obj[key];
2042      }
2043    }
2044    return result;
2045  }
2046  function defaultValue(...values) {
2047    for (const value of values) {
2048      if (value !== void 0) return value;
2049    }
2050    return void 0;
2051  }
2052  
2053  
2054  
2055  // EXTERNAL MODULE: external "React"
2056  var external_React_ = __webpack_require__(1609);
2057  var external_React_namespaceObject = /*#__PURE__*/__webpack_require__.t(external_React_, 2);
2058  var external_React_default = /*#__PURE__*/__webpack_require__.n(external_React_);
2059  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/SK3NAZA3.js
2060  "use client";
2061  
2062  
2063  // src/utils/misc.ts
2064  
2065  
2066  function setRef(ref, value) {
2067    if (typeof ref === "function") {
2068      ref(value);
2069    } else if (ref) {
2070      ref.current = value;
2071    }
2072  }
2073  function isValidElementWithRef(element) {
2074    if (!element) return false;
2075    if (!(0,external_React_.isValidElement)(element)) return false;
2076    if ("ref" in element.props) return true;
2077    if ("ref" in element) return true;
2078    return false;
2079  }
2080  function getRefProperty(element) {
2081    if (!isValidElementWithRef(element)) return null;
2082    const props = _3YLGPPWQ_spreadValues({}, element.props);
2083    return props.ref || element.ref;
2084  }
2085  function mergeProps(base, overrides) {
2086    const props = _3YLGPPWQ_spreadValues({}, base);
2087    for (const key in overrides) {
2088      if (!PBFD2E7P_hasOwnProperty(overrides, key)) continue;
2089      if (key === "className") {
2090        const prop = "className";
2091        props[prop] = base[prop] ? `$base[prop]} $overrides[prop]}` : overrides[prop];
2092        continue;
2093      }
2094      if (key === "style") {
2095        const prop = "style";
2096        props[prop] = base[prop] ? _3YLGPPWQ_spreadValues(_3YLGPPWQ_spreadValues({}, base[prop]), overrides[prop]) : overrides[prop];
2097        continue;
2098      }
2099      const overrideValue = overrides[key];
2100      if (typeof overrideValue === "function" && key.startsWith("on")) {
2101        const baseValue = base[key];
2102        if (typeof baseValue === "function") {
2103          props[key] = (...args) => {
2104            overrideValue(...args);
2105            baseValue(...args);
2106          };
2107          continue;
2108        }
2109      }
2110      props[key] = overrideValue;
2111    }
2112    return props;
2113  }
2114  
2115  
2116  
2117  ;// CONCATENATED MODULE: ./node_modules/@ariakit/core/esm/__chunks/HWOIWM4O.js
2118  "use client";
2119  
2120  // src/utils/dom.ts
2121  var canUseDOM = checkIsBrowser();
2122  function checkIsBrowser() {
2123    var _a;
2124    return typeof window !== "undefined" && !!((_a = window.document) == null ? void 0 : _a.createElement);
2125  }
2126  function getDocument(node) {
2127    return node ? node.ownerDocument || node : document;
2128  }
2129  function getWindow(node) {
2130    return getDocument(node).defaultView || window;
2131  }
2132  function getActiveElement(node, activeDescendant = false) {
2133    const { activeElement } = getDocument(node);
2134    if (!(activeElement == null ? void 0 : activeElement.nodeName)) {
2135      return null;
2136    }
2137    if (isFrame(activeElement) && activeElement.contentDocument) {
2138      return getActiveElement(
2139        activeElement.contentDocument.body,
2140        activeDescendant
2141      );
2142    }
2143    if (activeDescendant) {
2144      const id = activeElement.getAttribute("aria-activedescendant");
2145      if (id) {
2146        const element = getDocument(activeElement).getElementById(id);
2147        if (element) {
2148          return element;
2149        }
2150      }
2151    }
2152    return activeElement;
2153  }
2154  function contains(parent, child) {
2155    return parent === child || parent.contains(child);
2156  }
2157  function isFrame(element) {
2158    return element.tagName === "IFRAME";
2159  }
2160  function isButton(element) {
2161    const tagName = element.tagName.toLowerCase();
2162    if (tagName === "button") return true;
2163    if (tagName === "input" && element.type) {
2164      return buttonInputTypes.indexOf(element.type) !== -1;
2165    }
2166    return false;
2167  }
2168  var buttonInputTypes = [
2169    "button",
2170    "color",
2171    "file",
2172    "image",
2173    "reset",
2174    "submit"
2175  ];
2176  function isVisible(element) {
2177    if (typeof element.checkVisibility === "function") {
2178      return element.checkVisibility();
2179    }
2180    const htmlElement = element;
2181    return htmlElement.offsetWidth > 0 || htmlElement.offsetHeight > 0 || element.getClientRects().length > 0;
2182  }
2183  function isTextField(element) {
2184    try {
2185      const isTextInput = element instanceof HTMLInputElement && element.selectionStart !== null;
2186      const isTextArea = element.tagName === "TEXTAREA";
2187      return isTextInput || isTextArea || false;
2188    } catch (error) {
2189      return false;
2190    }
2191  }
2192  function isTextbox(element) {
2193    return element.isContentEditable || isTextField(element);
2194  }
2195  function getTextboxValue(element) {
2196    if (isTextField(element)) {
2197      return element.value;
2198    }
2199    if (element.isContentEditable) {
2200      const range = getDocument(element).createRange();
2201      range.selectNodeContents(element);
2202      return range.toString();
2203    }
2204    return "";
2205  }
2206  function getTextboxSelection(element) {
2207    let start = 0;
2208    let end = 0;
2209    if (isTextField(element)) {
2210      start = element.selectionStart || 0;
2211      end = element.selectionEnd || 0;
2212    } else if (element.isContentEditable) {
2213      const selection = getDocument(element).getSelection();
2214      if ((selection == null ? void 0 : selection.rangeCount) && selection.anchorNode && contains(element, selection.anchorNode) && selection.focusNode && contains(element, selection.focusNode)) {
2215        const range = selection.getRangeAt(0);
2216        const nextRange = range.cloneRange();
2217        nextRange.selectNodeContents(element);
2218        nextRange.setEnd(range.startContainer, range.startOffset);
2219        start = nextRange.toString().length;
2220        nextRange.setEnd(range.endContainer, range.endOffset);
2221        end = nextRange.toString().length;
2222      }
2223    }
2224    return { start, end };
2225  }
2226  function getPopupRole(element, fallback) {
2227    const allowedPopupRoles = ["dialog", "menu", "listbox", "tree", "grid"];
2228    const role = element == null ? void 0 : element.getAttribute("role");
2229    if (role && allowedPopupRoles.indexOf(role) !== -1) {
2230      return role;
2231    }
2232    return fallback;
2233  }
2234  function getPopupItemRole(element, fallback) {
2235    var _a;
2236    const itemRoleByPopupRole = {
2237      menu: "menuitem",
2238      listbox: "option",
2239      tree: "treeitem"
2240    };
2241    const popupRole = getPopupRole(element);
2242    if (!popupRole) return fallback;
2243    const key = popupRole;
2244    return (_a = itemRoleByPopupRole[key]) != null ? _a : fallback;
2245  }
2246  function scrollIntoViewIfNeeded(element, arg) {
2247    if (isPartiallyHidden(element) && "scrollIntoView" in element) {
2248      element.scrollIntoView(arg);
2249    }
2250  }
2251  function getScrollingElement(element) {
2252    if (!element) return null;
2253    if (element.clientHeight && element.scrollHeight > element.clientHeight) {
2254      const { overflowY } = getComputedStyle(element);
2255      const isScrollable = overflowY !== "visible" && overflowY !== "hidden";
2256      if (isScrollable) return element;
2257    } else if (element.clientWidth && element.scrollWidth > element.clientWidth) {
2258      const { overflowX } = getComputedStyle(element);
2259      const isScrollable = overflowX !== "visible" && overflowX !== "hidden";
2260      if (isScrollable) return element;
2261    }
2262    return getScrollingElement(element.parentElement) || document.scrollingElement || document.body;
2263  }
2264  function isPartiallyHidden(element) {
2265    const elementRect = element.getBoundingClientRect();
2266    const scroller = getScrollingElement(element);
2267    if (!scroller) return false;
2268    const scrollerRect = scroller.getBoundingClientRect();
2269    const isHTML = scroller.tagName === "HTML";
2270    const scrollerTop = isHTML ? scrollerRect.top + scroller.scrollTop : scrollerRect.top;
2271    const scrollerBottom = isHTML ? scroller.clientHeight : scrollerRect.bottom;
2272    const scrollerLeft = isHTML ? scrollerRect.left + scroller.scrollLeft : scrollerRect.left;
2273    const scrollerRight = isHTML ? scroller.clientWidth : scrollerRect.right;
2274    const top = elementRect.top < scrollerTop;
2275    const left = elementRect.left < scrollerLeft;
2276    const bottom = elementRect.bottom > scrollerBottom;
2277    const right = elementRect.right > scrollerRight;
2278    return top || left || bottom || right;
2279  }
2280  function setSelectionRange(element, ...args) {
2281    if (/text|search|password|tel|url/i.test(element.type)) {
2282      element.setSelectionRange(...args);
2283    }
2284  }
2285  
2286  
2287  
2288  ;// CONCATENATED MODULE: ./node_modules/@ariakit/core/esm/__chunks/US4USQPI.js
2289  "use client";
2290  
2291  
2292  // src/utils/platform.ts
2293  function isTouchDevice() {
2294    return canUseDOM && !!navigator.maxTouchPoints;
2295  }
2296  function isApple() {
2297    if (!canUseDOM) return false;
2298    return /mac|iphone|ipad|ipod/i.test(navigator.platform);
2299  }
2300  function isSafari() {
2301    return canUseDOM && isApple() && /apple/i.test(navigator.vendor);
2302  }
2303  function isFirefox() {
2304    return canUseDOM && /firefox\//i.test(navigator.userAgent);
2305  }
2306  function isMac() {
2307    return canUseDOM && navigator.platform.startsWith("Mac") && !isTouchDevice();
2308  }
2309  
2310  
2311  
2312  ;// CONCATENATED MODULE: ./node_modules/@ariakit/core/esm/utils/events.js
2313  "use client";
2314  
2315  
2316  
2317  
2318  // src/utils/events.ts
2319  function isPortalEvent(event) {
2320    return Boolean(
2321      event.currentTarget && !contains(event.currentTarget, event.target)
2322    );
2323  }
2324  function isSelfTarget(event) {
2325    return event.target === event.currentTarget;
2326  }
2327  function isOpeningInNewTab(event) {
2328    const element = event.currentTarget;
2329    if (!element) return false;
2330    const isAppleDevice = isApple();
2331    if (isAppleDevice && !event.metaKey) return false;
2332    if (!isAppleDevice && !event.ctrlKey) return false;
2333    const tagName = element.tagName.toLowerCase();
2334    if (tagName === "a") return true;
2335    if (tagName === "button" && element.type === "submit") return true;
2336    if (tagName === "input" && element.type === "submit") return true;
2337    return false;
2338  }
2339  function isDownloading(event) {
2340    const element = event.currentTarget;
2341    if (!element) return false;
2342    const tagName = element.tagName.toLowerCase();
2343    if (!event.altKey) return false;
2344    if (tagName === "a") return true;
2345    if (tagName === "button" && element.type === "submit") return true;
2346    if (tagName === "input" && element.type === "submit") return true;
2347    return false;
2348  }
2349  function fireEvent(element, type, eventInit) {
2350    const event = new Event(type, eventInit);
2351    return element.dispatchEvent(event);
2352  }
2353  function fireBlurEvent(element, eventInit) {
2354    const event = new FocusEvent("blur", eventInit);
2355    const defaultAllowed = element.dispatchEvent(event);
2356    const bubbleInit = _chunks_3YLGPPWQ_spreadProps(_chunks_3YLGPPWQ_spreadValues({}, eventInit), { bubbles: true });
2357    element.dispatchEvent(new FocusEvent("focusout", bubbleInit));
2358    return defaultAllowed;
2359  }
2360  function fireFocusEvent(element, eventInit) {
2361    const event = new FocusEvent("focus", eventInit);
2362    const defaultAllowed = element.dispatchEvent(event);
2363    const bubbleInit = __spreadProps(__spreadValues({}, eventInit), { bubbles: true });
2364    element.dispatchEvent(new FocusEvent("focusin", bubbleInit));
2365    return defaultAllowed;
2366  }
2367  function fireKeyboardEvent(element, type, eventInit) {
2368    const event = new KeyboardEvent(type, eventInit);
2369    return element.dispatchEvent(event);
2370  }
2371  function fireClickEvent(element, eventInit) {
2372    const event = new MouseEvent("click", eventInit);
2373    return element.dispatchEvent(event);
2374  }
2375  function isFocusEventOutside(event, container) {
2376    const containerElement = container || event.currentTarget;
2377    const relatedTarget = event.relatedTarget;
2378    return !relatedTarget || !contains(containerElement, relatedTarget);
2379  }
2380  function getInputType(event) {
2381    const nativeEvent = "nativeEvent" in event ? event.nativeEvent : event;
2382    if (!nativeEvent) return;
2383    if (!("inputType" in nativeEvent)) return;
2384    if (typeof nativeEvent.inputType !== "string") return;
2385    return nativeEvent.inputType;
2386  }
2387  function queueBeforeEvent(element, type, callback, timeout) {
2388    const createTimer = (callback2) => {
2389      if (timeout) {
2390        const timerId2 = setTimeout(callback2, timeout);
2391        return () => clearTimeout(timerId2);
2392      }
2393      const timerId = requestAnimationFrame(callback2);
2394      return () => cancelAnimationFrame(timerId);
2395    };
2396    const cancelTimer = createTimer(() => {
2397      element.removeEventListener(type, callSync, true);
2398      callback();
2399    });
2400    const callSync = () => {
2401      cancelTimer();
2402      callback();
2403    };
2404    element.addEventListener(type, callSync, { once: true, capture: true });
2405    return cancelTimer;
2406  }
2407  function addGlobalEventListener(type, listener, options, scope = window) {
2408    const children = [];
2409    try {
2410      scope.document.addEventListener(type, listener, options);
2411      for (const frame of Array.from(scope.frames)) {
2412        children.push(addGlobalEventListener(type, listener, options, frame));
2413      }
2414    } catch (e) {
2415    }
2416    const removeEventListener = () => {
2417      try {
2418        scope.document.removeEventListener(type, listener, options);
2419      } catch (e) {
2420      }
2421      for (const remove of children) {
2422        remove();
2423      }
2424    };
2425    return removeEventListener;
2426  }
2427  
2428  
2429  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/Z32BISHQ.js
2430  "use client";
2431  
2432  
2433  
2434  // src/utils/hooks.ts
2435  
2436  
2437  
2438  
2439  var _React = _3YLGPPWQ_spreadValues({}, external_React_namespaceObject);
2440  var useReactId = _React.useId;
2441  var useReactDeferredValue = _React.useDeferredValue;
2442  var useReactInsertionEffect = _React.useInsertionEffect;
2443  var useSafeLayoutEffect = canUseDOM ? external_React_.useLayoutEffect : external_React_.useEffect;
2444  function useInitialValue(value) {
2445    const [initialValue] = (0,external_React_.useState)(value);
2446    return initialValue;
2447  }
2448  function useLazyValue(init) {
2449    const ref = useRef();
2450    if (ref.current === void 0) {
2451      ref.current = init();
2452    }
2453    return ref.current;
2454  }
2455  function useLiveRef(value) {
2456    const ref = (0,external_React_.useRef)(value);
2457    useSafeLayoutEffect(() => {
2458      ref.current = value;
2459    });
2460    return ref;
2461  }
2462  function usePreviousValue(value) {
2463    const [previousValue, setPreviousValue] = useState(value);
2464    if (value !== previousValue) {
2465      setPreviousValue(value);
2466    }
2467    return previousValue;
2468  }
2469  function useEvent(callback) {
2470    const ref = (0,external_React_.useRef)(() => {
2471      throw new Error("Cannot call an event handler while rendering.");
2472    });
2473    if (useReactInsertionEffect) {
2474      useReactInsertionEffect(() => {
2475        ref.current = callback;
2476      });
2477    } else {
2478      ref.current = callback;
2479    }
2480    return (0,external_React_.useCallback)((...args) => {
2481      var _a;
2482      return (_a = ref.current) == null ? void 0 : _a.call(ref, ...args);
2483    }, []);
2484  }
2485  function useTransactionState(callback) {
2486    const [state, setState] = (0,external_React_.useState)(null);
2487    useSafeLayoutEffect(() => {
2488      if (state == null) return;
2489      if (!callback) return;
2490      let prevState = null;
2491      callback((prev) => {
2492        prevState = prev;
2493        return state;
2494      });
2495      return () => {
2496        callback(prevState);
2497      };
2498    }, [state, callback]);
2499    return [state, setState];
2500  }
2501  function useMergeRefs(...refs) {
2502    return (0,external_React_.useMemo)(() => {
2503      if (!refs.some(Boolean)) return;
2504      return (value) => {
2505        for (const ref of refs) {
2506          setRef(ref, value);
2507        }
2508      };
2509    }, refs);
2510  }
2511  function useId(defaultId) {
2512    if (useReactId) {
2513      const reactId = useReactId();
2514      if (defaultId) return defaultId;
2515      return reactId;
2516    }
2517    const [id, setId] = (0,external_React_.useState)(defaultId);
2518    useSafeLayoutEffect(() => {
2519      if (defaultId || id) return;
2520      const random = Math.random().toString(36).substr(2, 6);
2521      setId(`id-$random}`);
2522    }, [defaultId, id]);
2523    return defaultId || id;
2524  }
2525  function useDeferredValue(value) {
2526    if (useReactDeferredValue) {
2527      return useReactDeferredValue(value);
2528    }
2529    const [deferredValue, setDeferredValue] = useState(value);
2530    useEffect(() => {
2531      const raf = requestAnimationFrame(() => setDeferredValue(value));
2532      return () => cancelAnimationFrame(raf);
2533    }, [value]);
2534    return deferredValue;
2535  }
2536  function useTagName(refOrElement, type) {
2537    const stringOrUndefined = (type2) => {
2538      if (typeof type2 !== "string") return;
2539      return type2;
2540    };
2541    const [tagName, setTagName] = (0,external_React_.useState)(() => stringOrUndefined(type));
2542    useSafeLayoutEffect(() => {
2543      const element = refOrElement && "current" in refOrElement ? refOrElement.current : refOrElement;
2544      setTagName((element == null ? void 0 : element.tagName.toLowerCase()) || stringOrUndefined(type));
2545    }, [refOrElement, type]);
2546    return tagName;
2547  }
2548  function useAttribute(refOrElement, attributeName, defaultValue) {
2549    const [attribute, setAttribute] = (0,external_React_.useState)(defaultValue);
2550    useSafeLayoutEffect(() => {
2551      const element = refOrElement && "current" in refOrElement ? refOrElement.current : refOrElement;
2552      if (!element) return;
2553      const callback = () => {
2554        const value = element.getAttribute(attributeName);
2555        if (value == null) return;
2556        setAttribute(value);
2557      };
2558      const observer = new MutationObserver(callback);
2559      observer.observe(element, { attributeFilter: [attributeName] });
2560      callback();
2561      return () => observer.disconnect();
2562    }, [refOrElement, attributeName]);
2563    return attribute;
2564  }
2565  function useUpdateEffect(effect, deps) {
2566    const mounted = (0,external_React_.useRef)(false);
2567    (0,external_React_.useEffect)(() => {
2568      if (mounted.current) {
2569        return effect();
2570      }
2571      mounted.current = true;
2572    }, deps);
2573    (0,external_React_.useEffect)(
2574      () => () => {
2575        mounted.current = false;
2576      },
2577      []
2578    );
2579  }
2580  function useUpdateLayoutEffect(effect, deps) {
2581    const mounted = useRef(false);
2582    useSafeLayoutEffect(() => {
2583      if (mounted.current) {
2584        return effect();
2585      }
2586      mounted.current = true;
2587    }, deps);
2588    useSafeLayoutEffect(
2589      () => () => {
2590        mounted.current = false;
2591      },
2592      []
2593    );
2594  }
2595  function useForceUpdate() {
2596    return (0,external_React_.useReducer)(() => [], []);
2597  }
2598  function useBooleanEvent(booleanOrCallback) {
2599    return useEvent(
2600      typeof booleanOrCallback === "function" ? booleanOrCallback : () => booleanOrCallback
2601    );
2602  }
2603  function useWrapElement(props, callback, deps = []) {
2604    const wrapElement = (0,external_React_.useCallback)(
2605      (element) => {
2606        if (props.wrapElement) {
2607          element = props.wrapElement(element);
2608        }
2609        return callback(element);
2610      },
2611      [...deps, props.wrapElement]
2612    );
2613    return _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, props), { wrapElement });
2614  }
2615  function usePortalRef(portalProp = false, portalRefProp) {
2616    const [portalNode, setPortalNode] = (0,external_React_.useState)(null);
2617    const portalRef = useMergeRefs(setPortalNode, portalRefProp);
2618    const domReady = !portalProp || portalNode;
2619    return { portalRef, portalNode, domReady };
2620  }
2621  function useMetadataProps(props, key, value) {
2622    const parent = props.onLoadedMetadataCapture;
2623    const onLoadedMetadataCapture = (0,external_React_.useMemo)(() => {
2624      return Object.assign(() => {
2625      }, _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, parent), { [key]: value }));
2626    }, [parent, key, value]);
2627    return [parent == null ? void 0 : parent[key], { onLoadedMetadataCapture }];
2628  }
2629  function useIsMouseMoving() {
2630    (0,external_React_.useEffect)(() => {
2631      addGlobalEventListener("mousemove", setMouseMoving, true);
2632      addGlobalEventListener("mousedown", resetMouseMoving, true);
2633      addGlobalEventListener("mouseup", resetMouseMoving, true);
2634      addGlobalEventListener("keydown", resetMouseMoving, true);
2635      addGlobalEventListener("scroll", resetMouseMoving, true);
2636    }, []);
2637    const isMouseMoving = useEvent(() => mouseMoving);
2638    return isMouseMoving;
2639  }
2640  var mouseMoving = false;
2641  var previousScreenX = 0;
2642  var previousScreenY = 0;
2643  function hasMouseMovement(event) {
2644    const movementX = event.movementX || event.screenX - previousScreenX;
2645    const movementY = event.movementY || event.screenY - previousScreenY;
2646    previousScreenX = event.screenX;
2647    previousScreenY = event.screenY;
2648    return movementX || movementY || "production" === "test";
2649  }
2650  function setMouseMoving(event) {
2651    if (!hasMouseMovement(event)) return;
2652    mouseMoving = true;
2653  }
2654  function resetMouseMoving() {
2655    mouseMoving = false;
2656  }
2657  
2658  
2659  
2660  ;// CONCATENATED MODULE: ./node_modules/@ariakit/core/esm/__chunks/EQQLU3CG.js
2661  "use client";
2662  
2663  
2664  
2665  // src/utils/store.ts
2666  function getInternal(store, key) {
2667    const internals = store.__unstableInternals;
2668    invariant(internals, "Invalid store");
2669    return internals[key];
2670  }
2671  function createStore(initialState, ...stores) {
2672    let state = initialState;
2673    let prevStateBatch = state;
2674    let lastUpdate = Symbol();
2675    let destroy = noop;
2676    const instances = /* @__PURE__ */ new Set();
2677    const updatedKeys = /* @__PURE__ */ new Set();
2678    const setups = /* @__PURE__ */ new Set();
2679    const listeners = /* @__PURE__ */ new Set();
2680    const batchListeners = /* @__PURE__ */ new Set();
2681    const disposables = /* @__PURE__ */ new WeakMap();
2682    const listenerKeys = /* @__PURE__ */ new WeakMap();
2683    const storeSetup = (callback) => {
2684      setups.add(callback);
2685      return () => setups.delete(callback);
2686    };
2687    const storeInit = () => {
2688      const initialized = instances.size;
2689      const instance = Symbol();
2690      instances.add(instance);
2691      const maybeDestroy = () => {
2692        instances.delete(instance);
2693        if (instances.size) return;
2694        destroy();
2695      };
2696      if (initialized) return maybeDestroy;
2697      const desyncs = getKeys(state).map(
2698        (key) => chain(
2699          ...stores.map((store) => {
2700            var _a;
2701            const storeState = (_a = store == null ? void 0 : store.getState) == null ? void 0 : _a.call(store);
2702            if (!storeState) return;
2703            if (!PBFD2E7P_hasOwnProperty(storeState, key)) return;
2704            return sync(store, [key], (state2) => {
2705              setState(
2706                key,
2707                state2[key],
2708                // @ts-expect-error - Not public API. This is just to prevent
2709                // infinite loops.
2710                true
2711              );
2712            });
2713          })
2714        )
2715      );
2716      const teardowns = [];
2717      for (const setup2 of setups) {
2718        teardowns.push(setup2());
2719      }
2720      const cleanups = stores.map(init);
2721      destroy = chain(...desyncs, ...teardowns, ...cleanups);
2722      return maybeDestroy;
2723    };
2724    const sub = (keys, listener, set = listeners) => {
2725      set.add(listener);
2726      listenerKeys.set(listener, keys);
2727      return () => {
2728        var _a;
2729        (_a = disposables.get(listener)) == null ? void 0 : _a();
2730        disposables.delete(listener);
2731        listenerKeys.delete(listener);
2732        set.delete(listener);
2733      };
2734    };
2735    const storeSubscribe = (keys, listener) => sub(keys, listener);
2736    const storeSync = (keys, listener) => {
2737      disposables.set(listener, listener(state, state));
2738      return sub(keys, listener);
2739    };
2740    const storeBatch = (keys, listener) => {
2741      disposables.set(listener, listener(state, prevStateBatch));
2742      return sub(keys, listener, batchListeners);
2743    };
2744    const storePick = (keys) => createStore(pick(state, keys), finalStore);
2745    const storeOmit = (keys) => createStore(omit(state, keys), finalStore);
2746    const getState = () => state;
2747    const setState = (key, value, fromStores = false) => {
2748      var _a;
2749      if (!PBFD2E7P_hasOwnProperty(state, key)) return;
2750      const nextValue = applyState(value, state[key]);
2751      if (nextValue === state[key]) return;
2752      if (!fromStores) {
2753        for (const store of stores) {
2754          (_a = store == null ? void 0 : store.setState) == null ? void 0 : _a.call(store, key, nextValue);
2755        }
2756      }
2757      const prevState = state;
2758      state = _chunks_3YLGPPWQ_spreadProps(_chunks_3YLGPPWQ_spreadValues({}, state), { [key]: nextValue });
2759      const thisUpdate = Symbol();
2760      lastUpdate = thisUpdate;
2761      updatedKeys.add(key);
2762      const run = (listener, prev, uKeys) => {
2763        var _a2;
2764        const keys = listenerKeys.get(listener);
2765        const updated = (k) => uKeys ? uKeys.has(k) : k === key;
2766        if (!keys || keys.some(updated)) {
2767          (_a2 = disposables.get(listener)) == null ? void 0 : _a2();
2768          disposables.set(listener, listener(state, prev));
2769        }
2770      };
2771      for (const listener of listeners) {
2772        run(listener, prevState);
2773      }
2774      queueMicrotask(() => {
2775        if (lastUpdate !== thisUpdate) return;
2776        const snapshot = state;
2777        for (const listener of batchListeners) {
2778          run(listener, prevStateBatch, updatedKeys);
2779        }
2780        prevStateBatch = snapshot;
2781        updatedKeys.clear();
2782      });
2783    };
2784    const finalStore = {
2785      getState,
2786      setState,
2787      __unstableInternals: {
2788        setup: storeSetup,
2789        init: storeInit,
2790        subscribe: storeSubscribe,
2791        sync: storeSync,
2792        batch: storeBatch,
2793        pick: storePick,
2794        omit: storeOmit
2795      }
2796    };
2797    return finalStore;
2798  }
2799  function setup(store, ...args) {
2800    if (!store) return;
2801    return getInternal(store, "setup")(...args);
2802  }
2803  function init(store, ...args) {
2804    if (!store) return;
2805    return getInternal(store, "init")(...args);
2806  }
2807  function subscribe(store, ...args) {
2808    if (!store) return;
2809    return getInternal(store, "subscribe")(...args);
2810  }
2811  function sync(store, ...args) {
2812    if (!store) return;
2813    return getInternal(store, "sync")(...args);
2814  }
2815  function batch(store, ...args) {
2816    if (!store) return;
2817    return getInternal(store, "batch")(...args);
2818  }
2819  function omit2(store, ...args) {
2820    if (!store) return;
2821    return getInternal(store, "omit")(...args);
2822  }
2823  function pick2(store, ...args) {
2824    if (!store) return;
2825    return getInternal(store, "pick")(...args);
2826  }
2827  function mergeStore(...stores) {
2828    const initialState = stores.reduce((state, store2) => {
2829      var _a;
2830      const nextState = (_a = store2 == null ? void 0 : store2.getState) == null ? void 0 : _a.call(store2);
2831      if (!nextState) return state;
2832      return Object.assign(state, nextState);
2833    }, {});
2834    const store = createStore(initialState, ...stores);
2835    return store;
2836  }
2837  function throwOnConflictingProps(props, store) {
2838    if (true) return;
2839    if (!store) return;
2840    const defaultKeys = Object.entries(props).filter(([key, value]) => key.startsWith("default") && value !== void 0).map(([key]) => {
2841      var _a;
2842      const stateKey = key.replace("default", "");
2843      return `${((_a = stateKey[0]) == null ? void 0 : _a.toLowerCase()) || ""}$stateKey.slice(1)}`;
2844    });
2845    if (!defaultKeys.length) return;
2846    const storeState = store.getState();
2847    const conflictingProps = defaultKeys.filter(
2848      (key) => PBFD2E7P_hasOwnProperty(storeState, key)
2849    );
2850    if (!conflictingProps.length) return;
2851    throw new Error(
2852      `Passing a store prop in conjunction with a default state is not supported.
2853  
2854  const store = useSelectStore();
2855  <SelectProvider store={store} defaultValue="Apple" />
2856                  ^             ^
2857  
2858  Instead, pass the default state to the topmost store:
2859  
2860  const store = useSelectStore({ defaultValue: "Apple" });
2861  <SelectProvider store={store} />
2862  
2863  See https://github.com/ariakit/ariakit/pull/2745 for more details.
2864  
2865  If there's a particular need for this, please submit a feature request at https://github.com/ariakit/ariakit
2866  `
2867    );
2868  }
2869  
2870  
2871  
2872  // EXTERNAL MODULE: ./node_modules/use-sync-external-store/shim/index.js
2873  var shim = __webpack_require__(422);
2874  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/2GXGCHW6.js
2875  "use client";
2876  
2877  
2878  
2879  // src/utils/store.tsx
2880  
2881  
2882  
2883  
2884  var { useSyncExternalStore } = shim;
2885  var noopSubscribe = () => () => {
2886  };
2887  function useStoreState(store, keyOrSelector = identity) {
2888    const storeSubscribe = external_React_.useCallback(
2889      (callback) => {
2890        if (!store) return noopSubscribe();
2891        return subscribe(store, null, callback);
2892      },
2893      [store]
2894    );
2895    const getSnapshot = () => {
2896      const key = typeof keyOrSelector === "string" ? keyOrSelector : null;
2897      const selector = typeof keyOrSelector === "function" ? keyOrSelector : null;
2898      const state = store == null ? void 0 : store.getState();
2899      if (selector) return selector(state);
2900      if (!state) return;
2901      if (!key) return;
2902      if (!PBFD2E7P_hasOwnProperty(state, key)) return;
2903      return state[key];
2904    };
2905    return useSyncExternalStore(storeSubscribe, getSnapshot, getSnapshot);
2906  }
2907  function useStoreProps(store, props, key, setKey) {
2908    const value = PBFD2E7P_hasOwnProperty(props, key) ? props[key] : void 0;
2909    const setValue = setKey ? props[setKey] : void 0;
2910    const propsRef = useLiveRef({ value, setValue });
2911    useSafeLayoutEffect(() => {
2912      return sync(store, [key], (state, prev) => {
2913        const { value: value2, setValue: setValue2 } = propsRef.current;
2914        if (!setValue2) return;
2915        if (state[key] === prev[key]) return;
2916        if (state[key] === value2) return;
2917        setValue2(state[key]);
2918      });
2919    }, [store, key]);
2920    useSafeLayoutEffect(() => {
2921      if (value === void 0) return;
2922      store.setState(key, value);
2923      return batch(store, [key], () => {
2924        if (value === void 0) return;
2925        store.setState(key, value);
2926      });
2927    });
2928  }
2929  function _2GXGCHW6_useStore(createStore, props) {
2930    const [store, setStore] = external_React_.useState(() => createStore(props));
2931    useSafeLayoutEffect(() => init(store), [store]);
2932    const useState2 = external_React_.useCallback(
2933      (keyOrSelector) => useStoreState(store, keyOrSelector),
2934      [store]
2935    );
2936    const memoizedStore = external_React_.useMemo(
2937      () => _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, store), { useState: useState2 }),
2938      [store, useState2]
2939    );
2940    const updateStore = useEvent(() => {
2941      setStore((store2) => createStore(_3YLGPPWQ_spreadValues(_3YLGPPWQ_spreadValues({}, props), store2.getState())));
2942    });
2943    return [memoizedStore, updateStore];
2944  }
2945  
2946  
2947  
2948  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/TCAGH6BH.js
2949  "use client";
2950  
2951  
2952  
2953  // src/collection/collection-store.ts
2954  
2955  function useCollectionStoreProps(store, update, props) {
2956    useUpdateEffect(update, [props.store]);
2957    useStoreProps(store, props, "items", "setItems");
2958    return store;
2959  }
2960  function useCollectionStore(props = {}) {
2961    const [store, update] = useStore(Core.createCollectionStore, props);
2962    return useCollectionStoreProps(store, update, props);
2963  }
2964  
2965  
2966  
2967  ;// CONCATENATED MODULE: ./node_modules/@ariakit/core/esm/__chunks/6DHTHWXD.js
2968  "use client";
2969  
2970  
2971  
2972  
2973  
2974  // src/collection/collection-store.ts
2975  function isElementPreceding(a, b) {
2976    return Boolean(
2977      b.compareDocumentPosition(a) & Node.DOCUMENT_POSITION_PRECEDING
2978    );
2979  }
2980  function sortBasedOnDOMPosition(items) {
2981    const pairs = items.map((item, index) => [index, item]);
2982    let isOrderDifferent = false;
2983    pairs.sort(([indexA, a], [indexB, b]) => {
2984      const elementA = a.element;
2985      const elementB = b.element;
2986      if (elementA === elementB) return 0;
2987      if (!elementA || !elementB) return 0;
2988      if (isElementPreceding(elementA, elementB)) {
2989        if (indexA > indexB) {
2990          isOrderDifferent = true;
2991        }
2992        return -1;
2993      }
2994      if (indexA < indexB) {
2995        isOrderDifferent = true;
2996      }
2997      return 1;
2998    });
2999    if (isOrderDifferent) {
3000      return pairs.map(([_, item]) => item);
3001    }
3002    return items;
3003  }
3004  function getCommonParent(items) {
3005    var _a;
3006    const firstItem = items.find((item) => !!item.element);
3007    const lastItem = [...items].reverse().find((item) => !!item.element);
3008    let parentElement = (_a = firstItem == null ? void 0 : firstItem.element) == null ? void 0 : _a.parentElement;
3009    while (parentElement && (lastItem == null ? void 0 : lastItem.element)) {
3010      const parent = parentElement;
3011      if (lastItem && parent.contains(lastItem.element)) {
3012        return parentElement;
3013      }
3014      parentElement = parentElement.parentElement;
3015    }
3016    return getDocument(parentElement).body;
3017  }
3018  function getPrivateStore(store) {
3019    return store == null ? void 0 : store.__unstablePrivateStore;
3020  }
3021  function createCollectionStore(props = {}) {
3022    var _a;
3023    throwOnConflictingProps(props, props.store);
3024    const syncState = (_a = props.store) == null ? void 0 : _a.getState();
3025    const items = defaultValue(
3026      props.items,
3027      syncState == null ? void 0 : syncState.items,
3028      props.defaultItems,
3029      []
3030    );
3031    const itemsMap = new Map(items.map((item) => [item.id, item]));
3032    const initialState = {
3033      items,
3034      renderedItems: defaultValue(syncState == null ? void 0 : syncState.renderedItems, [])
3035    };
3036    const syncPrivateStore = getPrivateStore(props.store);
3037    const privateStore = createStore(
3038      { items, renderedItems: initialState.renderedItems },
3039      syncPrivateStore
3040    );
3041    const collection = createStore(initialState, props.store);
3042    const sortItems = (renderedItems) => {
3043      const sortedItems = sortBasedOnDOMPosition(renderedItems);
3044      privateStore.setState("renderedItems", sortedItems);
3045      collection.setState("renderedItems", sortedItems);
3046    };
3047    setup(collection, () => init(privateStore));
3048    setup(privateStore, () => {
3049      return batch(privateStore, ["items"], (state) => {
3050        collection.setState("items", state.items);
3051      });
3052    });
3053    setup(privateStore, () => {
3054      return batch(privateStore, ["renderedItems"], (state) => {
3055        let firstRun = true;
3056        let raf = requestAnimationFrame(() => {
3057          const { renderedItems } = collection.getState();
3058          if (state.renderedItems === renderedItems) return;
3059          sortItems(state.renderedItems);
3060        });
3061        if (typeof IntersectionObserver !== "function") {
3062          return () => cancelAnimationFrame(raf);
3063        }
3064        const ioCallback = () => {
3065          if (firstRun) {
3066            firstRun = false;
3067            return;
3068          }
3069          cancelAnimationFrame(raf);
3070          raf = requestAnimationFrame(() => sortItems(state.renderedItems));
3071        };
3072        const root = getCommonParent(state.renderedItems);
3073        const observer = new IntersectionObserver(ioCallback, { root });
3074        for (const item of state.renderedItems) {
3075          if (!item.element) continue;
3076          observer.observe(item.element);
3077        }
3078        return () => {
3079          cancelAnimationFrame(raf);
3080          observer.disconnect();
3081        };
3082      });
3083    });
3084    const mergeItem = (item, setItems, canDeleteFromMap = false) => {
3085      let prevItem;
3086      setItems((items2) => {
3087        const index = items2.findIndex(({ id }) => id === item.id);
3088        const nextItems = items2.slice();
3089        if (index !== -1) {
3090          prevItem = items2[index];
3091          const nextItem = _chunks_3YLGPPWQ_spreadValues(_chunks_3YLGPPWQ_spreadValues({}, prevItem), item);
3092          nextItems[index] = nextItem;
3093          itemsMap.set(item.id, nextItem);
3094        } else {
3095          nextItems.push(item);
3096          itemsMap.set(item.id, item);
3097        }
3098        return nextItems;
3099      });
3100      const unmergeItem = () => {
3101        setItems((items2) => {
3102          if (!prevItem) {
3103            if (canDeleteFromMap) {
3104              itemsMap.delete(item.id);
3105            }
3106            return items2.filter(({ id }) => id !== item.id);
3107          }
3108          const index = items2.findIndex(({ id }) => id === item.id);
3109          if (index === -1) return items2;
3110          const nextItems = items2.slice();
3111          nextItems[index] = prevItem;
3112          itemsMap.set(item.id, prevItem);
3113          return nextItems;
3114        });
3115      };
3116      return unmergeItem;
3117    };
3118    const registerItem = (item) => mergeItem(
3119      item,
3120      (getItems) => privateStore.setState("items", getItems),
3121      true
3122    );
3123    return _chunks_3YLGPPWQ_spreadProps(_chunks_3YLGPPWQ_spreadValues({}, collection), {
3124      registerItem,
3125      renderItem: (item) => chain(
3126        registerItem(item),
3127        mergeItem(
3128          item,
3129          (getItems) => privateStore.setState("renderedItems", getItems)
3130        )
3131      ),
3132      item: (id) => {
3133        if (!id) return null;
3134        let item = itemsMap.get(id);
3135        if (!item) {
3136          const { items: items2 } = collection.getState();
3137          item = items2.find((item2) => item2.id === id);
3138          if (item) {
3139            itemsMap.set(id, item);
3140          }
3141        }
3142        return item || null;
3143      },
3144      // @ts-expect-error Internal
3145      __unstablePrivateStore: privateStore
3146    });
3147  }
3148  
3149  
3150  
3151  ;// CONCATENATED MODULE: ./node_modules/@ariakit/core/esm/__chunks/7PRQYBBV.js
3152  "use client";
3153  
3154  // src/utils/array.ts
3155  function toArray(arg) {
3156    if (Array.isArray(arg)) {
3157      return arg;
3158    }
3159    return typeof arg !== "undefined" ? [arg] : [];
3160  }
3161  function addItemToArray(array, item, index = -1) {
3162    if (!(index in array)) {
3163      return [...array, item];
3164    }
3165    return [...array.slice(0, index), item, ...array.slice(index)];
3166  }
3167  function flatten2DArray(array) {
3168    const flattened = [];
3169    for (const row of array) {
3170      flattened.push(...row);
3171    }
3172    return flattened;
3173  }
3174  function reverseArray(array) {
3175    return array.slice().reverse();
3176  }
3177  
3178  
3179  
3180  ;// CONCATENATED MODULE: ./node_modules/@ariakit/core/esm/__chunks/D7EIQZAU.js
3181  "use client";
3182  
3183  
3184  
3185  
3186  
3187  
3188  // src/composite/composite-store.ts
3189  var NULL_ITEM = { id: null };
3190  function findFirstEnabledItem(items, excludeId) {
3191    return items.find((item) => {
3192      if (excludeId) {
3193        return !item.disabled && item.id !== excludeId;
3194      }
3195      return !item.disabled;
3196    });
3197  }
3198  function getEnabledItems(items, excludeId) {
3199    return items.filter((item) => {
3200      if (excludeId) {
3201        return !item.disabled && item.id !== excludeId;
3202      }
3203      return !item.disabled;
3204    });
3205  }
3206  function getOppositeOrientation(orientation) {
3207    if (orientation === "vertical") return "horizontal";
3208    if (orientation === "horizontal") return "vertical";
3209    return;
3210  }
3211  function getItemsInRow(items, rowId) {
3212    return items.filter((item) => item.rowId === rowId);
3213  }
3214  function flipItems(items, activeId, shouldInsertNullItem = false) {
3215    const index = items.findIndex((item) => item.id === activeId);
3216    return [
3217      ...items.slice(index + 1),
3218      ...shouldInsertNullItem ? [NULL_ITEM] : [],
3219      ...items.slice(0, index)
3220    ];
3221  }
3222  function groupItemsByRows(items) {
3223    const rows = [];
3224    for (const item of items) {
3225      const row = rows.find((currentRow) => {
3226        var _a;
3227        return ((_a = currentRow[0]) == null ? void 0 : _a.rowId) === item.rowId;
3228      });
3229      if (row) {
3230        row.push(item);
3231      } else {
3232        rows.push([item]);
3233      }
3234    }
3235    return rows;
3236  }
3237  function getMaxRowLength(array) {
3238    let maxLength = 0;
3239    for (const { length } of array) {
3240      if (length > maxLength) {
3241        maxLength = length;
3242      }
3243    }
3244    return maxLength;
3245  }
3246  function createEmptyItem(rowId) {
3247    return {
3248      id: "__EMPTY_ITEM__",
3249      disabled: true,
3250      rowId
3251    };
3252  }
3253  function normalizeRows(rows, activeId, focusShift) {
3254    const maxLength = getMaxRowLength(rows);
3255    for (const row of rows) {
3256      for (let i = 0; i < maxLength; i += 1) {
3257        const item = row[i];
3258        if (!item || focusShift && item.disabled) {
3259          const isFirst = i === 0;
3260          const previousItem = isFirst && focusShift ? findFirstEnabledItem(row) : row[i - 1];
3261          row[i] = previousItem && activeId !== previousItem.id && focusShift ? previousItem : createEmptyItem(previousItem == null ? void 0 : previousItem.rowId);
3262        }
3263      }
3264    }
3265    return rows;
3266  }
3267  function verticalizeItems(items) {
3268    const rows = groupItemsByRows(items);
3269    const maxLength = getMaxRowLength(rows);
3270    const verticalized = [];
3271    for (let i = 0; i < maxLength; i += 1) {
3272      for (const row of rows) {
3273        const item = row[i];
3274        if (item) {
3275          verticalized.push(_chunks_3YLGPPWQ_spreadProps(_chunks_3YLGPPWQ_spreadValues({}, item), {
3276            // If there's no rowId, it means that it's not a grid composite, but
3277            // a single row instead. So, instead of verticalizing it, that is,
3278            // assigning a different rowId based on the column index, we keep it
3279            // undefined so they will be part of the same row. This is useful
3280            // when using up/down on one-dimensional composites.
3281            rowId: item.rowId ? `$i}` : void 0
3282          }));
3283        }
3284      }
3285    }
3286    return verticalized;
3287  }
3288  function createCompositeStore(props = {}) {
3289    var _a;
3290    const syncState = (_a = props.store) == null ? void 0 : _a.getState();
3291    const collection = createCollectionStore(props);
3292    const activeId = defaultValue(
3293      props.activeId,
3294      syncState == null ? void 0 : syncState.activeId,
3295      props.defaultActiveId
3296    );
3297    const initialState = _chunks_3YLGPPWQ_spreadProps(_chunks_3YLGPPWQ_spreadValues({}, collection.getState()), {
3298      activeId,
3299      baseElement: defaultValue(syncState == null ? void 0 : syncState.baseElement, null),
3300      includesBaseElement: defaultValue(
3301        props.includesBaseElement,
3302        syncState == null ? void 0 : syncState.includesBaseElement,
3303        activeId === null
3304      ),
3305      moves: defaultValue(syncState == null ? void 0 : syncState.moves, 0),
3306      orientation: defaultValue(
3307        props.orientation,
3308        syncState == null ? void 0 : syncState.orientation,
3309        "both"
3310      ),
3311      rtl: defaultValue(props.rtl, syncState == null ? void 0 : syncState.rtl, false),
3312      virtualFocus: defaultValue(
3313        props.virtualFocus,
3314        syncState == null ? void 0 : syncState.virtualFocus,
3315        false
3316      ),
3317      focusLoop: defaultValue(props.focusLoop, syncState == null ? void 0 : syncState.focusLoop, false),
3318      focusWrap: defaultValue(props.focusWrap, syncState == null ? void 0 : syncState.focusWrap, false),
3319      focusShift: defaultValue(props.focusShift, syncState == null ? void 0 : syncState.focusShift, false)
3320    });
3321    const composite = createStore(initialState, collection, props.store);
3322    setup(
3323      composite,
3324      () => sync(composite, ["renderedItems", "activeId"], (state) => {
3325        composite.setState("activeId", (activeId2) => {
3326          var _a2;
3327          if (activeId2 !== void 0) return activeId2;
3328          return (_a2 = findFirstEnabledItem(state.renderedItems)) == null ? void 0 : _a2.id;
3329        });
3330      })
3331    );
3332    const getNextId = (items, orientation, hasNullItem, skip) => {
3333      var _a2, _b;
3334      const { activeId: activeId2, rtl, focusLoop, focusWrap, includesBaseElement } = composite.getState();
3335      const isHorizontal = orientation !== "vertical";
3336      const isRTL = rtl && isHorizontal;
3337      const allItems = isRTL ? reverseArray(items) : items;
3338      if (activeId2 == null) {
3339        return (_a2 = findFirstEnabledItem(allItems)) == null ? void 0 : _a2.id;
3340      }
3341      const activeItem = allItems.find((item) => item.id === activeId2);
3342      if (!activeItem) {
3343        return (_b = findFirstEnabledItem(allItems)) == null ? void 0 : _b.id;
3344      }
3345      const isGrid = !!activeItem.rowId;
3346      const activeIndex = allItems.indexOf(activeItem);
3347      const nextItems = allItems.slice(activeIndex + 1);
3348      const nextItemsInRow = getItemsInRow(nextItems, activeItem.rowId);
3349      if (skip !== void 0) {
3350        const nextEnabledItemsInRow = getEnabledItems(nextItemsInRow, activeId2);
3351        const nextItem2 = nextEnabledItemsInRow.slice(skip)[0] || // If we can't find an item, just return the last one.
3352        nextEnabledItemsInRow[nextEnabledItemsInRow.length - 1];
3353        return nextItem2 == null ? void 0 : nextItem2.id;
3354      }
3355      const oppositeOrientation = getOppositeOrientation(
3356        // If it's a grid and orientation is not set, it's a next/previous call,
3357        // which is inherently horizontal. up/down will call next with orientation
3358        // set to vertical by default (see below on up/down methods).
3359        isGrid ? orientation || "horizontal" : orientation
3360      );
3361      const canLoop = focusLoop && focusLoop !== oppositeOrientation;
3362      const canWrap = isGrid && focusWrap && focusWrap !== oppositeOrientation;
3363      hasNullItem = hasNullItem || !isGrid && canLoop && includesBaseElement;
3364      if (canLoop) {
3365        const loopItems = canWrap && !hasNullItem ? allItems : getItemsInRow(allItems, activeItem.rowId);
3366        const sortedItems = flipItems(loopItems, activeId2, hasNullItem);
3367        const nextItem2 = findFirstEnabledItem(sortedItems, activeId2);
3368        return nextItem2 == null ? void 0 : nextItem2.id;
3369      }
3370      if (canWrap) {
3371        const nextItem2 = findFirstEnabledItem(
3372          // We can use nextItems, which contains all the next items, including
3373          // items from other rows, to wrap between rows. However, if there is a
3374          // null item (the composite container), we'll only use the next items in
3375          // the row. So moving next from the last item will focus on the
3376          // composite container. On grid composites, horizontal navigation never
3377          // focuses on the composite container, only vertical.
3378          hasNullItem ? nextItemsInRow : nextItems,
3379          activeId2
3380        );
3381        const nextId = hasNullItem ? (nextItem2 == null ? void 0 : nextItem2.id) || null : nextItem2 == null ? void 0 : nextItem2.id;
3382        return nextId;
3383      }
3384      const nextItem = findFirstEnabledItem(nextItemsInRow, activeId2);
3385      if (!nextItem && hasNullItem) {
3386        return null;
3387      }
3388      return nextItem == null ? void 0 : nextItem.id;
3389    };
3390    return _chunks_3YLGPPWQ_spreadProps(_chunks_3YLGPPWQ_spreadValues(_chunks_3YLGPPWQ_spreadValues({}, collection), composite), {
3391      setBaseElement: (element) => composite.setState("baseElement", element),
3392      setActiveId: (id) => composite.setState("activeId", id),
3393      move: (id) => {
3394        if (id === void 0) return;
3395        composite.setState("activeId", id);
3396        composite.setState("moves", (moves) => moves + 1);
3397      },
3398      first: () => {
3399        var _a2;
3400        return (_a2 = findFirstEnabledItem(composite.getState().renderedItems)) == null ? void 0 : _a2.id;
3401      },
3402      last: () => {
3403        var _a2;
3404        return (_a2 = findFirstEnabledItem(reverseArray(composite.getState().renderedItems))) == null ? void 0 : _a2.id;
3405      },
3406      next: (skip) => {
3407        const { renderedItems, orientation } = composite.getState();
3408        return getNextId(renderedItems, orientation, false, skip);
3409      },
3410      previous: (skip) => {
3411        var _a2;
3412        const { renderedItems, orientation, includesBaseElement } = composite.getState();
3413        const isGrid = !!((_a2 = findFirstEnabledItem(renderedItems)) == null ? void 0 : _a2.rowId);
3414        const hasNullItem = !isGrid && includesBaseElement;
3415        return getNextId(
3416          reverseArray(renderedItems),
3417          orientation,
3418          hasNullItem,
3419          skip
3420        );
3421      },
3422      down: (skip) => {
3423        const {
3424          activeId: activeId2,
3425          renderedItems,
3426          focusShift,
3427          focusLoop,
3428          includesBaseElement
3429        } = composite.getState();
3430        const shouldShift = focusShift && !skip;
3431        const verticalItems = verticalizeItems(
3432          flatten2DArray(
3433            normalizeRows(groupItemsByRows(renderedItems), activeId2, shouldShift)
3434          )
3435        );
3436        const canLoop = focusLoop && focusLoop !== "horizontal";
3437        const hasNullItem = canLoop && includesBaseElement;
3438        return getNextId(verticalItems, "vertical", hasNullItem, skip);
3439      },
3440      up: (skip) => {
3441        const { activeId: activeId2, renderedItems, focusShift, includesBaseElement } = composite.getState();
3442        const shouldShift = focusShift && !skip;
3443        const verticalItems = verticalizeItems(
3444          reverseArray(
3445            flatten2DArray(
3446              normalizeRows(
3447                groupItemsByRows(renderedItems),
3448                activeId2,
3449                shouldShift
3450              )
3451            )
3452          )
3453        );
3454        const hasNullItem = includesBaseElement;
3455        return getNextId(verticalItems, "vertical", hasNullItem, skip);
3456      }
3457    });
3458  }
3459  
3460  
3461  
3462  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/UVQLZ7T5.js
3463  "use client";
3464  
3465  
3466  
3467  // src/composite/composite-store.ts
3468  
3469  function useCompositeStoreProps(store, update, props) {
3470    store = useCollectionStoreProps(store, update, props);
3471    useStoreProps(store, props, "activeId", "setActiveId");
3472    useStoreProps(store, props, "includesBaseElement");
3473    useStoreProps(store, props, "virtualFocus");
3474    useStoreProps(store, props, "orientation");
3475    useStoreProps(store, props, "rtl");
3476    useStoreProps(store, props, "focusLoop");
3477    useStoreProps(store, props, "focusWrap");
3478    useStoreProps(store, props, "focusShift");
3479    return store;
3480  }
3481  function useCompositeStore(props = {}) {
3482    const [store, update] = _2GXGCHW6_useStore(createCompositeStore, props);
3483    return useCompositeStoreProps(store, update, props);
3484  }
3485  
3486  
3487  
3488  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/5VQZOHHZ.js
3489  "use client";
3490  
3491  // src/composite/utils.ts
3492  
3493  var _5VQZOHHZ_NULL_ITEM = { id: null };
3494  function _5VQZOHHZ_flipItems(items, activeId, shouldInsertNullItem = false) {
3495    const index = items.findIndex((item) => item.id === activeId);
3496    return [
3497      ...items.slice(index + 1),
3498      ...shouldInsertNullItem ? [_5VQZOHHZ_NULL_ITEM] : [],
3499      ...items.slice(0, index)
3500    ];
3501  }
3502  function _5VQZOHHZ_findFirstEnabledItem(items, excludeId) {
3503    return items.find((item) => {
3504      if (excludeId) {
3505        return !item.disabled && item.id !== excludeId;
3506      }
3507      return !item.disabled;
3508    });
3509  }
3510  function getEnabledItem(store, id) {
3511    if (!id) return null;
3512    return store.item(id) || null;
3513  }
3514  function _5VQZOHHZ_groupItemsByRows(items) {
3515    const rows = [];
3516    for (const item of items) {
3517      const row = rows.find((currentRow) => {
3518        var _a;
3519        return ((_a = currentRow[0]) == null ? void 0 : _a.rowId) === item.rowId;
3520      });
3521      if (row) {
3522        row.push(item);
3523      } else {
3524        rows.push([item]);
3525      }
3526    }
3527    return rows;
3528  }
3529  function selectTextField(element, collapseToEnd = false) {
3530    if (isTextField(element)) {
3531      element.setSelectionRange(
3532        collapseToEnd ? element.value.length : 0,
3533        element.value.length
3534      );
3535    } else if (element.isContentEditable) {
3536      const selection = getDocument(element).getSelection();
3537      selection == null ? void 0 : selection.selectAllChildren(element);
3538      if (collapseToEnd) {
3539        selection == null ? void 0 : selection.collapseToEnd();
3540      }
3541    }
3542  }
3543  var FOCUS_SILENTLY = Symbol("FOCUS_SILENTLY");
3544  function focusSilently(element) {
3545    element[FOCUS_SILENTLY] = true;
3546    element.focus({ preventScroll: true });
3547  }
3548  function silentlyFocused(element) {
3549    const isSilentlyFocused = element[FOCUS_SILENTLY];
3550    delete element[FOCUS_SILENTLY];
3551    return isSilentlyFocused;
3552  }
3553  function isItem(store, element, exclude) {
3554    if (!element) return false;
3555    if (element === exclude) return false;
3556    const item = store.item(element.id);
3557    if (!item) return false;
3558    if (exclude && item.element === exclude) return false;
3559    return true;
3560  }
3561  
3562  
3563  
3564  ;// CONCATENATED MODULE: external "ReactJSXRuntime"
3565  const external_ReactJSXRuntime_namespaceObject = window["ReactJSXRuntime"];
3566  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/HKOOKEDE.js
3567  "use client";
3568  
3569  
3570  
3571  
3572  // src/utils/system.tsx
3573  
3574  
3575  function forwardRef2(render) {
3576    const Role = external_React_.forwardRef((props, ref) => render(_3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, props), { ref })));
3577    Role.displayName = render.displayName || render.name;
3578    return Role;
3579  }
3580  function memo2(Component, propsAreEqual) {
3581    return external_React_.memo(Component, propsAreEqual);
3582  }
3583  function HKOOKEDE_createElement(Type, props) {
3584    const _a = props, { wrapElement, render } = _a, rest = __objRest(_a, ["wrapElement", "render"]);
3585    const mergedRef = useMergeRefs(props.ref, getRefProperty(render));
3586    let element;
3587    if (external_React_.isValidElement(render)) {
3588      const renderProps = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, render.props), { ref: mergedRef });
3589      element = external_React_.cloneElement(render, mergeProps(rest, renderProps));
3590    } else if (render) {
3591      element = render(rest);
3592    } else {
3593      element = /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(Type, _3YLGPPWQ_spreadValues({}, rest));
3594    }
3595    if (wrapElement) {
3596      return wrapElement(element);
3597    }
3598    return element;
3599  }
3600  function createHook(useProps) {
3601    const useRole = (props = {}) => {
3602      return useProps(props);
3603    };
3604    useRole.displayName = useProps.name;
3605    return useRole;
3606  }
3607  function createStoreContext(providers = [], scopedProviders = []) {
3608    const context = external_React_.createContext(void 0);
3609    const scopedContext = external_React_.createContext(void 0);
3610    const useContext2 = () => external_React_.useContext(context);
3611    const useScopedContext = (onlyScoped = false) => {
3612      const scoped = external_React_.useContext(scopedContext);
3613      const store = useContext2();
3614      if (onlyScoped) return scoped;
3615      return scoped || store;
3616    };
3617    const useProviderContext = () => {
3618      const scoped = external_React_.useContext(scopedContext);
3619      const store = useContext2();
3620      if (scoped && scoped === store) return;
3621      return store;
3622    };
3623    const ContextProvider = (props) => {
3624      return providers.reduceRight(
3625        (children, Provider) => /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(Provider, _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, props), { children })),
3626        /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(context.Provider, _3YLGPPWQ_spreadValues({}, props))
3627      );
3628    };
3629    const ScopedContextProvider = (props) => {
3630      return /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(ContextProvider, _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, props), { children: scopedProviders.reduceRight(
3631        (children, Provider) => /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(Provider, _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, props), { children })),
3632        /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(scopedContext.Provider, _3YLGPPWQ_spreadValues({}, props))
3633      ) }));
3634    };
3635    return {
3636      context,
3637      scopedContext,
3638      useContext: useContext2,
3639      useScopedContext,
3640      useProviderContext,
3641      ContextProvider,
3642      ScopedContextProvider
3643    };
3644  }
3645  
3646  
3647  
3648  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/FMYQNSCK.js
3649  "use client";
3650  
3651  
3652  // src/collection/collection-context.tsx
3653  var ctx = createStoreContext();
3654  var useCollectionContext = ctx.useContext;
3655  var useCollectionScopedContext = ctx.useScopedContext;
3656  var useCollectionProviderContext = ctx.useProviderContext;
3657  var CollectionContextProvider = ctx.ContextProvider;
3658  var CollectionScopedContextProvider = ctx.ScopedContextProvider;
3659  
3660  
3661  
3662  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/WENSINUV.js
3663  "use client";
3664  
3665  
3666  
3667  // src/composite/composite-context.tsx
3668  
3669  var WENSINUV_ctx = createStoreContext(
3670    [CollectionContextProvider],
3671    [CollectionScopedContextProvider]
3672  );
3673  var useCompositeContext = WENSINUV_ctx.useContext;
3674  var useCompositeScopedContext = WENSINUV_ctx.useScopedContext;
3675  var useCompositeProviderContext = WENSINUV_ctx.useProviderContext;
3676  var CompositeContextProvider = WENSINUV_ctx.ContextProvider;
3677  var CompositeScopedContextProvider = WENSINUV_ctx.ScopedContextProvider;
3678  var CompositeItemContext = (0,external_React_.createContext)(
3679    void 0
3680  );
3681  var CompositeRowContext = (0,external_React_.createContext)(
3682    void 0
3683  );
3684  
3685  
3686  
3687  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/SWN3JYXT.js
3688  "use client";
3689  
3690  // src/focusable/focusable-context.tsx
3691  
3692  var FocusableContext = (0,external_React_.createContext)(true);
3693  
3694  
3695  
3696  ;// CONCATENATED MODULE: ./node_modules/@ariakit/core/esm/utils/focus.js
3697  "use client";
3698  
3699  
3700  
3701  // src/utils/focus.ts
3702  var selector = "input:not([type='hidden']):not([disabled]), select:not([disabled]), textarea:not([disabled]), a[href], button:not([disabled]), [tabindex], summary, iframe, object, embed, area[href], audio[controls], video[controls], [contenteditable]:not([contenteditable='false'])";
3703  function hasNegativeTabIndex(element) {
3704    const tabIndex = Number.parseInt(element.getAttribute("tabindex") || "0", 10);
3705    return tabIndex < 0;
3706  }
3707  function isFocusable(element) {
3708    if (!element.matches(selector)) return false;
3709    if (!isVisible(element)) return false;
3710    if (element.closest("[inert]")) return false;
3711    return true;
3712  }
3713  function isTabbable(element) {
3714    if (!isFocusable(element)) return false;
3715    if (hasNegativeTabIndex(element)) return false;
3716    if (!("form" in element)) return true;
3717    if (!element.form) return true;
3718    if (element.checked) return true;
3719    if (element.type !== "radio") return true;
3720    const radioGroup = element.form.elements.namedItem(element.name);
3721    if (!radioGroup) return true;
3722    if (!("length" in radioGroup)) return true;
3723    const activeElement = getActiveElement(element);
3724    if (!activeElement) return true;
3725    if (activeElement === element) return true;
3726    if (!("form" in activeElement)) return true;
3727    if (activeElement.form !== element.form) return true;
3728    if (activeElement.name !== element.name) return true;
3729    return false;
3730  }
3731  function getAllFocusableIn(container, includeContainer) {
3732    const elements = Array.from(
3733      container.querySelectorAll(selector)
3734    );
3735    if (includeContainer) {
3736      elements.unshift(container);
3737    }
3738    const focusableElements = elements.filter(isFocusable);
3739    focusableElements.forEach((element, i) => {
3740      if (isFrame(element) && element.contentDocument) {
3741        const frameBody = element.contentDocument.body;
3742        focusableElements.splice(i, 1, ...getAllFocusableIn(frameBody));
3743      }
3744    });
3745    return focusableElements;
3746  }
3747  function getAllFocusable(includeBody) {
3748    return getAllFocusableIn(document.body, includeBody);
3749  }
3750  function getFirstFocusableIn(container, includeContainer) {
3751    const [first] = getAllFocusableIn(container, includeContainer);
3752    return first || null;
3753  }
3754  function getFirstFocusable(includeBody) {
3755    return getFirstFocusableIn(document.body, includeBody);
3756  }
3757  function getAllTabbableIn(container, includeContainer, fallbackToFocusable) {
3758    const elements = Array.from(
3759      container.querySelectorAll(selector)
3760    );
3761    const tabbableElements = elements.filter(isTabbable);
3762    if (includeContainer && isTabbable(container)) {
3763      tabbableElements.unshift(container);
3764    }
3765    tabbableElements.forEach((element, i) => {
3766      if (isFrame(element) && element.contentDocument) {
3767        const frameBody = element.contentDocument.body;
3768        const allFrameTabbable = getAllTabbableIn(
3769          frameBody,
3770          false,
3771          fallbackToFocusable
3772        );
3773        tabbableElements.splice(i, 1, ...allFrameTabbable);
3774      }
3775    });
3776    if (!tabbableElements.length && fallbackToFocusable) {
3777      return elements;
3778    }
3779    return tabbableElements;
3780  }
3781  function getAllTabbable(fallbackToFocusable) {
3782    return getAllTabbableIn(document.body, false, fallbackToFocusable);
3783  }
3784  function getFirstTabbableIn(container, includeContainer, fallbackToFocusable) {
3785    const [first] = getAllTabbableIn(
3786      container,
3787      includeContainer,
3788      fallbackToFocusable
3789    );
3790    return first || null;
3791  }
3792  function getFirstTabbable(fallbackToFocusable) {
3793    return getFirstTabbableIn(document.body, false, fallbackToFocusable);
3794  }
3795  function getLastTabbableIn(container, includeContainer, fallbackToFocusable) {
3796    const allTabbable = getAllTabbableIn(
3797      container,
3798      includeContainer,
3799      fallbackToFocusable
3800    );
3801    return allTabbable[allTabbable.length - 1] || null;
3802  }
3803  function getLastTabbable(fallbackToFocusable) {
3804    return getLastTabbableIn(document.body, false, fallbackToFocusable);
3805  }
3806  function getNextTabbableIn(container, includeContainer, fallbackToFirst, fallbackToFocusable) {
3807    const activeElement = getActiveElement(container);
3808    const allFocusable = getAllFocusableIn(container, includeContainer);
3809    const activeIndex = allFocusable.indexOf(activeElement);
3810    const nextFocusableElements = allFocusable.slice(activeIndex + 1);
3811    return nextFocusableElements.find(isTabbable) || (fallbackToFirst ? allFocusable.find(isTabbable) : null) || (fallbackToFocusable ? nextFocusableElements[0] : null) || null;
3812  }
3813  function getNextTabbable(fallbackToFirst, fallbackToFocusable) {
3814    return getNextTabbableIn(
3815      document.body,
3816      false,
3817      fallbackToFirst,
3818      fallbackToFocusable
3819    );
3820  }
3821  function getPreviousTabbableIn(container, includeContainer, fallbackToLast, fallbackToFocusable) {
3822    const activeElement = getActiveElement(container);
3823    const allFocusable = getAllFocusableIn(container, includeContainer).reverse();
3824    const activeIndex = allFocusable.indexOf(activeElement);
3825    const previousFocusableElements = allFocusable.slice(activeIndex + 1);
3826    return previousFocusableElements.find(isTabbable) || (fallbackToLast ? allFocusable.find(isTabbable) : null) || (fallbackToFocusable ? previousFocusableElements[0] : null) || null;
3827  }
3828  function getPreviousTabbable(fallbackToFirst, fallbackToFocusable) {
3829    return getPreviousTabbableIn(
3830      document.body,
3831      false,
3832      fallbackToFirst,
3833      fallbackToFocusable
3834    );
3835  }
3836  function getClosestFocusable(element) {
3837    while (element && !isFocusable(element)) {
3838      element = element.closest(selector);
3839    }
3840    return element || null;
3841  }
3842  function hasFocus(element) {
3843    const activeElement = getActiveElement(element);
3844    if (!activeElement) return false;
3845    if (activeElement === element) return true;
3846    const activeDescendant = activeElement.getAttribute("aria-activedescendant");
3847    if (!activeDescendant) return false;
3848    return activeDescendant === element.id;
3849  }
3850  function hasFocusWithin(element) {
3851    const activeElement = getActiveElement(element);
3852    if (!activeElement) return false;
3853    if (contains(element, activeElement)) return true;
3854    const activeDescendant = activeElement.getAttribute("aria-activedescendant");
3855    if (!activeDescendant) return false;
3856    if (!("id" in element)) return false;
3857    if (activeDescendant === element.id) return true;
3858    return !!element.querySelector(`#$CSS.escape(activeDescendant)}`);
3859  }
3860  function focusIfNeeded(element) {
3861    if (!hasFocusWithin(element) && isFocusable(element)) {
3862      element.focus();
3863    }
3864  }
3865  function disableFocus(element) {
3866    var _a;
3867    const currentTabindex = (_a = element.getAttribute("tabindex")) != null ? _a : "";
3868    element.setAttribute("data-tabindex", currentTabindex);
3869    element.setAttribute("tabindex", "-1");
3870  }
3871  function disableFocusIn(container, includeContainer) {
3872    const tabbableElements = getAllTabbableIn(container, includeContainer);
3873    for (const element of tabbableElements) {
3874      disableFocus(element);
3875    }
3876  }
3877  function restoreFocusIn(container) {
3878    const elements = container.querySelectorAll("[data-tabindex]");
3879    const restoreTabIndex = (element) => {
3880      const tabindex = element.getAttribute("data-tabindex");
3881      element.removeAttribute("data-tabindex");
3882      if (tabindex) {
3883        element.setAttribute("tabindex", tabindex);
3884      } else {
3885        element.removeAttribute("tabindex");
3886      }
3887    };
3888    if (container.hasAttribute("data-tabindex")) {
3889      restoreTabIndex(container);
3890    }
3891    for (const element of elements) {
3892      restoreTabIndex(element);
3893    }
3894  }
3895  function focusIntoView(element, options) {
3896    if (!("scrollIntoView" in element)) {
3897      element.focus();
3898    } else {
3899      element.focus({ preventScroll: true });
3900      element.scrollIntoView(_chunks_3YLGPPWQ_spreadValues({ block: "nearest", inline: "nearest" }, options));
3901    }
3902  }
3903  
3904  
3905  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/OD7ALSX5.js
3906  "use client";
3907  
3908  
3909  
3910  
3911  
3912  // src/focusable/focusable.tsx
3913  
3914  
3915  
3916  
3917  
3918  
3919  var TagName = "div";
3920  var isSafariBrowser = isSafari();
3921  var alwaysFocusVisibleInputTypes = [
3922    "text",
3923    "search",
3924    "url",
3925    "tel",
3926    "email",
3927    "password",
3928    "number",
3929    "date",
3930    "month",
3931    "week",
3932    "time",
3933    "datetime",
3934    "datetime-local"
3935  ];
3936  var safariFocusAncestorSymbol = Symbol("safariFocusAncestor");
3937  function isSafariFocusAncestor(element) {
3938    if (!element) return false;
3939    return !!element[safariFocusAncestorSymbol];
3940  }
3941  function markSafariFocusAncestor(element, value) {
3942    if (!element) return;
3943    element[safariFocusAncestorSymbol] = value;
3944  }
3945  function isAlwaysFocusVisible(element) {
3946    const { tagName, readOnly, type } = element;
3947    if (tagName === "TEXTAREA" && !readOnly) return true;
3948    if (tagName === "SELECT" && !readOnly) return true;
3949    if (tagName === "INPUT" && !readOnly) {
3950      return alwaysFocusVisibleInputTypes.includes(type);
3951    }
3952    if (element.isContentEditable) return true;
3953    const role = element.getAttribute("role");
3954    if (role === "combobox" && element.dataset.name) {
3955      return true;
3956    }
3957    return false;
3958  }
3959  function getLabels(element) {
3960    if ("labels" in element) {
3961      return element.labels;
3962    }
3963    return null;
3964  }
3965  function isNativeCheckboxOrRadio(element) {
3966    const tagName = element.tagName.toLowerCase();
3967    if (tagName === "input" && element.type) {
3968      return element.type === "radio" || element.type === "checkbox";
3969    }
3970    return false;
3971  }
3972  function isNativeTabbable(tagName) {
3973    if (!tagName) return true;
3974    return tagName === "button" || tagName === "summary" || tagName === "input" || tagName === "select" || tagName === "textarea" || tagName === "a";
3975  }
3976  function supportsDisabledAttribute(tagName) {
3977    if (!tagName) return true;
3978    return tagName === "button" || tagName === "input" || tagName === "select" || tagName === "textarea";
3979  }
3980  function getTabIndex(focusable, trulyDisabled, nativeTabbable, supportsDisabled, tabIndexProp) {
3981    if (!focusable) {
3982      return tabIndexProp;
3983    }
3984    if (trulyDisabled) {
3985      if (nativeTabbable && !supportsDisabled) {
3986        return -1;
3987      }
3988      return;
3989    }
3990    if (nativeTabbable) {
3991      return tabIndexProp;
3992    }
3993    return tabIndexProp || 0;
3994  }
3995  function useDisableEvent(onEvent, disabled) {
3996    return useEvent((event) => {
3997      onEvent == null ? void 0 : onEvent(event);
3998      if (event.defaultPrevented) return;
3999      if (disabled) {
4000        event.stopPropagation();
4001        event.preventDefault();
4002      }
4003    });
4004  }
4005  var isKeyboardModality = true;
4006  function onGlobalMouseDown(event) {
4007    const target = event.target;
4008    if (target && "hasAttribute" in target) {
4009      if (!target.hasAttribute("data-focus-visible")) {
4010        isKeyboardModality = false;
4011      }
4012    }
4013  }
4014  function onGlobalKeyDown(event) {
4015    if (event.metaKey) return;
4016    if (event.ctrlKey) return;
4017    if (event.altKey) return;
4018    isKeyboardModality = true;
4019  }
4020  var useFocusable = createHook(
4021    function useFocusable2(_a) {
4022      var _b = _a, {
4023        focusable = true,
4024        accessibleWhenDisabled,
4025        autoFocus,
4026        onFocusVisible
4027      } = _b, props = __objRest(_b, [
4028        "focusable",
4029        "accessibleWhenDisabled",
4030        "autoFocus",
4031        "onFocusVisible"
4032      ]);
4033      const ref = (0,external_React_.useRef)(null);
4034      (0,external_React_.useEffect)(() => {
4035        if (!focusable) return;
4036        addGlobalEventListener("mousedown", onGlobalMouseDown, true);
4037        addGlobalEventListener("keydown", onGlobalKeyDown, true);
4038      }, [focusable]);
4039      if (isSafariBrowser) {
4040        (0,external_React_.useEffect)(() => {
4041          if (!focusable) return;
4042          const element = ref.current;
4043          if (!element) return;
4044          if (!isNativeCheckboxOrRadio(element)) return;
4045          const labels = getLabels(element);
4046          if (!labels) return;
4047          const onMouseUp = () => queueMicrotask(() => element.focus());
4048          for (const label of labels) {
4049            label.addEventListener("mouseup", onMouseUp);
4050          }
4051          return () => {
4052            for (const label of labels) {
4053              label.removeEventListener("mouseup", onMouseUp);
4054            }
4055          };
4056        }, [focusable]);
4057      }
4058      const disabled = focusable && disabledFromProps(props);
4059      const trulyDisabled = !!disabled && !accessibleWhenDisabled;
4060      const [focusVisible, setFocusVisible] = (0,external_React_.useState)(false);
4061      (0,external_React_.useEffect)(() => {
4062        if (!focusable) return;
4063        if (trulyDisabled && focusVisible) {
4064          setFocusVisible(false);
4065        }
4066      }, [focusable, trulyDisabled, focusVisible]);
4067      (0,external_React_.useEffect)(() => {
4068        if (!focusable) return;
4069        if (!focusVisible) return;
4070        const element = ref.current;
4071        if (!element) return;
4072        if (typeof IntersectionObserver === "undefined") return;
4073        const observer = new IntersectionObserver(() => {
4074          if (!isFocusable(element)) {
4075            setFocusVisible(false);
4076          }
4077        });
4078        observer.observe(element);
4079        return () => observer.disconnect();
4080      }, [focusable, focusVisible]);
4081      const onKeyPressCapture = useDisableEvent(
4082        props.onKeyPressCapture,
4083        disabled
4084      );
4085      const onMouseDownCapture = useDisableEvent(
4086        props.onMouseDownCapture,
4087        disabled
4088      );
4089      const onClickCapture = useDisableEvent(props.onClickCapture, disabled);
4090      const onMouseDownProp = props.onMouseDown;
4091      const onMouseDown = useEvent((event) => {
4092        onMouseDownProp == null ? void 0 : onMouseDownProp(event);
4093        if (event.defaultPrevented) return;
4094        if (!focusable) return;
4095        const element = event.currentTarget;
4096        if (!isSafariBrowser) return;
4097        if (isPortalEvent(event)) return;
4098        if (!isButton(element) && !isNativeCheckboxOrRadio(element)) return;
4099        let receivedFocus = false;
4100        const onFocus = () => {
4101          receivedFocus = true;
4102        };
4103        const options = { capture: true, once: true };
4104        element.addEventListener("focusin", onFocus, options);
4105        const focusableContainer = getClosestFocusable(element.parentElement);
4106        markSafariFocusAncestor(focusableContainer, true);
4107        queueBeforeEvent(element, "mouseup", () => {
4108          element.removeEventListener("focusin", onFocus, true);
4109          markSafariFocusAncestor(focusableContainer, false);
4110          if (receivedFocus) return;
4111          focusIfNeeded(element);
4112        });
4113      });
4114      const handleFocusVisible = (event, currentTarget) => {
4115        if (currentTarget) {
4116          event.currentTarget = currentTarget;
4117        }
4118        if (!focusable) return;
4119        const element = event.currentTarget;
4120        if (!element) return;
4121        if (!hasFocus(element)) return;
4122        onFocusVisible == null ? void 0 : onFocusVisible(event);
4123        if (event.defaultPrevented) return;
4124        element.dataset.focusVisible = "true";
4125        setFocusVisible(true);
4126      };
4127      const onKeyDownCaptureProp = props.onKeyDownCapture;
4128      const onKeyDownCapture = useEvent((event) => {
4129        onKeyDownCaptureProp == null ? void 0 : onKeyDownCaptureProp(event);
4130        if (event.defaultPrevented) return;
4131        if (!focusable) return;
4132        if (focusVisible) return;
4133        if (event.metaKey) return;
4134        if (event.altKey) return;
4135        if (event.ctrlKey) return;
4136        if (!isSelfTarget(event)) return;
4137        const element = event.currentTarget;
4138        const applyFocusVisible = () => handleFocusVisible(event, element);
4139        queueBeforeEvent(element, "focusout", applyFocusVisible);
4140      });
4141      const onFocusCaptureProp = props.onFocusCapture;
4142      const onFocusCapture = useEvent((event) => {
4143        onFocusCaptureProp == null ? void 0 : onFocusCaptureProp(event);
4144        if (event.defaultPrevented) return;
4145        if (!focusable) return;
4146        if (!isSelfTarget(event)) {
4147          setFocusVisible(false);
4148          return;
4149        }
4150        const element = event.currentTarget;
4151        const applyFocusVisible = () => handleFocusVisible(event, element);
4152        if (isKeyboardModality || isAlwaysFocusVisible(event.target)) {
4153          queueBeforeEvent(event.target, "focusout", applyFocusVisible);
4154        } else {
4155          setFocusVisible(false);
4156        }
4157      });
4158      const onBlurProp = props.onBlur;
4159      const onBlur = useEvent((event) => {
4160        onBlurProp == null ? void 0 : onBlurProp(event);
4161        if (!focusable) return;
4162        if (!isFocusEventOutside(event)) return;
4163        setFocusVisible(false);
4164      });
4165      const autoFocusOnShow = (0,external_React_.useContext)(FocusableContext);
4166      const autoFocusRef = useEvent((element) => {
4167        if (!focusable) return;
4168        if (!autoFocus) return;
4169        if (!element) return;
4170        if (!autoFocusOnShow) return;
4171        queueMicrotask(() => {
4172          if (hasFocus(element)) return;
4173          if (!isFocusable(element)) return;
4174          element.focus();
4175        });
4176      });
4177      const tagName = useTagName(ref);
4178      const nativeTabbable = focusable && isNativeTabbable(tagName);
4179      const supportsDisabled = focusable && supportsDisabledAttribute(tagName);
4180      const styleProp = props.style;
4181      const style = (0,external_React_.useMemo)(() => {
4182        if (trulyDisabled) {
4183          return _3YLGPPWQ_spreadValues({ pointerEvents: "none" }, styleProp);
4184        }
4185        return styleProp;
4186      }, [trulyDisabled, styleProp]);
4187      props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({
4188        "data-focus-visible": focusable && focusVisible || void 0,
4189        "data-autofocus": autoFocus || void 0,
4190        "aria-disabled": disabled || void 0
4191      }, props), {
4192        ref: useMergeRefs(ref, autoFocusRef, props.ref),
4193        style,
4194        tabIndex: getTabIndex(
4195          focusable,
4196          trulyDisabled,
4197          nativeTabbable,
4198          supportsDisabled,
4199          props.tabIndex
4200        ),
4201        disabled: supportsDisabled && trulyDisabled ? true : void 0,
4202        // TODO: Test Focusable contentEditable.
4203        contentEditable: disabled ? void 0 : props.contentEditable,
4204        onKeyPressCapture,
4205        onClickCapture,
4206        onMouseDownCapture,
4207        onMouseDown,
4208        onKeyDownCapture,
4209        onFocusCapture,
4210        onBlur
4211      });
4212      return removeUndefinedValues(props);
4213    }
4214  );
4215  var Focusable = forwardRef2(function Focusable2(props) {
4216    const htmlProps = useFocusable(props);
4217    return HKOOKEDE_createElement(TagName, htmlProps);
4218  });
4219  
4220  
4221  
4222  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/2BDG6X5K.js
4223  "use client";
4224  
4225  
4226  
4227  
4228  
4229  
4230  
4231  // src/composite/composite.tsx
4232  
4233  
4234  
4235  
4236  
4237  
4238  
4239  var _2BDG6X5K_TagName = "div";
4240  function isGrid(items) {
4241    return items.some((item) => !!item.rowId);
4242  }
4243  function isPrintableKey(event) {
4244    const target = event.target;
4245    if (target && !isTextField(target)) return false;
4246    return event.key.length === 1 && !event.ctrlKey && !event.metaKey;
4247  }
4248  function isModifierKey(event) {
4249    return event.key === "Shift" || event.key === "Control" || event.key === "Alt" || event.key === "Meta";
4250  }
4251  function useKeyboardEventProxy(store, onKeyboardEvent, previousElementRef) {
4252    return useEvent((event) => {
4253      var _a;
4254      onKeyboardEvent == null ? void 0 : onKeyboardEvent(event);
4255      if (event.defaultPrevented) return;
4256      if (event.isPropagationStopped()) return;
4257      if (!isSelfTarget(event)) return;
4258      if (isModifierKey(event)) return;
4259      if (isPrintableKey(event)) return;
4260      const state = store.getState();
4261      const activeElement = (_a = getEnabledItem(store, state.activeId)) == null ? void 0 : _a.element;
4262      if (!activeElement) return;
4263      const _b = event, { view } = _b, eventInit = __objRest(_b, ["view"]);
4264      const previousElement = previousElementRef == null ? void 0 : previousElementRef.current;
4265      if (activeElement !== previousElement) {
4266        activeElement.focus();
4267      }
4268      if (!fireKeyboardEvent(activeElement, event.type, eventInit)) {
4269        event.preventDefault();
4270      }
4271      if (event.currentTarget.contains(activeElement)) {
4272        event.stopPropagation();
4273      }
4274    });
4275  }
4276  function findFirstEnabledItemInTheLastRow(items) {
4277    return _5VQZOHHZ_findFirstEnabledItem(
4278      flatten2DArray(reverseArray(_5VQZOHHZ_groupItemsByRows(items)))
4279    );
4280  }
4281  function useScheduleFocus(store) {
4282    const [scheduled, setScheduled] = (0,external_React_.useState)(false);
4283    const schedule = (0,external_React_.useCallback)(() => setScheduled(true), []);
4284    const activeItem = store.useState(
4285      (state) => getEnabledItem(store, state.activeId)
4286    );
4287    (0,external_React_.useEffect)(() => {
4288      const activeElement = activeItem == null ? void 0 : activeItem.element;
4289      if (!scheduled) return;
4290      if (!activeElement) return;
4291      setScheduled(false);
4292      activeElement.focus({ preventScroll: true });
4293    }, [activeItem, scheduled]);
4294    return schedule;
4295  }
4296  var useComposite = createHook(
4297    function useComposite2(_a) {
4298      var _b = _a, {
4299        store,
4300        composite = true,
4301        focusOnMove = composite,
4302        moveOnKeyPress = true
4303      } = _b, props = __objRest(_b, [
4304        "store",
4305        "composite",
4306        "focusOnMove",
4307        "moveOnKeyPress"
4308      ]);
4309      const context = useCompositeProviderContext();
4310      store = store || context;
4311      invariant(
4312        store,
4313         false && 0
4314      );
4315      const ref = (0,external_React_.useRef)(null);
4316      const previousElementRef = (0,external_React_.useRef)(null);
4317      const scheduleFocus = useScheduleFocus(store);
4318      const moves = store.useState("moves");
4319      const [, setBaseElement] = useTransactionState(
4320        composite ? store.setBaseElement : null
4321      );
4322      (0,external_React_.useEffect)(() => {
4323        var _a2;
4324        if (!store) return;
4325        if (!moves) return;
4326        if (!composite) return;
4327        if (!focusOnMove) return;
4328        const { activeId: activeId2 } = store.getState();
4329        const itemElement = (_a2 = getEnabledItem(store, activeId2)) == null ? void 0 : _a2.element;
4330        if (!itemElement) return;
4331        focusIntoView(itemElement);
4332      }, [store, moves, composite, focusOnMove]);
4333      useSafeLayoutEffect(() => {
4334        if (!store) return;
4335        if (!moves) return;
4336        if (!composite) return;
4337        const { baseElement, activeId: activeId2 } = store.getState();
4338        const isSelfAcive = activeId2 === null;
4339        if (!isSelfAcive) return;
4340        if (!baseElement) return;
4341        const previousElement = previousElementRef.current;
4342        previousElementRef.current = null;
4343        if (previousElement) {
4344          fireBlurEvent(previousElement, { relatedTarget: baseElement });
4345        }
4346        if (!hasFocus(baseElement)) {
4347          baseElement.focus();
4348        }
4349      }, [store, moves, composite]);
4350      const activeId = store.useState("activeId");
4351      const virtualFocus = store.useState("virtualFocus");
4352      useSafeLayoutEffect(() => {
4353        var _a2;
4354        if (!store) return;
4355        if (!composite) return;
4356        if (!virtualFocus) return;
4357        const previousElement = previousElementRef.current;
4358        previousElementRef.current = null;
4359        if (!previousElement) return;
4360        const activeElement = (_a2 = getEnabledItem(store, activeId)) == null ? void 0 : _a2.element;
4361        const relatedTarget = activeElement || getActiveElement(previousElement);
4362        if (relatedTarget === previousElement) return;
4363        fireBlurEvent(previousElement, { relatedTarget });
4364      }, [store, activeId, virtualFocus, composite]);
4365      const onKeyDownCapture = useKeyboardEventProxy(
4366        store,
4367        props.onKeyDownCapture,
4368        previousElementRef
4369      );
4370      const onKeyUpCapture = useKeyboardEventProxy(
4371        store,
4372        props.onKeyUpCapture,
4373        previousElementRef
4374      );
4375      const onFocusCaptureProp = props.onFocusCapture;
4376      const onFocusCapture = useEvent((event) => {
4377        onFocusCaptureProp == null ? void 0 : onFocusCaptureProp(event);
4378        if (event.defaultPrevented) return;
4379        if (!store) return;
4380        const { virtualFocus: virtualFocus2 } = store.getState();
4381        if (!virtualFocus2) return;
4382        const previousActiveElement = event.relatedTarget;
4383        const isSilentlyFocused = silentlyFocused(event.currentTarget);
4384        if (isSelfTarget(event) && isSilentlyFocused) {
4385          event.stopPropagation();
4386          previousElementRef.current = previousActiveElement;
4387        }
4388      });
4389      const onFocusProp = props.onFocus;
4390      const onFocus = useEvent((event) => {
4391        onFocusProp == null ? void 0 : onFocusProp(event);
4392        if (event.defaultPrevented) return;
4393        if (!composite) return;
4394        if (!store) return;
4395        const { relatedTarget } = event;
4396        const { virtualFocus: virtualFocus2 } = store.getState();
4397        if (virtualFocus2) {
4398          if (isSelfTarget(event) && !isItem(store, relatedTarget)) {
4399            queueMicrotask(scheduleFocus);
4400          }
4401        } else if (isSelfTarget(event)) {
4402          store.setActiveId(null);
4403        }
4404      });
4405      const onBlurCaptureProp = props.onBlurCapture;
4406      const onBlurCapture = useEvent((event) => {
4407        var _a2;
4408        onBlurCaptureProp == null ? void 0 : onBlurCaptureProp(event);
4409        if (event.defaultPrevented) return;
4410        if (!store) return;
4411        const { virtualFocus: virtualFocus2, activeId: activeId2 } = store.getState();
4412        if (!virtualFocus2) return;
4413        const activeElement = (_a2 = getEnabledItem(store, activeId2)) == null ? void 0 : _a2.element;
4414        const nextActiveElement = event.relatedTarget;
4415        const nextActiveElementIsItem = isItem(store, nextActiveElement);
4416        const previousElement = previousElementRef.current;
4417        previousElementRef.current = null;
4418        if (isSelfTarget(event) && nextActiveElementIsItem) {
4419          if (nextActiveElement === activeElement) {
4420            if (previousElement && previousElement !== nextActiveElement) {
4421              fireBlurEvent(previousElement, event);
4422            }
4423          } else if (activeElement) {
4424            fireBlurEvent(activeElement, event);
4425          } else if (previousElement) {
4426            fireBlurEvent(previousElement, event);
4427          }
4428          event.stopPropagation();
4429        } else {
4430          const targetIsItem = isItem(store, event.target);
4431          if (!targetIsItem && activeElement) {
4432            fireBlurEvent(activeElement, event);
4433          }
4434        }
4435      });
4436      const onKeyDownProp = props.onKeyDown;
4437      const moveOnKeyPressProp = useBooleanEvent(moveOnKeyPress);
4438      const onKeyDown = useEvent((event) => {
4439        var _a2;
4440        onKeyDownProp == null ? void 0 : onKeyDownProp(event);
4441        if (event.defaultPrevented) return;
4442        if (!store) return;
4443        if (!isSelfTarget(event)) return;
4444        const { orientation, items, renderedItems, activeId: activeId2 } = store.getState();
4445        const activeItem = getEnabledItem(store, activeId2);
4446        if ((_a2 = activeItem == null ? void 0 : activeItem.element) == null ? void 0 : _a2.isConnected) return;
4447        const isVertical = orientation !== "horizontal";
4448        const isHorizontal = orientation !== "vertical";
4449        const grid = isGrid(renderedItems);
4450        const isHorizontalKey = event.key === "ArrowLeft" || event.key === "ArrowRight" || event.key === "Home" || event.key === "End";
4451        if (isHorizontalKey && isTextField(event.currentTarget)) return;
4452        const up = () => {
4453          if (grid) {
4454            const item = items && findFirstEnabledItemInTheLastRow(items);
4455            return item == null ? void 0 : item.id;
4456          }
4457          return store == null ? void 0 : store.last();
4458        };
4459        const keyMap = {
4460          ArrowUp: (grid || isVertical) && up,
4461          ArrowRight: (grid || isHorizontal) && store.first,
4462          ArrowDown: (grid || isVertical) && store.first,
4463          ArrowLeft: (grid || isHorizontal) && store.last,
4464          Home: store.first,
4465          End: store.last,
4466          PageUp: store.first,
4467          PageDown: store.last
4468        };
4469        const action = keyMap[event.key];
4470        if (action) {
4471          const id = action();
4472          if (id !== void 0) {
4473            if (!moveOnKeyPressProp(event)) return;
4474            event.preventDefault();
4475            store.move(id);
4476          }
4477        }
4478      });
4479      props = useWrapElement(
4480        props,
4481        (element) => /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(CompositeContextProvider, { value: store, children: element }),
4482        [store]
4483      );
4484      const activeDescendant = store.useState((state) => {
4485        var _a2;
4486        if (!store) return;
4487        if (!composite) return;
4488        if (!state.virtualFocus) return;
4489        return (_a2 = getEnabledItem(store, state.activeId)) == null ? void 0 : _a2.id;
4490      });
4491      props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({
4492        "aria-activedescendant": activeDescendant
4493      }, props), {
4494        ref: useMergeRefs(ref, setBaseElement, props.ref),
4495        onKeyDownCapture,
4496        onKeyUpCapture,
4497        onFocusCapture,
4498        onFocus,
4499        onBlurCapture,
4500        onKeyDown
4501      });
4502      const focusable = store.useState(
4503        (state) => composite && (state.virtualFocus || state.activeId === null)
4504      );
4505      props = useFocusable(_3YLGPPWQ_spreadValues({ focusable }, props));
4506      return props;
4507    }
4508  );
4509  var _2BDG6X5K_Composite = forwardRef2(function Composite2(props) {
4510    const htmlProps = useComposite(props);
4511    return HKOOKEDE_createElement(_2BDG6X5K_TagName, htmlProps);
4512  });
4513  
4514  
4515  
4516  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/composite/context.js
4517  /**
4518   * WordPress dependencies
4519   */
4520  
4521  
4522  /**
4523   * Internal dependencies
4524   */
4525  
4526  const CompositeContext = (0,external_wp_element_namespaceObject.createContext)({});
4527  const context_useCompositeContext = () => (0,external_wp_element_namespaceObject.useContext)(CompositeContext);
4528  
4529  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/7HVFURXT.js
4530  "use client";
4531  
4532  // src/group/group-label-context.tsx
4533  
4534  var GroupLabelContext = (0,external_React_.createContext)(void 0);
4535  
4536  
4537  
4538  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/ZPO4YZYE.js
4539  "use client";
4540  
4541  
4542  
4543  
4544  
4545  // src/group/group.tsx
4546  
4547  
4548  
4549  var ZPO4YZYE_TagName = "div";
4550  var useGroup = createHook(
4551    function useGroup2(props) {
4552      const [labelId, setLabelId] = (0,external_React_.useState)();
4553      props = useWrapElement(
4554        props,
4555        (element) => /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(GroupLabelContext.Provider, { value: setLabelId, children: element }),
4556        []
4557      );
4558      props = _3YLGPPWQ_spreadValues({
4559        role: "group",
4560        "aria-labelledby": labelId
4561      }, props);
4562      return removeUndefinedValues(props);
4563    }
4564  );
4565  var Group = forwardRef2(function Group2(props) {
4566    const htmlProps = useGroup(props);
4567    return HKOOKEDE_createElement(ZPO4YZYE_TagName, htmlProps);
4568  });
4569  
4570  
4571  
4572  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/IEKMDIUY.js
4573  "use client";
4574  
4575  
4576  
4577  
4578  // src/composite/composite-group.tsx
4579  var IEKMDIUY_TagName = "div";
4580  var useCompositeGroup = createHook(
4581    function useCompositeGroup2(_a) {
4582      var _b = _a, { store } = _b, props = __objRest(_b, ["store"]);
4583      props = useGroup(props);
4584      return props;
4585    }
4586  );
4587  var IEKMDIUY_CompositeGroup = forwardRef2(function CompositeGroup2(props) {
4588    const htmlProps = useCompositeGroup(props);
4589    return HKOOKEDE_createElement(IEKMDIUY_TagName, htmlProps);
4590  });
4591  
4592  
4593  
4594  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/composite/group.js
4595  /**
4596   * External dependencies
4597   */
4598  
4599  
4600  /**
4601   * WordPress dependencies
4602   */
4603  
4604  
4605  /**
4606   * Internal dependencies
4607   */
4608  
4609  
4610  
4611  const CompositeGroup = (0,external_wp_element_namespaceObject.forwardRef)(function CompositeGroup(props, ref) {
4612    var _props$store;
4613    const context = context_useCompositeContext();
4614  
4615    // @ts-expect-error The store prop is undocumented and only used by the
4616    // legacy compat layer. The `store` prop is documented, but its type is
4617    // obfuscated to discourage its use outside of the component's internals.
4618    const store = (_props$store = props.store) !== null && _props$store !== void 0 ? _props$store : context.store;
4619    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(IEKMDIUY_CompositeGroup, {
4620      store: store,
4621      ...props,
4622      ref: ref
4623    });
4624  });
4625  
4626  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/IGFP5YPG.js
4627  "use client";
4628  
4629  
4630  
4631  
4632  
4633  // src/group/group-label.tsx
4634  
4635  
4636  var IGFP5YPG_TagName = "div";
4637  var useGroupLabel = createHook(
4638    function useGroupLabel2(props) {
4639      const setLabelId = (0,external_React_.useContext)(GroupLabelContext);
4640      const id = useId(props.id);
4641      useSafeLayoutEffect(() => {
4642        setLabelId == null ? void 0 : setLabelId(id);
4643        return () => setLabelId == null ? void 0 : setLabelId(void 0);
4644      }, [setLabelId, id]);
4645      props = _3YLGPPWQ_spreadValues({
4646        id,
4647        "aria-hidden": true
4648      }, props);
4649      return removeUndefinedValues(props);
4650    }
4651  );
4652  var GroupLabel = forwardRef2(function GroupLabel2(props) {
4653    const htmlProps = useGroupLabel(props);
4654    return HKOOKEDE_createElement(IGFP5YPG_TagName, htmlProps);
4655  });
4656  
4657  
4658  
4659  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/Y2MAXF6C.js
4660  "use client";
4661  
4662  
4663  
4664  
4665  // src/composite/composite-group-label.tsx
4666  var Y2MAXF6C_TagName = "div";
4667  var useCompositeGroupLabel = createHook(function useCompositeGroupLabel2(_a) {
4668    var _b = _a, { store } = _b, props = __objRest(_b, ["store"]);
4669    props = useGroupLabel(props);
4670    return props;
4671  });
4672  var Y2MAXF6C_CompositeGroupLabel = forwardRef2(function CompositeGroupLabel2(props) {
4673    const htmlProps = useCompositeGroupLabel(props);
4674    return HKOOKEDE_createElement(Y2MAXF6C_TagName, htmlProps);
4675  });
4676  
4677  
4678  
4679  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/composite/group-label.js
4680  /**
4681   * External dependencies
4682   */
4683  
4684  
4685  /**
4686   * WordPress dependencies
4687   */
4688  
4689  
4690  /**
4691   * Internal dependencies
4692   */
4693  
4694  
4695  
4696  const CompositeGroupLabel = (0,external_wp_element_namespaceObject.forwardRef)(function CompositeGroupLabel(props, ref) {
4697    var _props$store;
4698    const context = context_useCompositeContext();
4699  
4700    // @ts-expect-error The store prop is undocumented and only used by the
4701    // legacy compat layer. The `store` prop is documented, but its type is
4702    // obfuscated to discourage its use outside of the component's internals.
4703    const store = (_props$store = props.store) !== null && _props$store !== void 0 ? _props$store : context.store;
4704    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Y2MAXF6C_CompositeGroupLabel, {
4705      store: store,
4706      ...props,
4707      ref: ref
4708    });
4709  });
4710  
4711  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/composite/hover.js
4712  /**
4713   * External dependencies
4714   */
4715  
4716  
4717  /**
4718   * WordPress dependencies
4719   */
4720  
4721  
4722  /**
4723   * Internal dependencies
4724   */
4725  
4726  
4727  
4728  const CompositeHover = (0,external_wp_element_namespaceObject.forwardRef)(function CompositeHover(props, ref) {
4729    var _props$store;
4730    const context = context_useCompositeContext();
4731  
4732    // @ts-expect-error The store prop is undocumented and only used by the
4733    // legacy compat layer. The `store` prop is documented, but its type is
4734    // obfuscated to discourage its use outside of the component's internals.
4735    const store = (_props$store = props.store) !== null && _props$store !== void 0 ? _props$store : context.store;
4736    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(IEKMDIUY_CompositeGroup, {
4737      store: store,
4738      ...props,
4739      ref: ref
4740    });
4741  });
4742  
4743  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/PLQDTVXM.js
4744  "use client";
4745  
4746  
4747  
4748  
4749  
4750  // src/collection/collection-item.tsx
4751  
4752  
4753  var PLQDTVXM_TagName = "div";
4754  var useCollectionItem = createHook(
4755    function useCollectionItem2(_a) {
4756      var _b = _a, {
4757        store,
4758        shouldRegisterItem = true,
4759        getItem = identity,
4760        element: element
4761      } = _b, props = __objRest(_b, [
4762        "store",
4763        "shouldRegisterItem",
4764        "getItem",
4765        // @ts-expect-error This prop may come from a collection renderer.
4766        "element"
4767      ]);
4768      const context = useCollectionContext();
4769      store = store || context;
4770      const id = useId(props.id);
4771      const ref = (0,external_React_.useRef)(element);
4772      (0,external_React_.useEffect)(() => {
4773        const element2 = ref.current;
4774        if (!id) return;
4775        if (!element2) return;
4776        if (!shouldRegisterItem) return;
4777        const item = getItem({ id, element: element2 });
4778        return store == null ? void 0 : store.renderItem(item);
4779      }, [id, shouldRegisterItem, getItem, store]);
4780      props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, props), {
4781        ref: useMergeRefs(ref, props.ref)
4782      });
4783      return removeUndefinedValues(props);
4784    }
4785  );
4786  var CollectionItem = forwardRef2(function CollectionItem2(props) {
4787    const htmlProps = useCollectionItem(props);
4788    return HKOOKEDE_createElement(PLQDTVXM_TagName, htmlProps);
4789  });
4790  
4791  
4792  
4793  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/HGP5L2ST.js
4794  "use client";
4795  
4796  
4797  
4798  
4799  
4800  // src/command/command.tsx
4801  
4802  
4803  
4804  
4805  
4806  var HGP5L2ST_TagName = "button";
4807  function isNativeClick(event) {
4808    if (!event.isTrusted) return false;
4809    const element = event.currentTarget;
4810    if (event.key === "Enter") {
4811      return isButton(element) || element.tagName === "SUMMARY" || element.tagName === "A";
4812    }
4813    if (event.key === " ") {
4814      return isButton(element) || element.tagName === "SUMMARY" || element.tagName === "INPUT" || element.tagName === "SELECT";
4815    }
4816    return false;
4817  }
4818  var symbol = Symbol("command");
4819  var useCommand = createHook(
4820    function useCommand2(_a) {
4821      var _b = _a, { clickOnEnter = true, clickOnSpace = true } = _b, props = __objRest(_b, ["clickOnEnter", "clickOnSpace"]);
4822      const ref = (0,external_React_.useRef)(null);
4823      const tagName = useTagName(ref);
4824      const type = props.type;
4825      const [isNativeButton, setIsNativeButton] = (0,external_React_.useState)(
4826        () => !!tagName && isButton({ tagName, type })
4827      );
4828      (0,external_React_.useEffect)(() => {
4829        if (!ref.current) return;
4830        setIsNativeButton(isButton(ref.current));
4831      }, []);
4832      const [active, setActive] = (0,external_React_.useState)(false);
4833      const activeRef = (0,external_React_.useRef)(false);
4834      const disabled = disabledFromProps(props);
4835      const [isDuplicate, metadataProps] = useMetadataProps(props, symbol, true);
4836      const onKeyDownProp = props.onKeyDown;
4837      const onKeyDown = useEvent((event) => {
4838        onKeyDownProp == null ? void 0 : onKeyDownProp(event);
4839        const element = event.currentTarget;
4840        if (event.defaultPrevented) return;
4841        if (isDuplicate) return;
4842        if (disabled) return;
4843        if (!isSelfTarget(event)) return;
4844        if (isTextField(element)) return;
4845        if (element.isContentEditable) return;
4846        const isEnter = clickOnEnter && event.key === "Enter";
4847        const isSpace = clickOnSpace && event.key === " ";
4848        const shouldPreventEnter = event.key === "Enter" && !clickOnEnter;
4849        const shouldPreventSpace = event.key === " " && !clickOnSpace;
4850        if (shouldPreventEnter || shouldPreventSpace) {
4851          event.preventDefault();
4852          return;
4853        }
4854        if (isEnter || isSpace) {
4855          const nativeClick = isNativeClick(event);
4856          if (isEnter) {
4857            if (!nativeClick) {
4858              event.preventDefault();
4859              const _a2 = event, { view } = _a2, eventInit = __objRest(_a2, ["view"]);
4860              const click = () => fireClickEvent(element, eventInit);
4861              if (isFirefox()) {
4862                queueBeforeEvent(element, "keyup", click);
4863              } else {
4864                queueMicrotask(click);
4865              }
4866            }
4867          } else if (isSpace) {
4868            activeRef.current = true;
4869            if (!nativeClick) {
4870              event.preventDefault();
4871              setActive(true);
4872            }
4873          }
4874        }
4875      });
4876      const onKeyUpProp = props.onKeyUp;
4877      const onKeyUp = useEvent((event) => {
4878        onKeyUpProp == null ? void 0 : onKeyUpProp(event);
4879        if (event.defaultPrevented) return;
4880        if (isDuplicate) return;
4881        if (disabled) return;
4882        if (event.metaKey) return;
4883        const isSpace = clickOnSpace && event.key === " ";
4884        if (activeRef.current && isSpace) {
4885          activeRef.current = false;
4886          if (!isNativeClick(event)) {
4887            event.preventDefault();
4888            setActive(false);
4889            const element = event.currentTarget;
4890            const _a2 = event, { view } = _a2, eventInit = __objRest(_a2, ["view"]);
4891            queueMicrotask(() => fireClickEvent(element, eventInit));
4892          }
4893        }
4894      });
4895      props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues(_3YLGPPWQ_spreadValues({
4896        "data-active": active || void 0,
4897        type: isNativeButton ? "button" : void 0
4898      }, metadataProps), props), {
4899        ref: useMergeRefs(ref, props.ref),
4900        onKeyDown,
4901        onKeyUp
4902      });
4903      props = useFocusable(props);
4904      return props;
4905    }
4906  );
4907  var Command = forwardRef2(function Command2(props) {
4908    const htmlProps = useCommand(props);
4909    return HKOOKEDE_createElement(HGP5L2ST_TagName, htmlProps);
4910  });
4911  
4912  
4913  
4914  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/7QKWW6TW.js
4915  "use client";
4916  
4917  
4918  
4919  
4920  
4921  
4922  
4923  
4924  
4925  // src/composite/composite-item.tsx
4926  
4927  
4928  
4929  
4930  
4931  
4932  var _7QKWW6TW_TagName = "button";
4933  function isEditableElement(element) {
4934    if (isTextbox(element)) return true;
4935    return element.tagName === "INPUT" && !isButton(element);
4936  }
4937  function getNextPageOffset(scrollingElement, pageUp = false) {
4938    const height = scrollingElement.clientHeight;
4939    const { top } = scrollingElement.getBoundingClientRect();
4940    const pageSize = Math.max(height * 0.875, height - 40) * 1.5;
4941    const pageOffset = pageUp ? height - pageSize + top : pageSize + top;
4942    if (scrollingElement.tagName === "HTML") {
4943      return pageOffset + scrollingElement.scrollTop;
4944    }
4945    return pageOffset;
4946  }
4947  function getItemOffset(itemElement, pageUp = false) {
4948    const { top } = itemElement.getBoundingClientRect();
4949    if (pageUp) {
4950      return top + itemElement.clientHeight;
4951    }
4952    return top;
4953  }
4954  function findNextPageItemId(element, store, next, pageUp = false) {
4955    var _a;
4956    if (!store) return;
4957    if (!next) return;
4958    const { renderedItems } = store.getState();
4959    const scrollingElement = getScrollingElement(element);
4960    if (!scrollingElement) return;
4961    const nextPageOffset = getNextPageOffset(scrollingElement, pageUp);
4962    let id;
4963    let prevDifference;
4964    for (let i = 0; i < renderedItems.length; i += 1) {
4965      const previousId = id;
4966      id = next(i);
4967      if (!id) break;
4968      if (id === previousId) continue;
4969      const itemElement = (_a = getEnabledItem(store, id)) == null ? void 0 : _a.element;
4970      if (!itemElement) continue;
4971      const itemOffset = getItemOffset(itemElement, pageUp);
4972      const difference = itemOffset - nextPageOffset;
4973      const absDifference = Math.abs(difference);
4974      if (pageUp && difference <= 0 || !pageUp && difference >= 0) {
4975        if (prevDifference !== void 0 && prevDifference < absDifference) {
4976          id = previousId;
4977        }
4978        break;
4979      }
4980      prevDifference = absDifference;
4981    }
4982    return id;
4983  }
4984  function targetIsAnotherItem(event, store) {
4985    if (isSelfTarget(event)) return false;
4986    return isItem(store, event.target);
4987  }
4988  var useCompositeItem = createHook(
4989    function useCompositeItem2(_a) {
4990      var _b = _a, {
4991        store,
4992        rowId: rowIdProp,
4993        preventScrollOnKeyDown = false,
4994        moveOnKeyPress = true,
4995        tabbable = false,
4996        getItem: getItemProp,
4997        "aria-setsize": ariaSetSizeProp,
4998        "aria-posinset": ariaPosInSetProp
4999      } = _b, props = __objRest(_b, [
5000        "store",
5001        "rowId",
5002        "preventScrollOnKeyDown",
5003        "moveOnKeyPress",
5004        "tabbable",
5005        "getItem",
5006        "aria-setsize",
5007        "aria-posinset"
5008      ]);
5009      const context = useCompositeContext();
5010      store = store || context;
5011      const id = useId(props.id);
5012      const ref = (0,external_React_.useRef)(null);
5013      const row = (0,external_React_.useContext)(CompositeRowContext);
5014      const rowId = useStoreState(store, (state) => {
5015        if (rowIdProp) return rowIdProp;
5016        if (!state) return;
5017        if (!(row == null ? void 0 : row.baseElement)) return;
5018        if (row.baseElement !== state.baseElement) return;
5019        return row.id;
5020      });
5021      const disabled = disabledFromProps(props);
5022      const trulyDisabled = disabled && !props.accessibleWhenDisabled;
5023      const getItem = (0,external_React_.useCallback)(
5024        (item) => {
5025          const nextItem = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, item), {
5026            id: id || item.id,
5027            rowId,
5028            disabled: !!trulyDisabled
5029          });
5030          if (getItemProp) {
5031            return getItemProp(nextItem);
5032          }
5033          return nextItem;
5034        },
5035        [id, rowId, trulyDisabled, getItemProp]
5036      );
5037      const onFocusProp = props.onFocus;
5038      const hasFocusedComposite = (0,external_React_.useRef)(false);
5039      const onFocus = useEvent((event) => {
5040        onFocusProp == null ? void 0 : onFocusProp(event);
5041        if (event.defaultPrevented) return;
5042        if (isPortalEvent(event)) return;
5043        if (!id) return;
5044        if (!store) return;
5045        if (targetIsAnotherItem(event, store)) return;
5046        const { virtualFocus, baseElement: baseElement2 } = store.getState();
5047        store.setActiveId(id);
5048        if (isTextbox(event.currentTarget)) {
5049          selectTextField(event.currentTarget);
5050        }
5051        if (!virtualFocus) return;
5052        if (!isSelfTarget(event)) return;
5053        if (isEditableElement(event.currentTarget)) return;
5054        if (!(baseElement2 == null ? void 0 : baseElement2.isConnected)) return;
5055        if (isSafari() && event.currentTarget.hasAttribute("data-autofocus")) {
5056          event.currentTarget.scrollIntoView({
5057            block: "nearest",
5058            inline: "nearest"
5059          });
5060        }
5061        hasFocusedComposite.current = true;
5062        const fromComposite = event.relatedTarget === baseElement2 || isItem(store, event.relatedTarget);
5063        if (fromComposite) {
5064          focusSilently(baseElement2);
5065        } else {
5066          baseElement2.focus();
5067        }
5068      });
5069      const onBlurCaptureProp = props.onBlurCapture;
5070      const onBlurCapture = useEvent((event) => {
5071        onBlurCaptureProp == null ? void 0 : onBlurCaptureProp(event);
5072        if (event.defaultPrevented) return;
5073        const state = store == null ? void 0 : store.getState();
5074        if ((state == null ? void 0 : state.virtualFocus) && hasFocusedComposite.current) {
5075          hasFocusedComposite.current = false;
5076          event.preventDefault();
5077          event.stopPropagation();
5078        }
5079      });
5080      const onKeyDownProp = props.onKeyDown;
5081      const preventScrollOnKeyDownProp = useBooleanEvent(preventScrollOnKeyDown);
5082      const moveOnKeyPressProp = useBooleanEvent(moveOnKeyPress);
5083      const onKeyDown = useEvent((event) => {
5084        onKeyDownProp == null ? void 0 : onKeyDownProp(event);
5085        if (event.defaultPrevented) return;
5086        if (!isSelfTarget(event)) return;
5087        if (!store) return;
5088        const { currentTarget } = event;
5089        const state = store.getState();
5090        const item = store.item(id);
5091        const isGrid = !!(item == null ? void 0 : item.rowId);
5092        const isVertical = state.orientation !== "horizontal";
5093        const isHorizontal = state.orientation !== "vertical";
5094        const canHomeEnd = () => {
5095          if (isGrid) return true;
5096          if (isHorizontal) return true;
5097          if (!state.baseElement) return true;
5098          if (!isTextField(state.baseElement)) return true;
5099          return false;
5100        };
5101        const keyMap = {
5102          ArrowUp: (isGrid || isVertical) && store.up,
5103          ArrowRight: (isGrid || isHorizontal) && store.next,
5104          ArrowDown: (isGrid || isVertical) && store.down,
5105          ArrowLeft: (isGrid || isHorizontal) && store.previous,
5106          Home: () => {
5107            if (!canHomeEnd()) return;
5108            if (!isGrid || event.ctrlKey) {
5109              return store == null ? void 0 : store.first();
5110            }
5111            return store == null ? void 0 : store.previous(-1);
5112          },
5113          End: () => {
5114            if (!canHomeEnd()) return;
5115            if (!isGrid || event.ctrlKey) {
5116              return store == null ? void 0 : store.last();
5117            }
5118            return store == null ? void 0 : store.next(-1);
5119          },
5120          PageUp: () => {
5121            return findNextPageItemId(currentTarget, store, store == null ? void 0 : store.up, true);
5122          },
5123          PageDown: () => {
5124            return findNextPageItemId(currentTarget, store, store == null ? void 0 : store.down);
5125          }
5126        };
5127        const action = keyMap[event.key];
5128        if (action) {
5129          if (isTextbox(currentTarget)) {
5130            const selection = getTextboxSelection(currentTarget);
5131            const isLeft = isHorizontal && event.key === "ArrowLeft";
5132            const isRight = isHorizontal && event.key === "ArrowRight";
5133            const isUp = isVertical && event.key === "ArrowUp";
5134            const isDown = isVertical && event.key === "ArrowDown";
5135            if (isRight || isDown) {
5136              const { length: valueLength } = getTextboxValue(currentTarget);
5137              if (selection.end !== valueLength) return;
5138            } else if ((isLeft || isUp) && selection.start !== 0) return;
5139          }
5140          const nextId = action();
5141          if (preventScrollOnKeyDownProp(event) || nextId !== void 0) {
5142            if (!moveOnKeyPressProp(event)) return;
5143            event.preventDefault();
5144            store.move(nextId);
5145          }
5146        }
5147      });
5148      const baseElement = useStoreState(
5149        store,
5150        (state) => (state == null ? void 0 : state.baseElement) || void 0
5151      );
5152      const providerValue = (0,external_React_.useMemo)(
5153        () => ({ id, baseElement }),
5154        [id, baseElement]
5155      );
5156      props = useWrapElement(
5157        props,
5158        (element) => /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(CompositeItemContext.Provider, { value: providerValue, children: element }),
5159        [providerValue]
5160      );
5161      const isActiveItem = useStoreState(
5162        store,
5163        (state) => !!state && state.activeId === id
5164      );
5165      const ariaSetSize = useStoreState(store, (state) => {
5166        if (ariaSetSizeProp != null) return ariaSetSizeProp;
5167        if (!state) return;
5168        if (!(row == null ? void 0 : row.ariaSetSize)) return;
5169        if (row.baseElement !== state.baseElement) return;
5170        return row.ariaSetSize;
5171      });
5172      const ariaPosInSet = useStoreState(store, (state) => {
5173        if (ariaPosInSetProp != null) return ariaPosInSetProp;
5174        if (!state) return;
5175        if (!(row == null ? void 0 : row.ariaPosInSet)) return;
5176        if (row.baseElement !== state.baseElement) return;
5177        const itemsInRow = state.renderedItems.filter(
5178          (item) => item.rowId === rowId
5179        );
5180        return row.ariaPosInSet + itemsInRow.findIndex((item) => item.id === id);
5181      });
5182      const isTabbable = useStoreState(store, (state) => {
5183        if (!(state == null ? void 0 : state.renderedItems.length)) return true;
5184        if (state.virtualFocus) return false;
5185        if (tabbable) return true;
5186        return state.activeId === id;
5187      });
5188      props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({
5189        id,
5190        "data-active-item": isActiveItem || void 0
5191      }, props), {
5192        ref: useMergeRefs(ref, props.ref),
5193        tabIndex: isTabbable ? props.tabIndex : -1,
5194        onFocus,
5195        onBlurCapture,
5196        onKeyDown
5197      });
5198      props = useCommand(props);
5199      props = useCollectionItem(_3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({
5200        store
5201      }, props), {
5202        getItem,
5203        shouldRegisterItem: id ? props.shouldRegisterItem : false
5204      }));
5205      return removeUndefinedValues(_3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, props), {
5206        "aria-setsize": ariaSetSize,
5207        "aria-posinset": ariaPosInSet
5208      }));
5209    }
5210  );
5211  var _7QKWW6TW_CompositeItem = memo2(
5212    forwardRef2(function CompositeItem2(props) {
5213      const htmlProps = useCompositeItem(props);
5214      return HKOOKEDE_createElement(_7QKWW6TW_TagName, htmlProps);
5215    })
5216  );
5217  
5218  
5219  
5220  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/composite/item.js
5221  /**
5222   * External dependencies
5223   */
5224  
5225  
5226  /**
5227   * WordPress dependencies
5228   */
5229  
5230  
5231  /**
5232   * Internal dependencies
5233   */
5234  
5235  
5236  
5237  const CompositeItem = (0,external_wp_element_namespaceObject.forwardRef)(function CompositeItem(props, ref) {
5238    var _props$store;
5239    const context = context_useCompositeContext();
5240  
5241    // @ts-expect-error The store prop is undocumented and only used by the
5242    // legacy compat layer. The `store` prop is documented, but its type is
5243    // obfuscated to discourage its use outside of the component's internals.
5244    const store = (_props$store = props.store) !== null && _props$store !== void 0 ? _props$store : context.store;
5245  
5246    // If the active item is not connected, Composite may end up in a state
5247    // where none of the items are tabbable. In this case, we force all items to
5248    // be tabbable, so that as soon as an item received focus, it becomes active
5249    // and Composite goes back to working as expected.
5250    const tabbable = useStoreState(store, state => {
5251      return state?.activeId !== null && !store?.item(state?.activeId)?.element?.isConnected;
5252    });
5253    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(_7QKWW6TW_CompositeItem, {
5254      store: store,
5255      tabbable: tabbable,
5256      ...props,
5257      ref: ref
5258    });
5259  });
5260  
5261  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/6BE7QOX5.js
5262  "use client";
5263  
5264  
5265  
5266  
5267  
5268  // src/composite/composite-row.tsx
5269  
5270  
5271  
5272  var _6BE7QOX5_TagName = "div";
5273  var useCompositeRow = createHook(
5274    function useCompositeRow2(_a) {
5275      var _b = _a, {
5276        store,
5277        "aria-setsize": ariaSetSize,
5278        "aria-posinset": ariaPosInSet
5279      } = _b, props = __objRest(_b, [
5280        "store",
5281        "aria-setsize",
5282        "aria-posinset"
5283      ]);
5284      const context = useCompositeContext();
5285      store = store || context;
5286      invariant(
5287        store,
5288         false && 0
5289      );
5290      const id = useId(props.id);
5291      const baseElement = store.useState(
5292        (state) => state.baseElement || void 0
5293      );
5294      const providerValue = (0,external_React_.useMemo)(
5295        () => ({ id, baseElement, ariaSetSize, ariaPosInSet }),
5296        [id, baseElement, ariaSetSize, ariaPosInSet]
5297      );
5298      props = useWrapElement(
5299        props,
5300        (element) => /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(CompositeRowContext.Provider, { value: providerValue, children: element }),
5301        [providerValue]
5302      );
5303      props = _3YLGPPWQ_spreadValues({ id }, props);
5304      return removeUndefinedValues(props);
5305    }
5306  );
5307  var _6BE7QOX5_CompositeRow = forwardRef2(function CompositeRow2(props) {
5308    const htmlProps = useCompositeRow(props);
5309    return HKOOKEDE_createElement(_6BE7QOX5_TagName, htmlProps);
5310  });
5311  
5312  
5313  
5314  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/composite/row.js
5315  /**
5316   * External dependencies
5317   */
5318  
5319  
5320  /**
5321   * WordPress dependencies
5322   */
5323  
5324  
5325  /**
5326   * Internal dependencies
5327   */
5328  
5329  
5330  
5331  const CompositeRow = (0,external_wp_element_namespaceObject.forwardRef)(function CompositeRow(props, ref) {
5332    var _props$store;
5333    const context = context_useCompositeContext();
5334  
5335    // @ts-expect-error The store prop is undocumented and only used by the
5336    // legacy compat layer. The `store` prop is documented, but its type is
5337    // obfuscated to discourage its use outside of the component's internals.
5338    const store = (_props$store = props.store) !== null && _props$store !== void 0 ? _props$store : context.store;
5339    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(_6BE7QOX5_CompositeRow, {
5340      store: store,
5341      ...props,
5342      ref: ref
5343    });
5344  });
5345  
5346  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/composite/typeahead.js
5347  /**
5348   * External dependencies
5349   */
5350  
5351  
5352  /**
5353   * WordPress dependencies
5354   */
5355  
5356  
5357  /**
5358   * Internal dependencies
5359   */
5360  
5361  
5362  
5363  const CompositeTypeahead = (0,external_wp_element_namespaceObject.forwardRef)(function CompositeTypeahead(props, ref) {
5364    var _props$store;
5365    const context = context_useCompositeContext();
5366  
5367    // @ts-expect-error The store prop is undocumented and only used by the
5368    // legacy compat layer. The `store` prop is documented, but its type is
5369    // obfuscated to discourage its use outside of the component's internals.
5370    const store = (_props$store = props.store) !== null && _props$store !== void 0 ? _props$store : context.store;
5371    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(_6BE7QOX5_CompositeRow, {
5372      store: store,
5373      ...props,
5374      ref: ref
5375    });
5376  });
5377  
5378  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/composite/index.js
5379  /**
5380   * Composite is a component that may contain navigable items represented by
5381   * Composite.Item. It's inspired by the WAI-ARIA Composite Role and implements
5382   * all the keyboard navigation mechanisms to ensure that there's only one
5383   * tab stop for the whole Composite element. This means that it can behave as
5384   * a roving tabindex or aria-activedescendant container.
5385   *
5386   * @see https://ariakit.org/components/composite
5387   */
5388  
5389  /**
5390   * External dependencies
5391   */
5392  
5393  
5394  /**
5395   * WordPress dependencies
5396   */
5397  
5398  
5399  
5400  /**
5401   * Internal dependencies
5402   */
5403  
5404  
5405  
5406  
5407  
5408  
5409  
5410  
5411  
5412  /**
5413   * Renders a widget based on the WAI-ARIA [`composite`](https://w3c.github.io/aria/#composite)
5414   * role, which provides a single tab stop on the page and arrow key navigation
5415   * through the focusable descendants.
5416   *
5417   * @example
5418   * ```jsx
5419   * import { Composite } from '@wordpress/components';
5420   *
5421   * <Composite>
5422   *   <Composite.Item>Item 1</Composite.Item>
5423   *   <Composite.Item>Item 2</Composite.Item>
5424   * </Composite>
5425   * ```
5426   */
5427  const Composite = Object.assign((0,external_wp_element_namespaceObject.forwardRef)(function Composite({
5428    // Composite store props
5429    activeId,
5430    defaultActiveId,
5431    setActiveId,
5432    focusLoop = false,
5433    focusWrap = false,
5434    focusShift = false,
5435    virtualFocus = false,
5436    orientation = 'both',
5437    rtl = (0,external_wp_i18n_namespaceObject.isRTL)(),
5438    // Composite component props
5439    children,
5440    disabled = false,
5441    // Rest props
5442    ...props
5443  }, ref) {
5444    // @ts-expect-error The store prop is undocumented and only used by the
5445    // legacy compat layer.
5446    const storeProp = props.store;
5447    const internalStore = useCompositeStore({
5448      activeId,
5449      defaultActiveId,
5450      setActiveId,
5451      focusLoop,
5452      focusWrap,
5453      focusShift,
5454      virtualFocus,
5455      orientation,
5456      rtl
5457    });
5458    const store = storeProp !== null && storeProp !== void 0 ? storeProp : internalStore;
5459    const contextValue = (0,external_wp_element_namespaceObject.useMemo)(() => ({
5460      store
5461    }), [store]);
5462    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(_2BDG6X5K_Composite, {
5463      disabled: disabled,
5464      store: store,
5465      ...props,
5466      ref: ref,
5467      children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(CompositeContext.Provider, {
5468        value: contextValue,
5469        children: children
5470      })
5471    });
5472  }), {
5473    /**
5474     * Renders a group element for composite items.
5475     *
5476     * @example
5477     * ```jsx
5478     * import { Composite } from '@wordpress/components';
5479     *
5480     * <Composite>
5481     *   <Composite.Group>
5482     *     <Composite.GroupLabel>Label</Composite.GroupLabel>
5483     *     <Composite.Item>Item 1</Composite.Item>
5484     *     <Composite.Item>Item 2</Composite.Item>
5485     *   </CompositeGroup>
5486     * </Composite>
5487     * ```
5488     */
5489    Group: Object.assign(CompositeGroup, {
5490      displayName: 'Composite.Group'
5491    }),
5492    /**
5493     * Renders a label in a composite group. This component must be wrapped with
5494     * `Composite.Group` so the `aria-labelledby` prop is properly set on the
5495     * composite group element.
5496     *
5497     * @example
5498     * ```jsx
5499     * import { Composite } from '@wordpress/components';
5500     *
5501     * <Composite>
5502     *   <Composite.Group>
5503     *     <Composite.GroupLabel>Label</Composite.GroupLabel>
5504     *     <Composite.Item>Item 1</Composite.Item>
5505     *     <Composite.Item>Item 2</Composite.Item>
5506     *   </CompositeGroup>
5507     * </Composite>
5508     * ```
5509     */
5510    GroupLabel: Object.assign(CompositeGroupLabel, {
5511      displayName: 'Composite.GroupLabel'
5512    }),
5513    /**
5514     * Renders a composite item.
5515     *
5516     * @example
5517     * ```jsx
5518     * import { Composite } from '@wordpress/components';
5519     *
5520     * <Composite>
5521     *   <Composite.Item>Item 1</Composite.Item>
5522     *   <Composite.Item>Item 2</Composite.Item>
5523     *   <Composite.Item>Item 3</Composite.Item>
5524     * </Composite>
5525     * ```
5526     */
5527    Item: Object.assign(CompositeItem, {
5528      displayName: 'Composite.Item'
5529    }),
5530    /**
5531     * Renders a composite row. Wrapping `Composite.Item` elements within
5532     * `Composite.Row` will create a two-dimensional composite widget, such as a
5533     * grid.
5534     *
5535     * @example
5536     * ```jsx
5537     * import { Composite } from '@wordpress/components';
5538     *
5539     * <Composite>
5540     *   <Composite.Row>
5541     *     <Composite.Item>Item 1.1</Composite.Item>
5542     *     <Composite.Item>Item 1.2</Composite.Item>
5543     *     <Composite.Item>Item 1.3</Composite.Item>
5544     *   </Composite.Row>
5545     *   <Composite.Row>
5546     *     <Composite.Item>Item 2.1</Composite.Item>
5547     *     <Composite.Item>Item 2.2</Composite.Item>
5548     *     <Composite.Item>Item 2.3</Composite.Item>
5549     *   </Composite.Row>
5550     * </Composite>
5551     * ```
5552     */
5553    Row: Object.assign(CompositeRow, {
5554      displayName: 'Composite.Row'
5555    }),
5556    /**
5557     * Renders an element in a composite widget that receives focus on mouse move
5558     * and loses focus to the composite base element on mouse leave. This should
5559     * be combined with the `Composite.Item` component.
5560     *
5561     * @example
5562     * ```jsx
5563     * import { Composite } from '@wordpress/components';
5564     *
5565     * <Composite>
5566     *   <Composite.Hover render={ <Composite.Item /> }>
5567     *     Item 1
5568     *   </Composite.Hover>
5569     *   <Composite.Hover render={ <Composite.Item /> }>
5570     *     Item 2
5571     *   </Composite.Hover>
5572     * </Composite>
5573     * ```
5574     */
5575    Hover: Object.assign(CompositeHover, {
5576      displayName: 'Composite.Hover'
5577    }),
5578    /**
5579     * Renders a component that adds typeahead functionality to composite
5580     * components. Hitting printable character keys will move focus to the next
5581     * composite item that begins with the input characters.
5582     *
5583     * @example
5584     * ```jsx
5585     * import { Composite } from '@wordpress/components';
5586     *
5587     * <Composite render={ <CompositeTypeahead /> }>
5588     *   <Composite.Item>Item 1</Composite.Item>
5589     *   <Composite.Item>Item 2</Composite.Item>
5590     * </Composite>
5591     * ```
5592     */
5593    Typeahead: Object.assign(CompositeTypeahead, {
5594      displayName: 'Composite.Typeahead'
5595    }),
5596    /**
5597     * The React context used by the composite components. It can be used by
5598     * to access the composite store, and to forward the context when composite
5599     * sub-components are rendered across portals (ie. `SlotFill` components)
5600     * that would not otherwise forward the context to the `Fill` children.
5601     *
5602     * @example
5603     * ```jsx
5604     * import { Composite } from '@wordpress/components';
5605     * import { useContext } from '@wordpress/element';
5606     *
5607     * const compositeContext = useContext( Composite.Context );
5608     * ```
5609     */
5610    Context: Object.assign(CompositeContext, {
5611      displayName: 'Composite.Context'
5612    })
5613  });
5614  
5615  ;// CONCATENATED MODULE: ./node_modules/@ariakit/core/esm/__chunks/6E4KKOSB.js
5616  "use client";
5617  
5618  
5619  
5620  
5621  // src/disclosure/disclosure-store.ts
5622  function createDisclosureStore(props = {}) {
5623    const store = mergeStore(
5624      props.store,
5625      omit2(props.disclosure, ["contentElement", "disclosureElement"])
5626    );
5627    throwOnConflictingProps(props, store);
5628    const syncState = store == null ? void 0 : store.getState();
5629    const open = defaultValue(
5630      props.open,
5631      syncState == null ? void 0 : syncState.open,
5632      props.defaultOpen,
5633      false
5634    );
5635    const animated = defaultValue(props.animated, syncState == null ? void 0 : syncState.animated, false);
5636    const initialState = {
5637      open,
5638      animated,
5639      animating: !!animated && open,
5640      mounted: open,
5641      contentElement: defaultValue(syncState == null ? void 0 : syncState.contentElement, null),
5642      disclosureElement: defaultValue(syncState == null ? void 0 : syncState.disclosureElement, null)
5643    };
5644    const disclosure = createStore(initialState, store);
5645    setup(
5646      disclosure,
5647      () => sync(disclosure, ["animated", "animating"], (state) => {
5648        if (state.animated) return;
5649        disclosure.setState("animating", false);
5650      })
5651    );
5652    setup(
5653      disclosure,
5654      () => subscribe(disclosure, ["open"], () => {
5655        if (!disclosure.getState().animated) return;
5656        disclosure.setState("animating", true);
5657      })
5658    );
5659    setup(
5660      disclosure,
5661      () => sync(disclosure, ["open", "animating"], (state) => {
5662        disclosure.setState("mounted", state.open || state.animating);
5663      })
5664    );
5665    return _chunks_3YLGPPWQ_spreadProps(_chunks_3YLGPPWQ_spreadValues({}, disclosure), {
5666      disclosure: props.disclosure,
5667      setOpen: (value) => disclosure.setState("open", value),
5668      show: () => disclosure.setState("open", true),
5669      hide: () => disclosure.setState("open", false),
5670      toggle: () => disclosure.setState("open", (open2) => !open2),
5671      stopAnimation: () => disclosure.setState("animating", false),
5672      setContentElement: (value) => disclosure.setState("contentElement", value),
5673      setDisclosureElement: (value) => disclosure.setState("disclosureElement", value)
5674    });
5675  }
5676  
5677  
5678  
5679  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/KGK2TTFO.js
5680  "use client";
5681  
5682  
5683  
5684  // src/disclosure/disclosure-store.ts
5685  
5686  function useDisclosureStoreProps(store, update, props) {
5687    useUpdateEffect(update, [props.store, props.disclosure]);
5688    useStoreProps(store, props, "open", "setOpen");
5689    useStoreProps(store, props, "mounted", "setMounted");
5690    useStoreProps(store, props, "animated");
5691    return Object.assign(store, { disclosure: props.disclosure });
5692  }
5693  function useDisclosureStore(props = {}) {
5694    const [store, update] = _2GXGCHW6_useStore(createDisclosureStore, props);
5695    return useDisclosureStoreProps(store, update, props);
5696  }
5697  
5698  
5699  
5700  ;// CONCATENATED MODULE: ./node_modules/@ariakit/core/esm/__chunks/YOHCVXJB.js
5701  "use client";
5702  
5703  
5704  // src/dialog/dialog-store.ts
5705  function createDialogStore(props = {}) {
5706    return createDisclosureStore(props);
5707  }
5708  
5709  
5710  
5711  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/QYS5FHDY.js
5712  "use client";
5713  
5714  
5715  
5716  // src/dialog/dialog-store.ts
5717  
5718  function useDialogStoreProps(store, update, props) {
5719    return useDisclosureStoreProps(store, update, props);
5720  }
5721  function useDialogStore(props = {}) {
5722    const [store, update] = _2GXGCHW6_useStore(createDialogStore, props);
5723    return useDialogStoreProps(store, update, props);
5724  }
5725  
5726  
5727  
5728  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/CBC47ZYL.js
5729  "use client";
5730  
5731  
5732  
5733  
5734  // src/popover/popover-store.ts
5735  
5736  function usePopoverStoreProps(store, update, props) {
5737    useUpdateEffect(update, [props.popover]);
5738    useStoreProps(store, props, "placement");
5739    return useDialogStoreProps(store, update, props);
5740  }
5741  function usePopoverStore(props = {}) {
5742    const [store, update] = useStore(Core.createPopoverStore, props);
5743    return usePopoverStoreProps(store, update, props);
5744  }
5745  
5746  
5747  
5748  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/XMDAT5SM.js
5749  "use client";
5750  
5751  
5752  
5753  // src/hovercard/hovercard-store.ts
5754  
5755  function useHovercardStoreProps(store, update, props) {
5756    useStoreProps(store, props, "timeout");
5757    useStoreProps(store, props, "showTimeout");
5758    useStoreProps(store, props, "hideTimeout");
5759    return usePopoverStoreProps(store, update, props);
5760  }
5761  function useHovercardStore(props = {}) {
5762    const [store, update] = useStore(Core.createHovercardStore, props);
5763    return useHovercardStoreProps(store, update, props);
5764  }
5765  
5766  
5767  
5768  ;// CONCATENATED MODULE: ./node_modules/@ariakit/core/esm/__chunks/3UYWTADI.js
5769  "use client";
5770  
5771  
5772  
5773  
5774  
5775  // src/popover/popover-store.ts
5776  function createPopoverStore(_a = {}) {
5777    var _b = _a, {
5778      popover: otherPopover
5779    } = _b, props = _3YLGPPWQ_objRest(_b, [
5780      "popover"
5781    ]);
5782    const store = mergeStore(
5783      props.store,
5784      omit2(otherPopover, [
5785        "arrowElement",
5786        "anchorElement",
5787        "contentElement",
5788        "popoverElement",
5789        "disclosureElement"
5790      ])
5791    );
5792    throwOnConflictingProps(props, store);
5793    const syncState = store == null ? void 0 : store.getState();
5794    const dialog = createDialogStore(_chunks_3YLGPPWQ_spreadProps(_chunks_3YLGPPWQ_spreadValues({}, props), { store }));
5795    const placement = defaultValue(
5796      props.placement,
5797      syncState == null ? void 0 : syncState.placement,
5798      "bottom"
5799    );
5800    const initialState = _chunks_3YLGPPWQ_spreadProps(_chunks_3YLGPPWQ_spreadValues({}, dialog.getState()), {
5801      placement,
5802      currentPlacement: placement,
5803      anchorElement: defaultValue(syncState == null ? void 0 : syncState.anchorElement, null),
5804      popoverElement: defaultValue(syncState == null ? void 0 : syncState.popoverElement, null),
5805      arrowElement: defaultValue(syncState == null ? void 0 : syncState.arrowElement, null),
5806      rendered: Symbol("rendered")
5807    });
5808    const popover = createStore(initialState, dialog, store);
5809    return _chunks_3YLGPPWQ_spreadProps(_chunks_3YLGPPWQ_spreadValues(_chunks_3YLGPPWQ_spreadValues({}, dialog), popover), {
5810      setAnchorElement: (element) => popover.setState("anchorElement", element),
5811      setPopoverElement: (element) => popover.setState("popoverElement", element),
5812      setArrowElement: (element) => popover.setState("arrowElement", element),
5813      render: () => popover.setState("rendered", Symbol("rendered"))
5814    });
5815  }
5816  
5817  
5818  
5819  ;// CONCATENATED MODULE: ./node_modules/@ariakit/core/esm/__chunks/EACLTACN.js
5820  "use client";
5821  
5822  
5823  
5824  
5825  
5826  // src/hovercard/hovercard-store.ts
5827  function createHovercardStore(props = {}) {
5828    var _a;
5829    const syncState = (_a = props.store) == null ? void 0 : _a.getState();
5830    const popover = createPopoverStore(_chunks_3YLGPPWQ_spreadProps(_chunks_3YLGPPWQ_spreadValues({}, props), {
5831      placement: defaultValue(
5832        props.placement,
5833        syncState == null ? void 0 : syncState.placement,
5834        "bottom"
5835      )
5836    }));
5837    const timeout = defaultValue(props.timeout, syncState == null ? void 0 : syncState.timeout, 500);
5838    const initialState = _chunks_3YLGPPWQ_spreadProps(_chunks_3YLGPPWQ_spreadValues({}, popover.getState()), {
5839      timeout,
5840      showTimeout: defaultValue(props.showTimeout, syncState == null ? void 0 : syncState.showTimeout),
5841      hideTimeout: defaultValue(props.hideTimeout, syncState == null ? void 0 : syncState.hideTimeout),
5842      autoFocusOnShow: defaultValue(syncState == null ? void 0 : syncState.autoFocusOnShow, false)
5843    });
5844    const hovercard = createStore(initialState, popover, props.store);
5845    return _chunks_3YLGPPWQ_spreadProps(_chunks_3YLGPPWQ_spreadValues(_chunks_3YLGPPWQ_spreadValues({}, popover), hovercard), {
5846      setAutoFocusOnShow: (value) => hovercard.setState("autoFocusOnShow", value)
5847    });
5848  }
5849  
5850  
5851  
5852  ;// CONCATENATED MODULE: ./node_modules/@ariakit/core/esm/tooltip/tooltip-store.js
5853  "use client";
5854  
5855  
5856  
5857  
5858  
5859  
5860  
5861  
5862  // src/tooltip/tooltip-store.ts
5863  function createTooltipStore(props = {}) {
5864    var _a;
5865    if (false) {}
5866    const syncState = (_a = props.store) == null ? void 0 : _a.getState();
5867    const hovercard = createHovercardStore(_chunks_3YLGPPWQ_spreadProps(_chunks_3YLGPPWQ_spreadValues({}, props), {
5868      placement: defaultValue(
5869        props.placement,
5870        syncState == null ? void 0 : syncState.placement,
5871        "top"
5872      ),
5873      hideTimeout: defaultValue(props.hideTimeout, syncState == null ? void 0 : syncState.hideTimeout, 0)
5874    }));
5875    const initialState = _chunks_3YLGPPWQ_spreadProps(_chunks_3YLGPPWQ_spreadValues({}, hovercard.getState()), {
5876      type: defaultValue(props.type, syncState == null ? void 0 : syncState.type, "description"),
5877      skipTimeout: defaultValue(props.skipTimeout, syncState == null ? void 0 : syncState.skipTimeout, 300)
5878    });
5879    const tooltip = createStore(initialState, hovercard, props.store);
5880    return _chunks_3YLGPPWQ_spreadValues(_chunks_3YLGPPWQ_spreadValues({}, hovercard), tooltip);
5881  }
5882  
5883  
5884  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/2D53SX6Q.js
5885  "use client";
5886  
5887  
5888  
5889  // src/tooltip/tooltip-store.ts
5890  
5891  function useTooltipStoreProps(store, update, props) {
5892    useStoreProps(store, props, "type");
5893    useStoreProps(store, props, "skipTimeout");
5894    return useHovercardStoreProps(store, update, props);
5895  }
5896  function useTooltipStore(props = {}) {
5897    const [store, update] = _2GXGCHW6_useStore(createTooltipStore, props);
5898    return useTooltipStoreProps(store, update, props);
5899  }
5900  
5901  
5902  
5903  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/AXRBYZQP.js
5904  "use client";
5905  
5906  
5907  // src/role/role.tsx
5908  var AXRBYZQP_TagName = "div";
5909  var AXRBYZQP_elements = [
5910    "a",
5911    "button",
5912    "details",
5913    "dialog",
5914    "div",
5915    "form",
5916    "h1",
5917    "h2",
5918    "h3",
5919    "h4",
5920    "h5",
5921    "h6",
5922    "header",
5923    "img",
5924    "input",
5925    "label",
5926    "li",
5927    "nav",
5928    "ol",
5929    "p",
5930    "section",
5931    "select",
5932    "span",
5933    "summary",
5934    "textarea",
5935    "ul",
5936    "svg"
5937  ];
5938  var useRole = createHook(
5939    function useRole2(props) {
5940      return props;
5941    }
5942  );
5943  var Role = forwardRef2(
5944    // @ts-expect-error
5945    function Role2(props) {
5946      return HKOOKEDE_createElement(AXRBYZQP_TagName, props);
5947    }
5948  );
5949  Object.assign(
5950    Role,
5951    AXRBYZQP_elements.reduce((acc, element) => {
5952      acc[element] = forwardRef2(function Role3(props) {
5953        return HKOOKEDE_createElement(element, props);
5954      });
5955      return acc;
5956    }, {})
5957  );
5958  
5959  
5960  
5961  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/RGUP62TM.js
5962  "use client";
5963  
5964  
5965  // src/disclosure/disclosure-context.tsx
5966  var RGUP62TM_ctx = createStoreContext();
5967  var useDisclosureContext = RGUP62TM_ctx.useContext;
5968  var useDisclosureScopedContext = RGUP62TM_ctx.useScopedContext;
5969  var useDisclosureProviderContext = RGUP62TM_ctx.useProviderContext;
5970  var DisclosureContextProvider = RGUP62TM_ctx.ContextProvider;
5971  var DisclosureScopedContextProvider = RGUP62TM_ctx.ScopedContextProvider;
5972  
5973  
5974  
5975  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/DU4D3UCJ.js
5976  "use client";
5977  
5978  
5979  
5980  // src/dialog/dialog-context.tsx
5981  
5982  var DU4D3UCJ_ctx = createStoreContext(
5983    [DisclosureContextProvider],
5984    [DisclosureScopedContextProvider]
5985  );
5986  var useDialogContext = DU4D3UCJ_ctx.useContext;
5987  var useDialogScopedContext = DU4D3UCJ_ctx.useScopedContext;
5988  var useDialogProviderContext = DU4D3UCJ_ctx.useProviderContext;
5989  var DialogContextProvider = DU4D3UCJ_ctx.ContextProvider;
5990  var DialogScopedContextProvider = DU4D3UCJ_ctx.ScopedContextProvider;
5991  var DialogHeadingContext = (0,external_React_.createContext)(void 0);
5992  var DialogDescriptionContext = (0,external_React_.createContext)(void 0);
5993  
5994  
5995  
5996  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/54MGSIOI.js
5997  "use client";
5998  
5999  
6000  
6001  // src/popover/popover-context.tsx
6002  var _54MGSIOI_ctx = createStoreContext(
6003    [DialogContextProvider],
6004    [DialogScopedContextProvider]
6005  );
6006  var usePopoverContext = _54MGSIOI_ctx.useContext;
6007  var usePopoverScopedContext = _54MGSIOI_ctx.useScopedContext;
6008  var usePopoverProviderContext = _54MGSIOI_ctx.useProviderContext;
6009  var PopoverContextProvider = _54MGSIOI_ctx.ContextProvider;
6010  var PopoverScopedContextProvider = _54MGSIOI_ctx.ScopedContextProvider;
6011  
6012  
6013  
6014  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/CTQR3VDU.js
6015  "use client";
6016  
6017  
6018  
6019  // src/hovercard/hovercard-context.tsx
6020  var CTQR3VDU_ctx = createStoreContext(
6021    [PopoverContextProvider],
6022    [PopoverScopedContextProvider]
6023  );
6024  var useHovercardContext = CTQR3VDU_ctx.useContext;
6025  var useHovercardScopedContext = CTQR3VDU_ctx.useScopedContext;
6026  var useHovercardProviderContext = CTQR3VDU_ctx.useProviderContext;
6027  var HovercardContextProvider = CTQR3VDU_ctx.ContextProvider;
6028  var HovercardScopedContextProvider = CTQR3VDU_ctx.ScopedContextProvider;
6029  
6030  
6031  
6032  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/CF4NC545.js
6033  "use client";
6034  
6035  
6036  
6037  
6038  
6039  
6040  // src/hovercard/hovercard-anchor.tsx
6041  
6042  
6043  
6044  var CF4NC545_TagName = "a";
6045  var useHovercardAnchor = createHook(
6046    function useHovercardAnchor2(_a) {
6047      var _b = _a, { store, showOnHover = true } = _b, props = __objRest(_b, ["store", "showOnHover"]);
6048      const context = useHovercardProviderContext();
6049      store = store || context;
6050      invariant(
6051        store,
6052         false && 0
6053      );
6054      const disabled = disabledFromProps(props);
6055      const showTimeoutRef = (0,external_React_.useRef)(0);
6056      (0,external_React_.useEffect)(() => () => window.clearTimeout(showTimeoutRef.current), []);
6057      (0,external_React_.useEffect)(() => {
6058        const onMouseLeave = (event) => {
6059          if (!store) return;
6060          const { anchorElement } = store.getState();
6061          if (!anchorElement) return;
6062          if (event.target !== anchorElement) return;
6063          window.clearTimeout(showTimeoutRef.current);
6064          showTimeoutRef.current = 0;
6065        };
6066        return addGlobalEventListener("mouseleave", onMouseLeave, true);
6067      }, [store]);
6068      const onMouseMoveProp = props.onMouseMove;
6069      const showOnHoverProp = useBooleanEvent(showOnHover);
6070      const isMouseMoving = useIsMouseMoving();
6071      const onMouseMove = useEvent((event) => {
6072        onMouseMoveProp == null ? void 0 : onMouseMoveProp(event);
6073        if (disabled) return;
6074        if (!store) return;
6075        if (event.defaultPrevented) return;
6076        if (showTimeoutRef.current) return;
6077        if (!isMouseMoving()) return;
6078        if (!showOnHoverProp(event)) return;
6079        const element = event.currentTarget;
6080        store.setAnchorElement(element);
6081        store.setDisclosureElement(element);
6082        const { showTimeout, timeout } = store.getState();
6083        const showHovercard = () => {
6084          showTimeoutRef.current = 0;
6085          if (!isMouseMoving()) return;
6086          store == null ? void 0 : store.setAnchorElement(element);
6087          store == null ? void 0 : store.show();
6088          queueMicrotask(() => {
6089            store == null ? void 0 : store.setDisclosureElement(element);
6090          });
6091        };
6092        const timeoutMs = showTimeout != null ? showTimeout : timeout;
6093        if (timeoutMs === 0) {
6094          showHovercard();
6095        } else {
6096          showTimeoutRef.current = window.setTimeout(showHovercard, timeoutMs);
6097        }
6098      });
6099      const onClickProp = props.onClick;
6100      const onClick = useEvent((event) => {
6101        onClickProp == null ? void 0 : onClickProp(event);
6102        if (!store) return;
6103        window.clearTimeout(showTimeoutRef.current);
6104        showTimeoutRef.current = 0;
6105      });
6106      const ref = (0,external_React_.useCallback)(
6107        (element) => {
6108          if (!store) return;
6109          const { anchorElement } = store.getState();
6110          if (anchorElement == null ? void 0 : anchorElement.isConnected) return;
6111          store.setAnchorElement(element);
6112        },
6113        [store]
6114      );
6115      props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, props), {
6116        ref: useMergeRefs(ref, props.ref),
6117        onMouseMove,
6118        onClick
6119      });
6120      props = useFocusable(props);
6121      return props;
6122    }
6123  );
6124  var HovercardAnchor = forwardRef2(function HovercardAnchor2(props) {
6125    const htmlProps = useHovercardAnchor(props);
6126    return HKOOKEDE_createElement(CF4NC545_TagName, htmlProps);
6127  });
6128  
6129  
6130  
6131  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/TWCRTUOB.js
6132  "use client";
6133  
6134  
6135  
6136  // src/tooltip/tooltip-context.tsx
6137  var TWCRTUOB_ctx = createStoreContext(
6138    [HovercardContextProvider],
6139    [HovercardScopedContextProvider]
6140  );
6141  var useTooltipContext = TWCRTUOB_ctx.useContext;
6142  var useTooltipScopedContext = TWCRTUOB_ctx.useScopedContext;
6143  var useTooltipProviderContext = TWCRTUOB_ctx.useProviderContext;
6144  var TooltipContextProvider = TWCRTUOB_ctx.ContextProvider;
6145  var TooltipScopedContextProvider = TWCRTUOB_ctx.ScopedContextProvider;
6146  
6147  
6148  
6149  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/tooltip/tooltip-anchor.js
6150  "use client";
6151  
6152  
6153  
6154  
6155  
6156  
6157  
6158  
6159  
6160  
6161  
6162  
6163  
6164  // src/tooltip/tooltip-anchor.tsx
6165  
6166  
6167  
6168  var tooltip_anchor_TagName = "div";
6169  var globalStore = createStore({
6170    activeStore: null
6171  });
6172  function createRemoveStoreCallback(store) {
6173    return () => {
6174      const { activeStore } = globalStore.getState();
6175      if (activeStore !== store) return;
6176      globalStore.setState("activeStore", null);
6177    };
6178  }
6179  var useTooltipAnchor = createHook(
6180    function useTooltipAnchor2(_a) {
6181      var _b = _a, { store, showOnHover = true } = _b, props = __objRest(_b, ["store", "showOnHover"]);
6182      const context = useTooltipProviderContext();
6183      store = store || context;
6184      invariant(
6185        store,
6186         false && 0
6187      );
6188      const canShowOnHoverRef = (0,external_React_.useRef)(false);
6189      (0,external_React_.useEffect)(() => {
6190        return sync(store, ["mounted"], (state) => {
6191          if (state.mounted) return;
6192          canShowOnHoverRef.current = false;
6193        });
6194      }, [store]);
6195      (0,external_React_.useEffect)(() => {
6196        if (!store) return;
6197        return chain(
6198          // Immediately remove the current store from the global store when
6199          // the component unmounts. This is useful, for example, to avoid
6200          // showing tooltips immediately on serial tests.
6201          createRemoveStoreCallback(store),
6202          sync(store, ["mounted", "skipTimeout"], (state) => {
6203            if (!store) return;
6204            if (state.mounted) {
6205              const { activeStore } = globalStore.getState();
6206              if (activeStore !== store) {
6207                activeStore == null ? void 0 : activeStore.hide();
6208              }
6209              return globalStore.setState("activeStore", store);
6210            }
6211            const id = setTimeout(
6212              createRemoveStoreCallback(store),
6213              state.skipTimeout
6214            );
6215            return () => clearTimeout(id);
6216          })
6217        );
6218      }, [store]);
6219      const onMouseEnterProp = props.onMouseEnter;
6220      const onMouseEnter = useEvent((event) => {
6221        onMouseEnterProp == null ? void 0 : onMouseEnterProp(event);
6222        canShowOnHoverRef.current = true;
6223      });
6224      const onFocusVisibleProp = props.onFocusVisible;
6225      const onFocusVisible = useEvent((event) => {
6226        onFocusVisibleProp == null ? void 0 : onFocusVisibleProp(event);
6227        if (event.defaultPrevented) return;
6228        store == null ? void 0 : store.setAnchorElement(event.currentTarget);
6229        store == null ? void 0 : store.show();
6230      });
6231      const onBlurProp = props.onBlur;
6232      const onBlur = useEvent((event) => {
6233        onBlurProp == null ? void 0 : onBlurProp(event);
6234        if (event.defaultPrevented) return;
6235        const { activeStore } = globalStore.getState();
6236        canShowOnHoverRef.current = false;
6237        if (activeStore === store) {
6238          globalStore.setState("activeStore", null);
6239        }
6240      });
6241      const type = store.useState("type");
6242      const contentId = store.useState((state) => {
6243        var _a2;
6244        return (_a2 = state.contentElement) == null ? void 0 : _a2.id;
6245      });
6246      props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({
6247        "aria-labelledby": type === "label" ? contentId : void 0
6248      }, props), {
6249        onMouseEnter,
6250        onFocusVisible,
6251        onBlur
6252      });
6253      props = useHovercardAnchor(_3YLGPPWQ_spreadValues({
6254        store,
6255        showOnHover(event) {
6256          if (!canShowOnHoverRef.current) return false;
6257          if (isFalsyBooleanCallback(showOnHover, event)) return false;
6258          const { activeStore } = globalStore.getState();
6259          if (!activeStore) return true;
6260          store == null ? void 0 : store.show();
6261          return false;
6262        }
6263      }, props));
6264      return props;
6265    }
6266  );
6267  var TooltipAnchor = forwardRef2(function TooltipAnchor2(props) {
6268    const htmlProps = useTooltipAnchor(props);
6269    return HKOOKEDE_createElement(tooltip_anchor_TagName, htmlProps);
6270  });
6271  
6272  
6273  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/X7QOZUD3.js
6274  "use client";
6275  
6276  // src/hovercard/utils/polygon.ts
6277  function getEventPoint(event) {
6278    return [event.clientX, event.clientY];
6279  }
6280  function isPointInPolygon(point, polygon) {
6281    const [x, y] = point;
6282    let inside = false;
6283    const length = polygon.length;
6284    for (let l = length, i = 0, j = l - 1; i < l; j = i++) {
6285      const [xi, yi] = polygon[i];
6286      const [xj, yj] = polygon[j];
6287      const [, vy] = polygon[j === 0 ? l - 1 : j - 1] || [0, 0];
6288      const where = (yi - yj) * (x - xi) - (xi - xj) * (y - yi);
6289      if (yj < yi) {
6290        if (y >= yj && y < yi) {
6291          if (where === 0) return true;
6292          if (where > 0) {
6293            if (y === yj) {
6294              if (y > vy) {
6295                inside = !inside;
6296              }
6297            } else {
6298              inside = !inside;
6299            }
6300          }
6301        }
6302      } else if (yi < yj) {
6303        if (y > yi && y <= yj) {
6304          if (where === 0) return true;
6305          if (where < 0) {
6306            if (y === yj) {
6307              if (y < vy) {
6308                inside = !inside;
6309              }
6310            } else {
6311              inside = !inside;
6312            }
6313          }
6314        }
6315      } else if (y === yi && (x >= xj && x <= xi || x >= xi && x <= xj)) {
6316        return true;
6317      }
6318    }
6319    return inside;
6320  }
6321  function getEnterPointPlacement(enterPoint, rect) {
6322    const { top, right, bottom, left } = rect;
6323    const [x, y] = enterPoint;
6324    const placementX = x < left ? "left" : x > right ? "right" : null;
6325    const placementY = y < top ? "top" : y > bottom ? "bottom" : null;
6326    return [placementX, placementY];
6327  }
6328  function getElementPolygon(element, enterPoint) {
6329    const rect = element.getBoundingClientRect();
6330    const { top, right, bottom, left } = rect;
6331    const [x, y] = getEnterPointPlacement(enterPoint, rect);
6332    const polygon = [enterPoint];
6333    if (x) {
6334      if (y !== "top") {
6335        polygon.push([x === "left" ? left : right, top]);
6336      }
6337      polygon.push([x === "left" ? right : left, top]);
6338      polygon.push([x === "left" ? right : left, bottom]);
6339      if (y !== "bottom") {
6340        polygon.push([x === "left" ? left : right, bottom]);
6341      }
6342    } else if (y === "top") {
6343      polygon.push([left, top]);
6344      polygon.push([left, bottom]);
6345      polygon.push([right, bottom]);
6346      polygon.push([right, top]);
6347    } else {
6348      polygon.push([left, bottom]);
6349      polygon.push([left, top]);
6350      polygon.push([right, top]);
6351      polygon.push([right, bottom]);
6352    }
6353    return polygon;
6354  }
6355  
6356  
6357  
6358  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/63XF7ACK.js
6359  "use client";
6360  
6361  // src/dialog/utils/is-backdrop.ts
6362  function _63XF7ACK_isBackdrop(element, ...ids) {
6363    if (!element) return false;
6364    const backdrop = element.getAttribute("data-backdrop");
6365    if (backdrop == null) return false;
6366    if (backdrop === "") return true;
6367    if (backdrop === "true") return true;
6368    if (!ids.length) return true;
6369    return ids.some((id) => backdrop === id);
6370  }
6371  
6372  
6373  
6374  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/K2ZF5NU7.js
6375  "use client";
6376  
6377  // src/dialog/utils/orchestrate.ts
6378  var cleanups = /* @__PURE__ */ new WeakMap();
6379  function orchestrate(element, key, setup) {
6380    if (!cleanups.has(element)) {
6381      cleanups.set(element, /* @__PURE__ */ new Map());
6382    }
6383    const elementCleanups = cleanups.get(element);
6384    const prevCleanup = elementCleanups.get(key);
6385    if (!prevCleanup) {
6386      elementCleanups.set(key, setup());
6387      return () => {
6388        var _a;
6389        (_a = elementCleanups.get(key)) == null ? void 0 : _a();
6390        elementCleanups.delete(key);
6391      };
6392    }
6393    const cleanup = setup();
6394    const nextCleanup = () => {
6395      cleanup();
6396      prevCleanup();
6397      elementCleanups.delete(key);
6398    };
6399    elementCleanups.set(key, nextCleanup);
6400    return () => {
6401      const isCurrent = elementCleanups.get(key) === nextCleanup;
6402      if (!isCurrent) return;
6403      cleanup();
6404      elementCleanups.set(key, prevCleanup);
6405    };
6406  }
6407  function setAttribute(element, attr, value) {
6408    const setup = () => {
6409      const previousValue = element.getAttribute(attr);
6410      element.setAttribute(attr, value);
6411      return () => {
6412        if (previousValue == null) {
6413          element.removeAttribute(attr);
6414        } else {
6415          element.setAttribute(attr, previousValue);
6416        }
6417      };
6418    };
6419    return orchestrate(element, attr, setup);
6420  }
6421  function setProperty(element, property, value) {
6422    const setup = () => {
6423      const exists = property in element;
6424      const previousValue = element[property];
6425      element[property] = value;
6426      return () => {
6427        if (!exists) {
6428          delete element[property];
6429        } else {
6430          element[property] = previousValue;
6431        }
6432      };
6433    };
6434    return orchestrate(element, property, setup);
6435  }
6436  function assignStyle(element, style) {
6437    if (!element) return () => {
6438    };
6439    const setup = () => {
6440      const prevStyle = element.style.cssText;
6441      Object.assign(element.style, style);
6442      return () => {
6443        element.style.cssText = prevStyle;
6444      };
6445    };
6446    return orchestrate(element, "style", setup);
6447  }
6448  function setCSSProperty(element, property, value) {
6449    if (!element) return () => {
6450    };
6451    const setup = () => {
6452      const previousValue = element.style.getPropertyValue(property);
6453      element.style.setProperty(property, value);
6454      return () => {
6455        if (previousValue) {
6456          element.style.setProperty(property, previousValue);
6457        } else {
6458          element.style.removeProperty(property);
6459        }
6460      };
6461    };
6462    return orchestrate(element, property, setup);
6463  }
6464  
6465  
6466  
6467  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/AOUGVQZ3.js
6468  "use client";
6469  
6470  
6471  // src/dialog/utils/walk-tree-outside.ts
6472  
6473  
6474  var ignoreTags = ["SCRIPT", "STYLE"];
6475  function getSnapshotPropertyName(id) {
6476    return `__ariakit-dialog-snapshot-$id}`;
6477  }
6478  function inSnapshot(id, element) {
6479    const doc = getDocument(element);
6480    const propertyName = getSnapshotPropertyName(id);
6481    if (!doc.body[propertyName]) return true;
6482    do {
6483      if (element === doc.body) return false;
6484      if (element[propertyName]) return true;
6485      if (!element.parentElement) return false;
6486      element = element.parentElement;
6487    } while (true);
6488  }
6489  function isValidElement(id, element, ignoredElements) {
6490    if (ignoreTags.includes(element.tagName)) return false;
6491    if (!inSnapshot(id, element)) return false;
6492    return !ignoredElements.some(
6493      (enabledElement) => enabledElement && contains(element, enabledElement)
6494    );
6495  }
6496  function AOUGVQZ3_walkTreeOutside(id, elements, callback, ancestorCallback) {
6497    for (let element of elements) {
6498      if (!(element == null ? void 0 : element.isConnected)) continue;
6499      const hasAncestorAlready = elements.some((maybeAncestor) => {
6500        if (!maybeAncestor) return false;
6501        if (maybeAncestor === element) return false;
6502        return maybeAncestor.contains(element);
6503      });
6504      const doc = getDocument(element);
6505      const originalElement = element;
6506      while (element.parentElement && element !== doc.body) {
6507        ancestorCallback == null ? void 0 : ancestorCallback(element.parentElement, originalElement);
6508        if (!hasAncestorAlready) {
6509          for (const child of element.parentElement.children) {
6510            if (isValidElement(id, child, elements)) {
6511              callback(child, originalElement);
6512            }
6513          }
6514        }
6515        element = element.parentElement;
6516      }
6517    }
6518  }
6519  function createWalkTreeSnapshot(id, elements) {
6520    const { body } = getDocument(elements[0]);
6521    const cleanups = [];
6522    const markElement = (element) => {
6523      cleanups.push(setProperty(element, getSnapshotPropertyName(id), true));
6524    };
6525    AOUGVQZ3_walkTreeOutside(id, elements, markElement);
6526    return chain(setProperty(body, getSnapshotPropertyName(id), true), () => {
6527      for (const cleanup of cleanups) {
6528        cleanup();
6529      }
6530    });
6531  }
6532  
6533  
6534  
6535  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/2PGBN2Y4.js
6536  "use client";
6537  
6538  
6539  
6540  
6541  // src/dialog/utils/mark-tree-outside.ts
6542  
6543  function getPropertyName(id = "", ancestor = false) {
6544    return `__ariakit-dialog-$ancestor ? "ancestor" : "outside"}$id ? `-$id}` : ""}`;
6545  }
6546  function markElement(element, id = "") {
6547    return chain(
6548      setProperty(element, getPropertyName(), true),
6549      setProperty(element, getPropertyName(id), true)
6550    );
6551  }
6552  function markAncestor(element, id = "") {
6553    return chain(
6554      setProperty(element, getPropertyName("", true), true),
6555      setProperty(element, getPropertyName(id, true), true)
6556    );
6557  }
6558  function isElementMarked(element, id) {
6559    const ancestorProperty = getPropertyName(id, true);
6560    if (element[ancestorProperty]) return true;
6561    const elementProperty = getPropertyName(id);
6562    do {
6563      if (element[elementProperty]) return true;
6564      if (!element.parentElement) return false;
6565      element = element.parentElement;
6566    } while (true);
6567  }
6568  function markTreeOutside(id, elements) {
6569    const cleanups = [];
6570    const ids = elements.map((el) => el == null ? void 0 : el.id);
6571    AOUGVQZ3_walkTreeOutside(
6572      id,
6573      elements,
6574      (element) => {
6575        if (_63XF7ACK_isBackdrop(element, ...ids)) return;
6576        cleanups.unshift(markElement(element, id));
6577      },
6578      (ancestor, element) => {
6579        const isAnotherDialogAncestor = element.hasAttribute("data-dialog") && element.id !== id;
6580        if (isAnotherDialogAncestor) return;
6581        cleanups.unshift(markAncestor(ancestor, id));
6582      }
6583    );
6584    const restoreAccessibilityTree = () => {
6585      for (const cleanup of cleanups) {
6586        cleanup();
6587      }
6588    };
6589    return restoreAccessibilityTree;
6590  }
6591  
6592  
6593  
6594  ;// CONCATENATED MODULE: external "ReactDOM"
6595  const external_ReactDOM_namespaceObject = window["ReactDOM"];
6596  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/BSEL4YAF.js
6597  "use client";
6598  
6599  
6600  
6601  
6602  
6603  
6604  
6605  // src/disclosure/disclosure-content.tsx
6606  
6607  
6608  
6609  
6610  var BSEL4YAF_TagName = "div";
6611  function afterTimeout(timeoutMs, cb) {
6612    const timeoutId = setTimeout(cb, timeoutMs);
6613    return () => clearTimeout(timeoutId);
6614  }
6615  function BSEL4YAF_afterPaint(cb) {
6616    let raf = requestAnimationFrame(() => {
6617      raf = requestAnimationFrame(cb);
6618    });
6619    return () => cancelAnimationFrame(raf);
6620  }
6621  function parseCSSTime(...times) {
6622    return times.join(", ").split(", ").reduce((longestTime, currentTimeString) => {
6623      const multiplier = currentTimeString.endsWith("ms") ? 1 : 1e3;
6624      const currentTime = Number.parseFloat(currentTimeString || "0s") * multiplier;
6625      if (currentTime > longestTime) return currentTime;
6626      return longestTime;
6627    }, 0);
6628  }
6629  function isHidden(mounted, hidden, alwaysVisible) {
6630    return !alwaysVisible && hidden !== false && (!mounted || !!hidden);
6631  }
6632  var useDisclosureContent = createHook(function useDisclosureContent2(_a) {
6633    var _b = _a, { store, alwaysVisible } = _b, props = __objRest(_b, ["store", "alwaysVisible"]);
6634    const context = useDisclosureProviderContext();
6635    store = store || context;
6636    invariant(
6637      store,
6638       false && 0
6639    );
6640    const ref = (0,external_React_.useRef)(null);
6641    const id = useId(props.id);
6642    const [transition, setTransition] = (0,external_React_.useState)(null);
6643    const open = store.useState("open");
6644    const mounted = store.useState("mounted");
6645    const animated = store.useState("animated");
6646    const contentElement = store.useState("contentElement");
6647    const otherElement = useStoreState(store.disclosure, "contentElement");
6648    useSafeLayoutEffect(() => {
6649      if (!ref.current) return;
6650      store == null ? void 0 : store.setContentElement(ref.current);
6651    }, [store]);
6652    useSafeLayoutEffect(() => {
6653      let previousAnimated;
6654      store == null ? void 0 : store.setState("animated", (animated2) => {
6655        previousAnimated = animated2;
6656        return true;
6657      });
6658      return () => {
6659        if (previousAnimated === void 0) return;
6660        store == null ? void 0 : store.setState("animated", previousAnimated);
6661      };
6662    }, [store]);
6663    useSafeLayoutEffect(() => {
6664      if (!animated) return;
6665      if (!(contentElement == null ? void 0 : contentElement.isConnected)) {
6666        setTransition(null);
6667        return;
6668      }
6669      return BSEL4YAF_afterPaint(() => {
6670        setTransition(open ? "enter" : mounted ? "leave" : null);
6671      });
6672    }, [animated, contentElement, open, mounted]);
6673    useSafeLayoutEffect(() => {
6674      if (!store) return;
6675      if (!animated) return;
6676      const stopAnimation = () => store == null ? void 0 : store.setState("animating", false);
6677      const stopAnimationSync = () => (0,external_ReactDOM_namespaceObject.flushSync)(stopAnimation);
6678      if (!transition || !contentElement) {
6679        stopAnimation();
6680        return;
6681      }
6682      if (transition === "leave" && open) return;
6683      if (transition === "enter" && !open) return;
6684      if (typeof animated === "number") {
6685        const timeout2 = animated;
6686        return afterTimeout(timeout2, stopAnimationSync);
6687      }
6688      const {
6689        transitionDuration,
6690        animationDuration,
6691        transitionDelay,
6692        animationDelay
6693      } = getComputedStyle(contentElement);
6694      const {
6695        transitionDuration: transitionDuration2 = "0",
6696        animationDuration: animationDuration2 = "0",
6697        transitionDelay: transitionDelay2 = "0",
6698        animationDelay: animationDelay2 = "0"
6699      } = otherElement ? getComputedStyle(otherElement) : {};
6700      const delay = parseCSSTime(
6701        transitionDelay,
6702        animationDelay,
6703        transitionDelay2,
6704        animationDelay2
6705      );
6706      const duration = parseCSSTime(
6707        transitionDuration,
6708        animationDuration,
6709        transitionDuration2,
6710        animationDuration2
6711      );
6712      const timeout = delay + duration;
6713      if (!timeout) {
6714        if (transition === "enter") {
6715          store.setState("animated", false);
6716        }
6717        stopAnimation();
6718        return;
6719      }
6720      const frameRate = 1e3 / 60;
6721      const maxTimeout = Math.max(timeout - frameRate, 0);
6722      return afterTimeout(maxTimeout, stopAnimationSync);
6723    }, [store, animated, contentElement, otherElement, open, transition]);
6724    props = useWrapElement(
6725      props,
6726      (element) => /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(DialogScopedContextProvider, { value: store, children: element }),
6727      [store]
6728    );
6729    const hidden = isHidden(mounted, props.hidden, alwaysVisible);
6730    const styleProp = props.style;
6731    const style = (0,external_React_.useMemo)(() => {
6732      if (hidden) return _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, styleProp), { display: "none" });
6733      return styleProp;
6734    }, [hidden, styleProp]);
6735    props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({
6736      id,
6737      "data-open": open || void 0,
6738      "data-enter": transition === "enter" || void 0,
6739      "data-leave": transition === "leave" || void 0,
6740      hidden
6741    }, props), {
6742      ref: useMergeRefs(id ? store.setContentElement : null, ref, props.ref),
6743      style
6744    });
6745    return removeUndefinedValues(props);
6746  });
6747  var DisclosureContentImpl = forwardRef2(function DisclosureContentImpl2(props) {
6748    const htmlProps = useDisclosureContent(props);
6749    return HKOOKEDE_createElement(BSEL4YAF_TagName, htmlProps);
6750  });
6751  var DisclosureContent = forwardRef2(function DisclosureContent2(_a) {
6752    var _b = _a, {
6753      unmountOnHide
6754    } = _b, props = __objRest(_b, [
6755      "unmountOnHide"
6756    ]);
6757    const context = useDisclosureProviderContext();
6758    const store = props.store || context;
6759    const mounted = useStoreState(
6760      store,
6761      (state) => !unmountOnHide || (state == null ? void 0 : state.mounted)
6762    );
6763    if (mounted === false) return null;
6764    return /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(DisclosureContentImpl, _3YLGPPWQ_spreadValues({}, props));
6765  });
6766  
6767  
6768  
6769  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/UQBPM777.js
6770  "use client";
6771  
6772  
6773  
6774  
6775  
6776  
6777  
6778  // src/dialog/dialog-backdrop.tsx
6779  
6780  
6781  function DialogBackdrop({
6782    store,
6783    backdrop,
6784    alwaysVisible,
6785    hidden
6786  }) {
6787    const ref = (0,external_React_.useRef)(null);
6788    const disclosure = useDisclosureStore({ disclosure: store });
6789    const contentElement = store.useState("contentElement");
6790    useSafeLayoutEffect(() => {
6791      const backdrop2 = ref.current;
6792      const dialog = contentElement;
6793      if (!backdrop2) return;
6794      if (!dialog) return;
6795      backdrop2.style.zIndex = getComputedStyle(dialog).zIndex;
6796    }, [contentElement]);
6797    useSafeLayoutEffect(() => {
6798      const id = contentElement == null ? void 0 : contentElement.id;
6799      if (!id) return;
6800      const backdrop2 = ref.current;
6801      if (!backdrop2) return;
6802      return markAncestor(backdrop2, id);
6803    }, [contentElement]);
6804    const props = useDisclosureContent({
6805      ref,
6806      store: disclosure,
6807      role: "presentation",
6808      "data-backdrop": (contentElement == null ? void 0 : contentElement.id) || "",
6809      alwaysVisible,
6810      hidden: hidden != null ? hidden : void 0,
6811      style: {
6812        position: "fixed",
6813        top: 0,
6814        right: 0,
6815        bottom: 0,
6816        left: 0
6817      }
6818    });
6819    if (!backdrop) return null;
6820    if ((0,external_React_.isValidElement)(backdrop)) {
6821      return /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(Role, _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, props), { render: backdrop }));
6822    }
6823    const Component = typeof backdrop !== "boolean" ? backdrop : "div";
6824    return /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(Role, _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, props), { render: /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(Component, {}) }));
6825  }
6826  
6827  
6828  
6829  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/ESSM74HH.js
6830  "use client";
6831  
6832  
6833  
6834  
6835  // src/dialog/utils/disable-accessibility-tree-outside.ts
6836  function hideElementFromAccessibilityTree(element) {
6837    return setAttribute(element, "aria-hidden", "true");
6838  }
6839  function disableAccessibilityTreeOutside(id, elements) {
6840    const cleanups = [];
6841    const ids = elements.map((el) => el == null ? void 0 : el.id);
6842    walkTreeOutside(id, elements, (element) => {
6843      if (isBackdrop(element, ...ids)) return;
6844      cleanups.unshift(hideElementFromAccessibilityTree(element));
6845    });
6846    const restoreAccessibilityTree = () => {
6847      for (const cleanup of cleanups) {
6848        cleanup();
6849      }
6850    };
6851    return restoreAccessibilityTree;
6852  }
6853  
6854  
6855  
6856  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/677M2CI3.js
6857  "use client";
6858  
6859  // src/dialog/utils/supports-inert.ts
6860  function supportsInert() {
6861    return "inert" in HTMLElement.prototype;
6862  }
6863  
6864  
6865  
6866  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/NSFBIL2Z.js
6867  "use client";
6868  
6869  
6870  
6871  
6872  
6873  
6874  // src/dialog/utils/disable-tree.ts
6875  
6876  
6877  
6878  function disableTree(element, ignoredElements) {
6879    if (!("style" in element)) return noop;
6880    if (supportsInert()) {
6881      return setProperty(element, "inert", true);
6882    }
6883    const tabbableElements = getAllTabbableIn(element, true);
6884    const enableElements = tabbableElements.map((element2) => {
6885      if (ignoredElements == null ? void 0 : ignoredElements.some((el) => el && contains(el, element2))) return noop;
6886      const restoreFocusMethod = orchestrate(element2, "focus", () => {
6887        element2.focus = noop;
6888        return () => {
6889          delete element2.focus;
6890        };
6891      });
6892      return chain(setAttribute(element2, "tabindex", "-1"), restoreFocusMethod);
6893    });
6894    return chain(
6895      ...enableElements,
6896      hideElementFromAccessibilityTree(element),
6897      assignStyle(element, {
6898        pointerEvents: "none",
6899        userSelect: "none",
6900        cursor: "default"
6901      })
6902    );
6903  }
6904  function disableTreeOutside(id, elements) {
6905    const cleanups = [];
6906    const ids = elements.map((el) => el == null ? void 0 : el.id);
6907    AOUGVQZ3_walkTreeOutside(
6908      id,
6909      elements,
6910      (element) => {
6911        if (_63XF7ACK_isBackdrop(element, ...ids)) return;
6912        cleanups.unshift(disableTree(element, elements));
6913      },
6914      (element) => {
6915        if (!element.hasAttribute("role")) return;
6916        if (elements.some((el) => el && contains(el, element))) return;
6917        cleanups.unshift(setAttribute(element, "role", "none"));
6918      }
6919    );
6920    const restoreTreeOutside = () => {
6921      for (const cleanup of cleanups) {
6922        cleanup();
6923      }
6924    };
6925    return restoreTreeOutside;
6926  }
6927  
6928  
6929  
6930  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/YJS26JVG.js
6931  "use client";
6932  
6933  
6934  // src/dialog/utils/use-root-dialog.ts
6935  
6936  
6937  
6938  function useRootDialog({
6939    attribute,
6940    contentId,
6941    contentElement,
6942    enabled
6943  }) {
6944    const [updated, retry] = useForceUpdate();
6945    const isRootDialog = (0,external_React_.useCallback)(() => {
6946      if (!enabled) return false;
6947      if (!contentElement) return false;
6948      const { body } = getDocument(contentElement);
6949      const id = body.getAttribute(attribute);
6950      return !id || id === contentId;
6951    }, [updated, enabled, contentElement, attribute, contentId]);
6952    (0,external_React_.useEffect)(() => {
6953      if (!enabled) return;
6954      if (!contentId) return;
6955      if (!contentElement) return;
6956      const { body } = getDocument(contentElement);
6957      if (isRootDialog()) {
6958        body.setAttribute(attribute, contentId);
6959        return () => body.removeAttribute(attribute);
6960      }
6961      const observer = new MutationObserver(() => (0,external_ReactDOM_namespaceObject.flushSync)(retry));
6962      observer.observe(body, { attributeFilter: [attribute] });
6963      return () => observer.disconnect();
6964    }, [updated, enabled, contentId, contentElement, isRootDialog, attribute]);
6965    return isRootDialog;
6966  }
6967  
6968  
6969  
6970  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/KB6RR6FL.js
6971  "use client";
6972  
6973  
6974  
6975  // src/dialog/utils/use-prevent-body-scroll.ts
6976  
6977  
6978  
6979  
6980  function getPaddingProperty(documentElement) {
6981    const documentLeft = documentElement.getBoundingClientRect().left;
6982    const scrollbarX = Math.round(documentLeft) + documentElement.scrollLeft;
6983    return scrollbarX ? "paddingLeft" : "paddingRight";
6984  }
6985  function usePreventBodyScroll(contentElement, contentId, enabled) {
6986    const isRootDialog = useRootDialog({
6987      attribute: "data-dialog-prevent-body-scroll",
6988      contentElement,
6989      contentId,
6990      enabled
6991    });
6992    (0,external_React_.useEffect)(() => {
6993      if (!isRootDialog()) return;
6994      if (!contentElement) return;
6995      const doc = getDocument(contentElement);
6996      const win = getWindow(contentElement);
6997      const { documentElement, body } = doc;
6998      const cssScrollbarWidth = documentElement.style.getPropertyValue("--scrollbar-width");
6999      const scrollbarWidth = cssScrollbarWidth ? Number.parseInt(cssScrollbarWidth) : win.innerWidth - documentElement.clientWidth;
7000      const setScrollbarWidthProperty = () => setCSSProperty(
7001        documentElement,
7002        "--scrollbar-width",
7003        `$scrollbarWidth}px`
7004      );
7005      const paddingProperty = getPaddingProperty(documentElement);
7006      const setStyle = () => assignStyle(body, {
7007        overflow: "hidden",
7008        [paddingProperty]: `$scrollbarWidth}px`
7009      });
7010      const setIOSStyle = () => {
7011        var _a, _b;
7012        const { scrollX, scrollY, visualViewport } = win;
7013        const offsetLeft = (_a = visualViewport == null ? void 0 : visualViewport.offsetLeft) != null ? _a : 0;
7014        const offsetTop = (_b = visualViewport == null ? void 0 : visualViewport.offsetTop) != null ? _b : 0;
7015        const restoreStyle = assignStyle(body, {
7016          position: "fixed",
7017          overflow: "hidden",
7018          top: `${-(scrollY - Math.floor(offsetTop))}px`,
7019          left: `${-(scrollX - Math.floor(offsetLeft))}px`,
7020          right: "0",
7021          [paddingProperty]: `$scrollbarWidth}px`
7022        });
7023        return () => {
7024          restoreStyle();
7025          if (true) {
7026            win.scrollTo({ left: scrollX, top: scrollY, behavior: "instant" });
7027          }
7028        };
7029      };
7030      const isIOS = isApple() && !isMac();
7031      return chain(
7032        setScrollbarWidthProperty(),
7033        isIOS ? setIOSStyle() : setStyle()
7034      );
7035    }, [isRootDialog, contentElement]);
7036  }
7037  
7038  
7039  
7040  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/T3RMEPVH.js
7041  "use client";
7042  
7043  
7044  // src/dialog/utils/use-nested-dialogs.tsx
7045  
7046  
7047  
7048  
7049  var NestedDialogsContext = (0,external_React_.createContext)({});
7050  function useNestedDialogs(store) {
7051    const context = (0,external_React_.useContext)(NestedDialogsContext);
7052    const [dialogs, setDialogs] = (0,external_React_.useState)([]);
7053    const add = (0,external_React_.useCallback)(
7054      (dialog) => {
7055        var _a;
7056        setDialogs((dialogs2) => [...dialogs2, dialog]);
7057        return chain((_a = context.add) == null ? void 0 : _a.call(context, dialog), () => {
7058          setDialogs((dialogs2) => dialogs2.filter((d) => d !== dialog));
7059        });
7060      },
7061      [context]
7062    );
7063    useSafeLayoutEffect(() => {
7064      return sync(store, ["open", "contentElement"], (state) => {
7065        var _a;
7066        if (!state.open) return;
7067        if (!state.contentElement) return;
7068        return (_a = context.add) == null ? void 0 : _a.call(context, store);
7069      });
7070    }, [store, context]);
7071    const providerValue = (0,external_React_.useMemo)(() => ({ store, add }), [store, add]);
7072    const wrapElement = (0,external_React_.useCallback)(
7073      (element) => /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(NestedDialogsContext.Provider, { value: providerValue, children: element }),
7074      [providerValue]
7075    );
7076    return { wrapElement, nestedDialogs: dialogs };
7077  }
7078  
7079  
7080  
7081  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/HLTQOHKZ.js
7082  "use client";
7083  
7084  // src/dialog/utils/use-previous-mouse-down-ref.ts
7085  
7086  
7087  function usePreviousMouseDownRef(enabled) {
7088    const previousMouseDownRef = (0,external_React_.useRef)();
7089    (0,external_React_.useEffect)(() => {
7090      if (!enabled) {
7091        previousMouseDownRef.current = null;
7092        return;
7093      }
7094      const onMouseDown = (event) => {
7095        previousMouseDownRef.current = event.target;
7096      };
7097      return addGlobalEventListener("mousedown", onMouseDown, true);
7098    }, [enabled]);
7099    return previousMouseDownRef;
7100  }
7101  
7102  
7103  
7104  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/BOZIQ7QT.js
7105  "use client";
7106  
7107  
7108  
7109  
7110  
7111  
7112  
7113  // src/dialog/utils/use-hide-on-interact-outside.ts
7114  
7115  
7116  
7117  function isInDocument(target) {
7118    if (target.tagName === "HTML") return true;
7119    return contains(getDocument(target).body, target);
7120  }
7121  function isDisclosure(disclosure, target) {
7122    if (!disclosure) return false;
7123    if (contains(disclosure, target)) return true;
7124    const activeId = target.getAttribute("aria-activedescendant");
7125    if (activeId) {
7126      const activeElement = getDocument(disclosure).getElementById(activeId);
7127      if (activeElement) {
7128        return contains(disclosure, activeElement);
7129      }
7130    }
7131    return false;
7132  }
7133  function isMouseEventOnDialog(event, dialog) {
7134    if (!("clientY" in event)) return false;
7135    const rect = dialog.getBoundingClientRect();
7136    if (rect.width === 0 || rect.height === 0) return false;
7137    return rect.top <= event.clientY && event.clientY <= rect.top + rect.height && rect.left <= event.clientX && event.clientX <= rect.left + rect.width;
7138  }
7139  function useEventOutside({
7140    store,
7141    type,
7142    listener,
7143    capture,
7144    domReady
7145  }) {
7146    const callListener = useEvent(listener);
7147    const open = useStoreState(store, "open");
7148    const focusedRef = (0,external_React_.useRef)(false);
7149    useSafeLayoutEffect(() => {
7150      if (!open) return;
7151      if (!domReady) return;
7152      const { contentElement } = store.getState();
7153      if (!contentElement) return;
7154      const onFocus = () => {
7155        focusedRef.current = true;
7156      };
7157      contentElement.addEventListener("focusin", onFocus, true);
7158      return () => contentElement.removeEventListener("focusin", onFocus, true);
7159    }, [store, open, domReady]);
7160    (0,external_React_.useEffect)(() => {
7161      if (!open) return;
7162      const onEvent = (event) => {
7163        const { contentElement, disclosureElement } = store.getState();
7164        const target = event.target;
7165        if (!contentElement) return;
7166        if (!target) return;
7167        if (!isInDocument(target)) return;
7168        if (contains(contentElement, target)) return;
7169        if (isDisclosure(disclosureElement, target)) return;
7170        if (target.hasAttribute("data-focus-trap")) return;
7171        if (isMouseEventOnDialog(event, contentElement)) return;
7172        const focused = focusedRef.current;
7173        if (focused && !isElementMarked(target, contentElement.id)) return;
7174        if (isSafariFocusAncestor(target)) return;
7175        callListener(event);
7176      };
7177      return addGlobalEventListener(type, onEvent, capture);
7178    }, [open, capture]);
7179  }
7180  function shouldHideOnInteractOutside(hideOnInteractOutside, event) {
7181    if (typeof hideOnInteractOutside === "function") {
7182      return hideOnInteractOutside(event);
7183    }
7184    return !!hideOnInteractOutside;
7185  }
7186  function useHideOnInteractOutside(store, hideOnInteractOutside, domReady) {
7187    const open = useStoreState(store, "open");
7188    const previousMouseDownRef = usePreviousMouseDownRef(open);
7189    const props = { store, domReady, capture: true };
7190    useEventOutside(_3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, props), {
7191      type: "click",
7192      listener: (event) => {
7193        const { contentElement } = store.getState();
7194        const previousMouseDown = previousMouseDownRef.current;
7195        if (!previousMouseDown) return;
7196        if (!isVisible(previousMouseDown)) return;
7197        if (!isElementMarked(previousMouseDown, contentElement == null ? void 0 : contentElement.id)) return;
7198        if (!shouldHideOnInteractOutside(hideOnInteractOutside, event)) return;
7199        store.hide();
7200      }
7201    }));
7202    useEventOutside(_3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, props), {
7203      type: "focusin",
7204      listener: (event) => {
7205        const { contentElement } = store.getState();
7206        if (!contentElement) return;
7207        if (event.target === getDocument(contentElement)) return;
7208        if (!shouldHideOnInteractOutside(hideOnInteractOutside, event)) return;
7209        store.hide();
7210      }
7211    }));
7212    useEventOutside(_3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, props), {
7213      type: "contextmenu",
7214      listener: (event) => {
7215        if (!shouldHideOnInteractOutside(hideOnInteractOutside, event)) return;
7216        store.hide();
7217      }
7218    }));
7219  }
7220  
7221  
7222  
7223  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/6GXEOXGT.js
7224  "use client";
7225  
7226  // src/dialog/utils/prepend-hidden-dismiss.ts
7227  
7228  function prependHiddenDismiss(container, onClick) {
7229    const document = getDocument(container);
7230    const button = document.createElement("button");
7231    button.type = "button";
7232    button.tabIndex = -1;
7233    button.textContent = "Dismiss popup";
7234    Object.assign(button.style, {
7235      border: "0px",
7236      clip: "rect(0 0 0 0)",
7237      height: "1px",
7238      margin: "-1px",
7239      overflow: "hidden",
7240      padding: "0px",
7241      position: "absolute",
7242      whiteSpace: "nowrap",
7243      width: "1px"
7244    });
7245    button.addEventListener("click", onClick);
7246    container.prepend(button);
7247    const removeHiddenDismiss = () => {
7248      button.removeEventListener("click", onClick);
7249      button.remove();
7250    };
7251    return removeHiddenDismiss;
7252  }
7253  
7254  
7255  
7256  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/HT3UEUDM.js
7257  "use client";
7258  
7259  
7260  
7261  
7262  
7263  // src/focusable/focusable-container.tsx
7264  
7265  var HT3UEUDM_TagName = "div";
7266  var useFocusableContainer = createHook(function useFocusableContainer2(_a) {
7267    var _b = _a, { autoFocusOnShow = true } = _b, props = __objRest(_b, ["autoFocusOnShow"]);
7268    props = useWrapElement(
7269      props,
7270      (element) => /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(FocusableContext.Provider, { value: autoFocusOnShow, children: element }),
7271      [autoFocusOnShow]
7272    );
7273    return props;
7274  });
7275  var FocusableContainer = forwardRef2(function FocusableContainer2(props) {
7276    const htmlProps = useFocusableContainer(props);
7277    return HKOOKEDE_createElement(HT3UEUDM_TagName, htmlProps);
7278  });
7279  
7280  
7281  
7282  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/CZ4GFWYL.js
7283  "use client";
7284  
7285  // src/heading/heading-context.tsx
7286  
7287  var HeadingContext = (0,external_React_.createContext)(0);
7288  
7289  
7290  
7291  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/5M6RIVE2.js
7292  "use client";
7293  
7294  
7295  // src/heading/heading-level.tsx
7296  
7297  
7298  function HeadingLevel({ level, children }) {
7299    const contextLevel = (0,external_React_.useContext)(HeadingContext);
7300    const nextLevel = Math.max(
7301      Math.min(level || contextLevel + 1, 6),
7302      1
7303    );
7304    return /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(HeadingContext.Provider, { value: nextLevel, children });
7305  }
7306  
7307  
7308  
7309  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/ILNAUGA4.js
7310  "use client";
7311  
7312  
7313  
7314  // src/visually-hidden/visually-hidden.tsx
7315  var ILNAUGA4_TagName = "span";
7316  var useVisuallyHidden = createHook(
7317    function useVisuallyHidden2(props) {
7318      props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, props), {
7319        style: _3YLGPPWQ_spreadValues({
7320          border: 0,
7321          clip: "rect(0 0 0 0)",
7322          height: "1px",
7323          margin: "-1px",
7324          overflow: "hidden",
7325          padding: 0,
7326          position: "absolute",
7327          whiteSpace: "nowrap",
7328          width: "1px"
7329        }, props.style)
7330      });
7331      return props;
7332    }
7333  );
7334  var VisuallyHidden = forwardRef2(function VisuallyHidden2(props) {
7335    const htmlProps = useVisuallyHidden(props);
7336    return HKOOKEDE_createElement(ILNAUGA4_TagName, htmlProps);
7337  });
7338  
7339  
7340  
7341  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/LWDIJ7XK.js
7342  "use client";
7343  
7344  
7345  
7346  
7347  // src/focus-trap/focus-trap.tsx
7348  var LWDIJ7XK_TagName = "span";
7349  var useFocusTrap = createHook(
7350    function useFocusTrap2(props) {
7351      props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({
7352        "data-focus-trap": "",
7353        tabIndex: 0,
7354        "aria-hidden": true
7355      }, props), {
7356        style: _3YLGPPWQ_spreadValues({
7357          // Prevents unintended scroll jumps.
7358          position: "fixed",
7359          top: 0,
7360          left: 0
7361        }, props.style)
7362      });
7363      props = useVisuallyHidden(props);
7364      return props;
7365    }
7366  );
7367  var FocusTrap = forwardRef2(function FocusTrap2(props) {
7368    const htmlProps = useFocusTrap(props);
7369    return HKOOKEDE_createElement(LWDIJ7XK_TagName, htmlProps);
7370  });
7371  
7372  
7373  
7374  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/AOQQTIBO.js
7375  "use client";
7376  
7377  // src/portal/portal-context.tsx
7378  
7379  var PortalContext = (0,external_React_.createContext)(null);
7380  
7381  
7382  
7383  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/UNZQGRPO.js
7384  "use client";
7385  
7386  
7387  
7388  
7389  
7390  
7391  
7392  // src/portal/portal.tsx
7393  
7394  
7395  
7396  
7397  
7398  
7399  var UNZQGRPO_TagName = "div";
7400  function getRootElement(element) {
7401    return getDocument(element).body;
7402  }
7403  function getPortalElement(element, portalElement) {
7404    if (!portalElement) {
7405      return getDocument(element).createElement("div");
7406    }
7407    if (typeof portalElement === "function") {
7408      return portalElement(element);
7409    }
7410    return portalElement;
7411  }
7412  function getRandomId(prefix = "id") {
7413    return `$prefix ? `$prefix}-` : ""}$Math.random().toString(36).substr(2, 6)}`;
7414  }
7415  function queueFocus(element) {
7416    queueMicrotask(() => {
7417      element == null ? void 0 : element.focus();
7418    });
7419  }
7420  var usePortal = createHook(function usePortal2(_a) {
7421    var _b = _a, {
7422      preserveTabOrder,
7423      preserveTabOrderAnchor,
7424      portalElement,
7425      portalRef,
7426      portal = true
7427    } = _b, props = __objRest(_b, [
7428      "preserveTabOrder",
7429      "preserveTabOrderAnchor",
7430      "portalElement",
7431      "portalRef",
7432      "portal"
7433    ]);
7434    const ref = (0,external_React_.useRef)(null);
7435    const refProp = useMergeRefs(ref, props.ref);
7436    const context = (0,external_React_.useContext)(PortalContext);
7437    const [portalNode, setPortalNode] = (0,external_React_.useState)(null);
7438    const [anchorPortalNode, setAnchorPortalNode] = (0,external_React_.useState)(
7439      null
7440    );
7441    const outerBeforeRef = (0,external_React_.useRef)(null);
7442    const innerBeforeRef = (0,external_React_.useRef)(null);
7443    const innerAfterRef = (0,external_React_.useRef)(null);
7444    const outerAfterRef = (0,external_React_.useRef)(null);
7445    useSafeLayoutEffect(() => {
7446      const element = ref.current;
7447      if (!element || !portal) {
7448        setPortalNode(null);
7449        return;
7450      }
7451      const portalEl = getPortalElement(element, portalElement);
7452      if (!portalEl) {
7453        setPortalNode(null);
7454        return;
7455      }
7456      const isPortalInDocument = portalEl.isConnected;
7457      if (!isPortalInDocument) {
7458        const rootElement = context || getRootElement(element);
7459        rootElement.appendChild(portalEl);
7460      }
7461      if (!portalEl.id) {
7462        portalEl.id = element.id ? `portal/$element.id}` : getRandomId();
7463      }
7464      setPortalNode(portalEl);
7465      setRef(portalRef, portalEl);
7466      if (isPortalInDocument) return;
7467      return () => {
7468        portalEl.remove();
7469        setRef(portalRef, null);
7470      };
7471    }, [portal, portalElement, context, portalRef]);
7472    useSafeLayoutEffect(() => {
7473      if (!portal) return;
7474      if (!preserveTabOrder) return;
7475      if (!preserveTabOrderAnchor) return;
7476      const doc = getDocument(preserveTabOrderAnchor);
7477      const element = doc.createElement("span");
7478      element.style.position = "fixed";
7479      preserveTabOrderAnchor.insertAdjacentElement("afterend", element);
7480      setAnchorPortalNode(element);
7481      return () => {
7482        element.remove();
7483        setAnchorPortalNode(null);
7484      };
7485    }, [portal, preserveTabOrder, preserveTabOrderAnchor]);
7486    (0,external_React_.useEffect)(() => {
7487      if (!portalNode) return;
7488      if (!preserveTabOrder) return;
7489      let raf = 0;
7490      const onFocus = (event) => {
7491        if (!isFocusEventOutside(event)) return;
7492        const focusing = event.type === "focusin";
7493        cancelAnimationFrame(raf);
7494        if (focusing) {
7495          return restoreFocusIn(portalNode);
7496        }
7497        raf = requestAnimationFrame(() => {
7498          disableFocusIn(portalNode, true);
7499        });
7500      };
7501      portalNode.addEventListener("focusin", onFocus, true);
7502      portalNode.addEventListener("focusout", onFocus, true);
7503      return () => {
7504        cancelAnimationFrame(raf);
7505        portalNode.removeEventListener("focusin", onFocus, true);
7506        portalNode.removeEventListener("focusout", onFocus, true);
7507      };
7508    }, [portalNode, preserveTabOrder]);
7509    props = useWrapElement(
7510      props,
7511      (element) => {
7512        element = // While the portal node is not in the DOM, we need to pass the
7513        // current context to the portal context, otherwise it's going to
7514        // reset to the body element on nested portals.
7515        /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(PortalContext.Provider, { value: portalNode || context, children: element });
7516        if (!portal) return element;
7517        if (!portalNode) {
7518          return /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(
7519            "span",
7520            {
7521              ref: refProp,
7522              id: props.id,
7523              style: { position: "fixed" },
7524              hidden: true
7525            }
7526          );
7527        }
7528        element = /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { children: [
7529          preserveTabOrder && portalNode && /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(
7530            FocusTrap,
7531            {
7532              ref: innerBeforeRef,
7533              className: "__focus-trap-inner-before",
7534              onFocus: (event) => {
7535                if (isFocusEventOutside(event, portalNode)) {
7536                  queueFocus(getNextTabbable());
7537                } else {
7538                  queueFocus(outerBeforeRef.current);
7539                }
7540              }
7541            }
7542          ),
7543          element,
7544          preserveTabOrder && portalNode && /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(
7545            FocusTrap,
7546            {
7547              ref: innerAfterRef,
7548              className: "__focus-trap-inner-after",
7549              onFocus: (event) => {
7550                if (isFocusEventOutside(event, portalNode)) {
7551                  queueFocus(getPreviousTabbable());
7552                } else {
7553                  queueFocus(outerAfterRef.current);
7554                }
7555              }
7556            }
7557          )
7558        ] });
7559        if (portalNode) {
7560          element = (0,external_ReactDOM_namespaceObject.createPortal)(element, portalNode);
7561        }
7562        let preserveTabOrderElement = /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { children: [
7563          preserveTabOrder && portalNode && /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(
7564            FocusTrap,
7565            {
7566              ref: outerBeforeRef,
7567              className: "__focus-trap-outer-before",
7568              onFocus: (event) => {
7569                const fromOuter = event.relatedTarget === outerAfterRef.current;
7570                if (!fromOuter && isFocusEventOutside(event, portalNode)) {
7571                  queueFocus(innerBeforeRef.current);
7572                } else {
7573                  queueFocus(getPreviousTabbable());
7574                }
7575              }
7576            }
7577          ),
7578          preserveTabOrder && // We're using position: fixed here so that the browser doesn't
7579          // add margin to the element when setting gap on a parent element.
7580          /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)("span", { "aria-owns": portalNode == null ? void 0 : portalNode.id, style: { position: "fixed" } }),
7581          preserveTabOrder && portalNode && /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(
7582            FocusTrap,
7583            {
7584              ref: outerAfterRef,
7585              className: "__focus-trap-outer-after",
7586              onFocus: (event) => {
7587                if (isFocusEventOutside(event, portalNode)) {
7588                  queueFocus(innerAfterRef.current);
7589                } else {
7590                  const nextTabbable = getNextTabbable();
7591                  if (nextTabbable === innerBeforeRef.current) {
7592                    requestAnimationFrame(() => {
7593                      var _a2;
7594                      return (_a2 = getNextTabbable()) == null ? void 0 : _a2.focus();
7595                    });
7596                    return;
7597                  }
7598                  queueFocus(nextTabbable);
7599                }
7600              }
7601            }
7602          )
7603        ] });
7604        if (anchorPortalNode && preserveTabOrder) {
7605          preserveTabOrderElement = (0,external_ReactDOM_namespaceObject.createPortal)(
7606            preserveTabOrderElement,
7607            anchorPortalNode
7608          );
7609        }
7610        return /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { children: [
7611          preserveTabOrderElement,
7612          element
7613        ] });
7614      },
7615      [portalNode, context, portal, props.id, preserveTabOrder, anchorPortalNode]
7616    );
7617    props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, props), {
7618      ref: refProp
7619    });
7620    return props;
7621  });
7622  var Portal = forwardRef2(function Portal2(props) {
7623    const htmlProps = usePortal(props);
7624    return HKOOKEDE_createElement(UNZQGRPO_TagName, htmlProps);
7625  });
7626  
7627  
7628  
7629  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/TMQXBAX4.js
7630  "use client";
7631  
7632  
7633  
7634  
7635  
7636  
7637  
7638  
7639  
7640  
7641  
7642  
7643  
7644  
7645  
7646  
7647  
7648  
7649  
7650  
7651  
7652  // src/dialog/dialog.tsx
7653  
7654  
7655  
7656  
7657  
7658  
7659  
7660  var TMQXBAX4_TagName = "div";
7661  var TMQXBAX4_isSafariBrowser = isSafari();
7662  function isAlreadyFocusingAnotherElement(dialog) {
7663    const activeElement = getActiveElement();
7664    if (!activeElement) return false;
7665    if (dialog && contains(dialog, activeElement)) return false;
7666    if (isFocusable(activeElement)) return true;
7667    return false;
7668  }
7669  function getElementFromProp(prop, focusable = false) {
7670    if (!prop) return null;
7671    const element = "current" in prop ? prop.current : prop;
7672    if (!element) return null;
7673    if (focusable) return isFocusable(element) ? element : null;
7674    return element;
7675  }
7676  var useDialog = createHook(function useDialog2(_a) {
7677    var _b = _a, {
7678      store: storeProp,
7679      open: openProp,
7680      onClose,
7681      focusable = true,
7682      modal = true,
7683      portal = !!modal,
7684      backdrop = !!modal,
7685      hideOnEscape = true,
7686      hideOnInteractOutside = true,
7687      getPersistentElements,
7688      preventBodyScroll = !!modal,
7689      autoFocusOnShow = true,
7690      autoFocusOnHide = true,
7691      initialFocus,
7692      finalFocus,
7693      unmountOnHide,
7694      unstable_treeSnapshotKey
7695    } = _b, props = __objRest(_b, [
7696      "store",
7697      "open",
7698      "onClose",
7699      "focusable",
7700      "modal",
7701      "portal",
7702      "backdrop",
7703      "hideOnEscape",
7704      "hideOnInteractOutside",
7705      "getPersistentElements",
7706      "preventBodyScroll",
7707      "autoFocusOnShow",
7708      "autoFocusOnHide",
7709      "initialFocus",
7710      "finalFocus",
7711      "unmountOnHide",
7712      "unstable_treeSnapshotKey"
7713    ]);
7714    const context = useDialogProviderContext();
7715    const ref = (0,external_React_.useRef)(null);
7716    const store = useDialogStore({
7717      store: storeProp || context,
7718      open: openProp,
7719      setOpen(open2) {
7720        if (open2) return;
7721        const dialog = ref.current;
7722        if (!dialog) return;
7723        const event = new Event("close", { bubbles: false, cancelable: true });
7724        if (onClose) {
7725          dialog.addEventListener("close", onClose, { once: true });
7726        }
7727        dialog.dispatchEvent(event);
7728        if (!event.defaultPrevented) return;
7729        store.setOpen(true);
7730      }
7731    });
7732    const { portalRef, domReady } = usePortalRef(portal, props.portalRef);
7733    const preserveTabOrderProp = props.preserveTabOrder;
7734    const preserveTabOrder = store.useState(
7735      (state) => preserveTabOrderProp && !modal && state.mounted
7736    );
7737    const id = useId(props.id);
7738    const open = store.useState("open");
7739    const mounted = store.useState("mounted");
7740    const contentElement = store.useState("contentElement");
7741    const hidden = isHidden(mounted, props.hidden, props.alwaysVisible);
7742    usePreventBodyScroll(contentElement, id, preventBodyScroll && !hidden);
7743    useHideOnInteractOutside(store, hideOnInteractOutside, domReady);
7744    const { wrapElement, nestedDialogs } = useNestedDialogs(store);
7745    props = useWrapElement(props, wrapElement, [wrapElement]);
7746    useSafeLayoutEffect(() => {
7747      if (!open) return;
7748      const dialog = ref.current;
7749      const activeElement = getActiveElement(dialog, true);
7750      if (!activeElement) return;
7751      if (activeElement.tagName === "BODY") return;
7752      if (dialog && contains(dialog, activeElement)) return;
7753      store.setDisclosureElement(activeElement);
7754    }, [store, open]);
7755    if (TMQXBAX4_isSafariBrowser) {
7756      (0,external_React_.useEffect)(() => {
7757        if (!mounted) return;
7758        const { disclosureElement } = store.getState();
7759        if (!disclosureElement) return;
7760        if (!isButton(disclosureElement)) return;
7761        const onMouseDown = () => {
7762          let receivedFocus = false;
7763          const onFocus = () => {
7764            receivedFocus = true;
7765          };
7766          const options = { capture: true, once: true };
7767          disclosureElement.addEventListener("focusin", onFocus, options);
7768          queueBeforeEvent(disclosureElement, "mouseup", () => {
7769            disclosureElement.removeEventListener("focusin", onFocus, true);
7770            if (receivedFocus) return;
7771            focusIfNeeded(disclosureElement);
7772          });
7773        };
7774        disclosureElement.addEventListener("mousedown", onMouseDown);
7775        return () => {
7776          disclosureElement.removeEventListener("mousedown", onMouseDown);
7777        };
7778      }, [store, mounted]);
7779    }
7780    (0,external_React_.useEffect)(() => {
7781      if (!modal) return;
7782      if (!mounted) return;
7783      if (!domReady) return;
7784      const dialog = ref.current;
7785      if (!dialog) return;
7786      const existingDismiss = dialog.querySelector("[data-dialog-dismiss]");
7787      if (existingDismiss) return;
7788      return prependHiddenDismiss(dialog, store.hide);
7789    }, [store, modal, mounted, domReady]);
7790    useSafeLayoutEffect(() => {
7791      if (!supportsInert()) return;
7792      if (open) return;
7793      if (!mounted) return;
7794      if (!domReady) return;
7795      const dialog = ref.current;
7796      if (!dialog) return;
7797      return disableTree(dialog);
7798    }, [open, mounted, domReady]);
7799    const canTakeTreeSnapshot = open && domReady;
7800    useSafeLayoutEffect(() => {
7801      if (!id) return;
7802      if (!canTakeTreeSnapshot) return;
7803      const dialog = ref.current;
7804      return createWalkTreeSnapshot(id, [dialog]);
7805    }, [id, canTakeTreeSnapshot, unstable_treeSnapshotKey]);
7806    const getPersistentElementsProp = useEvent(getPersistentElements);
7807    useSafeLayoutEffect(() => {
7808      if (!id) return;
7809      if (!canTakeTreeSnapshot) return;
7810      const { disclosureElement } = store.getState();
7811      const dialog = ref.current;
7812      const persistentElements = getPersistentElementsProp() || [];
7813      const allElements = [
7814        dialog,
7815        ...persistentElements,
7816        ...nestedDialogs.map((dialog2) => dialog2.getState().contentElement)
7817      ];
7818      if (modal) {
7819        return chain(
7820          markTreeOutside(id, allElements),
7821          disableTreeOutside(id, allElements)
7822        );
7823      }
7824      return markTreeOutside(id, [disclosureElement, ...allElements]);
7825    }, [
7826      id,
7827      store,
7828      canTakeTreeSnapshot,
7829      getPersistentElementsProp,
7830      nestedDialogs,
7831      modal,
7832      unstable_treeSnapshotKey
7833    ]);
7834    const mayAutoFocusOnShow = !!autoFocusOnShow;
7835    const autoFocusOnShowProp = useBooleanEvent(autoFocusOnShow);
7836    const [autoFocusEnabled, setAutoFocusEnabled] = (0,external_React_.useState)(false);
7837    (0,external_React_.useEffect)(() => {
7838      if (!open) return;
7839      if (!mayAutoFocusOnShow) return;
7840      if (!domReady) return;
7841      if (!(contentElement == null ? void 0 : contentElement.isConnected)) return;
7842      const element = getElementFromProp(initialFocus, true) || // If no initial focus is specified, we try to focus the first element
7843      // with the autofocus attribute. If it's an Ariakit component, the
7844      // Focusable component will consume the autoFocus prop and add the
7845      // data-autofocus attribute to the element instead.
7846      contentElement.querySelector(
7847        "[data-autofocus=true],[autofocus]"
7848      ) || // We have to fallback to the first focusable element otherwise portaled
7849      // dialogs with preserveTabOrder set to true will not receive focus
7850      // properly because the elements aren't tabbable until the dialog receives
7851      // focus.
7852      getFirstTabbableIn(contentElement, true, portal && preserveTabOrder) || // Finally, we fallback to the dialog element itself.
7853      contentElement;
7854      const isElementFocusable = isFocusable(element);
7855      if (!autoFocusOnShowProp(isElementFocusable ? element : null)) return;
7856      setAutoFocusEnabled(true);
7857      queueMicrotask(() => {
7858        element.focus();
7859        if (!TMQXBAX4_isSafariBrowser) return;
7860        element.scrollIntoView({ block: "nearest", inline: "nearest" });
7861      });
7862    }, [
7863      open,
7864      mayAutoFocusOnShow,
7865      domReady,
7866      contentElement,
7867      initialFocus,
7868      portal,
7869      preserveTabOrder,
7870      autoFocusOnShowProp
7871    ]);
7872    const mayAutoFocusOnHide = !!autoFocusOnHide;
7873    const autoFocusOnHideProp = useBooleanEvent(autoFocusOnHide);
7874    const [hasOpened, setHasOpened] = (0,external_React_.useState)(false);
7875    (0,external_React_.useEffect)(() => {
7876      if (!open) return;
7877      setHasOpened(true);
7878      return () => setHasOpened(false);
7879    }, [open]);
7880    const focusOnHide = (0,external_React_.useCallback)(
7881      (dialog, retry = true) => {
7882        const { disclosureElement } = store.getState();
7883        if (isAlreadyFocusingAnotherElement(dialog)) return;
7884        let element = getElementFromProp(finalFocus) || disclosureElement;
7885        if (element == null ? void 0 : element.id) {
7886          const doc = getDocument(element);
7887          const selector = `[aria-activedescendant="$element.id}"]`;
7888          const composite = doc.querySelector(selector);
7889          if (composite) {
7890            element = composite;
7891          }
7892        }
7893        if (element && !isFocusable(element)) {
7894          const maybeParentDialog = element.closest("[data-dialog]");
7895          if (maybeParentDialog == null ? void 0 : maybeParentDialog.id) {
7896            const doc = getDocument(maybeParentDialog);
7897            const selector = `[aria-controls~="$maybeParentDialog.id}"]`;
7898            const control = doc.querySelector(selector);
7899            if (control) {
7900              element = control;
7901            }
7902          }
7903        }
7904        const isElementFocusable = element && isFocusable(element);
7905        if (!isElementFocusable && retry) {
7906          requestAnimationFrame(() => focusOnHide(dialog, false));
7907          return;
7908        }
7909        if (!autoFocusOnHideProp(isElementFocusable ? element : null)) return;
7910        if (!isElementFocusable) return;
7911        element == null ? void 0 : element.focus();
7912      },
7913      [store, finalFocus, autoFocusOnHideProp]
7914    );
7915    const focusedOnHideRef = (0,external_React_.useRef)(false);
7916    useSafeLayoutEffect(() => {
7917      if (open) return;
7918      if (!hasOpened) return;
7919      if (!mayAutoFocusOnHide) return;
7920      const dialog = ref.current;
7921      focusedOnHideRef.current = true;
7922      focusOnHide(dialog);
7923    }, [open, hasOpened, domReady, mayAutoFocusOnHide, focusOnHide]);
7924    (0,external_React_.useEffect)(() => {
7925      if (!hasOpened) return;
7926      if (!mayAutoFocusOnHide) return;
7927      const dialog = ref.current;
7928      return () => {
7929        if (focusedOnHideRef.current) {
7930          focusedOnHideRef.current = false;
7931          return;
7932        }
7933        focusOnHide(dialog);
7934      };
7935    }, [hasOpened, mayAutoFocusOnHide, focusOnHide]);
7936    const hideOnEscapeProp = useBooleanEvent(hideOnEscape);
7937    (0,external_React_.useEffect)(() => {
7938      if (!domReady) return;
7939      if (!mounted) return;
7940      const onKeyDown = (event) => {
7941        if (event.key !== "Escape") return;
7942        if (event.defaultPrevented) return;
7943        const dialog = ref.current;
7944        if (!dialog) return;
7945        if (isElementMarked(dialog)) return;
7946        const target = event.target;
7947        if (!target) return;
7948        const { disclosureElement } = store.getState();
7949        const isValidTarget = () => {
7950          if (target.tagName === "BODY") return true;
7951          if (contains(dialog, target)) return true;
7952          if (!disclosureElement) return true;
7953          if (contains(disclosureElement, target)) return true;
7954          return false;
7955        };
7956        if (!isValidTarget()) return;
7957        if (!hideOnEscapeProp(event)) return;
7958        store.hide();
7959      };
7960      return addGlobalEventListener("keydown", onKeyDown, true);
7961    }, [store, domReady, mounted, hideOnEscapeProp]);
7962    props = useWrapElement(
7963      props,
7964      (element) => /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(HeadingLevel, { level: modal ? 1 : void 0, children: element }),
7965      [modal]
7966    );
7967    const hiddenProp = props.hidden;
7968    const alwaysVisible = props.alwaysVisible;
7969    props = useWrapElement(
7970      props,
7971      (element) => {
7972        if (!backdrop) return element;
7973        return /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { children: [
7974          /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(
7975            DialogBackdrop,
7976            {
7977              store,
7978              backdrop,
7979              hidden: hiddenProp,
7980              alwaysVisible
7981            }
7982          ),
7983          element
7984        ] });
7985      },
7986      [store, backdrop, hiddenProp, alwaysVisible]
7987    );
7988    const [headingId, setHeadingId] = (0,external_React_.useState)();
7989    const [descriptionId, setDescriptionId] = (0,external_React_.useState)();
7990    props = useWrapElement(
7991      props,
7992      (element) => /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(DialogScopedContextProvider, { value: store, children: /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(DialogHeadingContext.Provider, { value: setHeadingId, children: /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(DialogDescriptionContext.Provider, { value: setDescriptionId, children: element }) }) }),
7993      [store]
7994    );
7995    props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({
7996      id,
7997      "data-dialog": "",
7998      role: "dialog",
7999      tabIndex: focusable ? -1 : void 0,
8000      "aria-labelledby": headingId,
8001      "aria-describedby": descriptionId
8002    }, props), {
8003      ref: useMergeRefs(ref, props.ref)
8004    });
8005    props = useFocusableContainer(_3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, props), {
8006      autoFocusOnShow: autoFocusEnabled
8007    }));
8008    props = useDisclosureContent(_3YLGPPWQ_spreadValues({ store }, props));
8009    props = useFocusable(_3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, props), { focusable }));
8010    props = usePortal(_3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({ portal }, props), { portalRef, preserveTabOrder }));
8011    return props;
8012  });
8013  function createDialogComponent(Component, useProviderContext = useDialogProviderContext) {
8014    return forwardRef2(function DialogComponent(props) {
8015      const context = useProviderContext();
8016      const store = props.store || context;
8017      const mounted = useStoreState(
8018        store,
8019        (state) => !props.unmountOnHide || (state == null ? void 0 : state.mounted) || !!props.open
8020      );
8021      if (!mounted) return null;
8022      return /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(Component, _3YLGPPWQ_spreadValues({}, props));
8023    });
8024  }
8025  var Dialog = createDialogComponent(
8026    forwardRef2(function Dialog2(props) {
8027      const htmlProps = useDialog(props);
8028      return HKOOKEDE_createElement(TMQXBAX4_TagName, htmlProps);
8029    }),
8030    useDialogProviderContext
8031  );
8032  
8033  
8034  
8035  ;// CONCATENATED MODULE: ./node_modules/@floating-ui/utils/dist/floating-ui.utils.mjs
8036  const floating_ui_utils_sides = (/* unused pure expression or super */ null && (['top', 'right', 'bottom', 'left']));
8037  const alignments = (/* unused pure expression or super */ null && (['start', 'end']));
8038  const floating_ui_utils_placements = /*#__PURE__*/(/* unused pure expression or super */ null && (floating_ui_utils_sides.reduce((acc, side) => acc.concat(side, side + "-" + alignments[0], side + "-" + alignments[1]), [])));
8039  const floating_ui_utils_min = Math.min;
8040  const floating_ui_utils_max = Math.max;
8041  const round = Math.round;
8042  const floor = Math.floor;
8043  const createCoords = v => ({
8044    x: v,
8045    y: v
8046  });
8047  const oppositeSideMap = {
8048    left: 'right',
8049    right: 'left',
8050    bottom: 'top',
8051    top: 'bottom'
8052  };
8053  const oppositeAlignmentMap = {
8054    start: 'end',
8055    end: 'start'
8056  };
8057  function clamp(start, value, end) {
8058    return floating_ui_utils_max(start, floating_ui_utils_min(value, end));
8059  }
8060  function floating_ui_utils_evaluate(value, param) {
8061    return typeof value === 'function' ? value(param) : value;
8062  }
8063  function floating_ui_utils_getSide(placement) {
8064    return placement.split('-')[0];
8065  }
8066  function floating_ui_utils_getAlignment(placement) {
8067    return placement.split('-')[1];
8068  }
8069  function getOppositeAxis(axis) {
8070    return axis === 'x' ? 'y' : 'x';
8071  }
8072  function getAxisLength(axis) {
8073    return axis === 'y' ? 'height' : 'width';
8074  }
8075  function floating_ui_utils_getSideAxis(placement) {
8076    return ['top', 'bottom'].includes(floating_ui_utils_getSide(placement)) ? 'y' : 'x';
8077  }
8078  function getAlignmentAxis(placement) {
8079    return getOppositeAxis(floating_ui_utils_getSideAxis(placement));
8080  }
8081  function floating_ui_utils_getAlignmentSides(placement, rects, rtl) {
8082    if (rtl === void 0) {
8083      rtl = false;
8084    }
8085    const alignment = floating_ui_utils_getAlignment(placement);
8086    const alignmentAxis = getAlignmentAxis(placement);
8087    const length = getAxisLength(alignmentAxis);
8088    let mainAlignmentSide = alignmentAxis === 'x' ? alignment === (rtl ? 'end' : 'start') ? 'right' : 'left' : alignment === 'start' ? 'bottom' : 'top';
8089    if (rects.reference[length] > rects.floating[length]) {
8090      mainAlignmentSide = getOppositePlacement(mainAlignmentSide);
8091    }
8092    return [mainAlignmentSide, getOppositePlacement(mainAlignmentSide)];
8093  }
8094  function getExpandedPlacements(placement) {
8095    const oppositePlacement = getOppositePlacement(placement);
8096    return [floating_ui_utils_getOppositeAlignmentPlacement(placement), oppositePlacement, floating_ui_utils_getOppositeAlignmentPlacement(oppositePlacement)];
8097  }
8098  function floating_ui_utils_getOppositeAlignmentPlacement(placement) {
8099    return placement.replace(/start|end/g, alignment => oppositeAlignmentMap[alignment]);
8100  }
8101  function getSideList(side, isStart, rtl) {
8102    const lr = ['left', 'right'];
8103    const rl = ['right', 'left'];
8104    const tb = ['top', 'bottom'];
8105    const bt = ['bottom', 'top'];
8106    switch (side) {
8107      case 'top':
8108      case 'bottom':
8109        if (rtl) return isStart ? rl : lr;
8110        return isStart ? lr : rl;
8111      case 'left':
8112      case 'right':
8113        return isStart ? tb : bt;
8114      default:
8115        return [];
8116    }
8117  }
8118  function getOppositeAxisPlacements(placement, flipAlignment, direction, rtl) {
8119    const alignment = floating_ui_utils_getAlignment(placement);
8120    let list = getSideList(floating_ui_utils_getSide(placement), direction === 'start', rtl);
8121    if (alignment) {
8122      list = list.map(side => side + "-" + alignment);
8123      if (flipAlignment) {
8124        list = list.concat(list.map(floating_ui_utils_getOppositeAlignmentPlacement));
8125      }
8126    }
8127    return list;
8128  }
8129  function getOppositePlacement(placement) {
8130    return placement.replace(/left|right|bottom|top/g, side => oppositeSideMap[side]);
8131  }
8132  function expandPaddingObject(padding) {
8133    return {
8134      top: 0,
8135      right: 0,
8136      bottom: 0,
8137      left: 0,
8138      ...padding
8139    };
8140  }
8141  function floating_ui_utils_getPaddingObject(padding) {
8142    return typeof padding !== 'number' ? expandPaddingObject(padding) : {
8143      top: padding,
8144      right: padding,
8145      bottom: padding,
8146      left: padding
8147    };
8148  }
8149  function floating_ui_utils_rectToClientRect(rect) {
8150    return {
8151      ...rect,
8152      top: rect.y,
8153      left: rect.x,
8154      right: rect.x + rect.width,
8155      bottom: rect.y + rect.height
8156    };
8157  }
8158  
8159  
8160  
8161  ;// CONCATENATED MODULE: ./node_modules/@floating-ui/core/dist/floating-ui.core.mjs
8162  
8163  
8164  
8165  function computeCoordsFromPlacement(_ref, placement, rtl) {
8166    let {
8167      reference,
8168      floating
8169    } = _ref;
8170    const sideAxis = floating_ui_utils_getSideAxis(placement);
8171    const alignmentAxis = getAlignmentAxis(placement);
8172    const alignLength = getAxisLength(alignmentAxis);
8173    const side = floating_ui_utils_getSide(placement);
8174    const isVertical = sideAxis === 'y';
8175    const commonX = reference.x + reference.width / 2 - floating.width / 2;
8176    const commonY = reference.y + reference.height / 2 - floating.height / 2;
8177    const commonAlign = reference[alignLength] / 2 - floating[alignLength] / 2;
8178    let coords;
8179    switch (side) {
8180      case 'top':
8181        coords = {
8182          x: commonX,
8183          y: reference.y - floating.height
8184        };
8185        break;
8186      case 'bottom':
8187        coords = {
8188          x: commonX,
8189          y: reference.y + reference.height
8190        };
8191        break;
8192      case 'right':
8193        coords = {
8194          x: reference.x + reference.width,
8195          y: commonY
8196        };
8197        break;
8198      case 'left':
8199        coords = {
8200          x: reference.x - floating.width,
8201          y: commonY
8202        };
8203        break;
8204      default:
8205        coords = {
8206          x: reference.x,
8207          y: reference.y
8208        };
8209    }
8210    switch (floating_ui_utils_getAlignment(placement)) {
8211      case 'start':
8212        coords[alignmentAxis] -= commonAlign * (rtl && isVertical ? -1 : 1);
8213        break;
8214      case 'end':
8215        coords[alignmentAxis] += commonAlign * (rtl && isVertical ? -1 : 1);
8216        break;
8217    }
8218    return coords;
8219  }
8220  
8221  /**
8222   * Computes the `x` and `y` coordinates that will place the floating element
8223   * next to a reference element when it is given a certain positioning strategy.
8224   *
8225   * This export does not have any `platform` interface logic. You will need to
8226   * write one for the platform you are using Floating UI with.
8227   */
8228  const computePosition = async (reference, floating, config) => {
8229    const {
8230      placement = 'bottom',
8231      strategy = 'absolute',
8232      middleware = [],
8233      platform
8234    } = config;
8235    const validMiddleware = middleware.filter(Boolean);
8236    const rtl = await (platform.isRTL == null ? void 0 : platform.isRTL(floating));
8237    let rects = await platform.getElementRects({
8238      reference,
8239      floating,
8240      strategy
8241    });
8242    let {
8243      x,
8244      y
8245    } = computeCoordsFromPlacement(rects, placement, rtl);
8246    let statefulPlacement = placement;
8247    let middlewareData = {};
8248    let resetCount = 0;
8249    for (let i = 0; i < validMiddleware.length; i++) {
8250      const {
8251        name,
8252        fn
8253      } = validMiddleware[i];
8254      const {
8255        x: nextX,
8256        y: nextY,
8257        data,
8258        reset
8259      } = await fn({
8260        x,
8261        y,
8262        initialPlacement: placement,
8263        placement: statefulPlacement,
8264        strategy,
8265        middlewareData,
8266        rects,
8267        platform,
8268        elements: {
8269          reference,
8270          floating
8271        }
8272      });
8273      x = nextX != null ? nextX : x;
8274      y = nextY != null ? nextY : y;
8275      middlewareData = {
8276        ...middlewareData,
8277        [name]: {
8278          ...middlewareData[name],
8279          ...data
8280        }
8281      };
8282      if (reset && resetCount <= 50) {
8283        resetCount++;
8284        if (typeof reset === 'object') {
8285          if (reset.placement) {
8286            statefulPlacement = reset.placement;
8287          }
8288          if (reset.rects) {
8289            rects = reset.rects === true ? await platform.getElementRects({
8290              reference,
8291              floating,
8292              strategy
8293            }) : reset.rects;
8294          }
8295          ({
8296            x,
8297            y
8298          } = computeCoordsFromPlacement(rects, statefulPlacement, rtl));
8299        }
8300        i = -1;
8301        continue;
8302      }
8303    }
8304    return {
8305      x,
8306      y,
8307      placement: statefulPlacement,
8308      strategy,
8309      middlewareData
8310    };
8311  };
8312  
8313  /**
8314   * Resolves with an object of overflow side offsets that determine how much the
8315   * element is overflowing a given clipping boundary on each side.
8316   * - positive = overflowing the boundary by that number of pixels
8317   * - negative = how many pixels left before it will overflow
8318   * - 0 = lies flush with the boundary
8319   * @see https://floating-ui.com/docs/detectOverflow
8320   */
8321  async function detectOverflow(state, options) {
8322    var _await$platform$isEle;
8323    if (options === void 0) {
8324      options = {};
8325    }
8326    const {
8327      x,
8328      y,
8329      platform,
8330      rects,
8331      elements,
8332      strategy
8333    } = state;
8334    const {
8335      boundary = 'clippingAncestors',
8336      rootBoundary = 'viewport',
8337      elementContext = 'floating',
8338      altBoundary = false,
8339      padding = 0
8340    } = floating_ui_utils_evaluate(options, state);
8341    const paddingObject = floating_ui_utils_getPaddingObject(padding);
8342    const altContext = elementContext === 'floating' ? 'reference' : 'floating';
8343    const element = elements[altBoundary ? altContext : elementContext];
8344    const clippingClientRect = floating_ui_utils_rectToClientRect(await platform.getClippingRect({
8345      element: ((_await$platform$isEle = await (platform.isElement == null ? void 0 : platform.isElement(element))) != null ? _await$platform$isEle : true) ? element : element.contextElement || (await (platform.getDocumentElement == null ? void 0 : platform.getDocumentElement(elements.floating))),
8346      boundary,
8347      rootBoundary,
8348      strategy
8349    }));
8350    const rect = elementContext === 'floating' ? {
8351      ...rects.floating,
8352      x,
8353      y
8354    } : rects.reference;
8355    const offsetParent = await (platform.getOffsetParent == null ? void 0 : platform.getOffsetParent(elements.floating));
8356    const offsetScale = (await (platform.isElement == null ? void 0 : platform.isElement(offsetParent))) ? (await (platform.getScale == null ? void 0 : platform.getScale(offsetParent))) || {
8357      x: 1,
8358      y: 1
8359    } : {
8360      x: 1,
8361      y: 1
8362    };
8363    const elementClientRect = floating_ui_utils_rectToClientRect(platform.convertOffsetParentRelativeRectToViewportRelativeRect ? await platform.convertOffsetParentRelativeRectToViewportRelativeRect({
8364      rect,
8365      offsetParent,
8366      strategy
8367    }) : rect);
8368    return {
8369      top: (clippingClientRect.top - elementClientRect.top + paddingObject.top) / offsetScale.y,
8370      bottom: (elementClientRect.bottom - clippingClientRect.bottom + paddingObject.bottom) / offsetScale.y,
8371      left: (clippingClientRect.left - elementClientRect.left + paddingObject.left) / offsetScale.x,
8372      right: (elementClientRect.right - clippingClientRect.right + paddingObject.right) / offsetScale.x
8373    };
8374  }
8375  
8376  /**
8377   * Provides data to position an inner element of the floating element so that it
8378   * appears centered to the reference element.
8379   * @see https://floating-ui.com/docs/arrow
8380   */
8381  const arrow = options => ({
8382    name: 'arrow',
8383    options,
8384    async fn(state) {
8385      const {
8386        x,
8387        y,
8388        placement,
8389        rects,
8390        platform,
8391        elements,
8392        middlewareData
8393      } = state;
8394      // Since `element` is required, we don't Partial<> the type.
8395      const {
8396        element,
8397        padding = 0
8398      } = floating_ui_utils_evaluate(options, state) || {};
8399      if (element == null) {
8400        return {};
8401      }
8402      const paddingObject = floating_ui_utils_getPaddingObject(padding);
8403      const coords = {
8404        x,
8405        y
8406      };
8407      const axis = getAlignmentAxis(placement);
8408      const length = getAxisLength(axis);
8409      const arrowDimensions = await platform.getDimensions(element);
8410      const isYAxis = axis === 'y';
8411      const minProp = isYAxis ? 'top' : 'left';
8412      const maxProp = isYAxis ? 'bottom' : 'right';
8413      const clientProp = isYAxis ? 'clientHeight' : 'clientWidth';
8414      const endDiff = rects.reference[length] + rects.reference[axis] - coords[axis] - rects.floating[length];
8415      const startDiff = coords[axis] - rects.reference[axis];
8416      const arrowOffsetParent = await (platform.getOffsetParent == null ? void 0 : platform.getOffsetParent(element));
8417      let clientSize = arrowOffsetParent ? arrowOffsetParent[clientProp] : 0;
8418  
8419      // DOM platform can return `window` as the `offsetParent`.
8420      if (!clientSize || !(await (platform.isElement == null ? void 0 : platform.isElement(arrowOffsetParent)))) {
8421        clientSize = elements.floating[clientProp] || rects.floating[length];
8422      }
8423      const centerToReference = endDiff / 2 - startDiff / 2;
8424  
8425      // If the padding is large enough that it causes the arrow to no longer be
8426      // centered, modify the padding so that it is centered.
8427      const largestPossiblePadding = clientSize / 2 - arrowDimensions[length] / 2 - 1;
8428      const minPadding = floating_ui_utils_min(paddingObject[minProp], largestPossiblePadding);
8429      const maxPadding = floating_ui_utils_min(paddingObject[maxProp], largestPossiblePadding);
8430  
8431      // Make sure the arrow doesn't overflow the floating element if the center
8432      // point is outside the floating element's bounds.
8433      const min$1 = minPadding;
8434      const max = clientSize - arrowDimensions[length] - maxPadding;
8435      const center = clientSize / 2 - arrowDimensions[length] / 2 + centerToReference;
8436      const offset = clamp(min$1, center, max);
8437  
8438      // If the reference is small enough that the arrow's padding causes it to
8439      // to point to nothing for an aligned placement, adjust the offset of the
8440      // floating element itself. To ensure `shift()` continues to take action,
8441      // a single reset is performed when this is true.
8442      const shouldAddOffset = !middlewareData.arrow && floating_ui_utils_getAlignment(placement) != null && center != offset && rects.reference[length] / 2 - (center < min$1 ? minPadding : maxPadding) - arrowDimensions[length] / 2 < 0;
8443      const alignmentOffset = shouldAddOffset ? center < min$1 ? center - min$1 : center - max : 0;
8444      return {
8445        [axis]: coords[axis] + alignmentOffset,
8446        data: {
8447          [axis]: offset,
8448          centerOffset: center - offset - alignmentOffset,
8449          ...(shouldAddOffset && {
8450            alignmentOffset
8451          })
8452        },
8453        reset: shouldAddOffset
8454      };
8455    }
8456  });
8457  
8458  function getPlacementList(alignment, autoAlignment, allowedPlacements) {
8459    const allowedPlacementsSortedByAlignment = alignment ? [...allowedPlacements.filter(placement => getAlignment(placement) === alignment), ...allowedPlacements.filter(placement => getAlignment(placement) !== alignment)] : allowedPlacements.filter(placement => getSide(placement) === placement);
8460    return allowedPlacementsSortedByAlignment.filter(placement => {
8461      if (alignment) {
8462        return getAlignment(placement) === alignment || (autoAlignment ? getOppositeAlignmentPlacement(placement) !== placement : false);
8463      }
8464      return true;
8465    });
8466  }
8467  /**
8468   * Optimizes the visibility of the floating element by choosing the placement
8469   * that has the most space available automatically, without needing to specify a
8470   * preferred placement. Alternative to `flip`.
8471   * @see https://floating-ui.com/docs/autoPlacement
8472   */
8473  const autoPlacement = function (options) {
8474    if (options === void 0) {
8475      options = {};
8476    }
8477    return {
8478      name: 'autoPlacement',
8479      options,
8480      async fn(state) {
8481        var _middlewareData$autoP, _middlewareData$autoP2, _placementsThatFitOnE;
8482        const {
8483          rects,
8484          middlewareData,
8485          placement,
8486          platform,
8487          elements
8488        } = state;
8489        const {
8490          crossAxis = false,
8491          alignment,
8492          allowedPlacements = placements,
8493          autoAlignment = true,
8494          ...detectOverflowOptions
8495        } = evaluate(options, state);
8496        const placements$1 = alignment !== undefined || allowedPlacements === placements ? getPlacementList(alignment || null, autoAlignment, allowedPlacements) : allowedPlacements;
8497        const overflow = await detectOverflow(state, detectOverflowOptions);
8498        const currentIndex = ((_middlewareData$autoP = middlewareData.autoPlacement) == null ? void 0 : _middlewareData$autoP.index) || 0;
8499        const currentPlacement = placements$1[currentIndex];
8500        if (currentPlacement == null) {
8501          return {};
8502        }
8503        const alignmentSides = getAlignmentSides(currentPlacement, rects, await (platform.isRTL == null ? void 0 : platform.isRTL(elements.floating)));
8504  
8505        // Make `computeCoords` start from the right place.
8506        if (placement !== currentPlacement) {
8507          return {
8508            reset: {
8509              placement: placements$1[0]
8510            }
8511          };
8512        }
8513        const currentOverflows = [overflow[getSide(currentPlacement)], overflow[alignmentSides[0]], overflow[alignmentSides[1]]];
8514        const allOverflows = [...(((_middlewareData$autoP2 = middlewareData.autoPlacement) == null ? void 0 : _middlewareData$autoP2.overflows) || []), {
8515          placement: currentPlacement,
8516          overflows: currentOverflows
8517        }];
8518        const nextPlacement = placements$1[currentIndex + 1];
8519  
8520        // There are more placements to check.
8521        if (nextPlacement) {
8522          return {
8523            data: {
8524              index: currentIndex + 1,
8525              overflows: allOverflows
8526            },
8527            reset: {
8528              placement: nextPlacement
8529            }
8530          };
8531        }
8532        const placementsSortedByMostSpace = allOverflows.map(d => {
8533          const alignment = getAlignment(d.placement);
8534          return [d.placement, alignment && crossAxis ?
8535          // Check along the mainAxis and main crossAxis side.
8536          d.overflows.slice(0, 2).reduce((acc, v) => acc + v, 0) :
8537          // Check only the mainAxis.
8538          d.overflows[0], d.overflows];
8539        }).sort((a, b) => a[1] - b[1]);
8540        const placementsThatFitOnEachSide = placementsSortedByMostSpace.filter(d => d[2].slice(0,
8541        // Aligned placements should not check their opposite crossAxis
8542        // side.
8543        getAlignment(d[0]) ? 2 : 3).every(v => v <= 0));
8544        const resetPlacement = ((_placementsThatFitOnE = placementsThatFitOnEachSide[0]) == null ? void 0 : _placementsThatFitOnE[0]) || placementsSortedByMostSpace[0][0];
8545        if (resetPlacement !== placement) {
8546          return {
8547            data: {
8548              index: currentIndex + 1,
8549              overflows: allOverflows
8550            },
8551            reset: {
8552              placement: resetPlacement
8553            }
8554          };
8555        }
8556        return {};
8557      }
8558    };
8559  };
8560  
8561  /**
8562   * Optimizes the visibility of the floating element by flipping the `placement`
8563   * in order to keep it in view when the preferred placement(s) will overflow the
8564   * clipping boundary. Alternative to `autoPlacement`.
8565   * @see https://floating-ui.com/docs/flip
8566   */
8567  const flip = function (options) {
8568    if (options === void 0) {
8569      options = {};
8570    }
8571    return {
8572      name: 'flip',
8573      options,
8574      async fn(state) {
8575        var _middlewareData$arrow, _middlewareData$flip;
8576        const {
8577          placement,
8578          middlewareData,
8579          rects,
8580          initialPlacement,
8581          platform,
8582          elements
8583        } = state;
8584        const {
8585          mainAxis: checkMainAxis = true,
8586          crossAxis: checkCrossAxis = true,
8587          fallbackPlacements: specifiedFallbackPlacements,
8588          fallbackStrategy = 'bestFit',
8589          fallbackAxisSideDirection = 'none',
8590          flipAlignment = true,
8591          ...detectOverflowOptions
8592        } = floating_ui_utils_evaluate(options, state);
8593  
8594        // If a reset by the arrow was caused due to an alignment offset being
8595        // added, we should skip any logic now since `flip()` has already done its
8596        // work.
8597        // https://github.com/floating-ui/floating-ui/issues/2549#issuecomment-1719601643
8598        if ((_middlewareData$arrow = middlewareData.arrow) != null && _middlewareData$arrow.alignmentOffset) {
8599          return {};
8600        }
8601        const side = floating_ui_utils_getSide(placement);
8602        const isBasePlacement = floating_ui_utils_getSide(initialPlacement) === initialPlacement;
8603        const rtl = await (platform.isRTL == null ? void 0 : platform.isRTL(elements.floating));
8604        const fallbackPlacements = specifiedFallbackPlacements || (isBasePlacement || !flipAlignment ? [getOppositePlacement(initialPlacement)] : getExpandedPlacements(initialPlacement));
8605        if (!specifiedFallbackPlacements && fallbackAxisSideDirection !== 'none') {
8606          fallbackPlacements.push(...getOppositeAxisPlacements(initialPlacement, flipAlignment, fallbackAxisSideDirection, rtl));
8607        }
8608        const placements = [initialPlacement, ...fallbackPlacements];
8609        const overflow = await detectOverflow(state, detectOverflowOptions);
8610        const overflows = [];
8611        let overflowsData = ((_middlewareData$flip = middlewareData.flip) == null ? void 0 : _middlewareData$flip.overflows) || [];
8612        if (checkMainAxis) {
8613          overflows.push(overflow[side]);
8614        }
8615        if (checkCrossAxis) {
8616          const sides = floating_ui_utils_getAlignmentSides(placement, rects, rtl);
8617          overflows.push(overflow[sides[0]], overflow[sides[1]]);
8618        }
8619        overflowsData = [...overflowsData, {
8620          placement,
8621          overflows
8622        }];
8623  
8624        // One or more sides is overflowing.
8625        if (!overflows.every(side => side <= 0)) {
8626          var _middlewareData$flip2, _overflowsData$filter;
8627          const nextIndex = (((_middlewareData$flip2 = middlewareData.flip) == null ? void 0 : _middlewareData$flip2.index) || 0) + 1;
8628          const nextPlacement = placements[nextIndex];
8629          if (nextPlacement) {
8630            // Try next placement and re-run the lifecycle.
8631            return {
8632              data: {
8633                index: nextIndex,
8634                overflows: overflowsData
8635              },
8636              reset: {
8637                placement: nextPlacement
8638              }
8639            };
8640          }
8641  
8642          // First, find the candidates that fit on the mainAxis side of overflow,
8643          // then find the placement that fits the best on the main crossAxis side.
8644          let resetPlacement = (_overflowsData$filter = overflowsData.filter(d => d.overflows[0] <= 0).sort((a, b) => a.overflows[1] - b.overflows[1])[0]) == null ? void 0 : _overflowsData$filter.placement;
8645  
8646          // Otherwise fallback.
8647          if (!resetPlacement) {
8648            switch (fallbackStrategy) {
8649              case 'bestFit':
8650                {
8651                  var _overflowsData$map$so;
8652                  const placement = (_overflowsData$map$so = overflowsData.map(d => [d.placement, d.overflows.filter(overflow => overflow > 0).reduce((acc, overflow) => acc + overflow, 0)]).sort((a, b) => a[1] - b[1])[0]) == null ? void 0 : _overflowsData$map$so[0];
8653                  if (placement) {
8654                    resetPlacement = placement;
8655                  }
8656                  break;
8657                }
8658              case 'initialPlacement':
8659                resetPlacement = initialPlacement;
8660                break;
8661            }
8662          }
8663          if (placement !== resetPlacement) {
8664            return {
8665              reset: {
8666                placement: resetPlacement
8667              }
8668            };
8669          }
8670        }
8671        return {};
8672      }
8673    };
8674  };
8675  
8676  function getSideOffsets(overflow, rect) {
8677    return {
8678      top: overflow.top - rect.height,
8679      right: overflow.right - rect.width,
8680      bottom: overflow.bottom - rect.height,
8681      left: overflow.left - rect.width
8682    };
8683  }
8684  function isAnySideFullyClipped(overflow) {
8685    return sides.some(side => overflow[side] >= 0);
8686  }
8687  /**
8688   * Provides data to hide the floating element in applicable situations, such as
8689   * when it is not in the same clipping context as the reference element.
8690   * @see https://floating-ui.com/docs/hide
8691   */
8692  const hide = function (options) {
8693    if (options === void 0) {
8694      options = {};
8695    }
8696    return {
8697      name: 'hide',
8698      options,
8699      async fn(state) {
8700        const {
8701          rects
8702        } = state;
8703        const {
8704          strategy = 'referenceHidden',
8705          ...detectOverflowOptions
8706        } = evaluate(options, state);
8707        switch (strategy) {
8708          case 'referenceHidden':
8709            {
8710              const overflow = await detectOverflow(state, {
8711                ...detectOverflowOptions,
8712                elementContext: 'reference'
8713              });
8714              const offsets = getSideOffsets(overflow, rects.reference);
8715              return {
8716                data: {
8717                  referenceHiddenOffsets: offsets,
8718                  referenceHidden: isAnySideFullyClipped(offsets)
8719                }
8720              };
8721            }
8722          case 'escaped':
8723            {
8724              const overflow = await detectOverflow(state, {
8725                ...detectOverflowOptions,
8726                altBoundary: true
8727              });
8728              const offsets = getSideOffsets(overflow, rects.floating);
8729              return {
8730                data: {
8731                  escapedOffsets: offsets,
8732                  escaped: isAnySideFullyClipped(offsets)
8733                }
8734              };
8735            }
8736          default:
8737            {
8738              return {};
8739            }
8740        }
8741      }
8742    };
8743  };
8744  
8745  function getBoundingRect(rects) {
8746    const minX = min(...rects.map(rect => rect.left));
8747    const minY = min(...rects.map(rect => rect.top));
8748    const maxX = max(...rects.map(rect => rect.right));
8749    const maxY = max(...rects.map(rect => rect.bottom));
8750    return {
8751      x: minX,
8752      y: minY,
8753      width: maxX - minX,
8754      height: maxY - minY
8755    };
8756  }
8757  function getRectsByLine(rects) {
8758    const sortedRects = rects.slice().sort((a, b) => a.y - b.y);
8759    const groups = [];
8760    let prevRect = null;
8761    for (let i = 0; i < sortedRects.length; i++) {
8762      const rect = sortedRects[i];
8763      if (!prevRect || rect.y - prevRect.y > prevRect.height / 2) {
8764        groups.push([rect]);
8765      } else {
8766        groups[groups.length - 1].push(rect);
8767      }
8768      prevRect = rect;
8769    }
8770    return groups.map(rect => rectToClientRect(getBoundingRect(rect)));
8771  }
8772  /**
8773   * Provides improved positioning for inline reference elements that can span
8774   * over multiple lines, such as hyperlinks or range selections.
8775   * @see https://floating-ui.com/docs/inline
8776   */
8777  const inline = function (options) {
8778    if (options === void 0) {
8779      options = {};
8780    }
8781    return {
8782      name: 'inline',
8783      options,
8784      async fn(state) {
8785        const {
8786          placement,
8787          elements,
8788          rects,
8789          platform,
8790          strategy
8791        } = state;
8792        // A MouseEvent's client{X,Y} coords can be up to 2 pixels off a
8793        // ClientRect's bounds, despite the event listener being triggered. A
8794        // padding of 2 seems to handle this issue.
8795        const {
8796          padding = 2,
8797          x,
8798          y
8799        } = evaluate(options, state);
8800        const nativeClientRects = Array.from((await (platform.getClientRects == null ? void 0 : platform.getClientRects(elements.reference))) || []);
8801        const clientRects = getRectsByLine(nativeClientRects);
8802        const fallback = rectToClientRect(getBoundingRect(nativeClientRects));
8803        const paddingObject = getPaddingObject(padding);
8804        function getBoundingClientRect() {
8805          // There are two rects and they are disjoined.
8806          if (clientRects.length === 2 && clientRects[0].left > clientRects[1].right && x != null && y != null) {
8807            // Find the first rect in which the point is fully inside.
8808            return clientRects.find(rect => x > rect.left - paddingObject.left && x < rect.right + paddingObject.right && y > rect.top - paddingObject.top && y < rect.bottom + paddingObject.bottom) || fallback;
8809          }
8810  
8811          // There are 2 or more connected rects.
8812          if (clientRects.length >= 2) {
8813            if (getSideAxis(placement) === 'y') {
8814              const firstRect = clientRects[0];
8815              const lastRect = clientRects[clientRects.length - 1];
8816              const isTop = getSide(placement) === 'top';
8817              const top = firstRect.top;
8818              const bottom = lastRect.bottom;
8819              const left = isTop ? firstRect.left : lastRect.left;
8820              const right = isTop ? firstRect.right : lastRect.right;
8821              const width = right - left;
8822              const height = bottom - top;
8823              return {
8824                top,
8825                bottom,
8826                left,
8827                right,
8828                width,
8829                height,
8830                x: left,
8831                y: top
8832              };
8833            }
8834            const isLeftSide = getSide(placement) === 'left';
8835            const maxRight = max(...clientRects.map(rect => rect.right));
8836            const minLeft = min(...clientRects.map(rect => rect.left));
8837            const measureRects = clientRects.filter(rect => isLeftSide ? rect.left === minLeft : rect.right === maxRight);
8838            const top = measureRects[0].top;
8839            const bottom = measureRects[measureRects.length - 1].bottom;
8840            const left = minLeft;
8841            const right = maxRight;
8842            const width = right - left;
8843            const height = bottom - top;
8844            return {
8845              top,
8846              bottom,
8847              left,
8848              right,
8849              width,
8850              height,
8851              x: left,
8852              y: top
8853            };
8854          }
8855          return fallback;
8856        }
8857        const resetRects = await platform.getElementRects({
8858          reference: {
8859            getBoundingClientRect
8860          },
8861          floating: elements.floating,
8862          strategy
8863        });
8864        if (rects.reference.x !== resetRects.reference.x || rects.reference.y !== resetRects.reference.y || rects.reference.width !== resetRects.reference.width || rects.reference.height !== resetRects.reference.height) {
8865          return {
8866            reset: {
8867              rects: resetRects
8868            }
8869          };
8870        }
8871        return {};
8872      }
8873    };
8874  };
8875  
8876  // For type backwards-compatibility, the `OffsetOptions` type was also
8877  // Derivable.
8878  async function convertValueToCoords(state, options) {
8879    const {
8880      placement,
8881      platform,
8882      elements
8883    } = state;
8884    const rtl = await (platform.isRTL == null ? void 0 : platform.isRTL(elements.floating));
8885    const side = floating_ui_utils_getSide(placement);
8886    const alignment = floating_ui_utils_getAlignment(placement);
8887    const isVertical = floating_ui_utils_getSideAxis(placement) === 'y';
8888    const mainAxisMulti = ['left', 'top'].includes(side) ? -1 : 1;
8889    const crossAxisMulti = rtl && isVertical ? -1 : 1;
8890    const rawValue = floating_ui_utils_evaluate(options, state);
8891  
8892    // eslint-disable-next-line prefer-const
8893    let {
8894      mainAxis,
8895      crossAxis,
8896      alignmentAxis
8897    } = typeof rawValue === 'number' ? {
8898      mainAxis: rawValue,
8899      crossAxis: 0,
8900      alignmentAxis: null
8901    } : {
8902      mainAxis: 0,
8903      crossAxis: 0,
8904      alignmentAxis: null,
8905      ...rawValue
8906    };
8907    if (alignment && typeof alignmentAxis === 'number') {
8908      crossAxis = alignment === 'end' ? alignmentAxis * -1 : alignmentAxis;
8909    }
8910    return isVertical ? {
8911      x: crossAxis * crossAxisMulti,
8912      y: mainAxis * mainAxisMulti
8913    } : {
8914      x: mainAxis * mainAxisMulti,
8915      y: crossAxis * crossAxisMulti
8916    };
8917  }
8918  
8919  /**
8920   * Modifies the placement by translating the floating element along the
8921   * specified axes.
8922   * A number (shorthand for `mainAxis` or distance), or an axes configuration
8923   * object may be passed.
8924   * @see https://floating-ui.com/docs/offset
8925   */
8926  const offset = function (options) {
8927    if (options === void 0) {
8928      options = 0;
8929    }
8930    return {
8931      name: 'offset',
8932      options,
8933      async fn(state) {
8934        const {
8935          x,
8936          y
8937        } = state;
8938        const diffCoords = await convertValueToCoords(state, options);
8939        return {
8940          x: x + diffCoords.x,
8941          y: y + diffCoords.y,
8942          data: diffCoords
8943        };
8944      }
8945    };
8946  };
8947  
8948  /**
8949   * Optimizes the visibility of the floating element by shifting it in order to
8950   * keep it in view when it will overflow the clipping boundary.
8951   * @see https://floating-ui.com/docs/shift
8952   */
8953  const shift = function (options) {
8954    if (options === void 0) {
8955      options = {};
8956    }
8957    return {
8958      name: 'shift',
8959      options,
8960      async fn(state) {
8961        const {
8962          x,
8963          y,
8964          placement
8965        } = state;
8966        const {
8967          mainAxis: checkMainAxis = true,
8968          crossAxis: checkCrossAxis = false,
8969          limiter = {
8970            fn: _ref => {
8971              let {
8972                x,
8973                y
8974              } = _ref;
8975              return {
8976                x,
8977                y
8978              };
8979            }
8980          },
8981          ...detectOverflowOptions
8982        } = floating_ui_utils_evaluate(options, state);
8983        const coords = {
8984          x,
8985          y
8986        };
8987        const overflow = await detectOverflow(state, detectOverflowOptions);
8988        const crossAxis = floating_ui_utils_getSideAxis(floating_ui_utils_getSide(placement));
8989        const mainAxis = getOppositeAxis(crossAxis);
8990        let mainAxisCoord = coords[mainAxis];
8991        let crossAxisCoord = coords[crossAxis];
8992        if (checkMainAxis) {
8993          const minSide = mainAxis === 'y' ? 'top' : 'left';
8994          const maxSide = mainAxis === 'y' ? 'bottom' : 'right';
8995          const min = mainAxisCoord + overflow[minSide];
8996          const max = mainAxisCoord - overflow[maxSide];
8997          mainAxisCoord = clamp(min, mainAxisCoord, max);
8998        }
8999        if (checkCrossAxis) {
9000          const minSide = crossAxis === 'y' ? 'top' : 'left';
9001          const maxSide = crossAxis === 'y' ? 'bottom' : 'right';
9002          const min = crossAxisCoord + overflow[minSide];
9003          const max = crossAxisCoord - overflow[maxSide];
9004          crossAxisCoord = clamp(min, crossAxisCoord, max);
9005        }
9006        const limitedCoords = limiter.fn({
9007          ...state,
9008          [mainAxis]: mainAxisCoord,
9009          [crossAxis]: crossAxisCoord
9010        });
9011        return {
9012          ...limitedCoords,
9013          data: {
9014            x: limitedCoords.x - x,
9015            y: limitedCoords.y - y
9016          }
9017        };
9018      }
9019    };
9020  };
9021  /**
9022   * Built-in `limiter` that will stop `shift()` at a certain point.
9023   */
9024  const limitShift = function (options) {
9025    if (options === void 0) {
9026      options = {};
9027    }
9028    return {
9029      options,
9030      fn(state) {
9031        const {
9032          x,
9033          y,
9034          placement,
9035          rects,
9036          middlewareData
9037        } = state;
9038        const {
9039          offset = 0,
9040          mainAxis: checkMainAxis = true,
9041          crossAxis: checkCrossAxis = true
9042        } = floating_ui_utils_evaluate(options, state);
9043        const coords = {
9044          x,
9045          y
9046        };
9047        const crossAxis = floating_ui_utils_getSideAxis(placement);
9048        const mainAxis = getOppositeAxis(crossAxis);
9049        let mainAxisCoord = coords[mainAxis];
9050        let crossAxisCoord = coords[crossAxis];
9051        const rawOffset = floating_ui_utils_evaluate(offset, state);
9052        const computedOffset = typeof rawOffset === 'number' ? {
9053          mainAxis: rawOffset,
9054          crossAxis: 0
9055        } : {
9056          mainAxis: 0,
9057          crossAxis: 0,
9058          ...rawOffset
9059        };
9060        if (checkMainAxis) {
9061          const len = mainAxis === 'y' ? 'height' : 'width';
9062          const limitMin = rects.reference[mainAxis] - rects.floating[len] + computedOffset.mainAxis;
9063          const limitMax = rects.reference[mainAxis] + rects.reference[len] - computedOffset.mainAxis;
9064          if (mainAxisCoord < limitMin) {
9065            mainAxisCoord = limitMin;
9066          } else if (mainAxisCoord > limitMax) {
9067            mainAxisCoord = limitMax;
9068          }
9069        }
9070        if (checkCrossAxis) {
9071          var _middlewareData$offse, _middlewareData$offse2;
9072          const len = mainAxis === 'y' ? 'width' : 'height';
9073          const isOriginSide = ['top', 'left'].includes(floating_ui_utils_getSide(placement));
9074          const limitMin = rects.reference[crossAxis] - rects.floating[len] + (isOriginSide ? ((_middlewareData$offse = middlewareData.offset) == null ? void 0 : _middlewareData$offse[crossAxis]) || 0 : 0) + (isOriginSide ? 0 : computedOffset.crossAxis);
9075          const limitMax = rects.reference[crossAxis] + rects.reference[len] + (isOriginSide ? 0 : ((_middlewareData$offse2 = middlewareData.offset) == null ? void 0 : _middlewareData$offse2[crossAxis]) || 0) - (isOriginSide ? computedOffset.crossAxis : 0);
9076          if (crossAxisCoord < limitMin) {
9077            crossAxisCoord = limitMin;
9078          } else if (crossAxisCoord > limitMax) {
9079            crossAxisCoord = limitMax;
9080          }
9081        }
9082        return {
9083          [mainAxis]: mainAxisCoord,
9084          [crossAxis]: crossAxisCoord
9085        };
9086      }
9087    };
9088  };
9089  
9090  /**
9091   * Provides data that allows you to change the size of the floating element —
9092   * for instance, prevent it from overflowing the clipping boundary or match the
9093   * width of the reference element.
9094   * @see https://floating-ui.com/docs/size
9095   */
9096  const size = function (options) {
9097    if (options === void 0) {
9098      options = {};
9099    }
9100    return {
9101      name: 'size',
9102      options,
9103      async fn(state) {
9104        const {
9105          placement,
9106          rects,
9107          platform,
9108          elements
9109        } = state;
9110        const {
9111          apply = () => {},
9112          ...detectOverflowOptions
9113        } = floating_ui_utils_evaluate(options, state);
9114        const overflow = await detectOverflow(state, detectOverflowOptions);
9115        const side = floating_ui_utils_getSide(placement);
9116        const alignment = floating_ui_utils_getAlignment(placement);
9117        const isYAxis = floating_ui_utils_getSideAxis(placement) === 'y';
9118        const {
9119          width,
9120          height
9121        } = rects.floating;
9122        let heightSide;
9123        let widthSide;
9124        if (side === 'top' || side === 'bottom') {
9125          heightSide = side;
9126          widthSide = alignment === ((await (platform.isRTL == null ? void 0 : platform.isRTL(elements.floating))) ? 'start' : 'end') ? 'left' : 'right';
9127        } else {
9128          widthSide = side;
9129          heightSide = alignment === 'end' ? 'top' : 'bottom';
9130        }
9131        const overflowAvailableHeight = height - overflow[heightSide];
9132        const overflowAvailableWidth = width - overflow[widthSide];
9133        const noShift = !state.middlewareData.shift;
9134        let availableHeight = overflowAvailableHeight;
9135        let availableWidth = overflowAvailableWidth;
9136        if (isYAxis) {
9137          const maximumClippingWidth = width - overflow.left - overflow.right;
9138          availableWidth = alignment || noShift ? floating_ui_utils_min(overflowAvailableWidth, maximumClippingWidth) : maximumClippingWidth;
9139        } else {
9140          const maximumClippingHeight = height - overflow.top - overflow.bottom;
9141          availableHeight = alignment || noShift ? floating_ui_utils_min(overflowAvailableHeight, maximumClippingHeight) : maximumClippingHeight;
9142        }
9143        if (noShift && !alignment) {
9144          const xMin = floating_ui_utils_max(overflow.left, 0);
9145          const xMax = floating_ui_utils_max(overflow.right, 0);
9146          const yMin = floating_ui_utils_max(overflow.top, 0);
9147          const yMax = floating_ui_utils_max(overflow.bottom, 0);
9148          if (isYAxis) {
9149            availableWidth = width - 2 * (xMin !== 0 || xMax !== 0 ? xMin + xMax : floating_ui_utils_max(overflow.left, overflow.right));
9150          } else {
9151            availableHeight = height - 2 * (yMin !== 0 || yMax !== 0 ? yMin + yMax : floating_ui_utils_max(overflow.top, overflow.bottom));
9152          }
9153        }
9154        await apply({
9155          ...state,
9156          availableWidth,
9157          availableHeight
9158        });
9159        const nextDimensions = await platform.getDimensions(elements.floating);
9160        if (width !== nextDimensions.width || height !== nextDimensions.height) {
9161          return {
9162            reset: {
9163              rects: true
9164            }
9165          };
9166        }
9167        return {};
9168      }
9169    };
9170  };
9171  
9172  
9173  
9174  ;// CONCATENATED MODULE: ./node_modules/@floating-ui/dom/node_modules/@floating-ui/utils/dist/floating-ui.utils.mjs
9175  /**
9176   * Custom positioning reference element.
9177   * @see https://floating-ui.com/docs/virtual-elements
9178   */
9179  
9180  const dist_floating_ui_utils_sides = (/* unused pure expression or super */ null && (['top', 'right', 'bottom', 'left']));
9181  const floating_ui_utils_alignments = (/* unused pure expression or super */ null && (['start', 'end']));
9182  const dist_floating_ui_utils_placements = /*#__PURE__*/(/* unused pure expression or super */ null && (dist_floating_ui_utils_sides.reduce((acc, side) => acc.concat(side, side + "-" + floating_ui_utils_alignments[0], side + "-" + floating_ui_utils_alignments[1]), [])));
9183  const dist_floating_ui_utils_min = Math.min;
9184  const dist_floating_ui_utils_max = Math.max;
9185  const floating_ui_utils_round = Math.round;
9186  const floating_ui_utils_floor = Math.floor;
9187  const floating_ui_utils_createCoords = v => ({
9188    x: v,
9189    y: v
9190  });
9191  const floating_ui_utils_oppositeSideMap = {
9192    left: 'right',
9193    right: 'left',
9194    bottom: 'top',
9195    top: 'bottom'
9196  };
9197  const floating_ui_utils_oppositeAlignmentMap = {
9198    start: 'end',
9199    end: 'start'
9200  };
9201  function floating_ui_utils_clamp(start, value, end) {
9202    return dist_floating_ui_utils_max(start, dist_floating_ui_utils_min(value, end));
9203  }
9204  function dist_floating_ui_utils_evaluate(value, param) {
9205    return typeof value === 'function' ? value(param) : value;
9206  }
9207  function dist_floating_ui_utils_getSide(placement) {
9208    return placement.split('-')[0];
9209  }
9210  function dist_floating_ui_utils_getAlignment(placement) {
9211    return placement.split('-')[1];
9212  }
9213  function floating_ui_utils_getOppositeAxis(axis) {
9214    return axis === 'x' ? 'y' : 'x';
9215  }
9216  function floating_ui_utils_getAxisLength(axis) {
9217    return axis === 'y' ? 'height' : 'width';
9218  }
9219  function dist_floating_ui_utils_getSideAxis(placement) {
9220    return ['top', 'bottom'].includes(dist_floating_ui_utils_getSide(placement)) ? 'y' : 'x';
9221  }
9222  function floating_ui_utils_getAlignmentAxis(placement) {
9223    return floating_ui_utils_getOppositeAxis(dist_floating_ui_utils_getSideAxis(placement));
9224  }
9225  function dist_floating_ui_utils_getAlignmentSides(placement, rects, rtl) {
9226    if (rtl === void 0) {
9227      rtl = false;
9228    }
9229    const alignment = dist_floating_ui_utils_getAlignment(placement);
9230    const alignmentAxis = floating_ui_utils_getAlignmentAxis(placement);
9231    const length = floating_ui_utils_getAxisLength(alignmentAxis);
9232    let mainAlignmentSide = alignmentAxis === 'x' ? alignment === (rtl ? 'end' : 'start') ? 'right' : 'left' : alignment === 'start' ? 'bottom' : 'top';
9233    if (rects.reference[length] > rects.floating[length]) {
9234      mainAlignmentSide = floating_ui_utils_getOppositePlacement(mainAlignmentSide);
9235    }
9236    return [mainAlignmentSide, floating_ui_utils_getOppositePlacement(mainAlignmentSide)];
9237  }
9238  function floating_ui_utils_getExpandedPlacements(placement) {
9239    const oppositePlacement = floating_ui_utils_getOppositePlacement(placement);
9240    return [dist_floating_ui_utils_getOppositeAlignmentPlacement(placement), oppositePlacement, dist_floating_ui_utils_getOppositeAlignmentPlacement(oppositePlacement)];
9241  }
9242  function dist_floating_ui_utils_getOppositeAlignmentPlacement(placement) {
9243    return placement.replace(/start|end/g, alignment => floating_ui_utils_oppositeAlignmentMap[alignment]);
9244  }
9245  function floating_ui_utils_getSideList(side, isStart, rtl) {
9246    const lr = ['left', 'right'];
9247    const rl = ['right', 'left'];
9248    const tb = ['top', 'bottom'];
9249    const bt = ['bottom', 'top'];
9250    switch (side) {
9251      case 'top':
9252      case 'bottom':
9253        if (rtl) return isStart ? rl : lr;
9254        return isStart ? lr : rl;
9255      case 'left':
9256      case 'right':
9257        return isStart ? tb : bt;
9258      default:
9259        return [];
9260    }
9261  }
9262  function floating_ui_utils_getOppositeAxisPlacements(placement, flipAlignment, direction, rtl) {
9263    const alignment = dist_floating_ui_utils_getAlignment(placement);
9264    let list = floating_ui_utils_getSideList(dist_floating_ui_utils_getSide(placement), direction === 'start', rtl);
9265    if (alignment) {
9266      list = list.map(side => side + "-" + alignment);
9267      if (flipAlignment) {
9268        list = list.concat(list.map(dist_floating_ui_utils_getOppositeAlignmentPlacement));
9269      }
9270    }
9271    return list;
9272  }
9273  function floating_ui_utils_getOppositePlacement(placement) {
9274    return placement.replace(/left|right|bottom|top/g, side => floating_ui_utils_oppositeSideMap[side]);
9275  }
9276  function floating_ui_utils_expandPaddingObject(padding) {
9277    return {
9278      top: 0,
9279      right: 0,
9280      bottom: 0,
9281      left: 0,
9282      ...padding
9283    };
9284  }
9285  function dist_floating_ui_utils_getPaddingObject(padding) {
9286    return typeof padding !== 'number' ? floating_ui_utils_expandPaddingObject(padding) : {
9287      top: padding,
9288      right: padding,
9289      bottom: padding,
9290      left: padding
9291    };
9292  }
9293  function dist_floating_ui_utils_rectToClientRect(rect) {
9294    const {
9295      x,
9296      y,
9297      width,
9298      height
9299    } = rect;
9300    return {
9301      width,
9302      height,
9303      top: y,
9304      left: x,
9305      right: x + width,
9306      bottom: y + height,
9307      x,
9308      y
9309    };
9310  }
9311  
9312  
9313  
9314  ;// CONCATENATED MODULE: ./node_modules/@floating-ui/dom/node_modules/@floating-ui/utils/dist/floating-ui.utils.dom.mjs
9315  function hasWindow() {
9316    return typeof window !== 'undefined';
9317  }
9318  function getNodeName(node) {
9319    if (isNode(node)) {
9320      return (node.nodeName || '').toLowerCase();
9321    }
9322    // Mocked nodes in testing environments may not be instances of Node. By
9323    // returning `#document` an infinite loop won't occur.
9324    // https://github.com/floating-ui/floating-ui/issues/2317
9325    return '#document';
9326  }
9327  function floating_ui_utils_dom_getWindow(node) {
9328    var _node$ownerDocument;
9329    return (node == null || (_node$ownerDocument = node.ownerDocument) == null ? void 0 : _node$ownerDocument.defaultView) || window;
9330  }
9331  function getDocumentElement(node) {
9332    var _ref;
9333    return (_ref = (isNode(node) ? node.ownerDocument : node.document) || window.document) == null ? void 0 : _ref.documentElement;
9334  }
9335  function isNode(value) {
9336    if (!hasWindow()) {
9337      return false;
9338    }
9339    return value instanceof Node || value instanceof floating_ui_utils_dom_getWindow(value).Node;
9340  }
9341  function isElement(value) {
9342    if (!hasWindow()) {
9343      return false;
9344    }
9345    return value instanceof Element || value instanceof floating_ui_utils_dom_getWindow(value).Element;
9346  }
9347  function isHTMLElement(value) {
9348    if (!hasWindow()) {
9349      return false;
9350    }
9351    return value instanceof HTMLElement || value instanceof floating_ui_utils_dom_getWindow(value).HTMLElement;
9352  }
9353  function isShadowRoot(value) {
9354    if (!hasWindow() || typeof ShadowRoot === 'undefined') {
9355      return false;
9356    }
9357    return value instanceof ShadowRoot || value instanceof floating_ui_utils_dom_getWindow(value).ShadowRoot;
9358  }
9359  function isOverflowElement(element) {
9360    const {
9361      overflow,
9362      overflowX,
9363      overflowY,
9364      display
9365    } = floating_ui_utils_dom_getComputedStyle(element);
9366    return /auto|scroll|overlay|hidden|clip/.test(overflow + overflowY + overflowX) && !['inline', 'contents'].includes(display);
9367  }
9368  function isTableElement(element) {
9369    return ['table', 'td', 'th'].includes(getNodeName(element));
9370  }
9371  function isTopLayer(element) {
9372    return [':popover-open', ':modal'].some(selector => {
9373      try {
9374        return element.matches(selector);
9375      } catch (e) {
9376        return false;
9377      }
9378    });
9379  }
9380  function isContainingBlock(elementOrCss) {
9381    const webkit = isWebKit();
9382    const css = isElement(elementOrCss) ? floating_ui_utils_dom_getComputedStyle(elementOrCss) : elementOrCss;
9383  
9384    // https://developer.mozilla.org/en-US/docs/Web/CSS/Containing_block#identifying_the_containing_block
9385    return css.transform !== 'none' || css.perspective !== 'none' || (css.containerType ? css.containerType !== 'normal' : false) || !webkit && (css.backdropFilter ? css.backdropFilter !== 'none' : false) || !webkit && (css.filter ? css.filter !== 'none' : false) || ['transform', 'perspective', 'filter'].some(value => (css.willChange || '').includes(value)) || ['paint', 'layout', 'strict', 'content'].some(value => (css.contain || '').includes(value));
9386  }
9387  function getContainingBlock(element) {
9388    let currentNode = getParentNode(element);
9389    while (isHTMLElement(currentNode) && !isLastTraversableNode(currentNode)) {
9390      if (isContainingBlock(currentNode)) {
9391        return currentNode;
9392      } else if (isTopLayer(currentNode)) {
9393        return null;
9394      }
9395      currentNode = getParentNode(currentNode);
9396    }
9397    return null;
9398  }
9399  function isWebKit() {
9400    if (typeof CSS === 'undefined' || !CSS.supports) return false;
9401    return CSS.supports('-webkit-backdrop-filter', 'none');
9402  }
9403  function isLastTraversableNode(node) {
9404    return ['html', 'body', '#document'].includes(getNodeName(node));
9405  }
9406  function floating_ui_utils_dom_getComputedStyle(element) {
9407    return floating_ui_utils_dom_getWindow(element).getComputedStyle(element);
9408  }
9409  function getNodeScroll(element) {
9410    if (isElement(element)) {
9411      return {
9412        scrollLeft: element.scrollLeft,
9413        scrollTop: element.scrollTop
9414      };
9415    }
9416    return {
9417      scrollLeft: element.scrollX,
9418      scrollTop: element.scrollY
9419    };
9420  }
9421  function getParentNode(node) {
9422    if (getNodeName(node) === 'html') {
9423      return node;
9424    }
9425    const result =
9426    // Step into the shadow DOM of the parent of a slotted node.
9427    node.assignedSlot ||
9428    // DOM Element detected.
9429    node.parentNode ||
9430    // ShadowRoot detected.
9431    isShadowRoot(node) && node.host ||
9432    // Fallback.
9433    getDocumentElement(node);
9434    return isShadowRoot(result) ? result.host : result;
9435  }
9436  function getNearestOverflowAncestor(node) {
9437    const parentNode = getParentNode(node);
9438    if (isLastTraversableNode(parentNode)) {
9439      return node.ownerDocument ? node.ownerDocument.body : node.body;
9440    }
9441    if (isHTMLElement(parentNode) && isOverflowElement(parentNode)) {
9442      return parentNode;
9443    }
9444    return getNearestOverflowAncestor(parentNode);
9445  }
9446  function getOverflowAncestors(node, list, traverseIframes) {
9447    var _node$ownerDocument2;
9448    if (list === void 0) {
9449      list = [];
9450    }
9451    if (traverseIframes === void 0) {
9452      traverseIframes = true;
9453    }
9454    const scrollableAncestor = getNearestOverflowAncestor(node);
9455    const isBody = scrollableAncestor === ((_node$ownerDocument2 = node.ownerDocument) == null ? void 0 : _node$ownerDocument2.body);
9456    const win = floating_ui_utils_dom_getWindow(scrollableAncestor);
9457    if (isBody) {
9458      const frameElement = getFrameElement(win);
9459      return list.concat(win, win.visualViewport || [], isOverflowElement(scrollableAncestor) ? scrollableAncestor : [], frameElement && traverseIframes ? getOverflowAncestors(frameElement) : []);
9460    }
9461    return list.concat(scrollableAncestor, getOverflowAncestors(scrollableAncestor, [], traverseIframes));
9462  }
9463  function getFrameElement(win) {
9464    return win.parent && Object.getPrototypeOf(win.parent) ? win.frameElement : null;
9465  }
9466  
9467  
9468  
9469  ;// CONCATENATED MODULE: ./node_modules/@floating-ui/dom/dist/floating-ui.dom.mjs
9470  
9471  
9472  
9473  
9474  
9475  
9476  function getCssDimensions(element) {
9477    const css = floating_ui_utils_dom_getComputedStyle(element);
9478    // In testing environments, the `width` and `height` properties are empty
9479    // strings for SVG elements, returning NaN. Fallback to `0` in this case.
9480    let width = parseFloat(css.width) || 0;
9481    let height = parseFloat(css.height) || 0;
9482    const hasOffset = isHTMLElement(element);
9483    const offsetWidth = hasOffset ? element.offsetWidth : width;
9484    const offsetHeight = hasOffset ? element.offsetHeight : height;
9485    const shouldFallback = floating_ui_utils_round(width) !== offsetWidth || floating_ui_utils_round(height) !== offsetHeight;
9486    if (shouldFallback) {
9487      width = offsetWidth;
9488      height = offsetHeight;
9489    }
9490    return {
9491      width,
9492      height,
9493      $: shouldFallback
9494    };
9495  }
9496  
9497  function unwrapElement(element) {
9498    return !isElement(element) ? element.contextElement : element;
9499  }
9500  
9501  function getScale(element) {
9502    const domElement = unwrapElement(element);
9503    if (!isHTMLElement(domElement)) {
9504      return floating_ui_utils_createCoords(1);
9505    }
9506    const rect = domElement.getBoundingClientRect();
9507    const {
9508      width,
9509      height,
9510      $
9511    } = getCssDimensions(domElement);
9512    let x = ($ ? floating_ui_utils_round(rect.width) : rect.width) / width;
9513    let y = ($ ? floating_ui_utils_round(rect.height) : rect.height) / height;
9514  
9515    // 0, NaN, or Infinity should always fallback to 1.
9516  
9517    if (!x || !Number.isFinite(x)) {
9518      x = 1;
9519    }
9520    if (!y || !Number.isFinite(y)) {
9521      y = 1;
9522    }
9523    return {
9524      x,
9525      y
9526    };
9527  }
9528  
9529  const noOffsets = /*#__PURE__*/floating_ui_utils_createCoords(0);
9530  function getVisualOffsets(element) {
9531    const win = floating_ui_utils_dom_getWindow(element);
9532    if (!isWebKit() || !win.visualViewport) {
9533      return noOffsets;
9534    }
9535    return {
9536      x: win.visualViewport.offsetLeft,
9537      y: win.visualViewport.offsetTop
9538    };
9539  }
9540  function shouldAddVisualOffsets(element, isFixed, floatingOffsetParent) {
9541    if (isFixed === void 0) {
9542      isFixed = false;
9543    }
9544    if (!floatingOffsetParent || isFixed && floatingOffsetParent !== floating_ui_utils_dom_getWindow(element)) {
9545      return false;
9546    }
9547    return isFixed;
9548  }
9549  
9550  function getBoundingClientRect(element, includeScale, isFixedStrategy, offsetParent) {
9551    if (includeScale === void 0) {
9552      includeScale = false;
9553    }
9554    if (isFixedStrategy === void 0) {
9555      isFixedStrategy = false;
9556    }
9557    const clientRect = element.getBoundingClientRect();
9558    const domElement = unwrapElement(element);
9559    let scale = floating_ui_utils_createCoords(1);
9560    if (includeScale) {
9561      if (offsetParent) {
9562        if (isElement(offsetParent)) {
9563          scale = getScale(offsetParent);
9564        }
9565      } else {
9566        scale = getScale(element);
9567      }
9568    }
9569    const visualOffsets = shouldAddVisualOffsets(domElement, isFixedStrategy, offsetParent) ? getVisualOffsets(domElement) : floating_ui_utils_createCoords(0);
9570    let x = (clientRect.left + visualOffsets.x) / scale.x;
9571    let y = (clientRect.top + visualOffsets.y) / scale.y;
9572    let width = clientRect.width / scale.x;
9573    let height = clientRect.height / scale.y;
9574    if (domElement) {
9575      const win = floating_ui_utils_dom_getWindow(domElement);
9576      const offsetWin = offsetParent && isElement(offsetParent) ? floating_ui_utils_dom_getWindow(offsetParent) : offsetParent;
9577      let currentWin = win;
9578      let currentIFrame = currentWin.frameElement;
9579      while (currentIFrame && offsetParent && offsetWin !== currentWin) {
9580        const iframeScale = getScale(currentIFrame);
9581        const iframeRect = currentIFrame.getBoundingClientRect();
9582        const css = floating_ui_utils_dom_getComputedStyle(currentIFrame);
9583        const left = iframeRect.left + (currentIFrame.clientLeft + parseFloat(css.paddingLeft)) * iframeScale.x;
9584        const top = iframeRect.top + (currentIFrame.clientTop + parseFloat(css.paddingTop)) * iframeScale.y;
9585        x *= iframeScale.x;
9586        y *= iframeScale.y;
9587        width *= iframeScale.x;
9588        height *= iframeScale.y;
9589        x += left;
9590        y += top;
9591        currentWin = floating_ui_utils_dom_getWindow(currentIFrame);
9592        currentIFrame = currentWin.frameElement;
9593      }
9594    }
9595    return floating_ui_utils_rectToClientRect({
9596      width,
9597      height,
9598      x,
9599      y
9600    });
9601  }
9602  
9603  const topLayerSelectors = [':popover-open', ':modal'];
9604  function floating_ui_dom_isTopLayer(floating) {
9605    return topLayerSelectors.some(selector => {
9606      try {
9607        return floating.matches(selector);
9608      } catch (e) {
9609        return false;
9610      }
9611    });
9612  }
9613  
9614  function convertOffsetParentRelativeRectToViewportRelativeRect(_ref) {
9615    let {
9616      elements,
9617      rect,
9618      offsetParent,
9619      strategy
9620    } = _ref;
9621    const isFixed = strategy === 'fixed';
9622    const documentElement = getDocumentElement(offsetParent);
9623    const topLayer = elements ? floating_ui_dom_isTopLayer(elements.floating) : false;
9624    if (offsetParent === documentElement || topLayer && isFixed) {
9625      return rect;
9626    }
9627    let scroll = {
9628      scrollLeft: 0,
9629      scrollTop: 0
9630    };
9631    let scale = floating_ui_utils_createCoords(1);
9632    const offsets = floating_ui_utils_createCoords(0);
9633    const isOffsetParentAnElement = isHTMLElement(offsetParent);
9634    if (isOffsetParentAnElement || !isOffsetParentAnElement && !isFixed) {
9635      if (getNodeName(offsetParent) !== 'body' || isOverflowElement(documentElement)) {
9636        scroll = getNodeScroll(offsetParent);
9637      }
9638      if (isHTMLElement(offsetParent)) {
9639        const offsetRect = getBoundingClientRect(offsetParent);
9640        scale = getScale(offsetParent);
9641        offsets.x = offsetRect.x + offsetParent.clientLeft;
9642        offsets.y = offsetRect.y + offsetParent.clientTop;
9643      }
9644    }
9645    return {
9646      width: rect.width * scale.x,
9647      height: rect.height * scale.y,
9648      x: rect.x * scale.x - scroll.scrollLeft * scale.x + offsets.x,
9649      y: rect.y * scale.y - scroll.scrollTop * scale.y + offsets.y
9650    };
9651  }
9652  
9653  function getClientRects(element) {
9654    return Array.from(element.getClientRects());
9655  }
9656  
9657  function getWindowScrollBarX(element) {
9658    // If <html> has a CSS width greater than the viewport, then this will be
9659    // incorrect for RTL.
9660    return getBoundingClientRect(getDocumentElement(element)).left + getNodeScroll(element).scrollLeft;
9661  }
9662  
9663  // Gets the entire size of the scrollable document area, even extending outside
9664  // of the `<html>` and `<body>` rect bounds if horizontally scrollable.
9665  function getDocumentRect(element) {
9666    const html = getDocumentElement(element);
9667    const scroll = getNodeScroll(element);
9668    const body = element.ownerDocument.body;
9669    const width = dist_floating_ui_utils_max(html.scrollWidth, html.clientWidth, body.scrollWidth, body.clientWidth);
9670    const height = dist_floating_ui_utils_max(html.scrollHeight, html.clientHeight, body.scrollHeight, body.clientHeight);
9671    let x = -scroll.scrollLeft + getWindowScrollBarX(element);
9672    const y = -scroll.scrollTop;
9673    if (floating_ui_utils_dom_getComputedStyle(body).direction === 'rtl') {
9674      x += dist_floating_ui_utils_max(html.clientWidth, body.clientWidth) - width;
9675    }
9676    return {
9677      width,
9678      height,
9679      x,
9680      y
9681    };
9682  }
9683  
9684  function getViewportRect(element, strategy) {
9685    const win = floating_ui_utils_dom_getWindow(element);
9686    const html = getDocumentElement(element);
9687    const visualViewport = win.visualViewport;
9688    let width = html.clientWidth;
9689    let height = html.clientHeight;
9690    let x = 0;
9691    let y = 0;
9692    if (visualViewport) {
9693      width = visualViewport.width;
9694      height = visualViewport.height;
9695      const visualViewportBased = isWebKit();
9696      if (!visualViewportBased || visualViewportBased && strategy === 'fixed') {
9697        x = visualViewport.offsetLeft;
9698        y = visualViewport.offsetTop;
9699      }
9700    }
9701    return {
9702      width,
9703      height,
9704      x,
9705      y
9706    };
9707  }
9708  
9709  // Returns the inner client rect, subtracting scrollbars if present.
9710  function getInnerBoundingClientRect(element, strategy) {
9711    const clientRect = getBoundingClientRect(element, true, strategy === 'fixed');
9712    const top = clientRect.top + element.clientTop;
9713    const left = clientRect.left + element.clientLeft;
9714    const scale = isHTMLElement(element) ? getScale(element) : floating_ui_utils_createCoords(1);
9715    const width = element.clientWidth * scale.x;
9716    const height = element.clientHeight * scale.y;
9717    const x = left * scale.x;
9718    const y = top * scale.y;
9719    return {
9720      width,
9721      height,
9722      x,
9723      y
9724    };
9725  }
9726  function getClientRectFromClippingAncestor(element, clippingAncestor, strategy) {
9727    let rect;
9728    if (clippingAncestor === 'viewport') {
9729      rect = getViewportRect(element, strategy);
9730    } else if (clippingAncestor === 'document') {
9731      rect = getDocumentRect(getDocumentElement(element));
9732    } else if (isElement(clippingAncestor)) {
9733      rect = getInnerBoundingClientRect(clippingAncestor, strategy);
9734    } else {
9735      const visualOffsets = getVisualOffsets(element);
9736      rect = {
9737        ...clippingAncestor,
9738        x: clippingAncestor.x - visualOffsets.x,
9739        y: clippingAncestor.y - visualOffsets.y
9740      };
9741    }
9742    return floating_ui_utils_rectToClientRect(rect);
9743  }
9744  function hasFixedPositionAncestor(element, stopNode) {
9745    const parentNode = getParentNode(element);
9746    if (parentNode === stopNode || !isElement(parentNode) || isLastTraversableNode(parentNode)) {
9747      return false;
9748    }
9749    return floating_ui_utils_dom_getComputedStyle(parentNode).position === 'fixed' || hasFixedPositionAncestor(parentNode, stopNode);
9750  }
9751  
9752  // A "clipping ancestor" is an `overflow` element with the characteristic of
9753  // clipping (or hiding) child elements. This returns all clipping ancestors
9754  // of the given element up the tree.
9755  function getClippingElementAncestors(element, cache) {
9756    const cachedResult = cache.get(element);
9757    if (cachedResult) {
9758      return cachedResult;
9759    }
9760    let result = getOverflowAncestors(element, [], false).filter(el => isElement(el) && getNodeName(el) !== 'body');
9761    let currentContainingBlockComputedStyle = null;
9762    const elementIsFixed = floating_ui_utils_dom_getComputedStyle(element).position === 'fixed';
9763    let currentNode = elementIsFixed ? getParentNode(element) : element;
9764  
9765    // https://developer.mozilla.org/en-US/docs/Web/CSS/Containing_block#identifying_the_containing_block
9766    while (isElement(currentNode) && !isLastTraversableNode(currentNode)) {
9767      const computedStyle = floating_ui_utils_dom_getComputedStyle(currentNode);
9768      const currentNodeIsContaining = isContainingBlock(currentNode);
9769      if (!currentNodeIsContaining && computedStyle.position === 'fixed') {
9770        currentContainingBlockComputedStyle = null;
9771      }
9772      const shouldDropCurrentNode = elementIsFixed ? !currentNodeIsContaining && !currentContainingBlockComputedStyle : !currentNodeIsContaining && computedStyle.position === 'static' && !!currentContainingBlockComputedStyle && ['absolute', 'fixed'].includes(currentContainingBlockComputedStyle.position) || isOverflowElement(currentNode) && !currentNodeIsContaining && hasFixedPositionAncestor(element, currentNode);
9773      if (shouldDropCurrentNode) {
9774        // Drop non-containing blocks.
9775        result = result.filter(ancestor => ancestor !== currentNode);
9776      } else {
9777        // Record last containing block for next iteration.
9778        currentContainingBlockComputedStyle = computedStyle;
9779      }
9780      currentNode = getParentNode(currentNode);
9781    }
9782    cache.set(element, result);
9783    return result;
9784  }
9785  
9786  // Gets the maximum area that the element is visible in due to any number of
9787  // clipping ancestors.
9788  function getClippingRect(_ref) {
9789    let {
9790      element,
9791      boundary,
9792      rootBoundary,
9793      strategy
9794    } = _ref;
9795    const elementClippingAncestors = boundary === 'clippingAncestors' ? getClippingElementAncestors(element, this._c) : [].concat(boundary);
9796    const clippingAncestors = [...elementClippingAncestors, rootBoundary];
9797    const firstClippingAncestor = clippingAncestors[0];
9798    const clippingRect = clippingAncestors.reduce((accRect, clippingAncestor) => {
9799      const rect = getClientRectFromClippingAncestor(element, clippingAncestor, strategy);
9800      accRect.top = dist_floating_ui_utils_max(rect.top, accRect.top);
9801      accRect.right = dist_floating_ui_utils_min(rect.right, accRect.right);
9802      accRect.bottom = dist_floating_ui_utils_min(rect.bottom, accRect.bottom);
9803      accRect.left = dist_floating_ui_utils_max(rect.left, accRect.left);
9804      return accRect;
9805    }, getClientRectFromClippingAncestor(element, firstClippingAncestor, strategy));
9806    return {
9807      width: clippingRect.right - clippingRect.left,
9808      height: clippingRect.bottom - clippingRect.top,
9809      x: clippingRect.left,
9810      y: clippingRect.top
9811    };
9812  }
9813  
9814  function getDimensions(element) {
9815    const {
9816      width,
9817      height
9818    } = getCssDimensions(element);
9819    return {
9820      width,
9821      height
9822    };
9823  }
9824  
9825  function getRectRelativeToOffsetParent(element, offsetParent, strategy) {
9826    const isOffsetParentAnElement = isHTMLElement(offsetParent);
9827    const documentElement = getDocumentElement(offsetParent);
9828    const isFixed = strategy === 'fixed';
9829    const rect = getBoundingClientRect(element, true, isFixed, offsetParent);
9830    let scroll = {
9831      scrollLeft: 0,
9832      scrollTop: 0
9833    };
9834    const offsets = floating_ui_utils_createCoords(0);
9835    if (isOffsetParentAnElement || !isOffsetParentAnElement && !isFixed) {
9836      if (getNodeName(offsetParent) !== 'body' || isOverflowElement(documentElement)) {
9837        scroll = getNodeScroll(offsetParent);
9838      }
9839      if (isOffsetParentAnElement) {
9840        const offsetRect = getBoundingClientRect(offsetParent, true, isFixed, offsetParent);
9841        offsets.x = offsetRect.x + offsetParent.clientLeft;
9842        offsets.y = offsetRect.y + offsetParent.clientTop;
9843      } else if (documentElement) {
9844        offsets.x = getWindowScrollBarX(documentElement);
9845      }
9846    }
9847    const x = rect.left + scroll.scrollLeft - offsets.x;
9848    const y = rect.top + scroll.scrollTop - offsets.y;
9849    return {
9850      x,
9851      y,
9852      width: rect.width,
9853      height: rect.height
9854    };
9855  }
9856  
9857  function getTrueOffsetParent(element, polyfill) {
9858    if (!isHTMLElement(element) || floating_ui_utils_dom_getComputedStyle(element).position === 'fixed') {
9859      return null;
9860    }
9861    if (polyfill) {
9862      return polyfill(element);
9863    }
9864    return element.offsetParent;
9865  }
9866  
9867  // Gets the closest ancestor positioned element. Handles some edge cases,
9868  // such as table ancestors and cross browser bugs.
9869  function getOffsetParent(element, polyfill) {
9870    const window = floating_ui_utils_dom_getWindow(element);
9871    if (!isHTMLElement(element) || floating_ui_dom_isTopLayer(element)) {
9872      return window;
9873    }
9874    let offsetParent = getTrueOffsetParent(element, polyfill);
9875    while (offsetParent && isTableElement(offsetParent) && floating_ui_utils_dom_getComputedStyle(offsetParent).position === 'static') {
9876      offsetParent = getTrueOffsetParent(offsetParent, polyfill);
9877    }
9878    if (offsetParent && (getNodeName(offsetParent) === 'html' || getNodeName(offsetParent) === 'body' && floating_ui_utils_dom_getComputedStyle(offsetParent).position === 'static' && !isContainingBlock(offsetParent))) {
9879      return window;
9880    }
9881    return offsetParent || getContainingBlock(element) || window;
9882  }
9883  
9884  const getElementRects = async function (data) {
9885    const getOffsetParentFn = this.getOffsetParent || getOffsetParent;
9886    const getDimensionsFn = this.getDimensions;
9887    return {
9888      reference: getRectRelativeToOffsetParent(data.reference, await getOffsetParentFn(data.floating), data.strategy),
9889      floating: {
9890        x: 0,
9891        y: 0,
9892        ...(await getDimensionsFn(data.floating))
9893      }
9894    };
9895  };
9896  
9897  function isRTL(element) {
9898    return floating_ui_utils_dom_getComputedStyle(element).direction === 'rtl';
9899  }
9900  
9901  const platform = {
9902    convertOffsetParentRelativeRectToViewportRelativeRect,
9903    getDocumentElement: getDocumentElement,
9904    getClippingRect,
9905    getOffsetParent,
9906    getElementRects,
9907    getClientRects,
9908    getDimensions,
9909    getScale,
9910    isElement: isElement,
9911    isRTL
9912  };
9913  
9914  // https://samthor.au/2021/observing-dom/
9915  function observeMove(element, onMove) {
9916    let io = null;
9917    let timeoutId;
9918    const root = getDocumentElement(element);
9919    function cleanup() {
9920      var _io;
9921      clearTimeout(timeoutId);
9922      (_io = io) == null || _io.disconnect();
9923      io = null;
9924    }
9925    function refresh(skip, threshold) {
9926      if (skip === void 0) {
9927        skip = false;
9928      }
9929      if (threshold === void 0) {
9930        threshold = 1;
9931      }
9932      cleanup();
9933      const {
9934        left,
9935        top,
9936        width,
9937        height
9938      } = element.getBoundingClientRect();
9939      if (!skip) {
9940        onMove();
9941      }
9942      if (!width || !height) {
9943        return;
9944      }
9945      const insetTop = floating_ui_utils_floor(top);
9946      const insetRight = floating_ui_utils_floor(root.clientWidth - (left + width));
9947      const insetBottom = floating_ui_utils_floor(root.clientHeight - (top + height));
9948      const insetLeft = floating_ui_utils_floor(left);
9949      const rootMargin = -insetTop + "px " + -insetRight + "px " + -insetBottom + "px " + -insetLeft + "px";
9950      const options = {
9951        rootMargin,
9952        threshold: dist_floating_ui_utils_max(0, dist_floating_ui_utils_min(1, threshold)) || 1
9953      };
9954      let isFirstUpdate = true;
9955      function handleObserve(entries) {
9956        const ratio = entries[0].intersectionRatio;
9957        if (ratio !== threshold) {
9958          if (!isFirstUpdate) {
9959            return refresh();
9960          }
9961          if (!ratio) {
9962            timeoutId = setTimeout(() => {
9963              refresh(false, 1e-7);
9964            }, 100);
9965          } else {
9966            refresh(false, ratio);
9967          }
9968        }
9969        isFirstUpdate = false;
9970      }
9971  
9972      // Older browsers don't support a `document` as the root and will throw an
9973      // error.
9974      try {
9975        io = new IntersectionObserver(handleObserve, {
9976          ...options,
9977          // Handle <iframe>s
9978          root: root.ownerDocument
9979        });
9980      } catch (e) {
9981        io = new IntersectionObserver(handleObserve, options);
9982      }
9983      io.observe(element);
9984    }
9985    refresh(true);
9986    return cleanup;
9987  }
9988  
9989  /**
9990   * Automatically updates the position of the floating element when necessary.
9991   * Should only be called when the floating element is mounted on the DOM or
9992   * visible on the screen.
9993   * @returns cleanup function that should be invoked when the floating element is
9994   * removed from the DOM or hidden from the screen.
9995   * @see https://floating-ui.com/docs/autoUpdate
9996   */
9997  function autoUpdate(reference, floating, update, options) {
9998    if (options === void 0) {
9999      options = {};
10000    }
10001    const {
10002      ancestorScroll = true,
10003      ancestorResize = true,
10004      elementResize = typeof ResizeObserver === 'function',
10005      layoutShift = typeof IntersectionObserver === 'function',
10006      animationFrame = false
10007    } = options;
10008    const referenceEl = unwrapElement(reference);
10009    const ancestors = ancestorScroll || ancestorResize ? [...(referenceEl ? getOverflowAncestors(referenceEl) : []), ...getOverflowAncestors(floating)] : [];
10010    ancestors.forEach(ancestor => {
10011      ancestorScroll && ancestor.addEventListener('scroll', update, {
10012        passive: true
10013      });
10014      ancestorResize && ancestor.addEventListener('resize', update);
10015    });
10016    const cleanupIo = referenceEl && layoutShift ? observeMove(referenceEl, update) : null;
10017    let reobserveFrame = -1;
10018    let resizeObserver = null;
10019    if (elementResize) {
10020      resizeObserver = new ResizeObserver(_ref => {
10021        let [firstEntry] = _ref;
10022        if (firstEntry && firstEntry.target === referenceEl && resizeObserver) {
10023          // Prevent update loops when using the `size` middleware.
10024          // https://github.com/floating-ui/floating-ui/issues/1740
10025          resizeObserver.unobserve(floating);
10026          cancelAnimationFrame(reobserveFrame);
10027          reobserveFrame = requestAnimationFrame(() => {
10028            var _resizeObserver;
10029            (_resizeObserver = resizeObserver) == null || _resizeObserver.observe(floating);
10030          });
10031        }
10032        update();
10033      });
10034      if (referenceEl && !animationFrame) {
10035        resizeObserver.observe(referenceEl);
10036      }
10037      resizeObserver.observe(floating);
10038    }
10039    let frameId;
10040    let prevRefRect = animationFrame ? getBoundingClientRect(reference) : null;
10041    if (animationFrame) {
10042      frameLoop();
10043    }
10044    function frameLoop() {
10045      const nextRefRect = getBoundingClientRect(reference);
10046      if (prevRefRect && (nextRefRect.x !== prevRefRect.x || nextRefRect.y !== prevRefRect.y || nextRefRect.width !== prevRefRect.width || nextRefRect.height !== prevRefRect.height)) {
10047        update();
10048      }
10049      prevRefRect = nextRefRect;
10050      frameId = requestAnimationFrame(frameLoop);
10051    }
10052    update();
10053    return () => {
10054      var _resizeObserver2;
10055      ancestors.forEach(ancestor => {
10056        ancestorScroll && ancestor.removeEventListener('scroll', update);
10057        ancestorResize && ancestor.removeEventListener('resize', update);
10058      });
10059      cleanupIo == null || cleanupIo();
10060      (_resizeObserver2 = resizeObserver) == null || _resizeObserver2.disconnect();
10061      resizeObserver = null;
10062      if (animationFrame) {
10063        cancelAnimationFrame(frameId);
10064      }
10065    };
10066  }
10067  
10068  /**
10069   * Optimizes the visibility of the floating element by choosing the placement
10070   * that has the most space available automatically, without needing to specify a
10071   * preferred placement. Alternative to `flip`.
10072   * @see https://floating-ui.com/docs/autoPlacement
10073   */
10074  const floating_ui_dom_autoPlacement = (/* unused pure expression or super */ null && (autoPlacement$1));
10075  
10076  /**
10077   * Optimizes the visibility of the floating element by shifting it in order to
10078   * keep it in view when it will overflow the clipping boundary.
10079   * @see https://floating-ui.com/docs/shift
10080   */
10081  const floating_ui_dom_shift = shift;
10082  
10083  /**
10084   * Optimizes the visibility of the floating element by flipping the `placement`
10085   * in order to keep it in view when the preferred placement(s) will overflow the
10086   * clipping boundary. Alternative to `autoPlacement`.
10087   * @see https://floating-ui.com/docs/flip
10088   */
10089  const floating_ui_dom_flip = flip;
10090  
10091  /**
10092   * Provides data that allows you to change the size of the floating element —
10093   * for instance, prevent it from overflowing the clipping boundary or match the
10094   * width of the reference element.
10095   * @see https://floating-ui.com/docs/size
10096   */
10097  const floating_ui_dom_size = size;
10098  
10099  /**
10100   * Provides data to hide the floating element in applicable situations, such as
10101   * when it is not in the same clipping context as the reference element.
10102   * @see https://floating-ui.com/docs/hide
10103   */
10104  const floating_ui_dom_hide = (/* unused pure expression or super */ null && (hide$1));
10105  
10106  /**
10107   * Provides data to position an inner element of the floating element so that it
10108   * appears centered to the reference element.
10109   * @see https://floating-ui.com/docs/arrow
10110   */
10111  const floating_ui_dom_arrow = arrow;
10112  
10113  /**
10114   * Provides improved positioning for inline reference elements that can span
10115   * over multiple lines, such as hyperlinks or range selections.
10116   * @see https://floating-ui.com/docs/inline
10117   */
10118  const floating_ui_dom_inline = (/* unused pure expression or super */ null && (inline$1));
10119  
10120  /**
10121   * Built-in `limiter` that will stop `shift()` at a certain point.
10122   */
10123  const floating_ui_dom_limitShift = limitShift;
10124  
10125  /**
10126   * Computes the `x` and `y` coordinates that will place the floating element
10127   * next to a given reference element.
10128   */
10129  const floating_ui_dom_computePosition = (reference, floating, options) => {
10130    // This caches the expensive `getClippingElementAncestors` function so that
10131    // multiple lifecycle resets re-use the same result. It only lives for a
10132    // single call. If other functions become expensive, we can add them as well.
10133    const cache = new Map();
10134    const mergedOptions = {
10135      platform,
10136      ...options
10137    };
10138    const platformWithCache = {
10139      ...mergedOptions.platform,
10140      _c: cache
10141    };
10142    return computePosition(reference, floating, {
10143      ...mergedOptions,
10144      platform: platformWithCache
10145    });
10146  };
10147  
10148  
10149  
10150  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/FK7DPXBE.js
10151  "use client";
10152  
10153  
10154  
10155  
10156  
10157  
10158  // src/popover/popover.tsx
10159  
10160  
10161  
10162  
10163  var FK7DPXBE_TagName = "div";
10164  function createDOMRect(x = 0, y = 0, width = 0, height = 0) {
10165    if (typeof DOMRect === "function") {
10166      return new DOMRect(x, y, width, height);
10167    }
10168    const rect = {
10169      x,
10170      y,
10171      width,
10172      height,
10173      top: y,
10174      right: x + width,
10175      bottom: y + height,
10176      left: x
10177    };
10178    return _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, rect), { toJSON: () => rect });
10179  }
10180  function getDOMRect(anchorRect) {
10181    if (!anchorRect) return createDOMRect();
10182    const { x, y, width, height } = anchorRect;
10183    return createDOMRect(x, y, width, height);
10184  }
10185  function getAnchorElement(anchorElement, getAnchorRect) {
10186    const contextElement = anchorElement || void 0;
10187    return {
10188      contextElement,
10189      getBoundingClientRect: () => {
10190        const anchor = anchorElement;
10191        const anchorRect = getAnchorRect == null ? void 0 : getAnchorRect(anchor);
10192        if (anchorRect || !anchor) {
10193          return getDOMRect(anchorRect);
10194        }
10195        return anchor.getBoundingClientRect();
10196      }
10197    };
10198  }
10199  function isValidPlacement(flip2) {
10200    return /^(?:top|bottom|left|right)(?:-(?:start|end))?$/.test(flip2);
10201  }
10202  function roundByDPR(value) {
10203    const dpr = window.devicePixelRatio || 1;
10204    return Math.round(value * dpr) / dpr;
10205  }
10206  function getOffsetMiddleware(arrowElement, props) {
10207    return offset(({ placement }) => {
10208      var _a;
10209      const arrowOffset = ((arrowElement == null ? void 0 : arrowElement.clientHeight) || 0) / 2;
10210      const finalGutter = typeof props.gutter === "number" ? props.gutter + arrowOffset : (_a = props.gutter) != null ? _a : arrowOffset;
10211      const hasAlignment = !!placement.split("-")[1];
10212      return {
10213        crossAxis: !hasAlignment ? props.shift : void 0,
10214        mainAxis: finalGutter,
10215        alignmentAxis: props.shift
10216      };
10217    });
10218  }
10219  function getFlipMiddleware(props) {
10220    if (props.flip === false) return;
10221    const fallbackPlacements = typeof props.flip === "string" ? props.flip.split(" ") : void 0;
10222    invariant(
10223      !fallbackPlacements || fallbackPlacements.every(isValidPlacement),
10224       false && 0
10225    );
10226    return floating_ui_dom_flip({
10227      padding: props.overflowPadding,
10228      fallbackPlacements
10229    });
10230  }
10231  function getShiftMiddleware(props) {
10232    if (!props.slide && !props.overlap) return;
10233    return floating_ui_dom_shift({
10234      mainAxis: props.slide,
10235      crossAxis: props.overlap,
10236      padding: props.overflowPadding,
10237      limiter: floating_ui_dom_limitShift()
10238    });
10239  }
10240  function getSizeMiddleware(props) {
10241    return floating_ui_dom_size({
10242      padding: props.overflowPadding,
10243      apply({ elements, availableWidth, availableHeight, rects }) {
10244        const wrapper = elements.floating;
10245        const referenceWidth = Math.round(rects.reference.width);
10246        availableWidth = Math.floor(availableWidth);
10247        availableHeight = Math.floor(availableHeight);
10248        wrapper.style.setProperty(
10249          "--popover-anchor-width",
10250          `$referenceWidth}px`
10251        );
10252        wrapper.style.setProperty(
10253          "--popover-available-width",
10254          `$availableWidth}px`
10255        );
10256        wrapper.style.setProperty(
10257          "--popover-available-height",
10258          `$availableHeight}px`
10259        );
10260        if (props.sameWidth) {
10261          wrapper.style.width = `$referenceWidth}px`;
10262        }
10263        if (props.fitViewport) {
10264          wrapper.style.maxWidth = `$availableWidth}px`;
10265          wrapper.style.maxHeight = `$availableHeight}px`;
10266        }
10267      }
10268    });
10269  }
10270  function getArrowMiddleware(arrowElement, props) {
10271    if (!arrowElement) return;
10272    return floating_ui_dom_arrow({
10273      element: arrowElement,
10274      padding: props.arrowPadding
10275    });
10276  }
10277  var usePopover = createHook(
10278    function usePopover2(_a) {
10279      var _b = _a, {
10280        store,
10281        modal = false,
10282        portal = !!modal,
10283        preserveTabOrder = true,
10284        autoFocusOnShow = true,
10285        wrapperProps,
10286        fixed = false,
10287        flip: flip2 = true,
10288        shift: shift2 = 0,
10289        slide = true,
10290        overlap = false,
10291        sameWidth = false,
10292        fitViewport = false,
10293        gutter,
10294        arrowPadding = 4,
10295        overflowPadding = 8,
10296        getAnchorRect,
10297        updatePosition
10298      } = _b, props = __objRest(_b, [
10299        "store",
10300        "modal",
10301        "portal",
10302        "preserveTabOrder",
10303        "autoFocusOnShow",
10304        "wrapperProps",
10305        "fixed",
10306        "flip",
10307        "shift",
10308        "slide",
10309        "overlap",
10310        "sameWidth",
10311        "fitViewport",
10312        "gutter",
10313        "arrowPadding",
10314        "overflowPadding",
10315        "getAnchorRect",
10316        "updatePosition"
10317      ]);
10318      const context = usePopoverProviderContext();
10319      store = store || context;
10320      invariant(
10321        store,
10322         false && 0
10323      );
10324      const arrowElement = store.useState("arrowElement");
10325      const anchorElement = store.useState("anchorElement");
10326      const disclosureElement = store.useState("disclosureElement");
10327      const popoverElement = store.useState("popoverElement");
10328      const contentElement = store.useState("contentElement");
10329      const placement = store.useState("placement");
10330      const mounted = store.useState("mounted");
10331      const rendered = store.useState("rendered");
10332      const defaultArrowElementRef = (0,external_React_.useRef)(null);
10333      const [positioned, setPositioned] = (0,external_React_.useState)(false);
10334      const { portalRef, domReady } = usePortalRef(portal, props.portalRef);
10335      const getAnchorRectProp = useEvent(getAnchorRect);
10336      const updatePositionProp = useEvent(updatePosition);
10337      const hasCustomUpdatePosition = !!updatePosition;
10338      useSafeLayoutEffect(() => {
10339        if (!(popoverElement == null ? void 0 : popoverElement.isConnected)) return;
10340        popoverElement.style.setProperty(
10341          "--popover-overflow-padding",
10342          `$overflowPadding}px`
10343        );
10344        const anchor = getAnchorElement(anchorElement, getAnchorRectProp);
10345        const updatePosition2 = async () => {
10346          if (!mounted) return;
10347          if (!arrowElement) {
10348            defaultArrowElementRef.current = defaultArrowElementRef.current || document.createElement("div");
10349          }
10350          const arrow2 = arrowElement || defaultArrowElementRef.current;
10351          const middleware = [
10352            getOffsetMiddleware(arrow2, { gutter, shift: shift2 }),
10353            getFlipMiddleware({ flip: flip2, overflowPadding }),
10354            getShiftMiddleware({ slide, shift: shift2, overlap, overflowPadding }),
10355            getArrowMiddleware(arrow2, { arrowPadding }),
10356            getSizeMiddleware({
10357              sameWidth,
10358              fitViewport,
10359              overflowPadding
10360            })
10361          ];
10362          const pos = await floating_ui_dom_computePosition(anchor, popoverElement, {
10363            placement,
10364            strategy: fixed ? "fixed" : "absolute",
10365            middleware
10366          });
10367          store == null ? void 0 : store.setState("currentPlacement", pos.placement);
10368          setPositioned(true);
10369          const x = roundByDPR(pos.x);
10370          const y = roundByDPR(pos.y);
10371          Object.assign(popoverElement.style, {
10372            top: "0",
10373            left: "0",
10374            transform: `translate3d($x}px,$y}px,0)`
10375          });
10376          if (arrow2 && pos.middlewareData.arrow) {
10377            const { x: arrowX, y: arrowY } = pos.middlewareData.arrow;
10378            const side = pos.placement.split("-")[0];
10379            const centerX = arrow2.clientWidth / 2;
10380            const centerY = arrow2.clientHeight / 2;
10381            const originX = arrowX != null ? arrowX + centerX : -centerX;
10382            const originY = arrowY != null ? arrowY + centerY : -centerY;
10383            popoverElement.style.setProperty(
10384              "--popover-transform-origin",
10385              {
10386                top: `$originX}px calc(100% + $centerY}px)`,
10387                bottom: `$originX}px ${-centerY}px`,
10388                left: `calc(100% + $centerX}px) $originY}px`,
10389                right: `${-centerX}px $originY}px`
10390              }[side]
10391            );
10392            Object.assign(arrow2.style, {
10393              left: arrowX != null ? `$arrowX}px` : "",
10394              top: arrowY != null ? `$arrowY}px` : "",
10395              [side]: "100%"
10396            });
10397          }
10398        };
10399        const update = async () => {
10400          if (hasCustomUpdatePosition) {
10401            await updatePositionProp({ updatePosition: updatePosition2 });
10402            setPositioned(true);
10403          } else {
10404            await updatePosition2();
10405          }
10406        };
10407        const cancelAutoUpdate = autoUpdate(anchor, popoverElement, update, {
10408          // JSDOM doesn't support ResizeObserver
10409          elementResize: typeof ResizeObserver === "function"
10410        });
10411        return () => {
10412          setPositioned(false);
10413          cancelAutoUpdate();
10414        };
10415      }, [
10416        store,
10417        rendered,
10418        popoverElement,
10419        arrowElement,
10420        anchorElement,
10421        popoverElement,
10422        placement,
10423        mounted,
10424        domReady,
10425        fixed,
10426        flip2,
10427        shift2,
10428        slide,
10429        overlap,
10430        sameWidth,
10431        fitViewport,
10432        gutter,
10433        arrowPadding,
10434        overflowPadding,
10435        getAnchorRectProp,
10436        hasCustomUpdatePosition,
10437        updatePositionProp
10438      ]);
10439      useSafeLayoutEffect(() => {
10440        if (!mounted) return;
10441        if (!domReady) return;
10442        if (!(popoverElement == null ? void 0 : popoverElement.isConnected)) return;
10443        if (!(contentElement == null ? void 0 : contentElement.isConnected)) return;
10444        const applyZIndex = () => {
10445          popoverElement.style.zIndex = getComputedStyle(contentElement).zIndex;
10446        };
10447        applyZIndex();
10448        let raf = requestAnimationFrame(() => {
10449          raf = requestAnimationFrame(applyZIndex);
10450        });
10451        return () => cancelAnimationFrame(raf);
10452      }, [mounted, domReady, popoverElement, contentElement]);
10453      const position = fixed ? "fixed" : "absolute";
10454      props = useWrapElement(
10455        props,
10456        (element) => /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(
10457          "div",
10458          _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, wrapperProps), {
10459            style: _3YLGPPWQ_spreadValues({
10460              // https://floating-ui.com/docs/computeposition#initial-layout
10461              position,
10462              top: 0,
10463              left: 0,
10464              width: "max-content"
10465            }, wrapperProps == null ? void 0 : wrapperProps.style),
10466            ref: store == null ? void 0 : store.setPopoverElement,
10467            children: element
10468          })
10469        ),
10470        [store, position, wrapperProps]
10471      );
10472      props = useWrapElement(
10473        props,
10474        (element) => /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(PopoverScopedContextProvider, { value: store, children: element }),
10475        [store]
10476      );
10477      props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({
10478        // data-placing is not part of the public API. We're setting this here so
10479        // we can wait for the popover to be positioned before other components
10480        // move focus into it. For example, this attribute is observed by the
10481        // Combobox component with the autoSelect behavior.
10482        "data-placing": !positioned || void 0
10483      }, props), {
10484        style: _3YLGPPWQ_spreadValues({
10485          position: "relative"
10486        }, props.style)
10487      });
10488      props = useDialog(_3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({
10489        store,
10490        modal,
10491        portal,
10492        preserveTabOrder,
10493        preserveTabOrderAnchor: disclosureElement || anchorElement,
10494        autoFocusOnShow: positioned && autoFocusOnShow
10495      }, props), {
10496        portalRef
10497      }));
10498      return props;
10499    }
10500  );
10501  var Popover = createDialogComponent(
10502    forwardRef2(function Popover2(props) {
10503      const htmlProps = usePopover(props);
10504      return HKOOKEDE_createElement(FK7DPXBE_TagName, htmlProps);
10505    }),
10506    usePopoverProviderContext
10507  );
10508  
10509  
10510  
10511  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/4GR366MD.js
10512  "use client";
10513  
10514  
10515  
10516  
10517  
10518  
10519  
10520  
10521  // src/hovercard/hovercard.tsx
10522  
10523  
10524  
10525  
10526  
10527  
10528  
10529  var _4GR366MD_TagName = "div";
10530  function isMovingOnHovercard(target, card, anchor, nested) {
10531    if (hasFocusWithin(card)) return true;
10532    if (!target) return false;
10533    if (contains(card, target)) return true;
10534    if (anchor && contains(anchor, target)) return true;
10535    if (nested == null ? void 0 : nested.some((card2) => isMovingOnHovercard(target, card2, anchor))) {
10536      return true;
10537    }
10538    return false;
10539  }
10540  function useAutoFocusOnHide(_a) {
10541    var _b = _a, {
10542      store
10543    } = _b, props = __objRest(_b, [
10544      "store"
10545    ]);
10546    const [autoFocusOnHide, setAutoFocusOnHide] = (0,external_React_.useState)(false);
10547    const mounted = store.useState("mounted");
10548    (0,external_React_.useEffect)(() => {
10549      if (!mounted) {
10550        setAutoFocusOnHide(false);
10551      }
10552    }, [mounted]);
10553    const onFocusProp = props.onFocus;
10554    const onFocus = useEvent((event) => {
10555      onFocusProp == null ? void 0 : onFocusProp(event);
10556      if (event.defaultPrevented) return;
10557      setAutoFocusOnHide(true);
10558    });
10559    const finalFocusRef = (0,external_React_.useRef)(null);
10560    (0,external_React_.useEffect)(() => {
10561      return sync(store, ["anchorElement"], (state) => {
10562        finalFocusRef.current = state.anchorElement;
10563      });
10564    }, []);
10565    props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({
10566      autoFocusOnHide,
10567      finalFocus: finalFocusRef
10568    }, props), {
10569      onFocus
10570    });
10571    return props;
10572  }
10573  var NestedHovercardContext = (0,external_React_.createContext)(null);
10574  var useHovercard = createHook(
10575    function useHovercard2(_a) {
10576      var _b = _a, {
10577        store,
10578        modal = false,
10579        portal = !!modal,
10580        hideOnEscape = true,
10581        hideOnHoverOutside = true,
10582        disablePointerEventsOnApproach = !!hideOnHoverOutside
10583      } = _b, props = __objRest(_b, [
10584        "store",
10585        "modal",
10586        "portal",
10587        "hideOnEscape",
10588        "hideOnHoverOutside",
10589        "disablePointerEventsOnApproach"
10590      ]);
10591      const context = useHovercardProviderContext();
10592      store = store || context;
10593      invariant(
10594        store,
10595         false && 0
10596      );
10597      const ref = (0,external_React_.useRef)(null);
10598      const [nestedHovercards, setNestedHovercards] = (0,external_React_.useState)([]);
10599      const hideTimeoutRef = (0,external_React_.useRef)(0);
10600      const enterPointRef = (0,external_React_.useRef)(null);
10601      const { portalRef, domReady } = usePortalRef(portal, props.portalRef);
10602      const isMouseMoving = useIsMouseMoving();
10603      const mayHideOnHoverOutside = !!hideOnHoverOutside;
10604      const hideOnHoverOutsideProp = useBooleanEvent(hideOnHoverOutside);
10605      const mayDisablePointerEvents = !!disablePointerEventsOnApproach;
10606      const disablePointerEventsProp = useBooleanEvent(
10607        disablePointerEventsOnApproach
10608      );
10609      const open = store.useState("open");
10610      const mounted = store.useState("mounted");
10611      (0,external_React_.useEffect)(() => {
10612        if (!domReady) return;
10613        if (!mounted) return;
10614        if (!mayHideOnHoverOutside && !mayDisablePointerEvents) return;
10615        const element = ref.current;
10616        if (!element) return;
10617        const onMouseMove = (event) => {
10618          if (!store) return;
10619          if (!isMouseMoving()) return;
10620          const { anchorElement, hideTimeout, timeout } = store.getState();
10621          const enterPoint = enterPointRef.current;
10622          const [target] = event.composedPath();
10623          const anchor = anchorElement;
10624          if (isMovingOnHovercard(target, element, anchor, nestedHovercards)) {
10625            enterPointRef.current = target && anchor && contains(anchor, target) ? getEventPoint(event) : null;
10626            window.clearTimeout(hideTimeoutRef.current);
10627            hideTimeoutRef.current = 0;
10628            return;
10629          }
10630          if (hideTimeoutRef.current) return;
10631          if (enterPoint) {
10632            const currentPoint = getEventPoint(event);
10633            const polygon = getElementPolygon(element, enterPoint);
10634            if (isPointInPolygon(currentPoint, polygon)) {
10635              enterPointRef.current = currentPoint;
10636              if (!disablePointerEventsProp(event)) return;
10637              event.preventDefault();
10638              event.stopPropagation();
10639              return;
10640            }
10641          }
10642          if (!hideOnHoverOutsideProp(event)) return;
10643          hideTimeoutRef.current = window.setTimeout(() => {
10644            hideTimeoutRef.current = 0;
10645            store == null ? void 0 : store.hide();
10646          }, hideTimeout != null ? hideTimeout : timeout);
10647        };
10648        return chain(
10649          addGlobalEventListener("mousemove", onMouseMove, true),
10650          () => clearTimeout(hideTimeoutRef.current)
10651        );
10652      }, [
10653        store,
10654        isMouseMoving,
10655        domReady,
10656        mounted,
10657        mayHideOnHoverOutside,
10658        mayDisablePointerEvents,
10659        nestedHovercards,
10660        disablePointerEventsProp,
10661        hideOnHoverOutsideProp
10662      ]);
10663      (0,external_React_.useEffect)(() => {
10664        if (!domReady) return;
10665        if (!mounted) return;
10666        if (!mayDisablePointerEvents) return;
10667        const disableEvent = (event) => {
10668          const element = ref.current;
10669          if (!element) return;
10670          const enterPoint = enterPointRef.current;
10671          if (!enterPoint) return;
10672          const polygon = getElementPolygon(element, enterPoint);
10673          if (isPointInPolygon(getEventPoint(event), polygon)) {
10674            if (!disablePointerEventsProp(event)) return;
10675            event.preventDefault();
10676            event.stopPropagation();
10677          }
10678        };
10679        return chain(
10680          // Note: we may need to add pointer events here in the future.
10681          addGlobalEventListener("mouseenter", disableEvent, true),
10682          addGlobalEventListener("mouseover", disableEvent, true),
10683          addGlobalEventListener("mouseout", disableEvent, true),
10684          addGlobalEventListener("mouseleave", disableEvent, true)
10685        );
10686      }, [domReady, mounted, mayDisablePointerEvents, disablePointerEventsProp]);
10687      (0,external_React_.useEffect)(() => {
10688        if (!domReady) return;
10689        if (open) return;
10690        store == null ? void 0 : store.setAutoFocusOnShow(false);
10691      }, [store, domReady, open]);
10692      const openRef = useLiveRef(open);
10693      (0,external_React_.useEffect)(() => {
10694        if (!domReady) return;
10695        return () => {
10696          if (!openRef.current) {
10697            store == null ? void 0 : store.setAutoFocusOnShow(false);
10698          }
10699        };
10700      }, [store, domReady]);
10701      const registerOnParent = (0,external_React_.useContext)(NestedHovercardContext);
10702      useSafeLayoutEffect(() => {
10703        if (modal) return;
10704        if (!portal) return;
10705        if (!mounted) return;
10706        if (!domReady) return;
10707        const element = ref.current;
10708        if (!element) return;
10709        return registerOnParent == null ? void 0 : registerOnParent(element);
10710      }, [modal, portal, mounted, domReady]);
10711      const registerNestedHovercard = (0,external_React_.useCallback)(
10712        (element) => {
10713          setNestedHovercards((prevElements) => [...prevElements, element]);
10714          const parentUnregister = registerOnParent == null ? void 0 : registerOnParent(element);
10715          return () => {
10716            setNestedHovercards(
10717              (prevElements) => prevElements.filter((item) => item !== element)
10718            );
10719            parentUnregister == null ? void 0 : parentUnregister();
10720          };
10721        },
10722        [registerOnParent]
10723      );
10724      props = useWrapElement(
10725        props,
10726        (element) => /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(HovercardScopedContextProvider, { value: store, children: /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(NestedHovercardContext.Provider, { value: registerNestedHovercard, children: element }) }),
10727        [store, registerNestedHovercard]
10728      );
10729      props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, props), {
10730        ref: useMergeRefs(ref, props.ref)
10731      });
10732      props = useAutoFocusOnHide(_3YLGPPWQ_spreadValues({ store }, props));
10733      const autoFocusOnShow = store.useState(
10734        (state) => modal || state.autoFocusOnShow
10735      );
10736      props = usePopover(_3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({
10737        store,
10738        modal,
10739        portal,
10740        autoFocusOnShow
10741      }, props), {
10742        portalRef,
10743        hideOnEscape(event) {
10744          if (isFalsyBooleanCallback(hideOnEscape, event)) return false;
10745          requestAnimationFrame(() => {
10746            requestAnimationFrame(() => {
10747              store == null ? void 0 : store.hide();
10748            });
10749          });
10750          return true;
10751        }
10752      }));
10753      return props;
10754    }
10755  );
10756  var Hovercard = createDialogComponent(
10757    forwardRef2(function Hovercard2(props) {
10758      const htmlProps = useHovercard(props);
10759      return HKOOKEDE_createElement(_4GR366MD_TagName, htmlProps);
10760    }),
10761    useHovercardProviderContext
10762  );
10763  
10764  
10765  
10766  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/tooltip/tooltip.js
10767  "use client";
10768  
10769  
10770  
10771  
10772  
10773  
10774  
10775  
10776  
10777  
10778  
10779  
10780  
10781  
10782  
10783  
10784  
10785  
10786  
10787  
10788  
10789  
10790  
10791  
10792  
10793  
10794  
10795  
10796  
10797  
10798  
10799  
10800  
10801  
10802  
10803  
10804  
10805  
10806  
10807  
10808  
10809  
10810  // src/tooltip/tooltip.tsx
10811  
10812  
10813  
10814  var tooltip_TagName = "div";
10815  var useTooltip = createHook(
10816    function useTooltip2(_a) {
10817      var _b = _a, {
10818        store,
10819        portal = true,
10820        gutter = 8,
10821        preserveTabOrder = false,
10822        hideOnHoverOutside = true,
10823        hideOnInteractOutside = true
10824      } = _b, props = __objRest(_b, [
10825        "store",
10826        "portal",
10827        "gutter",
10828        "preserveTabOrder",
10829        "hideOnHoverOutside",
10830        "hideOnInteractOutside"
10831      ]);
10832      const context = useTooltipProviderContext();
10833      store = store || context;
10834      invariant(
10835        store,
10836         false && 0
10837      );
10838      props = useWrapElement(
10839        props,
10840        (element) => /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(TooltipScopedContextProvider, { value: store, children: element }),
10841        [store]
10842      );
10843      const role = store.useState(
10844        (state) => state.type === "description" ? "tooltip" : "none"
10845      );
10846      props = _3YLGPPWQ_spreadValues({ role }, props);
10847      props = useHovercard(_3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, props), {
10848        store,
10849        portal,
10850        gutter,
10851        preserveTabOrder,
10852        hideOnHoverOutside(event) {
10853          if (isFalsyBooleanCallback(hideOnHoverOutside, event)) return false;
10854          const anchorElement = store == null ? void 0 : store.getState().anchorElement;
10855          if (!anchorElement) return true;
10856          if ("focusVisible" in anchorElement.dataset) return false;
10857          return true;
10858        },
10859        hideOnInteractOutside: (event) => {
10860          if (isFalsyBooleanCallback(hideOnInteractOutside, event)) return false;
10861          const anchorElement = store == null ? void 0 : store.getState().anchorElement;
10862          if (!anchorElement) return true;
10863          if (contains(anchorElement, event.target)) return false;
10864          return true;
10865        }
10866      }));
10867      return props;
10868    }
10869  );
10870  var Tooltip = createDialogComponent(
10871    forwardRef2(function Tooltip2(props) {
10872      const htmlProps = useTooltip(props);
10873      return HKOOKEDE_createElement(tooltip_TagName, htmlProps);
10874    }),
10875    useTooltipProviderContext
10876  );
10877  
10878  
10879  ;// CONCATENATED MODULE: external ["wp","deprecated"]
10880  const external_wp_deprecated_namespaceObject = window["wp"]["deprecated"];
10881  var external_wp_deprecated_default = /*#__PURE__*/__webpack_require__.n(external_wp_deprecated_namespaceObject);
10882  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/shortcut/index.js
10883  
10884  /**
10885   * Internal dependencies
10886   */
10887  
10888  /**
10889   * Shortcut component is used to display keyboard shortcuts, and it can be customized with a custom display and aria label if needed.
10890   *
10891   * ```jsx
10892   * import { Shortcut } from '@wordpress/components';
10893   *
10894   * const MyShortcut = () => {
10895   *     return (
10896   *         <Shortcut shortcut={{ display: 'Ctrl + S', ariaLabel: 'Save' }} />
10897   *     );
10898   * };
10899   * ```
10900   */
10901  function Shortcut(props) {
10902    const {
10903      shortcut,
10904      className
10905    } = props;
10906    if (!shortcut) {
10907      return null;
10908    }
10909    let displayText;
10910    let ariaLabel;
10911    if (typeof shortcut === 'string') {
10912      displayText = shortcut;
10913    }
10914    if (shortcut !== null && typeof shortcut === 'object') {
10915      displayText = shortcut.display;
10916      ariaLabel = shortcut.ariaLabel;
10917    }
10918    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", {
10919      className: className,
10920      "aria-label": ariaLabel,
10921      children: displayText
10922    });
10923  }
10924  /* harmony default export */ const build_module_shortcut = (Shortcut);
10925  
10926  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/popover/utils.js
10927  /**
10928   * External dependencies
10929   */
10930  
10931  /**
10932   * Internal dependencies
10933   */
10934  
10935  const POSITION_TO_PLACEMENT = {
10936    bottom: 'bottom',
10937    top: 'top',
10938    'middle left': 'left',
10939    'middle right': 'right',
10940    'bottom left': 'bottom-end',
10941    'bottom center': 'bottom',
10942    'bottom right': 'bottom-start',
10943    'top left': 'top-end',
10944    'top center': 'top',
10945    'top right': 'top-start',
10946    'middle left left': 'left',
10947    'middle left right': 'left',
10948    'middle left bottom': 'left-end',
10949    'middle left top': 'left-start',
10950    'middle right left': 'right',
10951    'middle right right': 'right',
10952    'middle right bottom': 'right-end',
10953    'middle right top': 'right-start',
10954    'bottom left left': 'bottom-end',
10955    'bottom left right': 'bottom-end',
10956    'bottom left bottom': 'bottom-end',
10957    'bottom left top': 'bottom-end',
10958    'bottom center left': 'bottom',
10959    'bottom center right': 'bottom',
10960    'bottom center bottom': 'bottom',
10961    'bottom center top': 'bottom',
10962    'bottom right left': 'bottom-start',
10963    'bottom right right': 'bottom-start',
10964    'bottom right bottom': 'bottom-start',
10965    'bottom right top': 'bottom-start',
10966    'top left left': 'top-end',
10967    'top left right': 'top-end',
10968    'top left bottom': 'top-end',
10969    'top left top': 'top-end',
10970    'top center left': 'top',
10971    'top center right': 'top',
10972    'top center bottom': 'top',
10973    'top center top': 'top',
10974    'top right left': 'top-start',
10975    'top right right': 'top-start',
10976    'top right bottom': 'top-start',
10977    'top right top': 'top-start',
10978    // `middle`/`middle center [corner?]` positions are associated to a fallback
10979    // `bottom` placement because there aren't any corresponding placement values.
10980    middle: 'bottom',
10981    'middle center': 'bottom',
10982    'middle center bottom': 'bottom',
10983    'middle center left': 'bottom',
10984    'middle center right': 'bottom',
10985    'middle center top': 'bottom'
10986  };
10987  
10988  /**
10989   * Converts the `Popover`'s legacy "position" prop to the new "placement" prop
10990   * (used by `floating-ui`).
10991   *
10992   * @param position The legacy position
10993   * @return The corresponding placement
10994   */
10995  const positionToPlacement = position => {
10996    var _POSITION_TO_PLACEMEN;
10997    return (_POSITION_TO_PLACEMEN = POSITION_TO_PLACEMENT[position]) !== null && _POSITION_TO_PLACEMEN !== void 0 ? _POSITION_TO_PLACEMEN : 'bottom';
10998  };
10999  
11000  /**
11001   * @typedef AnimationOrigin
11002   * @type {Object}
11003   * @property {number} originX A number between 0 and 1 (in CSS logical properties jargon, 0 is "start", 0.5 is "center", and 1 is "end")
11004   * @property {number} originY A number between 0 and 1 (0 is top, 0.5 is center, and 1 is bottom)
11005   */
11006  
11007  const PLACEMENT_TO_ANIMATION_ORIGIN = {
11008    top: {
11009      originX: 0.5,
11010      originY: 1
11011    },
11012    // open from bottom, center
11013    'top-start': {
11014      originX: 0,
11015      originY: 1
11016    },
11017    // open from bottom, left
11018    'top-end': {
11019      originX: 1,
11020      originY: 1
11021    },
11022    // open from bottom, right
11023    right: {
11024      originX: 0,
11025      originY: 0.5
11026    },
11027    // open from middle, left
11028    'right-start': {
11029      originX: 0,
11030      originY: 0
11031    },
11032    // open from top, left
11033    'right-end': {
11034      originX: 0,
11035      originY: 1
11036    },
11037    // open from bottom, left
11038    bottom: {
11039      originX: 0.5,
11040      originY: 0
11041    },
11042    // open from top, center
11043    'bottom-start': {
11044      originX: 0,
11045      originY: 0
11046    },
11047    // open from top, left
11048    'bottom-end': {
11049      originX: 1,
11050      originY: 0
11051    },
11052    // open from top, right
11053    left: {
11054      originX: 1,
11055      originY: 0.5
11056    },
11057    // open from middle, right
11058    'left-start': {
11059      originX: 1,
11060      originY: 0
11061    },
11062    // open from top, right
11063    'left-end': {
11064      originX: 1,
11065      originY: 1
11066    },
11067    // open from bottom, right
11068    overlay: {
11069      originX: 0.5,
11070      originY: 0.5
11071    } // open from center, center
11072  };
11073  
11074  /**
11075   * Given the floating-ui `placement`, compute the framer-motion props for the
11076   * popover's entry animation.
11077   *
11078   * @param placement A placement string from floating ui
11079   * @return The object containing the motion props
11080   */
11081  const placementToMotionAnimationProps = placement => {
11082    const translateProp = placement.startsWith('top') || placement.startsWith('bottom') ? 'translateY' : 'translateX';
11083    const translateDirection = placement.startsWith('top') || placement.startsWith('left') ? 1 : -1;
11084    return {
11085      style: PLACEMENT_TO_ANIMATION_ORIGIN[placement],
11086      initial: {
11087        opacity: 0,
11088        scale: 0,
11089        [translateProp]: `$2 * translateDirection}em`
11090      },
11091      animate: {
11092        opacity: 1,
11093        scale: 1,
11094        [translateProp]: 0
11095      },
11096      transition: {
11097        duration: 0.1,
11098        ease: [0, 0, 0.2, 1]
11099      }
11100    };
11101  };
11102  function isTopBottom(anchorRef) {
11103    return !!anchorRef?.top;
11104  }
11105  function isRef(anchorRef) {
11106    return !!anchorRef?.current;
11107  }
11108  const getReferenceElement = ({
11109    anchor,
11110    anchorRef,
11111    anchorRect,
11112    getAnchorRect,
11113    fallbackReferenceElement
11114  }) => {
11115    var _referenceElement;
11116    let referenceElement = null;
11117    if (anchor) {
11118      referenceElement = anchor;
11119    } else if (isTopBottom(anchorRef)) {
11120      // Create a virtual element for the ref. The expectation is that
11121      // if anchorRef.top is defined, then anchorRef.bottom is defined too.
11122      // Seems to be used by the block toolbar, when multiple blocks are selected
11123      // (top and bottom blocks are used to calculate the resulting rect).
11124      referenceElement = {
11125        getBoundingClientRect() {
11126          const topRect = anchorRef.top.getBoundingClientRect();
11127          const bottomRect = anchorRef.bottom.getBoundingClientRect();
11128          return new window.DOMRect(topRect.x, topRect.y, topRect.width, bottomRect.bottom - topRect.top);
11129        }
11130      };
11131    } else if (isRef(anchorRef)) {
11132      // Standard React ref.
11133      referenceElement = anchorRef.current;
11134    } else if (anchorRef) {
11135      // If `anchorRef` holds directly the element's value (no `current` key)
11136      // This is a weird scenario and should be deprecated.
11137      referenceElement = anchorRef;
11138    } else if (anchorRect) {
11139      // Create a virtual element for the ref.
11140      referenceElement = {
11141        getBoundingClientRect() {
11142          return anchorRect;
11143        }
11144      };
11145    } else if (getAnchorRect) {
11146      // Create a virtual element for the ref.
11147      referenceElement = {
11148        getBoundingClientRect() {
11149          var _rect$x, _rect$y, _rect$width, _rect$height;
11150          const rect = getAnchorRect(fallbackReferenceElement);
11151          return new window.DOMRect((_rect$x = rect.x) !== null && _rect$x !== void 0 ? _rect$x : rect.left, (_rect$y = rect.y) !== null && _rect$y !== void 0 ? _rect$y : rect.top, (_rect$width = rect.width) !== null && _rect$width !== void 0 ? _rect$width : rect.right - rect.left, (_rect$height = rect.height) !== null && _rect$height !== void 0 ? _rect$height : rect.bottom - rect.top);
11152        }
11153      };
11154    } else if (fallbackReferenceElement) {
11155      // If no explicit ref is passed via props, fall back to
11156      // anchoring to the popover's parent node.
11157      referenceElement = fallbackReferenceElement.parentElement;
11158    }
11159  
11160    // Convert any `undefined` value to `null`.
11161    return (_referenceElement = referenceElement) !== null && _referenceElement !== void 0 ? _referenceElement : null;
11162  };
11163  
11164  /**
11165   * Computes the final coordinate that needs to be applied to the floating
11166   * element when applying transform inline styles, defaulting to `undefined`
11167   * if the provided value is `null` or `NaN`.
11168   *
11169   * @param c input coordinate (usually as returned from floating-ui)
11170   * @return The coordinate's value to be used for inline styles. An `undefined`
11171   *         return value means "no style set" for this coordinate.
11172   */
11173  const computePopoverPosition = c => c === null || Number.isNaN(c) ? undefined : Math.round(c);
11174  
11175  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/tooltip/index.js
11176  /**
11177   * External dependencies
11178   */
11179  
11180  
11181  
11182  
11183  /**
11184   * WordPress dependencies
11185   */
11186  
11187  
11188  
11189  
11190  /**
11191   * Internal dependencies
11192   */
11193  
11194  
11195  
11196  
11197  
11198  const TooltipInternalContext = (0,external_wp_element_namespaceObject.createContext)({
11199    isNestedInTooltip: false
11200  });
11201  
11202  /**
11203   * Time over anchor to wait before showing tooltip
11204   */
11205  const TOOLTIP_DELAY = 700;
11206  const CONTEXT_VALUE = {
11207    isNestedInTooltip: true
11208  };
11209  function UnforwardedTooltip(props, ref) {
11210    const {
11211      children,
11212      className,
11213      delay = TOOLTIP_DELAY,
11214      hideOnClick = true,
11215      placement,
11216      position,
11217      shortcut,
11218      text,
11219      ...restProps
11220    } = props;
11221    const {
11222      isNestedInTooltip
11223    } = (0,external_wp_element_namespaceObject.useContext)(TooltipInternalContext);
11224    const baseId = (0,external_wp_compose_namespaceObject.useInstanceId)(tooltip_Tooltip, 'tooltip');
11225    const describedById = text || shortcut ? baseId : undefined;
11226    const isOnlyChild = external_wp_element_namespaceObject.Children.count(children) === 1;
11227    // console error if more than one child element is added
11228    if (!isOnlyChild) {
11229      if (false) {}
11230    }
11231  
11232    // Compute tooltip's placement:
11233    // - give priority to `placement` prop, if defined
11234    // - otherwise, compute it from the legacy `position` prop (if defined)
11235    // - finally, fallback to the default placement: 'bottom'
11236    let computedPlacement;
11237    if (placement !== undefined) {
11238      computedPlacement = placement;
11239    } else if (position !== undefined) {
11240      computedPlacement = positionToPlacement(position);
11241      external_wp_deprecated_default()('`position` prop in wp.components.tooltip', {
11242        since: '6.4',
11243        alternative: '`placement` prop'
11244      });
11245    }
11246    computedPlacement = computedPlacement || 'bottom';
11247    const tooltipStore = useTooltipStore({
11248      placement: computedPlacement,
11249      showTimeout: delay
11250    });
11251    const mounted = useStoreState(tooltipStore, 'mounted');
11252    if (isNestedInTooltip) {
11253      return isOnlyChild ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Role, {
11254        ...restProps,
11255        render: children
11256      }) : children;
11257    }
11258  
11259    // TODO: this is a temporary workaround to minimize the effects of the
11260    // Ariakit upgrade. Ariakit doesn't pass the `aria-describedby` prop to
11261    // the tooltip anchor anymore since 0.4.0, so we need to add it manually.
11262    // The `aria-describedby` attribute is added only if the anchor doesn't have
11263    // one already, and if the tooltip text is not the same as the anchor's
11264    // `aria-label`
11265    // See: https://github.com/WordPress/gutenberg/pull/64066
11266    // See: https://github.com/WordPress/gutenberg/pull/65989
11267    function addDescribedById(element) {
11268      return describedById && mounted && element.props['aria-describedby'] === undefined && element.props['aria-label'] !== text ? (0,external_wp_element_namespaceObject.cloneElement)(element, {
11269        'aria-describedby': describedById
11270      }) : element;
11271    }
11272    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(TooltipInternalContext.Provider, {
11273      value: CONTEXT_VALUE,
11274      children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(TooltipAnchor, {
11275        onClick: hideOnClick ? tooltipStore.hide : undefined,
11276        store: tooltipStore,
11277        render: isOnlyChild ? addDescribedById(children) : undefined,
11278        ref: ref,
11279        children: isOnlyChild ? undefined : children
11280      }), isOnlyChild && (text || shortcut) && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(Tooltip, {
11281        ...restProps,
11282        className: dist_clsx('components-tooltip', className),
11283        unmountOnHide: true,
11284        gutter: 4,
11285        id: describedById,
11286        overflowPadding: 0.5,
11287        store: tooltipStore,
11288        children: [text, shortcut && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_shortcut, {
11289          className: text ? 'components-tooltip__shortcut' : '',
11290          shortcut: shortcut
11291        })]
11292      })]
11293    });
11294  }
11295  const tooltip_Tooltip = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedTooltip);
11296  /* harmony default export */ const tooltip = (tooltip_Tooltip);
11297  
11298  ;// CONCATENATED MODULE: external ["wp","warning"]
11299  const external_wp_warning_namespaceObject = window["wp"]["warning"];
11300  var external_wp_warning_default = /*#__PURE__*/__webpack_require__.n(external_wp_warning_namespaceObject);
11301  // EXTERNAL MODULE: ./node_modules/deepmerge/dist/cjs.js
11302  var cjs = __webpack_require__(66);
11303  var cjs_default = /*#__PURE__*/__webpack_require__.n(cjs);
11304  // EXTERNAL MODULE: ./node_modules/fast-deep-equal/es6/index.js
11305  var es6 = __webpack_require__(7734);
11306  var es6_default = /*#__PURE__*/__webpack_require__.n(es6);
11307  ;// CONCATENATED MODULE: ./node_modules/is-plain-object/dist/is-plain-object.mjs
11308  /*!
11309   * is-plain-object <https://github.com/jonschlinkert/is-plain-object>
11310   *
11311   * Copyright (c) 2014-2017, Jon Schlinkert.
11312   * Released under the MIT License.
11313   */
11314  
11315  function is_plain_object_isObject(o) {
11316    return Object.prototype.toString.call(o) === '[object Object]';
11317  }
11318  
11319  function isPlainObject(o) {
11320    var ctor,prot;
11321  
11322    if (is_plain_object_isObject(o) === false) return false;
11323  
11324    // If has modified constructor
11325    ctor = o.constructor;
11326    if (ctor === undefined) return true;
11327  
11328    // If has modified prototype
11329    prot = ctor.prototype;
11330    if (is_plain_object_isObject(prot) === false) return false;
11331  
11332    // If constructor does not have an Object-specific method
11333    if (prot.hasOwnProperty('isPrototypeOf') === false) {
11334      return false;
11335    }
11336  
11337    // Most likely a plain Object
11338    return true;
11339  }
11340  
11341  
11342  
11343  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/utils/hooks/use-update-effect.js
11344  /**
11345   * WordPress dependencies
11346   */
11347  
11348  
11349  /**
11350   * A `React.useEffect` that will not run on the first render.
11351   * Source:
11352   * https://github.com/ariakit/ariakit/blob/main/packages/ariakit-react-core/src/utils/hooks.ts
11353   *
11354   * @param {import('react').EffectCallback} effect
11355   * @param {import('react').DependencyList} deps
11356   */
11357  function use_update_effect_useUpdateEffect(effect, deps) {
11358    const mountedRef = (0,external_wp_element_namespaceObject.useRef)(false);
11359    (0,external_wp_element_namespaceObject.useEffect)(() => {
11360      if (mountedRef.current) {
11361        return effect();
11362      }
11363      mountedRef.current = true;
11364      return undefined;
11365      // Disable reasons:
11366      // 1. This hook needs to pass a dep list that isn't an array literal
11367      // 2. `effect` is missing from the array, and will need to be added carefully to avoid additional warnings
11368      // see https://github.com/WordPress/gutenberg/pull/41166
11369      // eslint-disable-next-line react-hooks/exhaustive-deps
11370    }, deps);
11371    (0,external_wp_element_namespaceObject.useEffect)(() => () => {
11372      mountedRef.current = false;
11373    }, []);
11374  }
11375  /* harmony default export */ const use_update_effect = (use_update_effect_useUpdateEffect);
11376  
11377  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/context/context-system-provider.js
11378  /**
11379   * External dependencies
11380   */
11381  
11382  
11383  
11384  
11385  /**
11386   * WordPress dependencies
11387   */
11388  
11389  
11390  
11391  /**
11392   * Internal dependencies
11393   */
11394  
11395  
11396  const ComponentsContext = (0,external_wp_element_namespaceObject.createContext)( /** @type {Record<string, any>} */{});
11397  const useComponentsContext = () => (0,external_wp_element_namespaceObject.useContext)(ComponentsContext);
11398  
11399  /**
11400   * Consolidates incoming ContextSystem values with a (potential) parent ContextSystem value.
11401   *
11402   * Note: This function will warn if it detects an un-memoized `value`
11403   *
11404   * @param {Object}              props
11405   * @param {Record<string, any>} props.value
11406   * @return {Record<string, any>} The consolidated value.
11407   */
11408  function useContextSystemBridge({
11409    value
11410  }) {
11411    const parentContext = useComponentsContext();
11412    const valueRef = (0,external_wp_element_namespaceObject.useRef)(value);
11413    use_update_effect(() => {
11414      if (
11415      // Objects are equivalent.
11416      es6_default()(valueRef.current, value) &&
11417      // But not the same reference.
11418      valueRef.current !== value) {
11419         true ? external_wp_warning_default()(`Please memoize your context: $JSON.stringify(value)}`) : 0;
11420      }
11421    }, [value]);
11422  
11423    // `parentContext` will always be memoized (i.e., the result of this hook itself)
11424    // or the default value from when the `ComponentsContext` was originally
11425    // initialized (which will never change, it's a static variable)
11426    // so this memoization will prevent `deepmerge()` from rerunning unless
11427    // the references to `value` change OR the `parentContext` has an actual material change
11428    // (because again, it's guaranteed to be memoized or a static reference to the empty object
11429    // so we know that the only changes for `parentContext` are material ones... i.e., why we
11430    // don't have to warn in the `useUpdateEffect` hook above for `parentContext` and we only
11431    // need to bother with the `value`). The `useUpdateEffect` above will ensure that we are
11432    // correctly warning when the `value` isn't being properly memoized. All of that to say
11433    // that this should be super safe to assume that `useMemo` will only run on actual
11434    // changes to the two dependencies, therefore saving us calls to `deepmerge()`!
11435    const config = (0,external_wp_element_namespaceObject.useMemo)(() => {
11436      // Deep clone `parentContext` to avoid mutating it later.
11437      return cjs_default()(parentContext !== null && parentContext !== void 0 ? parentContext : {}, value !== null && value !== void 0 ? value : {}, {
11438        isMergeableObject: isPlainObject
11439      });
11440    }, [parentContext, value]);
11441    return config;
11442  }
11443  
11444  /**
11445   * A Provider component that can modify props for connected components within
11446   * the Context system.
11447   *
11448   * @example
11449   * ```jsx
11450   * <ContextSystemProvider value={{ Button: { size: 'small' }}}>
11451   *   <Button>...</Button>
11452   * </ContextSystemProvider>
11453   * ```
11454   *
11455   * @template {Record<string, any>} T
11456   * @param {Object}                    options
11457   * @param {import('react').ReactNode} options.children Children to render.
11458   * @param {T}                         options.value    Props to render into connected components.
11459   * @return {JSX.Element} A Provider wrapped component.
11460   */
11461  const BaseContextSystemProvider = ({
11462    children,
11463    value
11464  }) => {
11465    const contextValue = useContextSystemBridge({
11466      value
11467    });
11468    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ComponentsContext.Provider, {
11469      value: contextValue,
11470      children: children
11471    });
11472  };
11473  const ContextSystemProvider = (0,external_wp_element_namespaceObject.memo)(BaseContextSystemProvider);
11474  
11475  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/context/constants.js
11476  const COMPONENT_NAMESPACE = 'data-wp-component';
11477  const CONNECTED_NAMESPACE = 'data-wp-c16t';
11478  
11479  /**
11480   * Special key where the connected namespaces are stored.
11481   * This is attached to Context connected components as a static property.
11482   */
11483  const CONNECT_STATIC_NAMESPACE = '__contextSystemKey__';
11484  
11485  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/context/utils.js
11486  /**
11487   * Internal dependencies
11488   */
11489  
11490  
11491  /**
11492   * Creates a dedicated context namespace HTML attribute for components.
11493   * ns is short for "namespace"
11494   *
11495   * @example
11496   * ```jsx
11497   * <div {...ns('Container')} />
11498   * ```
11499   *
11500   * @param {string} componentName The name for the component.
11501   * @return {Record<string, any>} A props object with the namespaced HTML attribute.
11502   */
11503  function getNamespace(componentName) {
11504    return {
11505      [COMPONENT_NAMESPACE]: componentName
11506    };
11507  }
11508  
11509  /**
11510   * Creates a dedicated connected context namespace HTML attribute for components.
11511   * ns is short for "namespace"
11512   *
11513   * @example
11514   * ```jsx
11515   * <div {...cns()} />
11516   * ```
11517   *
11518   * @return {Record<string, any>} A props object with the namespaced HTML attribute.
11519   */
11520  function getConnectedNamespace() {
11521    return {
11522      [CONNECTED_NAMESPACE]: true
11523    };
11524  }
11525  
11526  ;// CONCATENATED MODULE: ./node_modules/tslib/tslib.es6.mjs
11527  /******************************************************************************
11528  Copyright (c) Microsoft Corporation.
11529  
11530  Permission to use, copy, modify, and/or distribute this software for any
11531  purpose with or without fee is hereby granted.
11532  
11533  THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
11534  REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
11535  AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
11536  INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
11537  LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
11538  OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
11539  PERFORMANCE OF THIS SOFTWARE.
11540  ***************************************************************************** */
11541  /* global Reflect, Promise, SuppressedError, Symbol, Iterator */
11542  
11543  var extendStatics = function(d, b) {
11544    extendStatics = Object.setPrototypeOf ||
11545        ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
11546        function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
11547    return extendStatics(d, b);
11548  };
11549  
11550  function __extends(d, b) {
11551    if (typeof b !== "function" && b !== null)
11552        throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
11553    extendStatics(d, b);
11554    function __() { this.constructor = d; }
11555    d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
11556  }
11557  
11558  var __assign = function() {
11559    __assign = Object.assign || function __assign(t) {
11560        for (var s, i = 1, n = arguments.length; i < n; i++) {
11561            s = arguments[i];
11562            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
11563        }
11564        return t;
11565    }
11566    return __assign.apply(this, arguments);
11567  }
11568  
11569  function __rest(s, e) {
11570    var t = {};
11571    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
11572        t[p] = s[p];
11573    if (s != null && typeof Object.getOwnPropertySymbols === "function")
11574        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
11575            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
11576                t[p[i]] = s[p[i]];
11577        }
11578    return t;
11579  }
11580  
11581  function __decorate(decorators, target, key, desc) {
11582    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
11583    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
11584    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;
11585    return c > 3 && r && Object.defineProperty(target, key, r), r;
11586  }
11587  
11588  function __param(paramIndex, decorator) {
11589    return function (target, key) { decorator(target, key, paramIndex); }
11590  }
11591  
11592  function __esDecorate(ctor, descriptorIn, decorators, contextIn, initializers, extraInitializers) {
11593    function accept(f) { if (f !== void 0 && typeof f !== "function") throw new TypeError("Function expected"); return f; }
11594    var kind = contextIn.kind, key = kind === "getter" ? "get" : kind === "setter" ? "set" : "value";
11595    var target = !descriptorIn && ctor ? contextIn["static"] ? ctor : ctor.prototype : null;
11596    var descriptor = descriptorIn || (target ? Object.getOwnPropertyDescriptor(target, contextIn.name) : {});
11597    var _, done = false;
11598    for (var i = decorators.length - 1; i >= 0; i--) {
11599        var context = {};
11600        for (var p in contextIn) context[p] = p === "access" ? {} : contextIn[p];
11601        for (var p in contextIn.access) context.access[p] = contextIn.access[p];
11602        context.addInitializer = function (f) { if (done) throw new TypeError("Cannot add initializers after decoration has completed"); extraInitializers.push(accept(f || null)); };
11603        var result = (0, decorators[i])(kind === "accessor" ? { get: descriptor.get, set: descriptor.set } : descriptor[key], context);
11604        if (kind === "accessor") {
11605            if (result === void 0) continue;
11606            if (result === null || typeof result !== "object") throw new TypeError("Object expected");
11607            if (_ = accept(result.get)) descriptor.get = _;
11608            if (_ = accept(result.set)) descriptor.set = _;
11609            if (_ = accept(result.init)) initializers.unshift(_);
11610        }
11611        else if (_ = accept(result)) {
11612            if (kind === "field") initializers.unshift(_);
11613            else descriptor[key] = _;
11614        }
11615    }
11616    if (target) Object.defineProperty(target, contextIn.name, descriptor);
11617    done = true;
11618  };
11619  
11620  function __runInitializers(thisArg, initializers, value) {
11621    var useValue = arguments.length > 2;
11622    for (var i = 0; i < initializers.length; i++) {
11623        value = useValue ? initializers[i].call(thisArg, value) : initializers[i].call(thisArg);
11624    }
11625    return useValue ? value : void 0;
11626  };
11627  
11628  function __propKey(x) {
11629    return typeof x === "symbol" ? x : "".concat(x);
11630  };
11631  
11632  function __setFunctionName(f, name, prefix) {
11633    if (typeof name === "symbol") name = name.description ? "[".concat(name.description, "]") : "";
11634    return Object.defineProperty(f, "name", { configurable: true, value: prefix ? "".concat(prefix, " ", name) : name });
11635  };
11636  
11637  function __metadata(metadataKey, metadataValue) {
11638    if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(metadataKey, metadataValue);
11639  }
11640  
11641  function __awaiter(thisArg, _arguments, P, generator) {
11642    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
11643    return new (P || (P = Promise))(function (resolve, reject) {
11644        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
11645        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
11646        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
11647        step((generator = generator.apply(thisArg, _arguments || [])).next());
11648    });
11649  }
11650  
11651  function __generator(thisArg, body) {
11652    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);
11653    return g.next = verb(0), g["throw"] = verb(1), g["return"] = verb(2), typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
11654    function verb(n) { return function (v) { return step([n, v]); }; }
11655    function step(op) {
11656        if (f) throw new TypeError("Generator is already executing.");
11657        while (g && (g = 0, op[0] && (_ = 0)), _) try {
11658            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;
11659            if (y = 0, t) op = [op[0] & 2, t.value];
11660            switch (op[0]) {
11661                case 0: case 1: t = op; break;
11662                case 4: _.label++; return { value: op[1], done: false };
11663                case 5: _.label++; y = op[1]; op = [0]; continue;
11664                case 7: op = _.ops.pop(); _.trys.pop(); continue;
11665                default:
11666                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
11667                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
11668                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
11669                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
11670                    if (t[2]) _.ops.pop();
11671                    _.trys.pop(); continue;
11672            }
11673            op = body.call(thisArg, _);
11674        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
11675        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
11676    }
11677  }
11678  
11679  var __createBinding = Object.create ? (function(o, m, k, k2) {
11680    if (k2 === undefined) k2 = k;
11681    var desc = Object.getOwnPropertyDescriptor(m, k);
11682    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
11683        desc = { enumerable: true, get: function() { return m[k]; } };
11684    }
11685    Object.defineProperty(o, k2, desc);
11686  }) : (function(o, m, k, k2) {
11687    if (k2 === undefined) k2 = k;
11688    o[k2] = m[k];
11689  });
11690  
11691  function __exportStar(m, o) {
11692    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(o, p)) __createBinding(o, m, p);
11693  }
11694  
11695  function __values(o) {
11696    var s = typeof Symbol === "function" && Symbol.iterator, m = s && o[s], i = 0;
11697    if (m) return m.call(o);
11698    if (o && typeof o.length === "number") return {
11699        next: function () {
11700            if (o && i >= o.length) o = void 0;
11701            return { value: o && o[i++], done: !o };
11702        }
11703    };
11704    throw new TypeError(s ? "Object is not iterable." : "Symbol.iterator is not defined.");
11705  }
11706  
11707  function __read(o, n) {
11708    var m = typeof Symbol === "function" && o[Symbol.iterator];
11709    if (!m) return o;
11710    var i = m.call(o), r, ar = [], e;
11711    try {
11712        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
11713    }
11714    catch (error) { e = { error: error }; }
11715    finally {
11716        try {
11717            if (r && !r.done && (m = i["return"])) m.call(i);
11718        }
11719        finally { if (e) throw e.error; }
11720    }
11721    return ar;
11722  }
11723  
11724  /** @deprecated */
11725  function __spread() {
11726    for (var ar = [], i = 0; i < arguments.length; i++)
11727        ar = ar.concat(__read(arguments[i]));
11728    return ar;
11729  }
11730  
11731  /** @deprecated */
11732  function __spreadArrays() {
11733    for (var s = 0, i = 0, il = arguments.length; i < il; i++) s += arguments[i].length;
11734    for (var r = Array(s), k = 0, i = 0; i < il; i++)
11735        for (var a = arguments[i], j = 0, jl = a.length; j < jl; j++, k++)
11736            r[k] = a[j];
11737    return r;
11738  }
11739  
11740  function __spreadArray(to, from, pack) {
11741    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
11742        if (ar || !(i in from)) {
11743            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
11744            ar[i] = from[i];
11745        }
11746    }
11747    return to.concat(ar || Array.prototype.slice.call(from));
11748  }
11749  
11750  function __await(v) {
11751    return this instanceof __await ? (this.v = v, this) : new __await(v);
11752  }
11753  
11754  function __asyncGenerator(thisArg, _arguments, generator) {
11755    if (!Symbol.asyncIterator) throw new TypeError("Symbol.asyncIterator is not defined.");
11756    var g = generator.apply(thisArg, _arguments || []), i, q = [];
11757    return i = Object.create((typeof AsyncIterator === "function" ? AsyncIterator : Object).prototype), verb("next"), verb("throw"), verb("return", awaitReturn), i[Symbol.asyncIterator] = function () { return this; }, i;
11758    function awaitReturn(f) { return function (v) { return Promise.resolve(v).then(f, reject); }; }
11759    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]); } }
11760    function resume(n, v) { try { step(g[n](v)); } catch (e) { settle(q[0][3], e); } }
11761    function step(r) { r.value instanceof __await ? Promise.resolve(r.value.v).then(fulfill, reject) : settle(q[0][2], r); }
11762    function fulfill(value) { resume("next", value); }
11763    function reject(value) { resume("throw", value); }
11764    function settle(f, v) { if (f(v), q.shift(), q.length) resume(q[0][0], q[0][1]); }
11765  }
11766  
11767  function __asyncDelegator(o) {
11768    var i, p;
11769    return i = {}, verb("next"), verb("throw", function (e) { throw e; }), verb("return"), i[Symbol.iterator] = function () { return this; }, i;
11770    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; }
11771  }
11772  
11773  function __asyncValues(o) {
11774    if (!Symbol.asyncIterator) throw new TypeError("Symbol.asyncIterator is not defined.");
11775    var m = o[Symbol.asyncIterator], i;
11776    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);
11777    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); }); }; }
11778    function settle(resolve, reject, d, v) { Promise.resolve(v).then(function(v) { resolve({ value: v, done: d }); }, reject); }
11779  }
11780  
11781  function __makeTemplateObject(cooked, raw) {
11782    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
11783    return cooked;
11784  };
11785  
11786  var __setModuleDefault = Object.create ? (function(o, v) {
11787    Object.defineProperty(o, "default", { enumerable: true, value: v });
11788  }) : function(o, v) {
11789    o["default"] = v;
11790  };
11791  
11792  function __importStar(mod) {
11793    if (mod && mod.__esModule) return mod;
11794    var result = {};
11795    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
11796    __setModuleDefault(result, mod);
11797    return result;
11798  }
11799  
11800  function __importDefault(mod) {
11801    return (mod && mod.__esModule) ? mod : { default: mod };
11802  }
11803  
11804  function __classPrivateFieldGet(receiver, state, kind, f) {
11805    if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a getter");
11806    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");
11807    return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
11808  }
11809  
11810  function __classPrivateFieldSet(receiver, state, value, kind, f) {
11811    if (kind === "m") throw new TypeError("Private method is not writable");
11812    if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a setter");
11813    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");
11814    return (kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;
11815  }
11816  
11817  function __classPrivateFieldIn(state, receiver) {
11818    if (receiver === null || (typeof receiver !== "object" && typeof receiver !== "function")) throw new TypeError("Cannot use 'in' operator on non-object");
11819    return typeof state === "function" ? receiver === state : state.has(receiver);
11820  }
11821  
11822  function __addDisposableResource(env, value, async) {
11823    if (value !== null && value !== void 0) {
11824      if (typeof value !== "object" && typeof value !== "function") throw new TypeError("Object expected.");
11825      var dispose, inner;
11826      if (async) {
11827        if (!Symbol.asyncDispose) throw new TypeError("Symbol.asyncDispose is not defined.");
11828        dispose = value[Symbol.asyncDispose];
11829      }
11830      if (dispose === void 0) {
11831        if (!Symbol.dispose) throw new TypeError("Symbol.dispose is not defined.");
11832        dispose = value[Symbol.dispose];
11833        if (async) inner = dispose;
11834      }
11835      if (typeof dispose !== "function") throw new TypeError("Object not disposable.");
11836      if (inner) dispose = function() { try { inner.call(this); } catch (e) { return Promise.reject(e); } };
11837      env.stack.push({ value: value, dispose: dispose, async: async });
11838    }
11839    else if (async) {
11840      env.stack.push({ async: true });
11841    }
11842    return value;
11843  }
11844  
11845  var _SuppressedError = typeof SuppressedError === "function" ? SuppressedError : function (error, suppressed, message) {
11846    var e = new Error(message);
11847    return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
11848  };
11849  
11850  function __disposeResources(env) {
11851    function fail(e) {
11852      env.error = env.hasError ? new _SuppressedError(e, env.error, "An error was suppressed during disposal.") : e;
11853      env.hasError = true;
11854    }
11855    var r, s = 0;
11856    function next() {
11857      while (r = env.stack.pop()) {
11858        try {
11859          if (!r.async && s === 1) return s = 0, env.stack.push(r), Promise.resolve().then(next);
11860          if (r.dispose) {
11861            var result = r.dispose.call(r.value);
11862            if (r.async) return s |= 2, Promise.resolve(result).then(next, function(e) { fail(e); return next(); });
11863          }
11864          else s |= 1;
11865        }
11866        catch (e) {
11867          fail(e);
11868        }
11869      }
11870      if (s === 1) return env.hasError ? Promise.reject(env.error) : Promise.resolve();
11871      if (env.hasError) throw env.error;
11872    }
11873    return next();
11874  }
11875  
11876  /* harmony default export */ const tslib_es6 = ({
11877    __extends,
11878    __assign,
11879    __rest,
11880    __decorate,
11881    __param,
11882    __metadata,
11883    __awaiter,
11884    __generator,
11885    __createBinding,
11886    __exportStar,
11887    __values,
11888    __read,
11889    __spread,
11890    __spreadArrays,
11891    __spreadArray,
11892    __await,
11893    __asyncGenerator,
11894    __asyncDelegator,
11895    __asyncValues,
11896    __makeTemplateObject,
11897    __importStar,
11898    __importDefault,
11899    __classPrivateFieldGet,
11900    __classPrivateFieldSet,
11901    __classPrivateFieldIn,
11902    __addDisposableResource,
11903    __disposeResources,
11904  });
11905  
11906  ;// CONCATENATED MODULE: ./node_modules/lower-case/dist.es2015/index.js
11907  /**
11908   * Source: ftp://ftp.unicode.org/Public/UCD/latest/ucd/SpecialCasing.txt
11909   */
11910  var SUPPORTED_LOCALE = {
11911      tr: {
11912          regexp: /\u0130|\u0049|\u0049\u0307/g,
11913          map: {
11914              İ: "\u0069",
11915              I: "\u0131",
11916              İ: "\u0069",
11917          },
11918      },
11919      az: {
11920          regexp: /\u0130/g,
11921          map: {
11922              İ: "\u0069",
11923              I: "\u0131",
11924              İ: "\u0069",
11925          },
11926      },
11927      lt: {
11928          regexp: /\u0049|\u004A|\u012E|\u00CC|\u00CD|\u0128/g,
11929          map: {
11930              I: "\u0069\u0307",
11931              J: "\u006A\u0307",
11932              Į: "\u012F\u0307",
11933              Ì: "\u0069\u0307\u0300",
11934              Í: "\u0069\u0307\u0301",
11935              Ĩ: "\u0069\u0307\u0303",
11936          },
11937      },
11938  };
11939  /**
11940   * Localized lower case.
11941   */
11942  function localeLowerCase(str, locale) {
11943      var lang = SUPPORTED_LOCALE[locale.toLowerCase()];
11944      if (lang)
11945          return lowerCase(str.replace(lang.regexp, function (m) { return lang.map[m]; }));
11946      return lowerCase(str);
11947  }
11948  /**
11949   * Lower case as a function.
11950   */
11951  function lowerCase(str) {
11952      return str.toLowerCase();
11953  }
11954  
11955  ;// CONCATENATED MODULE: ./node_modules/no-case/dist.es2015/index.js
11956  
11957  // Support camel case ("camelCase" -> "camel Case" and "CAMELCase" -> "CAMEL Case").
11958  var DEFAULT_SPLIT_REGEXP = [/([a-z0-9])([A-Z])/g, /([A-Z])([A-Z][a-z])/g];
11959  // Remove all non-word characters.
11960  var DEFAULT_STRIP_REGEXP = /[^A-Z0-9]+/gi;
11961  /**
11962   * Normalize the string into something other libraries can manipulate easier.
11963   */
11964  function noCase(input, options) {
11965      if (options === void 0) { options = {}; }
11966      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;
11967      var result = dist_es2015_replace(dist_es2015_replace(input, splitRegexp, "$1\0$2"), stripRegexp, "\0");
11968      var start = 0;
11969      var end = result.length;
11970      // Trim the delimiter from around the output string.
11971      while (result.charAt(start) === "\0")
11972          start++;
11973      while (result.charAt(end - 1) === "\0")
11974          end--;
11975      // Transform each token independently.
11976      return result.slice(start, end).split("\0").map(transform).join(delimiter);
11977  }
11978  /**
11979   * Replace `re` in the input string with the replacement value.
11980   */
11981  function dist_es2015_replace(input, re, value) {
11982      if (re instanceof RegExp)
11983          return input.replace(re, value);
11984      return re.reduce(function (input, re) { return input.replace(re, value); }, input);
11985  }
11986  
11987  ;// CONCATENATED MODULE: ./node_modules/dot-case/dist.es2015/index.js
11988  
11989  
11990  function dotCase(input, options) {
11991      if (options === void 0) { options = {}; }
11992      return noCase(input, __assign({ delimiter: "." }, options));
11993  }
11994  
11995  ;// CONCATENATED MODULE: ./node_modules/param-case/dist.es2015/index.js
11996  
11997  
11998  function paramCase(input, options) {
11999      if (options === void 0) { options = {}; }
12000      return dotCase(input, __assign({ delimiter: "-" }, options));
12001  }
12002  
12003  ;// CONCATENATED MODULE: ./node_modules/memize/dist/index.js
12004  /**
12005   * Memize options object.
12006   *
12007   * @typedef MemizeOptions
12008   *
12009   * @property {number} [maxSize] Maximum size of the cache.
12010   */
12011  
12012  /**
12013   * Internal cache entry.
12014   *
12015   * @typedef MemizeCacheNode
12016   *
12017   * @property {?MemizeCacheNode|undefined} [prev] Previous node.
12018   * @property {?MemizeCacheNode|undefined} [next] Next node.
12019   * @property {Array<*>}                   args   Function arguments for cache
12020   *                                               entry.
12021   * @property {*}                          val    Function result.
12022   */
12023  
12024  /**
12025   * Properties of the enhanced function for controlling cache.
12026   *
12027   * @typedef MemizeMemoizedFunction
12028   *
12029   * @property {()=>void} clear Clear the cache.
12030   */
12031  
12032  /**
12033   * Accepts a function to be memoized, and returns a new memoized function, with
12034   * optional options.
12035   *
12036   * @template {(...args: any[]) => any} F
12037   *
12038   * @param {F}             fn        Function to memoize.
12039   * @param {MemizeOptions} [options] Options object.
12040   *
12041   * @return {((...args: Parameters<F>) => ReturnType<F>) & MemizeMemoizedFunction} Memoized function.
12042   */
12043  function memize(fn, options) {
12044      var size = 0;
12045  
12046      /** @type {?MemizeCacheNode|undefined} */
12047      var head;
12048  
12049      /** @type {?MemizeCacheNode|undefined} */
12050      var tail;
12051  
12052      options = options || {};
12053  
12054  	function memoized(/* ...args */) {
12055          var node = head,
12056              len = arguments.length,
12057              args,
12058              i;
12059  
12060          searchCache: while (node) {
12061              // Perform a shallow equality test to confirm that whether the node
12062              // under test is a candidate for the arguments passed. Two arrays
12063              // are shallowly equal if their length matches and each entry is
12064              // strictly equal between the two sets. Avoid abstracting to a
12065              // function which could incur an arguments leaking deoptimization.
12066  
12067              // Check whether node arguments match arguments length
12068              if (node.args.length !== arguments.length) {
12069                  node = node.next;
12070                  continue;
12071              }
12072  
12073              // Check whether node arguments match arguments values
12074              for (i = 0; i < len; i++) {
12075                  if (node.args[i] !== arguments[i]) {
12076                      node = node.next;
12077                      continue searchCache;
12078                  }
12079              }
12080  
12081              // At this point we can assume we've found a match
12082  
12083              // Surface matched node to head if not already
12084              if (node !== head) {
12085                  // As tail, shift to previous. Must only shift if not also
12086                  // head, since if both head and tail, there is no previous.
12087                  if (node === tail) {
12088                      tail = node.prev;
12089                  }
12090  
12091                  // Adjust siblings to point to each other. If node was tail,
12092                  // this also handles new tail's empty `next` assignment.
12093                  /** @type {MemizeCacheNode} */ (node.prev).next = node.next;
12094                  if (node.next) {
12095                      node.next.prev = node.prev;
12096                  }
12097  
12098                  node.next = head;
12099                  node.prev = null;
12100                  /** @type {MemizeCacheNode} */ (head).prev = node;
12101                  head = node;
12102              }
12103  
12104              // Return immediately
12105              return node.val;
12106          }
12107  
12108          // No cached value found. Continue to insertion phase:
12109  
12110          // Create a copy of arguments (avoid leaking deoptimization)
12111          args = new Array(len);
12112          for (i = 0; i < len; i++) {
12113              args[i] = arguments[i];
12114          }
12115  
12116          node = {
12117              args: args,
12118  
12119              // Generate the result from original function
12120              val: fn.apply(null, args),
12121          };
12122  
12123          // Don't need to check whether node is already head, since it would
12124          // have been returned above already if it was
12125  
12126          // Shift existing head down list
12127          if (head) {
12128              head.prev = node;
12129              node.next = head;
12130          } else {
12131              // If no head, follows that there's no tail (at initial or reset)
12132              tail = node;
12133          }
12134  
12135          // Trim tail if we're reached max size and are pending cache insertion
12136          if (size === /** @type {MemizeOptions} */ (options).maxSize) {
12137              tail = /** @type {MemizeCacheNode} */ (tail).prev;
12138              /** @type {MemizeCacheNode} */ (tail).next = null;
12139          } else {
12140              size++;
12141          }
12142  
12143          head = node;
12144  
12145          return node.val;
12146      }
12147  
12148      memoized.clear = function () {
12149          head = null;
12150          tail = null;
12151          size = 0;
12152      };
12153  
12154      // Ignore reason: There's not a clear solution to create an intersection of
12155      // the function with additional properties, where the goal is to retain the
12156      // function signature of the incoming argument and add control properties
12157      // on the return value.
12158  
12159      // @ts-ignore
12160      return memoized;
12161  }
12162  
12163  
12164  
12165  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/context/get-styled-class-name-from-key.js
12166  /**
12167   * External dependencies
12168   */
12169  
12170  
12171  
12172  /**
12173   * Generates the connected component CSS className based on the namespace.
12174   *
12175   * @param namespace The name of the connected component.
12176   * @return The generated CSS className.
12177   */
12178  function getStyledClassName(namespace) {
12179    const kebab = paramCase(namespace);
12180    return `components-$kebab}`;
12181  }
12182  const getStyledClassNameFromKey = memize(getStyledClassName);
12183  
12184  ;// CONCATENATED MODULE: ./node_modules/@emotion/sheet/dist/emotion-sheet.browser.esm.js
12185  /*
12186  
12187  Based off glamor's StyleSheet, thanks Sunil ❤️
12188  
12189  high performance StyleSheet for css-in-js systems
12190  
12191  - uses multiple style tags behind the scenes for millions of rules
12192  - uses `insertRule` for appending in production for *much* faster performance
12193  
12194  // usage
12195  
12196  import { StyleSheet } from '@emotion/sheet'
12197  
12198  let styleSheet = new StyleSheet({ key: '', container: document.head })
12199  
12200  styleSheet.insert('#box { border: 1px solid red; }')
12201  - appends a css rule into the stylesheet
12202  
12203  styleSheet.flush()
12204  - empties the stylesheet of all its contents
12205  
12206  */
12207  // $FlowFixMe
12208  function sheetForTag(tag) {
12209    if (tag.sheet) {
12210      // $FlowFixMe
12211      return tag.sheet;
12212    } // this weirdness brought to you by firefox
12213  
12214    /* istanbul ignore next */
12215  
12216  
12217    for (var i = 0; i < document.styleSheets.length; i++) {
12218      if (document.styleSheets[i].ownerNode === tag) {
12219        // $FlowFixMe
12220        return document.styleSheets[i];
12221      }
12222    }
12223  }
12224  
12225  function createStyleElement(options) {
12226    var tag = document.createElement('style');
12227    tag.setAttribute('data-emotion', options.key);
12228  
12229    if (options.nonce !== undefined) {
12230      tag.setAttribute('nonce', options.nonce);
12231    }
12232  
12233    tag.appendChild(document.createTextNode(''));
12234    tag.setAttribute('data-s', '');
12235    return tag;
12236  }
12237  
12238  var StyleSheet = /*#__PURE__*/function () {
12239    // Using Node instead of HTMLElement since container may be a ShadowRoot
12240    function StyleSheet(options) {
12241      var _this = this;
12242  
12243      this._insertTag = function (tag) {
12244        var before;
12245  
12246        if (_this.tags.length === 0) {
12247          if (_this.insertionPoint) {
12248            before = _this.insertionPoint.nextSibling;
12249          } else if (_this.prepend) {
12250            before = _this.container.firstChild;
12251          } else {
12252            before = _this.before;
12253          }
12254        } else {
12255          before = _this.tags[_this.tags.length - 1].nextSibling;
12256        }
12257  
12258        _this.container.insertBefore(tag, before);
12259  
12260        _this.tags.push(tag);
12261      };
12262  
12263      this.isSpeedy = options.speedy === undefined ? "production" === 'production' : options.speedy;
12264      this.tags = [];
12265      this.ctr = 0;
12266      this.nonce = options.nonce; // key is the value of the data-emotion attribute, it's used to identify different sheets
12267  
12268      this.key = options.key;
12269      this.container = options.container;
12270      this.prepend = options.prepend;
12271      this.insertionPoint = options.insertionPoint;
12272      this.before = null;
12273    }
12274  
12275    var _proto = StyleSheet.prototype;
12276  
12277    _proto.hydrate = function hydrate(nodes) {
12278      nodes.forEach(this._insertTag);
12279    };
12280  
12281    _proto.insert = function insert(rule) {
12282      // the max length is how many rules we have per style tag, it's 65000 in speedy mode
12283      // it's 1 in dev because we insert source maps that map a single rule to a location
12284      // and you can only have one source map per style tag
12285      if (this.ctr % (this.isSpeedy ? 65000 : 1) === 0) {
12286        this._insertTag(createStyleElement(this));
12287      }
12288  
12289      var tag = this.tags[this.tags.length - 1];
12290  
12291      if (false) { var isImportRule; }
12292  
12293      if (this.isSpeedy) {
12294        var sheet = sheetForTag(tag);
12295  
12296        try {
12297          // this is the ultrafast version, works across browsers
12298          // the big drawback is that the css won't be editable in devtools
12299          sheet.insertRule(rule, sheet.cssRules.length);
12300        } catch (e) {
12301          if (false) {}
12302        }
12303      } else {
12304        tag.appendChild(document.createTextNode(rule));
12305      }
12306  
12307      this.ctr++;
12308    };
12309  
12310    _proto.flush = function flush() {
12311      // $FlowFixMe
12312      this.tags.forEach(function (tag) {
12313        return tag.parentNode && tag.parentNode.removeChild(tag);
12314      });
12315      this.tags = [];
12316      this.ctr = 0;
12317  
12318      if (false) {}
12319    };
12320  
12321    return StyleSheet;
12322  }();
12323  
12324  
12325  
12326  ;// CONCATENATED MODULE: ./node_modules/stylis/src/Utility.js
12327  /**
12328   * @param {number}
12329   * @return {number}
12330   */
12331  var abs = Math.abs
12332  
12333  /**
12334   * @param {number}
12335   * @return {string}
12336   */
12337  var Utility_from = String.fromCharCode
12338  
12339  /**
12340   * @param {object}
12341   * @return {object}
12342   */
12343  var Utility_assign = Object.assign
12344  
12345  /**
12346   * @param {string} value
12347   * @param {number} length
12348   * @return {number}
12349   */
12350  function hash (value, length) {
12351      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
12352  }
12353  
12354  /**
12355   * @param {string} value
12356   * @return {string}
12357   */
12358  function trim (value) {
12359      return value.trim()
12360  }
12361  
12362  /**
12363   * @param {string} value
12364   * @param {RegExp} pattern
12365   * @return {string?}
12366   */
12367  function Utility_match (value, pattern) {
12368      return (value = pattern.exec(value)) ? value[0] : value
12369  }
12370  
12371  /**
12372   * @param {string} value
12373   * @param {(string|RegExp)} pattern
12374   * @param {string} replacement
12375   * @return {string}
12376   */
12377  function Utility_replace (value, pattern, replacement) {
12378      return value.replace(pattern, replacement)
12379  }
12380  
12381  /**
12382   * @param {string} value
12383   * @param {string} search
12384   * @return {number}
12385   */
12386  function indexof (value, search) {
12387      return value.indexOf(search)
12388  }
12389  
12390  /**
12391   * @param {string} value
12392   * @param {number} index
12393   * @return {number}
12394   */
12395  function Utility_charat (value, index) {
12396      return value.charCodeAt(index) | 0
12397  }
12398  
12399  /**
12400   * @param {string} value
12401   * @param {number} begin
12402   * @param {number} end
12403   * @return {string}
12404   */
12405  function Utility_substr (value, begin, end) {
12406      return value.slice(begin, end)
12407  }
12408  
12409  /**
12410   * @param {string} value
12411   * @return {number}
12412   */
12413  function Utility_strlen (value) {
12414      return value.length
12415  }
12416  
12417  /**
12418   * @param {any[]} value
12419   * @return {number}
12420   */
12421  function Utility_sizeof (value) {
12422      return value.length
12423  }
12424  
12425  /**
12426   * @param {any} value
12427   * @param {any[]} array
12428   * @return {any}
12429   */
12430  function Utility_append (value, array) {
12431      return array.push(value), value
12432  }
12433  
12434  /**
12435   * @param {string[]} array
12436   * @param {function} callback
12437   * @return {string}
12438   */
12439  function Utility_combine (array, callback) {
12440      return array.map(callback).join('')
12441  }
12442  
12443  ;// CONCATENATED MODULE: ./node_modules/stylis/src/Tokenizer.js
12444  
12445  
12446  var line = 1
12447  var column = 1
12448  var Tokenizer_length = 0
12449  var position = 0
12450  var character = 0
12451  var characters = ''
12452  
12453  /**
12454   * @param {string} value
12455   * @param {object | null} root
12456   * @param {object | null} parent
12457   * @param {string} type
12458   * @param {string[] | string} props
12459   * @param {object[] | string} children
12460   * @param {number} length
12461   */
12462  function node (value, root, parent, type, props, children, length) {
12463      return {value: value, root: root, parent: parent, type: type, props: props, children: children, line: line, column: column, length: length, return: ''}
12464  }
12465  
12466  /**
12467   * @param {object} root
12468   * @param {object} props
12469   * @return {object}
12470   */
12471  function Tokenizer_copy (root, props) {
12472      return Utility_assign(node('', null, null, '', null, null, 0), root, {length: -root.length}, props)
12473  }
12474  
12475  /**
12476   * @return {number}
12477   */
12478  function Tokenizer_char () {
12479      return character
12480  }
12481  
12482  /**
12483   * @return {number}
12484   */
12485  function prev () {
12486      character = position > 0 ? Utility_charat(characters, --position) : 0
12487  
12488      if (column--, character === 10)
12489          column = 1, line--
12490  
12491      return character
12492  }
12493  
12494  /**
12495   * @return {number}
12496   */
12497  function next () {
12498      character = position < Tokenizer_length ? Utility_charat(characters, position++) : 0
12499  
12500      if (column++, character === 10)
12501          column = 1, line++
12502  
12503      return character
12504  }
12505  
12506  /**
12507   * @return {number}
12508   */
12509  function peek () {
12510      return Utility_charat(characters, position)
12511  }
12512  
12513  /**
12514   * @return {number}
12515   */
12516  function caret () {
12517      return position
12518  }
12519  
12520  /**
12521   * @param {number} begin
12522   * @param {number} end
12523   * @return {string}
12524   */
12525  function slice (begin, end) {
12526      return Utility_substr(characters, begin, end)
12527  }
12528  
12529  /**
12530   * @param {number} type
12531   * @return {number}
12532   */
12533  function token (type) {
12534      switch (type) {
12535          // \0 \t \n \r \s whitespace token
12536          case 0: case 9: case 10: case 13: case 32:
12537              return 5
12538          // ! + , / > @ ~ isolate token
12539          case 33: case 43: case 44: case 47: case 62: case 64: case 126:
12540          // ; { } breakpoint token
12541          case 59: case 123: case 125:
12542              return 4
12543          // : accompanied token
12544          case 58:
12545              return 3
12546          // " ' ( [ opening delimit token
12547          case 34: case 39: case 40: case 91:
12548              return 2
12549          // ) ] closing delimit token
12550          case 41: case 93:
12551              return 1
12552      }
12553  
12554      return 0
12555  }
12556  
12557  /**
12558   * @param {string} value
12559   * @return {any[]}
12560   */
12561  function alloc (value) {
12562      return line = column = 1, Tokenizer_length = Utility_strlen(characters = value), position = 0, []
12563  }
12564  
12565  /**
12566   * @param {any} value
12567   * @return {any}
12568   */
12569  function dealloc (value) {
12570      return characters = '', value
12571  }
12572  
12573  /**
12574   * @param {number} type
12575   * @return {string}
12576   */
12577  function delimit (type) {
12578      return trim(slice(position - 1, delimiter(type === 91 ? type + 2 : type === 40 ? type + 1 : type)))
12579  }
12580  
12581  /**
12582   * @param {string} value
12583   * @return {string[]}
12584   */
12585  function Tokenizer_tokenize (value) {
12586      return dealloc(tokenizer(alloc(value)))
12587  }
12588  
12589  /**
12590   * @param {number} type
12591   * @return {string}
12592   */
12593  function whitespace (type) {
12594      while (character = peek())
12595          if (character < 33)
12596              next()
12597          else
12598              break
12599  
12600      return token(type) > 2 || token(character) > 3 ? '' : ' '
12601  }
12602  
12603  /**
12604   * @param {string[]} children
12605   * @return {string[]}
12606   */
12607  function tokenizer (children) {
12608      while (next())
12609          switch (token(character)) {
12610              case 0: append(identifier(position - 1), children)
12611                  break
12612              case 2: append(delimit(character), children)
12613                  break
12614              default: append(from(character), children)
12615          }
12616  
12617      return children
12618  }
12619  
12620  /**
12621   * @param {number} index
12622   * @param {number} count
12623   * @return {string}
12624   */
12625  function escaping (index, count) {
12626      while (--count && next())
12627          // not 0-9 A-F a-f
12628          if (character < 48 || character > 102 || (character > 57 && character < 65) || (character > 70 && character < 97))
12629              break
12630  
12631      return slice(index, caret() + (count < 6 && peek() == 32 && next() == 32))
12632  }
12633  
12634  /**
12635   * @param {number} type
12636   * @return {number}
12637   */
12638  function delimiter (type) {
12639      while (next())
12640          switch (character) {
12641              // ] ) " '
12642              case type:
12643                  return position
12644              // " '
12645              case 34: case 39:
12646                  if (type !== 34 && type !== 39)
12647                      delimiter(character)
12648                  break
12649              // (
12650              case 40:
12651                  if (type === 41)
12652                      delimiter(type)
12653                  break
12654              // \
12655              case 92:
12656                  next()
12657                  break
12658          }
12659  
12660      return position
12661  }
12662  
12663  /**
12664   * @param {number} type
12665   * @param {number} index
12666   * @return {number}
12667   */
12668  function commenter (type, index) {
12669      while (next())
12670          // //
12671          if (type + character === 47 + 10)
12672              break
12673          // /*
12674          else if (type + character === 42 + 42 && peek() === 47)
12675              break
12676  
12677      return '/*' + slice(index, position - 1) + '*' + Utility_from(type === 47 ? type : next())
12678  }
12679  
12680  /**
12681   * @param {number} index
12682   * @return {string}
12683   */
12684  function identifier (index) {
12685      while (!token(peek()))
12686          next()
12687  
12688      return slice(index, position)
12689  }
12690  
12691  ;// CONCATENATED MODULE: ./node_modules/stylis/src/Enum.js
12692  var Enum_MS = '-ms-'
12693  var Enum_MOZ = '-moz-'
12694  var Enum_WEBKIT = '-webkit-'
12695  
12696  var COMMENT = 'comm'
12697  var Enum_RULESET = 'rule'
12698  var Enum_DECLARATION = 'decl'
12699  
12700  var PAGE = '@page'
12701  var MEDIA = '@media'
12702  var IMPORT = '@import'
12703  var CHARSET = '@charset'
12704  var VIEWPORT = '@viewport'
12705  var SUPPORTS = '@supports'
12706  var DOCUMENT = '@document'
12707  var NAMESPACE = '@namespace'
12708  var Enum_KEYFRAMES = '@keyframes'
12709  var FONT_FACE = '@font-face'
12710  var COUNTER_STYLE = '@counter-style'
12711  var FONT_FEATURE_VALUES = '@font-feature-values'
12712  
12713  ;// CONCATENATED MODULE: ./node_modules/stylis/src/Serializer.js
12714  
12715  
12716  
12717  /**
12718   * @param {object[]} children
12719   * @param {function} callback
12720   * @return {string}
12721   */
12722  function Serializer_serialize (children, callback) {
12723      var output = ''
12724      var length = Utility_sizeof(children)
12725  
12726      for (var i = 0; i < length; i++)
12727          output += callback(children[i], i, children, callback) || ''
12728  
12729      return output
12730  }
12731  
12732  /**
12733   * @param {object} element
12734   * @param {number} index
12735   * @param {object[]} children
12736   * @param {function} callback
12737   * @return {string}
12738   */
12739  function stringify (element, index, children, callback) {
12740      switch (element.type) {
12741          case IMPORT: case Enum_DECLARATION: return element.return = element.return || element.value
12742          case COMMENT: return ''
12743          case Enum_KEYFRAMES: return element.return = element.value + '{' + Serializer_serialize(element.children, callback) + '}'
12744          case Enum_RULESET: element.value = element.props.join(',')
12745      }
12746  
12747      return Utility_strlen(children = Serializer_serialize(element.children, callback)) ? element.return = element.value + '{' + children + '}' : ''
12748  }
12749  
12750  ;// CONCATENATED MODULE: ./node_modules/stylis/src/Middleware.js
12751  
12752  
12753  
12754  
12755  
12756  
12757  /**
12758   * @param {function[]} collection
12759   * @return {function}
12760   */
12761  function middleware (collection) {
12762      var length = Utility_sizeof(collection)
12763  
12764      return function (element, index, children, callback) {
12765          var output = ''
12766  
12767          for (var i = 0; i < length; i++)
12768              output += collection[i](element, index, children, callback) || ''
12769  
12770          return output
12771      }
12772  }
12773  
12774  /**
12775   * @param {function} callback
12776   * @return {function}
12777   */
12778  function rulesheet (callback) {
12779      return function (element) {
12780          if (!element.root)
12781              if (element = element.return)
12782                  callback(element)
12783      }
12784  }
12785  
12786  /**
12787   * @param {object} element
12788   * @param {number} index
12789   * @param {object[]} children
12790   * @param {function} callback
12791   */
12792  function prefixer (element, index, children, callback) {
12793      if (element.length > -1)
12794          if (!element.return)
12795              switch (element.type) {
12796                  case DECLARATION: element.return = prefix(element.value, element.length, children)
12797                      return
12798                  case KEYFRAMES:
12799                      return serialize([copy(element, {value: replace(element.value, '@', '@' + WEBKIT)})], callback)
12800                  case RULESET:
12801                      if (element.length)
12802                          return combine(element.props, function (value) {
12803                              switch (match(value, /(::plac\w+|:read-\w+)/)) {
12804                                  // :read-(only|write)
12805                                  case ':read-only': case ':read-write':
12806                                      return serialize([copy(element, {props: [replace(value, /:(read-\w+)/, ':' + MOZ + '$1')]})], callback)
12807                                  // :placeholder
12808                                  case '::placeholder':
12809                                      return serialize([
12810                                          copy(element, {props: [replace(value, /:(plac\w+)/, ':' + WEBKIT + 'input-$1')]}),
12811                                          copy(element, {props: [replace(value, /:(plac\w+)/, ':' + MOZ + '$1')]}),
12812                                          copy(element, {props: [replace(value, /:(plac\w+)/, MS + 'input-$1')]})
12813                                      ], callback)
12814                              }
12815  
12816                              return ''
12817                          })
12818              }
12819  }
12820  
12821  /**
12822   * @param {object} element
12823   * @param {number} index
12824   * @param {object[]} children
12825   */
12826  function namespace (element) {
12827      switch (element.type) {
12828          case RULESET:
12829              element.props = element.props.map(function (value) {
12830                  return combine(tokenize(value), function (value, index, children) {
12831                      switch (charat(value, 0)) {
12832                          // \f
12833                          case 12:
12834                              return substr(value, 1, strlen(value))
12835                          // \0 ( + > ~
12836                          case 0: case 40: case 43: case 62: case 126:
12837                              return value
12838                          // :
12839                          case 58:
12840                              if (children[++index] === 'global')
12841                                  children[index] = '', children[++index] = '\f' + substr(children[index], index = 1, -1)
12842                          // \s
12843                          case 32:
12844                              return index === 1 ? '' : value
12845                          default:
12846                              switch (index) {
12847                                  case 0: element = value
12848                                      return sizeof(children) > 1 ? '' : value
12849                                  case index = sizeof(children) - 1: case 2:
12850                                      return index === 2 ? value + element + element : value + element
12851                                  default:
12852                                      return value
12853                              }
12854                      }
12855                  })
12856              })
12857      }
12858  }
12859  
12860  ;// CONCATENATED MODULE: ./node_modules/stylis/src/Parser.js
12861  
12862  
12863  
12864  
12865  /**
12866   * @param {string} value
12867   * @return {object[]}
12868   */
12869  function compile (value) {
12870      return dealloc(parse('', null, null, null, [''], value = alloc(value), 0, [0], value))
12871  }
12872  
12873  /**
12874   * @param {string} value
12875   * @param {object} root
12876   * @param {object?} parent
12877   * @param {string[]} rule
12878   * @param {string[]} rules
12879   * @param {string[]} rulesets
12880   * @param {number[]} pseudo
12881   * @param {number[]} points
12882   * @param {string[]} declarations
12883   * @return {object}
12884   */
12885  function parse (value, root, parent, rule, rules, rulesets, pseudo, points, declarations) {
12886      var index = 0
12887      var offset = 0
12888      var length = pseudo
12889      var atrule = 0
12890      var property = 0
12891      var previous = 0
12892      var variable = 1
12893      var scanning = 1
12894      var ampersand = 1
12895      var character = 0
12896      var type = ''
12897      var props = rules
12898      var children = rulesets
12899      var reference = rule
12900      var characters = type
12901  
12902      while (scanning)
12903          switch (previous = character, character = next()) {
12904              // (
12905              case 40:
12906                  if (previous != 108 && Utility_charat(characters, length - 1) == 58) {
12907                      if (indexof(characters += Utility_replace(delimit(character), '&', '&\f'), '&\f') != -1)
12908                          ampersand = -1
12909                      break
12910                  }
12911              // " ' [
12912              case 34: case 39: case 91:
12913                  characters += delimit(character)
12914                  break
12915              // \t \n \r \s
12916              case 9: case 10: case 13: case 32:
12917                  characters += whitespace(previous)
12918                  break
12919              // \
12920              case 92:
12921                  characters += escaping(caret() - 1, 7)
12922                  continue
12923              // /
12924              case 47:
12925                  switch (peek()) {
12926                      case 42: case 47:
12927                          Utility_append(comment(commenter(next(), caret()), root, parent), declarations)
12928                          break
12929                      default:
12930                          characters += '/'
12931                  }
12932                  break
12933              // {
12934              case 123 * variable:
12935                  points[index++] = Utility_strlen(characters) * ampersand
12936              // } ; \0
12937              case 125 * variable: case 59: case 0:
12938                  switch (character) {
12939                      // \0 }
12940                      case 0: case 125: scanning = 0
12941                      // ;
12942                      case 59 + offset:
12943                          if (property > 0 && (Utility_strlen(characters) - length))
12944                              Utility_append(property > 32 ? declaration(characters + ';', rule, parent, length - 1) : declaration(Utility_replace(characters, ' ', '') + ';', rule, parent, length - 2), declarations)
12945                          break
12946                      // @ ;
12947                      case 59: characters += ';'
12948                      // { rule/at-rule
12949                      default:
12950                          Utility_append(reference = ruleset(characters, root, parent, index, offset, rules, points, type, props = [], children = [], length), rulesets)
12951  
12952                          if (character === 123)
12953                              if (offset === 0)
12954                                  parse(characters, root, reference, reference, props, rulesets, length, points, children)
12955                              else
12956                                  switch (atrule === 99 && Utility_charat(characters, 3) === 110 ? 100 : atrule) {
12957                                      // d m s
12958                                      case 100: case 109: case 115:
12959                                          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)
12960                                          break
12961                                      default:
12962                                          parse(characters, reference, reference, reference, [''], children, 0, points, children)
12963                                  }
12964                  }
12965  
12966                  index = offset = property = 0, variable = ampersand = 1, type = characters = '', length = pseudo
12967                  break
12968              // :
12969              case 58:
12970                  length = 1 + Utility_strlen(characters), property = previous
12971              default:
12972                  if (variable < 1)
12973                      if (character == 123)
12974                          --variable
12975                      else if (character == 125 && variable++ == 0 && prev() == 125)
12976                          continue
12977  
12978                  switch (characters += Utility_from(character), character * variable) {
12979                      // &
12980                      case 38:
12981                          ampersand = offset > 0 ? 1 : (characters += '\f', -1)
12982                          break
12983                      // ,
12984                      case 44:
12985                          points[index++] = (Utility_strlen(characters) - 1) * ampersand, ampersand = 1
12986                          break
12987                      // @
12988                      case 64:
12989                          // -
12990                          if (peek() === 45)
12991                              characters += delimit(next())
12992  
12993                          atrule = peek(), offset = length = Utility_strlen(type = characters += identifier(caret())), character++
12994                          break
12995                      // -
12996                      case 45:
12997                          if (previous === 45 && Utility_strlen(characters) == 2)
12998                              variable = 0
12999                  }
13000          }
13001  
13002      return rulesets
13003  }
13004  
13005  /**
13006   * @param {string} value
13007   * @param {object} root
13008   * @param {object?} parent
13009   * @param {number} index
13010   * @param {number} offset
13011   * @param {string[]} rules
13012   * @param {number[]} points
13013   * @param {string} type
13014   * @param {string[]} props
13015   * @param {string[]} children
13016   * @param {number} length
13017   * @return {object}
13018   */
13019  function ruleset (value, root, parent, index, offset, rules, points, type, props, children, length) {
13020      var post = offset - 1
13021      var rule = offset === 0 ? rules : ['']
13022      var size = Utility_sizeof(rule)
13023  
13024      for (var i = 0, j = 0, k = 0; i < index; ++i)
13025          for (var x = 0, y = Utility_substr(value, post + 1, post = abs(j = points[i])), z = value; x < size; ++x)
13026              if (z = trim(j > 0 ? rule[x] + ' ' + y : Utility_replace(y, /&\f/g, rule[x])))
13027                  props[k++] = z
13028  
13029      return node(value, root, parent, offset === 0 ? Enum_RULESET : type, props, children, length)
13030  }
13031  
13032  /**
13033   * @param {number} value
13034   * @param {object} root
13035   * @param {object?} parent
13036   * @return {object}
13037   */
13038  function comment (value, root, parent) {
13039      return node(value, root, parent, COMMENT, Utility_from(Tokenizer_char()), Utility_substr(value, 2, -2), 0)
13040  }
13041  
13042  /**
13043   * @param {string} value
13044   * @param {object} root
13045   * @param {object?} parent
13046   * @param {number} length
13047   * @return {object}
13048   */
13049  function declaration (value, root, parent, length) {
13050      return node(value, root, parent, Enum_DECLARATION, Utility_substr(value, 0, length), Utility_substr(value, length + 1, -1), length)
13051  }
13052  
13053  ;// CONCATENATED MODULE: ./node_modules/@emotion/cache/dist/emotion-cache.browser.esm.js
13054  
13055  
13056  
13057  
13058  
13059  var identifierWithPointTracking = function identifierWithPointTracking(begin, points, index) {
13060    var previous = 0;
13061    var character = 0;
13062  
13063    while (true) {
13064      previous = character;
13065      character = peek(); // &\f
13066  
13067      if (previous === 38 && character === 12) {
13068        points[index] = 1;
13069      }
13070  
13071      if (token(character)) {
13072        break;
13073      }
13074  
13075      next();
13076    }
13077  
13078    return slice(begin, position);
13079  };
13080  
13081  var toRules = function toRules(parsed, points) {
13082    // pretend we've started with a comma
13083    var index = -1;
13084    var character = 44;
13085  
13086    do {
13087      switch (token(character)) {
13088        case 0:
13089          // &\f
13090          if (character === 38 && peek() === 12) {
13091            // this is not 100% correct, we don't account for literal sequences here - like for example quoted strings
13092            // stylis inserts \f after & to know when & where it should replace this sequence with the context selector
13093            // and when it should just concatenate the outer and inner selectors
13094            // it's very unlikely for this sequence to actually appear in a different context, so we just leverage this fact here
13095            points[index] = 1;
13096          }
13097  
13098          parsed[index] += identifierWithPointTracking(position - 1, points, index);
13099          break;
13100  
13101        case 2:
13102          parsed[index] += delimit(character);
13103          break;
13104  
13105        case 4:
13106          // comma
13107          if (character === 44) {
13108            // colon
13109            parsed[++index] = peek() === 58 ? '&\f' : '';
13110            points[index] = parsed[index].length;
13111            break;
13112          }
13113  
13114        // fallthrough
13115  
13116        default:
13117          parsed[index] += Utility_from(character);
13118      }
13119    } while (character = next());
13120  
13121    return parsed;
13122  };
13123  
13124  var getRules = function getRules(value, points) {
13125    return dealloc(toRules(alloc(value), points));
13126  }; // WeakSet would be more appropriate, but only WeakMap is supported in IE11
13127  
13128  
13129  var fixedElements = /* #__PURE__ */new WeakMap();
13130  var compat = function compat(element) {
13131    if (element.type !== 'rule' || !element.parent || // positive .length indicates that this rule contains pseudo
13132    // negative .length indicates that this rule has been already prefixed
13133    element.length < 1) {
13134      return;
13135    }
13136  
13137    var value = element.value,
13138        parent = element.parent;
13139    var isImplicitRule = element.column === parent.column && element.line === parent.line;
13140  
13141    while (parent.type !== 'rule') {
13142      parent = parent.parent;
13143      if (!parent) return;
13144    } // short-circuit for the simplest case
13145  
13146  
13147    if (element.props.length === 1 && value.charCodeAt(0) !== 58
13148    /* colon */
13149    && !fixedElements.get(parent)) {
13150      return;
13151    } // if this is an implicitly inserted rule (the one eagerly inserted at the each new nested level)
13152    // then the props has already been manipulated beforehand as they that array is shared between it and its "rule parent"
13153  
13154  
13155    if (isImplicitRule) {
13156      return;
13157    }
13158  
13159    fixedElements.set(element, true);
13160    var points = [];
13161    var rules = getRules(value, points);
13162    var parentRules = parent.props;
13163  
13164    for (var i = 0, k = 0; i < rules.length; i++) {
13165      for (var j = 0; j < parentRules.length; j++, k++) {
13166        element.props[k] = points[i] ? rules[i].replace(/&\f/g, parentRules[j]) : parentRules[j] + " " + rules[i];
13167      }
13168    }
13169  };
13170  var removeLabel = function removeLabel(element) {
13171    if (element.type === 'decl') {
13172      var value = element.value;
13173  
13174      if ( // charcode for l
13175      value.charCodeAt(0) === 108 && // charcode for b
13176      value.charCodeAt(2) === 98) {
13177        // this ignores label
13178        element["return"] = '';
13179        element.value = '';
13180      }
13181    }
13182  };
13183  var ignoreFlag = 'emotion-disable-server-rendering-unsafe-selector-warning-please-do-not-use-this-the-warning-exists-for-a-reason';
13184  
13185  var isIgnoringComment = function isIgnoringComment(element) {
13186    return element.type === 'comm' && element.children.indexOf(ignoreFlag) > -1;
13187  };
13188  
13189  var createUnsafeSelectorsAlarm = function createUnsafeSelectorsAlarm(cache) {
13190    return function (element, index, children) {
13191      if (element.type !== 'rule' || cache.compat) return;
13192      var unsafePseudoClasses = element.value.match(/(:first|:nth|:nth-last)-child/g);
13193  
13194      if (unsafePseudoClasses) {
13195        var isNested = element.parent === children[0]; // in nested rules comments become children of the "auto-inserted" rule
13196        //
13197        // considering this input:
13198        // .a {
13199        //   .b /* comm */ {}
13200        //   color: hotpink;
13201        // }
13202        // we get output corresponding to this:
13203        // .a {
13204        //   & {
13205        //     /* comm */
13206        //     color: hotpink;
13207        //   }
13208        //   .b {}
13209        // }
13210  
13211        var commentContainer = isNested ? children[0].children : // global rule at the root level
13212        children;
13213  
13214        for (var i = commentContainer.length - 1; i >= 0; i--) {
13215          var node = commentContainer[i];
13216  
13217          if (node.line < element.line) {
13218            break;
13219          } // it is quite weird but comments are *usually* put at `column: element.column - 1`
13220          // so we seek *from the end* for the node that is earlier than the rule's `element` and check that
13221          // this will also match inputs like this:
13222          // .a {
13223          //   /* comm */
13224          //   .b {}
13225          // }
13226          //
13227          // but that is fine
13228          //
13229          // it would be the easiest to change the placement of the comment to be the first child of the rule:
13230          // .a {
13231          //   .b { /* comm */ }
13232          // }
13233          // with such inputs we wouldn't have to search for the comment at all
13234          // TODO: consider changing this comment placement in the next major version
13235  
13236  
13237          if (node.column < element.column) {
13238            if (isIgnoringComment(node)) {
13239              return;
13240            }
13241  
13242            break;
13243          }
13244        }
13245  
13246        unsafePseudoClasses.forEach(function (unsafePseudoClass) {
13247          console.error("The pseudo class \"" + unsafePseudoClass + "\" is potentially unsafe when doing server-side rendering. Try changing it to \"" + unsafePseudoClass.split('-child')[0] + "-of-type\".");
13248        });
13249      }
13250    };
13251  };
13252  
13253  var isImportRule = function isImportRule(element) {
13254    return element.type.charCodeAt(1) === 105 && element.type.charCodeAt(0) === 64;
13255  };
13256  
13257  var isPrependedWithRegularRules = function isPrependedWithRegularRules(index, children) {
13258    for (var i = index - 1; i >= 0; i--) {
13259      if (!isImportRule(children[i])) {
13260        return true;
13261      }
13262    }
13263  
13264    return false;
13265  }; // use this to remove incorrect elements from further processing
13266  // so they don't get handed to the `sheet` (or anything else)
13267  // as that could potentially lead to additional logs which in turn could be overhelming to the user
13268  
13269  
13270  var nullifyElement = function nullifyElement(element) {
13271    element.type = '';
13272    element.value = '';
13273    element["return"] = '';
13274    element.children = '';
13275    element.props = '';
13276  };
13277  
13278  var incorrectImportAlarm = function incorrectImportAlarm(element, index, children) {
13279    if (!isImportRule(element)) {
13280      return;
13281    }
13282  
13283    if (element.parent) {
13284      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.");
13285      nullifyElement(element);
13286    } else if (isPrependedWithRegularRules(index, children)) {
13287      console.error("`@import` rules can't be after other rules. Please put your `@import` rules before your other rules.");
13288      nullifyElement(element);
13289    }
13290  };
13291  
13292  /* eslint-disable no-fallthrough */
13293  
13294  function emotion_cache_browser_esm_prefix(value, length) {
13295    switch (hash(value, length)) {
13296      // color-adjust
13297      case 5103:
13298        return Enum_WEBKIT + 'print-' + value + value;
13299      // animation, animation-(delay|direction|duration|fill-mode|iteration-count|name|play-state|timing-function)
13300  
13301      case 5737:
13302      case 4201:
13303      case 3177:
13304      case 3433:
13305      case 1641:
13306      case 4457:
13307      case 2921: // text-decoration, filter, clip-path, backface-visibility, column, box-decoration-break
13308  
13309      case 5572:
13310      case 6356:
13311      case 5844:
13312      case 3191:
13313      case 6645:
13314      case 3005: // mask, mask-image, mask-(mode|clip|size), mask-(repeat|origin), mask-position, mask-composite,
13315  
13316      case 6391:
13317      case 5879:
13318      case 5623:
13319      case 6135:
13320      case 4599:
13321      case 4855: // background-clip, columns, column-(count|fill|gap|rule|rule-color|rule-style|rule-width|span|width)
13322  
13323      case 4215:
13324      case 6389:
13325      case 5109:
13326      case 5365:
13327      case 5621:
13328      case 3829:
13329        return Enum_WEBKIT + value + value;
13330      // appearance, user-select, transform, hyphens, text-size-adjust
13331  
13332      case 5349:
13333      case 4246:
13334      case 4810:
13335      case 6968:
13336      case 2756:
13337        return Enum_WEBKIT + value + Enum_MOZ + value + Enum_MS + value + value;
13338      // flex, flex-direction
13339  
13340      case 6828:
13341      case 4268:
13342        return Enum_WEBKIT + value + Enum_MS + value + value;
13343      // order
13344  
13345      case 6165:
13346        return Enum_WEBKIT + value + Enum_MS + 'flex-' + value + value;
13347      // align-items
13348  
13349      case 5187:
13350        return Enum_WEBKIT + value + Utility_replace(value, /(\w+).+(:[^]+)/, Enum_WEBKIT + 'box-$1$2' + Enum_MS + 'flex-$1$2') + value;
13351      // align-self
13352  
13353      case 5443:
13354        return Enum_WEBKIT + value + Enum_MS + 'flex-item-' + Utility_replace(value, /flex-|-self/, '') + value;
13355      // align-content
13356  
13357      case 4675:
13358        return Enum_WEBKIT + value + Enum_MS + 'flex-line-pack' + Utility_replace(value, /align-content|flex-|-self/, '') + value;
13359      // flex-shrink
13360  
13361      case 5548:
13362        return Enum_WEBKIT + value + Enum_MS + Utility_replace(value, 'shrink', 'negative') + value;
13363      // flex-basis
13364  
13365      case 5292:
13366        return Enum_WEBKIT + value + Enum_MS + Utility_replace(value, 'basis', 'preferred-size') + value;
13367      // flex-grow
13368  
13369      case 6060:
13370        return Enum_WEBKIT + 'box-' + Utility_replace(value, '-grow', '') + Enum_WEBKIT + value + Enum_MS + Utility_replace(value, 'grow', 'positive') + value;
13371      // transition
13372  
13373      case 4554:
13374        return Enum_WEBKIT + Utility_replace(value, /([^-])(transform)/g, '$1' + Enum_WEBKIT + '$2') + value;
13375      // cursor
13376  
13377      case 6187:
13378        return Utility_replace(Utility_replace(Utility_replace(value, /(zoom-|grab)/, Enum_WEBKIT + '$1'), /(image-set)/, Enum_WEBKIT + '$1'), value, '') + value;
13379      // background, background-image
13380  
13381      case 5495:
13382      case 3959:
13383        return Utility_replace(value, /(image-set\([^]*)/, Enum_WEBKIT + '$1' + '$`$1');
13384      // justify-content
13385  
13386      case 4968:
13387        return Utility_replace(Utility_replace(value, /(.+:)(flex-)?(.*)/, Enum_WEBKIT + 'box-pack:$3' + Enum_MS + 'flex-pack:$3'), /s.+-b[^;]+/, 'justify') + Enum_WEBKIT + value + value;
13388      // (margin|padding)-inline-(start|end)
13389  
13390      case 4095:
13391      case 3583:
13392      case 4068:
13393      case 2532:
13394        return Utility_replace(value, /(.+)-inline(.+)/, Enum_WEBKIT + '$1$2') + value;
13395      // (min|max)?(width|height|inline-size|block-size)
13396  
13397      case 8116:
13398      case 7059:
13399      case 5753:
13400      case 5535:
13401      case 5445:
13402      case 5701:
13403      case 4933:
13404      case 4677:
13405      case 5533:
13406      case 5789:
13407      case 5021:
13408      case 4765:
13409        // stretch, max-content, min-content, fill-available
13410        if (Utility_strlen(value) - 1 - length > 6) switch (Utility_charat(value, length + 1)) {
13411          // (m)ax-content, (m)in-content
13412          case 109:
13413            // -
13414            if (Utility_charat(value, length + 4) !== 45) break;
13415          // (f)ill-available, (f)it-content
13416  
13417          case 102:
13418            return Utility_replace(value, /(.+:)(.+)-([^]+)/, '$1' + Enum_WEBKIT + '$2-$3' + '$1' + Enum_MOZ + (Utility_charat(value, length + 3) == 108 ? '$3' : '$2-$3')) + value;
13419          // (s)tretch
13420  
13421          case 115:
13422            return ~indexof(value, 'stretch') ? emotion_cache_browser_esm_prefix(Utility_replace(value, 'stretch', 'fill-available'), length) + value : value;
13423        }
13424        break;
13425      // position: sticky
13426  
13427      case 4949:
13428        // (s)ticky?
13429        if (Utility_charat(value, length + 1) !== 115) break;
13430      // display: (flex|inline-flex)
13431  
13432      case 6444:
13433        switch (Utility_charat(value, Utility_strlen(value) - 3 - (~indexof(value, '!important') && 10))) {
13434          // stic(k)y
13435          case 107:
13436            return Utility_replace(value, ':', ':' + Enum_WEBKIT) + value;
13437          // (inline-)?fl(e)x
13438  
13439          case 101:
13440            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;
13441        }
13442  
13443        break;
13444      // writing-mode
13445  
13446      case 5936:
13447        switch (Utility_charat(value, length + 11)) {
13448          // vertical-l(r)
13449          case 114:
13450            return Enum_WEBKIT + value + Enum_MS + Utility_replace(value, /[svh]\w+-[tblr]{2}/, 'tb') + value;
13451          // vertical-r(l)
13452  
13453          case 108:
13454            return Enum_WEBKIT + value + Enum_MS + Utility_replace(value, /[svh]\w+-[tblr]{2}/, 'tb-rl') + value;
13455          // horizontal(-)tb
13456  
13457          case 45:
13458            return Enum_WEBKIT + value + Enum_MS + Utility_replace(value, /[svh]\w+-[tblr]{2}/, 'lr') + value;
13459        }
13460  
13461        return Enum_WEBKIT + value + Enum_MS + value + value;
13462    }
13463  
13464    return value;
13465  }
13466  
13467  var emotion_cache_browser_esm_prefixer = function prefixer(element, index, children, callback) {
13468    if (element.length > -1) if (!element["return"]) switch (element.type) {
13469      case Enum_DECLARATION:
13470        element["return"] = emotion_cache_browser_esm_prefix(element.value, element.length);
13471        break;
13472  
13473      case Enum_KEYFRAMES:
13474        return Serializer_serialize([Tokenizer_copy(element, {
13475          value: Utility_replace(element.value, '@', '@' + Enum_WEBKIT)
13476        })], callback);
13477  
13478      case Enum_RULESET:
13479        if (element.length) return Utility_combine(element.props, function (value) {
13480          switch (Utility_match(value, /(::plac\w+|:read-\w+)/)) {
13481            // :read-(only|write)
13482            case ':read-only':
13483            case ':read-write':
13484              return Serializer_serialize([Tokenizer_copy(element, {
13485                props: [Utility_replace(value, /:(read-\w+)/, ':' + Enum_MOZ + '$1')]
13486              })], callback);
13487            // :placeholder
13488  
13489            case '::placeholder':
13490              return Serializer_serialize([Tokenizer_copy(element, {
13491                props: [Utility_replace(value, /:(plac\w+)/, ':' + Enum_WEBKIT + 'input-$1')]
13492              }), Tokenizer_copy(element, {
13493                props: [Utility_replace(value, /:(plac\w+)/, ':' + Enum_MOZ + '$1')]
13494              }), Tokenizer_copy(element, {
13495                props: [Utility_replace(value, /:(plac\w+)/, Enum_MS + 'input-$1')]
13496              })], callback);
13497          }
13498  
13499          return '';
13500        });
13501    }
13502  };
13503  
13504  var defaultStylisPlugins = [emotion_cache_browser_esm_prefixer];
13505  
13506  var createCache = function createCache(options) {
13507    var key = options.key;
13508  
13509    if (false) {}
13510  
13511    if ( key === 'css') {
13512      var ssrStyles = document.querySelectorAll("style[data-emotion]:not([data-s])"); // get SSRed styles out of the way of React's hydration
13513      // document.head is a safe place to move them to(though note document.head is not necessarily the last place they will be)
13514      // note this very very intentionally targets all style elements regardless of the key to ensure
13515      // that creating a cache works inside of render of a React component
13516  
13517      Array.prototype.forEach.call(ssrStyles, function (node) {
13518        // we want to only move elements which have a space in the data-emotion attribute value
13519        // because that indicates that it is an Emotion 11 server-side rendered style elements
13520        // while we will already ignore Emotion 11 client-side inserted styles because of the :not([data-s]) part in the selector
13521        // Emotion 10 client-side inserted styles did not have data-s (but importantly did not have a space in their data-emotion attributes)
13522        // so checking for the space ensures that loading Emotion 11 after Emotion 10 has inserted some styles
13523        // will not result in the Emotion 10 styles being destroyed
13524        var dataEmotionAttribute = node.getAttribute('data-emotion');
13525  
13526        if (dataEmotionAttribute.indexOf(' ') === -1) {
13527          return;
13528        }
13529        document.head.appendChild(node);
13530        node.setAttribute('data-s', '');
13531      });
13532    }
13533  
13534    var stylisPlugins = options.stylisPlugins || defaultStylisPlugins;
13535  
13536    if (false) {}
13537  
13538    var inserted = {};
13539    var container;
13540    var nodesToHydrate = [];
13541  
13542    {
13543      container = options.container || document.head;
13544      Array.prototype.forEach.call( // this means we will ignore elements which don't have a space in them which
13545      // means that the style elements we're looking at are only Emotion 11 server-rendered style elements
13546      document.querySelectorAll("style[data-emotion^=\"" + key + " \"]"), function (node) {
13547        var attrib = node.getAttribute("data-emotion").split(' '); // $FlowFixMe
13548  
13549        for (var i = 1; i < attrib.length; i++) {
13550          inserted[attrib[i]] = true;
13551        }
13552  
13553        nodesToHydrate.push(node);
13554      });
13555    }
13556  
13557    var _insert;
13558  
13559    var omnipresentPlugins = [compat, removeLabel];
13560  
13561    if (false) {}
13562  
13563    {
13564      var currentSheet;
13565      var finalizingPlugins = [stringify,  false ? 0 : rulesheet(function (rule) {
13566        currentSheet.insert(rule);
13567      })];
13568      var serializer = middleware(omnipresentPlugins.concat(stylisPlugins, finalizingPlugins));
13569  
13570      var stylis = function stylis(styles) {
13571        return Serializer_serialize(compile(styles), serializer);
13572      };
13573  
13574      _insert = function insert(selector, serialized, sheet, shouldCache) {
13575        currentSheet = sheet;
13576  
13577        if (false) {}
13578  
13579        stylis(selector ? selector + "{" + serialized.styles + "}" : serialized.styles);
13580  
13581        if (shouldCache) {
13582          cache.inserted[serialized.name] = true;
13583        }
13584      };
13585    }
13586  
13587    var cache = {
13588      key: key,
13589      sheet: new StyleSheet({
13590        key: key,
13591        container: container,
13592        nonce: options.nonce,
13593        speedy: options.speedy,
13594        prepend: options.prepend,
13595        insertionPoint: options.insertionPoint
13596      }),
13597      nonce: options.nonce,
13598      inserted: inserted,
13599      registered: {},
13600      insert: _insert
13601    };
13602    cache.sheet.hydrate(nodesToHydrate);
13603    return cache;
13604  };
13605  
13606  /* harmony default export */ const emotion_cache_browser_esm = (createCache);
13607  
13608  ;// CONCATENATED MODULE: ./node_modules/@emotion/hash/dist/emotion-hash.esm.js
13609  /* eslint-disable */
13610  // Inspired by https://github.com/garycourt/murmurhash-js
13611  // Ported from https://github.com/aappleby/smhasher/blob/61a0530f28277f2e850bfc39600ce61d02b518de/src/MurmurHash2.cpp#L37-L86
13612  function murmur2(str) {
13613    // 'm' and 'r' are mixing constants generated offline.
13614    // They're not really 'magic', they just happen to work well.
13615    // const m = 0x5bd1e995;
13616    // const r = 24;
13617    // Initialize the hash
13618    var h = 0; // Mix 4 bytes at a time into the hash
13619  
13620    var k,
13621        i = 0,
13622        len = str.length;
13623  
13624    for (; len >= 4; ++i, len -= 4) {
13625      k = str.charCodeAt(i) & 0xff | (str.charCodeAt(++i) & 0xff) << 8 | (str.charCodeAt(++i) & 0xff) << 16 | (str.charCodeAt(++i) & 0xff) << 24;
13626      k =
13627      /* Math.imul(k, m): */
13628      (k & 0xffff) * 0x5bd1e995 + ((k >>> 16) * 0xe995 << 16);
13629      k ^=
13630      /* k >>> r: */
13631      k >>> 24;
13632      h =
13633      /* Math.imul(k, m): */
13634      (k & 0xffff) * 0x5bd1e995 + ((k >>> 16) * 0xe995 << 16) ^
13635      /* Math.imul(h, m): */
13636      (h & 0xffff) * 0x5bd1e995 + ((h >>> 16) * 0xe995 << 16);
13637    } // Handle the last few bytes of the input array
13638  
13639  
13640    switch (len) {
13641      case 3:
13642        h ^= (str.charCodeAt(i + 2) & 0xff) << 16;
13643  
13644      case 2:
13645        h ^= (str.charCodeAt(i + 1) & 0xff) << 8;
13646  
13647      case 1:
13648        h ^= str.charCodeAt(i) & 0xff;
13649        h =
13650        /* Math.imul(h, m): */
13651        (h & 0xffff) * 0x5bd1e995 + ((h >>> 16) * 0xe995 << 16);
13652    } // Do a few final mixes of the hash to ensure the last few
13653    // bytes are well-incorporated.
13654  
13655  
13656    h ^= h >>> 13;
13657    h =
13658    /* Math.imul(h, m): */
13659    (h & 0xffff) * 0x5bd1e995 + ((h >>> 16) * 0xe995 << 16);
13660    return ((h ^ h >>> 15) >>> 0).toString(36);
13661  }
13662  
13663  /* harmony default export */ const emotion_hash_esm = (murmur2);
13664  
13665  ;// CONCATENATED MODULE: ./node_modules/@emotion/unitless/dist/emotion-unitless.esm.js
13666  var unitlessKeys = {
13667    animationIterationCount: 1,
13668    borderImageOutset: 1,
13669    borderImageSlice: 1,
13670    borderImageWidth: 1,
13671    boxFlex: 1,
13672    boxFlexGroup: 1,
13673    boxOrdinalGroup: 1,
13674    columnCount: 1,
13675    columns: 1,
13676    flex: 1,
13677    flexGrow: 1,
13678    flexPositive: 1,
13679    flexShrink: 1,
13680    flexNegative: 1,
13681    flexOrder: 1,
13682    gridRow: 1,
13683    gridRowEnd: 1,
13684    gridRowSpan: 1,
13685    gridRowStart: 1,
13686    gridColumn: 1,
13687    gridColumnEnd: 1,
13688    gridColumnSpan: 1,
13689    gridColumnStart: 1,
13690    msGridRow: 1,
13691    msGridRowSpan: 1,
13692    msGridColumn: 1,
13693    msGridColumnSpan: 1,
13694    fontWeight: 1,
13695    lineHeight: 1,
13696    opacity: 1,
13697    order: 1,
13698    orphans: 1,
13699    tabSize: 1,
13700    widows: 1,
13701    zIndex: 1,
13702    zoom: 1,
13703    WebkitLineClamp: 1,
13704    // SVG-related properties
13705    fillOpacity: 1,
13706    floodOpacity: 1,
13707    stopOpacity: 1,
13708    strokeDasharray: 1,
13709    strokeDashoffset: 1,
13710    strokeMiterlimit: 1,
13711    strokeOpacity: 1,
13712    strokeWidth: 1
13713  };
13714  
13715  /* harmony default export */ const emotion_unitless_esm = (unitlessKeys);
13716  
13717  ;// CONCATENATED MODULE: ./node_modules/@emotion/memoize/dist/emotion-memoize.esm.js
13718  function memoize(fn) {
13719    var cache = Object.create(null);
13720    return function (arg) {
13721      if (cache[arg] === undefined) cache[arg] = fn(arg);
13722      return cache[arg];
13723    };
13724  }
13725  
13726  
13727  
13728  ;// CONCATENATED MODULE: ./node_modules/@emotion/serialize/dist/emotion-serialize.browser.esm.js
13729  
13730  
13731  
13732  
13733  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";
13734  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).";
13735  var hyphenateRegex = /[A-Z]|^ms/g;
13736  var animationRegex = /_EMO_([^_]+?)_([^]*?)_EMO_/g;
13737  
13738  var isCustomProperty = function isCustomProperty(property) {
13739    return property.charCodeAt(1) === 45;
13740  };
13741  
13742  var isProcessableValue = function isProcessableValue(value) {
13743    return value != null && typeof value !== 'boolean';
13744  };
13745  
13746  var processStyleName = /* #__PURE__ */memoize(function (styleName) {
13747    return isCustomProperty(styleName) ? styleName : styleName.replace(hyphenateRegex, '-$&').toLowerCase();
13748  });
13749  
13750  var processStyleValue = function processStyleValue(key, value) {
13751    switch (key) {
13752      case 'animation':
13753      case 'animationName':
13754        {
13755          if (typeof value === 'string') {
13756            return value.replace(animationRegex, function (match, p1, p2) {
13757              cursor = {
13758                name: p1,
13759                styles: p2,
13760                next: cursor
13761              };
13762              return p1;
13763            });
13764          }
13765        }
13766    }
13767  
13768    if (emotion_unitless_esm[key] !== 1 && !isCustomProperty(key) && typeof value === 'number' && value !== 0) {
13769      return value + 'px';
13770    }
13771  
13772    return value;
13773  };
13774  
13775  if (false) { var hyphenatedCache, hyphenPattern, msPattern, oldProcessStyleValue, contentValues, contentValuePattern; }
13776  
13777  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.'));
13778  
13779  function handleInterpolation(mergedProps, registered, interpolation) {
13780    if (interpolation == null) {
13781      return '';
13782    }
13783  
13784    if (interpolation.__emotion_styles !== undefined) {
13785      if (false) {}
13786  
13787      return interpolation;
13788    }
13789  
13790    switch (typeof interpolation) {
13791      case 'boolean':
13792        {
13793          return '';
13794        }
13795  
13796      case 'object':
13797        {
13798          if (interpolation.anim === 1) {
13799            cursor = {
13800              name: interpolation.name,
13801              styles: interpolation.styles,
13802              next: cursor
13803            };
13804            return interpolation.name;
13805          }
13806  
13807          if (interpolation.styles !== undefined) {
13808            var next = interpolation.next;
13809  
13810            if (next !== undefined) {
13811              // not the most efficient thing ever but this is a pretty rare case
13812              // and there will be very few iterations of this generally
13813              while (next !== undefined) {
13814                cursor = {
13815                  name: next.name,
13816                  styles: next.styles,
13817                  next: cursor
13818                };
13819                next = next.next;
13820              }
13821            }
13822  
13823            var styles = interpolation.styles + ";";
13824  
13825            if (false) {}
13826  
13827            return styles;
13828          }
13829  
13830          return createStringFromObject(mergedProps, registered, interpolation);
13831        }
13832  
13833      case 'function':
13834        {
13835          if (mergedProps !== undefined) {
13836            var previousCursor = cursor;
13837            var result = interpolation(mergedProps);
13838            cursor = previousCursor;
13839            return handleInterpolation(mergedProps, registered, result);
13840          } else if (false) {}
13841  
13842          break;
13843        }
13844  
13845      case 'string':
13846        if (false) { var replaced, matched; }
13847  
13848        break;
13849    } // finalize string values (regular strings and functions interpolated into css calls)
13850  
13851  
13852    if (registered == null) {
13853      return interpolation;
13854    }
13855  
13856    var cached = registered[interpolation];
13857    return cached !== undefined ? cached : interpolation;
13858  }
13859  
13860  function createStringFromObject(mergedProps, registered, obj) {
13861    var string = '';
13862  
13863    if (Array.isArray(obj)) {
13864      for (var i = 0; i < obj.length; i++) {
13865        string += handleInterpolation(mergedProps, registered, obj[i]) + ";";
13866      }
13867    } else {
13868      for (var _key in obj) {
13869        var value = obj[_key];
13870  
13871        if (typeof value !== 'object') {
13872          if (registered != null && registered[value] !== undefined) {
13873            string += _key + "{" + registered[value] + "}";
13874          } else if (isProcessableValue(value)) {
13875            string += processStyleName(_key) + ":" + processStyleValue(_key, value) + ";";
13876          }
13877        } else {
13878          if (_key === 'NO_COMPONENT_SELECTOR' && "production" !== 'production') {}
13879  
13880          if (Array.isArray(value) && typeof value[0] === 'string' && (registered == null || registered[value[0]] === undefined)) {
13881            for (var _i = 0; _i < value.length; _i++) {
13882              if (isProcessableValue(value[_i])) {
13883                string += processStyleName(_key) + ":" + processStyleValue(_key, value[_i]) + ";";
13884              }
13885            }
13886          } else {
13887            var interpolated = handleInterpolation(mergedProps, registered, value);
13888  
13889            switch (_key) {
13890              case 'animation':
13891              case 'animationName':
13892                {
13893                  string += processStyleName(_key) + ":" + interpolated + ";";
13894                  break;
13895                }
13896  
13897              default:
13898                {
13899                  if (false) {}
13900  
13901                  string += _key + "{" + interpolated + "}";
13902                }
13903            }
13904          }
13905        }
13906      }
13907    }
13908  
13909    return string;
13910  }
13911  
13912  var labelPattern = /label:\s*([^\s;\n{]+)\s*(;|$)/g;
13913  var sourceMapPattern;
13914  
13915  if (false) {} // this is the cursor for keyframes
13916  // keyframes are stored on the SerializedStyles object as a linked list
13917  
13918  
13919  var cursor;
13920  var emotion_serialize_browser_esm_serializeStyles = function serializeStyles(args, registered, mergedProps) {
13921    if (args.length === 1 && typeof args[0] === 'object' && args[0] !== null && args[0].styles !== undefined) {
13922      return args[0];
13923    }
13924  
13925    var stringMode = true;
13926    var styles = '';
13927    cursor = undefined;
13928    var strings = args[0];
13929  
13930    if (strings == null || strings.raw === undefined) {
13931      stringMode = false;
13932      styles += handleInterpolation(mergedProps, registered, strings);
13933    } else {
13934      if (false) {}
13935  
13936      styles += strings[0];
13937    } // we start at 1 since we've already handled the first arg
13938  
13939  
13940    for (var i = 1; i < args.length; i++) {
13941      styles += handleInterpolation(mergedProps, registered, args[i]);
13942  
13943      if (stringMode) {
13944        if (false) {}
13945  
13946        styles += strings[i];
13947      }
13948    }
13949  
13950    var sourceMap;
13951  
13952    if (false) {} // using a global regex with .exec is stateful so lastIndex has to be reset each time
13953  
13954  
13955    labelPattern.lastIndex = 0;
13956    var identifierName = '';
13957    var match; // https://esbench.com/bench/5b809c2cf2949800a0f61fb5
13958  
13959    while ((match = labelPattern.exec(styles)) !== null) {
13960      identifierName += '-' + // $FlowFixMe we know it's not null
13961      match[1];
13962    }
13963  
13964    var name = emotion_hash_esm(styles) + identifierName;
13965  
13966    if (false) {}
13967  
13968    return {
13969      name: name,
13970      styles: styles,
13971      next: cursor
13972    };
13973  };
13974  
13975  
13976  
13977  ;// CONCATENATED MODULE: ./node_modules/@emotion/use-insertion-effect-with-fallbacks/dist/emotion-use-insertion-effect-with-fallbacks.browser.esm.js
13978  
13979  
13980  
13981  var syncFallback = function syncFallback(create) {
13982    return create();
13983  };
13984  
13985  var useInsertionEffect = external_React_['useInsertion' + 'Effect'] ? external_React_['useInsertion' + 'Effect'] : false;
13986  var emotion_use_insertion_effect_with_fallbacks_browser_esm_useInsertionEffectAlwaysWithSyncFallback =  useInsertionEffect || syncFallback;
13987  var emotion_use_insertion_effect_with_fallbacks_browser_esm_useInsertionEffectWithLayoutFallback = (/* unused pure expression or super */ null && (useInsertionEffect || useLayoutEffect));
13988  
13989  
13990  
13991  ;// CONCATENATED MODULE: ./node_modules/@emotion/react/dist/emotion-element-6a883da9.browser.esm.js
13992  
13993  
13994  
13995  
13996  
13997  
13998  
13999  
14000  
14001  var emotion_element_6a883da9_browser_esm_hasOwnProperty = {}.hasOwnProperty;
14002  
14003  var EmotionCacheContext = /* #__PURE__ */(0,external_React_.createContext)( // we're doing this to avoid preconstruct's dead code elimination in this one case
14004  // because this module is primarily intended for the browser and node
14005  // but it's also required in react native and similar environments sometimes
14006  // and we could have a special build just for that
14007  // but this is much easier and the native packages
14008  // might use a different theme context in the future anyway
14009  typeof HTMLElement !== 'undefined' ? /* #__PURE__ */emotion_cache_browser_esm({
14010    key: 'css'
14011  }) : null);
14012  
14013  if (false) {}
14014  
14015  var CacheProvider = EmotionCacheContext.Provider;
14016  var __unsafe_useEmotionCache = function useEmotionCache() {
14017    return (0,external_React_.useContext)(EmotionCacheContext);
14018  };
14019  
14020  var emotion_element_6a883da9_browser_esm_withEmotionCache = function withEmotionCache(func) {
14021    // $FlowFixMe
14022    return /*#__PURE__*/(0,external_React_.forwardRef)(function (props, ref) {
14023      // the cache will never be null in the browser
14024      var cache = (0,external_React_.useContext)(EmotionCacheContext);
14025      return func(props, cache, ref);
14026    });
14027  };
14028  
14029  var emotion_element_6a883da9_browser_esm_ThemeContext = /* #__PURE__ */(0,external_React_.createContext)({});
14030  
14031  if (false) {}
14032  
14033  var useTheme = function useTheme() {
14034    return useContext(emotion_element_6a883da9_browser_esm_ThemeContext);
14035  };
14036  
14037  var getTheme = function getTheme(outerTheme, theme) {
14038    if (typeof theme === 'function') {
14039      var mergedTheme = theme(outerTheme);
14040  
14041      if (false) {}
14042  
14043      return mergedTheme;
14044    }
14045  
14046    if (false) {}
14047  
14048    return _extends({}, outerTheme, theme);
14049  };
14050  
14051  var createCacheWithTheme = /* #__PURE__ */(/* unused pure expression or super */ null && (weakMemoize(function (outerTheme) {
14052    return weakMemoize(function (theme) {
14053      return getTheme(outerTheme, theme);
14054    });
14055  })));
14056  var ThemeProvider = function ThemeProvider(props) {
14057    var theme = useContext(emotion_element_6a883da9_browser_esm_ThemeContext);
14058  
14059    if (props.theme !== theme) {
14060      theme = createCacheWithTheme(theme)(props.theme);
14061    }
14062  
14063    return /*#__PURE__*/createElement(emotion_element_6a883da9_browser_esm_ThemeContext.Provider, {
14064      value: theme
14065    }, props.children);
14066  };
14067  function withTheme(Component) {
14068    var componentName = Component.displayName || Component.name || 'Component';
14069  
14070    var render = function render(props, ref) {
14071      var theme = useContext(emotion_element_6a883da9_browser_esm_ThemeContext);
14072      return /*#__PURE__*/createElement(Component, _extends({
14073        theme: theme,
14074        ref: ref
14075      }, props));
14076    }; // $FlowFixMe
14077  
14078  
14079    var WithTheme = /*#__PURE__*/forwardRef(render);
14080    WithTheme.displayName = "WithTheme(" + componentName + ")";
14081    return hoistNonReactStatics(WithTheme, Component);
14082  }
14083  
14084  var getLastPart = function getLastPart(functionName) {
14085    // The match may be something like 'Object.createEmotionProps' or
14086    // 'Loader.prototype.render'
14087    var parts = functionName.split('.');
14088    return parts[parts.length - 1];
14089  };
14090  
14091  var getFunctionNameFromStackTraceLine = function getFunctionNameFromStackTraceLine(line) {
14092    // V8
14093    var match = /^\s+at\s+([A-Za-z0-9$.]+)\s/.exec(line);
14094    if (match) return getLastPart(match[1]); // Safari / Firefox
14095  
14096    match = /^([A-Za-z0-9$.]+)@/.exec(line);
14097    if (match) return getLastPart(match[1]);
14098    return undefined;
14099  };
14100  
14101  var internalReactFunctionNames = /* #__PURE__ */new Set(['renderWithHooks', 'processChild', 'finishClassComponent', 'renderToString']); // These identifiers come from error stacks, so they have to be valid JS
14102  // identifiers, thus we only need to replace what is a valid character for JS,
14103  // but not for CSS.
14104  
14105  var sanitizeIdentifier = function sanitizeIdentifier(identifier) {
14106    return identifier.replace(/\$/g, '-');
14107  };
14108  
14109  var getLabelFromStackTrace = function getLabelFromStackTrace(stackTrace) {
14110    if (!stackTrace) return undefined;
14111    var lines = stackTrace.split('\n');
14112  
14113    for (var i = 0; i < lines.length; i++) {
14114      var functionName = getFunctionNameFromStackTraceLine(lines[i]); // The first line of V8 stack traces is just "Error"
14115  
14116      if (!functionName) continue; // If we reach one of these, we have gone too far and should quit
14117  
14118      if (internalReactFunctionNames.has(functionName)) break; // The component name is the first function in the stack that starts with an
14119      // uppercase letter
14120  
14121      if (/^[A-Z]/.test(functionName)) return sanitizeIdentifier(functionName);
14122    }
14123  
14124    return undefined;
14125  };
14126  
14127  var typePropName = '__EMOTION_TYPE_PLEASE_DO_NOT_USE__';
14128  var labelPropName = '__EMOTION_LABEL_PLEASE_DO_NOT_USE__';
14129  var emotion_element_6a883da9_browser_esm_createEmotionProps = function createEmotionProps(type, props) {
14130    if (false) {}
14131  
14132    var newProps = {};
14133  
14134    for (var key in props) {
14135      if (emotion_element_6a883da9_browser_esm_hasOwnProperty.call(props, key)) {
14136        newProps[key] = props[key];
14137      }
14138    }
14139  
14140    newProps[typePropName] = type; // For performance, only call getLabelFromStackTrace in development and when
14141    // the label hasn't already been computed
14142  
14143    if (false) { var label; }
14144  
14145    return newProps;
14146  };
14147  
14148  var Insertion = function Insertion(_ref) {
14149    var cache = _ref.cache,
14150        serialized = _ref.serialized,
14151        isStringTag = _ref.isStringTag;
14152    registerStyles(cache, serialized, isStringTag);
14153    var rules = useInsertionEffectAlwaysWithSyncFallback(function () {
14154      return insertStyles(cache, serialized, isStringTag);
14155    });
14156  
14157    return null;
14158  };
14159  
14160  var emotion_element_6a883da9_browser_esm_Emotion = /* #__PURE__ */(/* unused pure expression or super */ null && (emotion_element_6a883da9_browser_esm_withEmotionCache(function (props, cache, ref) {
14161    var cssProp = props.css; // so that using `css` from `emotion` and passing the result to the css prop works
14162    // not passing the registered cache to serializeStyles because it would
14163    // make certain babel optimisations not possible
14164  
14165    if (typeof cssProp === 'string' && cache.registered[cssProp] !== undefined) {
14166      cssProp = cache.registered[cssProp];
14167    }
14168  
14169    var WrappedComponent = props[typePropName];
14170    var registeredStyles = [cssProp];
14171    var className = '';
14172  
14173    if (typeof props.className === 'string') {
14174      className = getRegisteredStyles(cache.registered, registeredStyles, props.className);
14175    } else if (props.className != null) {
14176      className = props.className + " ";
14177    }
14178  
14179    var serialized = serializeStyles(registeredStyles, undefined, useContext(emotion_element_6a883da9_browser_esm_ThemeContext));
14180  
14181    if (false) { var labelFromStack; }
14182  
14183    className += cache.key + "-" + serialized.name;
14184    var newProps = {};
14185  
14186    for (var key in props) {
14187      if (emotion_element_6a883da9_browser_esm_hasOwnProperty.call(props, key) && key !== 'css' && key !== typePropName && ( true || 0)) {
14188        newProps[key] = props[key];
14189      }
14190    }
14191  
14192    newProps.ref = ref;
14193    newProps.className = className;
14194    return /*#__PURE__*/createElement(Fragment, null, /*#__PURE__*/createElement(Insertion, {
14195      cache: cache,
14196      serialized: serialized,
14197      isStringTag: typeof WrappedComponent === 'string'
14198    }), /*#__PURE__*/createElement(WrappedComponent, newProps));
14199  })));
14200  
14201  if (false) {}
14202  
14203  
14204  
14205  ;// CONCATENATED MODULE: ./node_modules/@emotion/utils/dist/emotion-utils.browser.esm.js
14206  var isBrowser = "object" !== 'undefined';
14207  function emotion_utils_browser_esm_getRegisteredStyles(registered, registeredStyles, classNames) {
14208    var rawClassName = '';
14209    classNames.split(' ').forEach(function (className) {
14210      if (registered[className] !== undefined) {
14211        registeredStyles.push(registered[className] + ";");
14212      } else {
14213        rawClassName += className + " ";
14214      }
14215    });
14216    return rawClassName;
14217  }
14218  var emotion_utils_browser_esm_registerStyles = function registerStyles(cache, serialized, isStringTag) {
14219    var className = cache.key + "-" + serialized.name;
14220  
14221    if ( // we only need to add the styles to the registered cache if the
14222    // class name could be used further down
14223    // the tree but if it's a string tag, we know it won't
14224    // so we don't have to add it to registered cache.
14225    // this improves memory usage since we can avoid storing the whole style string
14226    (isStringTag === false || // we need to always store it if we're in compat mode and
14227    // in node since emotion-server relies on whether a style is in
14228    // the registered cache to know whether a style is global or not
14229    // also, note that this check will be dead code eliminated in the browser
14230    isBrowser === false ) && cache.registered[className] === undefined) {
14231      cache.registered[className] = serialized.styles;
14232    }
14233  };
14234  var emotion_utils_browser_esm_insertStyles = function insertStyles(cache, serialized, isStringTag) {
14235    emotion_utils_browser_esm_registerStyles(cache, serialized, isStringTag);
14236    var className = cache.key + "-" + serialized.name;
14237  
14238    if (cache.inserted[serialized.name] === undefined) {
14239      var current = serialized;
14240  
14241      do {
14242        var maybeStyles = cache.insert(serialized === current ? "." + className : '', current, cache.sheet, true);
14243  
14244        current = current.next;
14245      } while (current !== undefined);
14246    }
14247  };
14248  
14249  
14250  
14251  ;// CONCATENATED MODULE: ./node_modules/@emotion/css/create-instance/dist/emotion-css-create-instance.esm.js
14252  
14253  
14254  
14255  
14256  function insertWithoutScoping(cache, serialized) {
14257    if (cache.inserted[serialized.name] === undefined) {
14258      return cache.insert('', serialized, cache.sheet, true);
14259    }
14260  }
14261  
14262  function merge(registered, css, className) {
14263    var registeredStyles = [];
14264    var rawClassName = emotion_utils_browser_esm_getRegisteredStyles(registered, registeredStyles, className);
14265  
14266    if (registeredStyles.length < 2) {
14267      return className;
14268    }
14269  
14270    return rawClassName + css(registeredStyles);
14271  }
14272  
14273  var createEmotion = function createEmotion(options) {
14274    var cache = emotion_cache_browser_esm(options); // $FlowFixMe
14275  
14276    cache.sheet.speedy = function (value) {
14277      if (false) {}
14278  
14279      this.isSpeedy = value;
14280    };
14281  
14282    cache.compat = true;
14283  
14284    var css = function css() {
14285      for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
14286        args[_key] = arguments[_key];
14287      }
14288  
14289      var serialized = emotion_serialize_browser_esm_serializeStyles(args, cache.registered, undefined);
14290      emotion_utils_browser_esm_insertStyles(cache, serialized, false);
14291      return cache.key + "-" + serialized.name;
14292    };
14293  
14294    var keyframes = function keyframes() {
14295      for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
14296        args[_key2] = arguments[_key2];
14297      }
14298  
14299      var serialized = emotion_serialize_browser_esm_serializeStyles(args, cache.registered);
14300      var animation = "animation-" + serialized.name;
14301      insertWithoutScoping(cache, {
14302        name: serialized.name,
14303        styles: "@keyframes " + animation + "{" + serialized.styles + "}"
14304      });
14305      return animation;
14306    };
14307  
14308    var injectGlobal = function injectGlobal() {
14309      for (var _len3 = arguments.length, args = new Array(_len3), _key3 = 0; _key3 < _len3; _key3++) {
14310        args[_key3] = arguments[_key3];
14311      }
14312  
14313      var serialized = emotion_serialize_browser_esm_serializeStyles(args, cache.registered);
14314      insertWithoutScoping(cache, serialized);
14315    };
14316  
14317    var cx = function cx() {
14318      for (var _len4 = arguments.length, args = new Array(_len4), _key4 = 0; _key4 < _len4; _key4++) {
14319        args[_key4] = arguments[_key4];
14320      }
14321  
14322      return merge(cache.registered, css, classnames(args));
14323    };
14324  
14325    return {
14326      css: css,
14327      cx: cx,
14328      injectGlobal: injectGlobal,
14329      keyframes: keyframes,
14330      hydrate: function hydrate(ids) {
14331        ids.forEach(function (key) {
14332          cache.inserted[key] = true;
14333        });
14334      },
14335      flush: function flush() {
14336        cache.registered = {};
14337        cache.inserted = {};
14338        cache.sheet.flush();
14339      },
14340      // $FlowFixMe
14341      sheet: cache.sheet,
14342      cache: cache,
14343      getRegisteredStyles: emotion_utils_browser_esm_getRegisteredStyles.bind(null, cache.registered),
14344      merge: merge.bind(null, cache.registered, css)
14345    };
14346  };
14347  
14348  var classnames = function classnames(args) {
14349    var cls = '';
14350  
14351    for (var i = 0; i < args.length; i++) {
14352      var arg = args[i];
14353      if (arg == null) continue;
14354      var toAdd = void 0;
14355  
14356      switch (typeof arg) {
14357        case 'boolean':
14358          break;
14359  
14360        case 'object':
14361          {
14362            if (Array.isArray(arg)) {
14363              toAdd = classnames(arg);
14364            } else {
14365              toAdd = '';
14366  
14367              for (var k in arg) {
14368                if (arg[k] && k) {
14369                  toAdd && (toAdd += ' ');
14370                  toAdd += k;
14371                }
14372              }
14373            }
14374  
14375            break;
14376          }
14377  
14378        default:
14379          {
14380            toAdd = arg;
14381          }
14382      }
14383  
14384      if (toAdd) {
14385        cls && (cls += ' ');
14386        cls += toAdd;
14387      }
14388    }
14389  
14390    return cls;
14391  };
14392  
14393  /* harmony default export */ const emotion_css_create_instance_esm = (createEmotion);
14394  
14395  ;// CONCATENATED MODULE: ./node_modules/@emotion/css/dist/emotion-css.esm.js
14396  
14397  
14398  
14399  
14400  
14401  var _createEmotion = emotion_css_create_instance_esm({
14402    key: 'css'
14403  }),
14404      flush = _createEmotion.flush,
14405      hydrate = _createEmotion.hydrate,
14406      emotion_css_esm_cx = _createEmotion.cx,
14407      emotion_css_esm_merge = _createEmotion.merge,
14408      emotion_css_esm_getRegisteredStyles = _createEmotion.getRegisteredStyles,
14409      injectGlobal = _createEmotion.injectGlobal,
14410      keyframes = _createEmotion.keyframes,
14411      css = _createEmotion.css,
14412      sheet = _createEmotion.sheet,
14413      cache = _createEmotion.cache;
14414  
14415  
14416  
14417  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/utils/hooks/use-cx.js
14418  /**
14419   * External dependencies
14420   */
14421  
14422  
14423  // eslint-disable-next-line no-restricted-imports
14424  
14425  // eslint-disable-next-line no-restricted-imports
14426  
14427  
14428  /**
14429   * WordPress dependencies
14430   */
14431  
14432  const isSerializedStyles = o => typeof o !== 'undefined' && o !== null && ['name', 'styles'].every(p => typeof o[p] !== 'undefined');
14433  
14434  /**
14435   * Retrieve a `cx` function that knows how to handle `SerializedStyles`
14436   * returned by the `@emotion/react` `css` function in addition to what
14437   * `cx` normally knows how to handle. It also hooks into the Emotion
14438   * Cache, allowing `css` calls to work inside iframes.
14439   *
14440   * ```jsx
14441   * import { css } from '@emotion/react';
14442   *
14443   * const styles = css`
14444   *     color: red
14445   * `;
14446   *
14447   * function RedText( { className, ...props } ) {
14448   *     const cx = useCx();
14449   *
14450   *     const classes = cx(styles, className);
14451   *
14452   *     return <span className={classes} {...props} />;
14453   * }
14454   * ```
14455   */
14456  const useCx = () => {
14457    const cache = __unsafe_useEmotionCache();
14458    const cx = (0,external_wp_element_namespaceObject.useCallback)((...classNames) => {
14459      if (cache === null) {
14460        throw new Error('The `useCx` hook should be only used within a valid Emotion Cache Context');
14461      }
14462      return emotion_css_esm_cx(...classNames.map(arg => {
14463        if (isSerializedStyles(arg)) {
14464          emotion_utils_browser_esm_insertStyles(cache, arg, false);
14465          return `$cache.key}-$arg.name}`;
14466        }
14467        return arg;
14468      }));
14469    }, [cache]);
14470    return cx;
14471  };
14472  
14473  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/context/use-context-system.js
14474  /**
14475   * WordPress dependencies
14476   */
14477  
14478  
14479  /**
14480   * Internal dependencies
14481   */
14482  
14483  
14484  
14485  
14486  
14487  /**
14488   * @template TProps
14489   * @typedef {TProps & { className: string }} ConnectedProps
14490   */
14491  
14492  /**
14493   * Custom hook that derives registered props from the Context system.
14494   * These derived props are then consolidated with incoming component props.
14495   *
14496   * @template {{ className?: string }} P
14497   * @param {P}      props     Incoming props from the component.
14498   * @param {string} namespace The namespace to register and to derive context props from.
14499   * @return {ConnectedProps<P>} The connected props.
14500   */
14501  function useContextSystem(props, namespace) {
14502    const contextSystemProps = useComponentsContext();
14503    if (typeof namespace === 'undefined') {
14504       true ? external_wp_warning_default()('useContextSystem: Please provide a namespace') : 0;
14505    }
14506    const contextProps = contextSystemProps?.[namespace] || {};
14507  
14508    /* eslint-disable jsdoc/no-undefined-types */
14509    /** @type {ConnectedProps<P>} */
14510    // @ts-ignore We fill in the missing properties below
14511    const finalComponentProps = {
14512      ...getConnectedNamespace(),
14513      ...getNamespace(namespace)
14514    };
14515    /* eslint-enable jsdoc/no-undefined-types */
14516  
14517    const {
14518      _overrides: overrideProps,
14519      ...otherContextProps
14520    } = contextProps;
14521    const initialMergedProps = Object.entries(otherContextProps).length ? Object.assign({}, otherContextProps, props) : props;
14522    const cx = useCx();
14523    const classes = cx(getStyledClassNameFromKey(namespace), props.className);
14524  
14525    // Provides the ability to customize the render of the component.
14526    const rendered = typeof initialMergedProps.renderChildren === 'function' ? initialMergedProps.renderChildren(initialMergedProps) : initialMergedProps.children;
14527    for (const key in initialMergedProps) {
14528      // @ts-ignore filling in missing props
14529      finalComponentProps[key] = initialMergedProps[key];
14530    }
14531    for (const key in overrideProps) {
14532      // @ts-ignore filling in missing props
14533      finalComponentProps[key] = overrideProps[key];
14534    }
14535  
14536    // Setting an `undefined` explicitly can cause unintended overwrites
14537    // when a `cloneElement()` is involved.
14538    if (rendered !== undefined) {
14539      // @ts-ignore
14540      finalComponentProps.children = rendered;
14541    }
14542    finalComponentProps.className = classes;
14543    return finalComponentProps;
14544  }
14545  
14546  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/context/context-connect.js
14547  /**
14548   * External dependencies
14549   */
14550  
14551  /**
14552   * WordPress dependencies
14553   */
14554  
14555  
14556  
14557  /**
14558   * Internal dependencies
14559   */
14560  
14561  
14562  /**
14563   * Forwards ref (React.ForwardRef) and "Connects" (or registers) a component
14564   * within the Context system under a specified namespace.
14565   *
14566   * @param Component The component to register into the Context system.
14567   * @param namespace The namespace to register the component under.
14568   * @return The connected WordPressComponent
14569   */
14570  function contextConnect(Component, namespace) {
14571    return _contextConnect(Component, namespace, {
14572      forwardsRef: true
14573    });
14574  }
14575  
14576  /**
14577   * "Connects" (or registers) a component within the Context system under a specified namespace.
14578   * Does not forward a ref.
14579   *
14580   * @param Component The component to register into the Context system.
14581   * @param namespace The namespace to register the component under.
14582   * @return The connected WordPressComponent
14583   */
14584  function contextConnectWithoutRef(Component, namespace) {
14585    return _contextConnect(Component, namespace);
14586  }
14587  
14588  // This is an (experimental) evolution of the initial connect() HOC.
14589  // The hope is that we can improve render performance by removing functional
14590  // component wrappers.
14591  function _contextConnect(Component, namespace, options) {
14592    const WrappedComponent = options?.forwardsRef ? (0,external_wp_element_namespaceObject.forwardRef)(Component) : Component;
14593    if (typeof namespace === 'undefined') {
14594       true ? external_wp_warning_default()('contextConnect: Please provide a namespace') : 0;
14595    }
14596  
14597    // @ts-expect-error internal property
14598    let mergedNamespace = WrappedComponent[CONNECT_STATIC_NAMESPACE] || [namespace];
14599  
14600    /**
14601     * Consolidate (merge) namespaces before attaching it to the WrappedComponent.
14602     */
14603    if (Array.isArray(namespace)) {
14604      mergedNamespace = [...mergedNamespace, ...namespace];
14605    }
14606    if (typeof namespace === 'string') {
14607      mergedNamespace = [...mergedNamespace, namespace];
14608    }
14609  
14610    // @ts-expect-error We can't rely on inferred types here because of the
14611    // `as` prop polymorphism we're handling in https://github.com/WordPress/gutenberg/blob/4f3a11243c365f94892e479bff0b922ccc4ccda3/packages/components/src/context/wordpress-component.ts#L32-L33
14612    return Object.assign(WrappedComponent, {
14613      [CONNECT_STATIC_NAMESPACE]: [...new Set(mergedNamespace)],
14614      displayName: namespace,
14615      selector: `.$getStyledClassNameFromKey(namespace)}`
14616    });
14617  }
14618  
14619  /**
14620   * Attempts to retrieve the connected namespace from a component.
14621   *
14622   * @param Component The component to retrieve a namespace from.
14623   * @return The connected namespaces.
14624   */
14625  function getConnectNamespace(Component) {
14626    if (!Component) {
14627      return [];
14628    }
14629    let namespaces = [];
14630  
14631    // @ts-ignore internal property
14632    if (Component[CONNECT_STATIC_NAMESPACE]) {
14633      // @ts-ignore internal property
14634      namespaces = Component[CONNECT_STATIC_NAMESPACE];
14635    }
14636  
14637    // @ts-ignore
14638    if (Component.type && Component.type[CONNECT_STATIC_NAMESPACE]) {
14639      // @ts-ignore
14640      namespaces = Component.type[CONNECT_STATIC_NAMESPACE];
14641    }
14642    return namespaces;
14643  }
14644  
14645  /**
14646   * Checks to see if a component is connected within the Context system.
14647   *
14648   * @param Component The component to retrieve a namespace from.
14649   * @param match     The namespace to check.
14650   */
14651  function hasConnectNamespace(Component, match) {
14652    if (!Component) {
14653      return false;
14654    }
14655    if (typeof match === 'string') {
14656      return getConnectNamespace(Component).includes(match);
14657    }
14658    if (Array.isArray(match)) {
14659      return match.some(result => getConnectNamespace(Component).includes(result));
14660    }
14661    return false;
14662  }
14663  
14664  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/visually-hidden/styles.js
14665  /**
14666   * External dependencies
14667   */
14668  
14669  const visuallyHidden = {
14670    border: 0,
14671    clip: 'rect(1px, 1px, 1px, 1px)',
14672    WebkitClipPath: 'inset( 50% )',
14673    clipPath: 'inset( 50% )',
14674    height: '1px',
14675    margin: '-1px',
14676    overflow: 'hidden',
14677    padding: 0,
14678    position: 'absolute',
14679    width: '1px',
14680    wordWrap: 'normal'
14681  };
14682  
14683  ;// CONCATENATED MODULE: ./node_modules/@babel/runtime/helpers/esm/extends.js
14684  function extends_extends() {
14685    extends_extends = Object.assign ? Object.assign.bind() : function (target) {
14686      for (var i = 1; i < arguments.length; i++) {
14687        var source = arguments[i];
14688        for (var key in source) {
14689          if (Object.prototype.hasOwnProperty.call(source, key)) {
14690            target[key] = source[key];
14691          }
14692        }
14693      }
14694      return target;
14695    };
14696    return extends_extends.apply(this, arguments);
14697  }
14698  ;// CONCATENATED MODULE: ./node_modules/@emotion/styled/node_modules/@emotion/is-prop-valid/dist/emotion-is-prop-valid.esm.js
14699  
14700  
14701  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
14702  
14703  var isPropValid = /* #__PURE__ */memoize(function (prop) {
14704    return reactPropsRegex.test(prop) || prop.charCodeAt(0) === 111
14705    /* o */
14706    && prop.charCodeAt(1) === 110
14707    /* n */
14708    && prop.charCodeAt(2) < 91;
14709  }
14710  /* Z+1 */
14711  );
14712  
14713  
14714  
14715  ;// CONCATENATED MODULE: ./node_modules/@emotion/styled/base/dist/emotion-styled-base.browser.esm.js
14716  
14717  
14718  
14719  
14720  
14721  
14722  
14723  
14724  var testOmitPropsOnStringTag = isPropValid;
14725  
14726  var testOmitPropsOnComponent = function testOmitPropsOnComponent(key) {
14727    return key !== 'theme';
14728  };
14729  
14730  var getDefaultShouldForwardProp = function getDefaultShouldForwardProp(tag) {
14731    return typeof tag === 'string' && // 96 is one less than the char code
14732    // for "a" so this is checking that
14733    // it's a lowercase character
14734    tag.charCodeAt(0) > 96 ? testOmitPropsOnStringTag : testOmitPropsOnComponent;
14735  };
14736  var composeShouldForwardProps = function composeShouldForwardProps(tag, options, isReal) {
14737    var shouldForwardProp;
14738  
14739    if (options) {
14740      var optionsShouldForwardProp = options.shouldForwardProp;
14741      shouldForwardProp = tag.__emotion_forwardProp && optionsShouldForwardProp ? function (propName) {
14742        return tag.__emotion_forwardProp(propName) && optionsShouldForwardProp(propName);
14743      } : optionsShouldForwardProp;
14744    }
14745  
14746    if (typeof shouldForwardProp !== 'function' && isReal) {
14747      shouldForwardProp = tag.__emotion_forwardProp;
14748    }
14749  
14750    return shouldForwardProp;
14751  };
14752  
14753  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";
14754  
14755  var emotion_styled_base_browser_esm_Insertion = function Insertion(_ref) {
14756    var cache = _ref.cache,
14757        serialized = _ref.serialized,
14758        isStringTag = _ref.isStringTag;
14759    emotion_utils_browser_esm_registerStyles(cache, serialized, isStringTag);
14760    var rules = emotion_use_insertion_effect_with_fallbacks_browser_esm_useInsertionEffectAlwaysWithSyncFallback(function () {
14761      return emotion_utils_browser_esm_insertStyles(cache, serialized, isStringTag);
14762    });
14763  
14764    return null;
14765  };
14766  
14767  var createStyled = function createStyled(tag, options) {
14768    if (false) {}
14769  
14770    var isReal = tag.__emotion_real === tag;
14771    var baseTag = isReal && tag.__emotion_base || tag;
14772    var identifierName;
14773    var targetClassName;
14774  
14775    if (options !== undefined) {
14776      identifierName = options.label;
14777      targetClassName = options.target;
14778    }
14779  
14780    var shouldForwardProp = composeShouldForwardProps(tag, options, isReal);
14781    var defaultShouldForwardProp = shouldForwardProp || getDefaultShouldForwardProp(baseTag);
14782    var shouldUseAs = !defaultShouldForwardProp('as');
14783    return function () {
14784      var args = arguments;
14785      var styles = isReal && tag.__emotion_styles !== undefined ? tag.__emotion_styles.slice(0) : [];
14786  
14787      if (identifierName !== undefined) {
14788        styles.push("label:" + identifierName + ";");
14789      }
14790  
14791      if (args[0] == null || args[0].raw === undefined) {
14792        styles.push.apply(styles, args);
14793      } else {
14794        if (false) {}
14795  
14796        styles.push(args[0][0]);
14797        var len = args.length;
14798        var i = 1;
14799  
14800        for (; i < len; i++) {
14801          if (false) {}
14802  
14803          styles.push(args[i], args[0][i]);
14804        }
14805      } // $FlowFixMe: we need to cast StatelessFunctionalComponent to our PrivateStyledComponent class
14806  
14807  
14808      var Styled = emotion_element_6a883da9_browser_esm_withEmotionCache(function (props, cache, ref) {
14809        var FinalTag = shouldUseAs && props.as || baseTag;
14810        var className = '';
14811        var classInterpolations = [];
14812        var mergedProps = props;
14813  
14814        if (props.theme == null) {
14815          mergedProps = {};
14816  
14817          for (var key in props) {
14818            mergedProps[key] = props[key];
14819          }
14820  
14821          mergedProps.theme = (0,external_React_.useContext)(emotion_element_6a883da9_browser_esm_ThemeContext);
14822        }
14823  
14824        if (typeof props.className === 'string') {
14825          className = emotion_utils_browser_esm_getRegisteredStyles(cache.registered, classInterpolations, props.className);
14826        } else if (props.className != null) {
14827          className = props.className + " ";
14828        }
14829  
14830        var serialized = emotion_serialize_browser_esm_serializeStyles(styles.concat(classInterpolations), cache.registered, mergedProps);
14831        className += cache.key + "-" + serialized.name;
14832  
14833        if (targetClassName !== undefined) {
14834          className += " " + targetClassName;
14835        }
14836  
14837        var finalShouldForwardProp = shouldUseAs && shouldForwardProp === undefined ? getDefaultShouldForwardProp(FinalTag) : defaultShouldForwardProp;
14838        var newProps = {};
14839  
14840        for (var _key in props) {
14841          if (shouldUseAs && _key === 'as') continue;
14842  
14843          if ( // $FlowFixMe
14844          finalShouldForwardProp(_key)) {
14845            newProps[_key] = props[_key];
14846          }
14847        }
14848  
14849        newProps.className = className;
14850        newProps.ref = ref;
14851        return /*#__PURE__*/(0,external_React_.createElement)(external_React_.Fragment, null, /*#__PURE__*/(0,external_React_.createElement)(emotion_styled_base_browser_esm_Insertion, {
14852          cache: cache,
14853          serialized: serialized,
14854          isStringTag: typeof FinalTag === 'string'
14855        }), /*#__PURE__*/(0,external_React_.createElement)(FinalTag, newProps));
14856      });
14857      Styled.displayName = identifierName !== undefined ? identifierName : "Styled(" + (typeof baseTag === 'string' ? baseTag : baseTag.displayName || baseTag.name || 'Component') + ")";
14858      Styled.defaultProps = tag.defaultProps;
14859      Styled.__emotion_real = Styled;
14860      Styled.__emotion_base = baseTag;
14861      Styled.__emotion_styles = styles;
14862      Styled.__emotion_forwardProp = shouldForwardProp;
14863      Object.defineProperty(Styled, 'toString', {
14864        value: function value() {
14865          if (targetClassName === undefined && "production" !== 'production') {} // $FlowFixMe: coerce undefined to string
14866  
14867  
14868          return "." + targetClassName;
14869        }
14870      });
14871  
14872      Styled.withComponent = function (nextTag, nextOptions) {
14873        return createStyled(nextTag, extends_extends({}, options, nextOptions, {
14874          shouldForwardProp: composeShouldForwardProps(Styled, nextOptions, true)
14875        })).apply(void 0, styles);
14876      };
14877  
14878      return Styled;
14879    };
14880  };
14881  
14882  /* harmony default export */ const emotion_styled_base_browser_esm = (createStyled);
14883  
14884  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/view/component.js
14885  
14886  /**
14887   * External dependencies
14888   */
14889  
14890  /**
14891   * WordPress dependencies
14892   */
14893  
14894  
14895  /**
14896   * Internal dependencies
14897   */
14898  
14899  const PolymorphicDiv = /*#__PURE__*/emotion_styled_base_browser_esm("div",  true ? {
14900    target: "e19lxcc00"
14901  } : 0)( true ? "" : 0);
14902  function UnforwardedView({
14903    as,
14904    ...restProps
14905  }, ref) {
14906    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(PolymorphicDiv, {
14907      as: as,
14908      ref: ref,
14909      ...restProps
14910    });
14911  }
14912  
14913  /**
14914   * `View` is a core component that renders everything in the library.
14915   * It is the principle component in the entire library.
14916   *
14917   * ```jsx
14918   * import { View } from `@wordpress/components`;
14919   *
14920   * function Example() {
14921   *     return (
14922   *         <View>
14923   *              Code is Poetry
14924   *         </View>
14925   *     );
14926   * }
14927   * ```
14928   */
14929  const View = Object.assign((0,external_wp_element_namespaceObject.forwardRef)(UnforwardedView), {
14930    selector: '.components-view'
14931  });
14932  /* harmony default export */ const component = (View);
14933  
14934  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/visually-hidden/component.js
14935  /**
14936   * External dependencies
14937   */
14938  
14939  /**
14940   * Internal dependencies
14941   */
14942  
14943  
14944  
14945  
14946  
14947  function UnconnectedVisuallyHidden(props, forwardedRef) {
14948    const {
14949      style: styleProp,
14950      ...contextProps
14951    } = useContextSystem(props, 'VisuallyHidden');
14952    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(component, {
14953      ref: forwardedRef,
14954      ...contextProps,
14955      style: {
14956        ...visuallyHidden,
14957        ...(styleProp || {})
14958      }
14959    });
14960  }
14961  
14962  /**
14963   * `VisuallyHidden` is a component used to render text intended to be visually
14964   * hidden, but will show for alternate devices, for example a screen reader.
14965   *
14966   * ```jsx
14967   * import { VisuallyHidden } from `@wordpress/components`;
14968   *
14969   * function Example() {
14970   *   return (
14971   *     <VisuallyHidden>
14972   *       <label>Code is Poetry</label>
14973   *     </VisuallyHidden>
14974   *   );
14975   * }
14976   * ```
14977   */
14978  const component_VisuallyHidden = contextConnect(UnconnectedVisuallyHidden, 'VisuallyHidden');
14979  /* harmony default export */ const visually_hidden_component = (component_VisuallyHidden);
14980  
14981  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/alignment-matrix-control/utils.js
14982  /**
14983   * WordPress dependencies
14984   */
14985  
14986  
14987  /**
14988   * Internal dependencies
14989   */
14990  
14991  const GRID = [['top left', 'top center', 'top right'], ['center left', 'center center', 'center right'], ['bottom left', 'bottom center', 'bottom right']];
14992  
14993  // Stored as map as i18n __() only accepts strings (not variables)
14994  const ALIGNMENT_LABEL = {
14995    'top left': (0,external_wp_i18n_namespaceObject.__)('Top Left'),
14996    'top center': (0,external_wp_i18n_namespaceObject.__)('Top Center'),
14997    'top right': (0,external_wp_i18n_namespaceObject.__)('Top Right'),
14998    'center left': (0,external_wp_i18n_namespaceObject.__)('Center Left'),
14999    'center center': (0,external_wp_i18n_namespaceObject.__)('Center'),
15000    center: (0,external_wp_i18n_namespaceObject.__)('Center'),
15001    'center right': (0,external_wp_i18n_namespaceObject.__)('Center Right'),
15002    'bottom left': (0,external_wp_i18n_namespaceObject.__)('Bottom Left'),
15003    'bottom center': (0,external_wp_i18n_namespaceObject.__)('Bottom Center'),
15004    'bottom right': (0,external_wp_i18n_namespaceObject.__)('Bottom Right')
15005  };
15006  
15007  // Transforms GRID into a flat Array of values.
15008  const ALIGNMENTS = GRID.flat();
15009  
15010  /**
15011   * Normalizes and transforms an incoming value to better match the alignment values
15012   *
15013   * @param value An alignment value to parse.
15014   *
15015   * @return The parsed value.
15016   */
15017  function normalize(value) {
15018    const normalized = value === 'center' ? 'center center' : value;
15019  
15020    // Strictly speaking, this could be `string | null | undefined`,
15021    // but will be validated shortly, so we're typecasting to an
15022    // `AlignmentMatrixControlValue` to keep TypeScript happy.
15023    const transformed = normalized?.replace('-', ' ');
15024    return ALIGNMENTS.includes(transformed) ? transformed : undefined;
15025  }
15026  
15027  /**
15028   * Creates an item ID based on a prefix ID and an alignment value.
15029   *
15030   * @param prefixId An ID to prefix.
15031   * @param value    An alignment value.
15032   *
15033   * @return The item id.
15034   */
15035  function getItemId(prefixId, value) {
15036    const normalized = normalize(value);
15037    if (!normalized) {
15038      return;
15039    }
15040    const id = normalized.replace(' ', '-');
15041    return `$prefixId}-$id}`;
15042  }
15043  
15044  /**
15045   * Extracts an item value from its ID
15046   *
15047   * @param prefixId An ID prefix to remove
15048   * @param id       An item ID
15049   * @return         The item value
15050   */
15051  function getItemValue(prefixId, id) {
15052    const value = id?.replace(prefixId + '-', '');
15053    return normalize(value);
15054  }
15055  
15056  /**
15057   * Retrieves the alignment index from a value.
15058   *
15059   * @param alignment Value to check.
15060   *
15061   * @return The index of a matching alignment.
15062   */
15063  function getAlignmentIndex(alignment = 'center') {
15064    const normalized = normalize(alignment);
15065    if (!normalized) {
15066      return undefined;
15067    }
15068    const index = ALIGNMENTS.indexOf(normalized);
15069    return index > -1 ? index : undefined;
15070  }
15071  
15072  // EXTERNAL MODULE: ./node_modules/hoist-non-react-statics/dist/hoist-non-react-statics.cjs.js
15073  var hoist_non_react_statics_cjs = __webpack_require__(1880);
15074  ;// CONCATENATED MODULE: ./node_modules/@emotion/react/dist/emotion-react.browser.esm.js
15075  
15076  
15077  
15078  
15079  
15080  
15081  
15082  
15083  
15084  
15085  
15086  
15087  var pkg = {
15088      name: "@emotion/react",
15089      version: "11.10.6",
15090      main: "dist/emotion-react.cjs.js",
15091      module: "dist/emotion-react.esm.js",
15092      browser: {
15093          "./dist/emotion-react.esm.js": "./dist/emotion-react.browser.esm.js"
15094      },
15095      exports: {
15096          ".": {
15097              module: {
15098                  worker: "./dist/emotion-react.worker.esm.js",
15099                  browser: "./dist/emotion-react.browser.esm.js",
15100                  "default": "./dist/emotion-react.esm.js"
15101              },
15102              "default": "./dist/emotion-react.cjs.js"
15103          },
15104          "./jsx-runtime": {
15105              module: {
15106                  worker: "./jsx-runtime/dist/emotion-react-jsx-runtime.worker.esm.js",
15107                  browser: "./jsx-runtime/dist/emotion-react-jsx-runtime.browser.esm.js",
15108                  "default": "./jsx-runtime/dist/emotion-react-jsx-runtime.esm.js"
15109              },
15110              "default": "./jsx-runtime/dist/emotion-react-jsx-runtime.cjs.js"
15111          },
15112          "./_isolated-hnrs": {
15113              module: {
15114                  worker: "./_isolated-hnrs/dist/emotion-react-_isolated-hnrs.worker.esm.js",
15115                  browser: "./_isolated-hnrs/dist/emotion-react-_isolated-hnrs.browser.esm.js",
15116                  "default": "./_isolated-hnrs/dist/emotion-react-_isolated-hnrs.esm.js"
15117              },
15118              "default": "./_isolated-hnrs/dist/emotion-react-_isolated-hnrs.cjs.js"
15119          },
15120          "./jsx-dev-runtime": {
15121              module: {
15122                  worker: "./jsx-dev-runtime/dist/emotion-react-jsx-dev-runtime.worker.esm.js",
15123                  browser: "./jsx-dev-runtime/dist/emotion-react-jsx-dev-runtime.browser.esm.js",
15124                  "default": "./jsx-dev-runtime/dist/emotion-react-jsx-dev-runtime.esm.js"
15125              },
15126              "default": "./jsx-dev-runtime/dist/emotion-react-jsx-dev-runtime.cjs.js"
15127          },
15128          "./package.json": "./package.json",
15129          "./types/css-prop": "./types/css-prop.d.ts",
15130          "./macro": "./macro.js"
15131      },
15132      types: "types/index.d.ts",
15133      files: [
15134          "src",
15135          "dist",
15136          "jsx-runtime",
15137          "jsx-dev-runtime",
15138          "_isolated-hnrs",
15139          "types/*.d.ts",
15140          "macro.js",
15141          "macro.d.ts",
15142          "macro.js.flow"
15143      ],
15144      sideEffects: false,
15145      author: "Emotion Contributors",
15146      license: "MIT",
15147      scripts: {
15148          "test:typescript": "dtslint types"
15149      },
15150      dependencies: {
15151          "@babel/runtime": "^7.18.3",
15152          "@emotion/babel-plugin": "^11.10.6",
15153          "@emotion/cache": "^11.10.5",
15154          "@emotion/serialize": "^1.1.1",
15155          "@emotion/use-insertion-effect-with-fallbacks": "^1.0.0",
15156          "@emotion/utils": "^1.2.0",
15157          "@emotion/weak-memoize": "^0.3.0",
15158          "hoist-non-react-statics": "^3.3.1"
15159      },
15160      peerDependencies: {
15161          react: ">=16.8.0"
15162      },
15163      peerDependenciesMeta: {
15164          "@types/react": {
15165              optional: true
15166          }
15167      },
15168      devDependencies: {
15169          "@definitelytyped/dtslint": "0.0.112",
15170          "@emotion/css": "11.10.6",
15171          "@emotion/css-prettifier": "1.1.1",
15172          "@emotion/server": "11.10.0",
15173          "@emotion/styled": "11.10.6",
15174          "html-tag-names": "^1.1.2",
15175          react: "16.14.0",
15176          "svg-tag-names": "^1.1.1",
15177          typescript: "^4.5.5"
15178      },
15179      repository: "https://github.com/emotion-js/emotion/tree/main/packages/react",
15180      publishConfig: {
15181          access: "public"
15182      },
15183      "umd:main": "dist/emotion-react.umd.min.js",
15184      preconstruct: {
15185          entrypoints: [
15186              "./index.js",
15187              "./jsx-runtime.js",
15188              "./jsx-dev-runtime.js",
15189              "./_isolated-hnrs.js"
15190          ],
15191          umdName: "emotionReact",
15192          exports: {
15193              envConditions: [
15194                  "browser",
15195                  "worker"
15196              ],
15197              extra: {
15198                  "./types/css-prop": "./types/css-prop.d.ts",
15199                  "./macro": "./macro.js"
15200              }
15201          }
15202      }
15203  };
15204  
15205  var jsx = function jsx(type, props) {
15206    var args = arguments;
15207  
15208    if (props == null || !hasOwnProperty.call(props, 'css')) {
15209      // $FlowFixMe
15210      return createElement.apply(undefined, args);
15211    }
15212  
15213    var argsLength = args.length;
15214    var createElementArgArray = new Array(argsLength);
15215    createElementArgArray[0] = Emotion;
15216    createElementArgArray[1] = createEmotionProps(type, props);
15217  
15218    for (var i = 2; i < argsLength; i++) {
15219      createElementArgArray[i] = args[i];
15220    } // $FlowFixMe
15221  
15222  
15223    return createElement.apply(null, createElementArgArray);
15224  };
15225  
15226  var warnedAboutCssPropForGlobal = false; // maintain place over rerenders.
15227  // initial render from browser, insertBefore context.sheet.tags[0] or if a style hasn't been inserted there yet, appendChild
15228  // initial client-side render from SSR, use place of hydrating tag
15229  
15230  var Global = /* #__PURE__ */(/* unused pure expression or super */ null && (withEmotionCache(function (props, cache) {
15231    if (false) {}
15232  
15233    var styles = props.styles;
15234    var serialized = serializeStyles([styles], undefined, useContext(ThemeContext));
15235    // but it is based on a constant that will never change at runtime
15236    // it's effectively like having two implementations and switching them out
15237    // so it's not actually breaking anything
15238  
15239  
15240    var sheetRef = useRef();
15241    useInsertionEffectWithLayoutFallback(function () {
15242      var key = cache.key + "-global"; // use case of https://github.com/emotion-js/emotion/issues/2675
15243  
15244      var sheet = new cache.sheet.constructor({
15245        key: key,
15246        nonce: cache.sheet.nonce,
15247        container: cache.sheet.container,
15248        speedy: cache.sheet.isSpeedy
15249      });
15250      var rehydrating = false; // $FlowFixMe
15251  
15252      var node = document.querySelector("style[data-emotion=\"" + key + " " + serialized.name + "\"]");
15253  
15254      if (cache.sheet.tags.length) {
15255        sheet.before = cache.sheet.tags[0];
15256      }
15257  
15258      if (node !== null) {
15259        rehydrating = true; // clear the hash so this node won't be recognizable as rehydratable by other <Global/>s
15260  
15261        node.setAttribute('data-emotion', key);
15262        sheet.hydrate([node]);
15263      }
15264  
15265      sheetRef.current = [sheet, rehydrating];
15266      return function () {
15267        sheet.flush();
15268      };
15269    }, [cache]);
15270    useInsertionEffectWithLayoutFallback(function () {
15271      var sheetRefCurrent = sheetRef.current;
15272      var sheet = sheetRefCurrent[0],
15273          rehydrating = sheetRefCurrent[1];
15274  
15275      if (rehydrating) {
15276        sheetRefCurrent[1] = false;
15277        return;
15278      }
15279  
15280      if (serialized.next !== undefined) {
15281        // insert keyframes
15282        insertStyles(cache, serialized.next, true);
15283      }
15284  
15285      if (sheet.tags.length) {
15286        // if this doesn't exist then it will be null so the style element will be appended
15287        var element = sheet.tags[sheet.tags.length - 1].nextElementSibling;
15288        sheet.before = element;
15289        sheet.flush();
15290      }
15291  
15292      cache.insert("", serialized, sheet, false);
15293    }, [cache, serialized.name]);
15294    return null;
15295  })));
15296  
15297  if (false) {}
15298  
15299  function emotion_react_browser_esm_css() {
15300    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
15301      args[_key] = arguments[_key];
15302    }
15303  
15304    return emotion_serialize_browser_esm_serializeStyles(args);
15305  }
15306  
15307  var emotion_react_browser_esm_keyframes = function keyframes() {
15308    var insertable = emotion_react_browser_esm_css.apply(void 0, arguments);
15309    var name = "animation-" + insertable.name; // $FlowFixMe
15310  
15311    return {
15312      name: name,
15313      styles: "@keyframes " + name + "{" + insertable.styles + "}",
15314      anim: 1,
15315      toString: function toString() {
15316        return "_EMO_" + this.name + "_" + this.styles + "_EMO_";
15317      }
15318    };
15319  };
15320  
15321  var emotion_react_browser_esm_classnames = function classnames(args) {
15322    var len = args.length;
15323    var i = 0;
15324    var cls = '';
15325  
15326    for (; i < len; i++) {
15327      var arg = args[i];
15328      if (arg == null) continue;
15329      var toAdd = void 0;
15330  
15331      switch (typeof arg) {
15332        case 'boolean':
15333          break;
15334  
15335        case 'object':
15336          {
15337            if (Array.isArray(arg)) {
15338              toAdd = classnames(arg);
15339            } else {
15340              if (false) {}
15341  
15342              toAdd = '';
15343  
15344              for (var k in arg) {
15345                if (arg[k] && k) {
15346                  toAdd && (toAdd += ' ');
15347                  toAdd += k;
15348                }
15349              }
15350            }
15351  
15352            break;
15353          }
15354  
15355        default:
15356          {
15357            toAdd = arg;
15358          }
15359      }
15360  
15361      if (toAdd) {
15362        cls && (cls += ' ');
15363        cls += toAdd;
15364      }
15365    }
15366  
15367    return cls;
15368  };
15369  
15370  function emotion_react_browser_esm_merge(registered, css, className) {
15371    var registeredStyles = [];
15372    var rawClassName = getRegisteredStyles(registered, registeredStyles, className);
15373  
15374    if (registeredStyles.length < 2) {
15375      return className;
15376    }
15377  
15378    return rawClassName + css(registeredStyles);
15379  }
15380  
15381  var emotion_react_browser_esm_Insertion = function Insertion(_ref) {
15382    var cache = _ref.cache,
15383        serializedArr = _ref.serializedArr;
15384    var rules = useInsertionEffectAlwaysWithSyncFallback(function () {
15385  
15386      for (var i = 0; i < serializedArr.length; i++) {
15387        var res = insertStyles(cache, serializedArr[i], false);
15388      }
15389    });
15390  
15391    return null;
15392  };
15393  
15394  var ClassNames = /* #__PURE__ */(/* unused pure expression or super */ null && (withEmotionCache(function (props, cache) {
15395    var hasRendered = false;
15396    var serializedArr = [];
15397  
15398    var css = function css() {
15399      if (hasRendered && "production" !== 'production') {}
15400  
15401      for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
15402        args[_key] = arguments[_key];
15403      }
15404  
15405      var serialized = serializeStyles(args, cache.registered);
15406      serializedArr.push(serialized); // registration has to happen here as the result of this might get consumed by `cx`
15407  
15408      registerStyles(cache, serialized, false);
15409      return cache.key + "-" + serialized.name;
15410    };
15411  
15412    var cx = function cx() {
15413      if (hasRendered && "production" !== 'production') {}
15414  
15415      for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
15416        args[_key2] = arguments[_key2];
15417      }
15418  
15419      return emotion_react_browser_esm_merge(cache.registered, css, emotion_react_browser_esm_classnames(args));
15420    };
15421  
15422    var content = {
15423      css: css,
15424      cx: cx,
15425      theme: useContext(ThemeContext)
15426    };
15427    var ele = props.children(content);
15428    hasRendered = true;
15429    return /*#__PURE__*/createElement(Fragment, null, /*#__PURE__*/createElement(emotion_react_browser_esm_Insertion, {
15430      cache: cache,
15431      serializedArr: serializedArr
15432    }), ele);
15433  })));
15434  
15435  if (false) {}
15436  
15437  if (false) { var globalKey, globalContext, isTestEnv, emotion_react_browser_esm_isBrowser; }
15438  
15439  
15440  
15441  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/utils/space.js
15442  /**
15443   * The argument value for the `space()` utility function.
15444   *
15445   * When this is a number or a numeric string, it will be interpreted as a
15446   * multiplier for the grid base value (4px). For example, `space( 2 )` will be 8px.
15447   *
15448   * Otherwise, it will be interpreted as a literal CSS length value. For example,
15449   * `space( 'auto' )` will be 'auto', and `space( '2px' )` will be 2px.
15450   */
15451  
15452  const GRID_BASE = '4px';
15453  
15454  /**
15455   * A function that handles numbers, numeric strings, and unit values.
15456   *
15457   * When given a number or a numeric string, it will return the grid-based
15458   * value as a factor of GRID_BASE, defined above.
15459   *
15460   * When given a unit value or one of the named CSS values like `auto`,
15461   * it will simply return the value back.
15462   *
15463   * @param value A number, numeric string, or a unit value.
15464   */
15465  function space(value) {
15466    if (typeof value === 'undefined') {
15467      return undefined;
15468    }
15469  
15470    // Handle empty strings, if it's the number 0 this still works.
15471    if (!value) {
15472      return '0';
15473    }
15474    const asInt = typeof value === 'number' ? value : Number(value);
15475  
15476    // Test if the input has a unit, was NaN, or was one of the named CSS values (like `auto`), in which case just use that value.
15477    if (typeof window !== 'undefined' && window.CSS?.supports?.('margin', value.toString()) || Number.isNaN(asInt)) {
15478      return value.toString();
15479    }
15480    return `calc($GRID_BASE} * $value})`;
15481  }
15482  
15483  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/utils/colors-values.js
15484  /**
15485   * Internal dependencies
15486   */
15487  const white = '#fff';
15488  
15489  // Matches the grays in @wordpress/base-styles
15490  const GRAY = {
15491    900: '#1e1e1e',
15492    800: '#2f2f2f',
15493    /** Meets 4.6:1 text contrast against white. */
15494    700: '#757575',
15495    /** Meets 3:1 UI or large text contrast against white. */
15496    600: '#949494',
15497    400: '#ccc',
15498    /** Used for most borders. */
15499    300: '#ddd',
15500    /** Used sparingly for light borders. */
15501    200: '#e0e0e0',
15502    /** Used for light gray backgrounds. */
15503    100: '#f0f0f0'
15504  };
15505  
15506  // Matches @wordpress/base-styles
15507  const ALERT = {
15508    yellow: '#f0b849',
15509    red: '#d94f4f',
15510    green: '#4ab866'
15511  };
15512  
15513  // Should match packages/components/src/utils/theme-variables.scss
15514  const THEME = {
15515    accent: `var(--wp-components-color-accent, var(--wp-admin-theme-color, #3858e9))`,
15516    accentDarker10: `var(--wp-components-color-accent-darker-10, var(--wp-admin-theme-color-darker-10, #2145e6))`,
15517    accentDarker20: `var(--wp-components-color-accent-darker-20, var(--wp-admin-theme-color-darker-20, #183ad6))`,
15518    /** Used when placing text on the accent color. */
15519    accentInverted: `var(--wp-components-color-accent-inverted, $white})`,
15520    background: `var(--wp-components-color-background, $white})`,
15521    foreground: `var(--wp-components-color-foreground, $GRAY[900]})`,
15522    /** Used when placing text on the foreground color. */
15523    foregroundInverted: `var(--wp-components-color-foreground-inverted, $white})`,
15524    gray: {
15525      /** @deprecated Use `COLORS.theme.foreground` instead. */
15526      900: `var(--wp-components-color-foreground, $GRAY[900]})`,
15527      800: `var(--wp-components-color-gray-800, $GRAY[800]})`,
15528      700: `var(--wp-components-color-gray-700, $GRAY[700]})`,
15529      600: `var(--wp-components-color-gray-600, $GRAY[600]})`,
15530      400: `var(--wp-components-color-gray-400, $GRAY[400]})`,
15531      300: `var(--wp-components-color-gray-300, $GRAY[300]})`,
15532      200: `var(--wp-components-color-gray-200, $GRAY[200]})`,
15533      100: `var(--wp-components-color-gray-100, $GRAY[100]})`
15534    }
15535  };
15536  const UI = {
15537    background: THEME.background,
15538    backgroundDisabled: THEME.gray[100],
15539    border: THEME.gray[600],
15540    borderHover: THEME.gray[700],
15541    borderFocus: THEME.accent,
15542    borderDisabled: THEME.gray[400],
15543    textDisabled: THEME.gray[600],
15544    // Matches @wordpress/base-styles
15545    darkGrayPlaceholder: `color-mix(in srgb, $THEME.foreground}, transparent 38%)`,
15546    lightGrayPlaceholder: `color-mix(in srgb, $THEME.background}, transparent 35%)`
15547  };
15548  const COLORS = Object.freeze({
15549    /**
15550     * The main gray color object.
15551     *
15552     * @deprecated Use semantic aliases in `COLORS.ui` or theme-ready variables in `COLORS.theme.gray`.
15553     */
15554    gray: GRAY,
15555    // TODO: Stop exporting this when everything is migrated to `theme` or `ui`
15556    white,
15557    alert: ALERT,
15558    /**
15559     * Theme-ready variables with fallbacks.
15560     *
15561     * Prefer semantic aliases in `COLORS.ui` when applicable.
15562     */
15563    theme: THEME,
15564    /**
15565     * Semantic aliases (prefer these over raw variables when applicable).
15566     */
15567    ui: UI
15568  });
15569  /* harmony default export */ const colors_values = ((/* unused pure expression or super */ null && (COLORS)));
15570  
15571  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/utils/config-values.js
15572  /**
15573   * Internal dependencies
15574   */
15575  
15576  
15577  const CONTROL_HEIGHT = '36px';
15578  const CONTROL_PROPS = {
15579    // These values should be shared with TextControl.
15580    controlPaddingX: 12,
15581    controlPaddingXSmall: 8,
15582    controlPaddingXLarge: 12 * 1.3334,
15583    // TODO: Deprecate
15584  
15585    controlBackgroundColor: COLORS.white,
15586    controlBoxShadowFocus: `0 0 0 0.5px $COLORS.theme.accent}`,
15587    controlHeight: CONTROL_HEIGHT,
15588    controlHeightXSmall: `calc( $CONTROL_HEIGHT} * 0.6 )`,
15589    controlHeightSmall: `calc( $CONTROL_HEIGHT} * 0.8 )`,
15590    controlHeightLarge: `calc( $CONTROL_HEIGHT} * 1.2 )`,
15591    controlHeightXLarge: `calc( $CONTROL_HEIGHT} * 1.4 )`
15592  };
15593  
15594  // Using Object.assign to avoid creating circular references when emitting
15595  // TypeScript type declarations.
15596  /* harmony default export */ const config_values = (Object.assign({}, CONTROL_PROPS, {
15597    colorDivider: 'rgba(0, 0, 0, 0.1)',
15598    colorScrollbarThumb: 'rgba(0, 0, 0, 0.2)',
15599    colorScrollbarThumbHover: 'rgba(0, 0, 0, 0.5)',
15600    colorScrollbarTrack: 'rgba(0, 0, 0, 0.04)',
15601    elevationIntensity: 1,
15602    radiusXSmall: '1px',
15603    radiusSmall: '2px',
15604    radiusMedium: '4px',
15605    radiusLarge: '8px',
15606    radiusFull: '9999px',
15607    radiusRound: '50%',
15608    borderWidth: '1px',
15609    borderWidthFocus: '1.5px',
15610    borderWidthTab: '4px',
15611    spinnerSize: 16,
15612    fontSize: '13px',
15613    fontSizeH1: 'calc(2.44 * 13px)',
15614    fontSizeH2: 'calc(1.95 * 13px)',
15615    fontSizeH3: 'calc(1.56 * 13px)',
15616    fontSizeH4: 'calc(1.25 * 13px)',
15617    fontSizeH5: '13px',
15618    fontSizeH6: 'calc(0.8 * 13px)',
15619    fontSizeInputMobile: '16px',
15620    fontSizeMobile: '15px',
15621    fontSizeSmall: 'calc(0.92 * 13px)',
15622    fontSizeXSmall: 'calc(0.75 * 13px)',
15623    fontLineHeightBase: '1.4',
15624    fontWeight: 'normal',
15625    fontWeightHeading: '600',
15626    gridBase: '4px',
15627    cardPaddingXSmall: `$space(2)}`,
15628    cardPaddingSmall: `$space(4)}`,
15629    cardPaddingMedium: `$space(4)} $space(6)}`,
15630    cardPaddingLarge: `$space(6)} $space(8)}`,
15631    elevationXSmall: `0 1px 1px rgba(0, 0, 0, 0.03), 0 1px 2px rgba(0, 0, 0, 0.02), 0 3px 3px rgba(0, 0, 0, 0.02), 0 4px 4px rgba(0, 0, 0, 0.01)`,
15632    elevationSmall: `0 1px 2px rgba(0, 0, 0, 0.05), 0 2px 3px rgba(0, 0, 0, 0.04), 0 6px 6px rgba(0, 0, 0, 0.03), 0 8px 8px rgba(0, 0, 0, 0.02)`,
15633    elevationMedium: `0 2px 3px rgba(0, 0, 0, 0.05), 0 4px 5px rgba(0, 0, 0, 0.04), 0 12px 12px rgba(0, 0, 0, 0.03), 0 16px 16px rgba(0, 0, 0, 0.02)`,
15634    elevationLarge: `0 5px 15px rgba(0, 0, 0, 0.08), 0 15px 27px rgba(0, 0, 0, 0.07), 0 30px 36px rgba(0, 0, 0, 0.04), 0 50px 43px rgba(0, 0, 0, 0.02)`,
15635    surfaceBackgroundColor: COLORS.white,
15636    surfaceBackgroundSubtleColor: '#F3F3F3',
15637    surfaceBackgroundTintColor: '#F5F5F5',
15638    surfaceBorderColor: 'rgba(0, 0, 0, 0.1)',
15639    surfaceBorderBoldColor: 'rgba(0, 0, 0, 0.15)',
15640    surfaceBorderSubtleColor: 'rgba(0, 0, 0, 0.05)',
15641    surfaceBackgroundTertiaryColor: COLORS.white,
15642    surfaceColor: COLORS.white,
15643    transitionDuration: '200ms',
15644    transitionDurationFast: '160ms',
15645    transitionDurationFaster: '120ms',
15646    transitionDurationFastest: '100ms',
15647    transitionTimingFunction: 'cubic-bezier(0.08, 0.52, 0.52, 1)',
15648    transitionTimingFunctionControl: 'cubic-bezier(0.12, 0.8, 0.32, 1)'
15649  }));
15650  
15651  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/alignment-matrix-control/styles.js
15652  
15653  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)."; }
15654  /**
15655   * External dependencies
15656   */
15657  
15658  
15659  
15660  /**
15661   * Internal dependencies
15662   */
15663  
15664  // Grid structure
15665  
15666  const rootBase = ({
15667    size = 92
15668  }) => /*#__PURE__*/emotion_react_browser_esm_css("direction:ltr;display:grid;grid-template-columns:repeat( 3, 1fr );grid-template-rows:repeat( 3, 1fr );box-sizing:border-box;width:", size, "px;aspect-ratio:1;border-radius:", config_values.radiusMedium, ";outline:none;" + ( true ? "" : 0),  true ? "" : 0);
15669  var _ref =  true ? {
15670    name: "e0dnmk",
15671    styles: "cursor:pointer"
15672  } : 0;
15673  const GridContainer = /*#__PURE__*/emotion_styled_base_browser_esm("div",  true ? {
15674    target: "e1r95csn3"
15675  } : 0)(rootBase, " border:1px solid transparent;", props => props.disablePointerEvents ? /*#__PURE__*/emotion_react_browser_esm_css( true ? "" : 0,  true ? "" : 0) : _ref, ";" + ( true ? "" : 0));
15676  const GridRow = /*#__PURE__*/emotion_styled_base_browser_esm("div",  true ? {
15677    target: "e1r95csn2"
15678  } : 0)( true ? {
15679    name: "1fbxn64",
15680    styles: "grid-column:1/-1;box-sizing:border-box;display:grid;grid-template-columns:repeat( 3, 1fr )"
15681  } : 0);
15682  
15683  // Cell
15684  const Cell = /*#__PURE__*/emotion_styled_base_browser_esm("span",  true ? {
15685    target: "e1r95csn1"
15686  } : 0)( true ? {
15687    name: "e2kws5",
15688    styles: "position:relative;display:flex;align-items:center;justify-content:center;box-sizing:border-box;margin:0;padding:0;appearance:none;border:none;outline:none"
15689  } : 0);
15690  const POINT_SIZE = 6;
15691  const Point = /*#__PURE__*/emotion_styled_base_browser_esm("span",  true ? {
15692    target: "e1r95csn0"
15693  } : 0)("display:block;contain:strict;box-sizing:border-box;width:", POINT_SIZE, "px;aspect-ratio:1;margin:auto;color:", COLORS.theme.gray[400], ";border:", POINT_SIZE / 2, "px solid currentColor;", Cell, "[data-active-item] &{color:", COLORS.gray[900], ";transform:scale( calc( 5 / 3 ) );}", Cell, ":not([data-active-item]):hover &{color:", COLORS.theme.accent, ";}", Cell, "[data-focus-visible] &{outline:1px solid ", COLORS.theme.accent, ";outline-offset:1px;}@media not ( prefers-reduced-motion ){transition-property:color,transform;transition-duration:120ms;transition-timing-function:linear;}" + ( true ? "" : 0));
15694  
15695  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/alignment-matrix-control/cell.js
15696  /**
15697   * Internal dependencies
15698   */
15699  
15700  
15701  
15702  
15703  /**
15704   * Internal dependencies
15705   */
15706  
15707  
15708  
15709  
15710  function cell_Cell({
15711    id,
15712    value,
15713    ...props
15714  }) {
15715    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(tooltip, {
15716      text: ALIGNMENT_LABEL[value],
15717      children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(Composite.Item, {
15718        id: id,
15719        render: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Cell, {
15720          ...props,
15721          role: "gridcell"
15722        }),
15723        children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(visually_hidden_component, {
15724          children: value
15725        }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Point, {
15726          role: "presentation"
15727        })]
15728      })
15729    });
15730  }
15731  
15732  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/alignment-matrix-control/icon.js
15733  /**
15734   * External dependencies
15735   */
15736  
15737  
15738  /**
15739   * WordPress dependencies
15740   */
15741  
15742  
15743  /**
15744   * Internal dependencies
15745   */
15746  
15747  
15748  const BASE_SIZE = 24;
15749  const GRID_CELL_SIZE = 7;
15750  const GRID_PADDING = (BASE_SIZE - 3 * GRID_CELL_SIZE) / 2;
15751  const DOT_SIZE = 2;
15752  const DOT_SIZE_SELECTED = 4;
15753  function AlignmentMatrixControlIcon({
15754    className,
15755    disablePointerEvents = true,
15756    size,
15757    width,
15758    height,
15759    style = {},
15760    value = 'center',
15761    ...props
15762  }) {
15763    var _ref, _ref2;
15764    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, {
15765      xmlns: "http://www.w3.org/2000/svg",
15766      viewBox: `0 0 $BASE_SIZE} $BASE_SIZE}`,
15767      width: (_ref = size !== null && size !== void 0 ? size : width) !== null && _ref !== void 0 ? _ref : BASE_SIZE,
15768      height: (_ref2 = size !== null && size !== void 0 ? size : height) !== null && _ref2 !== void 0 ? _ref2 : BASE_SIZE,
15769      role: "presentation",
15770      className: dist_clsx('component-alignment-matrix-control-icon', className),
15771      style: {
15772        pointerEvents: disablePointerEvents ? 'none' : undefined,
15773        ...style
15774      },
15775      ...props,
15776      children: ALIGNMENTS.map((align, index) => {
15777        const dotSize = getAlignmentIndex(value) === index ? DOT_SIZE_SELECTED : DOT_SIZE;
15778        return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Rect, {
15779          x: GRID_PADDING + index % 3 * GRID_CELL_SIZE + (GRID_CELL_SIZE - dotSize) / 2,
15780          y: GRID_PADDING + Math.floor(index / 3) * GRID_CELL_SIZE + (GRID_CELL_SIZE - dotSize) / 2,
15781          width: dotSize,
15782          height: dotSize,
15783          fill: "currentColor"
15784        }, align);
15785      })
15786    });
15787  }
15788  /* harmony default export */ const icon = (AlignmentMatrixControlIcon);
15789  
15790  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/alignment-matrix-control/index.js
15791  /**
15792   * External dependencies
15793   */
15794  
15795  
15796  /**
15797   * WordPress dependencies
15798   */
15799  
15800  
15801  
15802  
15803  /**
15804   * Internal dependencies
15805   */
15806  
15807  
15808  
15809  
15810  
15811  
15812  function UnforwardedAlignmentMatrixControl({
15813    className,
15814    id,
15815    label = (0,external_wp_i18n_namespaceObject.__)('Alignment Matrix Control'),
15816    defaultValue = 'center center',
15817    value,
15818    onChange,
15819    width = 92,
15820    ...props
15821  }) {
15822    const baseId = (0,external_wp_compose_namespaceObject.useInstanceId)(UnforwardedAlignmentMatrixControl, 'alignment-matrix-control', id);
15823    const setActiveId = (0,external_wp_element_namespaceObject.useCallback)(nextActiveId => {
15824      const nextValue = getItemValue(baseId, nextActiveId);
15825      if (nextValue) {
15826        onChange?.(nextValue);
15827      }
15828    }, [baseId, onChange]);
15829    const classes = dist_clsx('component-alignment-matrix-control', className);
15830    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Composite, {
15831      defaultActiveId: getItemId(baseId, defaultValue),
15832      activeId: getItemId(baseId, value),
15833      setActiveId: setActiveId,
15834      rtl: (0,external_wp_i18n_namespaceObject.isRTL)(),
15835      render: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(GridContainer, {
15836        ...props,
15837        "aria-label": label,
15838        className: classes,
15839        id: baseId,
15840        role: "grid",
15841        size: width
15842      }),
15843      children: GRID.map((cells, index) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Composite.Row, {
15844        render: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(GridRow, {
15845          role: "row"
15846        }),
15847        children: cells.map(cell => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(cell_Cell, {
15848          id: getItemId(baseId, cell),
15849          value: cell
15850        }, cell))
15851      }, index))
15852    });
15853  }
15854  
15855  /**
15856   * AlignmentMatrixControl components enable adjustments to horizontal and vertical alignments for UI.
15857   *
15858   * ```jsx
15859   * import { AlignmentMatrixControl } from '@wordpress/components';
15860   * import { useState } from '@wordpress/element';
15861   *
15862   * const Example = () => {
15863   *     const [ alignment, setAlignment ] = useState( 'center center' );
15864   *
15865   *     return (
15866   *         <AlignmentMatrixControl
15867   *             value={ alignment }
15868   *             onChange={ setAlignment }
15869   *         />
15870   *     );
15871   * };
15872   * ```
15873   */
15874  const AlignmentMatrixControl = Object.assign(UnforwardedAlignmentMatrixControl, {
15875    /**
15876     * Render an alignment matrix as an icon.
15877     *
15878     * ```jsx
15879     * import { AlignmentMatrixControl } from '@wordpress/components';
15880     *
15881     * <Icon icon={<AlignmentMatrixControl.Icon value="top left" />} />
15882     * ```
15883     */
15884    Icon: Object.assign(icon, {
15885      displayName: 'AlignmentMatrixControl.Icon'
15886    })
15887  });
15888  /* harmony default export */ const alignment_matrix_control = (AlignmentMatrixControl);
15889  
15890  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/animate/index.js
15891  /**
15892   * External dependencies
15893   */
15894  
15895  
15896  /**
15897   * Internal dependencies
15898   */
15899  
15900  /**
15901   * @param type The animation type
15902   * @return Default origin
15903   */
15904  function getDefaultOrigin(type) {
15905    return type === 'appear' ? 'top' : 'left';
15906  }
15907  
15908  /**
15909   * @param options
15910   *
15911   * @return ClassName that applies the animations
15912   */
15913  function getAnimateClassName(options) {
15914    if (options.type === 'loading') {
15915      return 'components-animate__loading';
15916    }
15917    const {
15918      type,
15919      origin = getDefaultOrigin(type)
15920    } = options;
15921    if (type === 'appear') {
15922      const [yAxis, xAxis = 'center'] = origin.split(' ');
15923      return dist_clsx('components-animate__appear', {
15924        ['is-from-' + xAxis]: xAxis !== 'center',
15925        ['is-from-' + yAxis]: yAxis !== 'middle'
15926      });
15927    }
15928    if (type === 'slide-in') {
15929      return dist_clsx('components-animate__slide-in', 'is-from-' + origin);
15930    }
15931    return undefined;
15932  }
15933  
15934  /**
15935   * Simple interface to introduce animations to components.
15936   *
15937   * ```jsx
15938   * import { Animate, Notice } from '@wordpress/components';
15939   *
15940   * const MyAnimatedNotice = () => (
15941   *     <Animate type="slide-in" options={ { origin: 'top' } }>
15942   *         { ( { className } ) => (
15943   *             <Notice className={ className } status="success">
15944   *                 <p>Animation finished.</p>
15945   *             </Notice>
15946   *         ) }
15947   *     </Animate>
15948   * );
15949   * ```
15950   */
15951  function Animate({
15952    type,
15953    options = {},
15954    children
15955  }) {
15956    return children({
15957      className: getAnimateClassName({
15958        type,
15959        ...options
15960      })
15961    });
15962  }
15963  /* harmony default export */ const animate = (Animate);
15964  
15965  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/context/MotionConfigContext.mjs
15966  
15967  
15968  /**
15969   * @public
15970   */
15971  const MotionConfigContext = (0,external_React_.createContext)({
15972      transformPagePoint: (p) => p,
15973      isStatic: false,
15974      reducedMotion: "never",
15975  });
15976  
15977  
15978  
15979  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/context/MotionContext/index.mjs
15980  
15981  
15982  const MotionContext = (0,external_React_.createContext)({});
15983  
15984  
15985  
15986  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/context/PresenceContext.mjs
15987  
15988  
15989  /**
15990   * @public
15991   */
15992  const PresenceContext_PresenceContext = (0,external_React_.createContext)(null);
15993  
15994  
15995  
15996  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/is-browser.mjs
15997  const is_browser_isBrowser = typeof document !== "undefined";
15998  
15999  
16000  
16001  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/use-isomorphic-effect.mjs
16002  
16003  
16004  
16005  const useIsomorphicLayoutEffect = is_browser_isBrowser ? external_React_.useLayoutEffect : external_React_.useEffect;
16006  
16007  
16008  
16009  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/context/LazyContext.mjs
16010  
16011  
16012  const LazyContext = (0,external_React_.createContext)({ strict: false });
16013  
16014  
16015  
16016  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/dom/utils/camel-to-dash.mjs
16017  /**
16018   * Convert camelCase to dash-case properties.
16019   */
16020  const camelToDash = (str) => str.replace(/([a-z])([A-Z])/gu, "$1-$2").toLowerCase();
16021  
16022  
16023  
16024  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/animation/optimized-appear/data-id.mjs
16025  
16026  
16027  const optimizedAppearDataId = "framerAppearId";
16028  const optimizedAppearDataAttribute = "data-" + camelToDash(optimizedAppearDataId);
16029  
16030  
16031  
16032  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/GlobalConfig.mjs
16033  const MotionGlobalConfig = {
16034      skipAnimations: false,
16035      useManualTiming: false,
16036  };
16037  
16038  
16039  
16040  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/frameloop/render-step.mjs
16041  class Queue {
16042      constructor() {
16043          this.order = [];
16044          this.scheduled = new Set();
16045      }
16046      add(process) {
16047          if (!this.scheduled.has(process)) {
16048              this.scheduled.add(process);
16049              this.order.push(process);
16050              return true;
16051          }
16052      }
16053      remove(process) {
16054          const index = this.order.indexOf(process);
16055          if (index !== -1) {
16056              this.order.splice(index, 1);
16057              this.scheduled.delete(process);
16058          }
16059      }
16060      clear() {
16061          this.order.length = 0;
16062          this.scheduled.clear();
16063      }
16064  }
16065  function createRenderStep(runNextFrame) {
16066      /**
16067       * We create and reuse two queues, one to queue jobs for the current frame
16068       * and one for the next. We reuse to avoid triggering GC after x frames.
16069       */
16070      let thisFrame = new Queue();
16071      let nextFrame = new Queue();
16072      let numToRun = 0;
16073      /**
16074       * Track whether we're currently processing jobs in this step. This way
16075       * we can decide whether to schedule new jobs for this frame or next.
16076       */
16077      let isProcessing = false;
16078      let flushNextFrame = false;
16079      /**
16080       * A set of processes which were marked keepAlive when scheduled.
16081       */
16082      const toKeepAlive = new WeakSet();
16083      const step = {
16084          /**
16085           * Schedule a process to run on the next frame.
16086           */
16087          schedule: (callback, keepAlive = false, immediate = false) => {
16088              const addToCurrentFrame = immediate && isProcessing;
16089              const queue = addToCurrentFrame ? thisFrame : nextFrame;
16090              if (keepAlive)
16091                  toKeepAlive.add(callback);
16092              if (queue.add(callback) && addToCurrentFrame && isProcessing) {
16093                  // If we're adding it to the currently running queue, update its measured size
16094                  numToRun = thisFrame.order.length;
16095              }
16096              return callback;
16097          },
16098          /**
16099           * Cancel the provided callback from running on the next frame.
16100           */
16101          cancel: (callback) => {
16102              nextFrame.remove(callback);
16103              toKeepAlive.delete(callback);
16104          },
16105          /**
16106           * Execute all schedule callbacks.
16107           */
16108          process: (frameData) => {
16109              /**
16110               * If we're already processing we've probably been triggered by a flushSync
16111               * inside an existing process. Instead of executing, mark flushNextFrame
16112               * as true and ensure we flush the following frame at the end of this one.
16113               */
16114              if (isProcessing) {
16115                  flushNextFrame = true;
16116                  return;
16117              }
16118              isProcessing = true;
16119              [thisFrame, nextFrame] = [nextFrame, thisFrame];
16120              // Clear the next frame queue
16121              nextFrame.clear();
16122              // Execute this frame
16123              numToRun = thisFrame.order.length;
16124              if (numToRun) {
16125                  for (let i = 0; i < numToRun; i++) {
16126                      const callback = thisFrame.order[i];
16127                      if (toKeepAlive.has(callback)) {
16128                          step.schedule(callback);
16129                          runNextFrame();
16130                      }
16131                      callback(frameData);
16132                  }
16133              }
16134              isProcessing = false;
16135              if (flushNextFrame) {
16136                  flushNextFrame = false;
16137                  step.process(frameData);
16138              }
16139          },
16140      };
16141      return step;
16142  }
16143  
16144  
16145  
16146  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/frameloop/batcher.mjs
16147  
16148  
16149  
16150  const stepsOrder = [
16151      "read", // Read
16152      "resolveKeyframes", // Write/Read/Write/Read
16153      "update", // Compute
16154      "preRender", // Compute
16155      "render", // Write
16156      "postRender", // Compute
16157  ];
16158  const maxElapsed = 40;
16159  function createRenderBatcher(scheduleNextBatch, allowKeepAlive) {
16160      let runNextFrame = false;
16161      let useDefaultElapsed = true;
16162      const state = {
16163          delta: 0,
16164          timestamp: 0,
16165          isProcessing: false,
16166      };
16167      const steps = stepsOrder.reduce((acc, key) => {
16168          acc[key] = createRenderStep(() => (runNextFrame = true));
16169          return acc;
16170      }, {});
16171      const processStep = (stepId) => {
16172          steps[stepId].process(state);
16173      };
16174      const processBatch = () => {
16175          const timestamp = MotionGlobalConfig.useManualTiming
16176              ? state.timestamp
16177              : performance.now();
16178          runNextFrame = false;
16179          state.delta = useDefaultElapsed
16180              ? 1000 / 60
16181              : Math.max(Math.min(timestamp - state.timestamp, maxElapsed), 1);
16182          state.timestamp = timestamp;
16183          state.isProcessing = true;
16184          stepsOrder.forEach(processStep);
16185          state.isProcessing = false;
16186          if (runNextFrame && allowKeepAlive) {
16187              useDefaultElapsed = false;
16188              scheduleNextBatch(processBatch);
16189          }
16190      };
16191      const wake = () => {
16192          runNextFrame = true;
16193          useDefaultElapsed = true;
16194          if (!state.isProcessing) {
16195              scheduleNextBatch(processBatch);
16196          }
16197      };
16198      const schedule = stepsOrder.reduce((acc, key) => {
16199          const step = steps[key];
16200          acc[key] = (process, keepAlive = false, immediate = false) => {
16201              if (!runNextFrame)
16202                  wake();
16203              return step.schedule(process, keepAlive, immediate);
16204          };
16205          return acc;
16206      }, {});
16207      const cancel = (process) => stepsOrder.forEach((key) => steps[key].cancel(process));
16208      return { schedule, cancel, state, steps };
16209  }
16210  
16211  
16212  
16213  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/frameloop/microtask.mjs
16214  
16215  
16216  const { schedule: microtask, cancel: cancelMicrotask } = createRenderBatcher(queueMicrotask, false);
16217  
16218  
16219  
16220  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/motion/utils/use-visual-element.mjs
16221  
16222  
16223  
16224  
16225  
16226  
16227  
16228  
16229  
16230  function useVisualElement(Component, visualState, props, createVisualElement) {
16231      const { visualElement: parent } = (0,external_React_.useContext)(MotionContext);
16232      const lazyContext = (0,external_React_.useContext)(LazyContext);
16233      const presenceContext = (0,external_React_.useContext)(PresenceContext_PresenceContext);
16234      const reducedMotionConfig = (0,external_React_.useContext)(MotionConfigContext).reducedMotion;
16235      const visualElementRef = (0,external_React_.useRef)();
16236      /**
16237       * If we haven't preloaded a renderer, check to see if we have one lazy-loaded
16238       */
16239      createVisualElement = createVisualElement || lazyContext.renderer;
16240      if (!visualElementRef.current && createVisualElement) {
16241          visualElementRef.current = createVisualElement(Component, {
16242              visualState,
16243              parent,
16244              props,
16245              presenceContext,
16246              blockInitialAnimation: presenceContext
16247                  ? presenceContext.initial === false
16248                  : false,
16249              reducedMotionConfig,
16250          });
16251      }
16252      const visualElement = visualElementRef.current;
16253      (0,external_React_.useInsertionEffect)(() => {
16254          visualElement && visualElement.update(props, presenceContext);
16255      });
16256      /**
16257       * Cache this value as we want to know whether HandoffAppearAnimations
16258       * was present on initial render - it will be deleted after this.
16259       */
16260      const wantsHandoff = (0,external_React_.useRef)(Boolean(props[optimizedAppearDataAttribute] &&
16261          !window.HandoffComplete));
16262      useIsomorphicLayoutEffect(() => {
16263          if (!visualElement)
16264              return;
16265          microtask.render(visualElement.render);
16266          /**
16267           * Ideally this function would always run in a useEffect.
16268           *
16269           * However, if we have optimised appear animations to handoff from,
16270           * it needs to happen synchronously to ensure there's no flash of
16271           * incorrect styles in the event of a hydration error.
16272           *
16273           * So if we detect a situtation where optimised appear animations
16274           * are running, we use useLayoutEffect to trigger animations.
16275           */
16276          if (wantsHandoff.current && visualElement.animationState) {
16277              visualElement.animationState.animateChanges();
16278          }
16279      });
16280      (0,external_React_.useEffect)(() => {
16281          if (!visualElement)
16282              return;
16283          visualElement.updateFeatures();
16284          if (!wantsHandoff.current && visualElement.animationState) {
16285              visualElement.animationState.animateChanges();
16286          }
16287          if (wantsHandoff.current) {
16288              wantsHandoff.current = false;
16289              // This ensures all future calls to animateChanges() will run in useEffect
16290              window.HandoffComplete = true;
16291          }
16292      });
16293      return visualElement;
16294  }
16295  
16296  
16297  
16298  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/is-ref-object.mjs
16299  function isRefObject(ref) {
16300      return (ref &&
16301          typeof ref === "object" &&
16302          Object.prototype.hasOwnProperty.call(ref, "current"));
16303  }
16304  
16305  
16306  
16307  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/motion/utils/use-motion-ref.mjs
16308  
16309  
16310  
16311  /**
16312   * Creates a ref function that, when called, hydrates the provided
16313   * external ref and VisualElement.
16314   */
16315  function useMotionRef(visualState, visualElement, externalRef) {
16316      return (0,external_React_.useCallback)((instance) => {
16317          instance && visualState.mount && visualState.mount(instance);
16318          if (visualElement) {
16319              instance
16320                  ? visualElement.mount(instance)
16321                  : visualElement.unmount();
16322          }
16323          if (externalRef) {
16324              if (typeof externalRef === "function") {
16325                  externalRef(instance);
16326              }
16327              else if (isRefObject(externalRef)) {
16328                  externalRef.current = instance;
16329              }
16330          }
16331      }, 
16332      /**
16333       * Only pass a new ref callback to React if we've received a visual element
16334       * factory. Otherwise we'll be mounting/remounting every time externalRef
16335       * or other dependencies change.
16336       */
16337      [visualElement]);
16338  }
16339  
16340  
16341  
16342  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/utils/is-variant-label.mjs
16343  /**
16344   * Decides if the supplied variable is variant label
16345   */
16346  function isVariantLabel(v) {
16347      return typeof v === "string" || Array.isArray(v);
16348  }
16349  
16350  
16351  
16352  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/animation/utils/is-animation-controls.mjs
16353  function isAnimationControls(v) {
16354      return (v !== null &&
16355          typeof v === "object" &&
16356          typeof v.start === "function");
16357  }
16358  
16359  
16360  
16361  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/utils/variant-props.mjs
16362  const variantPriorityOrder = [
16363      "animate",
16364      "whileInView",
16365      "whileFocus",
16366      "whileHover",
16367      "whileTap",
16368      "whileDrag",
16369      "exit",
16370  ];
16371  const variantProps = ["initial", ...variantPriorityOrder];
16372  
16373  
16374  
16375  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/utils/is-controlling-variants.mjs
16376  
16377  
16378  
16379  
16380  function isControllingVariants(props) {
16381      return (isAnimationControls(props.animate) ||
16382          variantProps.some((name) => isVariantLabel(props[name])));
16383  }
16384  function isVariantNode(props) {
16385      return Boolean(isControllingVariants(props) || props.variants);
16386  }
16387  
16388  
16389  
16390  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/context/MotionContext/utils.mjs
16391  
16392  
16393  
16394  function getCurrentTreeVariants(props, context) {
16395      if (isControllingVariants(props)) {
16396          const { initial, animate } = props;
16397          return {
16398              initial: initial === false || isVariantLabel(initial)
16399                  ? initial
16400                  : undefined,
16401              animate: isVariantLabel(animate) ? animate : undefined,
16402          };
16403      }
16404      return props.inherit !== false ? context : {};
16405  }
16406  
16407  
16408  
16409  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/context/MotionContext/create.mjs
16410  
16411  
16412  
16413  
16414  function useCreateMotionContext(props) {
16415      const { initial, animate } = getCurrentTreeVariants(props, (0,external_React_.useContext)(MotionContext));
16416      return (0,external_React_.useMemo)(() => ({ initial, animate }), [variantLabelsAsDependency(initial), variantLabelsAsDependency(animate)]);
16417  }
16418  function variantLabelsAsDependency(prop) {
16419      return Array.isArray(prop) ? prop.join(" ") : prop;
16420  }
16421  
16422  
16423  
16424  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/motion/features/definitions.mjs
16425  const featureProps = {
16426      animation: [
16427          "animate",
16428          "variants",
16429          "whileHover",
16430          "whileTap",
16431          "exit",
16432          "whileInView",
16433          "whileFocus",
16434          "whileDrag",
16435      ],
16436      exit: ["exit"],
16437      drag: ["drag", "dragControls"],
16438      focus: ["whileFocus"],
16439      hover: ["whileHover", "onHoverStart", "onHoverEnd"],
16440      tap: ["whileTap", "onTap", "onTapStart", "onTapCancel"],
16441      pan: ["onPan", "onPanStart", "onPanSessionStart", "onPanEnd"],
16442      inView: ["whileInView", "onViewportEnter", "onViewportLeave"],
16443      layout: ["layout", "layoutId"],
16444  };
16445  const featureDefinitions = {};
16446  for (const key in featureProps) {
16447      featureDefinitions[key] = {
16448          isEnabled: (props) => featureProps[key].some((name) => !!props[name]),
16449      };
16450  }
16451  
16452  
16453  
16454  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/motion/features/load-features.mjs
16455  
16456  
16457  function loadFeatures(features) {
16458      for (const key in features) {
16459          featureDefinitions[key] = {
16460              ...featureDefinitions[key],
16461              ...features[key],
16462          };
16463      }
16464  }
16465  
16466  
16467  
16468  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/context/LayoutGroupContext.mjs
16469  
16470  
16471  const LayoutGroupContext = (0,external_React_.createContext)({});
16472  
16473  
16474  
16475  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/context/SwitchLayoutGroupContext.mjs
16476  
16477  
16478  /**
16479   * Internal, exported only for usage in Framer
16480   */
16481  const SwitchLayoutGroupContext = (0,external_React_.createContext)({});
16482  
16483  
16484  
16485  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/motion/utils/symbol.mjs
16486  const motionComponentSymbol = Symbol.for("motionComponentSymbol");
16487  
16488  
16489  
16490  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/motion/index.mjs
16491  
16492  
16493  
16494  
16495  
16496  
16497  
16498  
16499  
16500  
16501  
16502  
16503  
16504  
16505  /**
16506   * Create a `motion` component.
16507   *
16508   * This function accepts a Component argument, which can be either a string (ie "div"
16509   * for `motion.div`), or an actual React component.
16510   *
16511   * Alongside this is a config option which provides a way of rendering the provided
16512   * component "offline", or outside the React render cycle.
16513   */
16514  function motion_createMotionComponent({ preloadedFeatures, createVisualElement, useRender, useVisualState, Component, }) {
16515      preloadedFeatures && loadFeatures(preloadedFeatures);
16516      function MotionComponent(props, externalRef) {
16517          /**
16518           * If we need to measure the element we load this functionality in a
16519           * separate class component in order to gain access to getSnapshotBeforeUpdate.
16520           */
16521          let MeasureLayout;
16522          const configAndProps = {
16523              ...(0,external_React_.useContext)(MotionConfigContext),
16524              ...props,
16525              layoutId: useLayoutId(props),
16526          };
16527          const { isStatic } = configAndProps;
16528          const context = useCreateMotionContext(props);
16529          const visualState = useVisualState(props, isStatic);
16530          if (!isStatic && is_browser_isBrowser) {
16531              /**
16532               * Create a VisualElement for this component. A VisualElement provides a common
16533               * interface to renderer-specific APIs (ie DOM/Three.js etc) as well as
16534               * providing a way of rendering to these APIs outside of the React render loop
16535               * for more performant animations and interactions
16536               */
16537              context.visualElement = useVisualElement(Component, visualState, configAndProps, createVisualElement);
16538              /**
16539               * Load Motion gesture and animation features. These are rendered as renderless
16540               * components so each feature can optionally make use of React lifecycle methods.
16541               */
16542              const initialLayoutGroupConfig = (0,external_React_.useContext)(SwitchLayoutGroupContext);
16543              const isStrict = (0,external_React_.useContext)(LazyContext).strict;
16544              if (context.visualElement) {
16545                  MeasureLayout = context.visualElement.loadFeatures(
16546                  // Note: Pass the full new combined props to correctly re-render dynamic feature components.
16547                  configAndProps, isStrict, preloadedFeatures, initialLayoutGroupConfig);
16548              }
16549          }
16550          /**
16551           * The mount order and hierarchy is specific to ensure our element ref
16552           * is hydrated by the time features fire their effects.
16553           */
16554          return ((0,external_ReactJSXRuntime_namespaceObject.jsxs)(MotionContext.Provider, { value: context, children: [MeasureLayout && context.visualElement ? ((0,external_ReactJSXRuntime_namespaceObject.jsx)(MeasureLayout, { visualElement: context.visualElement, ...configAndProps })) : null, useRender(Component, props, useMotionRef(visualState, context.visualElement, externalRef), visualState, isStatic, context.visualElement)] }));
16555      }
16556      const ForwardRefComponent = (0,external_React_.forwardRef)(MotionComponent);
16557      ForwardRefComponent[motionComponentSymbol] = Component;
16558      return ForwardRefComponent;
16559  }
16560  function useLayoutId({ layoutId }) {
16561      const layoutGroupId = (0,external_React_.useContext)(LayoutGroupContext).id;
16562      return layoutGroupId && layoutId !== undefined
16563          ? layoutGroupId + "-" + layoutId
16564          : layoutId;
16565  }
16566  
16567  
16568  
16569  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/dom/motion-proxy.mjs
16570  
16571  
16572  /**
16573   * Convert any React component into a `motion` component. The provided component
16574   * **must** use `React.forwardRef` to the underlying DOM component you want to animate.
16575   *
16576   * ```jsx
16577   * const Component = React.forwardRef((props, ref) => {
16578   *   return <div ref={ref} />
16579   * })
16580   *
16581   * const MotionComponent = motion(Component)
16582   * ```
16583   *
16584   * @public
16585   */
16586  function createMotionProxy(createConfig) {
16587      function custom(Component, customMotionComponentConfig = {}) {
16588          return motion_createMotionComponent(createConfig(Component, customMotionComponentConfig));
16589      }
16590      if (typeof Proxy === "undefined") {
16591          return custom;
16592      }
16593      /**
16594       * A cache of generated `motion` components, e.g `motion.div`, `motion.input` etc.
16595       * Rather than generating them anew every render.
16596       */
16597      const componentCache = new Map();
16598      return new Proxy(custom, {
16599          /**
16600           * Called when `motion` is referenced with a prop: `motion.div`, `motion.input` etc.
16601           * The prop name is passed through as `key` and we can use that to generate a `motion`
16602           * DOM component with that name.
16603           */
16604          get: (_target, key) => {
16605              /**
16606               * If this element doesn't exist in the component cache, create it and cache.
16607               */
16608              if (!componentCache.has(key)) {
16609                  componentCache.set(key, custom(key));
16610              }
16611              return componentCache.get(key);
16612          },
16613      });
16614  }
16615  
16616  
16617  
16618  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/svg/lowercase-elements.mjs
16619  /**
16620   * We keep these listed seperately as we use the lowercase tag names as part
16621   * of the runtime bundle to detect SVG components
16622   */
16623  const lowercaseSVGElements = [
16624      "animate",
16625      "circle",
16626      "defs",
16627      "desc",
16628      "ellipse",
16629      "g",
16630      "image",
16631      "line",
16632      "filter",
16633      "marker",
16634      "mask",
16635      "metadata",
16636      "path",
16637      "pattern",
16638      "polygon",
16639      "polyline",
16640      "rect",
16641      "stop",
16642      "switch",
16643      "symbol",
16644      "svg",
16645      "text",
16646      "tspan",
16647      "use",
16648      "view",
16649  ];
16650  
16651  
16652  
16653  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/dom/utils/is-svg-component.mjs
16654  
16655  
16656  function isSVGComponent(Component) {
16657      if (
16658      /**
16659       * If it's not a string, it's a custom React component. Currently we only support
16660       * HTML custom React components.
16661       */
16662      typeof Component !== "string" ||
16663          /**
16664           * If it contains a dash, the element is a custom HTML webcomponent.
16665           */
16666          Component.includes("-")) {
16667          return false;
16668      }
16669      else if (
16670      /**
16671       * If it's in our list of lowercase SVG tags, it's an SVG component
16672       */
16673      lowercaseSVGElements.indexOf(Component) > -1 ||
16674          /**
16675           * If it contains a capital letter, it's an SVG component
16676           */
16677          /[A-Z]/u.test(Component)) {
16678          return true;
16679      }
16680      return false;
16681  }
16682  
16683  
16684  
16685  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/projection/styles/scale-correction.mjs
16686  const scaleCorrectors = {};
16687  function addScaleCorrector(correctors) {
16688      Object.assign(scaleCorrectors, correctors);
16689  }
16690  
16691  
16692  
16693  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/html/utils/transform.mjs
16694  /**
16695   * Generate a list of every possible transform key.
16696   */
16697  const transformPropOrder = [
16698      "transformPerspective",
16699      "x",
16700      "y",
16701      "z",
16702      "translateX",
16703      "translateY",
16704      "translateZ",
16705      "scale",
16706      "scaleX",
16707      "scaleY",
16708      "rotate",
16709      "rotateX",
16710      "rotateY",
16711      "rotateZ",
16712      "skew",
16713      "skewX",
16714      "skewY",
16715  ];
16716  /**
16717   * A quick lookup for transform props.
16718   */
16719  const transformProps = new Set(transformPropOrder);
16720  
16721  
16722  
16723  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/motion/utils/is-forced-motion-value.mjs
16724  
16725  
16726  
16727  function isForcedMotionValue(key, { layout, layoutId }) {
16728      return (transformProps.has(key) ||
16729          key.startsWith("origin") ||
16730          ((layout || layoutId !== undefined) &&
16731              (!!scaleCorrectors[key] || key === "opacity")));
16732  }
16733  
16734  
16735  
16736  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/value/utils/is-motion-value.mjs
16737  const isMotionValue = (value) => Boolean(value && value.getVelocity);
16738  
16739  
16740  
16741  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/html/utils/build-transform.mjs
16742  
16743  
16744  const translateAlias = {
16745      x: "translateX",
16746      y: "translateY",
16747      z: "translateZ",
16748      transformPerspective: "perspective",
16749  };
16750  const numTransforms = transformPropOrder.length;
16751  /**
16752   * Build a CSS transform style from individual x/y/scale etc properties.
16753   *
16754   * This outputs with a default order of transforms/scales/rotations, this can be customised by
16755   * providing a transformTemplate function.
16756   */
16757  function buildTransform(transform, { enableHardwareAcceleration = true, allowTransformNone = true, }, transformIsDefault, transformTemplate) {
16758      // The transform string we're going to build into.
16759      let transformString = "";
16760      /**
16761       * Loop over all possible transforms in order, adding the ones that
16762       * are present to the transform string.
16763       */
16764      for (let i = 0; i < numTransforms; i++) {
16765          const key = transformPropOrder[i];
16766          if (transform[key] !== undefined) {
16767              const transformName = translateAlias[key] || key;
16768              transformString += `$transformName}($transform[key]}) `;
16769          }
16770      }
16771      if (enableHardwareAcceleration && !transform.z) {
16772          transformString += "translateZ(0)";
16773      }
16774      transformString = transformString.trim();
16775      // If we have a custom `transform` template, pass our transform values and
16776      // generated transformString to that before returning
16777      if (transformTemplate) {
16778          transformString = transformTemplate(transform, transformIsDefault ? "" : transformString);
16779      }
16780      else if (allowTransformNone && transformIsDefault) {
16781          transformString = "none";
16782      }
16783      return transformString;
16784  }
16785  
16786  
16787  
16788  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/dom/utils/is-css-variable.mjs
16789  const checkStringStartsWith = (token) => (key) => typeof key === "string" && key.startsWith(token);
16790  const isCSSVariableName = checkStringStartsWith("--");
16791  const startsAsVariableToken = checkStringStartsWith("var(--");
16792  const isCSSVariableToken = (value) => {
16793      const startsWithToken = startsAsVariableToken(value);
16794      if (!startsWithToken)
16795          return false;
16796      // Ensure any comments are stripped from the value as this can harm performance of the regex.
16797      return singleCssVariableRegex.test(value.split("/*")[0].trim());
16798  };
16799  const singleCssVariableRegex = /var\(--(?:[\w-]+\s*|[\w-]+\s*,(?:\s*[^)(\s]|\s*\((?:[^)(]|\([^)(]*\))*\))+\s*)\)$/iu;
16800  
16801  
16802  
16803  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/dom/value-types/get-as-type.mjs
16804  /**
16805   * Provided a value and a ValueType, returns the value as that value type.
16806   */
16807  const getValueAsType = (value, type) => {
16808      return type && typeof value === "number"
16809          ? type.transform(value)
16810          : value;
16811  };
16812  
16813  
16814  
16815  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/clamp.mjs
16816  const clamp_clamp = (min, max, v) => {
16817      if (v > max)
16818          return max;
16819      if (v < min)
16820          return min;
16821      return v;
16822  };
16823  
16824  
16825  
16826  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/value/types/numbers/index.mjs
16827  
16828  
16829  const number = {
16830      test: (v) => typeof v === "number",
16831      parse: parseFloat,
16832      transform: (v) => v,
16833  };
16834  const alpha = {
16835      ...number,
16836      transform: (v) => clamp_clamp(0, 1, v),
16837  };
16838  const scale = {
16839      ...number,
16840      default: 1,
16841  };
16842  
16843  
16844  
16845  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/value/types/utils.mjs
16846  /**
16847   * TODO: When we move from string as a source of truth to data models
16848   * everything in this folder should probably be referred to as models vs types
16849   */
16850  // If this number is a decimal, make it just five decimal places
16851  // to avoid exponents
16852  const sanitize = (v) => Math.round(v * 100000) / 100000;
16853  const floatRegex = /-?(?:\d+(?:\.\d+)?|\.\d+)/gu;
16854  const colorRegex = /(?:#[\da-f]{3,8}|(?:rgb|hsl)a?\((?:-?[\d.]+%?[,\s]+){2}-?[\d.]+%?\s*(?:[,/]\s*)?(?:\b\d+(?:\.\d+)?|\.\d+)?%?\))/giu;
16855  const singleColorRegex = /^(?:#[\da-f]{3,8}|(?:rgb|hsl)a?\((?:-?[\d.]+%?[,\s]+){2}-?[\d.]+%?\s*(?:[,/]\s*)?(?:\b\d+(?:\.\d+)?|\.\d+)?%?\))$/iu;
16856  function isString(v) {
16857      return typeof v === "string";
16858  }
16859  
16860  
16861  
16862  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/value/types/numbers/units.mjs
16863  
16864  
16865  const createUnitType = (unit) => ({
16866      test: (v) => isString(v) && v.endsWith(unit) && v.split(" ").length === 1,
16867      parse: parseFloat,
16868      transform: (v) => `$v}$unit}`,
16869  });
16870  const degrees = createUnitType("deg");
16871  const percent = createUnitType("%");
16872  const px = createUnitType("px");
16873  const vh = createUnitType("vh");
16874  const vw = createUnitType("vw");
16875  const progressPercentage = {
16876      ...percent,
16877      parse: (v) => percent.parse(v) / 100,
16878      transform: (v) => percent.transform(v * 100),
16879  };
16880  
16881  
16882  
16883  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/dom/value-types/type-int.mjs
16884  
16885  
16886  const type_int_int = {
16887      ...number,
16888      transform: Math.round,
16889  };
16890  
16891  
16892  
16893  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/dom/value-types/number.mjs
16894  
16895  
16896  
16897  
16898  const numberValueTypes = {
16899      // Border props
16900      borderWidth: px,
16901      borderTopWidth: px,
16902      borderRightWidth: px,
16903      borderBottomWidth: px,
16904      borderLeftWidth: px,
16905      borderRadius: px,
16906      radius: px,
16907      borderTopLeftRadius: px,
16908      borderTopRightRadius: px,
16909      borderBottomRightRadius: px,
16910      borderBottomLeftRadius: px,
16911      // Positioning props
16912      width: px,
16913      maxWidth: px,
16914      height: px,
16915      maxHeight: px,
16916      size: px,
16917      top: px,
16918      right: px,
16919      bottom: px,
16920      left: px,
16921      // Spacing props
16922      padding: px,
16923      paddingTop: px,
16924      paddingRight: px,
16925      paddingBottom: px,
16926      paddingLeft: px,
16927      margin: px,
16928      marginTop: px,
16929      marginRight: px,
16930      marginBottom: px,
16931      marginLeft: px,
16932      // Transform props
16933      rotate: degrees,
16934      rotateX: degrees,
16935      rotateY: degrees,
16936      rotateZ: degrees,
16937      scale: scale,
16938      scaleX: scale,
16939      scaleY: scale,
16940      scaleZ: scale,
16941      skew: degrees,
16942      skewX: degrees,
16943      skewY: degrees,
16944      distance: px,
16945      translateX: px,
16946      translateY: px,
16947      translateZ: px,
16948      x: px,
16949      y: px,
16950      z: px,
16951      perspective: px,
16952      transformPerspective: px,
16953      opacity: alpha,
16954      originX: progressPercentage,
16955      originY: progressPercentage,
16956      originZ: px,
16957      // Misc
16958      zIndex: type_int_int,
16959      backgroundPositionX: px,
16960      backgroundPositionY: px,
16961      // SVG
16962      fillOpacity: alpha,
16963      strokeOpacity: alpha,
16964      numOctaves: type_int_int,
16965  };
16966  
16967  
16968  
16969  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/html/utils/build-styles.mjs
16970  
16971  
16972  
16973  
16974  
16975  
16976  function buildHTMLStyles(state, latestValues, options, transformTemplate) {
16977      const { style, vars, transform, transformOrigin } = state;
16978      // Track whether we encounter any transform or transformOrigin values.
16979      let hasTransform = false;
16980      let hasTransformOrigin = false;
16981      // Does the calculated transform essentially equal "none"?
16982      let transformIsNone = true;
16983      /**
16984       * Loop over all our latest animated values and decide whether to handle them
16985       * as a style or CSS variable.
16986       *
16987       * Transforms and transform origins are kept seperately for further processing.
16988       */
16989      for (const key in latestValues) {
16990          const value = latestValues[key];
16991          /**
16992           * If this is a CSS variable we don't do any further processing.
16993           */
16994          if (isCSSVariableName(key)) {
16995              vars[key] = value;
16996              continue;
16997          }
16998          // Convert the value to its default value type, ie 0 -> "0px"
16999          const valueType = numberValueTypes[key];
17000          const valueAsType = getValueAsType(value, valueType);
17001          if (transformProps.has(key)) {
17002              // If this is a transform, flag to enable further transform processing
17003              hasTransform = true;
17004              transform[key] = valueAsType;
17005              // If we already know we have a non-default transform, early return
17006              if (!transformIsNone)
17007                  continue;
17008              // Otherwise check to see if this is a default transform
17009              if (value !== (valueType.default || 0))
17010                  transformIsNone = false;
17011          }
17012          else if (key.startsWith("origin")) {
17013              // If this is a transform origin, flag and enable further transform-origin processing
17014              hasTransformOrigin = true;
17015              transformOrigin[key] = valueAsType;
17016          }
17017          else {
17018              style[key] = valueAsType;
17019          }
17020      }
17021      if (!latestValues.transform) {
17022          if (hasTransform || transformTemplate) {
17023              style.transform = buildTransform(state.transform, options, transformIsNone, transformTemplate);
17024          }
17025          else if (style.transform) {
17026              /**
17027               * If we have previously created a transform but currently don't have any,
17028               * reset transform style to none.
17029               */
17030              style.transform = "none";
17031          }
17032      }
17033      /**
17034       * Build a transformOrigin style. Uses the same defaults as the browser for
17035       * undefined origins.
17036       */
17037      if (hasTransformOrigin) {
17038          const { originX = "50%", originY = "50%", originZ = 0, } = transformOrigin;
17039          style.transformOrigin = `$originX} $originY} $originZ}`;
17040      }
17041  }
17042  
17043  
17044  
17045  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/html/utils/create-render-state.mjs
17046  const createHtmlRenderState = () => ({
17047      style: {},
17048      transform: {},
17049      transformOrigin: {},
17050      vars: {},
17051  });
17052  
17053  
17054  
17055  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/html/use-props.mjs
17056  
17057  
17058  
17059  
17060  
17061  
17062  function copyRawValuesOnly(target, source, props) {
17063      for (const key in source) {
17064          if (!isMotionValue(source[key]) && !isForcedMotionValue(key, props)) {
17065              target[key] = source[key];
17066          }
17067      }
17068  }
17069  function useInitialMotionValues({ transformTemplate }, visualState, isStatic) {
17070      return (0,external_React_.useMemo)(() => {
17071          const state = createHtmlRenderState();
17072          buildHTMLStyles(state, visualState, { enableHardwareAcceleration: !isStatic }, transformTemplate);
17073          return Object.assign({}, state.vars, state.style);
17074      }, [visualState]);
17075  }
17076  function useStyle(props, visualState, isStatic) {
17077      const styleProp = props.style || {};
17078      const style = {};
17079      /**
17080       * Copy non-Motion Values straight into style
17081       */
17082      copyRawValuesOnly(style, styleProp, props);
17083      Object.assign(style, useInitialMotionValues(props, visualState, isStatic));
17084      return style;
17085  }
17086  function useHTMLProps(props, visualState, isStatic) {
17087      // The `any` isn't ideal but it is the type of createElement props argument
17088      const htmlProps = {};
17089      const style = useStyle(props, visualState, isStatic);
17090      if (props.drag && props.dragListener !== false) {
17091          // Disable the ghost element when a user drags
17092          htmlProps.draggable = false;
17093          // Disable text selection
17094          style.userSelect =
17095              style.WebkitUserSelect =
17096                  style.WebkitTouchCallout =
17097                      "none";
17098          // Disable scrolling on the draggable direction
17099          style.touchAction =
17100              props.drag === true
17101                  ? "none"
17102                  : `pan-$props.drag === "x" ? "y" : "x"}`;
17103      }
17104      if (props.tabIndex === undefined &&
17105          (props.onTap || props.onTapStart || props.whileTap)) {
17106          htmlProps.tabIndex = 0;
17107      }
17108      htmlProps.style = style;
17109      return htmlProps;
17110  }
17111  
17112  
17113  
17114  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/motion/utils/valid-prop.mjs
17115  /**
17116   * A list of all valid MotionProps.
17117   *
17118   * @privateRemarks
17119   * This doesn't throw if a `MotionProp` name is missing - it should.
17120   */
17121  const validMotionProps = new Set([
17122      "animate",
17123      "exit",
17124      "variants",
17125      "initial",
17126      "style",
17127      "values",
17128      "variants",
17129      "transition",
17130      "transformTemplate",
17131      "custom",
17132      "inherit",
17133      "onBeforeLayoutMeasure",
17134      "onAnimationStart",
17135      "onAnimationComplete",
17136      "onUpdate",
17137      "onDragStart",
17138      "onDrag",
17139      "onDragEnd",
17140      "onMeasureDragConstraints",
17141      "onDirectionLock",
17142      "onDragTransitionEnd",
17143      "_dragX",
17144      "_dragY",
17145      "onHoverStart",
17146      "onHoverEnd",
17147      "onViewportEnter",
17148      "onViewportLeave",
17149      "globalTapTarget",
17150      "ignoreStrict",
17151      "viewport",
17152  ]);
17153  /**
17154   * Check whether a prop name is a valid `MotionProp` key.
17155   *
17156   * @param key - Name of the property to check
17157   * @returns `true` is key is a valid `MotionProp`.
17158   *
17159   * @public
17160   */
17161  function isValidMotionProp(key) {
17162      return (key.startsWith("while") ||
17163          (key.startsWith("drag") && key !== "draggable") ||
17164          key.startsWith("layout") ||
17165          key.startsWith("onTap") ||
17166          key.startsWith("onPan") ||
17167          key.startsWith("onLayout") ||
17168          validMotionProps.has(key));
17169  }
17170  
17171  
17172  
17173  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/dom/utils/filter-props.mjs
17174  
17175  
17176  let shouldForward = (key) => !isValidMotionProp(key);
17177  function loadExternalIsValidProp(isValidProp) {
17178      if (!isValidProp)
17179          return;
17180      // Explicitly filter our events
17181      shouldForward = (key) => key.startsWith("on") ? !isValidMotionProp(key) : isValidProp(key);
17182  }
17183  /**
17184   * Emotion and Styled Components both allow users to pass through arbitrary props to their components
17185   * to dynamically generate CSS. They both use the `@emotion/is-prop-valid` package to determine which
17186   * of these should be passed to the underlying DOM node.
17187   *
17188   * However, when styling a Motion component `styled(motion.div)`, both packages pass through *all* props
17189   * as it's seen as an arbitrary component rather than a DOM node. Motion only allows arbitrary props
17190   * passed through the `custom` prop so it doesn't *need* the payload or computational overhead of
17191   * `@emotion/is-prop-valid`, however to fix this problem we need to use it.
17192   *
17193   * By making it an optionalDependency we can offer this functionality only in the situations where it's
17194   * actually required.
17195   */
17196  try {
17197      /**
17198       * We attempt to import this package but require won't be defined in esm environments, in that case
17199       * isPropValid will have to be provided via `MotionContext`. In a 6.0.0 this should probably be removed
17200       * in favour of explicit injection.
17201       */
17202      loadExternalIsValidProp(require("@emotion/is-prop-valid").default);
17203  }
17204  catch (_a) {
17205      // We don't need to actually do anything here - the fallback is the existing `isPropValid`.
17206  }
17207  function filterProps(props, isDom, forwardMotionProps) {
17208      const filteredProps = {};
17209      for (const key in props) {
17210          /**
17211           * values is considered a valid prop by Emotion, so if it's present
17212           * this will be rendered out to the DOM unless explicitly filtered.
17213           *
17214           * We check the type as it could be used with the `feColorMatrix`
17215           * element, which we support.
17216           */
17217          if (key === "values" && typeof props.values === "object")
17218              continue;
17219          if (shouldForward(key) ||
17220              (forwardMotionProps === true && isValidMotionProp(key)) ||
17221              (!isDom && !isValidMotionProp(key)) ||
17222              // If trying to use native HTML drag events, forward drag listeners
17223              (props["draggable"] &&
17224                  key.startsWith("onDrag"))) {
17225              filteredProps[key] =
17226                  props[key];
17227          }
17228      }
17229      return filteredProps;
17230  }
17231  
17232  
17233  
17234  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/svg/utils/transform-origin.mjs
17235  
17236  
17237  function calcOrigin(origin, offset, size) {
17238      return typeof origin === "string"
17239          ? origin
17240          : px.transform(offset + size * origin);
17241  }
17242  /**
17243   * The SVG transform origin defaults are different to CSS and is less intuitive,
17244   * so we use the measured dimensions of the SVG to reconcile these.
17245   */
17246  function calcSVGTransformOrigin(dimensions, originX, originY) {
17247      const pxOriginX = calcOrigin(originX, dimensions.x, dimensions.width);
17248      const pxOriginY = calcOrigin(originY, dimensions.y, dimensions.height);
17249      return `$pxOriginX} $pxOriginY}`;
17250  }
17251  
17252  
17253  
17254  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/svg/utils/path.mjs
17255  
17256  
17257  const dashKeys = {
17258      offset: "stroke-dashoffset",
17259      array: "stroke-dasharray",
17260  };
17261  const camelKeys = {
17262      offset: "strokeDashoffset",
17263      array: "strokeDasharray",
17264  };
17265  /**
17266   * Build SVG path properties. Uses the path's measured length to convert
17267   * our custom pathLength, pathSpacing and pathOffset into stroke-dashoffset
17268   * and stroke-dasharray attributes.
17269   *
17270   * This function is mutative to reduce per-frame GC.
17271   */
17272  function buildSVGPath(attrs, length, spacing = 1, offset = 0, useDashCase = true) {
17273      // Normalise path length by setting SVG attribute pathLength to 1
17274      attrs.pathLength = 1;
17275      // We use dash case when setting attributes directly to the DOM node and camel case
17276      // when defining props on a React component.
17277      const keys = useDashCase ? dashKeys : camelKeys;
17278      // Build the dash offset
17279      attrs[keys.offset] = px.transform(-offset);
17280      // Build the dash array
17281      const pathLength = px.transform(length);
17282      const pathSpacing = px.transform(spacing);
17283      attrs[keys.array] = `$pathLength} $pathSpacing}`;
17284  }
17285  
17286  
17287  
17288  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/svg/utils/build-attrs.mjs
17289  
17290  
17291  
17292  
17293  /**
17294   * Build SVG visual attrbutes, like cx and style.transform
17295   */
17296  function buildSVGAttrs(state, { attrX, attrY, attrScale, originX, originY, pathLength, pathSpacing = 1, pathOffset = 0, 
17297  // This is object creation, which we try to avoid per-frame.
17298  ...latest }, options, isSVGTag, transformTemplate) {
17299      buildHTMLStyles(state, latest, options, transformTemplate);
17300      /**
17301       * For svg tags we just want to make sure viewBox is animatable and treat all the styles
17302       * as normal HTML tags.
17303       */
17304      if (isSVGTag) {
17305          if (state.style.viewBox) {
17306              state.attrs.viewBox = state.style.viewBox;
17307          }
17308          return;
17309      }
17310      state.attrs = state.style;
17311      state.style = {};
17312      const { attrs, style, dimensions } = state;
17313      /**
17314       * However, we apply transforms as CSS transforms. So if we detect a transform we take it from attrs
17315       * and copy it into style.
17316       */
17317      if (attrs.transform) {
17318          if (dimensions)
17319              style.transform = attrs.transform;
17320          delete attrs.transform;
17321      }
17322      // Parse transformOrigin
17323      if (dimensions &&
17324          (originX !== undefined || originY !== undefined || style.transform)) {
17325          style.transformOrigin = calcSVGTransformOrigin(dimensions, originX !== undefined ? originX : 0.5, originY !== undefined ? originY : 0.5);
17326      }
17327      // Render attrX/attrY/attrScale as attributes
17328      if (attrX !== undefined)
17329          attrs.x = attrX;
17330      if (attrY !== undefined)
17331          attrs.y = attrY;
17332      if (attrScale !== undefined)
17333          attrs.scale = attrScale;
17334      // Build SVG path if one has been defined
17335      if (pathLength !== undefined) {
17336          buildSVGPath(attrs, pathLength, pathSpacing, pathOffset, false);
17337      }
17338  }
17339  
17340  
17341  
17342  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/svg/utils/create-render-state.mjs
17343  
17344  
17345  const createSvgRenderState = () => ({
17346      ...createHtmlRenderState(),
17347      attrs: {},
17348  });
17349  
17350  
17351  
17352  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/svg/utils/is-svg-tag.mjs
17353  const isSVGTag = (tag) => typeof tag === "string" && tag.toLowerCase() === "svg";
17354  
17355  
17356  
17357  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/svg/use-props.mjs
17358  
17359  
17360  
17361  
17362  
17363  
17364  function useSVGProps(props, visualState, _isStatic, Component) {
17365      const visualProps = (0,external_React_.useMemo)(() => {
17366          const state = createSvgRenderState();
17367          buildSVGAttrs(state, visualState, { enableHardwareAcceleration: false }, isSVGTag(Component), props.transformTemplate);
17368          return {
17369              ...state.attrs,
17370              style: { ...state.style },
17371          };
17372      }, [visualState]);
17373      if (props.style) {
17374          const rawStyles = {};
17375          copyRawValuesOnly(rawStyles, props.style, props);
17376          visualProps.style = { ...rawStyles, ...visualProps.style };
17377      }
17378      return visualProps;
17379  }
17380  
17381  
17382  
17383  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/dom/use-render.mjs
17384  
17385  
17386  
17387  
17388  
17389  
17390  
17391  function createUseRender(forwardMotionProps = false) {
17392      const useRender = (Component, props, ref, { latestValues }, isStatic) => {
17393          const useVisualProps = isSVGComponent(Component)
17394              ? useSVGProps
17395              : useHTMLProps;
17396          const visualProps = useVisualProps(props, latestValues, isStatic, Component);
17397          const filteredProps = filterProps(props, typeof Component === "string", forwardMotionProps);
17398          const elementProps = Component !== external_React_.Fragment
17399              ? { ...filteredProps, ...visualProps, ref }
17400              : {};
17401          /**
17402           * If component has been handed a motion value as its child,
17403           * memoise its initial value and render that. Subsequent updates
17404           * will be handled by the onChange handler
17405           */
17406          const { children } = props;
17407          const renderedChildren = (0,external_React_.useMemo)(() => (isMotionValue(children) ? children.get() : children), [children]);
17408          return (0,external_React_.createElement)(Component, {
17409              ...elementProps,
17410              children: renderedChildren,
17411          });
17412      };
17413      return useRender;
17414  }
17415  
17416  
17417  
17418  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/html/utils/render.mjs
17419  function renderHTML(element, { style, vars }, styleProp, projection) {
17420      Object.assign(element.style, style, projection && projection.getProjectionStyles(styleProp));
17421      // Loop over any CSS variables and assign those.
17422      for (const key in vars) {
17423          element.style.setProperty(key, vars[key]);
17424      }
17425  }
17426  
17427  
17428  
17429  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/svg/utils/camel-case-attrs.mjs
17430  /**
17431   * A set of attribute names that are always read/written as camel case.
17432   */
17433  const camelCaseAttributes = new Set([
17434      "baseFrequency",
17435      "diffuseConstant",
17436      "kernelMatrix",
17437      "kernelUnitLength",
17438      "keySplines",
17439      "keyTimes",
17440      "limitingConeAngle",
17441      "markerHeight",
17442      "markerWidth",
17443      "numOctaves",
17444      "targetX",
17445      "targetY",
17446      "surfaceScale",
17447      "specularConstant",
17448      "specularExponent",
17449      "stdDeviation",
17450      "tableValues",
17451      "viewBox",
17452      "gradientTransform",
17453      "pathLength",
17454      "startOffset",
17455      "textLength",
17456      "lengthAdjust",
17457  ]);
17458  
17459  
17460  
17461  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/svg/utils/render.mjs
17462  
17463  
17464  
17465  
17466  function renderSVG(element, renderState, _styleProp, projection) {
17467      renderHTML(element, renderState, undefined, projection);
17468      for (const key in renderState.attrs) {
17469          element.setAttribute(!camelCaseAttributes.has(key) ? camelToDash(key) : key, renderState.attrs[key]);
17470      }
17471  }
17472  
17473  
17474  
17475  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/html/utils/scrape-motion-values.mjs
17476  
17477  
17478  
17479  function scrapeMotionValuesFromProps(props, prevProps, visualElement) {
17480      var _a;
17481      const { style } = props;
17482      const newValues = {};
17483      for (const key in style) {
17484          if (isMotionValue(style[key]) ||
17485              (prevProps.style &&
17486                  isMotionValue(prevProps.style[key])) ||
17487              isForcedMotionValue(key, props) ||
17488              ((_a = visualElement === null || visualElement === void 0 ? void 0 : visualElement.getValue(key)) === null || _a === void 0 ? void 0 : _a.liveStyle) !== undefined) {
17489              newValues[key] = style[key];
17490          }
17491      }
17492      return newValues;
17493  }
17494  
17495  
17496  
17497  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/svg/utils/scrape-motion-values.mjs
17498  
17499  
17500  
17501  
17502  function scrape_motion_values_scrapeMotionValuesFromProps(props, prevProps, visualElement) {
17503      const newValues = scrapeMotionValuesFromProps(props, prevProps, visualElement);
17504      for (const key in props) {
17505          if (isMotionValue(props[key]) ||
17506              isMotionValue(prevProps[key])) {
17507              const targetKey = transformPropOrder.indexOf(key) !== -1
17508                  ? "attr" + key.charAt(0).toUpperCase() + key.substring(1)
17509                  : key;
17510              newValues[targetKey] = props[key];
17511          }
17512      }
17513      return newValues;
17514  }
17515  
17516  
17517  
17518  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/utils/resolve-variants.mjs
17519  function getValueState(visualElement) {
17520      const state = [{}, {}];
17521      visualElement === null || visualElement === void 0 ? void 0 : visualElement.values.forEach((value, key) => {
17522          state[0][key] = value.get();
17523          state[1][key] = value.getVelocity();
17524      });
17525      return state;
17526  }
17527  function resolveVariantFromProps(props, definition, custom, visualElement) {
17528      /**
17529       * If the variant definition is a function, resolve.
17530       */
17531      if (typeof definition === "function") {
17532          const [current, velocity] = getValueState(visualElement);
17533          definition = definition(custom !== undefined ? custom : props.custom, current, velocity);
17534      }
17535      /**
17536       * If the variant definition is a variant label, or
17537       * the function returned a variant label, resolve.
17538       */
17539      if (typeof definition === "string") {
17540          definition = props.variants && props.variants[definition];
17541      }
17542      /**
17543       * At this point we've resolved both functions and variant labels,
17544       * but the resolved variant label might itself have been a function.
17545       * If so, resolve. This can only have returned a valid target object.
17546       */
17547      if (typeof definition === "function") {
17548          const [current, velocity] = getValueState(visualElement);
17549          definition = definition(custom !== undefined ? custom : props.custom, current, velocity);
17550      }
17551      return definition;
17552  }
17553  
17554  
17555  
17556  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/use-constant.mjs
17557  
17558  
17559  /**
17560   * Creates a constant value over the lifecycle of a component.
17561   *
17562   * Even if `useMemo` is provided an empty array as its final argument, it doesn't offer
17563   * a guarantee that it won't re-run for performance reasons later on. By using `useConstant`
17564   * you can ensure that initialisers don't execute twice or more.
17565   */
17566  function useConstant(init) {
17567      const ref = (0,external_React_.useRef)(null);
17568      if (ref.current === null) {
17569          ref.current = init();
17570      }
17571      return ref.current;
17572  }
17573  
17574  
17575  
17576  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/animation/utils/is-keyframes-target.mjs
17577  const isKeyframesTarget = (v) => {
17578      return Array.isArray(v);
17579  };
17580  
17581  
17582  
17583  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/resolve-value.mjs
17584  
17585  
17586  const isCustomValue = (v) => {
17587      return Boolean(v && typeof v === "object" && v.mix && v.toValue);
17588  };
17589  const resolveFinalValueInKeyframes = (v) => {
17590      // TODO maybe throw if v.length - 1 is placeholder token?
17591      return isKeyframesTarget(v) ? v[v.length - 1] || 0 : v;
17592  };
17593  
17594  
17595  
17596  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/value/utils/resolve-motion-value.mjs
17597  
17598  
17599  
17600  /**
17601   * If the provided value is a MotionValue, this returns the actual value, otherwise just the value itself
17602   *
17603   * TODO: Remove and move to library
17604   */
17605  function resolveMotionValue(value) {
17606      const unwrappedValue = isMotionValue(value) ? value.get() : value;
17607      return isCustomValue(unwrappedValue)
17608          ? unwrappedValue.toValue()
17609          : unwrappedValue;
17610  }
17611  
17612  
17613  
17614  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/motion/utils/use-visual-state.mjs
17615  
17616  
17617  
17618  
17619  
17620  
17621  
17622  
17623  
17624  function makeState({ scrapeMotionValuesFromProps, createRenderState, onMount, }, props, context, presenceContext) {
17625      const state = {
17626          latestValues: makeLatestValues(props, context, presenceContext, scrapeMotionValuesFromProps),
17627          renderState: createRenderState(),
17628      };
17629      if (onMount) {
17630          state.mount = (instance) => onMount(props, instance, state);
17631      }
17632      return state;
17633  }
17634  const makeUseVisualState = (config) => (props, isStatic) => {
17635      const context = (0,external_React_.useContext)(MotionContext);
17636      const presenceContext = (0,external_React_.useContext)(PresenceContext_PresenceContext);
17637      const make = () => makeState(config, props, context, presenceContext);
17638      return isStatic ? make() : useConstant(make);
17639  };
17640  function makeLatestValues(props, context, presenceContext, scrapeMotionValues) {
17641      const values = {};
17642      const motionValues = scrapeMotionValues(props, {});
17643      for (const key in motionValues) {
17644          values[key] = resolveMotionValue(motionValues[key]);
17645      }
17646      let { initial, animate } = props;
17647      const isControllingVariants$1 = isControllingVariants(props);
17648      const isVariantNode$1 = isVariantNode(props);
17649      if (context &&
17650          isVariantNode$1 &&
17651          !isControllingVariants$1 &&
17652          props.inherit !== false) {
17653          if (initial === undefined)
17654              initial = context.initial;
17655          if (animate === undefined)
17656              animate = context.animate;
17657      }
17658      let isInitialAnimationBlocked = presenceContext
17659          ? presenceContext.initial === false
17660          : false;
17661      isInitialAnimationBlocked = isInitialAnimationBlocked || initial === false;
17662      const variantToSet = isInitialAnimationBlocked ? animate : initial;
17663      if (variantToSet &&
17664          typeof variantToSet !== "boolean" &&
17665          !isAnimationControls(variantToSet)) {
17666          const list = Array.isArray(variantToSet) ? variantToSet : [variantToSet];
17667          list.forEach((definition) => {
17668              const resolved = resolveVariantFromProps(props, definition);
17669              if (!resolved)
17670                  return;
17671              const { transitionEnd, transition, ...target } = resolved;
17672              for (const key in target) {
17673                  let valueTarget = target[key];
17674                  if (Array.isArray(valueTarget)) {
17675                      /**
17676                       * Take final keyframe if the initial animation is blocked because
17677                       * we want to initialise at the end of that blocked animation.
17678                       */
17679                      const index = isInitialAnimationBlocked
17680                          ? valueTarget.length - 1
17681                          : 0;
17682                      valueTarget = valueTarget[index];
17683                  }
17684                  if (valueTarget !== null) {
17685                      values[key] = valueTarget;
17686                  }
17687              }
17688              for (const key in transitionEnd)
17689                  values[key] = transitionEnd[key];
17690          });
17691      }
17692      return values;
17693  }
17694  
17695  
17696  
17697  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/noop.mjs
17698  const noop_noop = (any) => any;
17699  
17700  
17701  
17702  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/frameloop/frame.mjs
17703  
17704  
17705  
17706  const { schedule: frame_frame, cancel: cancelFrame, state: frameData, steps, } = createRenderBatcher(typeof requestAnimationFrame !== "undefined" ? requestAnimationFrame : noop_noop, true);
17707  
17708  
17709  
17710  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/svg/config-motion.mjs
17711  
17712  
17713  
17714  
17715  
17716  
17717  
17718  
17719  const svgMotionConfig = {
17720      useVisualState: makeUseVisualState({
17721          scrapeMotionValuesFromProps: scrape_motion_values_scrapeMotionValuesFromProps,
17722          createRenderState: createSvgRenderState,
17723          onMount: (props, instance, { renderState, latestValues }) => {
17724              frame_frame.read(() => {
17725                  try {
17726                      renderState.dimensions =
17727                          typeof instance.getBBox ===
17728                              "function"
17729                              ? instance.getBBox()
17730                              : instance.getBoundingClientRect();
17731                  }
17732                  catch (e) {
17733                      // Most likely trying to measure an unrendered element under Firefox
17734                      renderState.dimensions = {
17735                          x: 0,
17736                          y: 0,
17737                          width: 0,
17738                          height: 0,
17739                      };
17740                  }
17741              });
17742              frame_frame.render(() => {
17743                  buildSVGAttrs(renderState, latestValues, { enableHardwareAcceleration: false }, isSVGTag(instance.tagName), props.transformTemplate);
17744                  renderSVG(instance, renderState);
17745              });
17746          },
17747      }),
17748  };
17749  
17750  
17751  
17752  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/html/config-motion.mjs
17753  
17754  
17755  
17756  
17757  const htmlMotionConfig = {
17758      useVisualState: makeUseVisualState({
17759          scrapeMotionValuesFromProps: scrapeMotionValuesFromProps,
17760          createRenderState: createHtmlRenderState,
17761      }),
17762  };
17763  
17764  
17765  
17766  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/dom/utils/create-config.mjs
17767  
17768  
17769  
17770  
17771  
17772  function create_config_createDomMotionConfig(Component, { forwardMotionProps = false }, preloadedFeatures, createVisualElement) {
17773      const baseConfig = isSVGComponent(Component)
17774          ? svgMotionConfig
17775          : htmlMotionConfig;
17776      return {
17777          ...baseConfig,
17778          preloadedFeatures,
17779          useRender: createUseRender(forwardMotionProps),
17780          createVisualElement,
17781          Component,
17782      };
17783  }
17784  
17785  
17786  
17787  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/events/add-dom-event.mjs
17788  function addDomEvent(target, eventName, handler, options = { passive: true }) {
17789      target.addEventListener(eventName, handler, options);
17790      return () => target.removeEventListener(eventName, handler);
17791  }
17792  
17793  
17794  
17795  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/events/utils/is-primary-pointer.mjs
17796  const isPrimaryPointer = (event) => {
17797      if (event.pointerType === "mouse") {
17798          return typeof event.button !== "number" || event.button <= 0;
17799      }
17800      else {
17801          /**
17802           * isPrimary is true for all mice buttons, whereas every touch point
17803           * is regarded as its own input. So subsequent concurrent touch points
17804           * will be false.
17805           *
17806           * Specifically match against false here as incomplete versions of
17807           * PointerEvents in very old browser might have it set as undefined.
17808           */
17809          return event.isPrimary !== false;
17810      }
17811  };
17812  
17813  
17814  
17815  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/events/event-info.mjs
17816  
17817  
17818  function extractEventInfo(event, pointType = "page") {
17819      return {
17820          point: {
17821              x: event[`$pointType}X`],
17822              y: event[`$pointType}Y`],
17823          },
17824      };
17825  }
17826  const addPointerInfo = (handler) => {
17827      return (event) => isPrimaryPointer(event) && handler(event, extractEventInfo(event));
17828  };
17829  
17830  
17831  
17832  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/events/add-pointer-event.mjs
17833  
17834  
17835  
17836  function addPointerEvent(target, eventName, handler, options) {
17837      return addDomEvent(target, eventName, addPointerInfo(handler), options);
17838  }
17839  
17840  
17841  
17842  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/pipe.mjs
17843  /**
17844   * Pipe
17845   * Compose other transformers to run linearily
17846   * pipe(min(20), max(40))
17847   * @param  {...functions} transformers
17848   * @return {function}
17849   */
17850  const combineFunctions = (a, b) => (v) => b(a(v));
17851  const pipe = (...transformers) => transformers.reduce(combineFunctions);
17852  
17853  
17854  
17855  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/gestures/drag/utils/lock.mjs
17856  function createLock(name) {
17857      let lock = null;
17858      return () => {
17859          const openLock = () => {
17860              lock = null;
17861          };
17862          if (lock === null) {
17863              lock = name;
17864              return openLock;
17865          }
17866          return false;
17867      };
17868  }
17869  const globalHorizontalLock = createLock("dragHorizontal");
17870  const globalVerticalLock = createLock("dragVertical");
17871  function getGlobalLock(drag) {
17872      let lock = false;
17873      if (drag === "y") {
17874          lock = globalVerticalLock();
17875      }
17876      else if (drag === "x") {
17877          lock = globalHorizontalLock();
17878      }
17879      else {
17880          const openHorizontal = globalHorizontalLock();
17881          const openVertical = globalVerticalLock();
17882          if (openHorizontal && openVertical) {
17883              lock = () => {
17884                  openHorizontal();
17885                  openVertical();
17886              };
17887          }
17888          else {
17889              // Release the locks because we don't use them
17890              if (openHorizontal)
17891                  openHorizontal();
17892              if (openVertical)
17893                  openVertical();
17894          }
17895      }
17896      return lock;
17897  }
17898  function isDragActive() {
17899      // Check the gesture lock - if we get it, it means no drag gesture is active
17900      // and we can safely fire the tap gesture.
17901      const openGestureLock = getGlobalLock(true);
17902      if (!openGestureLock)
17903          return true;
17904      openGestureLock();
17905      return false;
17906  }
17907  
17908  
17909  
17910  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/motion/features/Feature.mjs
17911  class Feature {
17912      constructor(node) {
17913          this.isMounted = false;
17914          this.node = node;
17915      }
17916      update() { }
17917  }
17918  
17919  
17920  
17921  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/gestures/hover.mjs
17922  
17923  
17924  
17925  
17926  
17927  
17928  function addHoverEvent(node, isActive) {
17929      const eventName = isActive ? "pointerenter" : "pointerleave";
17930      const callbackName = isActive ? "onHoverStart" : "onHoverEnd";
17931      const handleEvent = (event, info) => {
17932          if (event.pointerType === "touch" || isDragActive())
17933              return;
17934          const props = node.getProps();
17935          if (node.animationState && props.whileHover) {
17936              node.animationState.setActive("whileHover", isActive);
17937          }
17938          const callback = props[callbackName];
17939          if (callback) {
17940              frame_frame.postRender(() => callback(event, info));
17941          }
17942      };
17943      return addPointerEvent(node.current, eventName, handleEvent, {
17944          passive: !node.getProps()[callbackName],
17945      });
17946  }
17947  class HoverGesture extends Feature {
17948      mount() {
17949          this.unmount = pipe(addHoverEvent(this.node, true), addHoverEvent(this.node, false));
17950      }
17951      unmount() { }
17952  }
17953  
17954  
17955  
17956  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/gestures/focus.mjs
17957  
17958  
17959  
17960  
17961  class FocusGesture extends Feature {
17962      constructor() {
17963          super(...arguments);
17964          this.isActive = false;
17965      }
17966      onFocus() {
17967          let isFocusVisible = false;
17968          /**
17969           * If this element doesn't match focus-visible then don't
17970           * apply whileHover. But, if matches throws that focus-visible
17971           * is not a valid selector then in that browser outline styles will be applied
17972           * to the element by default and we want to match that behaviour with whileFocus.
17973           */
17974          try {
17975              isFocusVisible = this.node.current.matches(":focus-visible");
17976          }
17977          catch (e) {
17978              isFocusVisible = true;
17979          }
17980          if (!isFocusVisible || !this.node.animationState)
17981              return;
17982          this.node.animationState.setActive("whileFocus", true);
17983          this.isActive = true;
17984      }
17985      onBlur() {
17986          if (!this.isActive || !this.node.animationState)
17987              return;
17988          this.node.animationState.setActive("whileFocus", false);
17989          this.isActive = false;
17990      }
17991      mount() {
17992          this.unmount = pipe(addDomEvent(this.node.current, "focus", () => this.onFocus()), addDomEvent(this.node.current, "blur", () => this.onBlur()));
17993      }
17994      unmount() { }
17995  }
17996  
17997  
17998  
17999  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/gestures/utils/is-node-or-child.mjs
18000  /**
18001   * Recursively traverse up the tree to check whether the provided child node
18002   * is the parent or a descendant of it.
18003   *
18004   * @param parent - Element to find
18005   * @param child - Element to test against parent
18006   */
18007  const isNodeOrChild = (parent, child) => {
18008      if (!child) {
18009          return false;
18010      }
18011      else if (parent === child) {
18012          return true;
18013      }
18014      else {
18015          return isNodeOrChild(parent, child.parentElement);
18016      }
18017  };
18018  
18019  
18020  
18021  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/gestures/press.mjs
18022  
18023  
18024  
18025  
18026  
18027  
18028  
18029  
18030  
18031  
18032  function fireSyntheticPointerEvent(name, handler) {
18033      if (!handler)
18034          return;
18035      const syntheticPointerEvent = new PointerEvent("pointer" + name);
18036      handler(syntheticPointerEvent, extractEventInfo(syntheticPointerEvent));
18037  }
18038  class PressGesture extends Feature {
18039      constructor() {
18040          super(...arguments);
18041          this.removeStartListeners = noop_noop;
18042          this.removeEndListeners = noop_noop;
18043          this.removeAccessibleListeners = noop_noop;
18044          this.startPointerPress = (startEvent, startInfo) => {
18045              if (this.isPressing)
18046                  return;
18047              this.removeEndListeners();
18048              const props = this.node.getProps();
18049              const endPointerPress = (endEvent, endInfo) => {
18050                  if (!this.checkPressEnd())
18051                      return;
18052                  const { onTap, onTapCancel, globalTapTarget } = this.node.getProps();
18053                  /**
18054                   * We only count this as a tap gesture if the event.target is the same
18055                   * as, or a child of, this component's element
18056                   */
18057                  const handler = !globalTapTarget &&
18058                      !isNodeOrChild(this.node.current, endEvent.target)
18059                      ? onTapCancel
18060                      : onTap;
18061                  if (handler) {
18062                      frame_frame.update(() => handler(endEvent, endInfo));
18063                  }
18064              };
18065              const removePointerUpListener = addPointerEvent(window, "pointerup", endPointerPress, {
18066                  passive: !(props.onTap || props["onPointerUp"]),
18067              });
18068              const removePointerCancelListener = addPointerEvent(window, "pointercancel", (cancelEvent, cancelInfo) => this.cancelPress(cancelEvent, cancelInfo), {
18069                  passive: !(props.onTapCancel ||
18070                      props["onPointerCancel"]),
18071              });
18072              this.removeEndListeners = pipe(removePointerUpListener, removePointerCancelListener);
18073              this.startPress(startEvent, startInfo);
18074          };
18075          this.startAccessiblePress = () => {
18076              const handleKeydown = (keydownEvent) => {
18077                  if (keydownEvent.key !== "Enter" || this.isPressing)
18078                      return;
18079                  const handleKeyup = (keyupEvent) => {
18080                      if (keyupEvent.key !== "Enter" || !this.checkPressEnd())
18081                          return;
18082                      fireSyntheticPointerEvent("up", (event, info) => {
18083                          const { onTap } = this.node.getProps();
18084                          if (onTap) {
18085                              frame_frame.postRender(() => onTap(event, info));
18086                          }
18087                      });
18088                  };
18089                  this.removeEndListeners();
18090                  this.removeEndListeners = addDomEvent(this.node.current, "keyup", handleKeyup);
18091                  fireSyntheticPointerEvent("down", (event, info) => {
18092                      this.startPress(event, info);
18093                  });
18094              };
18095              const removeKeydownListener = addDomEvent(this.node.current, "keydown", handleKeydown);
18096              const handleBlur = () => {
18097                  if (!this.isPressing)
18098                      return;
18099                  fireSyntheticPointerEvent("cancel", (cancelEvent, cancelInfo) => this.cancelPress(cancelEvent, cancelInfo));
18100              };
18101              const removeBlurListener = addDomEvent(this.node.current, "blur", handleBlur);
18102              this.removeAccessibleListeners = pipe(removeKeydownListener, removeBlurListener);
18103          };
18104      }
18105      startPress(event, info) {
18106          this.isPressing = true;
18107          const { onTapStart, whileTap } = this.node.getProps();
18108          /**
18109           * Ensure we trigger animations before firing event callback
18110           */
18111          if (whileTap && this.node.animationState) {
18112              this.node.animationState.setActive("whileTap", true);
18113          }
18114          if (onTapStart) {
18115              frame_frame.postRender(() => onTapStart(event, info));
18116          }
18117      }
18118      checkPressEnd() {
18119          this.removeEndListeners();
18120          this.isPressing = false;
18121          const props = this.node.getProps();
18122          if (props.whileTap && this.node.animationState) {
18123              this.node.animationState.setActive("whileTap", false);
18124          }
18125          return !isDragActive();
18126      }
18127      cancelPress(event, info) {
18128          if (!this.checkPressEnd())
18129              return;
18130          const { onTapCancel } = this.node.getProps();
18131          if (onTapCancel) {
18132              frame_frame.postRender(() => onTapCancel(event, info));
18133          }
18134      }
18135      mount() {
18136          const props = this.node.getProps();
18137          const removePointerListener = addPointerEvent(props.globalTapTarget ? window : this.node.current, "pointerdown", this.startPointerPress, {
18138              passive: !(props.onTapStart ||
18139                  props["onPointerStart"]),
18140          });
18141          const removeFocusListener = addDomEvent(this.node.current, "focus", this.startAccessiblePress);
18142          this.removeStartListeners = pipe(removePointerListener, removeFocusListener);
18143      }
18144      unmount() {
18145          this.removeStartListeners();
18146          this.removeEndListeners();
18147          this.removeAccessibleListeners();
18148      }
18149  }
18150  
18151  
18152  
18153  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/motion/features/viewport/observers.mjs
18154  /**
18155   * Map an IntersectionHandler callback to an element. We only ever make one handler for one
18156   * element, so even though these handlers might all be triggered by different
18157   * observers, we can keep them in the same map.
18158   */
18159  const observerCallbacks = new WeakMap();
18160  /**
18161   * Multiple observers can be created for multiple element/document roots. Each with
18162   * different settings. So here we store dictionaries of observers to each root,
18163   * using serialised settings (threshold/margin) as lookup keys.
18164   */
18165  const observers = new WeakMap();
18166  const fireObserverCallback = (entry) => {
18167      const callback = observerCallbacks.get(entry.target);
18168      callback && callback(entry);
18169  };
18170  const fireAllObserverCallbacks = (entries) => {
18171      entries.forEach(fireObserverCallback);
18172  };
18173  function initIntersectionObserver({ root, ...options }) {
18174      const lookupRoot = root || document;
18175      /**
18176       * If we don't have an observer lookup map for this root, create one.
18177       */
18178      if (!observers.has(lookupRoot)) {
18179          observers.set(lookupRoot, {});
18180      }
18181      const rootObservers = observers.get(lookupRoot);
18182      const key = JSON.stringify(options);
18183      /**
18184       * If we don't have an observer for this combination of root and settings,
18185       * create one.
18186       */
18187      if (!rootObservers[key]) {
18188          rootObservers[key] = new IntersectionObserver(fireAllObserverCallbacks, { root, ...options });
18189      }
18190      return rootObservers[key];
18191  }
18192  function observeIntersection(element, options, callback) {
18193      const rootInteresectionObserver = initIntersectionObserver(options);
18194      observerCallbacks.set(element, callback);
18195      rootInteresectionObserver.observe(element);
18196      return () => {
18197          observerCallbacks.delete(element);
18198          rootInteresectionObserver.unobserve(element);
18199      };
18200  }
18201  
18202  
18203  
18204  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/motion/features/viewport/index.mjs
18205  
18206  
18207  
18208  const thresholdNames = {
18209      some: 0,
18210      all: 1,
18211  };
18212  class InViewFeature extends Feature {
18213      constructor() {
18214          super(...arguments);
18215          this.hasEnteredView = false;
18216          this.isInView = false;
18217      }
18218      startObserver() {
18219          this.unmount();
18220          const { viewport = {} } = this.node.getProps();
18221          const { root, margin: rootMargin, amount = "some", once } = viewport;
18222          const options = {
18223              root: root ? root.current : undefined,
18224              rootMargin,
18225              threshold: typeof amount === "number" ? amount : thresholdNames[amount],
18226          };
18227          const onIntersectionUpdate = (entry) => {
18228              const { isIntersecting } = entry;
18229              /**
18230               * If there's been no change in the viewport state, early return.
18231               */
18232              if (this.isInView === isIntersecting)
18233                  return;
18234              this.isInView = isIntersecting;
18235              /**
18236               * Handle hasEnteredView. If this is only meant to run once, and
18237               * element isn't visible, early return. Otherwise set hasEnteredView to true.
18238               */
18239              if (once && !isIntersecting && this.hasEnteredView) {
18240                  return;
18241              }
18242              else if (isIntersecting) {
18243                  this.hasEnteredView = true;
18244              }
18245              if (this.node.animationState) {
18246                  this.node.animationState.setActive("whileInView", isIntersecting);
18247              }
18248              /**
18249               * Use the latest committed props rather than the ones in scope
18250               * when this observer is created
18251               */
18252              const { onViewportEnter, onViewportLeave } = this.node.getProps();
18253              const callback = isIntersecting ? onViewportEnter : onViewportLeave;
18254              callback && callback(entry);
18255          };
18256          return observeIntersection(this.node.current, options, onIntersectionUpdate);
18257      }
18258      mount() {
18259          this.startObserver();
18260      }
18261      update() {
18262          if (typeof IntersectionObserver === "undefined")
18263              return;
18264          const { props, prevProps } = this.node;
18265          const hasOptionsChanged = ["amount", "margin", "root"].some(hasViewportOptionChanged(props, prevProps));
18266          if (hasOptionsChanged) {
18267              this.startObserver();
18268          }
18269      }
18270      unmount() { }
18271  }
18272  function hasViewportOptionChanged({ viewport = {} }, { viewport: prevViewport = {} } = {}) {
18273      return (name) => viewport[name] !== prevViewport[name];
18274  }
18275  
18276  
18277  
18278  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/motion/features/gestures.mjs
18279  
18280  
18281  
18282  
18283  
18284  const gestureAnimations = {
18285      inView: {
18286          Feature: InViewFeature,
18287      },
18288      tap: {
18289          Feature: PressGesture,
18290      },
18291      focus: {
18292          Feature: FocusGesture,
18293      },
18294      hover: {
18295          Feature: HoverGesture,
18296      },
18297  };
18298  
18299  
18300  
18301  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/shallow-compare.mjs
18302  function shallowCompare(next, prev) {
18303      if (!Array.isArray(prev))
18304          return false;
18305      const prevLength = prev.length;
18306      if (prevLength !== next.length)
18307          return false;
18308      for (let i = 0; i < prevLength; i++) {
18309          if (prev[i] !== next[i])
18310              return false;
18311      }
18312      return true;
18313  }
18314  
18315  
18316  
18317  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/utils/resolve-dynamic-variants.mjs
18318  
18319  
18320  function resolveVariant(visualElement, definition, custom) {
18321      const props = visualElement.getProps();
18322      return resolveVariantFromProps(props, definition, custom !== undefined ? custom : props.custom, visualElement);
18323  }
18324  
18325  
18326  
18327  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/time-conversion.mjs
18328  /**
18329   * Converts seconds to milliseconds
18330   *
18331   * @param seconds - Time in seconds.
18332   * @return milliseconds - Converted time in milliseconds.
18333   */
18334  const secondsToMilliseconds = (seconds) => seconds * 1000;
18335  const millisecondsToSeconds = (milliseconds) => milliseconds / 1000;
18336  
18337  
18338  
18339  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/animation/utils/default-transitions.mjs
18340  
18341  
18342  const underDampedSpring = {
18343      type: "spring",
18344      stiffness: 500,
18345      damping: 25,
18346      restSpeed: 10,
18347  };
18348  const criticallyDampedSpring = (target) => ({
18349      type: "spring",
18350      stiffness: 550,
18351      damping: target === 0 ? 2 * Math.sqrt(550) : 30,
18352      restSpeed: 10,
18353  });
18354  const keyframesTransition = {
18355      type: "keyframes",
18356      duration: 0.8,
18357  };
18358  /**
18359   * Default easing curve is a slightly shallower version of
18360   * the default browser easing curve.
18361   */
18362  const ease = {
18363      type: "keyframes",
18364      ease: [0.25, 0.1, 0.35, 1],
18365      duration: 0.3,
18366  };
18367  const getDefaultTransition = (valueKey, { keyframes }) => {
18368      if (keyframes.length > 2) {
18369          return keyframesTransition;
18370      }
18371      else if (transformProps.has(valueKey)) {
18372          return valueKey.startsWith("scale")
18373              ? criticallyDampedSpring(keyframes[1])
18374              : underDampedSpring;
18375      }
18376      return ease;
18377  };
18378  
18379  
18380  
18381  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/animation/utils/transitions.mjs
18382  /**
18383   * Decide whether a transition is defined on a given Transition.
18384   * This filters out orchestration options and returns true
18385   * if any options are left.
18386   */
18387  function isTransitionDefined({ when, delay: _delay, delayChildren, staggerChildren, staggerDirection, repeat, repeatType, repeatDelay, from, elapsed, ...transition }) {
18388      return !!Object.keys(transition).length;
18389  }
18390  function getValueTransition(transition, key) {
18391      return (transition[key] ||
18392          transition["default"] ||
18393          transition);
18394  }
18395  
18396  
18397  
18398  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/use-instant-transition-state.mjs
18399  const instantAnimationState = {
18400      current: false,
18401  };
18402  
18403  
18404  
18405  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/animation/animators/waapi/utils/get-final-keyframe.mjs
18406  const isNotNull = (value) => value !== null;
18407  function getFinalKeyframe(keyframes, { repeat, repeatType = "loop" }, finalKeyframe) {
18408      const resolvedKeyframes = keyframes.filter(isNotNull);
18409      const index = repeat && repeatType !== "loop" && repeat % 2 === 1
18410          ? 0
18411          : resolvedKeyframes.length - 1;
18412      return !index || finalKeyframe === undefined
18413          ? resolvedKeyframes[index]
18414          : finalKeyframe;
18415  }
18416  
18417  
18418  
18419  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/frameloop/sync-time.mjs
18420  
18421  
18422  
18423  let now;
18424  function clearTime() {
18425      now = undefined;
18426  }
18427  /**
18428   * An eventloop-synchronous alternative to performance.now().
18429   *
18430   * Ensures that time measurements remain consistent within a synchronous context.
18431   * Usually calling performance.now() twice within the same synchronous context
18432   * will return different values which isn't useful for animations when we're usually
18433   * trying to sync animations to the same frame.
18434   */
18435  const time = {
18436      now: () => {
18437          if (now === undefined) {
18438              time.set(frameData.isProcessing || MotionGlobalConfig.useManualTiming
18439                  ? frameData.timestamp
18440                  : performance.now());
18441          }
18442          return now;
18443      },
18444      set: (newTime) => {
18445          now = newTime;
18446          queueMicrotask(clearTime);
18447      },
18448  };
18449  
18450  
18451  
18452  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/is-zero-value-string.mjs
18453  /**
18454   * Check if the value is a zero value string like "0px" or "0%"
18455   */
18456  const isZeroValueString = (v) => /^0[^.\s]+$/u.test(v);
18457  
18458  
18459  
18460  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/animation/utils/is-none.mjs
18461  
18462  
18463  function isNone(value) {
18464      if (typeof value === "number") {
18465          return value === 0;
18466      }
18467      else if (value !== null) {
18468          return value === "none" || value === "0" || isZeroValueString(value);
18469      }
18470      else {
18471          return true;
18472      }
18473  }
18474  
18475  
18476  
18477  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/errors.mjs
18478  
18479  
18480  let warning = noop_noop;
18481  let errors_invariant = noop_noop;
18482  if (false) {}
18483  
18484  
18485  
18486  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/is-numerical-string.mjs
18487  /**
18488   * Check if value is a numerical string, ie a string that is purely a number eg "100" or "-100.1"
18489   */
18490  const isNumericalString = (v) => /^-?(?:\d+(?:\.\d+)?|\.\d+)$/u.test(v);
18491  
18492  
18493  
18494  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/dom/utils/css-variables-conversion.mjs
18495  
18496  
18497  
18498  
18499  /**
18500   * Parse Framer's special CSS variable format into a CSS token and a fallback.
18501   *
18502   * ```
18503   * `var(--foo, #fff)` => [`--foo`, '#fff']
18504   * ```
18505   *
18506   * @param current
18507   */
18508  const splitCSSVariableRegex = 
18509  // eslint-disable-next-line redos-detector/no-unsafe-regex -- false positive, as it can match a lot of words
18510  /^var\(--(?:([\w-]+)|([\w-]+), ?([a-zA-Z\d ()%#.,-]+))\)/u;
18511  function parseCSSVariable(current) {
18512      const match = splitCSSVariableRegex.exec(current);
18513      if (!match)
18514          return [,];
18515      const [, token1, token2, fallback] = match;
18516      return [`--$token1 !== null && token1 !== void 0 ? token1 : token2}`, fallback];
18517  }
18518  const maxDepth = 4;
18519  function getVariableValue(current, element, depth = 1) {
18520      errors_invariant(depth <= maxDepth, `Max CSS variable fallback depth detected in property "$current}". This may indicate a circular fallback dependency.`);
18521      const [token, fallback] = parseCSSVariable(current);
18522      // No CSS variable detected
18523      if (!token)
18524          return;
18525      // Attempt to read this CSS variable off the element
18526      const resolved = window.getComputedStyle(element).getPropertyValue(token);
18527      if (resolved) {
18528          const trimmed = resolved.trim();
18529          return isNumericalString(trimmed) ? parseFloat(trimmed) : trimmed;
18530      }
18531      return isCSSVariableToken(fallback)
18532          ? getVariableValue(fallback, element, depth + 1)
18533          : fallback;
18534  }
18535  
18536  
18537  
18538  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/dom/utils/unit-conversion.mjs
18539  
18540  
18541  
18542  
18543  const positionalKeys = new Set([
18544      "width",
18545      "height",
18546      "top",
18547      "left",
18548      "right",
18549      "bottom",
18550      "x",
18551      "y",
18552      "translateX",
18553      "translateY",
18554  ]);
18555  const isNumOrPxType = (v) => v === number || v === px;
18556  const getPosFromMatrix = (matrix, pos) => parseFloat(matrix.split(", ")[pos]);
18557  const getTranslateFromMatrix = (pos2, pos3) => (_bbox, { transform }) => {
18558      if (transform === "none" || !transform)
18559          return 0;
18560      const matrix3d = transform.match(/^matrix3d\((.+)\)$/u);
18561      if (matrix3d) {
18562          return getPosFromMatrix(matrix3d[1], pos3);
18563      }
18564      else {
18565          const matrix = transform.match(/^matrix\((.+)\)$/u);
18566          if (matrix) {
18567              return getPosFromMatrix(matrix[1], pos2);
18568          }
18569          else {
18570              return 0;
18571          }
18572      }
18573  };
18574  const transformKeys = new Set(["x", "y", "z"]);
18575  const nonTranslationalTransformKeys = transformPropOrder.filter((key) => !transformKeys.has(key));
18576  function removeNonTranslationalTransform(visualElement) {
18577      const removedTransforms = [];
18578      nonTranslationalTransformKeys.forEach((key) => {
18579          const value = visualElement.getValue(key);
18580          if (value !== undefined) {
18581              removedTransforms.push([key, value.get()]);
18582              value.set(key.startsWith("scale") ? 1 : 0);
18583          }
18584      });
18585      return removedTransforms;
18586  }
18587  const positionalValues = {
18588      // Dimensions
18589      width: ({ x }, { paddingLeft = "0", paddingRight = "0" }) => x.max - x.min - parseFloat(paddingLeft) - parseFloat(paddingRight),
18590      height: ({ y }, { paddingTop = "0", paddingBottom = "0" }) => y.max - y.min - parseFloat(paddingTop) - parseFloat(paddingBottom),
18591      top: (_bbox, { top }) => parseFloat(top),
18592      left: (_bbox, { left }) => parseFloat(left),
18593      bottom: ({ y }, { top }) => parseFloat(top) + (y.max - y.min),
18594      right: ({ x }, { left }) => parseFloat(left) + (x.max - x.min),
18595      // Transform
18596      x: getTranslateFromMatrix(4, 13),
18597      y: getTranslateFromMatrix(5, 14),
18598  };
18599  // Alias translate longform names
18600  positionalValues.translateX = positionalValues.x;
18601  positionalValues.translateY = positionalValues.y;
18602  
18603  
18604  
18605  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/dom/value-types/test.mjs
18606  /**
18607   * Tests a provided value against a ValueType
18608   */
18609  const testValueType = (v) => (type) => type.test(v);
18610  
18611  
18612  
18613  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/dom/value-types/type-auto.mjs
18614  /**
18615   * ValueType for "auto"
18616   */
18617  const auto = {
18618      test: (v) => v === "auto",
18619      parse: (v) => v,
18620  };
18621  
18622  
18623  
18624  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/dom/value-types/dimensions.mjs
18625  
18626  
18627  
18628  
18629  
18630  /**
18631   * A list of value types commonly used for dimensions
18632   */
18633  const dimensionValueTypes = [number, px, percent, degrees, vw, vh, auto];
18634  /**
18635   * Tests a dimensional value against the list of dimension ValueTypes
18636   */
18637  const findDimensionValueType = (v) => dimensionValueTypes.find(testValueType(v));
18638  
18639  
18640  
18641  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/utils/KeyframesResolver.mjs
18642  
18643  
18644  
18645  const toResolve = new Set();
18646  let isScheduled = false;
18647  let anyNeedsMeasurement = false;
18648  function measureAllKeyframes() {
18649      if (anyNeedsMeasurement) {
18650          const resolversToMeasure = Array.from(toResolve).filter((resolver) => resolver.needsMeasurement);
18651          const elementsToMeasure = new Set(resolversToMeasure.map((resolver) => resolver.element));
18652          const transformsToRestore = new Map();
18653          /**
18654           * Write pass
18655           * If we're measuring elements we want to remove bounding box-changing transforms.
18656           */
18657          elementsToMeasure.forEach((element) => {
18658              const removedTransforms = removeNonTranslationalTransform(element);
18659              if (!removedTransforms.length)
18660                  return;
18661              transformsToRestore.set(element, removedTransforms);
18662              element.render();
18663          });
18664          // Read
18665          resolversToMeasure.forEach((resolver) => resolver.measureInitialState());
18666          // Write
18667          elementsToMeasure.forEach((element) => {
18668              element.render();
18669              const restore = transformsToRestore.get(element);
18670              if (restore) {
18671                  restore.forEach(([key, value]) => {
18672                      var _a;
18673                      (_a = element.getValue(key)) === null || _a === void 0 ? void 0 : _a.set(value);
18674                  });
18675              }
18676          });
18677          // Read
18678          resolversToMeasure.forEach((resolver) => resolver.measureEndState());
18679          // Write
18680          resolversToMeasure.forEach((resolver) => {
18681              if (resolver.suspendedScrollY !== undefined) {
18682                  window.scrollTo(0, resolver.suspendedScrollY);
18683              }
18684          });
18685      }
18686      anyNeedsMeasurement = false;
18687      isScheduled = false;
18688      toResolve.forEach((resolver) => resolver.complete());
18689      toResolve.clear();
18690  }
18691  function readAllKeyframes() {
18692      toResolve.forEach((resolver) => {
18693          resolver.readKeyframes();
18694          if (resolver.needsMeasurement) {
18695              anyNeedsMeasurement = true;
18696          }
18697      });
18698  }
18699  function flushKeyframeResolvers() {
18700      readAllKeyframes();
18701      measureAllKeyframes();
18702  }
18703  class KeyframeResolver {
18704      constructor(unresolvedKeyframes, onComplete, name, motionValue, element, isAsync = false) {
18705          /**
18706           * Track whether this resolver has completed. Once complete, it never
18707           * needs to attempt keyframe resolution again.
18708           */
18709          this.isComplete = false;
18710          /**
18711           * Track whether this resolver is async. If it is, it'll be added to the
18712           * resolver queue and flushed in the next frame. Resolvers that aren't going
18713           * to trigger read/write thrashing don't need to be async.
18714           */
18715          this.isAsync = false;
18716          /**
18717           * Track whether this resolver needs to perform a measurement
18718           * to resolve its keyframes.
18719           */
18720          this.needsMeasurement = false;
18721          /**
18722           * Track whether this resolver is currently scheduled to resolve
18723           * to allow it to be cancelled and resumed externally.
18724           */
18725          this.isScheduled = false;
18726          this.unresolvedKeyframes = [...unresolvedKeyframes];
18727          this.onComplete = onComplete;
18728          this.name = name;
18729          this.motionValue = motionValue;
18730          this.element = element;
18731          this.isAsync = isAsync;
18732      }
18733      scheduleResolve() {
18734          this.isScheduled = true;
18735          if (this.isAsync) {
18736              toResolve.add(this);
18737              if (!isScheduled) {
18738                  isScheduled = true;
18739                  frame_frame.read(readAllKeyframes);
18740                  frame_frame.resolveKeyframes(measureAllKeyframes);
18741              }
18742          }
18743          else {
18744              this.readKeyframes();
18745              this.complete();
18746          }
18747      }
18748      readKeyframes() {
18749          const { unresolvedKeyframes, name, element, motionValue } = this;
18750          /**
18751           * If a keyframe is null, we hydrate it either by reading it from
18752           * the instance, or propagating from previous keyframes.
18753           */
18754          for (let i = 0; i < unresolvedKeyframes.length; i++) {
18755              if (unresolvedKeyframes[i] === null) {
18756                  /**
18757                   * If the first keyframe is null, we need to find its value by sampling the element
18758                   */
18759                  if (i === 0) {
18760                      const currentValue = motionValue === null || motionValue === void 0 ? void 0 : motionValue.get();
18761                      const finalKeyframe = unresolvedKeyframes[unresolvedKeyframes.length - 1];
18762                      if (currentValue !== undefined) {
18763                          unresolvedKeyframes[0] = currentValue;
18764                      }
18765                      else if (element && name) {
18766                          const valueAsRead = element.readValue(name, finalKeyframe);
18767                          if (valueAsRead !== undefined && valueAsRead !== null) {
18768                              unresolvedKeyframes[0] = valueAsRead;
18769                          }
18770                      }
18771                      if (unresolvedKeyframes[0] === undefined) {
18772                          unresolvedKeyframes[0] = finalKeyframe;
18773                      }
18774                      if (motionValue && currentValue === undefined) {
18775                          motionValue.set(unresolvedKeyframes[0]);
18776                      }
18777                  }
18778                  else {
18779                      unresolvedKeyframes[i] = unresolvedKeyframes[i - 1];
18780                  }
18781              }
18782          }
18783      }
18784      setFinalKeyframe() { }
18785      measureInitialState() { }
18786      renderEndStyles() { }
18787      measureEndState() { }
18788      complete() {
18789          this.isComplete = true;
18790          this.onComplete(this.unresolvedKeyframes, this.finalKeyframe);
18791          toResolve.delete(this);
18792      }
18793      cancel() {
18794          if (!this.isComplete) {
18795              this.isScheduled = false;
18796              toResolve.delete(this);
18797          }
18798      }
18799      resume() {
18800          if (!this.isComplete)
18801              this.scheduleResolve();
18802      }
18803  }
18804  
18805  
18806  
18807  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/value/types/color/utils.mjs
18808  
18809  
18810  /**
18811   * Returns true if the provided string is a color, ie rgba(0,0,0,0) or #000,
18812   * but false if a number or multiple colors
18813   */
18814  const isColorString = (type, testProp) => (v) => {
18815      return Boolean((isString(v) && singleColorRegex.test(v) && v.startsWith(type)) ||
18816          (testProp && Object.prototype.hasOwnProperty.call(v, testProp)));
18817  };
18818  const splitColor = (aName, bName, cName) => (v) => {
18819      if (!isString(v))
18820          return v;
18821      const [a, b, c, alpha] = v.match(floatRegex);
18822      return {
18823          [aName]: parseFloat(a),
18824          [bName]: parseFloat(b),
18825          [cName]: parseFloat(c),
18826          alpha: alpha !== undefined ? parseFloat(alpha) : 1,
18827      };
18828  };
18829  
18830  
18831  
18832  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/value/types/color/rgba.mjs
18833  
18834  
18835  
18836  
18837  
18838  const clampRgbUnit = (v) => clamp_clamp(0, 255, v);
18839  const rgbUnit = {
18840      ...number,
18841      transform: (v) => Math.round(clampRgbUnit(v)),
18842  };
18843  const rgba = {
18844      test: isColorString("rgb", "red"),
18845      parse: splitColor("red", "green", "blue"),
18846      transform: ({ red, green, blue, alpha: alpha$1 = 1 }) => "rgba(" +
18847          rgbUnit.transform(red) +
18848          ", " +
18849          rgbUnit.transform(green) +
18850          ", " +
18851          rgbUnit.transform(blue) +
18852          ", " +
18853          sanitize(alpha.transform(alpha$1)) +
18854          ")",
18855  };
18856  
18857  
18858  
18859  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/value/types/color/hex.mjs
18860  
18861  
18862  
18863  function parseHex(v) {
18864      let r = "";
18865      let g = "";
18866      let b = "";
18867      let a = "";
18868      // If we have 6 characters, ie #FF0000
18869      if (v.length > 5) {
18870          r = v.substring(1, 3);
18871          g = v.substring(3, 5);
18872          b = v.substring(5, 7);
18873          a = v.substring(7, 9);
18874          // Or we have 3 characters, ie #F00
18875      }
18876      else {
18877          r = v.substring(1, 2);
18878          g = v.substring(2, 3);
18879          b = v.substring(3, 4);
18880          a = v.substring(4, 5);
18881          r += r;
18882          g += g;
18883          b += b;
18884          a += a;
18885      }
18886      return {
18887          red: parseInt(r, 16),
18888          green: parseInt(g, 16),
18889          blue: parseInt(b, 16),
18890          alpha: a ? parseInt(a, 16) / 255 : 1,
18891      };
18892  }
18893  const hex = {
18894      test: isColorString("#"),
18895      parse: parseHex,
18896      transform: rgba.transform,
18897  };
18898  
18899  
18900  
18901  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/value/types/color/hsla.mjs
18902  
18903  
18904  
18905  
18906  
18907  const hsla = {
18908      test: isColorString("hsl", "hue"),
18909      parse: splitColor("hue", "saturation", "lightness"),
18910      transform: ({ hue, saturation, lightness, alpha: alpha$1 = 1 }) => {
18911          return ("hsla(" +
18912              Math.round(hue) +
18913              ", " +
18914              percent.transform(sanitize(saturation)) +
18915              ", " +
18916              percent.transform(sanitize(lightness)) +
18917              ", " +
18918              sanitize(alpha.transform(alpha$1)) +
18919              ")");
18920      },
18921  };
18922  
18923  
18924  
18925  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/value/types/color/index.mjs
18926  
18927  
18928  
18929  
18930  
18931  const color = {
18932      test: (v) => rgba.test(v) || hex.test(v) || hsla.test(v),
18933      parse: (v) => {
18934          if (rgba.test(v)) {
18935              return rgba.parse(v);
18936          }
18937          else if (hsla.test(v)) {
18938              return hsla.parse(v);
18939          }
18940          else {
18941              return hex.parse(v);
18942          }
18943      },
18944      transform: (v) => {
18945          return isString(v)
18946              ? v
18947              : v.hasOwnProperty("red")
18948                  ? rgba.transform(v)
18949                  : hsla.transform(v);
18950      },
18951  };
18952  
18953  
18954  
18955  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/value/types/complex/index.mjs
18956  
18957  
18958  
18959  function test(v) {
18960      var _a, _b;
18961      return (isNaN(v) &&
18962          isString(v) &&
18963          (((_a = v.match(floatRegex)) === null || _a === void 0 ? void 0 : _a.length) || 0) +
18964              (((_b = v.match(colorRegex)) === null || _b === void 0 ? void 0 : _b.length) || 0) >
18965              0);
18966  }
18967  const NUMBER_TOKEN = "number";
18968  const COLOR_TOKEN = "color";
18969  const VAR_TOKEN = "var";
18970  const VAR_FUNCTION_TOKEN = "var(";
18971  const SPLIT_TOKEN = "${}";
18972  // this regex consists of the `singleCssVariableRegex|rgbHSLValueRegex|digitRegex`
18973  const complexRegex = /var\s*\(\s*--(?:[\w-]+\s*|[\w-]+\s*,(?:\s*[^)(\s]|\s*\((?:[^)(]|\([^)(]*\))*\))+\s*)\)|#[\da-f]{3,8}|(?:rgb|hsl)a?\((?:-?[\d.]+%?[,\s]+){2}-?[\d.]+%?\s*(?:[,/]\s*)?(?:\b\d+(?:\.\d+)?|\.\d+)?%?\)|-?(?:\d+(?:\.\d+)?|\.\d+)/giu;
18974  function analyseComplexValue(value) {
18975      const originalValue = value.toString();
18976      const values = [];
18977      const indexes = {
18978          color: [],
18979          number: [],
18980          var: [],
18981      };
18982      const types = [];
18983      let i = 0;
18984      const tokenised = originalValue.replace(complexRegex, (parsedValue) => {
18985          if (color.test(parsedValue)) {
18986              indexes.color.push(i);
18987              types.push(COLOR_TOKEN);
18988              values.push(color.parse(parsedValue));
18989          }
18990          else if (parsedValue.startsWith(VAR_FUNCTION_TOKEN)) {
18991              indexes.var.push(i);
18992              types.push(VAR_TOKEN);
18993              values.push(parsedValue);
18994          }
18995          else {
18996              indexes.number.push(i);
18997              types.push(NUMBER_TOKEN);
18998              values.push(parseFloat(parsedValue));
18999          }
19000          ++i;
19001          return SPLIT_TOKEN;
19002      });
19003      const split = tokenised.split(SPLIT_TOKEN);
19004      return { values, split, indexes, types };
19005  }
19006  function parseComplexValue(v) {
19007      return analyseComplexValue(v).values;
19008  }
19009  function createTransformer(source) {
19010      const { split, types } = analyseComplexValue(source);
19011      const numSections = split.length;
19012      return (v) => {
19013          let output = "";
19014          for (let i = 0; i < numSections; i++) {
19015              output += split[i];
19016              if (v[i] !== undefined) {
19017                  const type = types[i];
19018                  if (type === NUMBER_TOKEN) {
19019                      output += sanitize(v[i]);
19020                  }
19021                  else if (type === COLOR_TOKEN) {
19022                      output += color.transform(v[i]);
19023                  }
19024                  else {
19025                      output += v[i];
19026                  }
19027              }
19028          }
19029          return output;
19030      };
19031  }
19032  const convertNumbersToZero = (v) => typeof v === "number" ? 0 : v;
19033  function getAnimatableNone(v) {
19034      const parsed = parseComplexValue(v);
19035      const transformer = createTransformer(v);
19036      return transformer(parsed.map(convertNumbersToZero));
19037  }
19038  const complex = {
19039      test,
19040      parse: parseComplexValue,
19041      createTransformer,
19042      getAnimatableNone,
19043  };
19044  
19045  
19046  
19047  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/value/types/complex/filter.mjs
19048  
19049  
19050  
19051  /**
19052   * Properties that should default to 1 or 100%
19053   */
19054  const maxDefaults = new Set(["brightness", "contrast", "saturate", "opacity"]);
19055  function applyDefaultFilter(v) {
19056      const [name, value] = v.slice(0, -1).split("(");
19057      if (name === "drop-shadow")
19058          return v;
19059      const [number] = value.match(floatRegex) || [];
19060      if (!number)
19061          return v;
19062      const unit = value.replace(number, "");
19063      let defaultValue = maxDefaults.has(name) ? 1 : 0;
19064      if (number !== value)
19065          defaultValue *= 100;
19066      return name + "(" + defaultValue + unit + ")";
19067  }
19068  const functionRegex = /\b([a-z-]*)\(.*?\)/gu;
19069  const filter = {
19070      ...complex,
19071      getAnimatableNone: (v) => {
19072          const functions = v.match(functionRegex);
19073          return functions ? functions.map(applyDefaultFilter).join(" ") : v;
19074      },
19075  };
19076  
19077  
19078  
19079  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/dom/value-types/defaults.mjs
19080  
19081  
19082  
19083  
19084  /**
19085   * A map of default value types for common values
19086   */
19087  const defaultValueTypes = {
19088      ...numberValueTypes,
19089      // Color props
19090      color: color,
19091      backgroundColor: color,
19092      outlineColor: color,
19093      fill: color,
19094      stroke: color,
19095      // Border props
19096      borderColor: color,
19097      borderTopColor: color,
19098      borderRightColor: color,
19099      borderBottomColor: color,
19100      borderLeftColor: color,
19101      filter: filter,
19102      WebkitFilter: filter,
19103  };
19104  /**
19105   * Gets the default ValueType for the provided value key
19106   */
19107  const getDefaultValueType = (key) => defaultValueTypes[key];
19108  
19109  
19110  
19111  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/dom/value-types/animatable-none.mjs
19112  
19113  
19114  
19115  
19116  function animatable_none_getAnimatableNone(key, value) {
19117      let defaultValueType = getDefaultValueType(key);
19118      if (defaultValueType !== filter)
19119          defaultValueType = complex;
19120      // If value is not recognised as animatable, ie "none", create an animatable version origin based on the target
19121      return defaultValueType.getAnimatableNone
19122          ? defaultValueType.getAnimatableNone(value)
19123          : undefined;
19124  }
19125  
19126  
19127  
19128  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/html/utils/make-none-animatable.mjs
19129  
19130  
19131  
19132  /**
19133   * If we encounter keyframes like "none" or "0" and we also have keyframes like
19134   * "#fff" or "200px 200px" we want to find a keyframe to serve as a template for
19135   * the "none" keyframes. In this case "#fff" or "200px 200px" - then these get turned into
19136   * zero equivalents, i.e. "#fff0" or "0px 0px".
19137   */
19138  const invalidTemplates = new Set(["auto", "none", "0"]);
19139  function makeNoneKeyframesAnimatable(unresolvedKeyframes, noneKeyframeIndexes, name) {
19140      let i = 0;
19141      let animatableTemplate = undefined;
19142      while (i < unresolvedKeyframes.length && !animatableTemplate) {
19143          const keyframe = unresolvedKeyframes[i];
19144          if (typeof keyframe === "string" &&
19145              !invalidTemplates.has(keyframe) &&
19146              analyseComplexValue(keyframe).values.length) {
19147              animatableTemplate = unresolvedKeyframes[i];
19148          }
19149          i++;
19150      }
19151      if (animatableTemplate && name) {
19152          for (const noneIndex of noneKeyframeIndexes) {
19153              unresolvedKeyframes[noneIndex] = animatable_none_getAnimatableNone(name, animatableTemplate);
19154          }
19155      }
19156  }
19157  
19158  
19159  
19160  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/dom/DOMKeyframesResolver.mjs
19161  
19162  
19163  
19164  
19165  
19166  
19167  
19168  
19169  class DOMKeyframesResolver extends KeyframeResolver {
19170      constructor(unresolvedKeyframes, onComplete, name, motionValue) {
19171          super(unresolvedKeyframes, onComplete, name, motionValue, motionValue === null || motionValue === void 0 ? void 0 : motionValue.owner, true);
19172      }
19173      readKeyframes() {
19174          const { unresolvedKeyframes, element, name } = this;
19175          if (!element.current)
19176              return;
19177          super.readKeyframes();
19178          /**
19179           * If any keyframe is a CSS variable, we need to find its value by sampling the element
19180           */
19181          for (let i = 0; i < unresolvedKeyframes.length; i++) {
19182              const keyframe = unresolvedKeyframes[i];
19183              if (typeof keyframe === "string" && isCSSVariableToken(keyframe)) {
19184                  const resolved = getVariableValue(keyframe, element.current);
19185                  if (resolved !== undefined) {
19186                      unresolvedKeyframes[i] = resolved;
19187                  }
19188                  if (i === unresolvedKeyframes.length - 1) {
19189                      this.finalKeyframe = keyframe;
19190                  }
19191              }
19192          }
19193          /**
19194           * Resolve "none" values. We do this potentially twice - once before and once after measuring keyframes.
19195           * This could be seen as inefficient but it's a trade-off to avoid measurements in more situations, which
19196           * have a far bigger performance impact.
19197           */
19198          this.resolveNoneKeyframes();
19199          /**
19200           * Check to see if unit type has changed. If so schedule jobs that will
19201           * temporarily set styles to the destination keyframes.
19202           * Skip if we have more than two keyframes or this isn't a positional value.
19203           * TODO: We can throw if there are multiple keyframes and the value type changes.
19204           */
19205          if (!positionalKeys.has(name) || unresolvedKeyframes.length !== 2) {
19206              return;
19207          }
19208          const [origin, target] = unresolvedKeyframes;
19209          const originType = findDimensionValueType(origin);
19210          const targetType = findDimensionValueType(target);
19211          /**
19212           * Either we don't recognise these value types or we can animate between them.
19213           */
19214          if (originType === targetType)
19215              return;
19216          /**
19217           * If both values are numbers or pixels, we can animate between them by
19218           * converting them to numbers.
19219           */
19220          if (isNumOrPxType(originType) && isNumOrPxType(targetType)) {
19221              for (let i = 0; i < unresolvedKeyframes.length; i++) {
19222                  const value = unresolvedKeyframes[i];
19223                  if (typeof value === "string") {
19224                      unresolvedKeyframes[i] = parseFloat(value);
19225                  }
19226              }
19227          }
19228          else {
19229              /**
19230               * Else, the only way to resolve this is by measuring the element.
19231               */
19232              this.needsMeasurement = true;
19233          }
19234      }
19235      resolveNoneKeyframes() {
19236          const { unresolvedKeyframes, name } = this;
19237          const noneKeyframeIndexes = [];
19238          for (let i = 0; i < unresolvedKeyframes.length; i++) {
19239              if (isNone(unresolvedKeyframes[i])) {
19240                  noneKeyframeIndexes.push(i);
19241              }
19242          }
19243          if (noneKeyframeIndexes.length) {
19244              makeNoneKeyframesAnimatable(unresolvedKeyframes, noneKeyframeIndexes, name);
19245          }
19246      }
19247      measureInitialState() {
19248          const { element, unresolvedKeyframes, name } = this;
19249          if (!element.current)
19250              return;
19251          if (name === "height") {
19252              this.suspendedScrollY = window.pageYOffset;
19253          }
19254          this.measuredOrigin = positionalValues[name](element.measureViewportBox(), window.getComputedStyle(element.current));
19255          unresolvedKeyframes[0] = this.measuredOrigin;
19256          // Set final key frame to measure after next render
19257          const measureKeyframe = unresolvedKeyframes[unresolvedKeyframes.length - 1];
19258          if (measureKeyframe !== undefined) {
19259              element.getValue(name, measureKeyframe).jump(measureKeyframe, false);
19260          }
19261      }
19262      measureEndState() {
19263          var _a;
19264          const { element, name, unresolvedKeyframes } = this;
19265          if (!element.current)
19266              return;
19267          const value = element.getValue(name);
19268          value && value.jump(this.measuredOrigin, false);
19269          const finalKeyframeIndex = unresolvedKeyframes.length - 1;
19270          const finalKeyframe = unresolvedKeyframes[finalKeyframeIndex];
19271          unresolvedKeyframes[finalKeyframeIndex] = positionalValues[name](element.measureViewportBox(), window.getComputedStyle(element.current));
19272          if (finalKeyframe !== null && this.finalKeyframe === undefined) {
19273              this.finalKeyframe = finalKeyframe;
19274          }
19275          // If we removed transform values, reapply them before the next render
19276          if ((_a = this.removedTransforms) === null || _a === void 0 ? void 0 : _a.length) {
19277              this.removedTransforms.forEach(([unsetTransformName, unsetTransformValue]) => {
19278                  element
19279                      .getValue(unsetTransformName)
19280                      .set(unsetTransformValue);
19281              });
19282          }
19283          this.resolveNoneKeyframes();
19284      }
19285  }
19286  
19287  
19288  
19289  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/memo.mjs
19290  function memo(callback) {
19291      let result;
19292      return () => {
19293          if (result === undefined)
19294              result = callback();
19295          return result;
19296      };
19297  }
19298  
19299  
19300  
19301  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/animation/utils/is-animatable.mjs
19302  
19303  
19304  /**
19305   * Check if a value is animatable. Examples:
19306   *
19307   * ✅: 100, "100px", "#fff"
19308   * ❌: "block", "url(2.jpg)"
19309   * @param value
19310   *
19311   * @internal
19312   */
19313  const isAnimatable = (value, name) => {
19314      // If the list of keys tat might be non-animatable grows, replace with Set
19315      if (name === "zIndex")
19316          return false;
19317      // If it's a number or a keyframes array, we can animate it. We might at some point
19318      // need to do a deep isAnimatable check of keyframes, or let Popmotion handle this,
19319      // but for now lets leave it like this for performance reasons
19320      if (typeof value === "number" || Array.isArray(value))
19321          return true;
19322      if (typeof value === "string" && // It's animatable if we have a string
19323          (complex.test(value) || value === "0") && // And it contains numbers and/or colors
19324          !value.startsWith("url(") // Unless it starts with "url("
19325      ) {
19326          return true;
19327      }
19328      return false;
19329  };
19330  
19331  
19332  
19333  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/animation/animators/utils/can-animate.mjs
19334  
19335  
19336  
19337  function hasKeyframesChanged(keyframes) {
19338      const current = keyframes[0];
19339      if (keyframes.length === 1)
19340          return true;
19341      for (let i = 0; i < keyframes.length; i++) {
19342          if (keyframes[i] !== current)
19343              return true;
19344      }
19345  }
19346  function canAnimate(keyframes, name, type, velocity) {
19347      /**
19348       * Check if we're able to animate between the start and end keyframes,
19349       * and throw a warning if we're attempting to animate between one that's
19350       * animatable and another that isn't.
19351       */
19352      const originKeyframe = keyframes[0];
19353      if (originKeyframe === null)
19354          return false;
19355      /**
19356       * These aren't traditionally animatable but we do support them.
19357       * In future we could look into making this more generic or replacing
19358       * this function with mix() === mixImmediate
19359       */
19360      if (name === "display" || name === "visibility")
19361          return true;
19362      const targetKeyframe = keyframes[keyframes.length - 1];
19363      const isOriginAnimatable = isAnimatable(originKeyframe, name);
19364      const isTargetAnimatable = isAnimatable(targetKeyframe, name);
19365      warning(isOriginAnimatable === isTargetAnimatable, `You are trying to animate $name} from "$originKeyframe}" to "$targetKeyframe}". $originKeyframe} is not an animatable value - to enable this animation set $originKeyframe} to a value animatable to $targetKeyframe} via the \`style\` property.`);
19366      // Always skip if any of these are true
19367      if (!isOriginAnimatable || !isTargetAnimatable) {
19368          return false;
19369      }
19370      return hasKeyframesChanged(keyframes) || (type === "spring" && velocity);
19371  }
19372  
19373  
19374  
19375  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/animation/animators/BaseAnimation.mjs
19376  
19377  
19378  
19379  
19380  
19381  class BaseAnimation {
19382      constructor({ autoplay = true, delay = 0, type = "keyframes", repeat = 0, repeatDelay = 0, repeatType = "loop", ...options }) {
19383          // Track whether the animation has been stopped. Stopped animations won't restart.
19384          this.isStopped = false;
19385          this.hasAttemptedResolve = false;
19386          this.options = {
19387              autoplay,
19388              delay,
19389              type,
19390              repeat,
19391              repeatDelay,
19392              repeatType,
19393              ...options,
19394          };
19395          this.updateFinishedPromise();
19396      }
19397      /**
19398       * A getter for resolved data. If keyframes are not yet resolved, accessing
19399       * this.resolved will synchronously flush all pending keyframe resolvers.
19400       * This is a deoptimisation, but at its worst still batches read/writes.
19401       */
19402      get resolved() {
19403          if (!this._resolved && !this.hasAttemptedResolve) {
19404              flushKeyframeResolvers();
19405          }
19406          return this._resolved;
19407      }
19408      /**
19409       * A method to be called when the keyframes resolver completes. This method
19410       * will check if its possible to run the animation and, if not, skip it.
19411       * Otherwise, it will call initPlayback on the implementing class.
19412       */
19413      onKeyframesResolved(keyframes, finalKeyframe) {
19414          this.hasAttemptedResolve = true;
19415          const { name, type, velocity, delay, onComplete, onUpdate, isGenerator, } = this.options;
19416          /**
19417           * If we can't animate this value with the resolved keyframes
19418           * then we should complete it immediately.
19419           */
19420          if (!isGenerator && !canAnimate(keyframes, name, type, velocity)) {
19421              // Finish immediately
19422              if (instantAnimationState.current || !delay) {
19423                  onUpdate === null || onUpdate === void 0 ? void 0 : onUpdate(getFinalKeyframe(keyframes, this.options, finalKeyframe));
19424                  onComplete === null || onComplete === void 0 ? void 0 : onComplete();
19425                  this.resolveFinishedPromise();
19426                  return;
19427              }
19428              // Finish after a delay
19429              else {
19430                  this.options.duration = 0;
19431              }
19432          }
19433          const resolvedAnimation = this.initPlayback(keyframes, finalKeyframe);
19434          if (resolvedAnimation === false)
19435              return;
19436          this._resolved = {
19437              keyframes,
19438              finalKeyframe,
19439              ...resolvedAnimation,
19440          };
19441          this.onPostResolved();
19442      }
19443      onPostResolved() { }
19444      /**
19445       * Allows the returned animation to be awaited or promise-chained. Currently
19446       * resolves when the animation finishes at all but in a future update could/should
19447       * reject if its cancels.
19448       */
19449      then(resolve, reject) {
19450          return this.currentFinishedPromise.then(resolve, reject);
19451      }
19452      updateFinishedPromise() {
19453          this.currentFinishedPromise = new Promise((resolve) => {
19454              this.resolveFinishedPromise = resolve;
19455          });
19456      }
19457  }
19458  
19459  
19460  
19461  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/velocity-per-second.mjs
19462  /*
19463    Convert velocity into velocity per second
19464  
19465    @param [number]: Unit per frame
19466    @param [number]: Frame duration in ms
19467  */
19468  function velocityPerSecond(velocity, frameDuration) {
19469      return frameDuration ? velocity * (1000 / frameDuration) : 0;
19470  }
19471  
19472  
19473  
19474  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/animation/generators/utils/velocity.mjs
19475  
19476  
19477  const velocitySampleDuration = 5; // ms
19478  function calcGeneratorVelocity(resolveValue, t, current) {
19479      const prevT = Math.max(t - velocitySampleDuration, 0);
19480      return velocityPerSecond(current - resolveValue(prevT), t - prevT);
19481  }
19482  
19483  
19484  
19485  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/animation/generators/spring/find.mjs
19486  
19487  
19488  
19489  
19490  const safeMin = 0.001;
19491  const minDuration = 0.01;
19492  const maxDuration = 10.0;
19493  const minDamping = 0.05;
19494  const maxDamping = 1;
19495  function findSpring({ duration = 800, bounce = 0.25, velocity = 0, mass = 1, }) {
19496      let envelope;
19497      let derivative;
19498      warning(duration <= secondsToMilliseconds(maxDuration), "Spring duration must be 10 seconds or less");
19499      let dampingRatio = 1 - bounce;
19500      /**
19501       * Restrict dampingRatio and duration to within acceptable ranges.
19502       */
19503      dampingRatio = clamp_clamp(minDamping, maxDamping, dampingRatio);
19504      duration = clamp_clamp(minDuration, maxDuration, millisecondsToSeconds(duration));
19505      if (dampingRatio < 1) {
19506          /**
19507           * Underdamped spring
19508           */
19509          envelope = (undampedFreq) => {
19510              const exponentialDecay = undampedFreq * dampingRatio;
19511              const delta = exponentialDecay * duration;
19512              const a = exponentialDecay - velocity;
19513              const b = calcAngularFreq(undampedFreq, dampingRatio);
19514              const c = Math.exp(-delta);
19515              return safeMin - (a / b) * c;
19516          };
19517          derivative = (undampedFreq) => {
19518              const exponentialDecay = undampedFreq * dampingRatio;
19519              const delta = exponentialDecay * duration;
19520              const d = delta * velocity + velocity;
19521              const e = Math.pow(dampingRatio, 2) * Math.pow(undampedFreq, 2) * duration;
19522              const f = Math.exp(-delta);
19523              const g = calcAngularFreq(Math.pow(undampedFreq, 2), dampingRatio);
19524              const factor = -envelope(undampedFreq) + safeMin > 0 ? -1 : 1;
19525              return (factor * ((d - e) * f)) / g;
19526          };
19527      }
19528      else {
19529          /**
19530           * Critically-damped spring
19531           */
19532          envelope = (undampedFreq) => {
19533              const a = Math.exp(-undampedFreq * duration);
19534              const b = (undampedFreq - velocity) * duration + 1;
19535              return -safeMin + a * b;
19536          };
19537          derivative = (undampedFreq) => {
19538              const a = Math.exp(-undampedFreq * duration);
19539              const b = (velocity - undampedFreq) * (duration * duration);
19540              return a * b;
19541          };
19542      }
19543      const initialGuess = 5 / duration;
19544      const undampedFreq = approximateRoot(envelope, derivative, initialGuess);
19545      duration = secondsToMilliseconds(duration);
19546      if (isNaN(undampedFreq)) {
19547          return {
19548              stiffness: 100,
19549              damping: 10,
19550              duration,
19551          };
19552      }
19553      else {
19554          const stiffness = Math.pow(undampedFreq, 2) * mass;
19555          return {
19556              stiffness,
19557              damping: dampingRatio * 2 * Math.sqrt(mass * stiffness),
19558              duration,
19559          };
19560      }
19561  }
19562  const rootIterations = 12;
19563  function approximateRoot(envelope, derivative, initialGuess) {
19564      let result = initialGuess;
19565      for (let i = 1; i < rootIterations; i++) {
19566          result = result - envelope(result) / derivative(result);
19567      }
19568      return result;
19569  }
19570  function calcAngularFreq(undampedFreq, dampingRatio) {
19571      return undampedFreq * Math.sqrt(1 - dampingRatio * dampingRatio);
19572  }
19573  
19574  
19575  
19576  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/animation/generators/spring/index.mjs
19577  
19578  
19579  
19580  
19581  const durationKeys = ["duration", "bounce"];
19582  const physicsKeys = ["stiffness", "damping", "mass"];
19583  function isSpringType(options, keys) {
19584      return keys.some((key) => options[key] !== undefined);
19585  }
19586  function getSpringOptions(options) {
19587      let springOptions = {
19588          velocity: 0.0,
19589          stiffness: 100,
19590          damping: 10,
19591          mass: 1.0,
19592          isResolvedFromDuration: false,
19593          ...options,
19594      };
19595      // stiffness/damping/mass overrides duration/bounce
19596      if (!isSpringType(options, physicsKeys) &&
19597          isSpringType(options, durationKeys)) {
19598          const derived = findSpring(options);
19599          springOptions = {
19600              ...springOptions,
19601              ...derived,
19602              mass: 1.0,
19603          };
19604          springOptions.isResolvedFromDuration = true;
19605      }
19606      return springOptions;
19607  }
19608  function spring({ keyframes, restDelta, restSpeed, ...options }) {
19609      const origin = keyframes[0];
19610      const target = keyframes[keyframes.length - 1];
19611      /**
19612       * This is the Iterator-spec return value. We ensure it's mutable rather than using a generator
19613       * to reduce GC during animation.
19614       */
19615      const state = { done: false, value: origin };
19616      const { stiffness, damping, mass, duration, velocity, isResolvedFromDuration, } = getSpringOptions({
19617          ...options,
19618          velocity: -millisecondsToSeconds(options.velocity || 0),
19619      });
19620      const initialVelocity = velocity || 0.0;
19621      const dampingRatio = damping / (2 * Math.sqrt(stiffness * mass));
19622      const initialDelta = target - origin;
19623      const undampedAngularFreq = millisecondsToSeconds(Math.sqrt(stiffness / mass));
19624      /**
19625       * If we're working on a granular scale, use smaller defaults for determining
19626       * when the spring is finished.
19627       *
19628       * These defaults have been selected emprically based on what strikes a good
19629       * ratio between feeling good and finishing as soon as changes are imperceptible.
19630       */
19631      const isGranularScale = Math.abs(initialDelta) < 5;
19632      restSpeed || (restSpeed = isGranularScale ? 0.01 : 2);
19633      restDelta || (restDelta = isGranularScale ? 0.005 : 0.5);
19634      let resolveSpring;
19635      if (dampingRatio < 1) {
19636          const angularFreq = calcAngularFreq(undampedAngularFreq, dampingRatio);
19637          // Underdamped spring
19638          resolveSpring = (t) => {
19639              const envelope = Math.exp(-dampingRatio * undampedAngularFreq * t);
19640              return (target -
19641                  envelope *
19642                      (((initialVelocity +
19643                          dampingRatio * undampedAngularFreq * initialDelta) /
19644                          angularFreq) *
19645                          Math.sin(angularFreq * t) +
19646                          initialDelta * Math.cos(angularFreq * t)));
19647          };
19648      }
19649      else if (dampingRatio === 1) {
19650          // Critically damped spring
19651          resolveSpring = (t) => target -
19652              Math.exp(-undampedAngularFreq * t) *
19653                  (initialDelta +
19654                      (initialVelocity + undampedAngularFreq * initialDelta) * t);
19655      }
19656      else {
19657          // Overdamped spring
19658          const dampedAngularFreq = undampedAngularFreq * Math.sqrt(dampingRatio * dampingRatio - 1);
19659          resolveSpring = (t) => {
19660              const envelope = Math.exp(-dampingRatio * undampedAngularFreq * t);
19661              // When performing sinh or cosh values can hit Infinity so we cap them here
19662              const freqForT = Math.min(dampedAngularFreq * t, 300);
19663              return (target -
19664                  (envelope *
19665                      ((initialVelocity +
19666                          dampingRatio * undampedAngularFreq * initialDelta) *
19667                          Math.sinh(freqForT) +
19668                          dampedAngularFreq *
19669                              initialDelta *
19670                              Math.cosh(freqForT))) /
19671                      dampedAngularFreq);
19672          };
19673      }
19674      return {
19675          calculatedDuration: isResolvedFromDuration ? duration || null : null,
19676          next: (t) => {
19677              const current = resolveSpring(t);
19678              if (!isResolvedFromDuration) {
19679                  let currentVelocity = initialVelocity;
19680                  if (t !== 0) {
19681                      /**
19682                       * We only need to calculate velocity for under-damped springs
19683                       * as over- and critically-damped springs can't overshoot, so
19684                       * checking only for displacement is enough.
19685                       */
19686                      if (dampingRatio < 1) {
19687                          currentVelocity = calcGeneratorVelocity(resolveSpring, t, current);
19688                      }
19689                      else {
19690                          currentVelocity = 0;
19691                      }
19692                  }
19693                  const isBelowVelocityThreshold = Math.abs(currentVelocity) <= restSpeed;
19694                  const isBelowDisplacementThreshold = Math.abs(target - current) <= restDelta;
19695                  state.done =
19696                      isBelowVelocityThreshold && isBelowDisplacementThreshold;
19697              }
19698              else {
19699                  state.done = t >= duration;
19700              }
19701              state.value = state.done ? target : current;
19702              return state;
19703          },
19704      };
19705  }
19706  
19707  
19708  
19709  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/animation/generators/inertia.mjs
19710  
19711  
19712  
19713  function inertia({ keyframes, velocity = 0.0, power = 0.8, timeConstant = 325, bounceDamping = 10, bounceStiffness = 500, modifyTarget, min, max, restDelta = 0.5, restSpeed, }) {
19714      const origin = keyframes[0];
19715      const state = {
19716          done: false,
19717          value: origin,
19718      };
19719      const isOutOfBounds = (v) => (min !== undefined && v < min) || (max !== undefined && v > max);
19720      const nearestBoundary = (v) => {
19721          if (min === undefined)
19722              return max;
19723          if (max === undefined)
19724              return min;
19725          return Math.abs(min - v) < Math.abs(max - v) ? min : max;
19726      };
19727      let amplitude = power * velocity;
19728      const ideal = origin + amplitude;
19729      const target = modifyTarget === undefined ? ideal : modifyTarget(ideal);
19730      /**
19731       * If the target has changed we need to re-calculate the amplitude, otherwise
19732       * the animation will start from the wrong position.
19733       */
19734      if (target !== ideal)
19735          amplitude = target - origin;
19736      const calcDelta = (t) => -amplitude * Math.exp(-t / timeConstant);
19737      const calcLatest = (t) => target + calcDelta(t);
19738      const applyFriction = (t) => {
19739          const delta = calcDelta(t);
19740          const latest = calcLatest(t);
19741          state.done = Math.abs(delta) <= restDelta;
19742          state.value = state.done ? target : latest;
19743      };
19744      /**
19745       * Ideally this would resolve for t in a stateless way, we could
19746       * do that by always precalculating the animation but as we know
19747       * this will be done anyway we can assume that spring will
19748       * be discovered during that.
19749       */
19750      let timeReachedBoundary;
19751      let spring$1;
19752      const checkCatchBoundary = (t) => {
19753          if (!isOutOfBounds(state.value))
19754              return;
19755          timeReachedBoundary = t;
19756          spring$1 = spring({
19757              keyframes: [state.value, nearestBoundary(state.value)],
19758              velocity: calcGeneratorVelocity(calcLatest, t, state.value), // TODO: This should be passing * 1000
19759              damping: bounceDamping,
19760              stiffness: bounceStiffness,
19761              restDelta,
19762              restSpeed,
19763          });
19764      };
19765      checkCatchBoundary(0);
19766      return {
19767          calculatedDuration: null,
19768          next: (t) => {
19769              /**
19770               * We need to resolve the friction to figure out if we need a
19771               * spring but we don't want to do this twice per frame. So here
19772               * we flag if we updated for this frame and later if we did
19773               * we can skip doing it again.
19774               */
19775              let hasUpdatedFrame = false;
19776              if (!spring$1 && timeReachedBoundary === undefined) {
19777                  hasUpdatedFrame = true;
19778                  applyFriction(t);
19779                  checkCatchBoundary(t);
19780              }
19781              /**
19782               * If we have a spring and the provided t is beyond the moment the friction
19783               * animation crossed the min/max boundary, use the spring.
19784               */
19785              if (timeReachedBoundary !== undefined && t >= timeReachedBoundary) {
19786                  return spring$1.next(t - timeReachedBoundary);
19787              }
19788              else {
19789                  !hasUpdatedFrame && applyFriction(t);
19790                  return state;
19791              }
19792          },
19793      };
19794  }
19795  
19796  
19797  
19798  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/easing/cubic-bezier.mjs
19799  
19800  
19801  /*
19802    Bezier function generator
19803    This has been modified from Gaëtan Renaudeau's BezierEasing
19804    https://github.com/gre/bezier-easing/blob/master/src/index.js
19805    https://github.com/gre/bezier-easing/blob/master/LICENSE
19806    
19807    I've removed the newtonRaphsonIterate algo because in benchmarking it
19808    wasn't noticiably faster than binarySubdivision, indeed removing it
19809    usually improved times, depending on the curve.
19810    I also removed the lookup table, as for the added bundle size and loop we're
19811    only cutting ~4 or so subdivision iterations. I bumped the max iterations up
19812    to 12 to compensate and this still tended to be faster for no perceivable
19813    loss in accuracy.
19814    Usage
19815      const easeOut = cubicBezier(.17,.67,.83,.67);
19816      const x = easeOut(0.5); // returns 0.627...
19817  */
19818  // Returns x(t) given t, x1, and x2, or y(t) given t, y1, and y2.
19819  const calcBezier = (t, a1, a2) => (((1.0 - 3.0 * a2 + 3.0 * a1) * t + (3.0 * a2 - 6.0 * a1)) * t + 3.0 * a1) *
19820      t;
19821  const subdivisionPrecision = 0.0000001;
19822  const subdivisionMaxIterations = 12;
19823  function binarySubdivide(x, lowerBound, upperBound, mX1, mX2) {
19824      let currentX;
19825      let currentT;
19826      let i = 0;
19827      do {
19828          currentT = lowerBound + (upperBound - lowerBound) / 2.0;
19829          currentX = calcBezier(currentT, mX1, mX2) - x;
19830          if (currentX > 0.0) {
19831              upperBound = currentT;
19832          }
19833          else {
19834              lowerBound = currentT;
19835          }
19836      } while (Math.abs(currentX) > subdivisionPrecision &&
19837          ++i < subdivisionMaxIterations);
19838      return currentT;
19839  }
19840  function cubicBezier(mX1, mY1, mX2, mY2) {
19841      // If this is a linear gradient, return linear easing
19842      if (mX1 === mY1 && mX2 === mY2)
19843          return noop_noop;
19844      const getTForX = (aX) => binarySubdivide(aX, 0, 1, mX1, mX2);
19845      // If animation is at start/end, return t without easing
19846      return (t) => t === 0 || t === 1 ? t : calcBezier(getTForX(t), mY1, mY2);
19847  }
19848  
19849  
19850  
19851  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/easing/ease.mjs
19852  
19853  
19854  const easeIn = cubicBezier(0.42, 0, 1, 1);
19855  const easeOut = cubicBezier(0, 0, 0.58, 1);
19856  const easeInOut = cubicBezier(0.42, 0, 0.58, 1);
19857  
19858  
19859  
19860  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/easing/utils/is-easing-array.mjs
19861  const isEasingArray = (ease) => {
19862      return Array.isArray(ease) && typeof ease[0] !== "number";
19863  };
19864  
19865  
19866  
19867  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/easing/modifiers/mirror.mjs
19868  // Accepts an easing function and returns a new one that outputs mirrored values for
19869  // the second half of the animation. Turns easeIn into easeInOut.
19870  const mirrorEasing = (easing) => (p) => p <= 0.5 ? easing(2 * p) / 2 : (2 - easing(2 * (1 - p))) / 2;
19871  
19872  
19873  
19874  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/easing/modifiers/reverse.mjs
19875  // Accepts an easing function and returns a new one that outputs reversed values.
19876  // Turns easeIn into easeOut.
19877  const reverseEasing = (easing) => (p) => 1 - easing(1 - p);
19878  
19879  
19880  
19881  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/easing/circ.mjs
19882  
19883  
19884  
19885  const circIn = (p) => 1 - Math.sin(Math.acos(p));
19886  const circOut = reverseEasing(circIn);
19887  const circInOut = mirrorEasing(circIn);
19888  
19889  
19890  
19891  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/easing/back.mjs
19892  
19893  
19894  
19895  
19896  const backOut = cubicBezier(0.33, 1.53, 0.69, 0.99);
19897  const backIn = reverseEasing(backOut);
19898  const backInOut = mirrorEasing(backIn);
19899  
19900  
19901  
19902  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/easing/anticipate.mjs
19903  
19904  
19905  const anticipate = (p) => (p *= 2) < 1 ? 0.5 * backIn(p) : 0.5 * (2 - Math.pow(2, -10 * (p - 1)));
19906  
19907  
19908  
19909  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/easing/utils/map.mjs
19910  
19911  
19912  
19913  
19914  
19915  
19916  
19917  
19918  const easingLookup = {
19919      linear: noop_noop,
19920      easeIn: easeIn,
19921      easeInOut: easeInOut,
19922      easeOut: easeOut,
19923      circIn: circIn,
19924      circInOut: circInOut,
19925      circOut: circOut,
19926      backIn: backIn,
19927      backInOut: backInOut,
19928      backOut: backOut,
19929      anticipate: anticipate,
19930  };
19931  const easingDefinitionToFunction = (definition) => {
19932      if (Array.isArray(definition)) {
19933          // If cubic bezier definition, create bezier curve
19934          errors_invariant(definition.length === 4, `Cubic bezier arrays must contain four numerical values.`);
19935          const [x1, y1, x2, y2] = definition;
19936          return cubicBezier(x1, y1, x2, y2);
19937      }
19938      else if (typeof definition === "string") {
19939          // Else lookup from table
19940          errors_invariant(easingLookup[definition] !== undefined, `Invalid easing type '$definition}'`);
19941          return easingLookup[definition];
19942      }
19943      return definition;
19944  };
19945  
19946  
19947  
19948  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/progress.mjs
19949  /*
19950    Progress within given range
19951  
19952    Given a lower limit and an upper limit, we return the progress
19953    (expressed as a number 0-1) represented by the given value, and
19954    limit that progress to within 0-1.
19955  
19956    @param [number]: Lower limit
19957    @param [number]: Upper limit
19958    @param [number]: Value to find progress within given range
19959    @return [number]: Progress of value within range as expressed 0-1
19960  */
19961  const progress = (from, to, value) => {
19962      const toFromDifference = to - from;
19963      return toFromDifference === 0 ? 1 : (value - from) / toFromDifference;
19964  };
19965  
19966  
19967  
19968  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/mix/number.mjs
19969  /*
19970    Value in range from progress
19971  
19972    Given a lower limit and an upper limit, we return the value within
19973    that range as expressed by progress (usually a number from 0 to 1)
19974  
19975    So progress = 0.5 would change
19976  
19977    from -------- to
19978  
19979    to
19980  
19981    from ---- to
19982  
19983    E.g. from = 10, to = 20, progress = 0.5 => 15
19984  
19985    @param [number]: Lower limit of range
19986    @param [number]: Upper limit of range
19987    @param [number]: The progress between lower and upper limits expressed 0-1
19988    @return [number]: Value as calculated from progress within range (not limited within range)
19989  */
19990  const mixNumber = (from, to, progress) => {
19991      return from + (to - from) * progress;
19992  };
19993  
19994  
19995  
19996  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/hsla-to-rgba.mjs
19997  // Adapted from https://gist.github.com/mjackson/5311256
19998  function hueToRgb(p, q, t) {
19999      if (t < 0)
20000          t += 1;
20001      if (t > 1)
20002          t -= 1;
20003      if (t < 1 / 6)
20004          return p + (q - p) * 6 * t;
20005      if (t < 1 / 2)
20006          return q;
20007      if (t < 2 / 3)
20008          return p + (q - p) * (2 / 3 - t) * 6;
20009      return p;
20010  }
20011  function hslaToRgba({ hue, saturation, lightness, alpha }) {
20012      hue /= 360;
20013      saturation /= 100;
20014      lightness /= 100;
20015      let red = 0;
20016      let green = 0;
20017      let blue = 0;
20018      if (!saturation) {
20019          red = green = blue = lightness;
20020      }
20021      else {
20022          const q = lightness < 0.5
20023              ? lightness * (1 + saturation)
20024              : lightness + saturation - lightness * saturation;
20025          const p = 2 * lightness - q;
20026          red = hueToRgb(p, q, hue + 1 / 3);
20027          green = hueToRgb(p, q, hue);
20028          blue = hueToRgb(p, q, hue - 1 / 3);
20029      }
20030      return {
20031          red: Math.round(red * 255),
20032          green: Math.round(green * 255),
20033          blue: Math.round(blue * 255),
20034          alpha,
20035      };
20036  }
20037  
20038  
20039  
20040  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/mix/color.mjs
20041  
20042  
20043  
20044  
20045  
20046  
20047  
20048  // Linear color space blending
20049  // Explained https://www.youtube.com/watch?v=LKnqECcg6Gw
20050  // Demonstrated http://codepen.io/osublake/pen/xGVVaN
20051  const mixLinearColor = (from, to, v) => {
20052      const fromExpo = from * from;
20053      const expo = v * (to * to - fromExpo) + fromExpo;
20054      return expo < 0 ? 0 : Math.sqrt(expo);
20055  };
20056  const colorTypes = [hex, rgba, hsla];
20057  const getColorType = (v) => colorTypes.find((type) => type.test(v));
20058  function asRGBA(color) {
20059      const type = getColorType(color);
20060      errors_invariant(Boolean(type), `'$color}' is not an animatable color. Use the equivalent color code instead.`);
20061      let model = type.parse(color);
20062      if (type === hsla) {
20063          // TODO Remove this cast - needed since Framer Motion's stricter typing
20064          model = hslaToRgba(model);
20065      }
20066      return model;
20067  }
20068  const mixColor = (from, to) => {
20069      const fromRGBA = asRGBA(from);
20070      const toRGBA = asRGBA(to);
20071      const blended = { ...fromRGBA };
20072      return (v) => {
20073          blended.red = mixLinearColor(fromRGBA.red, toRGBA.red, v);
20074          blended.green = mixLinearColor(fromRGBA.green, toRGBA.green, v);
20075          blended.blue = mixLinearColor(fromRGBA.blue, toRGBA.blue, v);
20076          blended.alpha = mixNumber(fromRGBA.alpha, toRGBA.alpha, v);
20077          return rgba.transform(blended);
20078      };
20079  };
20080  
20081  
20082  
20083  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/mix/visibility.mjs
20084  const invisibleValues = new Set(["none", "hidden"]);
20085  /**
20086   * Returns a function that, when provided a progress value between 0 and 1,
20087   * will return the "none" or "hidden" string only when the progress is that of
20088   * the origin or target.
20089   */
20090  function mixVisibility(origin, target) {
20091      if (invisibleValues.has(origin)) {
20092          return (p) => (p <= 0 ? origin : target);
20093      }
20094      else {
20095          return (p) => (p >= 1 ? target : origin);
20096      }
20097  }
20098  
20099  
20100  
20101  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/mix/complex.mjs
20102  
20103  
20104  
20105  
20106  
20107  
20108  
20109  
20110  
20111  function mixImmediate(a, b) {
20112      return (p) => (p > 0 ? b : a);
20113  }
20114  function complex_mixNumber(a, b) {
20115      return (p) => mixNumber(a, b, p);
20116  }
20117  function getMixer(a) {
20118      if (typeof a === "number") {
20119          return complex_mixNumber;
20120      }
20121      else if (typeof a === "string") {
20122          return isCSSVariableToken(a)
20123              ? mixImmediate
20124              : color.test(a)
20125                  ? mixColor
20126                  : mixComplex;
20127      }
20128      else if (Array.isArray(a)) {
20129          return mixArray;
20130      }
20131      else if (typeof a === "object") {
20132          return color.test(a) ? mixColor : mixObject;
20133      }
20134      return mixImmediate;
20135  }
20136  function mixArray(a, b) {
20137      const output = [...a];
20138      const numValues = output.length;
20139      const blendValue = a.map((v, i) => getMixer(v)(v, b[i]));
20140      return (p) => {
20141          for (let i = 0; i < numValues; i++) {
20142              output[i] = blendValue[i](p);
20143          }
20144          return output;
20145      };
20146  }
20147  function mixObject(a, b) {
20148      const output = { ...a, ...b };
20149      const blendValue = {};
20150      for (const key in output) {
20151          if (a[key] !== undefined && b[key] !== undefined) {
20152              blendValue[key] = getMixer(a[key])(a[key], b[key]);
20153          }
20154      }
20155      return (v) => {
20156          for (const key in blendValue) {
20157              output[key] = blendValue[key](v);
20158          }
20159          return output;
20160      };
20161  }
20162  function matchOrder(origin, target) {
20163      var _a;
20164      const orderedOrigin = [];
20165      const pointers = { color: 0, var: 0, number: 0 };
20166      for (let i = 0; i < target.values.length; i++) {
20167          const type = target.types[i];
20168          const originIndex = origin.indexes[type][pointers[type]];
20169          const originValue = (_a = origin.values[originIndex]) !== null && _a !== void 0 ? _a : 0;
20170          orderedOrigin[i] = originValue;
20171          pointers[type]++;
20172      }
20173      return orderedOrigin;
20174  }
20175  const mixComplex = (origin, target) => {
20176      const template = complex.createTransformer(target);
20177      const originStats = analyseComplexValue(origin);
20178      const targetStats = analyseComplexValue(target);
20179      const canInterpolate = originStats.indexes.var.length === targetStats.indexes.var.length &&
20180          originStats.indexes.color.length === targetStats.indexes.color.length &&
20181          originStats.indexes.number.length >= targetStats.indexes.number.length;
20182      if (canInterpolate) {
20183          if ((invisibleValues.has(origin) &&
20184              !targetStats.values.length) ||
20185              (invisibleValues.has(target) &&
20186                  !originStats.values.length)) {
20187              return mixVisibility(origin, target);
20188          }
20189          return pipe(mixArray(matchOrder(originStats, targetStats), targetStats.values), template);
20190      }
20191      else {
20192          warning(true, `Complex values '$origin}' and '$target}' too different to mix. Ensure all colors are of the same type, and that each contains the same quantity of number and color values. Falling back to instant transition.`);
20193          return mixImmediate(origin, target);
20194      }
20195  };
20196  
20197  
20198  
20199  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/mix/index.mjs
20200  
20201  
20202  
20203  function mix(from, to, p) {
20204      if (typeof from === "number" &&
20205          typeof to === "number" &&
20206          typeof p === "number") {
20207          return mixNumber(from, to, p);
20208      }
20209      const mixer = getMixer(from);
20210      return mixer(from, to);
20211  }
20212  
20213  
20214  
20215  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/interpolate.mjs
20216  
20217  
20218  
20219  
20220  
20221  
20222  
20223  function createMixers(output, ease, customMixer) {
20224      const mixers = [];
20225      const mixerFactory = customMixer || mix;
20226      const numMixers = output.length - 1;
20227      for (let i = 0; i < numMixers; i++) {
20228          let mixer = mixerFactory(output[i], output[i + 1]);
20229          if (ease) {
20230              const easingFunction = Array.isArray(ease) ? ease[i] || noop_noop : ease;
20231              mixer = pipe(easingFunction, mixer);
20232          }
20233          mixers.push(mixer);
20234      }
20235      return mixers;
20236  }
20237  /**
20238   * Create a function that maps from a numerical input array to a generic output array.
20239   *
20240   * Accepts:
20241   *   - Numbers
20242   *   - Colors (hex, hsl, hsla, rgb, rgba)
20243   *   - Complex (combinations of one or more numbers or strings)
20244   *
20245   * ```jsx
20246   * const mixColor = interpolate([0, 1], ['#fff', '#000'])
20247   *
20248   * mixColor(0.5) // 'rgba(128, 128, 128, 1)'
20249   * ```
20250   *
20251   * TODO Revist this approach once we've moved to data models for values,
20252   * probably not needed to pregenerate mixer functions.
20253   *
20254   * @public
20255   */
20256  function interpolate(input, output, { clamp: isClamp = true, ease, mixer } = {}) {
20257      const inputLength = input.length;
20258      errors_invariant(inputLength === output.length, "Both input and output ranges must be the same length");
20259      /**
20260       * If we're only provided a single input, we can just make a function
20261       * that returns the output.
20262       */
20263      if (inputLength === 1)
20264          return () => output[0];
20265      if (inputLength === 2 && input[0] === input[1])
20266          return () => output[1];
20267      // If input runs highest -> lowest, reverse both arrays
20268      if (input[0] > input[inputLength - 1]) {
20269          input = [...input].reverse();
20270          output = [...output].reverse();
20271      }
20272      const mixers = createMixers(output, ease, mixer);
20273      const numMixers = mixers.length;
20274      const interpolator = (v) => {
20275          let i = 0;
20276          if (numMixers > 1) {
20277              for (; i < input.length - 2; i++) {
20278                  if (v < input[i + 1])
20279                      break;
20280              }
20281          }
20282          const progressInRange = progress(input[i], input[i + 1], v);
20283          return mixers[i](progressInRange);
20284      };
20285      return isClamp
20286          ? (v) => interpolator(clamp_clamp(input[0], input[inputLength - 1], v))
20287          : interpolator;
20288  }
20289  
20290  
20291  
20292  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/offsets/fill.mjs
20293  
20294  
20295  
20296  function fillOffset(offset, remaining) {
20297      const min = offset[offset.length - 1];
20298      for (let i = 1; i <= remaining; i++) {
20299          const offsetProgress = progress(0, remaining, i);
20300          offset.push(mixNumber(min, 1, offsetProgress));
20301      }
20302  }
20303  
20304  
20305  
20306  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/offsets/default.mjs
20307  
20308  
20309  function defaultOffset(arr) {
20310      const offset = [0];
20311      fillOffset(offset, arr.length - 1);
20312      return offset;
20313  }
20314  
20315  
20316  
20317  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/offsets/time.mjs
20318  function convertOffsetToTimes(offset, duration) {
20319      return offset.map((o) => o * duration);
20320  }
20321  
20322  
20323  
20324  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/animation/generators/keyframes.mjs
20325  
20326  
20327  
20328  
20329  
20330  
20331  
20332  function defaultEasing(values, easing) {
20333      return values.map(() => easing || easeInOut).splice(0, values.length - 1);
20334  }
20335  function keyframes_keyframes({ duration = 300, keyframes: keyframeValues, times, ease = "easeInOut", }) {
20336      /**
20337       * Easing functions can be externally defined as strings. Here we convert them
20338       * into actual functions.
20339       */
20340      const easingFunctions = isEasingArray(ease)
20341          ? ease.map(easingDefinitionToFunction)
20342          : easingDefinitionToFunction(ease);
20343      /**
20344       * This is the Iterator-spec return value. We ensure it's mutable rather than using a generator
20345       * to reduce GC during animation.
20346       */
20347      const state = {
20348          done: false,
20349          value: keyframeValues[0],
20350      };
20351      /**
20352       * Create a times array based on the provided 0-1 offsets
20353       */
20354      const absoluteTimes = convertOffsetToTimes(
20355      // Only use the provided offsets if they're the correct length
20356      // TODO Maybe we should warn here if there's a length mismatch
20357      times && times.length === keyframeValues.length
20358          ? times
20359          : defaultOffset(keyframeValues), duration);
20360      const mapTimeToKeyframe = interpolate(absoluteTimes, keyframeValues, {
20361          ease: Array.isArray(easingFunctions)
20362              ? easingFunctions
20363              : defaultEasing(keyframeValues, easingFunctions),
20364      });
20365      return {
20366          calculatedDuration: duration,
20367          next: (t) => {
20368              state.value = mapTimeToKeyframe(t);
20369              state.done = t >= duration;
20370              return state;
20371          },
20372      };
20373  }
20374  
20375  
20376  
20377  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/animation/generators/utils/calc-duration.mjs
20378  /**
20379   * Implement a practical max duration for keyframe generation
20380   * to prevent infinite loops
20381   */
20382  const maxGeneratorDuration = 20000;
20383  function calcGeneratorDuration(generator) {
20384      let duration = 0;
20385      const timeStep = 50;
20386      let state = generator.next(duration);
20387      while (!state.done && duration < maxGeneratorDuration) {
20388          duration += timeStep;
20389          state = generator.next(duration);
20390      }
20391      return duration >= maxGeneratorDuration ? Infinity : duration;
20392  }
20393  
20394  
20395  
20396  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/animation/animators/drivers/driver-frameloop.mjs
20397  
20398  
20399  
20400  const frameloopDriver = (update) => {
20401      const passTimestamp = ({ timestamp }) => update(timestamp);
20402      return {
20403          start: () => frame_frame.update(passTimestamp, true),
20404          stop: () => cancelFrame(passTimestamp),
20405          /**
20406           * If we're processing this frame we can use the
20407           * framelocked timestamp to keep things in sync.
20408           */
20409          now: () => (frameData.isProcessing ? frameData.timestamp : time.now()),
20410      };
20411  };
20412  
20413  
20414  
20415  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/animation/animators/MainThreadAnimation.mjs
20416  
20417  
20418  
20419  
20420  
20421  
20422  
20423  
20424  
20425  
20426  
20427  
20428  
20429  
20430  const generators = {
20431      decay: inertia,
20432      inertia: inertia,
20433      tween: keyframes_keyframes,
20434      keyframes: keyframes_keyframes,
20435      spring: spring,
20436  };
20437  const percentToProgress = (percent) => percent / 100;
20438  /**
20439   * Animation that runs on the main thread. Designed to be WAAPI-spec in the subset of
20440   * features we expose publically. Mostly the compatibility is to ensure visual identity
20441   * between both WAAPI and main thread animations.
20442   */
20443  class MainThreadAnimation extends BaseAnimation {
20444      constructor({ KeyframeResolver: KeyframeResolver$1 = KeyframeResolver, ...options }) {
20445          super(options);
20446          /**
20447           * The time at which the animation was paused.
20448           */
20449          this.holdTime = null;
20450          /**
20451           * The time at which the animation was started.
20452           */
20453          this.startTime = null;
20454          /**
20455           * The time at which the animation was cancelled.
20456           */
20457          this.cancelTime = null;
20458          /**
20459           * The current time of the animation.
20460           */
20461          this.currentTime = 0;
20462          /**
20463           * Playback speed as a factor. 0 would be stopped, -1 reverse and 2 double speed.
20464           */
20465          this.playbackSpeed = 1;
20466          /**
20467           * The state of the animation to apply when the animation is resolved. This
20468           * allows calls to the public API to control the animation before it is resolved,
20469           * without us having to resolve it first.
20470           */
20471          this.pendingPlayState = "running";
20472          this.state = "idle";
20473          /**
20474           * This method is bound to the instance to fix a pattern where
20475           * animation.stop is returned as a reference from a useEffect.
20476           */
20477          this.stop = () => {
20478              this.resolver.cancel();
20479              this.isStopped = true;
20480              if (this.state === "idle")
20481                  return;
20482              this.teardown();
20483              const { onStop } = this.options;
20484              onStop && onStop();
20485          };
20486          const { name, motionValue, keyframes } = this.options;
20487          const onResolved = (resolvedKeyframes, finalKeyframe) => this.onKeyframesResolved(resolvedKeyframes, finalKeyframe);
20488          if (name && motionValue && motionValue.owner) {
20489              this.resolver = motionValue.owner.resolveKeyframes(keyframes, onResolved, name, motionValue);
20490          }
20491          else {
20492              this.resolver = new KeyframeResolver$1(keyframes, onResolved, name, motionValue);
20493          }
20494          this.resolver.scheduleResolve();
20495      }
20496      initPlayback(keyframes$1) {
20497          const { type = "keyframes", repeat = 0, repeatDelay = 0, repeatType, velocity = 0, } = this.options;
20498          const generatorFactory = generators[type] || keyframes_keyframes;
20499          /**
20500           * If our generator doesn't support mixing numbers, we need to replace keyframes with
20501           * [0, 100] and then make a function that maps that to the actual keyframes.
20502           *
20503           * 100 is chosen instead of 1 as it works nicer with spring animations.
20504           */
20505          let mapPercentToKeyframes;
20506          let mirroredGenerator;
20507          if (generatorFactory !== keyframes_keyframes &&
20508              typeof keyframes$1[0] !== "number") {
20509              if (false) {}
20510              mapPercentToKeyframes = pipe(percentToProgress, mix(keyframes$1[0], keyframes$1[1]));
20511              keyframes$1 = [0, 100];
20512          }
20513          const generator = generatorFactory({ ...this.options, keyframes: keyframes$1 });
20514          /**
20515           * If we have a mirror repeat type we need to create a second generator that outputs the
20516           * mirrored (not reversed) animation and later ping pong between the two generators.
20517           */
20518          if (repeatType === "mirror") {
20519              mirroredGenerator = generatorFactory({
20520                  ...this.options,
20521                  keyframes: [...keyframes$1].reverse(),
20522                  velocity: -velocity,
20523              });
20524          }
20525          /**
20526           * If duration is undefined and we have repeat options,
20527           * we need to calculate a duration from the generator.
20528           *
20529           * We set it to the generator itself to cache the duration.
20530           * Any timeline resolver will need to have already precalculated
20531           * the duration by this step.
20532           */
20533          if (generator.calculatedDuration === null) {
20534              generator.calculatedDuration = calcGeneratorDuration(generator);
20535          }
20536          const { calculatedDuration } = generator;
20537          const resolvedDuration = calculatedDuration + repeatDelay;
20538          const totalDuration = resolvedDuration * (repeat + 1) - repeatDelay;
20539          return {
20540              generator,
20541              mirroredGenerator,
20542              mapPercentToKeyframes,
20543              calculatedDuration,
20544              resolvedDuration,
20545              totalDuration,
20546          };
20547      }
20548      onPostResolved() {
20549          const { autoplay = true } = this.options;
20550          this.play();
20551          if (this.pendingPlayState === "paused" || !autoplay) {
20552              this.pause();
20553          }
20554          else {
20555              this.state = this.pendingPlayState;
20556          }
20557      }
20558      tick(timestamp, sample = false) {
20559          const { resolved } = this;
20560          // If the animations has failed to resolve, return the final keyframe.
20561          if (!resolved) {
20562              const { keyframes } = this.options;
20563              return { done: true, value: keyframes[keyframes.length - 1] };
20564          }
20565          const { finalKeyframe, generator, mirroredGenerator, mapPercentToKeyframes, keyframes, calculatedDuration, totalDuration, resolvedDuration, } = resolved;
20566          if (this.startTime === null)
20567              return generator.next(0);
20568          const { delay, repeat, repeatType, repeatDelay, onUpdate } = this.options;
20569          /**
20570           * requestAnimationFrame timestamps can come through as lower than
20571           * the startTime as set by performance.now(). Here we prevent this,
20572           * though in the future it could be possible to make setting startTime
20573           * a pending operation that gets resolved here.
20574           */
20575          if (this.speed > 0) {
20576              this.startTime = Math.min(this.startTime, timestamp);
20577          }
20578          else if (this.speed < 0) {
20579              this.startTime = Math.min(timestamp - totalDuration / this.speed, this.startTime);
20580          }
20581          // Update currentTime
20582          if (sample) {
20583              this.currentTime = timestamp;
20584          }
20585          else if (this.holdTime !== null) {
20586              this.currentTime = this.holdTime;
20587          }
20588          else {
20589              // Rounding the time because floating point arithmetic is not always accurate, e.g. 3000.367 - 1000.367 =
20590              // 2000.0000000000002. This is a problem when we are comparing the currentTime with the duration, for
20591              // example.
20592              this.currentTime =
20593                  Math.round(timestamp - this.startTime) * this.speed;
20594          }
20595          // Rebase on delay
20596          const timeWithoutDelay = this.currentTime - delay * (this.speed >= 0 ? 1 : -1);
20597          const isInDelayPhase = this.speed >= 0
20598              ? timeWithoutDelay < 0
20599              : timeWithoutDelay > totalDuration;
20600          this.currentTime = Math.max(timeWithoutDelay, 0);
20601          // If this animation has finished, set the current time  to the total duration.
20602          if (this.state === "finished" && this.holdTime === null) {
20603              this.currentTime = totalDuration;
20604          }
20605          let elapsed = this.currentTime;
20606          let frameGenerator = generator;
20607          if (repeat) {
20608              /**
20609               * Get the current progress (0-1) of the animation. If t is >
20610               * than duration we'll get values like 2.5 (midway through the
20611               * third iteration)
20612               */
20613              const progress = Math.min(this.currentTime, totalDuration) / resolvedDuration;
20614              /**
20615               * Get the current iteration (0 indexed). For instance the floor of
20616               * 2.5 is 2.
20617               */
20618              let currentIteration = Math.floor(progress);
20619              /**
20620               * Get the current progress of the iteration by taking the remainder
20621               * so 2.5 is 0.5 through iteration 2
20622               */
20623              let iterationProgress = progress % 1.0;
20624              /**
20625               * If iteration progress is 1 we count that as the end
20626               * of the previous iteration.
20627               */
20628              if (!iterationProgress && progress >= 1) {
20629                  iterationProgress = 1;
20630              }
20631              iterationProgress === 1 && currentIteration--;
20632              currentIteration = Math.min(currentIteration, repeat + 1);
20633              /**
20634               * Reverse progress if we're not running in "normal" direction
20635               */
20636              const isOddIteration = Boolean(currentIteration % 2);
20637              if (isOddIteration) {
20638                  if (repeatType === "reverse") {
20639                      iterationProgress = 1 - iterationProgress;
20640                      if (repeatDelay) {
20641                          iterationProgress -= repeatDelay / resolvedDuration;
20642                      }
20643                  }
20644                  else if (repeatType === "mirror") {
20645                      frameGenerator = mirroredGenerator;
20646                  }
20647              }
20648              elapsed = clamp_clamp(0, 1, iterationProgress) * resolvedDuration;
20649          }
20650          /**
20651           * If we're in negative time, set state as the initial keyframe.
20652           * This prevents delay: x, duration: 0 animations from finishing
20653           * instantly.
20654           */
20655          const state = isInDelayPhase
20656              ? { done: false, value: keyframes[0] }
20657              : frameGenerator.next(elapsed);
20658          if (mapPercentToKeyframes) {
20659              state.value = mapPercentToKeyframes(state.value);
20660          }
20661          let { done } = state;
20662          if (!isInDelayPhase && calculatedDuration !== null) {
20663              done =
20664                  this.speed >= 0
20665                      ? this.currentTime >= totalDuration
20666                      : this.currentTime <= 0;
20667          }
20668          const isAnimationFinished = this.holdTime === null &&
20669              (this.state === "finished" || (this.state === "running" && done));
20670          if (isAnimationFinished && finalKeyframe !== undefined) {
20671              state.value = getFinalKeyframe(keyframes, this.options, finalKeyframe);
20672          }
20673          if (onUpdate) {
20674              onUpdate(state.value);
20675          }
20676          if (isAnimationFinished) {
20677              this.finish();
20678          }
20679          return state;
20680      }
20681      get duration() {
20682          const { resolved } = this;
20683          return resolved ? millisecondsToSeconds(resolved.calculatedDuration) : 0;
20684      }
20685      get time() {
20686          return millisecondsToSeconds(this.currentTime);
20687      }
20688      set time(newTime) {
20689          newTime = secondsToMilliseconds(newTime);
20690          this.currentTime = newTime;
20691          if (this.holdTime !== null || this.speed === 0) {
20692              this.holdTime = newTime;
20693          }
20694          else if (this.driver) {
20695              this.startTime = this.driver.now() - newTime / this.speed;
20696          }
20697      }
20698      get speed() {
20699          return this.playbackSpeed;
20700      }
20701      set speed(newSpeed) {
20702          const hasChanged = this.playbackSpeed !== newSpeed;
20703          this.playbackSpeed = newSpeed;
20704          if (hasChanged) {
20705              this.time = millisecondsToSeconds(this.currentTime);
20706          }
20707      }
20708      play() {
20709          if (!this.resolver.isScheduled) {
20710              this.resolver.resume();
20711          }
20712          if (!this._resolved) {
20713              this.pendingPlayState = "running";
20714              return;
20715          }
20716          if (this.isStopped)
20717              return;
20718          const { driver = frameloopDriver, onPlay } = this.options;
20719          if (!this.driver) {
20720              this.driver = driver((timestamp) => this.tick(timestamp));
20721          }
20722          onPlay && onPlay();
20723          const now = this.driver.now();
20724          if (this.holdTime !== null) {
20725              this.startTime = now - this.holdTime;
20726          }
20727          else if (!this.startTime || this.state === "finished") {
20728              this.startTime = now;
20729          }
20730          if (this.state === "finished") {
20731              this.updateFinishedPromise();
20732          }
20733          this.cancelTime = this.startTime;
20734          this.holdTime = null;
20735          /**
20736           * Set playState to running only after we've used it in
20737           * the previous logic.
20738           */
20739          this.state = "running";
20740          this.driver.start();
20741      }
20742      pause() {
20743          var _a;
20744          if (!this._resolved) {
20745              this.pendingPlayState = "paused";
20746              return;
20747          }
20748          this.state = "paused";
20749          this.holdTime = (_a = this.currentTime) !== null && _a !== void 0 ? _a : 0;
20750      }
20751      complete() {
20752          if (this.state !== "running") {
20753              this.play();
20754          }
20755          this.pendingPlayState = this.state = "finished";
20756          this.holdTime = null;
20757      }
20758      finish() {
20759          this.teardown();
20760          this.state = "finished";
20761          const { onComplete } = this.options;
20762          onComplete && onComplete();
20763      }
20764      cancel() {
20765          if (this.cancelTime !== null) {
20766              this.tick(this.cancelTime);
20767          }
20768          this.teardown();
20769          this.updateFinishedPromise();
20770      }
20771      teardown() {
20772          this.state = "idle";
20773          this.stopDriver();
20774          this.resolveFinishedPromise();
20775          this.updateFinishedPromise();
20776          this.startTime = this.cancelTime = null;
20777          this.resolver.cancel();
20778      }
20779      stopDriver() {
20780          if (!this.driver)
20781              return;
20782          this.driver.stop();
20783          this.driver = undefined;
20784      }
20785      sample(time) {
20786          this.startTime = 0;
20787          return this.tick(time, true);
20788      }
20789  }
20790  // Legacy interface
20791  function animateValue(options) {
20792      return new MainThreadAnimation(options);
20793  }
20794  
20795  
20796  
20797  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/easing/utils/is-bezier-definition.mjs
20798  const isBezierDefinition = (easing) => Array.isArray(easing) && typeof easing[0] === "number";
20799  
20800  
20801  
20802  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/animation/animators/waapi/easing.mjs
20803  
20804  
20805  function isWaapiSupportedEasing(easing) {
20806      return Boolean(!easing ||
20807          (typeof easing === "string" && easing in supportedWaapiEasing) ||
20808          isBezierDefinition(easing) ||
20809          (Array.isArray(easing) && easing.every(isWaapiSupportedEasing)));
20810  }
20811  const cubicBezierAsString = ([a, b, c, d]) => `cubic-bezier($a}, $b}, $c}, $d})`;
20812  const supportedWaapiEasing = {
20813      linear: "linear",
20814      ease: "ease",
20815      easeIn: "ease-in",
20816      easeOut: "ease-out",
20817      easeInOut: "ease-in-out",
20818      circIn: cubicBezierAsString([0, 0.65, 0.55, 1]),
20819      circOut: cubicBezierAsString([0.55, 0, 1, 0.45]),
20820      backIn: cubicBezierAsString([0.31, 0.01, 0.66, -0.59]),
20821      backOut: cubicBezierAsString([0.33, 1.53, 0.69, 0.99]),
20822  };
20823  function mapEasingToNativeEasingWithDefault(easing) {
20824      return (mapEasingToNativeEasing(easing) ||
20825          supportedWaapiEasing.easeOut);
20826  }
20827  function mapEasingToNativeEasing(easing) {
20828      if (!easing) {
20829          return undefined;
20830      }
20831      else if (isBezierDefinition(easing)) {
20832          return cubicBezierAsString(easing);
20833      }
20834      else if (Array.isArray(easing)) {
20835          return easing.map(mapEasingToNativeEasingWithDefault);
20836      }
20837      else {
20838          return supportedWaapiEasing[easing];
20839      }
20840  }
20841  
20842  
20843  
20844  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/animation/animators/waapi/index.mjs
20845  
20846  
20847  function animateStyle(element, valueName, keyframes, { delay = 0, duration = 300, repeat = 0, repeatType = "loop", ease, times, } = {}) {
20848      const keyframeOptions = { [valueName]: keyframes };
20849      if (times)
20850          keyframeOptions.offset = times;
20851      const easing = mapEasingToNativeEasing(ease);
20852      /**
20853       * If this is an easing array, apply to keyframes, not animation as a whole
20854       */
20855      if (Array.isArray(easing))
20856          keyframeOptions.easing = easing;
20857      return element.animate(keyframeOptions, {
20858          delay,
20859          duration,
20860          easing: !Array.isArray(easing) ? easing : "linear",
20861          fill: "both",
20862          iterations: repeat + 1,
20863          direction: repeatType === "reverse" ? "alternate" : "normal",
20864      });
20865  }
20866  
20867  
20868  
20869  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/animation/animators/AcceleratedAnimation.mjs
20870  
20871  
20872  
20873  
20874  
20875  
20876  
20877  
20878  
20879  
20880  
20881  const supportsWaapi = memo(() => Object.hasOwnProperty.call(Element.prototype, "animate"));
20882  /**
20883   * A list of values that can be hardware-accelerated.
20884   */
20885  const acceleratedValues = new Set([
20886      "opacity",
20887      "clipPath",
20888      "filter",
20889      "transform",
20890      // TODO: Can be accelerated but currently disabled until https://issues.chromium.org/issues/41491098 is resolved
20891      // or until we implement support for linear() easing.
20892      // "background-color"
20893  ]);
20894  /**
20895   * 10ms is chosen here as it strikes a balance between smooth
20896   * results (more than one keyframe per frame at 60fps) and
20897   * keyframe quantity.
20898   */
20899  const sampleDelta = 10; //ms
20900  /**
20901   * Implement a practical max duration for keyframe generation
20902   * to prevent infinite loops
20903   */
20904  const AcceleratedAnimation_maxDuration = 20000;
20905  /**
20906   * Check if an animation can run natively via WAAPI or requires pregenerated keyframes.
20907   * WAAPI doesn't support spring or function easings so we run these as JS animation before
20908   * handing off.
20909   */
20910  function requiresPregeneratedKeyframes(options) {
20911      return (options.type === "spring" ||
20912          options.name === "backgroundColor" ||
20913          !isWaapiSupportedEasing(options.ease));
20914  }
20915  function pregenerateKeyframes(keyframes, options) {
20916      /**
20917       * Create a main-thread animation to pregenerate keyframes.
20918       * We sample this at regular intervals to generate keyframes that we then
20919       * linearly interpolate between.
20920       */
20921      const sampleAnimation = new MainThreadAnimation({
20922          ...options,
20923          keyframes,
20924          repeat: 0,
20925          delay: 0,
20926          isGenerator: true,
20927      });
20928      let state = { done: false, value: keyframes[0] };
20929      const pregeneratedKeyframes = [];
20930      /**
20931       * Bail after 20 seconds of pre-generated keyframes as it's likely
20932       * we're heading for an infinite loop.
20933       */
20934      let t = 0;
20935      while (!state.done && t < AcceleratedAnimation_maxDuration) {
20936          state = sampleAnimation.sample(t);
20937          pregeneratedKeyframes.push(state.value);
20938          t += sampleDelta;
20939      }
20940      return {
20941          times: undefined,
20942          keyframes: pregeneratedKeyframes,
20943          duration: t - sampleDelta,
20944          ease: "linear",
20945      };
20946  }
20947  class AcceleratedAnimation extends BaseAnimation {
20948      constructor(options) {
20949          super(options);
20950          const { name, motionValue, keyframes } = this.options;
20951          this.resolver = new DOMKeyframesResolver(keyframes, (resolvedKeyframes, finalKeyframe) => this.onKeyframesResolved(resolvedKeyframes, finalKeyframe), name, motionValue);
20952          this.resolver.scheduleResolve();
20953      }
20954      initPlayback(keyframes, finalKeyframe) {
20955          var _a;
20956          let { duration = 300, times, ease, type, motionValue, name, } = this.options;
20957          /**
20958           * If element has since been unmounted, return false to indicate
20959           * the animation failed to initialised.
20960           */
20961          if (!((_a = motionValue.owner) === null || _a === void 0 ? void 0 : _a.current)) {
20962              return false;
20963          }
20964          /**
20965           * If this animation needs pre-generated keyframes then generate.
20966           */
20967          if (requiresPregeneratedKeyframes(this.options)) {
20968              const { onComplete, onUpdate, motionValue, ...options } = this.options;
20969              const pregeneratedAnimation = pregenerateKeyframes(keyframes, options);
20970              keyframes = pregeneratedAnimation.keyframes;
20971              // If this is a very short animation, ensure we have
20972              // at least two keyframes to animate between as older browsers
20973              // can't animate between a single keyframe.
20974              if (keyframes.length === 1) {
20975                  keyframes[1] = keyframes[0];
20976              }
20977              duration = pregeneratedAnimation.duration;
20978              times = pregeneratedAnimation.times;
20979              ease = pregeneratedAnimation.ease;
20980              type = "keyframes";
20981          }
20982          const animation = animateStyle(motionValue.owner.current, name, keyframes, { ...this.options, duration, times, ease });
20983          // Override the browser calculated startTime with one synchronised to other JS
20984          // and WAAPI animations starting this event loop.
20985          animation.startTime = time.now();
20986          if (this.pendingTimeline) {
20987              animation.timeline = this.pendingTimeline;
20988              this.pendingTimeline = undefined;
20989          }
20990          else {
20991              /**
20992               * Prefer the `onfinish` prop as it's more widely supported than
20993               * the `finished` promise.
20994               *
20995               * Here, we synchronously set the provided MotionValue to the end
20996               * keyframe. If we didn't, when the WAAPI animation is finished it would
20997               * be removed from the element which would then revert to its old styles.
20998               */
20999              animation.onfinish = () => {
21000                  const { onComplete } = this.options;
21001                  motionValue.set(getFinalKeyframe(keyframes, this.options, finalKeyframe));
21002                  onComplete && onComplete();
21003                  this.cancel();
21004                  this.resolveFinishedPromise();
21005              };
21006          }
21007          return {
21008              animation,
21009              duration,
21010              times,
21011              type,
21012              ease,
21013              keyframes: keyframes,
21014          };
21015      }
21016      get duration() {
21017          const { resolved } = this;
21018          if (!resolved)
21019              return 0;
21020          const { duration } = resolved;
21021          return millisecondsToSeconds(duration);
21022      }
21023      get time() {
21024          const { resolved } = this;
21025          if (!resolved)
21026              return 0;
21027          const { animation } = resolved;
21028          return millisecondsToSeconds(animation.currentTime || 0);
21029      }
21030      set time(newTime) {
21031          const { resolved } = this;
21032          if (!resolved)
21033              return;
21034          const { animation } = resolved;
21035          animation.currentTime = secondsToMilliseconds(newTime);
21036      }
21037      get speed() {
21038          const { resolved } = this;
21039          if (!resolved)
21040              return 1;
21041          const { animation } = resolved;
21042          return animation.playbackRate;
21043      }
21044      set speed(newSpeed) {
21045          const { resolved } = this;
21046          if (!resolved)
21047              return;
21048          const { animation } = resolved;
21049          animation.playbackRate = newSpeed;
21050      }
21051      get state() {
21052          const { resolved } = this;
21053          if (!resolved)
21054              return "idle";
21055          const { animation } = resolved;
21056          return animation.playState;
21057      }
21058      /**
21059       * Replace the default DocumentTimeline with another AnimationTimeline.
21060       * Currently used for scroll animations.
21061       */
21062      attachTimeline(timeline) {
21063          if (!this._resolved) {
21064              this.pendingTimeline = timeline;
21065          }
21066          else {
21067              const { resolved } = this;
21068              if (!resolved)
21069                  return noop_noop;
21070              const { animation } = resolved;
21071              animation.timeline = timeline;
21072              animation.onfinish = null;
21073          }
21074          return noop_noop;
21075      }
21076      play() {
21077          if (this.isStopped)
21078              return;
21079          const { resolved } = this;
21080          if (!resolved)
21081              return;
21082          const { animation } = resolved;
21083          if (animation.playState === "finished") {
21084              this.updateFinishedPromise();
21085          }
21086          animation.play();
21087      }
21088      pause() {
21089          const { resolved } = this;
21090          if (!resolved)
21091              return;
21092          const { animation } = resolved;
21093          animation.pause();
21094      }
21095      stop() {
21096          this.resolver.cancel();
21097          this.isStopped = true;
21098          if (this.state === "idle")
21099              return;
21100          const { resolved } = this;
21101          if (!resolved)
21102              return;
21103          const { animation, keyframes, duration, type, ease, times } = resolved;
21104          if (animation.playState === "idle" ||
21105              animation.playState === "finished") {
21106              return;
21107          }
21108          /**
21109           * WAAPI doesn't natively have any interruption capabilities.
21110           *
21111           * Rather than read commited styles back out of the DOM, we can
21112           * create a renderless JS animation and sample it twice to calculate
21113           * its current value, "previous" value, and therefore allow
21114           * Motion to calculate velocity for any subsequent animation.
21115           */
21116          if (this.time) {
21117              const { motionValue, onUpdate, onComplete, ...options } = this.options;
21118              const sampleAnimation = new MainThreadAnimation({
21119                  ...options,
21120                  keyframes,
21121                  duration,
21122                  type,
21123                  ease,
21124                  times,
21125                  isGenerator: true,
21126              });
21127              const sampleTime = secondsToMilliseconds(this.time);
21128              motionValue.setWithVelocity(sampleAnimation.sample(sampleTime - sampleDelta).value, sampleAnimation.sample(sampleTime).value, sampleDelta);
21129          }
21130          this.cancel();
21131      }
21132      complete() {
21133          const { resolved } = this;
21134          if (!resolved)
21135              return;
21136          resolved.animation.finish();
21137      }
21138      cancel() {
21139          const { resolved } = this;
21140          if (!resolved)
21141              return;
21142          resolved.animation.cancel();
21143      }
21144      static supports(options) {
21145          const { motionValue, name, repeatDelay, repeatType, damping, type } = options;
21146          return (supportsWaapi() &&
21147              name &&
21148              acceleratedValues.has(name) &&
21149              motionValue &&
21150              motionValue.owner &&
21151              motionValue.owner.current instanceof HTMLElement &&
21152              /**
21153               * If we're outputting values to onUpdate then we can't use WAAPI as there's
21154               * no way to read the value from WAAPI every frame.
21155               */
21156              !motionValue.owner.getProps().onUpdate &&
21157              !repeatDelay &&
21158              repeatType !== "mirror" &&
21159              damping !== 0 &&
21160              type !== "inertia");
21161      }
21162  }
21163  
21164  
21165  
21166  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/animation/interfaces/motion-value.mjs
21167  
21168  
21169  
21170  
21171  
21172  
21173  
21174  
21175  
21176  
21177  const animateMotionValue = (name, value, target, transition = {}, element, isHandoff) => (onComplete) => {
21178      const valueTransition = getValueTransition(transition, name) || {};
21179      /**
21180       * Most transition values are currently completely overwritten by value-specific
21181       * transitions. In the future it'd be nicer to blend these transitions. But for now
21182       * delay actually does inherit from the root transition if not value-specific.
21183       */
21184      const delay = valueTransition.delay || transition.delay || 0;
21185      /**
21186       * Elapsed isn't a public transition option but can be passed through from
21187       * optimized appear effects in milliseconds.
21188       */
21189      let { elapsed = 0 } = transition;
21190      elapsed = elapsed - secondsToMilliseconds(delay);
21191      let options = {
21192          keyframes: Array.isArray(target) ? target : [null, target],
21193          ease: "easeOut",
21194          velocity: value.getVelocity(),
21195          ...valueTransition,
21196          delay: -elapsed,
21197          onUpdate: (v) => {
21198              value.set(v);
21199              valueTransition.onUpdate && valueTransition.onUpdate(v);
21200          },
21201          onComplete: () => {
21202              onComplete();
21203              valueTransition.onComplete && valueTransition.onComplete();
21204          },
21205          name,
21206          motionValue: value,
21207          element: isHandoff ? undefined : element,
21208      };
21209      /**
21210       * If there's no transition defined for this value, we can generate
21211       * unqiue transition settings for this value.
21212       */
21213      if (!isTransitionDefined(valueTransition)) {
21214          options = {
21215              ...options,
21216              ...getDefaultTransition(name, options),
21217          };
21218      }
21219      /**
21220       * Both WAAPI and our internal animation functions use durations
21221       * as defined by milliseconds, while our external API defines them
21222       * as seconds.
21223       */
21224      if (options.duration) {
21225          options.duration = secondsToMilliseconds(options.duration);
21226      }
21227      if (options.repeatDelay) {
21228          options.repeatDelay = secondsToMilliseconds(options.repeatDelay);
21229      }
21230      if (options.from !== undefined) {
21231          options.keyframes[0] = options.from;
21232      }
21233      let shouldSkip = false;
21234      if (options.type === false ||
21235          (options.duration === 0 && !options.repeatDelay)) {
21236          options.duration = 0;
21237          if (options.delay === 0) {
21238              shouldSkip = true;
21239          }
21240      }
21241      if (instantAnimationState.current ||
21242          MotionGlobalConfig.skipAnimations) {
21243          shouldSkip = true;
21244          options.duration = 0;
21245          options.delay = 0;
21246      }
21247      /**
21248       * If we can or must skip creating the animation, and apply only
21249       * the final keyframe, do so. We also check once keyframes are resolved but
21250       * this early check prevents the need to create an animation at all.
21251       */
21252      if (shouldSkip && !isHandoff && value.get() !== undefined) {
21253          const finalKeyframe = getFinalKeyframe(options.keyframes, valueTransition);
21254          if (finalKeyframe !== undefined) {
21255              frame_frame.update(() => {
21256                  options.onUpdate(finalKeyframe);
21257                  options.onComplete();
21258              });
21259              return;
21260          }
21261      }
21262      /**
21263       * Animate via WAAPI if possible. If this is a handoff animation, the optimised animation will be running via
21264       * WAAPI. Therefore, this animation must be JS to ensure it runs "under" the
21265       * optimised animation.
21266       */
21267      if (!isHandoff && AcceleratedAnimation.supports(options)) {
21268          return new AcceleratedAnimation(options);
21269      }
21270      else {
21271          return new MainThreadAnimation(options);
21272      }
21273  };
21274  
21275  
21276  
21277  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/value/use-will-change/is.mjs
21278  
21279  
21280  function isWillChangeMotionValue(value) {
21281      return Boolean(isMotionValue(value) && value.add);
21282  }
21283  
21284  
21285  
21286  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/array.mjs
21287  function addUniqueItem(arr, item) {
21288      if (arr.indexOf(item) === -1)
21289          arr.push(item);
21290  }
21291  function removeItem(arr, item) {
21292      const index = arr.indexOf(item);
21293      if (index > -1)
21294          arr.splice(index, 1);
21295  }
21296  // Adapted from array-move
21297  function moveItem([...arr], fromIndex, toIndex) {
21298      const startIndex = fromIndex < 0 ? arr.length + fromIndex : fromIndex;
21299      if (startIndex >= 0 && startIndex < arr.length) {
21300          const endIndex = toIndex < 0 ? arr.length + toIndex : toIndex;
21301          const [item] = arr.splice(fromIndex, 1);
21302          arr.splice(endIndex, 0, item);
21303      }
21304      return arr;
21305  }
21306  
21307  
21308  
21309  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/subscription-manager.mjs
21310  
21311  
21312  class SubscriptionManager {
21313      constructor() {
21314          this.subscriptions = [];
21315      }
21316      add(handler) {
21317          addUniqueItem(this.subscriptions, handler);
21318          return () => removeItem(this.subscriptions, handler);
21319      }
21320      notify(a, b, c) {
21321          const numSubscriptions = this.subscriptions.length;
21322          if (!numSubscriptions)
21323              return;
21324          if (numSubscriptions === 1) {
21325              /**
21326               * If there's only a single handler we can just call it without invoking a loop.
21327               */
21328              this.subscriptions[0](a, b, c);
21329          }
21330          else {
21331              for (let i = 0; i < numSubscriptions; i++) {
21332                  /**
21333                   * Check whether the handler exists before firing as it's possible
21334                   * the subscriptions were modified during this loop running.
21335                   */
21336                  const handler = this.subscriptions[i];
21337                  handler && handler(a, b, c);
21338              }
21339          }
21340      }
21341      getSize() {
21342          return this.subscriptions.length;
21343      }
21344      clear() {
21345          this.subscriptions.length = 0;
21346      }
21347  }
21348  
21349  
21350  
21351  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/value/index.mjs
21352  
21353  
21354  
21355  
21356  
21357  
21358  /**
21359   * Maximum time between the value of two frames, beyond which we
21360   * assume the velocity has since been 0.
21361   */
21362  const MAX_VELOCITY_DELTA = 30;
21363  const isFloat = (value) => {
21364      return !isNaN(parseFloat(value));
21365  };
21366  const collectMotionValues = {
21367      current: undefined,
21368  };
21369  /**
21370   * `MotionValue` is used to track the state and velocity of motion values.
21371   *
21372   * @public
21373   */
21374  class MotionValue {
21375      /**
21376       * @param init - The initiating value
21377       * @param config - Optional configuration options
21378       *
21379       * -  `transformer`: A function to transform incoming values with.
21380       *
21381       * @internal
21382       */
21383      constructor(init, options = {}) {
21384          /**
21385           * This will be replaced by the build step with the latest version number.
21386           * When MotionValues are provided to motion components, warn if versions are mixed.
21387           */
21388          this.version = "11.2.6";
21389          /**
21390           * Tracks whether this value can output a velocity. Currently this is only true
21391           * if the value is numerical, but we might be able to widen the scope here and support
21392           * other value types.
21393           *
21394           * @internal
21395           */
21396          this.canTrackVelocity = null;
21397          /**
21398           * An object containing a SubscriptionManager for each active event.
21399           */
21400          this.events = {};
21401          this.updateAndNotify = (v, render = true) => {
21402              const currentTime = time.now();
21403              /**
21404               * If we're updating the value during another frame or eventloop
21405               * than the previous frame, then the we set the previous frame value
21406               * to current.
21407               */
21408              if (this.updatedAt !== currentTime) {
21409                  this.setPrevFrameValue();
21410              }
21411              this.prev = this.current;
21412              this.setCurrent(v);
21413              // Update update subscribers
21414              if (this.current !== this.prev && this.events.change) {
21415                  this.events.change.notify(this.current);
21416              }
21417              // Update render subscribers
21418              if (render && this.events.renderRequest) {
21419                  this.events.renderRequest.notify(this.current);
21420              }
21421          };
21422          this.hasAnimated = false;
21423          this.setCurrent(init);
21424          this.owner = options.owner;
21425      }
21426      setCurrent(current) {
21427          this.current = current;
21428          this.updatedAt = time.now();
21429          if (this.canTrackVelocity === null && current !== undefined) {
21430              this.canTrackVelocity = isFloat(this.current);
21431          }
21432      }
21433      setPrevFrameValue(prevFrameValue = this.current) {
21434          this.prevFrameValue = prevFrameValue;
21435          this.prevUpdatedAt = this.updatedAt;
21436      }
21437      /**
21438       * Adds a function that will be notified when the `MotionValue` is updated.
21439       *
21440       * It returns a function that, when called, will cancel the subscription.
21441       *
21442       * When calling `onChange` inside a React component, it should be wrapped with the
21443       * `useEffect` hook. As it returns an unsubscribe function, this should be returned
21444       * from the `useEffect` function to ensure you don't add duplicate subscribers..
21445       *
21446       * ```jsx
21447       * export const MyComponent = () => {
21448       *   const x = useMotionValue(0)
21449       *   const y = useMotionValue(0)
21450       *   const opacity = useMotionValue(1)
21451       *
21452       *   useEffect(() => {
21453       *     function updateOpacity() {
21454       *       const maxXY = Math.max(x.get(), y.get())
21455       *       const newOpacity = transform(maxXY, [0, 100], [1, 0])
21456       *       opacity.set(newOpacity)
21457       *     }
21458       *
21459       *     const unsubscribeX = x.on("change", updateOpacity)
21460       *     const unsubscribeY = y.on("change", updateOpacity)
21461       *
21462       *     return () => {
21463       *       unsubscribeX()
21464       *       unsubscribeY()
21465       *     }
21466       *   }, [])
21467       *
21468       *   return <motion.div style={{ x }} />
21469       * }
21470       * ```
21471       *
21472       * @param subscriber - A function that receives the latest value.
21473       * @returns A function that, when called, will cancel this subscription.
21474       *
21475       * @deprecated
21476       */
21477      onChange(subscription) {
21478          if (false) {}
21479          return this.on("change", subscription);
21480      }
21481      on(eventName, callback) {
21482          if (!this.events[eventName]) {
21483              this.events[eventName] = new SubscriptionManager();
21484          }
21485          const unsubscribe = this.events[eventName].add(callback);
21486          if (eventName === "change") {
21487              return () => {
21488                  unsubscribe();
21489                  /**
21490                   * If we have no more change listeners by the start
21491                   * of the next frame, stop active animations.
21492                   */
21493                  frame_frame.read(() => {
21494                      if (!this.events.change.getSize()) {
21495                          this.stop();
21496                      }
21497                  });
21498              };
21499          }
21500          return unsubscribe;
21501      }
21502      clearListeners() {
21503          for (const eventManagers in this.events) {
21504              this.events[eventManagers].clear();
21505          }
21506      }
21507      /**
21508       * Attaches a passive effect to the `MotionValue`.
21509       *
21510       * @internal
21511       */
21512      attach(passiveEffect, stopPassiveEffect) {
21513          this.passiveEffect = passiveEffect;
21514          this.stopPassiveEffect = stopPassiveEffect;
21515      }
21516      /**
21517       * Sets the state of the `MotionValue`.
21518       *
21519       * @remarks
21520       *
21521       * ```jsx
21522       * const x = useMotionValue(0)
21523       * x.set(10)
21524       * ```
21525       *
21526       * @param latest - Latest value to set.
21527       * @param render - Whether to notify render subscribers. Defaults to `true`
21528       *
21529       * @public
21530       */
21531      set(v, render = true) {
21532          if (!render || !this.passiveEffect) {
21533              this.updateAndNotify(v, render);
21534          }
21535          else {
21536              this.passiveEffect(v, this.updateAndNotify);
21537          }
21538      }
21539      setWithVelocity(prev, current, delta) {
21540          this.set(current);
21541          this.prev = undefined;
21542          this.prevFrameValue = prev;
21543          this.prevUpdatedAt = this.updatedAt - delta;
21544      }
21545      /**
21546       * Set the state of the `MotionValue`, stopping any active animations,
21547       * effects, and resets velocity to `0`.
21548       */
21549      jump(v, endAnimation = true) {
21550          this.updateAndNotify(v);
21551          this.prev = v;
21552          this.prevUpdatedAt = this.prevFrameValue = undefined;
21553          endAnimation && this.stop();
21554          if (this.stopPassiveEffect)
21555              this.stopPassiveEffect();
21556      }
21557      /**
21558       * Returns the latest state of `MotionValue`
21559       *
21560       * @returns - The latest state of `MotionValue`
21561       *
21562       * @public
21563       */
21564      get() {
21565          if (collectMotionValues.current) {
21566              collectMotionValues.current.push(this);
21567          }
21568          return this.current;
21569      }
21570      /**
21571       * @public
21572       */
21573      getPrevious() {
21574          return this.prev;
21575      }
21576      /**
21577       * Returns the latest velocity of `MotionValue`
21578       *
21579       * @returns - The latest velocity of `MotionValue`. Returns `0` if the state is non-numerical.
21580       *
21581       * @public
21582       */
21583      getVelocity() {
21584          const currentTime = time.now();
21585          if (!this.canTrackVelocity ||
21586              this.prevFrameValue === undefined ||
21587              currentTime - this.updatedAt > MAX_VELOCITY_DELTA) {
21588              return 0;
21589          }
21590          const delta = Math.min(this.updatedAt - this.prevUpdatedAt, MAX_VELOCITY_DELTA);
21591          // Casts because of parseFloat's poor typing
21592          return velocityPerSecond(parseFloat(this.current) -
21593              parseFloat(this.prevFrameValue), delta);
21594      }
21595      /**
21596       * Registers a new animation to control this `MotionValue`. Only one
21597       * animation can drive a `MotionValue` at one time.
21598       *
21599       * ```jsx
21600       * value.start()
21601       * ```
21602       *
21603       * @param animation - A function that starts the provided animation
21604       *
21605       * @internal
21606       */
21607      start(startAnimation) {
21608          this.stop();
21609          return new Promise((resolve) => {
21610              this.hasAnimated = true;
21611              this.animation = startAnimation(resolve);
21612              if (this.events.animationStart) {
21613                  this.events.animationStart.notify();
21614              }
21615          }).then(() => {
21616              if (this.events.animationComplete) {
21617                  this.events.animationComplete.notify();
21618              }
21619              this.clearAnimation();
21620          });
21621      }
21622      /**
21623       * Stop the currently active animation.
21624       *
21625       * @public
21626       */
21627      stop() {
21628          if (this.animation) {
21629              this.animation.stop();
21630              if (this.events.animationCancel) {
21631                  this.events.animationCancel.notify();
21632              }
21633          }
21634          this.clearAnimation();
21635      }
21636      /**
21637       * Returns `true` if this value is currently animating.
21638       *
21639       * @public
21640       */
21641      isAnimating() {
21642          return !!this.animation;
21643      }
21644      clearAnimation() {
21645          delete this.animation;
21646      }
21647      /**
21648       * Destroy and clean up subscribers to this `MotionValue`.
21649       *
21650       * The `MotionValue` hooks like `useMotionValue` and `useTransform` automatically
21651       * handle the lifecycle of the returned `MotionValue`, so this method is only necessary if you've manually
21652       * created a `MotionValue` via the `motionValue` function.
21653       *
21654       * @public
21655       */
21656      destroy() {
21657          this.clearListeners();
21658          this.stop();
21659          if (this.stopPassiveEffect) {
21660              this.stopPassiveEffect();
21661          }
21662      }
21663  }
21664  function motionValue(init, options) {
21665      return new MotionValue(init, options);
21666  }
21667  
21668  
21669  
21670  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/utils/setters.mjs
21671  
21672  
21673  
21674  
21675  /**
21676   * Set VisualElement's MotionValue, creating a new MotionValue for it if
21677   * it doesn't exist.
21678   */
21679  function setMotionValue(visualElement, key, value) {
21680      if (visualElement.hasValue(key)) {
21681          visualElement.getValue(key).set(value);
21682      }
21683      else {
21684          visualElement.addValue(key, motionValue(value));
21685      }
21686  }
21687  function setTarget(visualElement, definition) {
21688      const resolved = resolveVariant(visualElement, definition);
21689      let { transitionEnd = {}, transition = {}, ...target } = resolved || {};
21690      target = { ...target, ...transitionEnd };
21691      for (const key in target) {
21692          const value = resolveFinalValueInKeyframes(target[key]);
21693          setMotionValue(visualElement, key, value);
21694      }
21695  }
21696  
21697  
21698  
21699  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/animation/interfaces/visual-element-target.mjs
21700  
21701  
21702  
21703  
21704  
21705  
21706  
21707  
21708  /**
21709   * Decide whether we should block this animation. Previously, we achieved this
21710   * just by checking whether the key was listed in protectedKeys, but this
21711   * posed problems if an animation was triggered by afterChildren and protectedKeys
21712   * had been set to true in the meantime.
21713   */
21714  function shouldBlockAnimation({ protectedKeys, needsAnimating }, key) {
21715      const shouldBlock = protectedKeys.hasOwnProperty(key) && needsAnimating[key] !== true;
21716      needsAnimating[key] = false;
21717      return shouldBlock;
21718  }
21719  function animateTarget(visualElement, targetAndTransition, { delay = 0, transitionOverride, type } = {}) {
21720      var _a;
21721      let { transition = visualElement.getDefaultTransition(), transitionEnd, ...target } = targetAndTransition;
21722      const willChange = visualElement.getValue("willChange");
21723      if (transitionOverride)
21724          transition = transitionOverride;
21725      const animations = [];
21726      const animationTypeState = type &&
21727          visualElement.animationState &&
21728          visualElement.animationState.getState()[type];
21729      for (const key in target) {
21730          const value = visualElement.getValue(key, (_a = visualElement.latestValues[key]) !== null && _a !== void 0 ? _a : null);
21731          const valueTarget = target[key];
21732          if (valueTarget === undefined ||
21733              (animationTypeState &&
21734                  shouldBlockAnimation(animationTypeState, key))) {
21735              continue;
21736          }
21737          const valueTransition = {
21738              delay,
21739              elapsed: 0,
21740              ...getValueTransition(transition || {}, key),
21741          };
21742          /**
21743           * If this is the first time a value is being animated, check
21744           * to see if we're handling off from an existing animation.
21745           */
21746          let isHandoff = false;
21747          if (window.HandoffAppearAnimations) {
21748              const props = visualElement.getProps();
21749              const appearId = props[optimizedAppearDataAttribute];
21750              if (appearId) {
21751                  const elapsed = window.HandoffAppearAnimations(appearId, key, value, frame_frame);
21752                  if (elapsed !== null) {
21753                      valueTransition.elapsed = elapsed;
21754                      isHandoff = true;
21755                  }
21756              }
21757          }
21758          value.start(animateMotionValue(key, value, valueTarget, visualElement.shouldReduceMotion && transformProps.has(key)
21759              ? { type: false }
21760              : valueTransition, visualElement, isHandoff));
21761          const animation = value.animation;
21762          if (animation) {
21763              if (isWillChangeMotionValue(willChange)) {
21764                  willChange.add(key);
21765                  animation.then(() => willChange.remove(key));
21766              }
21767              animations.push(animation);
21768          }
21769      }
21770      if (transitionEnd) {
21771          Promise.all(animations).then(() => {
21772              frame_frame.update(() => {
21773                  transitionEnd && setTarget(visualElement, transitionEnd);
21774              });
21775          });
21776      }
21777      return animations;
21778  }
21779  
21780  
21781  
21782  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/animation/interfaces/visual-element-variant.mjs
21783  
21784  
21785  
21786  function animateVariant(visualElement, variant, options = {}) {
21787      var _a;
21788      const resolved = resolveVariant(visualElement, variant, options.type === "exit"
21789          ? (_a = visualElement.presenceContext) === null || _a === void 0 ? void 0 : _a.custom
21790          : undefined);
21791      let { transition = visualElement.getDefaultTransition() || {} } = resolved || {};
21792      if (options.transitionOverride) {
21793          transition = options.transitionOverride;
21794      }
21795      /**
21796       * If we have a variant, create a callback that runs it as an animation.
21797       * Otherwise, we resolve a Promise immediately for a composable no-op.
21798       */
21799      const getAnimation = resolved
21800          ? () => Promise.all(animateTarget(visualElement, resolved, options))
21801          : () => Promise.resolve();
21802      /**
21803       * If we have children, create a callback that runs all their animations.
21804       * Otherwise, we resolve a Promise immediately for a composable no-op.
21805       */
21806      const getChildAnimations = visualElement.variantChildren && visualElement.variantChildren.size
21807          ? (forwardDelay = 0) => {
21808              const { delayChildren = 0, staggerChildren, staggerDirection, } = transition;
21809              return animateChildren(visualElement, variant, delayChildren + forwardDelay, staggerChildren, staggerDirection, options);
21810          }
21811          : () => Promise.resolve();
21812      /**
21813       * If the transition explicitly defines a "when" option, we need to resolve either
21814       * this animation or all children animations before playing the other.
21815       */
21816      const { when } = transition;
21817      if (when) {
21818          const [first, last] = when === "beforeChildren"
21819              ? [getAnimation, getChildAnimations]
21820              : [getChildAnimations, getAnimation];
21821          return first().then(() => last());
21822      }
21823      else {
21824          return Promise.all([getAnimation(), getChildAnimations(options.delay)]);
21825      }
21826  }
21827  function animateChildren(visualElement, variant, delayChildren = 0, staggerChildren = 0, staggerDirection = 1, options) {
21828      const animations = [];
21829      const maxStaggerDuration = (visualElement.variantChildren.size - 1) * staggerChildren;
21830      const generateStaggerDuration = staggerDirection === 1
21831          ? (i = 0) => i * staggerChildren
21832          : (i = 0) => maxStaggerDuration - i * staggerChildren;
21833      Array.from(visualElement.variantChildren)
21834          .sort(sortByTreeOrder)
21835          .forEach((child, i) => {
21836          child.notify("AnimationStart", variant);
21837          animations.push(animateVariant(child, variant, {
21838              ...options,
21839              delay: delayChildren + generateStaggerDuration(i),
21840          }).then(() => child.notify("AnimationComplete", variant)));
21841      });
21842      return Promise.all(animations);
21843  }
21844  function sortByTreeOrder(a, b) {
21845      return a.sortNodePosition(b);
21846  }
21847  
21848  
21849  
21850  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/animation/interfaces/visual-element.mjs
21851  
21852  
21853  
21854  
21855  
21856  function animateVisualElement(visualElement, definition, options = {}) {
21857      visualElement.notify("AnimationStart", definition);
21858      let animation;
21859      if (Array.isArray(definition)) {
21860          const animations = definition.map((variant) => animateVariant(visualElement, variant, options));
21861          animation = Promise.all(animations);
21862      }
21863      else if (typeof definition === "string") {
21864          animation = animateVariant(visualElement, definition, options);
21865      }
21866      else {
21867          const resolvedDefinition = typeof definition === "function"
21868              ? resolveVariant(visualElement, definition, options.custom)
21869              : definition;
21870          animation = Promise.all(animateTarget(visualElement, resolvedDefinition, options));
21871      }
21872      return animation.then(() => {
21873          frame_frame.postRender(() => {
21874              visualElement.notify("AnimationComplete", definition);
21875          });
21876      });
21877  }
21878  
21879  
21880  
21881  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/utils/animation-state.mjs
21882  
21883  
21884  
21885  
21886  
21887  
21888  
21889  
21890  const reversePriorityOrder = [...variantPriorityOrder].reverse();
21891  const numAnimationTypes = variantPriorityOrder.length;
21892  function animateList(visualElement) {
21893      return (animations) => Promise.all(animations.map(({ animation, options }) => animateVisualElement(visualElement, animation, options)));
21894  }
21895  function createAnimationState(visualElement) {
21896      let animate = animateList(visualElement);
21897      const state = createState();
21898      let isInitialRender = true;
21899      /**
21900       * This function will be used to reduce the animation definitions for
21901       * each active animation type into an object of resolved values for it.
21902       */
21903      const buildResolvedTypeValues = (type) => (acc, definition) => {
21904          var _a;
21905          const resolved = resolveVariant(visualElement, definition, type === "exit"
21906              ? (_a = visualElement.presenceContext) === null || _a === void 0 ? void 0 : _a.custom
21907              : undefined);
21908          if (resolved) {
21909              const { transition, transitionEnd, ...target } = resolved;
21910              acc = { ...acc, ...target, ...transitionEnd };
21911          }
21912          return acc;
21913      };
21914      /**
21915       * This just allows us to inject mocked animation functions
21916       * @internal
21917       */
21918      function setAnimateFunction(makeAnimator) {
21919          animate = makeAnimator(visualElement);
21920      }
21921      /**
21922       * When we receive new props, we need to:
21923       * 1. Create a list of protected keys for each type. This is a directory of
21924       *    value keys that are currently being "handled" by types of a higher priority
21925       *    so that whenever an animation is played of a given type, these values are
21926       *    protected from being animated.
21927       * 2. Determine if an animation type needs animating.
21928       * 3. Determine if any values have been removed from a type and figure out
21929       *    what to animate those to.
21930       */
21931      function animateChanges(changedActiveType) {
21932          const props = visualElement.getProps();
21933          const context = visualElement.getVariantContext(true) || {};
21934          /**
21935           * A list of animations that we'll build into as we iterate through the animation
21936           * types. This will get executed at the end of the function.
21937           */
21938          const animations = [];
21939          /**
21940           * Keep track of which values have been removed. Then, as we hit lower priority
21941           * animation types, we can check if they contain removed values and animate to that.
21942           */
21943          const removedKeys = new Set();
21944          /**
21945           * A dictionary of all encountered keys. This is an object to let us build into and
21946           * copy it without iteration. Each time we hit an animation type we set its protected
21947           * keys - the keys its not allowed to animate - to the latest version of this object.
21948           */
21949          let encounteredKeys = {};
21950          /**
21951           * If a variant has been removed at a given index, and this component is controlling
21952           * variant animations, we want to ensure lower-priority variants are forced to animate.
21953           */
21954          let removedVariantIndex = Infinity;
21955          /**
21956           * Iterate through all animation types in reverse priority order. For each, we want to
21957           * detect which values it's handling and whether or not they've changed (and therefore
21958           * need to be animated). If any values have been removed, we want to detect those in
21959           * lower priority props and flag for animation.
21960           */
21961          for (let i = 0; i < numAnimationTypes; i++) {
21962              const type = reversePriorityOrder[i];
21963              const typeState = state[type];
21964              const prop = props[type] !== undefined
21965                  ? props[type]
21966                  : context[type];
21967              const propIsVariant = isVariantLabel(prop);
21968              /**
21969               * If this type has *just* changed isActive status, set activeDelta
21970               * to that status. Otherwise set to null.
21971               */
21972              const activeDelta = type === changedActiveType ? typeState.isActive : null;
21973              if (activeDelta === false)
21974                  removedVariantIndex = i;
21975              /**
21976               * If this prop is an inherited variant, rather than been set directly on the
21977               * component itself, we want to make sure we allow the parent to trigger animations.
21978               *
21979               * TODO: Can probably change this to a !isControllingVariants check
21980               */
21981              let isInherited = prop === context[type] &&
21982                  prop !== props[type] &&
21983                  propIsVariant;
21984              /**
21985               *
21986               */
21987              if (isInherited &&
21988                  isInitialRender &&
21989                  visualElement.manuallyAnimateOnMount) {
21990                  isInherited = false;
21991              }
21992              /**
21993               * Set all encountered keys so far as the protected keys for this type. This will
21994               * be any key that has been animated or otherwise handled by active, higher-priortiy types.
21995               */
21996              typeState.protectedKeys = { ...encounteredKeys };
21997              // Check if we can skip analysing this prop early
21998              if (
21999              // If it isn't active and hasn't *just* been set as inactive
22000              (!typeState.isActive && activeDelta === null) ||
22001                  // If we didn't and don't have any defined prop for this animation type
22002                  (!prop && !typeState.prevProp) ||
22003                  // Or if the prop doesn't define an animation
22004                  isAnimationControls(prop) ||
22005                  typeof prop === "boolean") {
22006                  continue;
22007              }
22008              /**
22009               * As we go look through the values defined on this type, if we detect
22010               * a changed value or a value that was removed in a higher priority, we set
22011               * this to true and add this prop to the animation list.
22012               */
22013              const variantDidChange = checkVariantsDidChange(typeState.prevProp, prop);
22014              let shouldAnimateType = variantDidChange ||
22015                  // If we're making this variant active, we want to always make it active
22016                  (type === changedActiveType &&
22017                      typeState.isActive &&
22018                      !isInherited &&
22019                      propIsVariant) ||
22020                  // If we removed a higher-priority variant (i is in reverse order)
22021                  (i > removedVariantIndex && propIsVariant);
22022              let handledRemovedValues = false;
22023              /**
22024               * As animations can be set as variant lists, variants or target objects, we
22025               * coerce everything to an array if it isn't one already
22026               */
22027              const definitionList = Array.isArray(prop) ? prop : [prop];
22028              /**
22029               * Build an object of all the resolved values. We'll use this in the subsequent
22030               * animateChanges calls to determine whether a value has changed.
22031               */
22032              let resolvedValues = definitionList.reduce(buildResolvedTypeValues(type), {});
22033              if (activeDelta === false)
22034                  resolvedValues = {};
22035              /**
22036               * Now we need to loop through all the keys in the prev prop and this prop,
22037               * and decide:
22038               * 1. If the value has changed, and needs animating
22039               * 2. If it has been removed, and needs adding to the removedKeys set
22040               * 3. If it has been removed in a higher priority type and needs animating
22041               * 4. If it hasn't been removed in a higher priority but hasn't changed, and
22042               *    needs adding to the type's protectedKeys list.
22043               */
22044              const { prevResolvedValues = {} } = typeState;
22045              const allKeys = {
22046                  ...prevResolvedValues,
22047                  ...resolvedValues,
22048              };
22049              const markToAnimate = (key) => {
22050                  shouldAnimateType = true;
22051                  if (removedKeys.has(key)) {
22052                      handledRemovedValues = true;
22053                      removedKeys.delete(key);
22054                  }
22055                  typeState.needsAnimating[key] = true;
22056                  const motionValue = visualElement.getValue(key);
22057                  if (motionValue)
22058                      motionValue.liveStyle = false;
22059              };
22060              for (const key in allKeys) {
22061                  const next = resolvedValues[key];
22062                  const prev = prevResolvedValues[key];
22063                  // If we've already handled this we can just skip ahead
22064                  if (encounteredKeys.hasOwnProperty(key))
22065                      continue;
22066                  /**
22067                   * If the value has changed, we probably want to animate it.
22068                   */
22069                  let valueHasChanged = false;
22070                  if (isKeyframesTarget(next) && isKeyframesTarget(prev)) {
22071                      valueHasChanged = !shallowCompare(next, prev);
22072                  }
22073                  else {
22074                      valueHasChanged = next !== prev;
22075                  }
22076                  if (valueHasChanged) {
22077                      if (next !== undefined && next !== null) {
22078                          // If next is defined and doesn't equal prev, it needs animating
22079                          markToAnimate(key);
22080                      }
22081                      else {
22082                          // If it's undefined, it's been removed.
22083                          removedKeys.add(key);
22084                      }
22085                  }
22086                  else if (next !== undefined && removedKeys.has(key)) {
22087                      /**
22088                       * If next hasn't changed and it isn't undefined, we want to check if it's
22089                       * been removed by a higher priority
22090                       */
22091                      markToAnimate(key);
22092                  }
22093                  else {
22094                      /**
22095                       * If it hasn't changed, we add it to the list of protected values
22096                       * to ensure it doesn't get animated.
22097                       */
22098                      typeState.protectedKeys[key] = true;
22099                  }
22100              }
22101              /**
22102               * Update the typeState so next time animateChanges is called we can compare the
22103               * latest prop and resolvedValues to these.
22104               */
22105              typeState.prevProp = prop;
22106              typeState.prevResolvedValues = resolvedValues;
22107              /**
22108               *
22109               */
22110              if (typeState.isActive) {
22111                  encounteredKeys = { ...encounteredKeys, ...resolvedValues };
22112              }
22113              if (isInitialRender && visualElement.blockInitialAnimation) {
22114                  shouldAnimateType = false;
22115              }
22116              /**
22117               * If this is an inherited prop we want to hard-block animations
22118               */
22119              if (shouldAnimateType && (!isInherited || handledRemovedValues)) {
22120                  animations.push(...definitionList.map((animation) => ({
22121                      animation: animation,
22122                      options: { type },
22123                  })));
22124              }
22125          }
22126          /**
22127           * If there are some removed value that haven't been dealt with,
22128           * we need to create a new animation that falls back either to the value
22129           * defined in the style prop, or the last read value.
22130           */
22131          if (removedKeys.size) {
22132              const fallbackAnimation = {};
22133              removedKeys.forEach((key) => {
22134                  const fallbackTarget = visualElement.getBaseTarget(key);
22135                  const motionValue = visualElement.getValue(key);
22136                  if (motionValue)
22137                      motionValue.liveStyle = true;
22138                  // @ts-expect-error - @mattgperry to figure if we should do something here
22139                  fallbackAnimation[key] = fallbackTarget !== null && fallbackTarget !== void 0 ? fallbackTarget : null;
22140              });
22141              animations.push({ animation: fallbackAnimation });
22142          }
22143          let shouldAnimate = Boolean(animations.length);
22144          if (isInitialRender &&
22145              (props.initial === false || props.initial === props.animate) &&
22146              !visualElement.manuallyAnimateOnMount) {
22147              shouldAnimate = false;
22148          }
22149          isInitialRender = false;
22150          return shouldAnimate ? animate(animations) : Promise.resolve();
22151      }
22152      /**
22153       * Change whether a certain animation type is active.
22154       */
22155      function setActive(type, isActive) {
22156          var _a;
22157          // If the active state hasn't changed, we can safely do nothing here
22158          if (state[type].isActive === isActive)
22159              return Promise.resolve();
22160          // Propagate active change to children
22161          (_a = visualElement.variantChildren) === null || _a === void 0 ? void 0 : _a.forEach((child) => { var _a; return (_a = child.animationState) === null || _a === void 0 ? void 0 : _a.setActive(type, isActive); });
22162          state[type].isActive = isActive;
22163          const animations = animateChanges(type);
22164          for (const key in state) {
22165              state[key].protectedKeys = {};
22166          }
22167          return animations;
22168      }
22169      return {
22170          animateChanges,
22171          setActive,
22172          setAnimateFunction,
22173          getState: () => state,
22174      };
22175  }
22176  function checkVariantsDidChange(prev, next) {
22177      if (typeof next === "string") {
22178          return next !== prev;
22179      }
22180      else if (Array.isArray(next)) {
22181          return !shallowCompare(next, prev);
22182      }
22183      return false;
22184  }
22185  function createTypeState(isActive = false) {
22186      return {
22187          isActive,
22188          protectedKeys: {},
22189          needsAnimating: {},
22190          prevResolvedValues: {},
22191      };
22192  }
22193  function createState() {
22194      return {
22195          animate: createTypeState(true),
22196          whileInView: createTypeState(),
22197          whileHover: createTypeState(),
22198          whileTap: createTypeState(),
22199          whileDrag: createTypeState(),
22200          whileFocus: createTypeState(),
22201          exit: createTypeState(),
22202      };
22203  }
22204  
22205  
22206  
22207  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/motion/features/animation/index.mjs
22208  
22209  
22210  
22211  
22212  class AnimationFeature extends Feature {
22213      /**
22214       * We dynamically generate the AnimationState manager as it contains a reference
22215       * to the underlying animation library. We only want to load that if we load this,
22216       * so people can optionally code split it out using the `m` component.
22217       */
22218      constructor(node) {
22219          super(node);
22220          node.animationState || (node.animationState = createAnimationState(node));
22221      }
22222      updateAnimationControlsSubscription() {
22223          const { animate } = this.node.getProps();
22224          this.unmount();
22225          if (isAnimationControls(animate)) {
22226              this.unmount = animate.subscribe(this.node);
22227          }
22228      }
22229      /**
22230       * Subscribe any provided AnimationControls to the component's VisualElement
22231       */
22232      mount() {
22233          this.updateAnimationControlsSubscription();
22234      }
22235      update() {
22236          const { animate } = this.node.getProps();
22237          const { animate: prevAnimate } = this.node.prevProps || {};
22238          if (animate !== prevAnimate) {
22239              this.updateAnimationControlsSubscription();
22240          }
22241      }
22242      unmount() { }
22243  }
22244  
22245  
22246  
22247  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/motion/features/animation/exit.mjs
22248  
22249  
22250  let id = 0;
22251  class ExitAnimationFeature extends Feature {
22252      constructor() {
22253          super(...arguments);
22254          this.id = id++;
22255      }
22256      update() {
22257          if (!this.node.presenceContext)
22258              return;
22259          const { isPresent, onExitComplete } = this.node.presenceContext;
22260          const { isPresent: prevIsPresent } = this.node.prevPresenceContext || {};
22261          if (!this.node.animationState || isPresent === prevIsPresent) {
22262              return;
22263          }
22264          const exitAnimation = this.node.animationState.setActive("exit", !isPresent);
22265          if (onExitComplete && !isPresent) {
22266              exitAnimation.then(() => onExitComplete(this.id));
22267          }
22268      }
22269      mount() {
22270          const { register } = this.node.presenceContext || {};
22271          if (register) {
22272              this.unmount = register(this.id);
22273          }
22274      }
22275      unmount() { }
22276  }
22277  
22278  
22279  
22280  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/motion/features/animations.mjs
22281  
22282  
22283  
22284  const animations = {
22285      animation: {
22286          Feature: AnimationFeature,
22287      },
22288      exit: {
22289          Feature: ExitAnimationFeature,
22290      },
22291  };
22292  
22293  
22294  
22295  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/distance.mjs
22296  const distance = (a, b) => Math.abs(a - b);
22297  function distance2D(a, b) {
22298      // Multi-dimensional
22299      const xDelta = distance(a.x, b.x);
22300      const yDelta = distance(a.y, b.y);
22301      return Math.sqrt(xDelta ** 2 + yDelta ** 2);
22302  }
22303  
22304  
22305  
22306  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/gestures/pan/PanSession.mjs
22307  
22308  
22309  
22310  
22311  
22312  
22313  
22314  
22315  /**
22316   * @internal
22317   */
22318  class PanSession {
22319      constructor(event, handlers, { transformPagePoint, contextWindow, dragSnapToOrigin = false } = {}) {
22320          /**
22321           * @internal
22322           */
22323          this.startEvent = null;
22324          /**
22325           * @internal
22326           */
22327          this.lastMoveEvent = null;
22328          /**
22329           * @internal
22330           */
22331          this.lastMoveEventInfo = null;
22332          /**
22333           * @internal
22334           */
22335          this.handlers = {};
22336          /**
22337           * @internal
22338           */
22339          this.contextWindow = window;
22340          this.updatePoint = () => {
22341              if (!(this.lastMoveEvent && this.lastMoveEventInfo))
22342                  return;
22343              const info = getPanInfo(this.lastMoveEventInfo, this.history);
22344              const isPanStarted = this.startEvent !== null;
22345              // Only start panning if the offset is larger than 3 pixels. If we make it
22346              // any larger than this we'll want to reset the pointer history
22347              // on the first update to avoid visual snapping to the cursoe.
22348              const isDistancePastThreshold = distance2D(info.offset, { x: 0, y: 0 }) >= 3;
22349              if (!isPanStarted && !isDistancePastThreshold)
22350                  return;
22351              const { point } = info;
22352              const { timestamp } = frameData;
22353              this.history.push({ ...point, timestamp });
22354              const { onStart, onMove } = this.handlers;
22355              if (!isPanStarted) {
22356                  onStart && onStart(this.lastMoveEvent, info);
22357                  this.startEvent = this.lastMoveEvent;
22358              }
22359              onMove && onMove(this.lastMoveEvent, info);
22360          };
22361          this.handlePointerMove = (event, info) => {
22362              this.lastMoveEvent = event;
22363              this.lastMoveEventInfo = transformPoint(info, this.transformPagePoint);
22364              // Throttle mouse move event to once per frame
22365              frame_frame.update(this.updatePoint, true);
22366          };
22367          this.handlePointerUp = (event, info) => {
22368              this.end();
22369              const { onEnd, onSessionEnd, resumeAnimation } = this.handlers;
22370              if (this.dragSnapToOrigin)
22371                  resumeAnimation && resumeAnimation();
22372              if (!(this.lastMoveEvent && this.lastMoveEventInfo))
22373                  return;
22374              const panInfo = getPanInfo(event.type === "pointercancel"
22375                  ? this.lastMoveEventInfo
22376                  : transformPoint(info, this.transformPagePoint), this.history);
22377              if (this.startEvent && onEnd) {
22378                  onEnd(event, panInfo);
22379              }
22380              onSessionEnd && onSessionEnd(event, panInfo);
22381          };
22382          // If we have more than one touch, don't start detecting this gesture
22383          if (!isPrimaryPointer(event))
22384              return;
22385          this.dragSnapToOrigin = dragSnapToOrigin;
22386          this.handlers = handlers;
22387          this.transformPagePoint = transformPagePoint;
22388          this.contextWindow = contextWindow || window;
22389          const info = extractEventInfo(event);
22390          const initialInfo = transformPoint(info, this.transformPagePoint);
22391          const { point } = initialInfo;
22392          const { timestamp } = frameData;
22393          this.history = [{ ...point, timestamp }];
22394          const { onSessionStart } = handlers;
22395          onSessionStart &&
22396              onSessionStart(event, getPanInfo(initialInfo, this.history));
22397          this.removeListeners = pipe(addPointerEvent(this.contextWindow, "pointermove", this.handlePointerMove), addPointerEvent(this.contextWindow, "pointerup", this.handlePointerUp), addPointerEvent(this.contextWindow, "pointercancel", this.handlePointerUp));
22398      }
22399      updateHandlers(handlers) {
22400          this.handlers = handlers;
22401      }
22402      end() {
22403          this.removeListeners && this.removeListeners();
22404          cancelFrame(this.updatePoint);
22405      }
22406  }
22407  function transformPoint(info, transformPagePoint) {
22408      return transformPagePoint ? { point: transformPagePoint(info.point) } : info;
22409  }
22410  function subtractPoint(a, b) {
22411      return { x: a.x - b.x, y: a.y - b.y };
22412  }
22413  function getPanInfo({ point }, history) {
22414      return {
22415          point,
22416          delta: subtractPoint(point, lastDevicePoint(history)),
22417          offset: subtractPoint(point, startDevicePoint(history)),
22418          velocity: getVelocity(history, 0.1),
22419      };
22420  }
22421  function startDevicePoint(history) {
22422      return history[0];
22423  }
22424  function lastDevicePoint(history) {
22425      return history[history.length - 1];
22426  }
22427  function getVelocity(history, timeDelta) {
22428      if (history.length < 2) {
22429          return { x: 0, y: 0 };
22430      }
22431      let i = history.length - 1;
22432      let timestampedPoint = null;
22433      const lastPoint = lastDevicePoint(history);
22434      while (i >= 0) {
22435          timestampedPoint = history[i];
22436          if (lastPoint.timestamp - timestampedPoint.timestamp >
22437              secondsToMilliseconds(timeDelta)) {
22438              break;
22439          }
22440          i--;
22441      }
22442      if (!timestampedPoint) {
22443          return { x: 0, y: 0 };
22444      }
22445      const time = millisecondsToSeconds(lastPoint.timestamp - timestampedPoint.timestamp);
22446      if (time === 0) {
22447          return { x: 0, y: 0 };
22448      }
22449      const currentVelocity = {
22450          x: (lastPoint.x - timestampedPoint.x) / time,
22451          y: (lastPoint.y - timestampedPoint.y) / time,
22452      };
22453      if (currentVelocity.x === Infinity) {
22454          currentVelocity.x = 0;
22455      }
22456      if (currentVelocity.y === Infinity) {
22457          currentVelocity.y = 0;
22458      }
22459      return currentVelocity;
22460  }
22461  
22462  
22463  
22464  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/projection/geometry/delta-calc.mjs
22465  
22466  
22467  function calcLength(axis) {
22468      return axis.max - axis.min;
22469  }
22470  function isNear(value, target = 0, maxDistance = 0.01) {
22471      return Math.abs(value - target) <= maxDistance;
22472  }
22473  function calcAxisDelta(delta, source, target, origin = 0.5) {
22474      delta.origin = origin;
22475      delta.originPoint = mixNumber(source.min, source.max, delta.origin);
22476      delta.scale = calcLength(target) / calcLength(source);
22477      if (isNear(delta.scale, 1, 0.0001) || isNaN(delta.scale))
22478          delta.scale = 1;
22479      delta.translate =
22480          mixNumber(target.min, target.max, delta.origin) - delta.originPoint;
22481      if (isNear(delta.translate) || isNaN(delta.translate))
22482          delta.translate = 0;
22483  }
22484  function calcBoxDelta(delta, source, target, origin) {
22485      calcAxisDelta(delta.x, source.x, target.x, origin ? origin.originX : undefined);
22486      calcAxisDelta(delta.y, source.y, target.y, origin ? origin.originY : undefined);
22487  }
22488  function calcRelativeAxis(target, relative, parent) {
22489      target.min = parent.min + relative.min;
22490      target.max = target.min + calcLength(relative);
22491  }
22492  function calcRelativeBox(target, relative, parent) {
22493      calcRelativeAxis(target.x, relative.x, parent.x);
22494      calcRelativeAxis(target.y, relative.y, parent.y);
22495  }
22496  function calcRelativeAxisPosition(target, layout, parent) {
22497      target.min = layout.min - parent.min;
22498      target.max = target.min + calcLength(layout);
22499  }
22500  function calcRelativePosition(target, layout, parent) {
22501      calcRelativeAxisPosition(target.x, layout.x, parent.x);
22502      calcRelativeAxisPosition(target.y, layout.y, parent.y);
22503  }
22504  
22505  
22506  
22507  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/gestures/drag/utils/constraints.mjs
22508  
22509  
22510  
22511  
22512  
22513  /**
22514   * Apply constraints to a point. These constraints are both physical along an
22515   * axis, and an elastic factor that determines how much to constrain the point
22516   * by if it does lie outside the defined parameters.
22517   */
22518  function applyConstraints(point, { min, max }, elastic) {
22519      if (min !== undefined && point < min) {
22520          // If we have a min point defined, and this is outside of that, constrain
22521          point = elastic
22522              ? mixNumber(min, point, elastic.min)
22523              : Math.max(point, min);
22524      }
22525      else if (max !== undefined && point > max) {
22526          // If we have a max point defined, and this is outside of that, constrain
22527          point = elastic
22528              ? mixNumber(max, point, elastic.max)
22529              : Math.min(point, max);
22530      }
22531      return point;
22532  }
22533  /**
22534   * Calculate constraints in terms of the viewport when defined relatively to the
22535   * measured axis. This is measured from the nearest edge, so a max constraint of 200
22536   * on an axis with a max value of 300 would return a constraint of 500 - axis length
22537   */
22538  function calcRelativeAxisConstraints(axis, min, max) {
22539      return {
22540          min: min !== undefined ? axis.min + min : undefined,
22541          max: max !== undefined
22542              ? axis.max + max - (axis.max - axis.min)
22543              : undefined,
22544      };
22545  }
22546  /**
22547   * Calculate constraints in terms of the viewport when
22548   * defined relatively to the measured bounding box.
22549   */
22550  function calcRelativeConstraints(layoutBox, { top, left, bottom, right }) {
22551      return {
22552          x: calcRelativeAxisConstraints(layoutBox.x, left, right),
22553          y: calcRelativeAxisConstraints(layoutBox.y, top, bottom),
22554      };
22555  }
22556  /**
22557   * Calculate viewport constraints when defined as another viewport-relative axis
22558   */
22559  function calcViewportAxisConstraints(layoutAxis, constraintsAxis) {
22560      let min = constraintsAxis.min - layoutAxis.min;
22561      let max = constraintsAxis.max - layoutAxis.max;
22562      // If the constraints axis is actually smaller than the layout axis then we can
22563      // flip the constraints
22564      if (constraintsAxis.max - constraintsAxis.min <
22565          layoutAxis.max - layoutAxis.min) {
22566          [min, max] = [max, min];
22567      }
22568      return { min, max };
22569  }
22570  /**
22571   * Calculate viewport constraints when defined as another viewport-relative box
22572   */
22573  function calcViewportConstraints(layoutBox, constraintsBox) {
22574      return {
22575          x: calcViewportAxisConstraints(layoutBox.x, constraintsBox.x),
22576          y: calcViewportAxisConstraints(layoutBox.y, constraintsBox.y),
22577      };
22578  }
22579  /**
22580   * Calculate a transform origin relative to the source axis, between 0-1, that results
22581   * in an asthetically pleasing scale/transform needed to project from source to target.
22582   */
22583  function constraints_calcOrigin(source, target) {
22584      let origin = 0.5;
22585      const sourceLength = calcLength(source);
22586      const targetLength = calcLength(target);
22587      if (targetLength > sourceLength) {
22588          origin = progress(target.min, target.max - sourceLength, source.min);
22589      }
22590      else if (sourceLength > targetLength) {
22591          origin = progress(source.min, source.max - targetLength, target.min);
22592      }
22593      return clamp_clamp(0, 1, origin);
22594  }
22595  /**
22596   * Rebase the calculated viewport constraints relative to the layout.min point.
22597   */
22598  function rebaseAxisConstraints(layout, constraints) {
22599      const relativeConstraints = {};
22600      if (constraints.min !== undefined) {
22601          relativeConstraints.min = constraints.min - layout.min;
22602      }
22603      if (constraints.max !== undefined) {
22604          relativeConstraints.max = constraints.max - layout.min;
22605      }
22606      return relativeConstraints;
22607  }
22608  const defaultElastic = 0.35;
22609  /**
22610   * Accepts a dragElastic prop and returns resolved elastic values for each axis.
22611   */
22612  function resolveDragElastic(dragElastic = defaultElastic) {
22613      if (dragElastic === false) {
22614          dragElastic = 0;
22615      }
22616      else if (dragElastic === true) {
22617          dragElastic = defaultElastic;
22618      }
22619      return {
22620          x: resolveAxisElastic(dragElastic, "left", "right"),
22621          y: resolveAxisElastic(dragElastic, "top", "bottom"),
22622      };
22623  }
22624  function resolveAxisElastic(dragElastic, minLabel, maxLabel) {
22625      return {
22626          min: resolvePointElastic(dragElastic, minLabel),
22627          max: resolvePointElastic(dragElastic, maxLabel),
22628      };
22629  }
22630  function resolvePointElastic(dragElastic, label) {
22631      return typeof dragElastic === "number"
22632          ? dragElastic
22633          : dragElastic[label] || 0;
22634  }
22635  
22636  
22637  
22638  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/projection/geometry/models.mjs
22639  const createAxisDelta = () => ({
22640      translate: 0,
22641      scale: 1,
22642      origin: 0,
22643      originPoint: 0,
22644  });
22645  const createDelta = () => ({
22646      x: createAxisDelta(),
22647      y: createAxisDelta(),
22648  });
22649  const createAxis = () => ({ min: 0, max: 0 });
22650  const createBox = () => ({
22651      x: createAxis(),
22652      y: createAxis(),
22653  });
22654  
22655  
22656  
22657  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/projection/utils/each-axis.mjs
22658  function eachAxis(callback) {
22659      return [callback("x"), callback("y")];
22660  }
22661  
22662  
22663  
22664  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/projection/geometry/conversion.mjs
22665  /**
22666   * Bounding boxes tend to be defined as top, left, right, bottom. For various operations
22667   * it's easier to consider each axis individually. This function returns a bounding box
22668   * as a map of single-axis min/max values.
22669   */
22670  function convertBoundingBoxToBox({ top, left, right, bottom, }) {
22671      return {
22672          x: { min: left, max: right },
22673          y: { min: top, max: bottom },
22674      };
22675  }
22676  function convertBoxToBoundingBox({ x, y }) {
22677      return { top: y.min, right: x.max, bottom: y.max, left: x.min };
22678  }
22679  /**
22680   * Applies a TransformPoint function to a bounding box. TransformPoint is usually a function
22681   * provided by Framer to allow measured points to be corrected for device scaling. This is used
22682   * when measuring DOM elements and DOM event points.
22683   */
22684  function transformBoxPoints(point, transformPoint) {
22685      if (!transformPoint)
22686          return point;
22687      const topLeft = transformPoint({ x: point.left, y: point.top });
22688      const bottomRight = transformPoint({ x: point.right, y: point.bottom });
22689      return {
22690          top: topLeft.y,
22691          left: topLeft.x,
22692          bottom: bottomRight.y,
22693          right: bottomRight.x,
22694      };
22695  }
22696  
22697  
22698  
22699  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/projection/utils/has-transform.mjs
22700  function isIdentityScale(scale) {
22701      return scale === undefined || scale === 1;
22702  }
22703  function hasScale({ scale, scaleX, scaleY }) {
22704      return (!isIdentityScale(scale) ||
22705          !isIdentityScale(scaleX) ||
22706          !isIdentityScale(scaleY));
22707  }
22708  function hasTransform(values) {
22709      return (hasScale(values) ||
22710          has2DTranslate(values) ||
22711          values.z ||
22712          values.rotate ||
22713          values.rotateX ||
22714          values.rotateY ||
22715          values.skewX ||
22716          values.skewY);
22717  }
22718  function has2DTranslate(values) {
22719      return is2DTranslate(values.x) || is2DTranslate(values.y);
22720  }
22721  function is2DTranslate(value) {
22722      return value && value !== "0%";
22723  }
22724  
22725  
22726  
22727  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/projection/geometry/delta-apply.mjs
22728  
22729  
22730  
22731  /**
22732   * Scales a point based on a factor and an originPoint
22733   */
22734  function scalePoint(point, scale, originPoint) {
22735      const distanceFromOrigin = point - originPoint;
22736      const scaled = scale * distanceFromOrigin;
22737      return originPoint + scaled;
22738  }
22739  /**
22740   * Applies a translate/scale delta to a point
22741   */
22742  function applyPointDelta(point, translate, scale, originPoint, boxScale) {
22743      if (boxScale !== undefined) {
22744          point = scalePoint(point, boxScale, originPoint);
22745      }
22746      return scalePoint(point, scale, originPoint) + translate;
22747  }
22748  /**
22749   * Applies a translate/scale delta to an axis
22750   */
22751  function applyAxisDelta(axis, translate = 0, scale = 1, originPoint, boxScale) {
22752      axis.min = applyPointDelta(axis.min, translate, scale, originPoint, boxScale);
22753      axis.max = applyPointDelta(axis.max, translate, scale, originPoint, boxScale);
22754  }
22755  /**
22756   * Applies a translate/scale delta to a box
22757   */
22758  function applyBoxDelta(box, { x, y }) {
22759      applyAxisDelta(box.x, x.translate, x.scale, x.originPoint);
22760      applyAxisDelta(box.y, y.translate, y.scale, y.originPoint);
22761  }
22762  /**
22763   * Apply a tree of deltas to a box. We do this to calculate the effect of all the transforms
22764   * in a tree upon our box before then calculating how to project it into our desired viewport-relative box
22765   *
22766   * This is the final nested loop within updateLayoutDelta for future refactoring
22767   */
22768  function applyTreeDeltas(box, treeScale, treePath, isSharedTransition = false) {
22769      const treeLength = treePath.length;
22770      if (!treeLength)
22771          return;
22772      // Reset the treeScale
22773      treeScale.x = treeScale.y = 1;
22774      let node;
22775      let delta;
22776      for (let i = 0; i < treeLength; i++) {
22777          node = treePath[i];
22778          delta = node.projectionDelta;
22779          /**
22780           * TODO: Prefer to remove this, but currently we have motion components with
22781           * display: contents in Framer.
22782           */
22783          const instance = node.instance;
22784          if (instance &&
22785              instance.style &&
22786              instance.style.display === "contents") {
22787              continue;
22788          }
22789          if (isSharedTransition &&
22790              node.options.layoutScroll &&
22791              node.scroll &&
22792              node !== node.root) {
22793              transformBox(box, {
22794                  x: -node.scroll.offset.x,
22795                  y: -node.scroll.offset.y,
22796              });
22797          }
22798          if (delta) {
22799              // Incoporate each ancestor's scale into a culmulative treeScale for this component
22800              treeScale.x *= delta.x.scale;
22801              treeScale.y *= delta.y.scale;
22802              // Apply each ancestor's calculated delta into this component's recorded layout box
22803              applyBoxDelta(box, delta);
22804          }
22805          if (isSharedTransition && hasTransform(node.latestValues)) {
22806              transformBox(box, node.latestValues);
22807          }
22808      }
22809      /**
22810       * Snap tree scale back to 1 if it's within a non-perceivable threshold.
22811       * This will help reduce useless scales getting rendered.
22812       */
22813      treeScale.x = snapToDefault(treeScale.x);
22814      treeScale.y = snapToDefault(treeScale.y);
22815  }
22816  function snapToDefault(scale) {
22817      if (Number.isInteger(scale))
22818          return scale;
22819      return scale > 1.0000000000001 || scale < 0.999999999999 ? scale : 1;
22820  }
22821  function translateAxis(axis, distance) {
22822      axis.min = axis.min + distance;
22823      axis.max = axis.max + distance;
22824  }
22825  /**
22826   * Apply a transform to an axis from the latest resolved motion values.
22827   * This function basically acts as a bridge between a flat motion value map
22828   * and applyAxisDelta
22829   */
22830  function transformAxis(axis, transforms, [key, scaleKey, originKey]) {
22831      const axisOrigin = transforms[originKey] !== undefined ? transforms[originKey] : 0.5;
22832      const originPoint = mixNumber(axis.min, axis.max, axisOrigin);
22833      // Apply the axis delta to the final axis
22834      applyAxisDelta(axis, transforms[key], transforms[scaleKey], originPoint, transforms.scale);
22835  }
22836  /**
22837   * The names of the motion values we want to apply as translation, scale and origin.
22838   */
22839  const xKeys = ["x", "scaleX", "originX"];
22840  const yKeys = ["y", "scaleY", "originY"];
22841  /**
22842   * Apply a transform to a box from the latest resolved motion values.
22843   */
22844  function transformBox(box, transform) {
22845      transformAxis(box.x, transform, xKeys);
22846      transformAxis(box.y, transform, yKeys);
22847  }
22848  
22849  
22850  
22851  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/projection/utils/measure.mjs
22852  
22853  
22854  
22855  function measureViewportBox(instance, transformPoint) {
22856      return convertBoundingBoxToBox(transformBoxPoints(instance.getBoundingClientRect(), transformPoint));
22857  }
22858  function measurePageBox(element, rootProjectionNode, transformPagePoint) {
22859      const viewportBox = measureViewportBox(element, transformPagePoint);
22860      const { scroll } = rootProjectionNode;
22861      if (scroll) {
22862          translateAxis(viewportBox.x, scroll.offset.x);
22863          translateAxis(viewportBox.y, scroll.offset.y);
22864      }
22865      return viewportBox;
22866  }
22867  
22868  
22869  
22870  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/get-context-window.mjs
22871  // Fixes https://github.com/framer/motion/issues/2270
22872  const getContextWindow = ({ current }) => {
22873      return current ? current.ownerDocument.defaultView : null;
22874  };
22875  
22876  
22877  
22878  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/gestures/drag/VisualElementDragControls.mjs
22879  
22880  
22881  
22882  
22883  
22884  
22885  
22886  
22887  
22888  
22889  
22890  
22891  
22892  
22893  
22894  
22895  
22896  
22897  
22898  const elementDragControls = new WeakMap();
22899  /**
22900   *
22901   */
22902  // let latestPointerEvent: PointerEvent
22903  class VisualElementDragControls {
22904      constructor(visualElement) {
22905          // This is a reference to the global drag gesture lock, ensuring only one component
22906          // can "capture" the drag of one or both axes.
22907          // TODO: Look into moving this into pansession?
22908          this.openGlobalLock = null;
22909          this.isDragging = false;
22910          this.currentDirection = null;
22911          this.originPoint = { x: 0, y: 0 };
22912          /**
22913           * The permitted boundaries of travel, in pixels.
22914           */
22915          this.constraints = false;
22916          this.hasMutatedConstraints = false;
22917          /**
22918           * The per-axis resolved elastic values.
22919           */
22920          this.elastic = createBox();
22921          this.visualElement = visualElement;
22922      }
22923      start(originEvent, { snapToCursor = false } = {}) {
22924          /**
22925           * Don't start dragging if this component is exiting
22926           */
22927          const { presenceContext } = this.visualElement;
22928          if (presenceContext && presenceContext.isPresent === false)
22929              return;
22930          const onSessionStart = (event) => {
22931              const { dragSnapToOrigin } = this.getProps();
22932              // Stop or pause any animations on both axis values immediately. This allows the user to throw and catch
22933              // the component.
22934              dragSnapToOrigin ? this.pauseAnimation() : this.stopAnimation();
22935              if (snapToCursor) {
22936                  this.snapToCursor(extractEventInfo(event, "page").point);
22937              }
22938          };
22939          const onStart = (event, info) => {
22940              // Attempt to grab the global drag gesture lock - maybe make this part of PanSession
22941              const { drag, dragPropagation, onDragStart } = this.getProps();
22942              if (drag && !dragPropagation) {
22943                  if (this.openGlobalLock)
22944                      this.openGlobalLock();
22945                  this.openGlobalLock = getGlobalLock(drag);
22946                  // If we don 't have the lock, don't start dragging
22947                  if (!this.openGlobalLock)
22948                      return;
22949              }
22950              this.isDragging = true;
22951              this.currentDirection = null;
22952              this.resolveConstraints();
22953              if (this.visualElement.projection) {
22954                  this.visualElement.projection.isAnimationBlocked = true;
22955                  this.visualElement.projection.target = undefined;
22956              }
22957              /**
22958               * Record gesture origin
22959               */
22960              eachAxis((axis) => {
22961                  let current = this.getAxisMotionValue(axis).get() || 0;
22962                  /**
22963                   * If the MotionValue is a percentage value convert to px
22964                   */
22965                  if (percent.test(current)) {
22966                      const { projection } = this.visualElement;
22967                      if (projection && projection.layout) {
22968                          const measuredAxis = projection.layout.layoutBox[axis];
22969                          if (measuredAxis) {
22970                              const length = calcLength(measuredAxis);
22971                              current = length * (parseFloat(current) / 100);
22972                          }
22973                      }
22974                  }
22975                  this.originPoint[axis] = current;
22976              });
22977              // Fire onDragStart event
22978              if (onDragStart) {
22979                  frame_frame.postRender(() => onDragStart(event, info));
22980              }
22981              const { animationState } = this.visualElement;
22982              animationState && animationState.setActive("whileDrag", true);
22983          };
22984          const onMove = (event, info) => {
22985              // latestPointerEvent = event
22986              const { dragPropagation, dragDirectionLock, onDirectionLock, onDrag, } = this.getProps();
22987              // If we didn't successfully receive the gesture lock, early return.
22988              if (!dragPropagation && !this.openGlobalLock)
22989                  return;
22990              const { offset } = info;
22991              // Attempt to detect drag direction if directionLock is true
22992              if (dragDirectionLock && this.currentDirection === null) {
22993                  this.currentDirection = getCurrentDirection(offset);
22994                  // If we've successfully set a direction, notify listener
22995                  if (this.currentDirection !== null) {
22996                      onDirectionLock && onDirectionLock(this.currentDirection);
22997                  }
22998                  return;
22999              }
23000              // Update each point with the latest position
23001              this.updateAxis("x", info.point, offset);
23002              this.updateAxis("y", info.point, offset);
23003              /**
23004               * Ideally we would leave the renderer to fire naturally at the end of
23005               * this frame but if the element is about to change layout as the result
23006               * of a re-render we want to ensure the browser can read the latest
23007               * bounding box to ensure the pointer and element don't fall out of sync.
23008               */
23009              this.visualElement.render();
23010              /**
23011               * This must fire after the render call as it might trigger a state
23012               * change which itself might trigger a layout update.
23013               */
23014              onDrag && onDrag(event, info);
23015          };
23016          const onSessionEnd = (event, info) => this.stop(event, info);
23017          const resumeAnimation = () => eachAxis((axis) => {
23018              var _a;
23019              return this.getAnimationState(axis) === "paused" &&
23020                  ((_a = this.getAxisMotionValue(axis).animation) === null || _a === void 0 ? void 0 : _a.play());
23021          });
23022          const { dragSnapToOrigin } = this.getProps();
23023          this.panSession = new PanSession(originEvent, {
23024              onSessionStart,
23025              onStart,
23026              onMove,
23027              onSessionEnd,
23028              resumeAnimation,
23029          }, {
23030              transformPagePoint: this.visualElement.getTransformPagePoint(),
23031              dragSnapToOrigin,
23032              contextWindow: getContextWindow(this.visualElement),
23033          });
23034      }
23035      stop(event, info) {
23036          const isDragging = this.isDragging;
23037          this.cancel();
23038          if (!isDragging)
23039              return;
23040          const { velocity } = info;
23041          this.startAnimation(velocity);
23042          const { onDragEnd } = this.getProps();
23043          if (onDragEnd) {
23044              frame_frame.postRender(() => onDragEnd(event, info));
23045          }
23046      }
23047      cancel() {
23048          this.isDragging = false;
23049          const { projection, animationState } = this.visualElement;
23050          if (projection) {
23051              projection.isAnimationBlocked = false;
23052          }
23053          this.panSession && this.panSession.end();
23054          this.panSession = undefined;
23055          const { dragPropagation } = this.getProps();
23056          if (!dragPropagation && this.openGlobalLock) {
23057              this.openGlobalLock();
23058              this.openGlobalLock = null;
23059          }
23060          animationState && animationState.setActive("whileDrag", false);
23061      }
23062      updateAxis(axis, _point, offset) {
23063          const { drag } = this.getProps();
23064          // If we're not dragging this axis, do an early return.
23065          if (!offset || !shouldDrag(axis, drag, this.currentDirection))
23066              return;
23067          const axisValue = this.getAxisMotionValue(axis);
23068          let next = this.originPoint[axis] + offset[axis];
23069          // Apply constraints
23070          if (this.constraints && this.constraints[axis]) {
23071              next = applyConstraints(next, this.constraints[axis], this.elastic[axis]);
23072          }
23073          axisValue.set(next);
23074      }
23075      resolveConstraints() {
23076          var _a;
23077          const { dragConstraints, dragElastic } = this.getProps();
23078          const layout = this.visualElement.projection &&
23079              !this.visualElement.projection.layout
23080              ? this.visualElement.projection.measure(false)
23081              : (_a = this.visualElement.projection) === null || _a === void 0 ? void 0 : _a.layout;
23082          const prevConstraints = this.constraints;
23083          if (dragConstraints && isRefObject(dragConstraints)) {
23084              if (!this.constraints) {
23085                  this.constraints = this.resolveRefConstraints();
23086              }
23087          }
23088          else {
23089              if (dragConstraints && layout) {
23090                  this.constraints = calcRelativeConstraints(layout.layoutBox, dragConstraints);
23091              }
23092              else {
23093                  this.constraints = false;
23094              }
23095          }
23096          this.elastic = resolveDragElastic(dragElastic);
23097          /**
23098           * If we're outputting to external MotionValues, we want to rebase the measured constraints
23099           * from viewport-relative to component-relative.
23100           */
23101          if (prevConstraints !== this.constraints &&
23102              layout &&
23103              this.constraints &&
23104              !this.hasMutatedConstraints) {
23105              eachAxis((axis) => {
23106                  if (this.constraints !== false &&
23107                      this.getAxisMotionValue(axis)) {
23108                      this.constraints[axis] = rebaseAxisConstraints(layout.layoutBox[axis], this.constraints[axis]);
23109                  }
23110              });
23111          }
23112      }
23113      resolveRefConstraints() {
23114          const { dragConstraints: constraints, onMeasureDragConstraints } = this.getProps();
23115          if (!constraints || !isRefObject(constraints))
23116              return false;
23117          const constraintsElement = constraints.current;
23118          errors_invariant(constraintsElement !== null, "If `dragConstraints` is set as a React ref, that ref must be passed to another component's `ref` prop.");
23119          const { projection } = this.visualElement;
23120          // TODO
23121          if (!projection || !projection.layout)
23122              return false;
23123          const constraintsBox = measurePageBox(constraintsElement, projection.root, this.visualElement.getTransformPagePoint());
23124          let measuredConstraints = calcViewportConstraints(projection.layout.layoutBox, constraintsBox);
23125          /**
23126           * If there's an onMeasureDragConstraints listener we call it and
23127           * if different constraints are returned, set constraints to that
23128           */
23129          if (onMeasureDragConstraints) {
23130              const userConstraints = onMeasureDragConstraints(convertBoxToBoundingBox(measuredConstraints));
23131              this.hasMutatedConstraints = !!userConstraints;
23132              if (userConstraints) {
23133                  measuredConstraints = convertBoundingBoxToBox(userConstraints);
23134              }
23135          }
23136          return measuredConstraints;
23137      }
23138      startAnimation(velocity) {
23139          const { drag, dragMomentum, dragElastic, dragTransition, dragSnapToOrigin, onDragTransitionEnd, } = this.getProps();
23140          const constraints = this.constraints || {};
23141          const momentumAnimations = eachAxis((axis) => {
23142              if (!shouldDrag(axis, drag, this.currentDirection)) {
23143                  return;
23144              }
23145              let transition = (constraints && constraints[axis]) || {};
23146              if (dragSnapToOrigin)
23147                  transition = { min: 0, max: 0 };
23148              /**
23149               * Overdamp the boundary spring if `dragElastic` is disabled. There's still a frame
23150               * of spring animations so we should look into adding a disable spring option to `inertia`.
23151               * We could do something here where we affect the `bounceStiffness` and `bounceDamping`
23152               * using the value of `dragElastic`.
23153               */
23154              const bounceStiffness = dragElastic ? 200 : 1000000;
23155              const bounceDamping = dragElastic ? 40 : 10000000;
23156              const inertia = {
23157                  type: "inertia",
23158                  velocity: dragMomentum ? velocity[axis] : 0,
23159                  bounceStiffness,
23160                  bounceDamping,
23161                  timeConstant: 750,
23162                  restDelta: 1,
23163                  restSpeed: 10,
23164                  ...dragTransition,
23165                  ...transition,
23166              };
23167              // If we're not animating on an externally-provided `MotionValue` we can use the
23168              // component's animation controls which will handle interactions with whileHover (etc),
23169              // otherwise we just have to animate the `MotionValue` itself.
23170              return this.startAxisValueAnimation(axis, inertia);
23171          });
23172          // Run all animations and then resolve the new drag constraints.
23173          return Promise.all(momentumAnimations).then(onDragTransitionEnd);
23174      }
23175      startAxisValueAnimation(axis, transition) {
23176          const axisValue = this.getAxisMotionValue(axis);
23177          return axisValue.start(animateMotionValue(axis, axisValue, 0, transition, this.visualElement));
23178      }
23179      stopAnimation() {
23180          eachAxis((axis) => this.getAxisMotionValue(axis).stop());
23181      }
23182      pauseAnimation() {
23183          eachAxis((axis) => { var _a; return (_a = this.getAxisMotionValue(axis).animation) === null || _a === void 0 ? void 0 : _a.pause(); });
23184      }
23185      getAnimationState(axis) {
23186          var _a;
23187          return (_a = this.getAxisMotionValue(axis).animation) === null || _a === void 0 ? void 0 : _a.state;
23188      }
23189      /**
23190       * Drag works differently depending on which props are provided.
23191       *
23192       * - If _dragX and _dragY are provided, we output the gesture delta directly to those motion values.
23193       * - Otherwise, we apply the delta to the x/y motion values.
23194       */
23195      getAxisMotionValue(axis) {
23196          const dragKey = `_drag$axis.toUpperCase()}`;
23197          const props = this.visualElement.getProps();
23198          const externalMotionValue = props[dragKey];
23199          return externalMotionValue
23200              ? externalMotionValue
23201              : this.visualElement.getValue(axis, (props.initial
23202                  ? props.initial[axis]
23203                  : undefined) || 0);
23204      }
23205      snapToCursor(point) {
23206          eachAxis((axis) => {
23207              const { drag } = this.getProps();
23208              // If we're not dragging this axis, do an early return.
23209              if (!shouldDrag(axis, drag, this.currentDirection))
23210                  return;
23211              const { projection } = this.visualElement;
23212              const axisValue = this.getAxisMotionValue(axis);
23213              if (projection && projection.layout) {
23214                  const { min, max } = projection.layout.layoutBox[axis];
23215                  axisValue.set(point[axis] - mixNumber(min, max, 0.5));
23216              }
23217          });
23218      }
23219      /**
23220       * When the viewport resizes we want to check if the measured constraints
23221       * have changed and, if so, reposition the element within those new constraints
23222       * relative to where it was before the resize.
23223       */
23224      scalePositionWithinConstraints() {
23225          if (!this.visualElement.current)
23226              return;
23227          const { drag, dragConstraints } = this.getProps();
23228          const { projection } = this.visualElement;
23229          if (!isRefObject(dragConstraints) || !projection || !this.constraints)
23230              return;
23231          /**
23232           * Stop current animations as there can be visual glitching if we try to do
23233           * this mid-animation
23234           */
23235          this.stopAnimation();
23236          /**
23237           * Record the relative position of the dragged element relative to the
23238           * constraints box and save as a progress value.
23239           */
23240          const boxProgress = { x: 0, y: 0 };
23241          eachAxis((axis) => {
23242              const axisValue = this.getAxisMotionValue(axis);
23243              if (axisValue && this.constraints !== false) {
23244                  const latest = axisValue.get();
23245                  boxProgress[axis] = constraints_calcOrigin({ min: latest, max: latest }, this.constraints[axis]);
23246              }
23247          });
23248          /**
23249           * Update the layout of this element and resolve the latest drag constraints
23250           */
23251          const { transformTemplate } = this.visualElement.getProps();
23252          this.visualElement.current.style.transform = transformTemplate
23253              ? transformTemplate({}, "")
23254              : "none";
23255          projection.root && projection.root.updateScroll();
23256          projection.updateLayout();
23257          this.resolveConstraints();
23258          /**
23259           * For each axis, calculate the current progress of the layout axis
23260           * within the new constraints.
23261           */
23262          eachAxis((axis) => {
23263              if (!shouldDrag(axis, drag, null))
23264                  return;
23265              /**
23266               * Calculate a new transform based on the previous box progress
23267               */
23268              const axisValue = this.getAxisMotionValue(axis);
23269              const { min, max } = this.constraints[axis];
23270              axisValue.set(mixNumber(min, max, boxProgress[axis]));
23271          });
23272      }
23273      addListeners() {
23274          if (!this.visualElement.current)
23275              return;
23276          elementDragControls.set(this.visualElement, this);
23277          const element = this.visualElement.current;
23278          /**
23279           * Attach a pointerdown event listener on this DOM element to initiate drag tracking.
23280           */
23281          const stopPointerListener = addPointerEvent(element, "pointerdown", (event) => {
23282              const { drag, dragListener = true } = this.getProps();
23283              drag && dragListener && this.start(event);
23284          });
23285          const measureDragConstraints = () => {
23286              const { dragConstraints } = this.getProps();
23287              if (isRefObject(dragConstraints)) {
23288                  this.constraints = this.resolveRefConstraints();
23289              }
23290          };
23291          const { projection } = this.visualElement;
23292          const stopMeasureLayoutListener = projection.addEventListener("measure", measureDragConstraints);
23293          if (projection && !projection.layout) {
23294              projection.root && projection.root.updateScroll();
23295              projection.updateLayout();
23296          }
23297          measureDragConstraints();
23298          /**
23299           * Attach a window resize listener to scale the draggable target within its defined
23300           * constraints as the window resizes.
23301           */
23302          const stopResizeListener = addDomEvent(window, "resize", () => this.scalePositionWithinConstraints());
23303          /**
23304           * If the element's layout changes, calculate the delta and apply that to
23305           * the drag gesture's origin point.
23306           */
23307          const stopLayoutUpdateListener = projection.addEventListener("didUpdate", (({ delta, hasLayoutChanged }) => {
23308              if (this.isDragging && hasLayoutChanged) {
23309                  eachAxis((axis) => {
23310                      const motionValue = this.getAxisMotionValue(axis);
23311                      if (!motionValue)
23312                          return;
23313                      this.originPoint[axis] += delta[axis].translate;
23314                      motionValue.set(motionValue.get() + delta[axis].translate);
23315                  });
23316                  this.visualElement.render();
23317              }
23318          }));
23319          return () => {
23320              stopResizeListener();
23321              stopPointerListener();
23322              stopMeasureLayoutListener();
23323              stopLayoutUpdateListener && stopLayoutUpdateListener();
23324          };
23325      }
23326      getProps() {
23327          const props = this.visualElement.getProps();
23328          const { drag = false, dragDirectionLock = false, dragPropagation = false, dragConstraints = false, dragElastic = defaultElastic, dragMomentum = true, } = props;
23329          return {
23330              ...props,
23331              drag,
23332              dragDirectionLock,
23333              dragPropagation,
23334              dragConstraints,
23335              dragElastic,
23336              dragMomentum,
23337          };
23338      }
23339  }
23340  function shouldDrag(direction, drag, currentDirection) {
23341      return ((drag === true || drag === direction) &&
23342          (currentDirection === null || currentDirection === direction));
23343  }
23344  /**
23345   * Based on an x/y offset determine the current drag direction. If both axis' offsets are lower
23346   * than the provided threshold, return `null`.
23347   *
23348   * @param offset - The x/y offset from origin.
23349   * @param lockThreshold - (Optional) - the minimum absolute offset before we can determine a drag direction.
23350   */
23351  function getCurrentDirection(offset, lockThreshold = 10) {
23352      let direction = null;
23353      if (Math.abs(offset.y) > lockThreshold) {
23354          direction = "y";
23355      }
23356      else if (Math.abs(offset.x) > lockThreshold) {
23357          direction = "x";
23358      }
23359      return direction;
23360  }
23361  
23362  
23363  
23364  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/gestures/drag/index.mjs
23365  
23366  
23367  
23368  
23369  class DragGesture extends Feature {
23370      constructor(node) {
23371          super(node);
23372          this.removeGroupControls = noop_noop;
23373          this.removeListeners = noop_noop;
23374          this.controls = new VisualElementDragControls(node);
23375      }
23376      mount() {
23377          // If we've been provided a DragControls for manual control over the drag gesture,
23378          // subscribe this component to it on mount.
23379          const { dragControls } = this.node.getProps();
23380          if (dragControls) {
23381              this.removeGroupControls = dragControls.subscribe(this.controls);
23382          }
23383          this.removeListeners = this.controls.addListeners() || noop_noop;
23384      }
23385      unmount() {
23386          this.removeGroupControls();
23387          this.removeListeners();
23388      }
23389  }
23390  
23391  
23392  
23393  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/gestures/pan/index.mjs
23394  
23395  
23396  
23397  
23398  
23399  
23400  
23401  const asyncHandler = (handler) => (event, info) => {
23402      if (handler) {
23403          frame_frame.postRender(() => handler(event, info));
23404      }
23405  };
23406  class PanGesture extends Feature {
23407      constructor() {
23408          super(...arguments);
23409          this.removePointerDownListener = noop_noop;
23410      }
23411      onPointerDown(pointerDownEvent) {
23412          this.session = new PanSession(pointerDownEvent, this.createPanHandlers(), {
23413              transformPagePoint: this.node.getTransformPagePoint(),
23414              contextWindow: getContextWindow(this.node),
23415          });
23416      }
23417      createPanHandlers() {
23418          const { onPanSessionStart, onPanStart, onPan, onPanEnd } = this.node.getProps();
23419          return {
23420              onSessionStart: asyncHandler(onPanSessionStart),
23421              onStart: asyncHandler(onPanStart),
23422              onMove: onPan,
23423              onEnd: (event, info) => {
23424                  delete this.session;
23425                  if (onPanEnd) {
23426                      frame_frame.postRender(() => onPanEnd(event, info));
23427                  }
23428              },
23429          };
23430      }
23431      mount() {
23432          this.removePointerDownListener = addPointerEvent(this.node.current, "pointerdown", (event) => this.onPointerDown(event));
23433      }
23434      update() {
23435          this.session && this.session.updateHandlers(this.createPanHandlers());
23436      }
23437      unmount() {
23438          this.removePointerDownListener();
23439          this.session && this.session.end();
23440      }
23441  }
23442  
23443  
23444  
23445  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/components/AnimatePresence/use-presence.mjs
23446  
23447  
23448  
23449  /**
23450   * When a component is the child of `AnimatePresence`, it can use `usePresence`
23451   * to access information about whether it's still present in the React tree.
23452   *
23453   * ```jsx
23454   * import { usePresence } from "framer-motion"
23455   *
23456   * export const Component = () => {
23457   *   const [isPresent, safeToRemove] = usePresence()
23458   *
23459   *   useEffect(() => {
23460   *     !isPresent && setTimeout(safeToRemove, 1000)
23461   *   }, [isPresent])
23462   *
23463   *   return <div />
23464   * }
23465   * ```
23466   *
23467   * If `isPresent` is `false`, it means that a component has been removed the tree, but
23468   * `AnimatePresence` won't really remove it until `safeToRemove` has been called.
23469   *
23470   * @public
23471   */
23472  function usePresence() {
23473      const context = (0,external_React_.useContext)(PresenceContext_PresenceContext);
23474      if (context === null)
23475          return [true, null];
23476      const { isPresent, onExitComplete, register } = context;
23477      // It's safe to call the following hooks conditionally (after an early return) because the context will always
23478      // either be null or non-null for the lifespan of the component.
23479      const id = (0,external_React_.useId)();
23480      (0,external_React_.useEffect)(() => register(id), []);
23481      const safeToRemove = () => onExitComplete && onExitComplete(id);
23482      return !isPresent && onExitComplete ? [false, safeToRemove] : [true];
23483  }
23484  /**
23485   * Similar to `usePresence`, except `useIsPresent` simply returns whether or not the component is present.
23486   * There is no `safeToRemove` function.
23487   *
23488   * ```jsx
23489   * import { useIsPresent } from "framer-motion"
23490   *
23491   * export const Component = () => {
23492   *   const isPresent = useIsPresent()
23493   *
23494   *   useEffect(() => {
23495   *     !isPresent && console.log("I've been removed!")
23496   *   }, [isPresent])
23497   *
23498   *   return <div />
23499   * }
23500   * ```
23501   *
23502   * @public
23503   */
23504  function useIsPresent() {
23505      return isPresent(useContext(PresenceContext));
23506  }
23507  function isPresent(context) {
23508      return context === null ? true : context.isPresent;
23509  }
23510  
23511  
23512  
23513  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/projection/node/state.mjs
23514  /**
23515   * This should only ever be modified on the client otherwise it'll
23516   * persist through server requests. If we need instanced states we
23517   * could lazy-init via root.
23518   */
23519  const globalProjectionState = {
23520      /**
23521       * Global flag as to whether the tree has animated since the last time
23522       * we resized the window
23523       */
23524      hasAnimatedSinceResize: true,
23525      /**
23526       * We set this to true once, on the first update. Any nodes added to the tree beyond that
23527       * update will be given a `data-projection-id` attribute.
23528       */
23529      hasEverUpdated: false,
23530  };
23531  
23532  
23533  
23534  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/projection/styles/scale-border-radius.mjs
23535  
23536  
23537  function pixelsToPercent(pixels, axis) {
23538      if (axis.max === axis.min)
23539          return 0;
23540      return (pixels / (axis.max - axis.min)) * 100;
23541  }
23542  /**
23543   * We always correct borderRadius as a percentage rather than pixels to reduce paints.
23544   * For example, if you are projecting a box that is 100px wide with a 10px borderRadius
23545   * into a box that is 200px wide with a 20px borderRadius, that is actually a 10%
23546   * borderRadius in both states. If we animate between the two in pixels that will trigger
23547   * a paint each time. If we animate between the two in percentage we'll avoid a paint.
23548   */
23549  const correctBorderRadius = {
23550      correct: (latest, node) => {
23551          if (!node.target)
23552              return latest;
23553          /**
23554           * If latest is a string, if it's a percentage we can return immediately as it's
23555           * going to be stretched appropriately. Otherwise, if it's a pixel, convert it to a number.
23556           */
23557          if (typeof latest === "string") {
23558              if (px.test(latest)) {
23559                  latest = parseFloat(latest);
23560              }
23561              else {
23562                  return latest;
23563              }
23564          }
23565          /**
23566           * If latest is a number, it's a pixel value. We use the current viewportBox to calculate that
23567           * pixel value as a percentage of each axis
23568           */
23569          const x = pixelsToPercent(latest, node.target.x);
23570          const y = pixelsToPercent(latest, node.target.y);
23571          return `$x}% $y}%`;
23572      },
23573  };
23574  
23575  
23576  
23577  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/projection/styles/scale-box-shadow.mjs
23578  
23579  
23580  
23581  const correctBoxShadow = {
23582      correct: (latest, { treeScale, projectionDelta }) => {
23583          const original = latest;
23584          const shadow = complex.parse(latest);
23585          // TODO: Doesn't support multiple shadows
23586          if (shadow.length > 5)
23587              return original;
23588          const template = complex.createTransformer(latest);
23589          const offset = typeof shadow[0] !== "number" ? 1 : 0;
23590          // Calculate the overall context scale
23591          const xScale = projectionDelta.x.scale * treeScale.x;
23592          const yScale = projectionDelta.y.scale * treeScale.y;
23593          shadow[0 + offset] /= xScale;
23594          shadow[1 + offset] /= yScale;
23595          /**
23596           * Ideally we'd correct x and y scales individually, but because blur and
23597           * spread apply to both we have to take a scale average and apply that instead.
23598           * We could potentially improve the outcome of this by incorporating the ratio between
23599           * the two scales.
23600           */
23601          const averageScale = mixNumber(xScale, yScale, 0.5);
23602          // Blur
23603          if (typeof shadow[2 + offset] === "number")
23604              shadow[2 + offset] /= averageScale;
23605          // Spread
23606          if (typeof shadow[3 + offset] === "number")
23607              shadow[3 + offset] /= averageScale;
23608          return template(shadow);
23609      },
23610  };
23611  
23612  
23613  
23614  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/motion/features/layout/MeasureLayout.mjs
23615  
23616  
23617  
23618  
23619  
23620  
23621  
23622  
23623  
23624  
23625  
23626  
23627  class MeasureLayoutWithContext extends external_React_.Component {
23628      /**
23629       * This only mounts projection nodes for components that
23630       * need measuring, we might want to do it for all components
23631       * in order to incorporate transforms
23632       */
23633      componentDidMount() {
23634          const { visualElement, layoutGroup, switchLayoutGroup, layoutId } = this.props;
23635          const { projection } = visualElement;
23636          addScaleCorrector(defaultScaleCorrectors);
23637          if (projection) {
23638              if (layoutGroup.group)
23639                  layoutGroup.group.add(projection);
23640              if (switchLayoutGroup && switchLayoutGroup.register && layoutId) {
23641                  switchLayoutGroup.register(projection);
23642              }
23643              projection.root.didUpdate();
23644              projection.addEventListener("animationComplete", () => {
23645                  this.safeToRemove();
23646              });
23647              projection.setOptions({
23648                  ...projection.options,
23649                  onExitComplete: () => this.safeToRemove(),
23650              });
23651          }
23652          globalProjectionState.hasEverUpdated = true;
23653      }
23654      getSnapshotBeforeUpdate(prevProps) {
23655          const { layoutDependency, visualElement, drag, isPresent } = this.props;
23656          const projection = visualElement.projection;
23657          if (!projection)
23658              return null;
23659          /**
23660           * TODO: We use this data in relegate to determine whether to
23661           * promote a previous element. There's no guarantee its presence data
23662           * will have updated by this point - if a bug like this arises it will
23663           * have to be that we markForRelegation and then find a new lead some other way,
23664           * perhaps in didUpdate
23665           */
23666          projection.isPresent = isPresent;
23667          if (drag ||
23668              prevProps.layoutDependency !== layoutDependency ||
23669              layoutDependency === undefined) {
23670              projection.willUpdate();
23671          }
23672          else {
23673              this.safeToRemove();
23674          }
23675          if (prevProps.isPresent !== isPresent) {
23676              if (isPresent) {
23677                  projection.promote();
23678              }
23679              else if (!projection.relegate()) {
23680                  /**
23681                   * If there's another stack member taking over from this one,
23682                   * it's in charge of the exit animation and therefore should
23683                   * be in charge of the safe to remove. Otherwise we call it here.
23684                   */
23685                  frame_frame.postRender(() => {
23686                      const stack = projection.getStack();
23687                      if (!stack || !stack.members.length) {
23688                          this.safeToRemove();
23689                      }
23690                  });
23691              }
23692          }
23693          return null;
23694      }
23695      componentDidUpdate() {
23696          const { projection } = this.props.visualElement;
23697          if (projection) {
23698              projection.root.didUpdate();
23699              microtask.postRender(() => {
23700                  if (!projection.currentAnimation && projection.isLead()) {
23701                      this.safeToRemove();
23702                  }
23703              });
23704          }
23705      }
23706      componentWillUnmount() {
23707          const { visualElement, layoutGroup, switchLayoutGroup: promoteContext, } = this.props;
23708          const { projection } = visualElement;
23709          if (projection) {
23710              projection.scheduleCheckAfterUnmount();
23711              if (layoutGroup && layoutGroup.group)
23712                  layoutGroup.group.remove(projection);
23713              if (promoteContext && promoteContext.deregister)
23714                  promoteContext.deregister(projection);
23715          }
23716      }
23717      safeToRemove() {
23718          const { safeToRemove } = this.props;
23719          safeToRemove && safeToRemove();
23720      }
23721      render() {
23722          return null;
23723      }
23724  }
23725  function MeasureLayout(props) {
23726      const [isPresent, safeToRemove] = usePresence();
23727      const layoutGroup = (0,external_React_.useContext)(LayoutGroupContext);
23728      return ((0,external_ReactJSXRuntime_namespaceObject.jsx)(MeasureLayoutWithContext, { ...props, layoutGroup: layoutGroup, switchLayoutGroup: (0,external_React_.useContext)(SwitchLayoutGroupContext), isPresent: isPresent, safeToRemove: safeToRemove }));
23729  }
23730  const defaultScaleCorrectors = {
23731      borderRadius: {
23732          ...correctBorderRadius,
23733          applyTo: [
23734              "borderTopLeftRadius",
23735              "borderTopRightRadius",
23736              "borderBottomLeftRadius",
23737              "borderBottomRightRadius",
23738          ],
23739      },
23740      borderTopLeftRadius: correctBorderRadius,
23741      borderTopRightRadius: correctBorderRadius,
23742      borderBottomLeftRadius: correctBorderRadius,
23743      borderBottomRightRadius: correctBorderRadius,
23744      boxShadow: correctBoxShadow,
23745  };
23746  
23747  
23748  
23749  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/projection/animation/mix-values.mjs
23750  
23751  
23752  
23753  
23754  
23755  
23756  const borders = ["TopLeft", "TopRight", "BottomLeft", "BottomRight"];
23757  const numBorders = borders.length;
23758  const asNumber = (value) => typeof value === "string" ? parseFloat(value) : value;
23759  const isPx = (value) => typeof value === "number" || px.test(value);
23760  function mixValues(target, follow, lead, progress, shouldCrossfadeOpacity, isOnlyMember) {
23761      if (shouldCrossfadeOpacity) {
23762          target.opacity = mixNumber(0, 
23763          // TODO Reinstate this if only child
23764          lead.opacity !== undefined ? lead.opacity : 1, easeCrossfadeIn(progress));
23765          target.opacityExit = mixNumber(follow.opacity !== undefined ? follow.opacity : 1, 0, easeCrossfadeOut(progress));
23766      }
23767      else if (isOnlyMember) {
23768          target.opacity = mixNumber(follow.opacity !== undefined ? follow.opacity : 1, lead.opacity !== undefined ? lead.opacity : 1, progress);
23769      }
23770      /**
23771       * Mix border radius
23772       */
23773      for (let i = 0; i < numBorders; i++) {
23774          const borderLabel = `border$borders[i]}Radius`;
23775          let followRadius = getRadius(follow, borderLabel);
23776          let leadRadius = getRadius(lead, borderLabel);
23777          if (followRadius === undefined && leadRadius === undefined)
23778              continue;
23779          followRadius || (followRadius = 0);
23780          leadRadius || (leadRadius = 0);
23781          const canMix = followRadius === 0 ||
23782              leadRadius === 0 ||
23783              isPx(followRadius) === isPx(leadRadius);
23784          if (canMix) {
23785              target[borderLabel] = Math.max(mixNumber(asNumber(followRadius), asNumber(leadRadius), progress), 0);
23786              if (percent.test(leadRadius) || percent.test(followRadius)) {
23787                  target[borderLabel] += "%";
23788              }
23789          }
23790          else {
23791              target[borderLabel] = leadRadius;
23792          }
23793      }
23794      /**
23795       * Mix rotation
23796       */
23797      if (follow.rotate || lead.rotate) {
23798          target.rotate = mixNumber(follow.rotate || 0, lead.rotate || 0, progress);
23799      }
23800  }
23801  function getRadius(values, radiusName) {
23802      return values[radiusName] !== undefined
23803          ? values[radiusName]
23804          : values.borderRadius;
23805  }
23806  // /**
23807  //  * We only want to mix the background color if there's a follow element
23808  //  * that we're not crossfading opacity between. For instance with switch
23809  //  * AnimateSharedLayout animations, this helps the illusion of a continuous
23810  //  * element being animated but also cuts down on the number of paints triggered
23811  //  * for elements where opacity is doing that work for us.
23812  //  */
23813  // if (
23814  //     !hasFollowElement &&
23815  //     latestLeadValues.backgroundColor &&
23816  //     latestFollowValues.backgroundColor
23817  // ) {
23818  //     /**
23819  //      * This isn't ideal performance-wise as mixColor is creating a new function every frame.
23820  //      * We could probably create a mixer that runs at the start of the animation but
23821  //      * the idea behind the crossfader is that it runs dynamically between two potentially
23822  //      * changing targets (ie opacity or borderRadius may be animating independently via variants)
23823  //      */
23824  //     leadState.backgroundColor = followState.backgroundColor = mixColor(
23825  //         latestFollowValues.backgroundColor as string,
23826  //         latestLeadValues.backgroundColor as string
23827  //     )(p)
23828  // }
23829  const easeCrossfadeIn = compress(0, 0.5, circOut);
23830  const easeCrossfadeOut = compress(0.5, 0.95, noop_noop);
23831  function compress(min, max, easing) {
23832      return (p) => {
23833          // Could replace ifs with clamp
23834          if (p < min)
23835              return 0;
23836          if (p > max)
23837              return 1;
23838          return easing(progress(min, max, p));
23839      };
23840  }
23841  
23842  
23843  
23844  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/projection/geometry/copy.mjs
23845  /**
23846   * Reset an axis to the provided origin box.
23847   *
23848   * This is a mutative operation.
23849   */
23850  function copyAxisInto(axis, originAxis) {
23851      axis.min = originAxis.min;
23852      axis.max = originAxis.max;
23853  }
23854  /**
23855   * Reset a box to the provided origin box.
23856   *
23857   * This is a mutative operation.
23858   */
23859  function copyBoxInto(box, originBox) {
23860      copyAxisInto(box.x, originBox.x);
23861      copyAxisInto(box.y, originBox.y);
23862  }
23863  
23864  
23865  
23866  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/projection/geometry/delta-remove.mjs
23867  
23868  
23869  
23870  
23871  /**
23872   * Remove a delta from a point. This is essentially the steps of applyPointDelta in reverse
23873   */
23874  function removePointDelta(point, translate, scale, originPoint, boxScale) {
23875      point -= translate;
23876      point = scalePoint(point, 1 / scale, originPoint);
23877      if (boxScale !== undefined) {
23878          point = scalePoint(point, 1 / boxScale, originPoint);
23879      }
23880      return point;
23881  }
23882  /**
23883   * Remove a delta from an axis. This is essentially the steps of applyAxisDelta in reverse
23884   */
23885  function removeAxisDelta(axis, translate = 0, scale = 1, origin = 0.5, boxScale, originAxis = axis, sourceAxis = axis) {
23886      if (percent.test(translate)) {
23887          translate = parseFloat(translate);
23888          const relativeProgress = mixNumber(sourceAxis.min, sourceAxis.max, translate / 100);
23889          translate = relativeProgress - sourceAxis.min;
23890      }
23891      if (typeof translate !== "number")
23892          return;
23893      let originPoint = mixNumber(originAxis.min, originAxis.max, origin);
23894      if (axis === originAxis)
23895          originPoint -= translate;
23896      axis.min = removePointDelta(axis.min, translate, scale, originPoint, boxScale);
23897      axis.max = removePointDelta(axis.max, translate, scale, originPoint, boxScale);
23898  }
23899  /**
23900   * Remove a transforms from an axis. This is essentially the steps of applyAxisTransforms in reverse
23901   * and acts as a bridge between motion values and removeAxisDelta
23902   */
23903  function removeAxisTransforms(axis, transforms, [key, scaleKey, originKey], origin, sourceAxis) {
23904      removeAxisDelta(axis, transforms[key], transforms[scaleKey], transforms[originKey], transforms.scale, origin, sourceAxis);
23905  }
23906  /**
23907   * The names of the motion values we want to apply as translation, scale and origin.
23908   */
23909  const delta_remove_xKeys = ["x", "scaleX", "originX"];
23910  const delta_remove_yKeys = ["y", "scaleY", "originY"];
23911  /**
23912   * Remove a transforms from an box. This is essentially the steps of applyAxisBox in reverse
23913   * and acts as a bridge between motion values and removeAxisDelta
23914   */
23915  function removeBoxTransforms(box, transforms, originBox, sourceBox) {
23916      removeAxisTransforms(box.x, transforms, delta_remove_xKeys, originBox ? originBox.x : undefined, sourceBox ? sourceBox.x : undefined);
23917      removeAxisTransforms(box.y, transforms, delta_remove_yKeys, originBox ? originBox.y : undefined, sourceBox ? sourceBox.y : undefined);
23918  }
23919  
23920  
23921  
23922  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/projection/geometry/utils.mjs
23923  
23924  
23925  function isAxisDeltaZero(delta) {
23926      return delta.translate === 0 && delta.scale === 1;
23927  }
23928  function isDeltaZero(delta) {
23929      return isAxisDeltaZero(delta.x) && isAxisDeltaZero(delta.y);
23930  }
23931  function boxEquals(a, b) {
23932      return (a.x.min === b.x.min &&
23933          a.x.max === b.x.max &&
23934          a.y.min === b.y.min &&
23935          a.y.max === b.y.max);
23936  }
23937  function boxEqualsRounded(a, b) {
23938      return (Math.round(a.x.min) === Math.round(b.x.min) &&
23939          Math.round(a.x.max) === Math.round(b.x.max) &&
23940          Math.round(a.y.min) === Math.round(b.y.min) &&
23941          Math.round(a.y.max) === Math.round(b.y.max));
23942  }
23943  function aspectRatio(box) {
23944      return calcLength(box.x) / calcLength(box.y);
23945  }
23946  
23947  
23948  
23949  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/projection/shared/stack.mjs
23950  
23951  
23952  class NodeStack {
23953      constructor() {
23954          this.members = [];
23955      }
23956      add(node) {
23957          addUniqueItem(this.members, node);
23958          node.scheduleRender();
23959      }
23960      remove(node) {
23961          removeItem(this.members, node);
23962          if (node === this.prevLead) {
23963              this.prevLead = undefined;
23964          }
23965          if (node === this.lead) {
23966              const prevLead = this.members[this.members.length - 1];
23967              if (prevLead) {
23968                  this.promote(prevLead);
23969              }
23970          }
23971      }
23972      relegate(node) {
23973          const indexOfNode = this.members.findIndex((member) => node === member);
23974          if (indexOfNode === 0)
23975              return false;
23976          /**
23977           * Find the next projection node that is present
23978           */
23979          let prevLead;
23980          for (let i = indexOfNode; i >= 0; i--) {
23981              const member = this.members[i];
23982              if (member.isPresent !== false) {
23983                  prevLead = member;
23984                  break;
23985              }
23986          }
23987          if (prevLead) {
23988              this.promote(prevLead);
23989              return true;
23990          }
23991          else {
23992              return false;
23993          }
23994      }
23995      promote(node, preserveFollowOpacity) {
23996          const prevLead = this.lead;
23997          if (node === prevLead)
23998              return;
23999          this.prevLead = prevLead;
24000          this.lead = node;
24001          node.show();
24002          if (prevLead) {
24003              prevLead.instance && prevLead.scheduleRender();
24004              node.scheduleRender();
24005              node.resumeFrom = prevLead;
24006              if (preserveFollowOpacity) {
24007                  node.resumeFrom.preserveOpacity = true;
24008              }
24009              if (prevLead.snapshot) {
24010                  node.snapshot = prevLead.snapshot;
24011                  node.snapshot.latestValues =
24012                      prevLead.animationValues || prevLead.latestValues;
24013              }
24014              if (node.root && node.root.isUpdating) {
24015                  node.isLayoutDirty = true;
24016              }
24017              const { crossfade } = node.options;
24018              if (crossfade === false) {
24019                  prevLead.hide();
24020              }
24021              /**
24022               * TODO:
24023               *   - Test border radius when previous node was deleted
24024               *   - boxShadow mixing
24025               *   - Shared between element A in scrolled container and element B (scroll stays the same or changes)
24026               *   - Shared between element A in transformed container and element B (transform stays the same or changes)
24027               *   - Shared between element A in scrolled page and element B (scroll stays the same or changes)
24028               * ---
24029               *   - Crossfade opacity of root nodes
24030               *   - layoutId changes after animation
24031               *   - layoutId changes mid animation
24032               */
24033          }
24034      }
24035      exitAnimationComplete() {
24036          this.members.forEach((node) => {
24037              const { options, resumingFrom } = node;
24038              options.onExitComplete && options.onExitComplete();
24039              if (resumingFrom) {
24040                  resumingFrom.options.onExitComplete &&
24041                      resumingFrom.options.onExitComplete();
24042              }
24043          });
24044      }
24045      scheduleRender() {
24046          this.members.forEach((node) => {
24047              node.instance && node.scheduleRender(false);
24048          });
24049      }
24050      /**
24051       * Clear any leads that have been removed this render to prevent them from being
24052       * used in future animations and to prevent memory leaks
24053       */
24054      removeLeadSnapshot() {
24055          if (this.lead && this.lead.snapshot) {
24056              this.lead.snapshot = undefined;
24057          }
24058      }
24059  }
24060  
24061  
24062  
24063  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/projection/styles/transform.mjs
24064  function buildProjectionTransform(delta, treeScale, latestTransform) {
24065      let transform = "";
24066      /**
24067       * The translations we use to calculate are always relative to the viewport coordinate space.
24068       * But when we apply scales, we also scale the coordinate space of an element and its children.
24069       * For instance if we have a treeScale (the culmination of all parent scales) of 0.5 and we need
24070       * to move an element 100 pixels, we actually need to move it 200 in within that scaled space.
24071       */
24072      const xTranslate = delta.x.translate / treeScale.x;
24073      const yTranslate = delta.y.translate / treeScale.y;
24074      const zTranslate = (latestTransform === null || latestTransform === void 0 ? void 0 : latestTransform.z) || 0;
24075      if (xTranslate || yTranslate || zTranslate) {
24076          transform = `translate3d($xTranslate}px, $yTranslate}px, $zTranslate}px) `;
24077      }
24078      /**
24079       * Apply scale correction for the tree transform.
24080       * This will apply scale to the screen-orientated axes.
24081       */
24082      if (treeScale.x !== 1 || treeScale.y !== 1) {
24083          transform += `scale($1 / treeScale.x}, $1 / treeScale.y}) `;
24084      }
24085      if (latestTransform) {
24086          const { transformPerspective, rotate, rotateX, rotateY, skewX, skewY } = latestTransform;
24087          if (transformPerspective)
24088              transform = `perspective($transformPerspective}px) $transform}`;
24089          if (rotate)
24090              transform += `rotate($rotate}deg) `;
24091          if (rotateX)
24092              transform += `rotateX($rotateX}deg) `;
24093          if (rotateY)
24094              transform += `rotateY($rotateY}deg) `;
24095          if (skewX)
24096              transform += `skewX($skewX}deg) `;
24097          if (skewY)
24098              transform += `skewY($skewY}deg) `;
24099      }
24100      /**
24101       * Apply scale to match the size of the element to the size we want it.
24102       * This will apply scale to the element-orientated axes.
24103       */
24104      const elementScaleX = delta.x.scale * treeScale.x;
24105      const elementScaleY = delta.y.scale * treeScale.y;
24106      if (elementScaleX !== 1 || elementScaleY !== 1) {
24107          transform += `scale($elementScaleX}, $elementScaleY})`;
24108      }
24109      return transform || "none";
24110  }
24111  
24112  
24113  
24114  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/utils/compare-by-depth.mjs
24115  const compareByDepth = (a, b) => a.depth - b.depth;
24116  
24117  
24118  
24119  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/utils/flat-tree.mjs
24120  
24121  
24122  
24123  class FlatTree {
24124      constructor() {
24125          this.children = [];
24126          this.isDirty = false;
24127      }
24128      add(child) {
24129          addUniqueItem(this.children, child);
24130          this.isDirty = true;
24131      }
24132      remove(child) {
24133          removeItem(this.children, child);
24134          this.isDirty = true;
24135      }
24136      forEach(callback) {
24137          this.isDirty && this.children.sort(compareByDepth);
24138          this.isDirty = false;
24139          this.children.forEach(callback);
24140      }
24141  }
24142  
24143  
24144  
24145  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/delay.mjs
24146  
24147  
24148  
24149  /**
24150   * Timeout defined in ms
24151   */
24152  function delay(callback, timeout) {
24153      const start = time.now();
24154      const checkElapsed = ({ timestamp }) => {
24155          const elapsed = timestamp - start;
24156          if (elapsed >= timeout) {
24157              cancelFrame(checkElapsed);
24158              callback(elapsed - timeout);
24159          }
24160      };
24161      frame_frame.read(checkElapsed, true);
24162      return () => cancelFrame(checkElapsed);
24163  }
24164  
24165  
24166  
24167  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/debug/record.mjs
24168  function record(data) {
24169      if (window.MotionDebug) {
24170          window.MotionDebug.record(data);
24171      }
24172  }
24173  
24174  
24175  
24176  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/dom/utils/is-svg-element.mjs
24177  function isSVGElement(element) {
24178      return element instanceof SVGElement && element.tagName !== "svg";
24179  }
24180  
24181  
24182  
24183  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/animation/interfaces/single-value.mjs
24184  
24185  
24186  
24187  
24188  function animateSingleValue(value, keyframes, options) {
24189      const motionValue$1 = isMotionValue(value) ? value : motionValue(value);
24190      motionValue$1.start(animateMotionValue("", motionValue$1, keyframes, options));
24191      return motionValue$1.animation;
24192  }
24193  
24194  
24195  
24196  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/projection/node/create-projection-node.mjs
24197  
24198  
24199  
24200  
24201  
24202  
24203  
24204  
24205  
24206  
24207  
24208  
24209  
24210  
24211  
24212  
24213  
24214  
24215  
24216  
24217  
24218  
24219  
24220  
24221  
24222  
24223  
24224  
24225  const transformAxes = ["", "X", "Y", "Z"];
24226  const hiddenVisibility = { visibility: "hidden" };
24227  /**
24228   * We use 1000 as the animation target as 0-1000 maps better to pixels than 0-1
24229   * which has a noticeable difference in spring animations
24230   */
24231  const animationTarget = 1000;
24232  let create_projection_node_id = 0;
24233  /**
24234   * Use a mutable data object for debug data so as to not create a new
24235   * object every frame.
24236   */
24237  const projectionFrameData = {
24238      type: "projectionFrame",
24239      totalNodes: 0,
24240      resolvedTargetDeltas: 0,
24241      recalculatedProjection: 0,
24242  };
24243  function resetDistortingTransform(key, visualElement, values, sharedAnimationValues) {
24244      const { latestValues } = visualElement;
24245      // Record the distorting transform and then temporarily set it to 0
24246      if (latestValues[key]) {
24247          values[key] = latestValues[key];
24248          visualElement.setStaticValue(key, 0);
24249          if (sharedAnimationValues) {
24250              sharedAnimationValues[key] = 0;
24251          }
24252      }
24253  }
24254  function createProjectionNode({ attachResizeListener, defaultParent, measureScroll, checkIsScrollRoot, resetTransform, }) {
24255      return class ProjectionNode {
24256          constructor(latestValues = {}, parent = defaultParent === null || defaultParent === void 0 ? void 0 : defaultParent()) {
24257              /**
24258               * A unique ID generated for every projection node.
24259               */
24260              this.id = create_projection_node_id++;
24261              /**
24262               * An id that represents a unique session instigated by startUpdate.
24263               */
24264              this.animationId = 0;
24265              /**
24266               * A Set containing all this component's children. This is used to iterate
24267               * through the children.
24268               *
24269               * TODO: This could be faster to iterate as a flat array stored on the root node.
24270               */
24271              this.children = new Set();
24272              /**
24273               * Options for the node. We use this to configure what kind of layout animations
24274               * we should perform (if any).
24275               */
24276              this.options = {};
24277              /**
24278               * We use this to detect when its safe to shut down part of a projection tree.
24279               * We have to keep projecting children for scale correction and relative projection
24280               * until all their parents stop performing layout animations.
24281               */
24282              this.isTreeAnimating = false;
24283              this.isAnimationBlocked = false;
24284              /**
24285               * Flag to true if we think this layout has been changed. We can't always know this,
24286               * currently we set it to true every time a component renders, or if it has a layoutDependency
24287               * if that has changed between renders. Additionally, components can be grouped by LayoutGroup
24288               * and if one node is dirtied, they all are.
24289               */
24290              this.isLayoutDirty = false;
24291              /**
24292               * Flag to true if we think the projection calculations for this node needs
24293               * recalculating as a result of an updated transform or layout animation.
24294               */
24295              this.isProjectionDirty = false;
24296              /**
24297               * Flag to true if the layout *or* transform has changed. This then gets propagated
24298               * throughout the projection tree, forcing any element below to recalculate on the next frame.
24299               */
24300              this.isSharedProjectionDirty = false;
24301              /**
24302               * Flag transform dirty. This gets propagated throughout the whole tree but is only
24303               * respected by shared nodes.
24304               */
24305              this.isTransformDirty = false;
24306              /**
24307               * Block layout updates for instant layout transitions throughout the tree.
24308               */
24309              this.updateManuallyBlocked = false;
24310              this.updateBlockedByResize = false;
24311              /**
24312               * Set to true between the start of the first `willUpdate` call and the end of the `didUpdate`
24313               * call.
24314               */
24315              this.isUpdating = false;
24316              /**
24317               * If this is an SVG element we currently disable projection transforms
24318               */
24319              this.isSVG = false;
24320              /**
24321               * Flag to true (during promotion) if a node doing an instant layout transition needs to reset
24322               * its projection styles.
24323               */
24324              this.needsReset = false;
24325              /**
24326               * Flags whether this node should have its transform reset prior to measuring.
24327               */
24328              this.shouldResetTransform = false;
24329              /**
24330               * An object representing the calculated contextual/accumulated/tree scale.
24331               * This will be used to scale calculcated projection transforms, as these are
24332               * calculated in screen-space but need to be scaled for elements to layoutly
24333               * make it to their calculated destinations.
24334               *
24335               * TODO: Lazy-init
24336               */
24337              this.treeScale = { x: 1, y: 1 };
24338              /**
24339               *
24340               */
24341              this.eventHandlers = new Map();
24342              this.hasTreeAnimated = false;
24343              // Note: Currently only running on root node
24344              this.updateScheduled = false;
24345              this.projectionUpdateScheduled = false;
24346              this.checkUpdateFailed = () => {
24347                  if (this.isUpdating) {
24348                      this.isUpdating = false;
24349                      this.clearAllSnapshots();
24350                  }
24351              };
24352              /**
24353               * This is a multi-step process as shared nodes might be of different depths. Nodes
24354               * are sorted by depth order, so we need to resolve the entire tree before moving to
24355               * the next step.
24356               */
24357              this.updateProjection = () => {
24358                  this.projectionUpdateScheduled = false;
24359                  /**
24360                   * Reset debug counts. Manually resetting rather than creating a new
24361                   * object each frame.
24362                   */
24363                  projectionFrameData.totalNodes =
24364                      projectionFrameData.resolvedTargetDeltas =
24365                          projectionFrameData.recalculatedProjection =
24366                              0;
24367                  this.nodes.forEach(propagateDirtyNodes);
24368                  this.nodes.forEach(resolveTargetDelta);
24369                  this.nodes.forEach(calcProjection);
24370                  this.nodes.forEach(cleanDirtyNodes);
24371                  record(projectionFrameData);
24372              };
24373              this.hasProjected = false;
24374              this.isVisible = true;
24375              this.animationProgress = 0;
24376              /**
24377               * Shared layout
24378               */
24379              // TODO Only running on root node
24380              this.sharedNodes = new Map();
24381              this.latestValues = latestValues;
24382              this.root = parent ? parent.root || parent : this;
24383              this.path = parent ? [...parent.path, parent] : [];
24384              this.parent = parent;
24385              this.depth = parent ? parent.depth + 1 : 0;
24386              for (let i = 0; i < this.path.length; i++) {
24387                  this.path[i].shouldResetTransform = true;
24388              }
24389              if (this.root === this)
24390                  this.nodes = new FlatTree();
24391          }
24392          addEventListener(name, handler) {
24393              if (!this.eventHandlers.has(name)) {
24394                  this.eventHandlers.set(name, new SubscriptionManager());
24395              }
24396              return this.eventHandlers.get(name).add(handler);
24397          }
24398          notifyListeners(name, ...args) {
24399              const subscriptionManager = this.eventHandlers.get(name);
24400              subscriptionManager && subscriptionManager.notify(...args);
24401          }
24402          hasListeners(name) {
24403              return this.eventHandlers.has(name);
24404          }
24405          /**
24406           * Lifecycles
24407           */
24408          mount(instance, isLayoutDirty = this.root.hasTreeAnimated) {
24409              if (this.instance)
24410                  return;
24411              this.isSVG = isSVGElement(instance);
24412              this.instance = instance;
24413              const { layoutId, layout, visualElement } = this.options;
24414              if (visualElement && !visualElement.current) {
24415                  visualElement.mount(instance);
24416              }
24417              this.root.nodes.add(this);
24418              this.parent && this.parent.children.add(this);
24419              if (isLayoutDirty && (layout || layoutId)) {
24420                  this.isLayoutDirty = true;
24421              }
24422              if (attachResizeListener) {
24423                  let cancelDelay;
24424                  const resizeUnblockUpdate = () => (this.root.updateBlockedByResize = false);
24425                  attachResizeListener(instance, () => {
24426                      this.root.updateBlockedByResize = true;
24427                      cancelDelay && cancelDelay();
24428                      cancelDelay = delay(resizeUnblockUpdate, 250);
24429                      if (globalProjectionState.hasAnimatedSinceResize) {
24430                          globalProjectionState.hasAnimatedSinceResize = false;
24431                          this.nodes.forEach(finishAnimation);
24432                      }
24433                  });
24434              }
24435              if (layoutId) {
24436                  this.root.registerSharedNode(layoutId, this);
24437              }
24438              // Only register the handler if it requires layout animation
24439              if (this.options.animate !== false &&
24440                  visualElement &&
24441                  (layoutId || layout)) {
24442                  this.addEventListener("didUpdate", ({ delta, hasLayoutChanged, hasRelativeTargetChanged, layout: newLayout, }) => {
24443                      if (this.isTreeAnimationBlocked()) {
24444                          this.target = undefined;
24445                          this.relativeTarget = undefined;
24446                          return;
24447                      }
24448                      // TODO: Check here if an animation exists
24449                      const layoutTransition = this.options.transition ||
24450                          visualElement.getDefaultTransition() ||
24451                          defaultLayoutTransition;
24452                      const { onLayoutAnimationStart, onLayoutAnimationComplete, } = visualElement.getProps();
24453                      /**
24454                       * The target layout of the element might stay the same,
24455                       * but its position relative to its parent has changed.
24456                       */
24457                      const targetChanged = !this.targetLayout ||
24458                          !boxEqualsRounded(this.targetLayout, newLayout) ||
24459                          hasRelativeTargetChanged;
24460                      /**
24461                       * If the layout hasn't seemed to have changed, it might be that the
24462                       * element is visually in the same place in the document but its position
24463                       * relative to its parent has indeed changed. So here we check for that.
24464                       */
24465                      const hasOnlyRelativeTargetChanged = !hasLayoutChanged && hasRelativeTargetChanged;
24466                      if (this.options.layoutRoot ||
24467                          (this.resumeFrom && this.resumeFrom.instance) ||
24468                          hasOnlyRelativeTargetChanged ||
24469                          (hasLayoutChanged &&
24470                              (targetChanged || !this.currentAnimation))) {
24471                          if (this.resumeFrom) {
24472                              this.resumingFrom = this.resumeFrom;
24473                              this.resumingFrom.resumingFrom = undefined;
24474                          }
24475                          this.setAnimationOrigin(delta, hasOnlyRelativeTargetChanged);
24476                          const animationOptions = {
24477                              ...getValueTransition(layoutTransition, "layout"),
24478                              onPlay: onLayoutAnimationStart,
24479                              onComplete: onLayoutAnimationComplete,
24480                          };
24481                          if (visualElement.shouldReduceMotion ||
24482                              this.options.layoutRoot) {
24483                              animationOptions.delay = 0;
24484                              animationOptions.type = false;
24485                          }
24486                          this.startAnimation(animationOptions);
24487                      }
24488                      else {
24489                          /**
24490                           * If the layout hasn't changed and we have an animation that hasn't started yet,
24491                           * finish it immediately. Otherwise it will be animating from a location
24492                           * that was probably never commited to screen and look like a jumpy box.
24493                           */
24494                          if (!hasLayoutChanged) {
24495                              finishAnimation(this);
24496                          }
24497                          if (this.isLead() && this.options.onExitComplete) {
24498                              this.options.onExitComplete();
24499                          }
24500                      }
24501                      this.targetLayout = newLayout;
24502                  });
24503              }
24504          }
24505          unmount() {
24506              this.options.layoutId && this.willUpdate();
24507              this.root.nodes.remove(this);
24508              const stack = this.getStack();
24509              stack && stack.remove(this);
24510              this.parent && this.parent.children.delete(this);
24511              this.instance = undefined;
24512              cancelFrame(this.updateProjection);
24513          }
24514          // only on the root
24515          blockUpdate() {
24516              this.updateManuallyBlocked = true;
24517          }
24518          unblockUpdate() {
24519              this.updateManuallyBlocked = false;
24520          }
24521          isUpdateBlocked() {
24522              return this.updateManuallyBlocked || this.updateBlockedByResize;
24523          }
24524          isTreeAnimationBlocked() {
24525              return (this.isAnimationBlocked ||
24526                  (this.parent && this.parent.isTreeAnimationBlocked()) ||
24527                  false);
24528          }
24529          // Note: currently only running on root node
24530          startUpdate() {
24531              if (this.isUpdateBlocked())
24532                  return;
24533              this.isUpdating = true;
24534              /**
24535               * If we're running optimised appear animations then these must be
24536               * cancelled before measuring the DOM. This is so we can measure
24537               * the true layout of the element rather than the WAAPI animation
24538               * which will be unaffected by the resetSkewAndRotate step.
24539               */
24540              if (window.HandoffCancelAllAnimations) {
24541                  window.HandoffCancelAllAnimations();
24542              }
24543              this.nodes && this.nodes.forEach(resetSkewAndRotation);
24544              this.animationId++;
24545          }
24546          getTransformTemplate() {
24547              const { visualElement } = this.options;
24548              return visualElement && visualElement.getProps().transformTemplate;
24549          }
24550          willUpdate(shouldNotifyListeners = true) {
24551              this.root.hasTreeAnimated = true;
24552              if (this.root.isUpdateBlocked()) {
24553                  this.options.onExitComplete && this.options.onExitComplete();
24554                  return;
24555              }
24556              !this.root.isUpdating && this.root.startUpdate();
24557              if (this.isLayoutDirty)
24558                  return;
24559              this.isLayoutDirty = true;
24560              for (let i = 0; i < this.path.length; i++) {
24561                  const node = this.path[i];
24562                  node.shouldResetTransform = true;
24563                  node.updateScroll("snapshot");
24564                  if (node.options.layoutRoot) {
24565                      node.willUpdate(false);
24566                  }
24567              }
24568              const { layoutId, layout } = this.options;
24569              if (layoutId === undefined && !layout)
24570                  return;
24571              const transformTemplate = this.getTransformTemplate();
24572              this.prevTransformTemplateValue = transformTemplate
24573                  ? transformTemplate(this.latestValues, "")
24574                  : undefined;
24575              this.updateSnapshot();
24576              shouldNotifyListeners && this.notifyListeners("willUpdate");
24577          }
24578          update() {
24579              this.updateScheduled = false;
24580              const updateWasBlocked = this.isUpdateBlocked();
24581              // When doing an instant transition, we skip the layout update,
24582              // but should still clean up the measurements so that the next
24583              // snapshot could be taken correctly.
24584              if (updateWasBlocked) {
24585                  this.unblockUpdate();
24586                  this.clearAllSnapshots();
24587                  this.nodes.forEach(clearMeasurements);
24588                  return;
24589              }
24590              if (!this.isUpdating) {
24591                  this.nodes.forEach(clearIsLayoutDirty);
24592              }
24593              this.isUpdating = false;
24594              /**
24595               * Write
24596               */
24597              this.nodes.forEach(resetTransformStyle);
24598              /**
24599               * Read ==================
24600               */
24601              // Update layout measurements of updated children
24602              this.nodes.forEach(updateLayout);
24603              /**
24604               * Write
24605               */
24606              // Notify listeners that the layout is updated
24607              this.nodes.forEach(notifyLayoutUpdate);
24608              this.clearAllSnapshots();
24609              /**
24610               * Manually flush any pending updates. Ideally
24611               * we could leave this to the following requestAnimationFrame but this seems
24612               * to leave a flash of incorrectly styled content.
24613               */
24614              const now = time.now();
24615              frameData.delta = clamp_clamp(0, 1000 / 60, now - frameData.timestamp);
24616              frameData.timestamp = now;
24617              frameData.isProcessing = true;
24618              steps.update.process(frameData);
24619              steps.preRender.process(frameData);
24620              steps.render.process(frameData);
24621              frameData.isProcessing = false;
24622          }
24623          didUpdate() {
24624              if (!this.updateScheduled) {
24625                  this.updateScheduled = true;
24626                  microtask.read(() => this.update());
24627              }
24628          }
24629          clearAllSnapshots() {
24630              this.nodes.forEach(clearSnapshot);
24631              this.sharedNodes.forEach(removeLeadSnapshots);
24632          }
24633          scheduleUpdateProjection() {
24634              if (!this.projectionUpdateScheduled) {
24635                  this.projectionUpdateScheduled = true;
24636                  frame_frame.preRender(this.updateProjection, false, true);
24637              }
24638          }
24639          scheduleCheckAfterUnmount() {
24640              /**
24641               * If the unmounting node is in a layoutGroup and did trigger a willUpdate,
24642               * we manually call didUpdate to give a chance to the siblings to animate.
24643               * Otherwise, cleanup all snapshots to prevents future nodes from reusing them.
24644               */
24645              frame_frame.postRender(() => {
24646                  if (this.isLayoutDirty) {
24647                      this.root.didUpdate();
24648                  }
24649                  else {
24650                      this.root.checkUpdateFailed();
24651                  }
24652              });
24653          }
24654          /**
24655           * Update measurements
24656           */
24657          updateSnapshot() {
24658              if (this.snapshot || !this.instance)
24659                  return;
24660              this.snapshot = this.measure();
24661          }
24662          updateLayout() {
24663              if (!this.instance)
24664                  return;
24665              // TODO: Incorporate into a forwarded scroll offset
24666              this.updateScroll();
24667              if (!(this.options.alwaysMeasureLayout && this.isLead()) &&
24668                  !this.isLayoutDirty) {
24669                  return;
24670              }
24671              /**
24672               * When a node is mounted, it simply resumes from the prevLead's
24673               * snapshot instead of taking a new one, but the ancestors scroll
24674               * might have updated while the prevLead is unmounted. We need to
24675               * update the scroll again to make sure the layout we measure is
24676               * up to date.
24677               */
24678              if (this.resumeFrom && !this.resumeFrom.instance) {
24679                  for (let i = 0; i < this.path.length; i++) {
24680                      const node = this.path[i];
24681                      node.updateScroll();
24682                  }
24683              }
24684              const prevLayout = this.layout;
24685              this.layout = this.measure(false);
24686              this.layoutCorrected = createBox();
24687              this.isLayoutDirty = false;
24688              this.projectionDelta = undefined;
24689              this.notifyListeners("measure", this.layout.layoutBox);
24690              const { visualElement } = this.options;
24691              visualElement &&
24692                  visualElement.notify("LayoutMeasure", this.layout.layoutBox, prevLayout ? prevLayout.layoutBox : undefined);
24693          }
24694          updateScroll(phase = "measure") {
24695              let needsMeasurement = Boolean(this.options.layoutScroll && this.instance);
24696              if (this.scroll &&
24697                  this.scroll.animationId === this.root.animationId &&
24698                  this.scroll.phase === phase) {
24699                  needsMeasurement = false;
24700              }
24701              if (needsMeasurement) {
24702                  this.scroll = {
24703                      animationId: this.root.animationId,
24704                      phase,
24705                      isRoot: checkIsScrollRoot(this.instance),
24706                      offset: measureScroll(this.instance),
24707                  };
24708              }
24709          }
24710          resetTransform() {
24711              if (!resetTransform)
24712                  return;
24713              const isResetRequested = this.isLayoutDirty || this.shouldResetTransform;
24714              const hasProjection = this.projectionDelta && !isDeltaZero(this.projectionDelta);
24715              const transformTemplate = this.getTransformTemplate();
24716              const transformTemplateValue = transformTemplate
24717                  ? transformTemplate(this.latestValues, "")
24718                  : undefined;
24719              const transformTemplateHasChanged = transformTemplateValue !== this.prevTransformTemplateValue;
24720              if (isResetRequested &&
24721                  (hasProjection ||
24722                      hasTransform(this.latestValues) ||
24723                      transformTemplateHasChanged)) {
24724                  resetTransform(this.instance, transformTemplateValue);
24725                  this.shouldResetTransform = false;
24726                  this.scheduleRender();
24727              }
24728          }
24729          measure(removeTransform = true) {
24730              const pageBox = this.measurePageBox();
24731              let layoutBox = this.removeElementScroll(pageBox);
24732              /**
24733               * Measurements taken during the pre-render stage
24734               * still have transforms applied so we remove them
24735               * via calculation.
24736               */
24737              if (removeTransform) {
24738                  layoutBox = this.removeTransform(layoutBox);
24739              }
24740              roundBox(layoutBox);
24741              return {
24742                  animationId: this.root.animationId,
24743                  measuredBox: pageBox,
24744                  layoutBox,
24745                  latestValues: {},
24746                  source: this.id,
24747              };
24748          }
24749          measurePageBox() {
24750              const { visualElement } = this.options;
24751              if (!visualElement)
24752                  return createBox();
24753              const box = visualElement.measureViewportBox();
24754              // Remove viewport scroll to give page-relative coordinates
24755              const { scroll } = this.root;
24756              if (scroll) {
24757                  translateAxis(box.x, scroll.offset.x);
24758                  translateAxis(box.y, scroll.offset.y);
24759              }
24760              return box;
24761          }
24762          removeElementScroll(box) {
24763              const boxWithoutScroll = createBox();
24764              copyBoxInto(boxWithoutScroll, box);
24765              /**
24766               * Performance TODO: Keep a cumulative scroll offset down the tree
24767               * rather than loop back up the path.
24768               */
24769              for (let i = 0; i < this.path.length; i++) {
24770                  const node = this.path[i];
24771                  const { scroll, options } = node;
24772                  if (node !== this.root && scroll && options.layoutScroll) {
24773                      /**
24774                       * If this is a new scroll root, we want to remove all previous scrolls
24775                       * from the viewport box.
24776                       */
24777                      if (scroll.isRoot) {
24778                          copyBoxInto(boxWithoutScroll, box);
24779                          const { scroll: rootScroll } = this.root;
24780                          /**
24781                           * Undo the application of page scroll that was originally added
24782                           * to the measured bounding box.
24783                           */
24784                          if (rootScroll) {
24785                              translateAxis(boxWithoutScroll.x, -rootScroll.offset.x);
24786                              translateAxis(boxWithoutScroll.y, -rootScroll.offset.y);
24787                          }
24788                      }
24789                      translateAxis(boxWithoutScroll.x, scroll.offset.x);
24790                      translateAxis(boxWithoutScroll.y, scroll.offset.y);
24791                  }
24792              }
24793              return boxWithoutScroll;
24794          }
24795          applyTransform(box, transformOnly = false) {
24796              const withTransforms = createBox();
24797              copyBoxInto(withTransforms, box);
24798              for (let i = 0; i < this.path.length; i++) {
24799                  const node = this.path[i];
24800                  if (!transformOnly &&
24801                      node.options.layoutScroll &&
24802                      node.scroll &&
24803                      node !== node.root) {
24804                      transformBox(withTransforms, {
24805                          x: -node.scroll.offset.x,
24806                          y: -node.scroll.offset.y,
24807                      });
24808                  }
24809                  if (!hasTransform(node.latestValues))
24810                      continue;
24811                  transformBox(withTransforms, node.latestValues);
24812              }
24813              if (hasTransform(this.latestValues)) {
24814                  transformBox(withTransforms, this.latestValues);
24815              }
24816              return withTransforms;
24817          }
24818          removeTransform(box) {
24819              const boxWithoutTransform = createBox();
24820              copyBoxInto(boxWithoutTransform, box);
24821              for (let i = 0; i < this.path.length; i++) {
24822                  const node = this.path[i];
24823                  if (!node.instance)
24824                      continue;
24825                  if (!hasTransform(node.latestValues))
24826                      continue;
24827                  hasScale(node.latestValues) && node.updateSnapshot();
24828                  const sourceBox = createBox();
24829                  const nodeBox = node.measurePageBox();
24830                  copyBoxInto(sourceBox, nodeBox);
24831                  removeBoxTransforms(boxWithoutTransform, node.latestValues, node.snapshot ? node.snapshot.layoutBox : undefined, sourceBox);
24832              }
24833              if (hasTransform(this.latestValues)) {
24834                  removeBoxTransforms(boxWithoutTransform, this.latestValues);
24835              }
24836              return boxWithoutTransform;
24837          }
24838          setTargetDelta(delta) {
24839              this.targetDelta = delta;
24840              this.root.scheduleUpdateProjection();
24841              this.isProjectionDirty = true;
24842          }
24843          setOptions(options) {
24844              this.options = {
24845                  ...this.options,
24846                  ...options,
24847                  crossfade: options.crossfade !== undefined ? options.crossfade : true,
24848              };
24849          }
24850          clearMeasurements() {
24851              this.scroll = undefined;
24852              this.layout = undefined;
24853              this.snapshot = undefined;
24854              this.prevTransformTemplateValue = undefined;
24855              this.targetDelta = undefined;
24856              this.target = undefined;
24857              this.isLayoutDirty = false;
24858          }
24859          forceRelativeParentToResolveTarget() {
24860              if (!this.relativeParent)
24861                  return;
24862              /**
24863               * If the parent target isn't up-to-date, force it to update.
24864               * This is an unfortunate de-optimisation as it means any updating relative
24865               * projection will cause all the relative parents to recalculate back
24866               * up the tree.
24867               */
24868              if (this.relativeParent.resolvedRelativeTargetAt !==
24869                  frameData.timestamp) {
24870                  this.relativeParent.resolveTargetDelta(true);
24871              }
24872          }
24873          resolveTargetDelta(forceRecalculation = false) {
24874              var _a;
24875              /**
24876               * Once the dirty status of nodes has been spread through the tree, we also
24877               * need to check if we have a shared node of a different depth that has itself
24878               * been dirtied.
24879               */
24880              const lead = this.getLead();
24881              this.isProjectionDirty || (this.isProjectionDirty = lead.isProjectionDirty);
24882              this.isTransformDirty || (this.isTransformDirty = lead.isTransformDirty);
24883              this.isSharedProjectionDirty || (this.isSharedProjectionDirty = lead.isSharedProjectionDirty);
24884              const isShared = Boolean(this.resumingFrom) || this !== lead;
24885              /**
24886               * We don't use transform for this step of processing so we don't
24887               * need to check whether any nodes have changed transform.
24888               */
24889              const canSkip = !(forceRecalculation ||
24890                  (isShared && this.isSharedProjectionDirty) ||
24891                  this.isProjectionDirty ||
24892                  ((_a = this.parent) === null || _a === void 0 ? void 0 : _a.isProjectionDirty) ||
24893                  this.attemptToResolveRelativeTarget);
24894              if (canSkip)
24895                  return;
24896              const { layout, layoutId } = this.options;
24897              /**
24898               * If we have no layout, we can't perform projection, so early return
24899               */
24900              if (!this.layout || !(layout || layoutId))
24901                  return;
24902              this.resolvedRelativeTargetAt = frameData.timestamp;
24903              /**
24904               * If we don't have a targetDelta but do have a layout, we can attempt to resolve
24905               * a relativeParent. This will allow a component to perform scale correction
24906               * even if no animation has started.
24907               */
24908              if (!this.targetDelta && !this.relativeTarget) {
24909                  const relativeParent = this.getClosestProjectingParent();
24910                  if (relativeParent &&
24911                      relativeParent.layout &&
24912                      this.animationProgress !== 1) {
24913                      this.relativeParent = relativeParent;
24914                      this.forceRelativeParentToResolveTarget();
24915                      this.relativeTarget = createBox();
24916                      this.relativeTargetOrigin = createBox();
24917                      calcRelativePosition(this.relativeTargetOrigin, this.layout.layoutBox, relativeParent.layout.layoutBox);
24918                      copyBoxInto(this.relativeTarget, this.relativeTargetOrigin);
24919                  }
24920                  else {
24921                      this.relativeParent = this.relativeTarget = undefined;
24922                  }
24923              }
24924              /**
24925               * If we have no relative target or no target delta our target isn't valid
24926               * for this frame.
24927               */
24928              if (!this.relativeTarget && !this.targetDelta)
24929                  return;
24930              /**
24931               * Lazy-init target data structure
24932               */
24933              if (!this.target) {
24934                  this.target = createBox();
24935                  this.targetWithTransforms = createBox();
24936              }
24937              /**
24938               * If we've got a relative box for this component, resolve it into a target relative to the parent.
24939               */
24940              if (this.relativeTarget &&
24941                  this.relativeTargetOrigin &&
24942                  this.relativeParent &&
24943                  this.relativeParent.target) {
24944                  this.forceRelativeParentToResolveTarget();
24945                  calcRelativeBox(this.target, this.relativeTarget, this.relativeParent.target);
24946                  /**
24947                   * If we've only got a targetDelta, resolve it into a target
24948                   */
24949              }
24950              else if (this.targetDelta) {
24951                  if (Boolean(this.resumingFrom)) {
24952                      // TODO: This is creating a new object every frame
24953                      this.target = this.applyTransform(this.layout.layoutBox);
24954                  }
24955                  else {
24956                      copyBoxInto(this.target, this.layout.layoutBox);
24957                  }
24958                  applyBoxDelta(this.target, this.targetDelta);
24959              }
24960              else {
24961                  /**
24962                   * If no target, use own layout as target
24963                   */
24964                  copyBoxInto(this.target, this.layout.layoutBox);
24965              }
24966              /**
24967               * If we've been told to attempt to resolve a relative target, do so.
24968               */
24969              if (this.attemptToResolveRelativeTarget) {
24970                  this.attemptToResolveRelativeTarget = false;
24971                  const relativeParent = this.getClosestProjectingParent();
24972                  if (relativeParent &&
24973                      Boolean(relativeParent.resumingFrom) ===
24974                          Boolean(this.resumingFrom) &&
24975                      !relativeParent.options.layoutScroll &&
24976                      relativeParent.target &&
24977                      this.animationProgress !== 1) {
24978                      this.relativeParent = relativeParent;
24979                      this.forceRelativeParentToResolveTarget();
24980                      this.relativeTarget = createBox();
24981                      this.relativeTargetOrigin = createBox();
24982                      calcRelativePosition(this.relativeTargetOrigin, this.target, relativeParent.target);
24983                      copyBoxInto(this.relativeTarget, this.relativeTargetOrigin);
24984                  }
24985                  else {
24986                      this.relativeParent = this.relativeTarget = undefined;
24987                  }
24988              }
24989              /**
24990               * Increase debug counter for resolved target deltas
24991               */
24992              projectionFrameData.resolvedTargetDeltas++;
24993          }
24994          getClosestProjectingParent() {
24995              if (!this.parent ||
24996                  hasScale(this.parent.latestValues) ||
24997                  has2DTranslate(this.parent.latestValues)) {
24998                  return undefined;
24999              }
25000              if (this.parent.isProjecting()) {
25001                  return this.parent;
25002              }
25003              else {
25004                  return this.parent.getClosestProjectingParent();
25005              }
25006          }
25007          isProjecting() {
25008              return Boolean((this.relativeTarget ||
25009                  this.targetDelta ||
25010                  this.options.layoutRoot) &&
25011                  this.layout);
25012          }
25013          calcProjection() {
25014              var _a;
25015              const lead = this.getLead();
25016              const isShared = Boolean(this.resumingFrom) || this !== lead;
25017              let canSkip = true;
25018              /**
25019               * If this is a normal layout animation and neither this node nor its nearest projecting
25020               * is dirty then we can't skip.
25021               */
25022              if (this.isProjectionDirty || ((_a = this.parent) === null || _a === void 0 ? void 0 : _a.isProjectionDirty)) {
25023                  canSkip = false;
25024              }
25025              /**
25026               * If this is a shared layout animation and this node's shared projection is dirty then
25027               * we can't skip.
25028               */
25029              if (isShared &&
25030                  (this.isSharedProjectionDirty || this.isTransformDirty)) {
25031                  canSkip = false;
25032              }
25033              /**
25034               * If we have resolved the target this frame we must recalculate the
25035               * projection to ensure it visually represents the internal calculations.
25036               */
25037              if (this.resolvedRelativeTargetAt === frameData.timestamp) {
25038                  canSkip = false;
25039              }
25040              if (canSkip)
25041                  return;
25042              const { layout, layoutId } = this.options;
25043              /**
25044               * If this section of the tree isn't animating we can
25045               * delete our target sources for the following frame.
25046               */
25047              this.isTreeAnimating = Boolean((this.parent && this.parent.isTreeAnimating) ||
25048                  this.currentAnimation ||
25049                  this.pendingAnimation);
25050              if (!this.isTreeAnimating) {
25051                  this.targetDelta = this.relativeTarget = undefined;
25052              }
25053              if (!this.layout || !(layout || layoutId))
25054                  return;
25055              /**
25056               * Reset the corrected box with the latest values from box, as we're then going
25057               * to perform mutative operations on it.
25058               */
25059              copyBoxInto(this.layoutCorrected, this.layout.layoutBox);
25060              /**
25061               * Record previous tree scales before updating.
25062               */
25063              const prevTreeScaleX = this.treeScale.x;
25064              const prevTreeScaleY = this.treeScale.y;
25065              /**
25066               * Apply all the parent deltas to this box to produce the corrected box. This
25067               * is the layout box, as it will appear on screen as a result of the transforms of its parents.
25068               */
25069              applyTreeDeltas(this.layoutCorrected, this.treeScale, this.path, isShared);
25070              /**
25071               * If this layer needs to perform scale correction but doesn't have a target,
25072               * use the layout as the target.
25073               */
25074              if (lead.layout &&
25075                  !lead.target &&
25076                  (this.treeScale.x !== 1 || this.treeScale.y !== 1)) {
25077                  lead.target = lead.layout.layoutBox;
25078                  lead.targetWithTransforms = createBox();
25079              }
25080              const { target } = lead;
25081              if (!target) {
25082                  /**
25083                   * If we don't have a target to project into, but we were previously
25084                   * projecting, we want to remove the stored transform and schedule
25085                   * a render to ensure the elements reflect the removed transform.
25086                   */
25087                  if (this.projectionTransform) {
25088                      this.projectionDelta = createDelta();
25089                      this.projectionTransform = "none";
25090                      this.scheduleRender();
25091                  }
25092                  return;
25093              }
25094              if (!this.projectionDelta) {
25095                  this.projectionDelta = createDelta();
25096                  this.projectionDeltaWithTransform = createDelta();
25097              }
25098              const prevProjectionTransform = this.projectionTransform;
25099              /**
25100               * Update the delta between the corrected box and the target box before user-set transforms were applied.
25101               * This will allow us to calculate the corrected borderRadius and boxShadow to compensate
25102               * for our layout reprojection, but still allow them to be scaled correctly by the user.
25103               * It might be that to simplify this we may want to accept that user-set scale is also corrected
25104               * and we wouldn't have to keep and calc both deltas, OR we could support a user setting
25105               * to allow people to choose whether these styles are corrected based on just the
25106               * layout reprojection or the final bounding box.
25107               */
25108              calcBoxDelta(this.projectionDelta, this.layoutCorrected, target, this.latestValues);
25109              this.projectionTransform = buildProjectionTransform(this.projectionDelta, this.treeScale);
25110              if (this.projectionTransform !== prevProjectionTransform ||
25111                  this.treeScale.x !== prevTreeScaleX ||
25112                  this.treeScale.y !== prevTreeScaleY) {
25113                  this.hasProjected = true;
25114                  this.scheduleRender();
25115                  this.notifyListeners("projectionUpdate", target);
25116              }
25117              /**
25118               * Increase debug counter for recalculated projections
25119               */
25120              projectionFrameData.recalculatedProjection++;
25121          }
25122          hide() {
25123              this.isVisible = false;
25124              // TODO: Schedule render
25125          }
25126          show() {
25127              this.isVisible = true;
25128              // TODO: Schedule render
25129          }
25130          scheduleRender(notifyAll = true) {
25131              this.options.scheduleRender && this.options.scheduleRender();
25132              if (notifyAll) {
25133                  const stack = this.getStack();
25134                  stack && stack.scheduleRender();
25135              }
25136              if (this.resumingFrom && !this.resumingFrom.instance) {
25137                  this.resumingFrom = undefined;
25138              }
25139          }
25140          setAnimationOrigin(delta, hasOnlyRelativeTargetChanged = false) {
25141              const snapshot = this.snapshot;
25142              const snapshotLatestValues = snapshot
25143                  ? snapshot.latestValues
25144                  : {};
25145              const mixedValues = { ...this.latestValues };
25146              const targetDelta = createDelta();
25147              if (!this.relativeParent ||
25148                  !this.relativeParent.options.layoutRoot) {
25149                  this.relativeTarget = this.relativeTargetOrigin = undefined;
25150              }
25151              this.attemptToResolveRelativeTarget = !hasOnlyRelativeTargetChanged;
25152              const relativeLayout = createBox();
25153              const snapshotSource = snapshot ? snapshot.source : undefined;
25154              const layoutSource = this.layout ? this.layout.source : undefined;
25155              const isSharedLayoutAnimation = snapshotSource !== layoutSource;
25156              const stack = this.getStack();
25157              const isOnlyMember = !stack || stack.members.length <= 1;
25158              const shouldCrossfadeOpacity = Boolean(isSharedLayoutAnimation &&
25159                  !isOnlyMember &&
25160                  this.options.crossfade === true &&
25161                  !this.path.some(hasOpacityCrossfade));
25162              this.animationProgress = 0;
25163              let prevRelativeTarget;
25164              this.mixTargetDelta = (latest) => {
25165                  const progress = latest / 1000;
25166                  mixAxisDelta(targetDelta.x, delta.x, progress);
25167                  mixAxisDelta(targetDelta.y, delta.y, progress);
25168                  this.setTargetDelta(targetDelta);
25169                  if (this.relativeTarget &&
25170                      this.relativeTargetOrigin &&
25171                      this.layout &&
25172                      this.relativeParent &&
25173                      this.relativeParent.layout) {
25174                      calcRelativePosition(relativeLayout, this.layout.layoutBox, this.relativeParent.layout.layoutBox);
25175                      mixBox(this.relativeTarget, this.relativeTargetOrigin, relativeLayout, progress);
25176                      /**
25177                       * If this is an unchanged relative target we can consider the
25178                       * projection not dirty.
25179                       */
25180                      if (prevRelativeTarget &&
25181                          boxEquals(this.relativeTarget, prevRelativeTarget)) {
25182                          this.isProjectionDirty = false;
25183                      }
25184                      if (!prevRelativeTarget)
25185                          prevRelativeTarget = createBox();
25186                      copyBoxInto(prevRelativeTarget, this.relativeTarget);
25187                  }
25188                  if (isSharedLayoutAnimation) {
25189                      this.animationValues = mixedValues;
25190                      mixValues(mixedValues, snapshotLatestValues, this.latestValues, progress, shouldCrossfadeOpacity, isOnlyMember);
25191                  }
25192                  this.root.scheduleUpdateProjection();
25193                  this.scheduleRender();
25194                  this.animationProgress = progress;
25195              };
25196              this.mixTargetDelta(this.options.layoutRoot ? 1000 : 0);
25197          }
25198          startAnimation(options) {
25199              this.notifyListeners("animationStart");
25200              this.currentAnimation && this.currentAnimation.stop();
25201              if (this.resumingFrom && this.resumingFrom.currentAnimation) {
25202                  this.resumingFrom.currentAnimation.stop();
25203              }
25204              if (this.pendingAnimation) {
25205                  cancelFrame(this.pendingAnimation);
25206                  this.pendingAnimation = undefined;
25207              }
25208              /**
25209               * Start the animation in the next frame to have a frame with progress 0,
25210               * where the target is the same as when the animation started, so we can
25211               * calculate the relative positions correctly for instant transitions.
25212               */
25213              this.pendingAnimation = frame_frame.update(() => {
25214                  globalProjectionState.hasAnimatedSinceResize = true;
25215                  this.currentAnimation = animateSingleValue(0, animationTarget, {
25216                      ...options,
25217                      onUpdate: (latest) => {
25218                          this.mixTargetDelta(latest);
25219                          options.onUpdate && options.onUpdate(latest);
25220                      },
25221                      onComplete: () => {
25222                          options.onComplete && options.onComplete();
25223                          this.completeAnimation();
25224                      },
25225                  });
25226                  if (this.resumingFrom) {
25227                      this.resumingFrom.currentAnimation = this.currentAnimation;
25228                  }
25229                  this.pendingAnimation = undefined;
25230              });
25231          }
25232          completeAnimation() {
25233              if (this.resumingFrom) {
25234                  this.resumingFrom.currentAnimation = undefined;
25235                  this.resumingFrom.preserveOpacity = undefined;
25236              }
25237              const stack = this.getStack();
25238              stack && stack.exitAnimationComplete();
25239              this.resumingFrom =
25240                  this.currentAnimation =
25241                      this.animationValues =
25242                          undefined;
25243              this.notifyListeners("animationComplete");
25244          }
25245          finishAnimation() {
25246              if (this.currentAnimation) {
25247                  this.mixTargetDelta && this.mixTargetDelta(animationTarget);
25248                  this.currentAnimation.stop();
25249              }
25250              this.completeAnimation();
25251          }
25252          applyTransformsToTarget() {
25253              const lead = this.getLead();
25254              let { targetWithTransforms, target, layout, latestValues } = lead;
25255              if (!targetWithTransforms || !target || !layout)
25256                  return;
25257              /**
25258               * If we're only animating position, and this element isn't the lead element,
25259               * then instead of projecting into the lead box we instead want to calculate
25260               * a new target that aligns the two boxes but maintains the layout shape.
25261               */
25262              if (this !== lead &&
25263                  this.layout &&
25264                  layout &&
25265                  shouldAnimatePositionOnly(this.options.animationType, this.layout.layoutBox, layout.layoutBox)) {
25266                  target = this.target || createBox();
25267                  const xLength = calcLength(this.layout.layoutBox.x);
25268                  target.x.min = lead.target.x.min;
25269                  target.x.max = target.x.min + xLength;
25270                  const yLength = calcLength(this.layout.layoutBox.y);
25271                  target.y.min = lead.target.y.min;
25272                  target.y.max = target.y.min + yLength;
25273              }
25274              copyBoxInto(targetWithTransforms, target);
25275              /**
25276               * Apply the latest user-set transforms to the targetBox to produce the targetBoxFinal.
25277               * This is the final box that we will then project into by calculating a transform delta and
25278               * applying it to the corrected box.
25279               */
25280              transformBox(targetWithTransforms, latestValues);
25281              /**
25282               * Update the delta between the corrected box and the final target box, after
25283               * user-set transforms are applied to it. This will be used by the renderer to
25284               * create a transform style that will reproject the element from its layout layout
25285               * into the desired bounding box.
25286               */
25287              calcBoxDelta(this.projectionDeltaWithTransform, this.layoutCorrected, targetWithTransforms, latestValues);
25288          }
25289          registerSharedNode(layoutId, node) {
25290              if (!this.sharedNodes.has(layoutId)) {
25291                  this.sharedNodes.set(layoutId, new NodeStack());
25292              }
25293              const stack = this.sharedNodes.get(layoutId);
25294              stack.add(node);
25295              const config = node.options.initialPromotionConfig;
25296              node.promote({
25297                  transition: config ? config.transition : undefined,
25298                  preserveFollowOpacity: config && config.shouldPreserveFollowOpacity
25299                      ? config.shouldPreserveFollowOpacity(node)
25300                      : undefined,
25301              });
25302          }
25303          isLead() {
25304              const stack = this.getStack();
25305              return stack ? stack.lead === this : true;
25306          }
25307          getLead() {
25308              var _a;
25309              const { layoutId } = this.options;
25310              return layoutId ? ((_a = this.getStack()) === null || _a === void 0 ? void 0 : _a.lead) || this : this;
25311          }
25312          getPrevLead() {
25313              var _a;
25314              const { layoutId } = this.options;
25315              return layoutId ? (_a = this.getStack()) === null || _a === void 0 ? void 0 : _a.prevLead : undefined;
25316          }
25317          getStack() {
25318              const { layoutId } = this.options;
25319              if (layoutId)
25320                  return this.root.sharedNodes.get(layoutId);
25321          }
25322          promote({ needsReset, transition, preserveFollowOpacity, } = {}) {
25323              const stack = this.getStack();
25324              if (stack)
25325                  stack.promote(this, preserveFollowOpacity);
25326              if (needsReset) {
25327                  this.projectionDelta = undefined;
25328                  this.needsReset = true;
25329              }
25330              if (transition)
25331                  this.setOptions({ transition });
25332          }
25333          relegate() {
25334              const stack = this.getStack();
25335              if (stack) {
25336                  return stack.relegate(this);
25337              }
25338              else {
25339                  return false;
25340              }
25341          }
25342          resetSkewAndRotation() {
25343              const { visualElement } = this.options;
25344              if (!visualElement)
25345                  return;
25346              // If there's no detected skew or rotation values, we can early return without a forced render.
25347              let hasDistortingTransform = false;
25348              /**
25349               * An unrolled check for rotation values. Most elements don't have any rotation and
25350               * skipping the nested loop and new object creation is 50% faster.
25351               */
25352              const { latestValues } = visualElement;
25353              if (latestValues.z ||
25354                  latestValues.rotate ||
25355                  latestValues.rotateX ||
25356                  latestValues.rotateY ||
25357                  latestValues.rotateZ ||
25358                  latestValues.skewX ||
25359                  latestValues.skewY) {
25360                  hasDistortingTransform = true;
25361              }
25362              // If there's no distorting values, we don't need to do any more.
25363              if (!hasDistortingTransform)
25364                  return;
25365              const resetValues = {};
25366              if (latestValues.z) {
25367                  resetDistortingTransform("z", visualElement, resetValues, this.animationValues);
25368              }
25369              // Check the skew and rotate value of all axes and reset to 0
25370              for (let i = 0; i < transformAxes.length; i++) {
25371                  resetDistortingTransform(`rotate$transformAxes[i]}`, visualElement, resetValues, this.animationValues);
25372                  resetDistortingTransform(`skew$transformAxes[i]}`, visualElement, resetValues, this.animationValues);
25373              }
25374              // Force a render of this element to apply the transform with all skews and rotations
25375              // set to 0.
25376              visualElement.render();
25377              // Put back all the values we reset
25378              for (const key in resetValues) {
25379                  visualElement.setStaticValue(key, resetValues[key]);
25380                  if (this.animationValues) {
25381                      this.animationValues[key] = resetValues[key];
25382                  }
25383              }
25384              // Schedule a render for the next frame. This ensures we won't visually
25385              // see the element with the reset rotate value applied.
25386              visualElement.scheduleRender();
25387          }
25388          getProjectionStyles(styleProp) {
25389              var _a, _b;
25390              if (!this.instance || this.isSVG)
25391                  return undefined;
25392              if (!this.isVisible) {
25393                  return hiddenVisibility;
25394              }
25395              const styles = {
25396                  visibility: "",
25397              };
25398              const transformTemplate = this.getTransformTemplate();
25399              if (this.needsReset) {
25400                  this.needsReset = false;
25401                  styles.opacity = "";
25402                  styles.pointerEvents =
25403                      resolveMotionValue(styleProp === null || styleProp === void 0 ? void 0 : styleProp.pointerEvents) || "";
25404                  styles.transform = transformTemplate
25405                      ? transformTemplate(this.latestValues, "")
25406                      : "none";
25407                  return styles;
25408              }
25409              const lead = this.getLead();
25410              if (!this.projectionDelta || !this.layout || !lead.target) {
25411                  const emptyStyles = {};
25412                  if (this.options.layoutId) {
25413                      emptyStyles.opacity =
25414                          this.latestValues.opacity !== undefined
25415                              ? this.latestValues.opacity
25416                              : 1;
25417                      emptyStyles.pointerEvents =
25418                          resolveMotionValue(styleProp === null || styleProp === void 0 ? void 0 : styleProp.pointerEvents) || "";
25419                  }
25420                  if (this.hasProjected && !hasTransform(this.latestValues)) {
25421                      emptyStyles.transform = transformTemplate
25422                          ? transformTemplate({}, "")
25423                          : "none";
25424                      this.hasProjected = false;
25425                  }
25426                  return emptyStyles;
25427              }
25428              const valuesToRender = lead.animationValues || lead.latestValues;
25429              this.applyTransformsToTarget();
25430              styles.transform = buildProjectionTransform(this.projectionDeltaWithTransform, this.treeScale, valuesToRender);
25431              if (transformTemplate) {
25432                  styles.transform = transformTemplate(valuesToRender, styles.transform);
25433              }
25434              const { x, y } = this.projectionDelta;
25435              styles.transformOrigin = `$x.origin * 100}% $y.origin * 100}% 0`;
25436              if (lead.animationValues) {
25437                  /**
25438                   * If the lead component is animating, assign this either the entering/leaving
25439                   * opacity
25440                   */
25441                  styles.opacity =
25442                      lead === this
25443                          ? (_b = (_a = valuesToRender.opacity) !== null && _a !== void 0 ? _a : this.latestValues.opacity) !== null && _b !== void 0 ? _b : 1
25444                          : this.preserveOpacity
25445                              ? this.latestValues.opacity
25446                              : valuesToRender.opacityExit;
25447              }
25448              else {
25449                  /**
25450                   * Or we're not animating at all, set the lead component to its layout
25451                   * opacity and other components to hidden.
25452                   */
25453                  styles.opacity =
25454                      lead === this
25455                          ? valuesToRender.opacity !== undefined
25456                              ? valuesToRender.opacity
25457                              : ""
25458                          : valuesToRender.opacityExit !== undefined
25459                              ? valuesToRender.opacityExit
25460                              : 0;
25461              }
25462              /**
25463               * Apply scale correction
25464               */
25465              for (const key in scaleCorrectors) {
25466                  if (valuesToRender[key] === undefined)
25467                      continue;
25468                  const { correct, applyTo } = scaleCorrectors[key];
25469                  /**
25470                   * Only apply scale correction to the value if we have an
25471                   * active projection transform. Otherwise these values become
25472                   * vulnerable to distortion if the element changes size without
25473                   * a corresponding layout animation.
25474                   */
25475                  const corrected = styles.transform === "none"
25476                      ? valuesToRender[key]
25477                      : correct(valuesToRender[key], lead);
25478                  if (applyTo) {
25479                      const num = applyTo.length;
25480                      for (let i = 0; i < num; i++) {
25481                          styles[applyTo[i]] = corrected;
25482                      }
25483                  }
25484                  else {
25485                      styles[key] = corrected;
25486                  }
25487              }
25488              /**
25489               * Disable pointer events on follow components. This is to ensure
25490               * that if a follow component covers a lead component it doesn't block
25491               * pointer events on the lead.
25492               */
25493              if (this.options.layoutId) {
25494                  styles.pointerEvents =
25495                      lead === this
25496                          ? resolveMotionValue(styleProp === null || styleProp === void 0 ? void 0 : styleProp.pointerEvents) || ""
25497                          : "none";
25498              }
25499              return styles;
25500          }
25501          clearSnapshot() {
25502              this.resumeFrom = this.snapshot = undefined;
25503          }
25504          // Only run on root
25505          resetTree() {
25506              this.root.nodes.forEach((node) => { var _a; return (_a = node.currentAnimation) === null || _a === void 0 ? void 0 : _a.stop(); });
25507              this.root.nodes.forEach(clearMeasurements);
25508              this.root.sharedNodes.clear();
25509          }
25510      };
25511  }
25512  function updateLayout(node) {
25513      node.updateLayout();
25514  }
25515  function notifyLayoutUpdate(node) {
25516      var _a;
25517      const snapshot = ((_a = node.resumeFrom) === null || _a === void 0 ? void 0 : _a.snapshot) || node.snapshot;
25518      if (node.isLead() &&
25519          node.layout &&
25520          snapshot &&
25521          node.hasListeners("didUpdate")) {
25522          const { layoutBox: layout, measuredBox: measuredLayout } = node.layout;
25523          const { animationType } = node.options;
25524          const isShared = snapshot.source !== node.layout.source;
25525          // TODO Maybe we want to also resize the layout snapshot so we don't trigger
25526          // animations for instance if layout="size" and an element has only changed position
25527          if (animationType === "size") {
25528              eachAxis((axis) => {
25529                  const axisSnapshot = isShared
25530                      ? snapshot.measuredBox[axis]
25531                      : snapshot.layoutBox[axis];
25532                  const length = calcLength(axisSnapshot);
25533                  axisSnapshot.min = layout[axis].min;
25534                  axisSnapshot.max = axisSnapshot.min + length;
25535              });
25536          }
25537          else if (shouldAnimatePositionOnly(animationType, snapshot.layoutBox, layout)) {
25538              eachAxis((axis) => {
25539                  const axisSnapshot = isShared
25540                      ? snapshot.measuredBox[axis]
25541                      : snapshot.layoutBox[axis];
25542                  const length = calcLength(layout[axis]);
25543                  axisSnapshot.max = axisSnapshot.min + length;
25544                  /**
25545                   * Ensure relative target gets resized and rerendererd
25546                   */
25547                  if (node.relativeTarget && !node.currentAnimation) {
25548                      node.isProjectionDirty = true;
25549                      node.relativeTarget[axis].max =
25550                          node.relativeTarget[axis].min + length;
25551                  }
25552              });
25553          }
25554          const layoutDelta = createDelta();
25555          calcBoxDelta(layoutDelta, layout, snapshot.layoutBox);
25556          const visualDelta = createDelta();
25557          if (isShared) {
25558              calcBoxDelta(visualDelta, node.applyTransform(measuredLayout, true), snapshot.measuredBox);
25559          }
25560          else {
25561              calcBoxDelta(visualDelta, layout, snapshot.layoutBox);
25562          }
25563          const hasLayoutChanged = !isDeltaZero(layoutDelta);
25564          let hasRelativeTargetChanged = false;
25565          if (!node.resumeFrom) {
25566              const relativeParent = node.getClosestProjectingParent();
25567              /**
25568               * If the relativeParent is itself resuming from a different element then
25569               * the relative snapshot is not relavent
25570               */
25571              if (relativeParent && !relativeParent.resumeFrom) {
25572                  const { snapshot: parentSnapshot, layout: parentLayout } = relativeParent;
25573                  if (parentSnapshot && parentLayout) {
25574                      const relativeSnapshot = createBox();
25575                      calcRelativePosition(relativeSnapshot, snapshot.layoutBox, parentSnapshot.layoutBox);
25576                      const relativeLayout = createBox();
25577                      calcRelativePosition(relativeLayout, layout, parentLayout.layoutBox);
25578                      if (!boxEqualsRounded(relativeSnapshot, relativeLayout)) {
25579                          hasRelativeTargetChanged = true;
25580                      }
25581                      if (relativeParent.options.layoutRoot) {
25582                          node.relativeTarget = relativeLayout;
25583                          node.relativeTargetOrigin = relativeSnapshot;
25584                          node.relativeParent = relativeParent;
25585                      }
25586                  }
25587              }
25588          }
25589          node.notifyListeners("didUpdate", {
25590              layout,
25591              snapshot,
25592              delta: visualDelta,
25593              layoutDelta,
25594              hasLayoutChanged,
25595              hasRelativeTargetChanged,
25596          });
25597      }
25598      else if (node.isLead()) {
25599          const { onExitComplete } = node.options;
25600          onExitComplete && onExitComplete();
25601      }
25602      /**
25603       * Clearing transition
25604       * TODO: Investigate why this transition is being passed in as {type: false } from Framer
25605       * and why we need it at all
25606       */
25607      node.options.transition = undefined;
25608  }
25609  function propagateDirtyNodes(node) {
25610      /**
25611       * Increase debug counter for nodes encountered this frame
25612       */
25613      projectionFrameData.totalNodes++;
25614      if (!node.parent)
25615          return;
25616      /**
25617       * If this node isn't projecting, propagate isProjectionDirty. It will have
25618       * no performance impact but it will allow the next child that *is* projecting
25619       * but *isn't* dirty to just check its parent to see if *any* ancestor needs
25620       * correcting.
25621       */
25622      if (!node.isProjecting()) {
25623          node.isProjectionDirty = node.parent.isProjectionDirty;
25624      }
25625      /**
25626       * Propagate isSharedProjectionDirty and isTransformDirty
25627       * throughout the whole tree. A future revision can take another look at
25628       * this but for safety we still recalcualte shared nodes.
25629       */
25630      node.isSharedProjectionDirty || (node.isSharedProjectionDirty = Boolean(node.isProjectionDirty ||
25631          node.parent.isProjectionDirty ||
25632          node.parent.isSharedProjectionDirty));
25633      node.isTransformDirty || (node.isTransformDirty = node.parent.isTransformDirty);
25634  }
25635  function cleanDirtyNodes(node) {
25636      node.isProjectionDirty =
25637          node.isSharedProjectionDirty =
25638              node.isTransformDirty =
25639                  false;
25640  }
25641  function clearSnapshot(node) {
25642      node.clearSnapshot();
25643  }
25644  function clearMeasurements(node) {
25645      node.clearMeasurements();
25646  }
25647  function clearIsLayoutDirty(node) {
25648      node.isLayoutDirty = false;
25649  }
25650  function resetTransformStyle(node) {
25651      const { visualElement } = node.options;
25652      if (visualElement && visualElement.getProps().onBeforeLayoutMeasure) {
25653          visualElement.notify("BeforeLayoutMeasure");
25654      }
25655      node.resetTransform();
25656  }
25657  function finishAnimation(node) {
25658      node.finishAnimation();
25659      node.targetDelta = node.relativeTarget = node.target = undefined;
25660      node.isProjectionDirty = true;
25661  }
25662  function resolveTargetDelta(node) {
25663      node.resolveTargetDelta();
25664  }
25665  function calcProjection(node) {
25666      node.calcProjection();
25667  }
25668  function resetSkewAndRotation(node) {
25669      node.resetSkewAndRotation();
25670  }
25671  function removeLeadSnapshots(stack) {
25672      stack.removeLeadSnapshot();
25673  }
25674  function mixAxisDelta(output, delta, p) {
25675      output.translate = mixNumber(delta.translate, 0, p);
25676      output.scale = mixNumber(delta.scale, 1, p);
25677      output.origin = delta.origin;
25678      output.originPoint = delta.originPoint;
25679  }
25680  function mixAxis(output, from, to, p) {
25681      output.min = mixNumber(from.min, to.min, p);
25682      output.max = mixNumber(from.max, to.max, p);
25683  }
25684  function mixBox(output, from, to, p) {
25685      mixAxis(output.x, from.x, to.x, p);
25686      mixAxis(output.y, from.y, to.y, p);
25687  }
25688  function hasOpacityCrossfade(node) {
25689      return (node.animationValues && node.animationValues.opacityExit !== undefined);
25690  }
25691  const defaultLayoutTransition = {
25692      duration: 0.45,
25693      ease: [0.4, 0, 0.1, 1],
25694  };
25695  const userAgentContains = (string) => typeof navigator !== "undefined" &&
25696      navigator.userAgent &&
25697      navigator.userAgent.toLowerCase().includes(string);
25698  /**
25699   * Measured bounding boxes must be rounded in Safari and
25700   * left untouched in Chrome, otherwise non-integer layouts within scaled-up elements
25701   * can appear to jump.
25702   */
25703  const roundPoint = userAgentContains("applewebkit/") && !userAgentContains("chrome/")
25704      ? Math.round
25705      : noop_noop;
25706  function roundAxis(axis) {
25707      // Round to the nearest .5 pixels to support subpixel layouts
25708      axis.min = roundPoint(axis.min);
25709      axis.max = roundPoint(axis.max);
25710  }
25711  function roundBox(box) {
25712      roundAxis(box.x);
25713      roundAxis(box.y);
25714  }
25715  function shouldAnimatePositionOnly(animationType, snapshot, layout) {
25716      return (animationType === "position" ||
25717          (animationType === "preserve-aspect" &&
25718              !isNear(aspectRatio(snapshot), aspectRatio(layout), 0.2)));
25719  }
25720  
25721  
25722  
25723  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/projection/node/DocumentProjectionNode.mjs
25724  
25725  
25726  
25727  const DocumentProjectionNode = createProjectionNode({
25728      attachResizeListener: (ref, notify) => addDomEvent(ref, "resize", notify),
25729      measureScroll: () => ({
25730          x: document.documentElement.scrollLeft || document.body.scrollLeft,
25731          y: document.documentElement.scrollTop || document.body.scrollTop,
25732      }),
25733      checkIsScrollRoot: () => true,
25734  });
25735  
25736  
25737  
25738  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/projection/node/HTMLProjectionNode.mjs
25739  
25740  
25741  
25742  const rootProjectionNode = {
25743      current: undefined,
25744  };
25745  const HTMLProjectionNode = createProjectionNode({
25746      measureScroll: (instance) => ({
25747          x: instance.scrollLeft,
25748          y: instance.scrollTop,
25749      }),
25750      defaultParent: () => {
25751          if (!rootProjectionNode.current) {
25752              const documentNode = new DocumentProjectionNode({});
25753              documentNode.mount(window);
25754              documentNode.setOptions({ layoutScroll: true });
25755              rootProjectionNode.current = documentNode;
25756          }
25757          return rootProjectionNode.current;
25758      },
25759      resetTransform: (instance, value) => {
25760          instance.style.transform = value !== undefined ? value : "none";
25761      },
25762      checkIsScrollRoot: (instance) => Boolean(window.getComputedStyle(instance).position === "fixed"),
25763  });
25764  
25765  
25766  
25767  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/motion/features/drag.mjs
25768  
25769  
25770  
25771  
25772  
25773  const drag = {
25774      pan: {
25775          Feature: PanGesture,
25776      },
25777      drag: {
25778          Feature: DragGesture,
25779          ProjectionNode: HTMLProjectionNode,
25780          MeasureLayout: MeasureLayout,
25781      },
25782  };
25783  
25784  
25785  
25786  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/reduced-motion/state.mjs
25787  // Does this device prefer reduced motion? Returns `null` server-side.
25788  const prefersReducedMotion = { current: null };
25789  const hasReducedMotionListener = { current: false };
25790  
25791  
25792  
25793  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/reduced-motion/index.mjs
25794  
25795  
25796  
25797  function initPrefersReducedMotion() {
25798      hasReducedMotionListener.current = true;
25799      if (!is_browser_isBrowser)
25800          return;
25801      if (window.matchMedia) {
25802          const motionMediaQuery = window.matchMedia("(prefers-reduced-motion)");
25803          const setReducedMotionPreferences = () => (prefersReducedMotion.current = motionMediaQuery.matches);
25804          motionMediaQuery.addListener(setReducedMotionPreferences);
25805          setReducedMotionPreferences();
25806      }
25807      else {
25808          prefersReducedMotion.current = false;
25809      }
25810  }
25811  
25812  
25813  
25814  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/utils/motion-values.mjs
25815  
25816  
25817  
25818  
25819  
25820  function updateMotionValuesFromProps(element, next, prev) {
25821      const { willChange } = next;
25822      for (const key in next) {
25823          const nextValue = next[key];
25824          const prevValue = prev[key];
25825          if (isMotionValue(nextValue)) {
25826              /**
25827               * If this is a motion value found in props or style, we want to add it
25828               * to our visual element's motion value map.
25829               */
25830              element.addValue(key, nextValue);
25831              if (isWillChangeMotionValue(willChange)) {
25832                  willChange.add(key);
25833              }
25834              /**
25835               * Check the version of the incoming motion value with this version
25836               * and warn against mismatches.
25837               */
25838              if (false) {}
25839          }
25840          else if (isMotionValue(prevValue)) {
25841              /**
25842               * If we're swapping from a motion value to a static value,
25843               * create a new motion value from that
25844               */
25845              element.addValue(key, motionValue(nextValue, { owner: element }));
25846              if (isWillChangeMotionValue(willChange)) {
25847                  willChange.remove(key);
25848              }
25849          }
25850          else if (prevValue !== nextValue) {
25851              /**
25852               * If this is a flat value that has changed, update the motion value
25853               * or create one if it doesn't exist. We only want to do this if we're
25854               * not handling the value with our animation state.
25855               */
25856              if (element.hasValue(key)) {
25857                  const existingValue = element.getValue(key);
25858                  if (existingValue.liveStyle === true) {
25859                      existingValue.jump(nextValue);
25860                  }
25861                  else if (!existingValue.hasAnimated) {
25862                      existingValue.set(nextValue);
25863                  }
25864              }
25865              else {
25866                  const latestValue = element.getStaticValue(key);
25867                  element.addValue(key, motionValue(latestValue !== undefined ? latestValue : nextValue, { owner: element }));
25868              }
25869          }
25870      }
25871      // Handle removed values
25872      for (const key in prev) {
25873          if (next[key] === undefined)
25874              element.removeValue(key);
25875      }
25876      return next;
25877  }
25878  
25879  
25880  
25881  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/store.mjs
25882  const visualElementStore = new WeakMap();
25883  
25884  
25885  
25886  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/dom/value-types/find.mjs
25887  
25888  
25889  
25890  
25891  
25892  /**
25893   * A list of all ValueTypes
25894   */
25895  const valueTypes = [...dimensionValueTypes, color, complex];
25896  /**
25897   * Tests a value against the list of ValueTypes
25898   */
25899  const findValueType = (v) => valueTypes.find(testValueType(v));
25900  
25901  
25902  
25903  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/VisualElement.mjs
25904  
25905  
25906  
25907  
25908  
25909  
25910  
25911  
25912  
25913  
25914  
25915  
25916  
25917  
25918  
25919  
25920  
25921  
25922  
25923  
25924  
25925  
25926  
25927  
25928  
25929  
25930  const featureNames = Object.keys(featureDefinitions);
25931  const numFeatures = featureNames.length;
25932  const propEventHandlers = [
25933      "AnimationStart",
25934      "AnimationComplete",
25935      "Update",
25936      "BeforeLayoutMeasure",
25937      "LayoutMeasure",
25938      "LayoutAnimationStart",
25939      "LayoutAnimationComplete",
25940  ];
25941  const numVariantProps = variantProps.length;
25942  function getClosestProjectingNode(visualElement) {
25943      if (!visualElement)
25944          return undefined;
25945      return visualElement.options.allowProjection !== false
25946          ? visualElement.projection
25947          : getClosestProjectingNode(visualElement.parent);
25948  }
25949  /**
25950   * A VisualElement is an imperative abstraction around UI elements such as
25951   * HTMLElement, SVGElement, Three.Object3D etc.
25952   */
25953  class VisualElement {
25954      /**
25955       * This method takes React props and returns found MotionValues. For example, HTML
25956       * MotionValues will be found within the style prop, whereas for Three.js within attribute arrays.
25957       *
25958       * This isn't an abstract method as it needs calling in the constructor, but it is
25959       * intended to be one.
25960       */
25961      scrapeMotionValuesFromProps(_props, _prevProps, _visualElement) {
25962          return {};
25963      }
25964      constructor({ parent, props, presenceContext, reducedMotionConfig, blockInitialAnimation, visualState, }, options = {}) {
25965          this.resolveKeyframes = (keyframes, 
25966          // We use an onComplete callback here rather than a Promise as a Promise
25967          // resolution is a microtask and we want to retain the ability to force
25968          // the resolution of keyframes synchronously.
25969          onComplete, name, value) => {
25970              return new this.KeyframeResolver(keyframes, onComplete, name, value, this);
25971          };
25972          /**
25973           * A reference to the current underlying Instance, e.g. a HTMLElement
25974           * or Three.Mesh etc.
25975           */
25976          this.current = null;
25977          /**
25978           * A set containing references to this VisualElement's children.
25979           */
25980          this.children = new Set();
25981          /**
25982           * Determine what role this visual element should take in the variant tree.
25983           */
25984          this.isVariantNode = false;
25985          this.isControllingVariants = false;
25986          /**
25987           * Decides whether this VisualElement should animate in reduced motion
25988           * mode.
25989           *
25990           * TODO: This is currently set on every individual VisualElement but feels
25991           * like it could be set globally.
25992           */
25993          this.shouldReduceMotion = null;
25994          /**
25995           * A map of all motion values attached to this visual element. Motion
25996           * values are source of truth for any given animated value. A motion
25997           * value might be provided externally by the component via props.
25998           */
25999          this.values = new Map();
26000          this.KeyframeResolver = KeyframeResolver;
26001          /**
26002           * Cleanup functions for active features (hover/tap/exit etc)
26003           */
26004          this.features = {};
26005          /**
26006           * A map of every subscription that binds the provided or generated
26007           * motion values onChange listeners to this visual element.
26008           */
26009          this.valueSubscriptions = new Map();
26010          /**
26011           * A reference to the previously-provided motion values as returned
26012           * from scrapeMotionValuesFromProps. We use the keys in here to determine
26013           * if any motion values need to be removed after props are updated.
26014           */
26015          this.prevMotionValues = {};
26016          /**
26017           * An object containing a SubscriptionManager for each active event.
26018           */
26019          this.events = {};
26020          /**
26021           * An object containing an unsubscribe function for each prop event subscription.
26022           * For example, every "Update" event can have multiple subscribers via
26023           * VisualElement.on(), but only one of those can be defined via the onUpdate prop.
26024           */
26025          this.propEventSubscriptions = {};
26026          this.notifyUpdate = () => this.notify("Update", this.latestValues);
26027          this.render = () => {
26028              if (!this.current)
26029                  return;
26030              this.triggerBuild();
26031              this.renderInstance(this.current, this.renderState, this.props.style, this.projection);
26032          };
26033          this.scheduleRender = () => frame_frame.render(this.render, false, true);
26034          const { latestValues, renderState } = visualState;
26035          this.latestValues = latestValues;
26036          this.baseTarget = { ...latestValues };
26037          this.initialValues = props.initial ? { ...latestValues } : {};
26038          this.renderState = renderState;
26039          this.parent = parent;
26040          this.props = props;
26041          this.presenceContext = presenceContext;
26042          this.depth = parent ? parent.depth + 1 : 0;
26043          this.reducedMotionConfig = reducedMotionConfig;
26044          this.options = options;
26045          this.blockInitialAnimation = Boolean(blockInitialAnimation);
26046          this.isControllingVariants = isControllingVariants(props);
26047          this.isVariantNode = isVariantNode(props);
26048          if (this.isVariantNode) {
26049              this.variantChildren = new Set();
26050          }
26051          this.manuallyAnimateOnMount = Boolean(parent && parent.current);
26052          /**
26053           * Any motion values that are provided to the element when created
26054           * aren't yet bound to the element, as this would technically be impure.
26055           * However, we iterate through the motion values and set them to the
26056           * initial values for this component.
26057           *
26058           * TODO: This is impure and we should look at changing this to run on mount.
26059           * Doing so will break some tests but this isn't neccessarily a breaking change,
26060           * more a reflection of the test.
26061           */
26062          const { willChange, ...initialMotionValues } = this.scrapeMotionValuesFromProps(props, {}, this);
26063          for (const key in initialMotionValues) {
26064              const value = initialMotionValues[key];
26065              if (latestValues[key] !== undefined && isMotionValue(value)) {
26066                  value.set(latestValues[key], false);
26067                  if (isWillChangeMotionValue(willChange)) {
26068                      willChange.add(key);
26069                  }
26070              }
26071          }
26072      }
26073      mount(instance) {
26074          this.current = instance;
26075          visualElementStore.set(instance, this);
26076          if (this.projection && !this.projection.instance) {
26077              this.projection.mount(instance);
26078          }
26079          if (this.parent && this.isVariantNode && !this.isControllingVariants) {
26080              this.removeFromVariantTree = this.parent.addVariantChild(this);
26081          }
26082          this.values.forEach((value, key) => this.bindToMotionValue(key, value));
26083          if (!hasReducedMotionListener.current) {
26084              initPrefersReducedMotion();
26085          }
26086          this.shouldReduceMotion =
26087              this.reducedMotionConfig === "never"
26088                  ? false
26089                  : this.reducedMotionConfig === "always"
26090                      ? true
26091                      : prefersReducedMotion.current;
26092          if (false) {}
26093          if (this.parent)
26094              this.parent.children.add(this);
26095          this.update(this.props, this.presenceContext);
26096      }
26097      unmount() {
26098          var _a;
26099          visualElementStore.delete(this.current);
26100          this.projection && this.projection.unmount();
26101          cancelFrame(this.notifyUpdate);
26102          cancelFrame(this.render);
26103          this.valueSubscriptions.forEach((remove) => remove());
26104          this.removeFromVariantTree && this.removeFromVariantTree();
26105          this.parent && this.parent.children.delete(this);
26106          for (const key in this.events) {
26107              this.events[key].clear();
26108          }
26109          for (const key in this.features) {
26110              (_a = this.features[key]) === null || _a === void 0 ? void 0 : _a.unmount();
26111          }
26112          this.current = null;
26113      }
26114      bindToMotionValue(key, value) {
26115          const valueIsTransform = transformProps.has(key);
26116          const removeOnChange = value.on("change", (latestValue) => {
26117              this.latestValues[key] = latestValue;
26118              this.props.onUpdate && frame_frame.preRender(this.notifyUpdate);
26119              if (valueIsTransform && this.projection) {
26120                  this.projection.isTransformDirty = true;
26121              }
26122          });
26123          const removeOnRenderRequest = value.on("renderRequest", this.scheduleRender);
26124          this.valueSubscriptions.set(key, () => {
26125              removeOnChange();
26126              removeOnRenderRequest();
26127              if (value.owner)
26128                  value.stop();
26129          });
26130      }
26131      sortNodePosition(other) {
26132          /**
26133           * If these nodes aren't even of the same type we can't compare their depth.
26134           */
26135          if (!this.current ||
26136              !this.sortInstanceNodePosition ||
26137              this.type !== other.type) {
26138              return 0;
26139          }
26140          return this.sortInstanceNodePosition(this.current, other.current);
26141      }
26142      loadFeatures({ children, ...renderedProps }, isStrict, preloadedFeatures, initialLayoutGroupConfig) {
26143          let ProjectionNodeConstructor;
26144          let MeasureLayout;
26145          /**
26146           * If we're in development mode, check to make sure we're not rendering a motion component
26147           * as a child of LazyMotion, as this will break the file-size benefits of using it.
26148           */
26149          if (false) {}
26150          for (let i = 0; i < numFeatures; i++) {
26151              const name = featureNames[i];
26152              const { isEnabled, Feature: FeatureConstructor, ProjectionNode, MeasureLayout: MeasureLayoutComponent, } = featureDefinitions[name];
26153              if (ProjectionNode)
26154                  ProjectionNodeConstructor = ProjectionNode;
26155              if (isEnabled(renderedProps)) {
26156                  if (!this.features[name] && FeatureConstructor) {
26157                      this.features[name] = new FeatureConstructor(this);
26158                  }
26159                  if (MeasureLayoutComponent) {
26160                      MeasureLayout = MeasureLayoutComponent;
26161                  }
26162              }
26163          }
26164          if ((this.type === "html" || this.type === "svg") &&
26165              !this.projection &&
26166              ProjectionNodeConstructor) {
26167              const { layoutId, layout, drag, dragConstraints, layoutScroll, layoutRoot, } = renderedProps;
26168              this.projection = new ProjectionNodeConstructor(this.latestValues, renderedProps["data-framer-portal-id"]
26169                  ? undefined
26170                  : getClosestProjectingNode(this.parent));
26171              this.projection.setOptions({
26172                  layoutId,
26173                  layout,
26174                  alwaysMeasureLayout: Boolean(drag) ||
26175                      (dragConstraints && isRefObject(dragConstraints)),
26176                  visualElement: this,
26177                  scheduleRender: () => this.scheduleRender(),
26178                  /**
26179                   * TODO: Update options in an effect. This could be tricky as it'll be too late
26180                   * to update by the time layout animations run.
26181                   * We also need to fix this safeToRemove by linking it up to the one returned by usePresence,
26182                   * ensuring it gets called if there's no potential layout animations.
26183                   *
26184                   */
26185                  animationType: typeof layout === "string" ? layout : "both",
26186                  initialPromotionConfig: initialLayoutGroupConfig,
26187                  layoutScroll,
26188                  layoutRoot,
26189              });
26190          }
26191          return MeasureLayout;
26192      }
26193      updateFeatures() {
26194          for (const key in this.features) {
26195              const feature = this.features[key];
26196              if (feature.isMounted) {
26197                  feature.update();
26198              }
26199              else {
26200                  feature.mount();
26201                  feature.isMounted = true;
26202              }
26203          }
26204      }
26205      triggerBuild() {
26206          this.build(this.renderState, this.latestValues, this.options, this.props);
26207      }
26208      /**
26209       * Measure the current viewport box with or without transforms.
26210       * Only measures axis-aligned boxes, rotate and skew must be manually
26211       * removed with a re-render to work.
26212       */
26213      measureViewportBox() {
26214          return this.current
26215              ? this.measureInstanceViewportBox(this.current, this.props)
26216              : createBox();
26217      }
26218      getStaticValue(key) {
26219          return this.latestValues[key];
26220      }
26221      setStaticValue(key, value) {
26222          this.latestValues[key] = value;
26223      }
26224      /**
26225       * Update the provided props. Ensure any newly-added motion values are
26226       * added to our map, old ones removed, and listeners updated.
26227       */
26228      update(props, presenceContext) {
26229          if (props.transformTemplate || this.props.transformTemplate) {
26230              this.scheduleRender();
26231          }
26232          this.prevProps = this.props;
26233          this.props = props;
26234          this.prevPresenceContext = this.presenceContext;
26235          this.presenceContext = presenceContext;
26236          /**
26237           * Update prop event handlers ie onAnimationStart, onAnimationComplete
26238           */
26239          for (let i = 0; i < propEventHandlers.length; i++) {
26240              const key = propEventHandlers[i];
26241              if (this.propEventSubscriptions[key]) {
26242                  this.propEventSubscriptions[key]();
26243                  delete this.propEventSubscriptions[key];
26244              }
26245              const listenerName = ("on" + key);
26246              const listener = props[listenerName];
26247              if (listener) {
26248                  this.propEventSubscriptions[key] = this.on(key, listener);
26249              }
26250          }
26251          this.prevMotionValues = updateMotionValuesFromProps(this, this.scrapeMotionValuesFromProps(props, this.prevProps, this), this.prevMotionValues);
26252          if (this.handleChildMotionValue) {
26253              this.handleChildMotionValue();
26254          }
26255      }
26256      getProps() {
26257          return this.props;
26258      }
26259      /**
26260       * Returns the variant definition with a given name.
26261       */
26262      getVariant(name) {
26263          return this.props.variants ? this.props.variants[name] : undefined;
26264      }
26265      /**
26266       * Returns the defined default transition on this component.
26267       */
26268      getDefaultTransition() {
26269          return this.props.transition;
26270      }
26271      getTransformPagePoint() {
26272          return this.props.transformPagePoint;
26273      }
26274      getClosestVariantNode() {
26275          return this.isVariantNode
26276              ? this
26277              : this.parent
26278                  ? this.parent.getClosestVariantNode()
26279                  : undefined;
26280      }
26281      getVariantContext(startAtParent = false) {
26282          if (startAtParent) {
26283              return this.parent ? this.parent.getVariantContext() : undefined;
26284          }
26285          if (!this.isControllingVariants) {
26286              const context = this.parent
26287                  ? this.parent.getVariantContext() || {}
26288                  : {};
26289              if (this.props.initial !== undefined) {
26290                  context.initial = this.props.initial;
26291              }
26292              return context;
26293          }
26294          const context = {};
26295          for (let i = 0; i < numVariantProps; i++) {
26296              const name = variantProps[i];
26297              const prop = this.props[name];
26298              if (isVariantLabel(prop) || prop === false) {
26299                  context[name] = prop;
26300              }
26301          }
26302          return context;
26303      }
26304      /**
26305       * Add a child visual element to our set of children.
26306       */
26307      addVariantChild(child) {
26308          const closestVariantNode = this.getClosestVariantNode();
26309          if (closestVariantNode) {
26310              closestVariantNode.variantChildren &&
26311                  closestVariantNode.variantChildren.add(child);
26312              return () => closestVariantNode.variantChildren.delete(child);
26313          }
26314      }
26315      /**
26316       * Add a motion value and bind it to this visual element.
26317       */
26318      addValue(key, value) {
26319          // Remove existing value if it exists
26320          const existingValue = this.values.get(key);
26321          if (value !== existingValue) {
26322              if (existingValue)
26323                  this.removeValue(key);
26324              this.bindToMotionValue(key, value);
26325              this.values.set(key, value);
26326              this.latestValues[key] = value.get();
26327          }
26328      }
26329      /**
26330       * Remove a motion value and unbind any active subscriptions.
26331       */
26332      removeValue(key) {
26333          this.values.delete(key);
26334          const unsubscribe = this.valueSubscriptions.get(key);
26335          if (unsubscribe) {
26336              unsubscribe();
26337              this.valueSubscriptions.delete(key);
26338          }
26339          delete this.latestValues[key];
26340          this.removeValueFromRenderState(key, this.renderState);
26341      }
26342      /**
26343       * Check whether we have a motion value for this key
26344       */
26345      hasValue(key) {
26346          return this.values.has(key);
26347      }
26348      getValue(key, defaultValue) {
26349          if (this.props.values && this.props.values[key]) {
26350              return this.props.values[key];
26351          }
26352          let value = this.values.get(key);
26353          if (value === undefined && defaultValue !== undefined) {
26354              value = motionValue(defaultValue === null ? undefined : defaultValue, { owner: this });
26355              this.addValue(key, value);
26356          }
26357          return value;
26358      }
26359      /**
26360       * If we're trying to animate to a previously unencountered value,
26361       * we need to check for it in our state and as a last resort read it
26362       * directly from the instance (which might have performance implications).
26363       */
26364      readValue(key, target) {
26365          var _a;
26366          let value = this.latestValues[key] !== undefined || !this.current
26367              ? this.latestValues[key]
26368              : (_a = this.getBaseTargetFromProps(this.props, key)) !== null && _a !== void 0 ? _a : this.readValueFromInstance(this.current, key, this.options);
26369          if (value !== undefined && value !== null) {
26370              if (typeof value === "string" &&
26371                  (isNumericalString(value) || isZeroValueString(value))) {
26372                  // If this is a number read as a string, ie "0" or "200", convert it to a number
26373                  value = parseFloat(value);
26374              }
26375              else if (!findValueType(value) && complex.test(target)) {
26376                  value = animatable_none_getAnimatableNone(key, target);
26377              }
26378              this.setBaseTarget(key, isMotionValue(value) ? value.get() : value);
26379          }
26380          return isMotionValue(value) ? value.get() : value;
26381      }
26382      /**
26383       * Set the base target to later animate back to. This is currently
26384       * only hydrated on creation and when we first read a value.
26385       */
26386      setBaseTarget(key, value) {
26387          this.baseTarget[key] = value;
26388      }
26389      /**
26390       * Find the base target for a value thats been removed from all animation
26391       * props.
26392       */
26393      getBaseTarget(key) {
26394          var _a;
26395          const { initial } = this.props;
26396          let valueFromInitial;
26397          if (typeof initial === "string" || typeof initial === "object") {
26398              const variant = resolveVariantFromProps(this.props, initial, (_a = this.presenceContext) === null || _a === void 0 ? void 0 : _a.custom);
26399              if (variant) {
26400                  valueFromInitial = variant[key];
26401              }
26402          }
26403          /**
26404           * If this value still exists in the current initial variant, read that.
26405           */
26406          if (initial && valueFromInitial !== undefined) {
26407              return valueFromInitial;
26408          }
26409          /**
26410           * Alternatively, if this VisualElement config has defined a getBaseTarget
26411           * so we can read the value from an alternative source, try that.
26412           */
26413          const target = this.getBaseTargetFromProps(this.props, key);
26414          if (target !== undefined && !isMotionValue(target))
26415              return target;
26416          /**
26417           * If the value was initially defined on initial, but it doesn't any more,
26418           * return undefined. Otherwise return the value as initially read from the DOM.
26419           */
26420          return this.initialValues[key] !== undefined &&
26421              valueFromInitial === undefined
26422              ? undefined
26423              : this.baseTarget[key];
26424      }
26425      on(eventName, callback) {
26426          if (!this.events[eventName]) {
26427              this.events[eventName] = new SubscriptionManager();
26428          }
26429          return this.events[eventName].add(callback);
26430      }
26431      notify(eventName, ...args) {
26432          if (this.events[eventName]) {
26433              this.events[eventName].notify(...args);
26434          }
26435      }
26436  }
26437  
26438  
26439  
26440  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/dom/DOMVisualElement.mjs
26441  
26442  
26443  
26444  class DOMVisualElement extends VisualElement {
26445      constructor() {
26446          super(...arguments);
26447          this.KeyframeResolver = DOMKeyframesResolver;
26448      }
26449      sortInstanceNodePosition(a, b) {
26450          /**
26451           * compareDocumentPosition returns a bitmask, by using the bitwise &
26452           * we're returning true if 2 in that bitmask is set to true. 2 is set
26453           * to true if b preceeds a.
26454           */
26455          return a.compareDocumentPosition(b) & 2 ? 1 : -1;
26456      }
26457      getBaseTargetFromProps(props, key) {
26458          return props.style
26459              ? props.style[key]
26460              : undefined;
26461      }
26462      removeValueFromRenderState(key, { vars, style }) {
26463          delete vars[key];
26464          delete style[key];
26465      }
26466  }
26467  
26468  
26469  
26470  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/html/HTMLVisualElement.mjs
26471  
26472  
26473  
26474  
26475  
26476  
26477  
26478  
26479  
26480  
26481  function HTMLVisualElement_getComputedStyle(element) {
26482      return window.getComputedStyle(element);
26483  }
26484  class HTMLVisualElement extends DOMVisualElement {
26485      constructor() {
26486          super(...arguments);
26487          this.type = "html";
26488      }
26489      readValueFromInstance(instance, key) {
26490          if (transformProps.has(key)) {
26491              const defaultType = getDefaultValueType(key);
26492              return defaultType ? defaultType.default || 0 : 0;
26493          }
26494          else {
26495              const computedStyle = HTMLVisualElement_getComputedStyle(instance);
26496              const value = (isCSSVariableName(key)
26497                  ? computedStyle.getPropertyValue(key)
26498                  : computedStyle[key]) || 0;
26499              return typeof value === "string" ? value.trim() : value;
26500          }
26501      }
26502      measureInstanceViewportBox(instance, { transformPagePoint }) {
26503          return measureViewportBox(instance, transformPagePoint);
26504      }
26505      build(renderState, latestValues, options, props) {
26506          buildHTMLStyles(renderState, latestValues, options, props.transformTemplate);
26507      }
26508      scrapeMotionValuesFromProps(props, prevProps, visualElement) {
26509          return scrapeMotionValuesFromProps(props, prevProps, visualElement);
26510      }
26511      handleChildMotionValue() {
26512          if (this.childSubscription) {
26513              this.childSubscription();
26514              delete this.childSubscription;
26515          }
26516          const { children } = this.props;
26517          if (isMotionValue(children)) {
26518              this.childSubscription = children.on("change", (latest) => {
26519                  if (this.current)
26520                      this.current.textContent = `$latest}`;
26521              });
26522          }
26523      }
26524      renderInstance(instance, renderState, styleProp, projection) {
26525          renderHTML(instance, renderState, styleProp, projection);
26526      }
26527  }
26528  
26529  
26530  
26531  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/svg/SVGVisualElement.mjs
26532  
26533  
26534  
26535  
26536  
26537  
26538  
26539  
26540  
26541  
26542  
26543  class SVGVisualElement extends DOMVisualElement {
26544      constructor() {
26545          super(...arguments);
26546          this.type = "svg";
26547          this.isSVGTag = false;
26548      }
26549      getBaseTargetFromProps(props, key) {
26550          return props[key];
26551      }
26552      readValueFromInstance(instance, key) {
26553          if (transformProps.has(key)) {
26554              const defaultType = getDefaultValueType(key);
26555              return defaultType ? defaultType.default || 0 : 0;
26556          }
26557          key = !camelCaseAttributes.has(key) ? camelToDash(key) : key;
26558          return instance.getAttribute(key);
26559      }
26560      measureInstanceViewportBox() {
26561          return createBox();
26562      }
26563      scrapeMotionValuesFromProps(props, prevProps, visualElement) {
26564          return scrape_motion_values_scrapeMotionValuesFromProps(props, prevProps, visualElement);
26565      }
26566      build(renderState, latestValues, options, props) {
26567          buildSVGAttrs(renderState, latestValues, options, this.isSVGTag, props.transformTemplate);
26568      }
26569      renderInstance(instance, renderState, styleProp, projection) {
26570          renderSVG(instance, renderState, styleProp, projection);
26571      }
26572      mount(instance) {
26573          this.isSVGTag = isSVGTag(instance.tagName);
26574          super.mount(instance);
26575      }
26576  }
26577  
26578  
26579  
26580  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/dom/create-visual-element.mjs
26581  
26582  
26583  
26584  
26585  
26586  const create_visual_element_createDomVisualElement = (Component, options) => {
26587      return isSVGComponent(Component)
26588          ? new SVGVisualElement(options, { enableHardwareAcceleration: false })
26589          : new HTMLVisualElement(options, {
26590              allowProjection: Component !== external_React_.Fragment,
26591              enableHardwareAcceleration: true,
26592          });
26593  };
26594  
26595  
26596  
26597  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/motion/features/layout.mjs
26598  
26599  
26600  
26601  const layout = {
26602      layout: {
26603          ProjectionNode: HTMLProjectionNode,
26604          MeasureLayout: MeasureLayout,
26605      },
26606  };
26607  
26608  
26609  
26610  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/dom/motion.mjs
26611  
26612  
26613  
26614  
26615  
26616  
26617  
26618  
26619  
26620  const preloadedFeatures = {
26621      ...animations,
26622      ...gestureAnimations,
26623      ...drag,
26624      ...layout,
26625  };
26626  /**
26627   * HTML & SVG components, optimised for use with gestures and animation. These can be used as
26628   * drop-in replacements for any HTML & SVG component, all CSS & SVG properties are supported.
26629   *
26630   * @public
26631   */
26632  const motion = /*@__PURE__*/ createMotionProxy((Component, config) => create_config_createDomMotionConfig(Component, config, preloadedFeatures, create_visual_element_createDomVisualElement));
26633  /**
26634   * Create a DOM `motion` component with the provided string. This is primarily intended
26635   * as a full alternative to `motion` for consumers who have to support environments that don't
26636   * support `Proxy`.
26637   *
26638   * ```javascript
26639   * import { createDomMotionComponent } from "framer-motion"
26640   *
26641   * const motion = {
26642   *   div: createDomMotionComponent('div')
26643   * }
26644   * ```
26645   *
26646   * @public
26647   */
26648  function createDomMotionComponent(key) {
26649      return createMotionComponent(createDomMotionConfig(key, { forwardMotionProps: false }, preloadedFeatures, createDomVisualElement));
26650  }
26651  
26652  
26653  
26654  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/use-is-mounted.mjs
26655  
26656  
26657  
26658  function useIsMounted() {
26659      const isMounted = (0,external_React_.useRef)(false);
26660      useIsomorphicLayoutEffect(() => {
26661          isMounted.current = true;
26662          return () => {
26663              isMounted.current = false;
26664          };
26665      }, []);
26666      return isMounted;
26667  }
26668  
26669  
26670  
26671  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/use-force-update.mjs
26672  
26673  
26674  
26675  
26676  function use_force_update_useForceUpdate() {
26677      const isMounted = useIsMounted();
26678      const [forcedRenderCount, setForcedRenderCount] = (0,external_React_.useState)(0);
26679      const forceRender = (0,external_React_.useCallback)(() => {
26680          isMounted.current && setForcedRenderCount(forcedRenderCount + 1);
26681      }, [forcedRenderCount]);
26682      /**
26683       * Defer this to the end of the next animation frame in case there are multiple
26684       * synchronous calls.
26685       */
26686      const deferredForceRender = (0,external_React_.useCallback)(() => frame_frame.postRender(forceRender), [forceRender]);
26687      return [deferredForceRender, forcedRenderCount];
26688  }
26689  
26690  
26691  
26692  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/components/AnimatePresence/PopChild.mjs
26693  
26694  
26695  
26696  
26697  
26698  /**
26699   * Measurement functionality has to be within a separate component
26700   * to leverage snapshot lifecycle.
26701   */
26702  class PopChildMeasure extends external_React_.Component {
26703      getSnapshotBeforeUpdate(prevProps) {
26704          const element = this.props.childRef.current;
26705          if (element && prevProps.isPresent && !this.props.isPresent) {
26706              const size = this.props.sizeRef.current;
26707              size.height = element.offsetHeight || 0;
26708              size.width = element.offsetWidth || 0;
26709              size.top = element.offsetTop;
26710              size.left = element.offsetLeft;
26711          }
26712          return null;
26713      }
26714      /**
26715       * Required with getSnapshotBeforeUpdate to stop React complaining.
26716       */
26717      componentDidUpdate() { }
26718      render() {
26719          return this.props.children;
26720      }
26721  }
26722  function PopChild({ children, isPresent }) {
26723      const id = (0,external_React_.useId)();
26724      const ref = (0,external_React_.useRef)(null);
26725      const size = (0,external_React_.useRef)({
26726          width: 0,
26727          height: 0,
26728          top: 0,
26729          left: 0,
26730      });
26731      const { nonce } = (0,external_React_.useContext)(MotionConfigContext);
26732      /**
26733       * We create and inject a style block so we can apply this explicit
26734       * sizing in a non-destructive manner by just deleting the style block.
26735       *
26736       * We can't apply size via render as the measurement happens
26737       * in getSnapshotBeforeUpdate (post-render), likewise if we apply the
26738       * styles directly on the DOM node, we might be overwriting
26739       * styles set via the style prop.
26740       */
26741      (0,external_React_.useInsertionEffect)(() => {
26742          const { width, height, top, left } = size.current;
26743          if (isPresent || !ref.current || !width || !height)
26744              return;
26745          ref.current.dataset.motionPopId = id;
26746          const style = document.createElement("style");
26747          if (nonce)
26748              style.nonce = nonce;
26749          document.head.appendChild(style);
26750          if (style.sheet) {
26751              style.sheet.insertRule(`
26752            [data-motion-pop-id="$id}"] {
26753              position: absolute !important;
26754              width: $width}px !important;
26755              height: $height}px !important;
26756              top: $top}px !important;
26757              left: $left}px !important;
26758            }
26759          `);
26760          }
26761          return () => {
26762              document.head.removeChild(style);
26763          };
26764      }, [isPresent]);
26765      return ((0,external_ReactJSXRuntime_namespaceObject.jsx)(PopChildMeasure, { isPresent: isPresent, childRef: ref, sizeRef: size, children: external_React_.cloneElement(children, { ref }) }));
26766  }
26767  
26768  
26769  
26770  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/components/AnimatePresence/PresenceChild.mjs
26771  
26772  
26773  
26774  
26775  
26776  
26777  
26778  const PresenceChild = ({ children, initial, isPresent, onExitComplete, custom, presenceAffectsLayout, mode, }) => {
26779      const presenceChildren = useConstant(newChildrenMap);
26780      const id = (0,external_React_.useId)();
26781      const context = (0,external_React_.useMemo)(() => ({
26782          id,
26783          initial,
26784          isPresent,
26785          custom,
26786          onExitComplete: (childId) => {
26787              presenceChildren.set(childId, true);
26788              for (const isComplete of presenceChildren.values()) {
26789                  if (!isComplete)
26790                      return; // can stop searching when any is incomplete
26791              }
26792              onExitComplete && onExitComplete();
26793          },
26794          register: (childId) => {
26795              presenceChildren.set(childId, false);
26796              return () => presenceChildren.delete(childId);
26797          },
26798      }), 
26799      /**
26800       * If the presence of a child affects the layout of the components around it,
26801       * we want to make a new context value to ensure they get re-rendered
26802       * so they can detect that layout change.
26803       */
26804      presenceAffectsLayout ? [Math.random()] : [isPresent]);
26805      (0,external_React_.useMemo)(() => {
26806          presenceChildren.forEach((_, key) => presenceChildren.set(key, false));
26807      }, [isPresent]);
26808      /**
26809       * If there's no `motion` components to fire exit animations, we want to remove this
26810       * component immediately.
26811       */
26812      external_React_.useEffect(() => {
26813          !isPresent &&
26814              !presenceChildren.size &&
26815              onExitComplete &&
26816              onExitComplete();
26817      }, [isPresent]);
26818      if (mode === "popLayout") {
26819          children = (0,external_ReactJSXRuntime_namespaceObject.jsx)(PopChild, { isPresent: isPresent, children: children });
26820      }
26821      return ((0,external_ReactJSXRuntime_namespaceObject.jsx)(PresenceContext_PresenceContext.Provider, { value: context, children: children }));
26822  };
26823  function newChildrenMap() {
26824      return new Map();
26825  }
26826  
26827  
26828  
26829  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/use-unmount-effect.mjs
26830  
26831  
26832  function useUnmountEffect(callback) {
26833      return (0,external_React_.useEffect)(() => () => callback(), []);
26834  }
26835  
26836  
26837  
26838  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/components/AnimatePresence/index.mjs
26839  
26840  
26841  
26842  
26843  
26844  
26845  
26846  
26847  
26848  
26849  const getChildKey = (child) => child.key || "";
26850  function updateChildLookup(children, allChildren) {
26851      children.forEach((child) => {
26852          const key = getChildKey(child);
26853          allChildren.set(key, child);
26854      });
26855  }
26856  function onlyElements(children) {
26857      const filtered = [];
26858      // We use forEach here instead of map as map mutates the component key by preprending `.$`
26859      external_React_.Children.forEach(children, (child) => {
26860          if ((0,external_React_.isValidElement)(child))
26861              filtered.push(child);
26862      });
26863      return filtered;
26864  }
26865  /**
26866   * `AnimatePresence` enables the animation of components that have been removed from the tree.
26867   *
26868   * When adding/removing more than a single child, every child **must** be given a unique `key` prop.
26869   *
26870   * Any `motion` components that have an `exit` property defined will animate out when removed from
26871   * the tree.
26872   *
26873   * ```jsx
26874   * import { motion, AnimatePresence } from 'framer-motion'
26875   *
26876   * export const Items = ({ items }) => (
26877   *   <AnimatePresence>
26878   *     {items.map(item => (
26879   *       <motion.div
26880   *         key={item.id}
26881   *         initial={{ opacity: 0 }}
26882   *         animate={{ opacity: 1 }}
26883   *         exit={{ opacity: 0 }}
26884   *       />
26885   *     ))}
26886   *   </AnimatePresence>
26887   * )
26888   * ```
26889   *
26890   * You can sequence exit animations throughout a tree using variants.
26891   *
26892   * If a child contains multiple `motion` components with `exit` props, it will only unmount the child
26893   * once all `motion` components have finished animating out. Likewise, any components using
26894   * `usePresence` all need to call `safeToRemove`.
26895   *
26896   * @public
26897   */
26898  const AnimatePresence = ({ children, custom, initial = true, onExitComplete, exitBeforeEnter, presenceAffectsLayout = true, mode = "sync", }) => {
26899      errors_invariant(!exitBeforeEnter, "Replace exitBeforeEnter with mode='wait'");
26900      // We want to force a re-render once all exiting animations have finished. We
26901      // either use a local forceRender function, or one from a parent context if it exists.
26902      const forceRender = (0,external_React_.useContext)(LayoutGroupContext).forceRender || use_force_update_useForceUpdate()[0];
26903      const isMounted = useIsMounted();
26904      // Filter out any children that aren't ReactElements. We can only track ReactElements with a props.key
26905      const filteredChildren = onlyElements(children);
26906      let childrenToRender = filteredChildren;
26907      const exitingChildren = (0,external_React_.useRef)(new Map()).current;
26908      // Keep a living record of the children we're actually rendering so we
26909      // can diff to figure out which are entering and exiting
26910      const presentChildren = (0,external_React_.useRef)(childrenToRender);
26911      // A lookup table to quickly reference components by key
26912      const allChildren = (0,external_React_.useRef)(new Map()).current;
26913      // If this is the initial component render, just deal with logic surrounding whether
26914      // we play onMount animations or not.
26915      const isInitialRender = (0,external_React_.useRef)(true);
26916      useIsomorphicLayoutEffect(() => {
26917          isInitialRender.current = false;
26918          updateChildLookup(filteredChildren, allChildren);
26919          presentChildren.current = childrenToRender;
26920      });
26921      useUnmountEffect(() => {
26922          isInitialRender.current = true;
26923          allChildren.clear();
26924          exitingChildren.clear();
26925      });
26926      if (isInitialRender.current) {
26927          return ((0,external_ReactJSXRuntime_namespaceObject.jsx)(external_ReactJSXRuntime_namespaceObject.Fragment, { children: childrenToRender.map((child) => ((0,external_ReactJSXRuntime_namespaceObject.jsx)(PresenceChild, { isPresent: true, initial: initial ? undefined : false, presenceAffectsLayout: presenceAffectsLayout, mode: mode, children: child }, getChildKey(child)))) }));
26928      }
26929      // If this is a subsequent render, deal with entering and exiting children
26930      childrenToRender = [...childrenToRender];
26931      // Diff the keys of the currently-present and target children to update our
26932      // exiting list.
26933      const presentKeys = presentChildren.current.map(getChildKey);
26934      const targetKeys = filteredChildren.map(getChildKey);
26935      // Diff the present children with our target children and mark those that are exiting
26936      const numPresent = presentKeys.length;
26937      for (let i = 0; i < numPresent; i++) {
26938          const key = presentKeys[i];
26939          if (targetKeys.indexOf(key) === -1 && !exitingChildren.has(key)) {
26940              exitingChildren.set(key, undefined);
26941          }
26942      }
26943      // If we currently have exiting children, and we're deferring rendering incoming children
26944      // until after all current children have exiting, empty the childrenToRender array
26945      if (mode === "wait" && exitingChildren.size) {
26946          childrenToRender = [];
26947      }
26948      // Loop through all currently exiting components and clone them to overwrite `animate`
26949      // with any `exit` prop they might have defined.
26950      exitingChildren.forEach((component, key) => {
26951          // If this component is actually entering again, early return
26952          if (targetKeys.indexOf(key) !== -1)
26953              return;
26954          const child = allChildren.get(key);
26955          if (!child)
26956              return;
26957          const insertionIndex = presentKeys.indexOf(key);
26958          let exitingComponent = component;
26959          if (!exitingComponent) {
26960              const onExit = () => {
26961                  // clean up the exiting children map
26962                  exitingChildren.delete(key);
26963                  // compute the keys of children that were rendered once but are no longer present
26964                  // this could happen in case of too many fast consequent renderings
26965                  // @link https://github.com/framer/motion/issues/2023
26966                  const leftOverKeys = Array.from(allChildren.keys()).filter((childKey) => !targetKeys.includes(childKey));
26967                  // clean up the all children map
26968                  leftOverKeys.forEach((leftOverKey) => allChildren.delete(leftOverKey));
26969                  // make sure to render only the children that are actually visible
26970                  presentChildren.current = filteredChildren.filter((presentChild) => {
26971                      const presentChildKey = getChildKey(presentChild);
26972                      return (
26973                      // filter out the node exiting
26974                      presentChildKey === key ||
26975                          // filter out the leftover children
26976                          leftOverKeys.includes(presentChildKey));
26977                  });
26978                  // Defer re-rendering until all exiting children have indeed left
26979                  if (!exitingChildren.size) {
26980                      if (isMounted.current === false)
26981                          return;
26982                      forceRender();
26983                      onExitComplete && onExitComplete();
26984                  }
26985              };
26986              exitingComponent = ((0,external_ReactJSXRuntime_namespaceObject.jsx)(PresenceChild, { isPresent: false, onExitComplete: onExit, custom: custom, presenceAffectsLayout: presenceAffectsLayout, mode: mode, children: child }, getChildKey(child)));
26987              exitingChildren.set(key, exitingComponent);
26988          }
26989          childrenToRender.splice(insertionIndex, 0, exitingComponent);
26990      });
26991      // Add `MotionContext` even to children that don't need it to ensure we're rendering
26992      // the same tree between renders
26993      childrenToRender = childrenToRender.map((child) => {
26994          const key = child.key;
26995          return exitingChildren.has(key) ? (child) : ((0,external_ReactJSXRuntime_namespaceObject.jsx)(PresenceChild, { isPresent: true, presenceAffectsLayout: presenceAffectsLayout, mode: mode, children: child }, getChildKey(child)));
26996      });
26997      if (false) {}
26998      return ((0,external_ReactJSXRuntime_namespaceObject.jsx)(external_ReactJSXRuntime_namespaceObject.Fragment, { children: exitingChildren.size
26999              ? childrenToRender
27000              : childrenToRender.map((child) => (0,external_React_.cloneElement)(child)) }));
27001  };
27002  
27003  
27004  
27005  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/utils/use-responsive-value.js
27006  /**
27007   * WordPress dependencies
27008   */
27009  
27010  const breakpoints = ['40em', '52em', '64em'];
27011  const useBreakpointIndex = (options = {}) => {
27012    const {
27013      defaultIndex = 0
27014    } = options;
27015    if (typeof defaultIndex !== 'number') {
27016      throw new TypeError(`Default breakpoint index should be a number. Got: $defaultIndex}, $typeof defaultIndex}`);
27017    } else if (defaultIndex < 0 || defaultIndex > breakpoints.length - 1) {
27018      throw new RangeError(`Default breakpoint index out of range. Theme has $breakpoints.length} breakpoints, got index $defaultIndex}`);
27019    }
27020    const [value, setValue] = (0,external_wp_element_namespaceObject.useState)(defaultIndex);
27021    (0,external_wp_element_namespaceObject.useEffect)(() => {
27022      const getIndex = () => breakpoints.filter(bp => {
27023        return typeof window !== 'undefined' ? window.matchMedia(`screen and (min-width: $bp})`).matches : false;
27024      }).length;
27025      const onResize = () => {
27026        const newValue = getIndex();
27027        if (value !== newValue) {
27028          setValue(newValue);
27029        }
27030      };
27031      onResize();
27032      if (typeof window !== 'undefined') {
27033        window.addEventListener('resize', onResize);
27034      }
27035      return () => {
27036        if (typeof window !== 'undefined') {
27037          window.removeEventListener('resize', onResize);
27038        }
27039      };
27040    }, [value]);
27041    return value;
27042  };
27043  function useResponsiveValue(values, options = {}) {
27044    const index = useBreakpointIndex(options);
27045  
27046    // Allow calling the function with a "normal" value without having to check on the outside.
27047    if (!Array.isArray(values) && typeof values !== 'function') {
27048      return values;
27049    }
27050    const array = values || [];
27051  
27052    /* eslint-disable jsdoc/no-undefined-types */
27053    return /** @type {T[]} */array[/* eslint-enable jsdoc/no-undefined-types */
27054    index >= array.length ? array.length - 1 : index];
27055  }
27056  
27057  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/flex/styles.js
27058  function styles_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)."; }
27059  /**
27060   * External dependencies
27061   */
27062  
27063  const Flex =  true ? {
27064    name: "zjik7",
27065    styles: "display:flex"
27066  } : 0;
27067  const Item =  true ? {
27068    name: "qgaee5",
27069    styles: "display:block;max-height:100%;max-width:100%;min-height:0;min-width:0"
27070  } : 0;
27071  const block =  true ? {
27072    name: "82a6rk",
27073    styles: "flex:1"
27074  } : 0;
27075  
27076  /**
27077   * Workaround to optimize DOM rendering.
27078   * We'll enhance alignment with naive parent flex assumptions.
27079   *
27080   * Trade-off:
27081   * Far less DOM less. However, UI rendering is not as reliable.
27082   */
27083  
27084  /**
27085   * Improves stability of width/height rendering.
27086   * https://github.com/ItsJonQ/g2/pull/149
27087   */
27088  const ItemsColumn =  true ? {
27089    name: "13nosa1",
27090    styles: ">*{min-height:0;}"
27091  } : 0;
27092  const ItemsRow =  true ? {
27093    name: "1pwxzk4",
27094    styles: ">*{min-width:0;}"
27095  } : 0;
27096  
27097  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/flex/flex/hook.js
27098  /**
27099   * External dependencies
27100   */
27101  
27102  
27103  /**
27104   * WordPress dependencies
27105   */
27106  
27107  
27108  
27109  /**
27110   * Internal dependencies
27111   */
27112  
27113  
27114  
27115  
27116  
27117  
27118  function useDeprecatedProps(props) {
27119    const {
27120      isReversed,
27121      ...otherProps
27122    } = props;
27123    if (typeof isReversed !== 'undefined') {
27124      external_wp_deprecated_default()('Flex isReversed', {
27125        alternative: 'Flex direction="row-reverse" or "column-reverse"',
27126        since: '5.9'
27127      });
27128      return {
27129        ...otherProps,
27130        direction: isReversed ? 'row-reverse' : 'row'
27131      };
27132    }
27133    return otherProps;
27134  }
27135  function useFlex(props) {
27136    const {
27137      align,
27138      className,
27139      direction: directionProp = 'row',
27140      expanded = true,
27141      gap = 2,
27142      justify = 'space-between',
27143      wrap = false,
27144      ...otherProps
27145    } = useContextSystem(useDeprecatedProps(props), 'Flex');
27146    const directionAsArray = Array.isArray(directionProp) ? directionProp : [directionProp];
27147    const direction = useResponsiveValue(directionAsArray);
27148    const isColumn = typeof direction === 'string' && !!direction.includes('column');
27149    const cx = useCx();
27150    const classes = (0,external_wp_element_namespaceObject.useMemo)(() => {
27151      const base = /*#__PURE__*/emotion_react_browser_esm_css({
27152        alignItems: align !== null && align !== void 0 ? align : isColumn ? 'normal' : 'center',
27153        flexDirection: direction,
27154        flexWrap: wrap ? 'wrap' : undefined,
27155        gap: space(gap),
27156        justifyContent: justify,
27157        height: isColumn && expanded ? '100%' : undefined,
27158        width: !isColumn && expanded ? '100%' : undefined
27159      },  true ? "" : 0,  true ? "" : 0);
27160      return cx(Flex, base, isColumn ? ItemsColumn : ItemsRow, className);
27161    }, [align, className, cx, direction, expanded, gap, isColumn, justify, wrap]);
27162    return {
27163      ...otherProps,
27164      className: classes,
27165      isColumn
27166    };
27167  }
27168  
27169  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/flex/context.js
27170  /**
27171   * WordPress dependencies
27172   */
27173  
27174  const FlexContext = (0,external_wp_element_namespaceObject.createContext)({
27175    flexItemDisplay: undefined
27176  });
27177  const useFlexContext = () => (0,external_wp_element_namespaceObject.useContext)(FlexContext);
27178  
27179  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/flex/flex/component.js
27180  /**
27181   * External dependencies
27182   */
27183  
27184  /**
27185   * Internal dependencies
27186   */
27187  
27188  
27189  
27190  
27191  
27192  
27193  function UnconnectedFlex(props, forwardedRef) {
27194    const {
27195      children,
27196      isColumn,
27197      ...otherProps
27198    } = useFlex(props);
27199    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(FlexContext.Provider, {
27200      value: {
27201        flexItemDisplay: isColumn ? 'block' : undefined
27202      },
27203      children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(component, {
27204        ...otherProps,
27205        ref: forwardedRef,
27206        children: children
27207      })
27208    });
27209  }
27210  
27211  /**
27212   * `Flex` is a primitive layout component that adaptively aligns child content
27213   * horizontally or vertically. `Flex` powers components like `HStack` and
27214   * `VStack`.
27215   *
27216   * `Flex` is used with any of its two sub-components, `FlexItem` and
27217   * `FlexBlock`.
27218   *
27219   * ```jsx
27220   * import { Flex, FlexBlock, FlexItem } from '@wordpress/components';
27221   *
27222   * function Example() {
27223   *   return (
27224   *     <Flex>
27225   *       <FlexItem>
27226   *         <p>Code</p>
27227   *       </FlexItem>
27228   *       <FlexBlock>
27229   *         <p>Poetry</p>
27230   *       </FlexBlock>
27231   *     </Flex>
27232   *   );
27233   * }
27234   * ```
27235   */
27236  const component_Flex = contextConnect(UnconnectedFlex, 'Flex');
27237  /* harmony default export */ const flex_component = (component_Flex);
27238  
27239  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/flex/flex-item/hook.js
27240  /**
27241   * External dependencies
27242   */
27243  
27244  
27245  
27246  /**
27247   * Internal dependencies
27248   */
27249  
27250  
27251  
27252  
27253  
27254  function useFlexItem(props) {
27255    const {
27256      className,
27257      display: displayProp,
27258      isBlock = false,
27259      ...otherProps
27260    } = useContextSystem(props, 'FlexItem');
27261    const sx = {};
27262    const contextDisplay = useFlexContext().flexItemDisplay;
27263    sx.Base = /*#__PURE__*/emotion_react_browser_esm_css({
27264      display: displayProp || contextDisplay
27265    },  true ? "" : 0,  true ? "" : 0);
27266    const cx = useCx();
27267    const classes = cx(Item, sx.Base, isBlock && block, className);
27268    return {
27269      ...otherProps,
27270      className: classes
27271    };
27272  }
27273  
27274  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/flex/flex-block/hook.js
27275  /**
27276   * Internal dependencies
27277   */
27278  
27279  
27280  
27281  function useFlexBlock(props) {
27282    const otherProps = useContextSystem(props, 'FlexBlock');
27283    const flexItemProps = useFlexItem({
27284      isBlock: true,
27285      ...otherProps
27286    });
27287    return flexItemProps;
27288  }
27289  
27290  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/flex/flex-block/component.js
27291  /**
27292   * External dependencies
27293   */
27294  
27295  /**
27296   * Internal dependencies
27297   */
27298  
27299  
27300  
27301  
27302  
27303  function UnconnectedFlexBlock(props, forwardedRef) {
27304    const flexBlockProps = useFlexBlock(props);
27305    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(component, {
27306      ...flexBlockProps,
27307      ref: forwardedRef
27308    });
27309  }
27310  
27311  /**
27312   * `FlexBlock` is a primitive layout component that adaptively resizes content
27313   * within layout containers like `Flex`.
27314   *
27315   * ```jsx
27316   * import { Flex, FlexBlock } from '@wordpress/components';
27317   *
27318   * function Example() {
27319   *   return (
27320   *     <Flex>
27321   *       <FlexBlock>...</FlexBlock>
27322   *     </Flex>
27323   *   );
27324   * }
27325   * ```
27326   */
27327  const FlexBlock = contextConnect(UnconnectedFlexBlock, 'FlexBlock');
27328  /* harmony default export */ const flex_block_component = (FlexBlock);
27329  
27330  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/utils/rtl.js
27331  /**
27332   * External dependencies
27333   */
27334  
27335  
27336  /**
27337   * WordPress dependencies
27338   */
27339  
27340  const LOWER_LEFT_REGEXP = new RegExp(/-left/g);
27341  const LOWER_RIGHT_REGEXP = new RegExp(/-right/g);
27342  const UPPER_LEFT_REGEXP = new RegExp(/Left/g);
27343  const UPPER_RIGHT_REGEXP = new RegExp(/Right/g);
27344  
27345  /**
27346   * Flips a CSS property from left <-> right.
27347   *
27348   * @param {string} key The CSS property name.
27349   *
27350   * @return {string} The flipped CSS property name, if applicable.
27351   */
27352  function getConvertedKey(key) {
27353    if (key === 'left') {
27354      return 'right';
27355    }
27356    if (key === 'right') {
27357      return 'left';
27358    }
27359    if (LOWER_LEFT_REGEXP.test(key)) {
27360      return key.replace(LOWER_LEFT_REGEXP, '-right');
27361    }
27362    if (LOWER_RIGHT_REGEXP.test(key)) {
27363      return key.replace(LOWER_RIGHT_REGEXP, '-left');
27364    }
27365    if (UPPER_LEFT_REGEXP.test(key)) {
27366      return key.replace(UPPER_LEFT_REGEXP, 'Right');
27367    }
27368    if (UPPER_RIGHT_REGEXP.test(key)) {
27369      return key.replace(UPPER_RIGHT_REGEXP, 'Left');
27370    }
27371    return key;
27372  }
27373  
27374  /**
27375   * An incredibly basic ltr -> rtl converter for style properties
27376   *
27377   * @param {import('react').CSSProperties} ltrStyles
27378   *
27379   * @return {import('react').CSSProperties} Converted ltr -> rtl styles
27380   */
27381  const convertLTRToRTL = (ltrStyles = {}) => {
27382    return Object.fromEntries(Object.entries(ltrStyles).map(([key, value]) => [getConvertedKey(key), value]));
27383  };
27384  
27385  /**
27386   * A higher-order function that create an incredibly basic ltr -> rtl style converter for CSS objects.
27387   *
27388   * @param {import('react').CSSProperties} ltrStyles   Ltr styles. Converts and renders from ltr -> rtl styles, if applicable.
27389   * @param {import('react').CSSProperties} [rtlStyles] Rtl styles. Renders if provided.
27390   *
27391   * @return {() => import('@emotion/react').SerializedStyles} A function to output CSS styles for Emotion's renderer
27392   */
27393  function rtl(ltrStyles = {}, rtlStyles) {
27394    return () => {
27395      if (rtlStyles) {
27396        // @ts-ignore: `css` types are wrong, it can accept an object: https://emotion.sh/docs/object-styles#with-css
27397        return (0,external_wp_i18n_namespaceObject.isRTL)() ? /*#__PURE__*/emotion_react_browser_esm_css(rtlStyles,  true ? "" : 0,  true ? "" : 0) : /*#__PURE__*/emotion_react_browser_esm_css(ltrStyles,  true ? "" : 0,  true ? "" : 0);
27398      }
27399  
27400      // @ts-ignore: `css` types are wrong, it can accept an object: https://emotion.sh/docs/object-styles#with-css
27401      return (0,external_wp_i18n_namespaceObject.isRTL)() ? /*#__PURE__*/emotion_react_browser_esm_css(convertLTRToRTL(ltrStyles),  true ? "" : 0,  true ? "" : 0) : /*#__PURE__*/emotion_react_browser_esm_css(ltrStyles,  true ? "" : 0,  true ? "" : 0);
27402    };
27403  }
27404  
27405  /**
27406   * Call this in the `useMemo` dependency array to ensure that subsequent renders will
27407   * cause rtl styles to update based on the `isRTL` return value even if all other dependencies
27408   * remain the same.
27409   *
27410   * @example
27411   * const styles = useMemo( () => {
27412   *   return css`
27413   *     ${ rtl( { marginRight: '10px' } ) }
27414   *   `;
27415   * }, [ rtl.watch() ] );
27416   */
27417  rtl.watch = () => (0,external_wp_i18n_namespaceObject.isRTL)();
27418  
27419  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/spacer/hook.js
27420  /**
27421   * External dependencies
27422   */
27423  
27424  
27425  /**
27426   * Internal dependencies
27427   */
27428  
27429  
27430  
27431  
27432  const isDefined = o => typeof o !== 'undefined' && o !== null;
27433  function useSpacer(props) {
27434    const {
27435      className,
27436      margin,
27437      marginBottom = 2,
27438      marginLeft,
27439      marginRight,
27440      marginTop,
27441      marginX,
27442      marginY,
27443      padding,
27444      paddingBottom,
27445      paddingLeft,
27446      paddingRight,
27447      paddingTop,
27448      paddingX,
27449      paddingY,
27450      ...otherProps
27451    } = useContextSystem(props, 'Spacer');
27452    const cx = useCx();
27453    const classes = cx(isDefined(margin) && /*#__PURE__*/emotion_react_browser_esm_css("margin:", space(margin), ";" + ( true ? "" : 0),  true ? "" : 0), isDefined(marginY) && /*#__PURE__*/emotion_react_browser_esm_css("margin-bottom:", space(marginY), ";margin-top:", space(marginY), ";" + ( true ? "" : 0),  true ? "" : 0), isDefined(marginX) && /*#__PURE__*/emotion_react_browser_esm_css("margin-left:", space(marginX), ";margin-right:", space(marginX), ";" + ( true ? "" : 0),  true ? "" : 0), isDefined(marginTop) && /*#__PURE__*/emotion_react_browser_esm_css("margin-top:", space(marginTop), ";" + ( true ? "" : 0),  true ? "" : 0), isDefined(marginBottom) && /*#__PURE__*/emotion_react_browser_esm_css("margin-bottom:", space(marginBottom), ";" + ( true ? "" : 0),  true ? "" : 0), isDefined(marginLeft) && rtl({
27454      marginLeft: space(marginLeft)
27455    })(), isDefined(marginRight) && rtl({
27456      marginRight: space(marginRight)
27457    })(), isDefined(padding) && /*#__PURE__*/emotion_react_browser_esm_css("padding:", space(padding), ";" + ( true ? "" : 0),  true ? "" : 0), isDefined(paddingY) && /*#__PURE__*/emotion_react_browser_esm_css("padding-bottom:", space(paddingY), ";padding-top:", space(paddingY), ";" + ( true ? "" : 0),  true ? "" : 0), isDefined(paddingX) && /*#__PURE__*/emotion_react_browser_esm_css("padding-left:", space(paddingX), ";padding-right:", space(paddingX), ";" + ( true ? "" : 0),  true ? "" : 0), isDefined(paddingTop) && /*#__PURE__*/emotion_react_browser_esm_css("padding-top:", space(paddingTop), ";" + ( true ? "" : 0),  true ? "" : 0), isDefined(paddingBottom) && /*#__PURE__*/emotion_react_browser_esm_css("padding-bottom:", space(paddingBottom), ";" + ( true ? "" : 0),  true ? "" : 0), isDefined(paddingLeft) && rtl({
27458      paddingLeft: space(paddingLeft)
27459    })(), isDefined(paddingRight) && rtl({
27460      paddingRight: space(paddingRight)
27461    })(), className);
27462    return {
27463      ...otherProps,
27464      className: classes
27465    };
27466  }
27467  
27468  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/spacer/component.js
27469  /**
27470   * External dependencies
27471   */
27472  
27473  /**
27474   * Internal dependencies
27475   */
27476  
27477  
27478  
27479  
27480  
27481  function UnconnectedSpacer(props, forwardedRef) {
27482    const spacerProps = useSpacer(props);
27483    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(component, {
27484      ...spacerProps,
27485      ref: forwardedRef
27486    });
27487  }
27488  
27489  /**
27490   * `Spacer` is a primitive layout component that providers inner (`padding`) or outer (`margin`) space in-between components. It can also be used to adaptively provide space within an `HStack` or `VStack`.
27491   *
27492   * `Spacer` comes with a bunch of shorthand props to adjust `margin` and `padding`. The values of these props
27493   * can either be a number (which will act as a multiplier to the library's grid system base of 4px),
27494   * or a literal CSS value string.
27495   *
27496   * ```jsx
27497   * import { Spacer } from `@wordpress/components`
27498   *
27499   * function Example() {
27500   *   return (
27501   *     <View>
27502   *       <Spacer>
27503   *         <Heading>WordPress.org</Heading>
27504   *       </Spacer>
27505   *       <Text>
27506   *         Code is Poetry
27507   *       </Text>
27508   *     </View>
27509   *   );
27510   * }
27511   * ```
27512   */
27513  const Spacer = contextConnect(UnconnectedSpacer, 'Spacer');
27514  /* harmony default export */ const spacer_component = (Spacer);
27515  
27516  ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/plus.js
27517  /**
27518   * WordPress dependencies
27519   */
27520  
27521  
27522  const plus = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, {
27523    xmlns: "http://www.w3.org/2000/svg",
27524    viewBox: "0 0 24 24",
27525    children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, {
27526      d: "M11 12.5V17.5H12.5V12.5H17.5V11H12.5V6H11V11H6V12.5H11Z"
27527    })
27528  });
27529  /* harmony default export */ const library_plus = (plus);
27530  
27531  ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/reset.js
27532  /**
27533   * WordPress dependencies
27534   */
27535  
27536  
27537  const reset_reset = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, {
27538    xmlns: "http://www.w3.org/2000/svg",
27539    viewBox: "0 0 24 24",
27540    children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, {
27541      d: "M7 11.5h10V13H7z"
27542    })
27543  });
27544  /* harmony default export */ const library_reset = (reset_reset);
27545  
27546  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/flex/flex-item/component.js
27547  /**
27548   * External dependencies
27549   */
27550  
27551  /**
27552   * Internal dependencies
27553   */
27554  
27555  
27556  
27557  
27558  
27559  function UnconnectedFlexItem(props, forwardedRef) {
27560    const flexItemProps = useFlexItem(props);
27561    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(component, {
27562      ...flexItemProps,
27563      ref: forwardedRef
27564    });
27565  }
27566  
27567  /**
27568   * `FlexItem` is a primitive layout component that aligns content within layout
27569   * containers like `Flex`.
27570   *
27571   * ```jsx
27572   * import { Flex, FlexItem } from '@wordpress/components';
27573   *
27574   * function Example() {
27575   *   return (
27576   *     <Flex>
27577   *       <FlexItem>...</FlexItem>
27578   *     </Flex>
27579   *   );
27580   * }
27581   * ```
27582   */
27583  const FlexItem = contextConnect(UnconnectedFlexItem, 'FlexItem');
27584  /* harmony default export */ const flex_item_component = (FlexItem);
27585  
27586  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/truncate/styles.js
27587  function truncate_styles_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)."; }
27588  /**
27589   * External dependencies
27590   */
27591  
27592  const Truncate =  true ? {
27593    name: "hdknak",
27594    styles: "display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap"
27595  } : 0;
27596  
27597  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/utils/values.js
27598  /* eslint-disable jsdoc/valid-types */
27599  /**
27600   * Determines if a value is null or undefined.
27601   *
27602   * @template T
27603   *
27604   * @param {T} value The value to check.
27605   * @return {value is Exclude<T, null | undefined>} Whether value is not null or undefined.
27606   */
27607  function isValueDefined(value) {
27608    return value !== undefined && value !== null;
27609  }
27610  /* eslint-enable jsdoc/valid-types */
27611  
27612  /* eslint-disable jsdoc/valid-types */
27613  /**
27614   * Determines if a value is empty, null, or undefined.
27615   *
27616   * @param {string | number | null | undefined} value The value to check.
27617   * @return {value is ("" | null | undefined)} Whether value is empty.
27618   */
27619  function isValueEmpty(value) {
27620    const isEmptyString = value === '';
27621    return !isValueDefined(value) || isEmptyString;
27622  }
27623  /* eslint-enable jsdoc/valid-types */
27624  
27625  /**
27626   * Get the first defined/non-null value from an array.
27627   *
27628   * @template T
27629   *
27630   * @param {Array<T | null | undefined>} values        Values to derive from.
27631   * @param {T}                           fallbackValue Fallback value if there are no defined values.
27632   * @return {T} A defined value or the fallback value.
27633   */
27634  function getDefinedValue(values = [], fallbackValue) {
27635    var _values$find;
27636    return (_values$find = values.find(isValueDefined)) !== null && _values$find !== void 0 ? _values$find : fallbackValue;
27637  }
27638  
27639  /**
27640   * Converts a string to a number.
27641   *
27642   * @param {string} value
27643   * @return {number} String as a number.
27644   */
27645  const stringToNumber = value => {
27646    return parseFloat(value);
27647  };
27648  
27649  /**
27650   * Regardless of the input being a string or a number, returns a number.
27651   *
27652   * Returns `undefined` in case the string is `undefined` or not a valid numeric value.
27653   *
27654   * @param {string | number} value
27655   * @return {number} The parsed number.
27656   */
27657  const ensureNumber = value => {
27658    return typeof value === 'string' ? stringToNumber(value) : value;
27659  };
27660  
27661  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/truncate/utils.js
27662  /**
27663   * Internal dependencies
27664   */
27665  
27666  const TRUNCATE_ELLIPSIS = '…';
27667  const TRUNCATE_TYPE = {
27668    auto: 'auto',
27669    head: 'head',
27670    middle: 'middle',
27671    tail: 'tail',
27672    none: 'none'
27673  };
27674  const TRUNCATE_DEFAULT_PROPS = {
27675    ellipsis: TRUNCATE_ELLIPSIS,
27676    ellipsizeMode: TRUNCATE_TYPE.auto,
27677    limit: 0,
27678    numberOfLines: 0
27679  };
27680  
27681  // Source
27682  // https://github.com/kahwee/truncate-middle
27683  function truncateMiddle(word, headLength, tailLength, ellipsis) {
27684    if (typeof word !== 'string') {
27685      return '';
27686    }
27687    const wordLength = word.length;
27688    // Setting default values
27689    // eslint-disable-next-line no-bitwise
27690    const frontLength = ~~headLength; // Will cast to integer
27691    // eslint-disable-next-line no-bitwise
27692    const backLength = ~~tailLength;
27693    /* istanbul ignore next */
27694    const truncateStr = isValueDefined(ellipsis) ? ellipsis : TRUNCATE_ELLIPSIS;
27695    if (frontLength === 0 && backLength === 0 || frontLength >= wordLength || backLength >= wordLength || frontLength + backLength >= wordLength) {
27696      return word;
27697    } else if (backLength === 0) {
27698      return word.slice(0, frontLength) + truncateStr;
27699    }
27700    return word.slice(0, frontLength) + truncateStr + word.slice(wordLength - backLength);
27701  }
27702  function truncateContent(words = '', props) {
27703    const mergedProps = {
27704      ...TRUNCATE_DEFAULT_PROPS,
27705      ...props
27706    };
27707    const {
27708      ellipsis,
27709      ellipsizeMode,
27710      limit
27711    } = mergedProps;
27712    if (ellipsizeMode === TRUNCATE_TYPE.none) {
27713      return words;
27714    }
27715    let truncateHead;
27716    let truncateTail;
27717    switch (ellipsizeMode) {
27718      case TRUNCATE_TYPE.head:
27719        truncateHead = 0;
27720        truncateTail = limit;
27721        break;
27722      case TRUNCATE_TYPE.middle:
27723        truncateHead = Math.floor(limit / 2);
27724        truncateTail = Math.floor(limit / 2);
27725        break;
27726      default:
27727        truncateHead = limit;
27728        truncateTail = 0;
27729    }
27730    const truncatedContent = ellipsizeMode !== TRUNCATE_TYPE.auto ? truncateMiddle(words, truncateHead, truncateTail, ellipsis) : words;
27731    return truncatedContent;
27732  }
27733  
27734  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/truncate/hook.js
27735  /**
27736   * External dependencies
27737   */
27738  
27739  
27740  /**
27741   * WordPress dependencies
27742   */
27743  
27744  
27745  /**
27746   * Internal dependencies
27747   */
27748  
27749  
27750  
27751  
27752  
27753  function useTruncate(props) {
27754    const {
27755      className,
27756      children,
27757      ellipsis = TRUNCATE_ELLIPSIS,
27758      ellipsizeMode = TRUNCATE_TYPE.auto,
27759      limit = 0,
27760      numberOfLines = 0,
27761      ...otherProps
27762    } = useContextSystem(props, 'Truncate');
27763    const cx = useCx();
27764    let childrenAsText;
27765    if (typeof children === 'string') {
27766      childrenAsText = children;
27767    } else if (typeof children === 'number') {
27768      childrenAsText = children.toString();
27769    }
27770    const truncatedContent = childrenAsText ? truncateContent(childrenAsText, {
27771      ellipsis,
27772      ellipsizeMode,
27773      limit,
27774      numberOfLines
27775    }) : children;
27776    const shouldTruncate = !!childrenAsText && ellipsizeMode === TRUNCATE_TYPE.auto;
27777    const classes = (0,external_wp_element_namespaceObject.useMemo)(() => {
27778      // The `word-break: break-all` property first makes sure a text line
27779      // breaks even when it contains 'unbreakable' content such as long URLs.
27780      // See https://github.com/WordPress/gutenberg/issues/60860.
27781      const truncateLines = /*#__PURE__*/emotion_react_browser_esm_css(numberOfLines === 1 ? 'word-break: break-all;' : '', " -webkit-box-orient:vertical;-webkit-line-clamp:", numberOfLines, ";display:-webkit-box;overflow:hidden;" + ( true ? "" : 0),  true ? "" : 0);
27782      return cx(shouldTruncate && !numberOfLines && Truncate, shouldTruncate && !!numberOfLines && truncateLines, className);
27783    }, [className, cx, numberOfLines, shouldTruncate]);
27784    return {
27785      ...otherProps,
27786      className: classes,
27787      children: truncatedContent
27788    };
27789  }
27790  
27791  ;// CONCATENATED MODULE: ./node_modules/colord/index.mjs
27792  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},colord_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},colord_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},colord_a=function(r){return{r:colord_e(r.r,0,255),g:colord_e(r.g,0,255),b:colord_e(r.b,0,255),a:colord_e(r.a)}},colord_o=function(r){return{r:colord_n(r.r),g:colord_n(r.g),b:colord_n(r.b),a:colord_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:colord_e(r.s,0,100),l:colord_e(r.l,0,100),a:colord_e(r.a)}},d=function(r){return{h:colord_n(r.h),s:colord_n(r.s),l:colord_n(r.l),a:colord_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?colord_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?colord_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:colord_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)?colord_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:colord_e(r.s,0,100),v:colord_e(r.v,0,100),a:colord_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:colord_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:colord_e(n.l+100*t,0,100),a:n.a}},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 colord_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=colord_o(this.rgba),t=r.r,e=r.g,u=r.b,i=(a=r.a)<1?s(colord_n(255*a)):"","#"+s(t)+s(e)+s(u)+i;var r,t,e,u,a,i},r.prototype.toRgb=function(){return colord_o(this.rgba)},r.prototype.toRgbString=function(){return r=colord_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:colord_n(r.h),s:colord_n(r.s),v:colord_n(r.v),a:colord_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}):colord_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}):colord_n(t.h)},r.prototype.isEqual=function(r){return this.toHex()===w(r).toHex()},r}(),w=function(r){return r instanceof j?r:new j(r)},S=[],k=function(r){r.forEach(function(r){S.indexOf(r)<0&&(r(j,y),S.push(r))})},E=function(){return new j({r:255*Math.random(),g:255*Math.random(),b:255*Math.random()})};
27793  
27794  ;// CONCATENATED MODULE: ./node_modules/colord/plugins/names.mjs
27795  /* 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"])}
27796  
27797  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/utils/colors.js
27798  /**
27799   * External dependencies
27800   */
27801  
27802  
27803  
27804  
27805  /** @type {HTMLDivElement} */
27806  let colorComputationNode;
27807  k([names]);
27808  
27809  /**
27810   * Generating a CSS compliant rgba() color value.
27811   *
27812   * @param {string} hexValue The hex value to convert to rgba().
27813   * @param {number} alpha    The alpha value for opacity.
27814   * @return {string} The converted rgba() color value.
27815   *
27816   * @example
27817   * rgba( '#000000', 0.5 )
27818   * // rgba(0, 0, 0, 0.5)
27819   */
27820  function colors_rgba(hexValue = '', alpha = 1) {
27821    return colord(hexValue).alpha(alpha).toRgbString();
27822  }
27823  
27824  /**
27825   * @return {HTMLDivElement | undefined} The HTML element for color computation.
27826   */
27827  function getColorComputationNode() {
27828    if (typeof document === 'undefined') {
27829      return;
27830    }
27831    if (!colorComputationNode) {
27832      // Create a temporary element for style computation.
27833      const el = document.createElement('div');
27834      el.setAttribute('data-g2-color-computation-node', '');
27835      // Inject for window computed style.
27836      document.body.appendChild(el);
27837      colorComputationNode = el;
27838    }
27839    return colorComputationNode;
27840  }
27841  
27842  /**
27843   * @param {string | unknown} value
27844   *
27845   * @return {boolean} Whether the value is a valid color.
27846   */
27847  function isColor(value) {
27848    if (typeof value !== 'string') {
27849      return false;
27850    }
27851    const test = w(value);
27852    return test.isValid();
27853  }
27854  
27855  /**
27856   * Retrieves the computed background color. This is useful for getting the
27857   * value of a CSS variable color.
27858   *
27859   * @param {string | unknown} backgroundColor The background color to compute.
27860   *
27861   * @return {string} The computed background color.
27862   */
27863  function _getComputedBackgroundColor(backgroundColor) {
27864    if (typeof backgroundColor !== 'string') {
27865      return '';
27866    }
27867    if (isColor(backgroundColor)) {
27868      return backgroundColor;
27869    }
27870    if (!backgroundColor.includes('var(')) {
27871      return '';
27872    }
27873    if (typeof document === 'undefined') {
27874      return '';
27875    }
27876  
27877    // Attempts to gracefully handle CSS variables color values.
27878    const el = getColorComputationNode();
27879    if (!el) {
27880      return '';
27881    }
27882    el.style.background = backgroundColor;
27883    // Grab the style.
27884    const computedColor = window?.getComputedStyle(el).background;
27885    // Reset.
27886    el.style.background = '';
27887    return computedColor || '';
27888  }
27889  const getComputedBackgroundColor = memize(_getComputedBackgroundColor);
27890  
27891  /**
27892   * Get the text shade optimized for readability, based on a background color.
27893   *
27894   * @param {string | unknown} backgroundColor The background color.
27895   *
27896   * @return {string} The optimized text color (black or white).
27897   */
27898  function getOptimalTextColor(backgroundColor) {
27899    const background = getComputedBackgroundColor(backgroundColor);
27900    return w(background).isLight() ? '#000000' : '#ffffff';
27901  }
27902  
27903  /**
27904   * Get the text shade optimized for readability, based on a background color.
27905   *
27906   * @param {string | unknown} backgroundColor The background color.
27907   *
27908   * @return {string} The optimized text shade (dark or light).
27909   */
27910  function getOptimalTextShade(backgroundColor) {
27911    const result = getOptimalTextColor(backgroundColor);
27912    return result === '#000000' ? 'dark' : 'light';
27913  }
27914  
27915  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/text/styles.js
27916  function text_styles_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)."; }
27917  /**
27918   * External dependencies
27919   */
27920  
27921  
27922  /**
27923   * Internal dependencies
27924   */
27925  
27926  const Text = /*#__PURE__*/emotion_react_browser_esm_css("color:", COLORS.gray[900], ";line-height:", config_values.fontLineHeightBase, ";margin:0;text-wrap:balance;text-wrap:pretty;" + ( true ? "" : 0),  true ? "" : 0);
27927  const styles_block =  true ? {
27928    name: "4zleql",
27929    styles: "display:block"
27930  } : 0;
27931  const positive = /*#__PURE__*/emotion_react_browser_esm_css("color:", COLORS.alert.green, ";" + ( true ? "" : 0),  true ? "" : 0);
27932  const destructive = /*#__PURE__*/emotion_react_browser_esm_css("color:", COLORS.alert.red, ";" + ( true ? "" : 0),  true ? "" : 0);
27933  const muted = /*#__PURE__*/emotion_react_browser_esm_css("color:", COLORS.gray[700], ";" + ( true ? "" : 0),  true ? "" : 0);
27934  const highlighterText = /*#__PURE__*/emotion_react_browser_esm_css("mark{background:", COLORS.alert.yellow, ";border-radius:", config_values.radiusSmall, ";box-shadow:0 0 0 1px rgba( 0, 0, 0, 0.05 ) inset,0 -1px 0 rgba( 0, 0, 0, 0.1 ) inset;}" + ( true ? "" : 0),  true ? "" : 0);
27935  const upperCase =  true ? {
27936    name: "50zrmy",
27937    styles: "text-transform:uppercase"
27938  } : 0;
27939  
27940  // EXTERNAL MODULE: ./node_modules/highlight-words-core/dist/index.js
27941  var dist = __webpack_require__(9664);
27942  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/text/utils.js
27943  /**
27944   * External dependencies
27945   */
27946  
27947  
27948  
27949  /**
27950   * WordPress dependencies
27951   */
27952  
27953  
27954  /**
27955   * Source:
27956   * https://github.com/bvaughn/react-highlight-words/blob/HEAD/src/Highlighter.js
27957   */
27958  
27959  /**
27960   * @typedef Options
27961   * @property {string}                                                     [activeClassName='']      Classname for active highlighted areas.
27962   * @property {number}                                                     [activeIndex=-1]          The index of the active highlighted area.
27963   * @property {import('react').AllHTMLAttributes<HTMLDivElement>['style']} [activeStyle]             Styles to apply to the active highlighted area.
27964   * @property {boolean}                                                    [autoEscape]              Whether to automatically escape text.
27965   * @property {boolean}                                                    [caseSensitive=false]     Whether to highlight in a case-sensitive manner.
27966   * @property {string}                                                     children                  Children to highlight.
27967   * @property {import('highlight-words-core').FindAllArgs['findChunks']}   [findChunks]              Custom `findChunks` function to pass to `highlight-words-core`.
27968   * @property {string | Record<string, unknown>}                           [highlightClassName='']   Classname to apply to highlighted text or a Record of classnames to apply to given text (which should be the key).
27969   * @property {import('react').AllHTMLAttributes<HTMLDivElement>['style']} [highlightStyle={}]       Styles to apply to highlighted text.
27970   * @property {keyof JSX.IntrinsicElements}                                [highlightTag='mark']     Tag to use for the highlighted text.
27971   * @property {import('highlight-words-core').FindAllArgs['sanitize']}     [sanitize]                Custom `santize` function to pass to `highlight-words-core`.
27972   * @property {string[]}                                                   [searchWords=[]]          Words to search for and highlight.
27973   * @property {string}                                                     [unhighlightClassName=''] Classname to apply to unhighlighted text.
27974   * @property {import('react').AllHTMLAttributes<HTMLDivElement>['style']} [unhighlightStyle]        Style to apply to unhighlighted text.
27975   */
27976  
27977  /**
27978   * Maps props to lowercase names.
27979   *
27980   * @param object Props to map.
27981   * @return The mapped props.
27982   */
27983  const lowercaseProps = object => {
27984    const mapped = {};
27985    for (const key in object) {
27986      mapped[key.toLowerCase()] = object[key];
27987    }
27988    return mapped;
27989  };
27990  const memoizedLowercaseProps = memize(lowercaseProps);
27991  
27992  /**
27993   * @param options
27994   * @param options.activeClassName
27995   * @param options.activeIndex
27996   * @param options.activeStyle
27997   * @param options.autoEscape
27998   * @param options.caseSensitive
27999   * @param options.children
28000   * @param options.findChunks
28001   * @param options.highlightClassName
28002   * @param options.highlightStyle
28003   * @param options.highlightTag
28004   * @param options.sanitize
28005   * @param options.searchWords
28006   * @param options.unhighlightClassName
28007   * @param options.unhighlightStyle
28008   */
28009  function createHighlighterText({
28010    activeClassName = '',
28011    activeIndex = -1,
28012    activeStyle,
28013    autoEscape,
28014    caseSensitive = false,
28015    children,
28016    findChunks,
28017    highlightClassName = '',
28018    highlightStyle = {},
28019    highlightTag = 'mark',
28020    sanitize,
28021    searchWords = [],
28022    unhighlightClassName = '',
28023    unhighlightStyle
28024  }) {
28025    if (!children) {
28026      return null;
28027    }
28028    if (typeof children !== 'string') {
28029      return children;
28030    }
28031    const textToHighlight = children;
28032    const chunks = (0,dist.findAll)({
28033      autoEscape,
28034      caseSensitive,
28035      findChunks,
28036      sanitize,
28037      searchWords,
28038      textToHighlight
28039    });
28040    const HighlightTag = highlightTag;
28041    let highlightIndex = -1;
28042    let highlightClassNames = '';
28043    let highlightStyles;
28044    const textContent = chunks.map((chunk, index) => {
28045      const text = textToHighlight.substr(chunk.start, chunk.end - chunk.start);
28046      if (chunk.highlight) {
28047        highlightIndex++;
28048        let highlightClass;
28049        if (typeof highlightClassName === 'object') {
28050          if (!caseSensitive) {
28051            highlightClassName = memoizedLowercaseProps(highlightClassName);
28052            highlightClass = highlightClassName[text.toLowerCase()];
28053          } else {
28054            highlightClass = highlightClassName[text];
28055          }
28056        } else {
28057          highlightClass = highlightClassName;
28058        }
28059        const isActive = highlightIndex === +activeIndex;
28060        highlightClassNames = `$highlightClass} $isActive ? activeClassName : ''}`;
28061        highlightStyles = isActive === true && activeStyle !== null ? Object.assign({}, highlightStyle, activeStyle) : highlightStyle;
28062        const props = {
28063          children: text,
28064          className: highlightClassNames,
28065          key: index,
28066          style: highlightStyles
28067        };
28068  
28069        // Don't attach arbitrary props to DOM elements; this triggers React DEV warnings (https://fb.me/react-unknown-prop)
28070        // Only pass through the highlightIndex attribute for custom components.
28071        if (typeof HighlightTag !== 'string') {
28072          props.highlightIndex = highlightIndex;
28073        }
28074        return (0,external_wp_element_namespaceObject.createElement)(HighlightTag, props);
28075      }
28076      return (0,external_wp_element_namespaceObject.createElement)('span', {
28077        children: text,
28078        className: unhighlightClassName,
28079        key: index,
28080        style: unhighlightStyle
28081      });
28082    });
28083    return textContent;
28084  }
28085  
28086  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/utils/font-size.js
28087  /**
28088   * External dependencies
28089   */
28090  
28091  /**
28092   * Internal dependencies
28093   */
28094  
28095  const BASE_FONT_SIZE = 13;
28096  const PRESET_FONT_SIZES = {
28097    body: BASE_FONT_SIZE,
28098    caption: 10,
28099    footnote: 11,
28100    largeTitle: 28,
28101    subheadline: 12,
28102    title: 20
28103  };
28104  const HEADING_FONT_SIZES = [1, 2, 3, 4, 5, 6].flatMap(n => [n, n.toString()]);
28105  function getFontSize(size = BASE_FONT_SIZE) {
28106    if (size in PRESET_FONT_SIZES) {
28107      return getFontSize(PRESET_FONT_SIZES[size]);
28108    }
28109    if (typeof size !== 'number') {
28110      const parsed = parseFloat(size);
28111      if (Number.isNaN(parsed)) {
28112        return size;
28113      }
28114      size = parsed;
28115    }
28116    const ratio = `($size} / $BASE_FONT_SIZE})`;
28117    return `calc($ratio} * $config_values.fontSize})`;
28118  }
28119  function getHeadingFontSize(size = 3) {
28120    if (!HEADING_FONT_SIZES.includes(size)) {
28121      return getFontSize(size);
28122    }
28123    const headingSize = `fontSizeH$size}`;
28124    return config_values[headingSize];
28125  }
28126  
28127  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/text/get-line-height.js
28128  /**
28129   * External dependencies
28130   */
28131  
28132  /**
28133   * Internal dependencies
28134   */
28135  
28136  
28137  
28138  function getLineHeight(adjustLineHeightForInnerControls, lineHeight) {
28139    if (lineHeight) {
28140      return lineHeight;
28141    }
28142    if (!adjustLineHeightForInnerControls) {
28143      return;
28144    }
28145    let value = `calc($config_values.controlHeight} + $space(2)})`;
28146    switch (adjustLineHeightForInnerControls) {
28147      case 'large':
28148        value = `calc($config_values.controlHeightLarge} + $space(2)})`;
28149        break;
28150      case 'small':
28151        value = `calc($config_values.controlHeightSmall} + $space(2)})`;
28152        break;
28153      case 'xSmall':
28154        value = `calc($config_values.controlHeightXSmall} + $space(2)})`;
28155        break;
28156      default:
28157        break;
28158    }
28159    return value;
28160  }
28161  
28162  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/text/hook.js
28163  function hook_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)."; }
28164  /**
28165   * External dependencies
28166   */
28167  
28168  
28169  
28170  /**
28171   * WordPress dependencies
28172   */
28173  
28174  
28175  /**
28176   * Internal dependencies
28177   */
28178  
28179  
28180  
28181  
28182  
28183  
28184  
28185  
28186  
28187  
28188  var hook_ref =  true ? {
28189    name: "50zrmy",
28190    styles: "text-transform:uppercase"
28191  } : 0;
28192  /**
28193   * @param {import('../context').WordPressComponentProps<import('./types').Props, 'span'>} props
28194   */
28195  function useText(props) {
28196    const {
28197      adjustLineHeightForInnerControls,
28198      align,
28199      children,
28200      className,
28201      color,
28202      ellipsizeMode,
28203      isDestructive = false,
28204      display,
28205      highlightEscape = false,
28206      highlightCaseSensitive = false,
28207      highlightWords,
28208      highlightSanitize,
28209      isBlock = false,
28210      letterSpacing,
28211      lineHeight: lineHeightProp,
28212      optimizeReadabilityFor,
28213      size,
28214      truncate = false,
28215      upperCase = false,
28216      variant,
28217      weight = config_values.fontWeight,
28218      ...otherProps
28219    } = useContextSystem(props, 'Text');
28220    let content = children;
28221    const isHighlighter = Array.isArray(highlightWords);
28222    const isCaption = size === 'caption';
28223    if (isHighlighter) {
28224      if (typeof children !== 'string') {
28225        throw new TypeError('`children` of `Text` must only be `string` types when `highlightWords` is defined');
28226      }
28227      content = createHighlighterText({
28228        autoEscape: highlightEscape,
28229        children,
28230        caseSensitive: highlightCaseSensitive,
28231        searchWords: highlightWords,
28232        sanitize: highlightSanitize
28233      });
28234    }
28235    const cx = useCx();
28236    const classes = (0,external_wp_element_namespaceObject.useMemo)(() => {
28237      const sx = {};
28238      const lineHeight = getLineHeight(adjustLineHeightForInnerControls, lineHeightProp);
28239      sx.Base = /*#__PURE__*/emotion_react_browser_esm_css({
28240        color,
28241        display,
28242        fontSize: getFontSize(size),
28243        fontWeight: weight,
28244        lineHeight,
28245        letterSpacing,
28246        textAlign: align
28247      },  true ? "" : 0,  true ? "" : 0);
28248      sx.upperCase = hook_ref;
28249      sx.optimalTextColor = null;
28250      if (optimizeReadabilityFor) {
28251        const isOptimalTextColorDark = getOptimalTextShade(optimizeReadabilityFor) === 'dark';
28252        sx.optimalTextColor = isOptimalTextColorDark ? /*#__PURE__*/emotion_react_browser_esm_css({
28253          color: COLORS.gray[900]
28254        },  true ? "" : 0,  true ? "" : 0) : /*#__PURE__*/emotion_react_browser_esm_css({
28255          color: COLORS.white
28256        },  true ? "" : 0,  true ? "" : 0);
28257      }
28258      return cx(Text, sx.Base, sx.optimalTextColor, isDestructive && destructive, !!isHighlighter && highlighterText, isBlock && styles_block, isCaption && muted, variant && text_styles_namespaceObject[variant], upperCase && sx.upperCase, className);
28259    }, [adjustLineHeightForInnerControls, align, className, color, cx, display, isBlock, isCaption, isDestructive, isHighlighter, letterSpacing, lineHeightProp, optimizeReadabilityFor, size, upperCase, variant, weight]);
28260    let finalEllipsizeMode;
28261    if (truncate === true) {
28262      finalEllipsizeMode = 'auto';
28263    }
28264    if (truncate === false) {
28265      finalEllipsizeMode = 'none';
28266    }
28267    const finalComponentProps = {
28268      ...otherProps,
28269      className: classes,
28270      children,
28271      ellipsizeMode: ellipsizeMode || finalEllipsizeMode
28272    };
28273    const truncateProps = useTruncate(finalComponentProps);
28274  
28275    /**
28276     * Enhance child `<Link />` components to inherit font size.
28277     */
28278    if (!truncate && Array.isArray(children)) {
28279      content = external_wp_element_namespaceObject.Children.map(children, child => {
28280        if (typeof child !== 'object' || child === null || !('props' in child)) {
28281          return child;
28282        }
28283        const isLink = hasConnectNamespace(child, ['Link']);
28284        if (isLink) {
28285          return (0,external_wp_element_namespaceObject.cloneElement)(child, {
28286            size: child.props.size || 'inherit'
28287          });
28288        }
28289        return child;
28290      });
28291    }
28292    return {
28293      ...truncateProps,
28294      children: truncate ? truncateProps.children : content
28295    };
28296  }
28297  
28298  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/text/component.js
28299  /**
28300   * Internal dependencies
28301   */
28302  
28303  
28304  
28305  
28306  
28307  /**
28308   * @param props
28309   * @param forwardedRef
28310   */
28311  function UnconnectedText(props, forwardedRef) {
28312    const textProps = useText(props);
28313    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(component, {
28314      as: "span",
28315      ...textProps,
28316      ref: forwardedRef
28317    });
28318  }
28319  
28320  /**
28321   * `Text` is a core component that renders text in the library, using the
28322   * library's typography system.
28323   *
28324   * `Text` can be used to render any text-content, like an HTML `p` or `span`.
28325   *
28326   * @example
28327   *
28328   * ```jsx
28329   * import { __experimentalText as Text } from `@wordpress/components`;
28330   *
28331   * function Example() {
28332   *     return <Text>Code is Poetry</Text>;
28333   * }
28334   * ```
28335   */
28336  const component_Text = contextConnect(UnconnectedText, 'Text');
28337  /* harmony default export */ const text_component = (component_Text);
28338  
28339  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/utils/base-label.js
28340  function base_label_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)."; }
28341  /**
28342   * External dependencies
28343   */
28344  
28345  
28346  // This is a very low-level mixin which you shouldn't have to use directly.
28347  // Try to use BaseControl's StyledLabel or BaseControl.VisualLabel if you can.
28348  const baseLabelTypography =  true ? {
28349    name: "9amh4a",
28350    styles: "font-size:11px;font-weight:500;line-height:1.4;text-transform:uppercase"
28351  } : 0;
28352  
28353  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/input-control/styles/input-control-styles.js
28354  
28355  function input_control_styles_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)."; }
28356  /**
28357   * External dependencies
28358   */
28359  
28360  
28361  /**
28362   * Internal dependencies
28363   */
28364  
28365  
28366  
28367  
28368  
28369  const Prefix = /*#__PURE__*/emotion_styled_base_browser_esm("span",  true ? {
28370    target: "em5sgkm8"
28371  } : 0)( true ? {
28372    name: "pvvbxf",
28373    styles: "box-sizing:border-box;display:block"
28374  } : 0);
28375  const Suffix = /*#__PURE__*/emotion_styled_base_browser_esm("span",  true ? {
28376    target: "em5sgkm7"
28377  } : 0)( true ? {
28378    name: "jgf79h",
28379    styles: "align-items:center;align-self:stretch;box-sizing:border-box;display:flex"
28380  } : 0);
28381  const backdropBorderColor = ({
28382    disabled,
28383    isBorderless
28384  }) => {
28385    if (isBorderless) {
28386      return 'transparent';
28387    }
28388    if (disabled) {
28389      return COLORS.ui.borderDisabled;
28390    }
28391    return COLORS.ui.border;
28392  };
28393  const BackdropUI = /*#__PURE__*/emotion_styled_base_browser_esm("div",  true ? {
28394    target: "em5sgkm6"
28395  } : 0)("&&&{box-sizing:border-box;border-color:", backdropBorderColor, ";border-radius:inherit;border-style:solid;border-width:1px;bottom:0;left:0;margin:0;padding:0;pointer-events:none;position:absolute;right:0;top:0;", rtl({
28396    paddingLeft: 2
28397  }), ";}" + ( true ? "" : 0));
28398  const Root = /*#__PURE__*/emotion_styled_base_browser_esm(flex_component,  true ? {
28399    target: "em5sgkm5"
28400  } : 0)("box-sizing:border-box;position:relative;border-radius:", config_values.radiusSmall, ";padding-top:0;&:focus-within:not( :has( :is( ", Prefix, ", ", Suffix, " ):focus-within ) ){", BackdropUI, "{border-color:", COLORS.ui.borderFocus, ";box-shadow:", config_values.controlBoxShadowFocus, ";outline:2px solid transparent;outline-offset:-2px;}}" + ( true ? "" : 0));
28401  const containerDisabledStyles = ({
28402    disabled
28403  }) => {
28404    const backgroundColor = disabled ? COLORS.ui.backgroundDisabled : COLORS.ui.background;
28405    return /*#__PURE__*/emotion_react_browser_esm_css({
28406      backgroundColor
28407    },  true ? "" : 0,  true ? "" : 0);
28408  };
28409  var input_control_styles_ref =  true ? {
28410    name: "1d3w5wq",
28411    styles: "width:100%"
28412  } : 0;
28413  const containerWidthStyles = ({
28414    __unstableInputWidth,
28415    labelPosition
28416  }) => {
28417    if (!__unstableInputWidth) {
28418      return input_control_styles_ref;
28419    }
28420    if (labelPosition === 'side') {
28421      return '';
28422    }
28423    if (labelPosition === 'edge') {
28424      return /*#__PURE__*/emotion_react_browser_esm_css({
28425        flex: `0 0 $__unstableInputWidth}`
28426      },  true ? "" : 0,  true ? "" : 0);
28427    }
28428    return /*#__PURE__*/emotion_react_browser_esm_css({
28429      width: __unstableInputWidth
28430    },  true ? "" : 0,  true ? "" : 0);
28431  };
28432  const Container = /*#__PURE__*/emotion_styled_base_browser_esm("div",  true ? {
28433    target: "em5sgkm4"
28434  } : 0)("align-items:center;box-sizing:border-box;border-radius:inherit;display:flex;flex:1;position:relative;", containerDisabledStyles, " ", containerWidthStyles, ";" + ( true ? "" : 0));
28435  const disabledStyles = ({
28436    disabled
28437  }) => {
28438    if (!disabled) {
28439      return '';
28440    }
28441    return /*#__PURE__*/emotion_react_browser_esm_css({
28442      color: COLORS.ui.textDisabled
28443    },  true ? "" : 0,  true ? "" : 0);
28444  };
28445  const fontSizeStyles = ({
28446    inputSize: size
28447  }) => {
28448    const sizes = {
28449      default: '13px',
28450      small: '11px',
28451      compact: '13px',
28452      '__unstable-large': '13px'
28453    };
28454    const fontSize = sizes[size] || sizes.default;
28455    const fontSizeMobile = '16px';
28456    if (!fontSize) {
28457      return '';
28458    }
28459    return /*#__PURE__*/emotion_react_browser_esm_css("font-size:", fontSizeMobile, ";@media ( min-width: 600px ){font-size:", fontSize, ";}" + ( true ? "" : 0),  true ? "" : 0);
28460  };
28461  const getSizeConfig = ({
28462    inputSize: size,
28463    __next40pxDefaultSize
28464  }) => {
28465    // Paddings may be overridden by the custom paddings props.
28466    const sizes = {
28467      default: {
28468        height: 40,
28469        lineHeight: 1,
28470        minHeight: 40,
28471        paddingLeft: config_values.controlPaddingX,
28472        paddingRight: config_values.controlPaddingX
28473      },
28474      small: {
28475        height: 24,
28476        lineHeight: 1,
28477        minHeight: 24,
28478        paddingLeft: config_values.controlPaddingXSmall,
28479        paddingRight: config_values.controlPaddingXSmall
28480      },
28481      compact: {
28482        height: 32,
28483        lineHeight: 1,
28484        minHeight: 32,
28485        paddingLeft: config_values.controlPaddingXSmall,
28486        paddingRight: config_values.controlPaddingXSmall
28487      },
28488      '__unstable-large': {
28489        height: 40,
28490        lineHeight: 1,
28491        minHeight: 40,
28492        paddingLeft: config_values.controlPaddingX,
28493        paddingRight: config_values.controlPaddingX
28494      }
28495    };
28496    if (!__next40pxDefaultSize) {
28497      sizes.default = sizes.compact;
28498    }
28499    return sizes[size] || sizes.default;
28500  };
28501  const sizeStyles = props => {
28502    return /*#__PURE__*/emotion_react_browser_esm_css(getSizeConfig(props),  true ? "" : 0,  true ? "" : 0);
28503  };
28504  const customPaddings = ({
28505    paddingInlineStart,
28506    paddingInlineEnd
28507  }) => {
28508    return /*#__PURE__*/emotion_react_browser_esm_css({
28509      paddingInlineStart,
28510      paddingInlineEnd
28511    },  true ? "" : 0,  true ? "" : 0);
28512  };
28513  const dragStyles = ({
28514    isDragging,
28515    dragCursor
28516  }) => {
28517    let defaultArrowStyles;
28518    let activeDragCursorStyles;
28519    if (isDragging) {
28520      defaultArrowStyles = /*#__PURE__*/emotion_react_browser_esm_css("cursor:", dragCursor, ";user-select:none;&::-webkit-outer-spin-button,&::-webkit-inner-spin-button{-webkit-appearance:none!important;margin:0!important;}" + ( true ? "" : 0),  true ? "" : 0);
28521    }
28522    if (isDragging && dragCursor) {
28523      activeDragCursorStyles = /*#__PURE__*/emotion_react_browser_esm_css("&:active{cursor:", dragCursor, ";}" + ( true ? "" : 0),  true ? "" : 0);
28524    }
28525    return /*#__PURE__*/emotion_react_browser_esm_css(defaultArrowStyles, " ", activeDragCursorStyles, ";" + ( true ? "" : 0),  true ? "" : 0);
28526  };
28527  
28528  // TODO: Resolve need to use &&& to increase specificity
28529  // https://github.com/WordPress/gutenberg/issues/18483
28530  
28531  const Input = /*#__PURE__*/emotion_styled_base_browser_esm("input",  true ? {
28532    target: "em5sgkm3"
28533  } : 0)("&&&{background-color:transparent;box-sizing:border-box;border:none;box-shadow:none!important;color:", COLORS.theme.foreground, ";display:block;font-family:inherit;margin:0;outline:none;width:100%;", dragStyles, " ", disabledStyles, " ", fontSizeStyles, " ", sizeStyles, " ", customPaddings, " &::-webkit-input-placeholder{line-height:normal;}}" + ( true ? "" : 0));
28534  const BaseLabel = /*#__PURE__*/emotion_styled_base_browser_esm(text_component,  true ? {
28535    target: "em5sgkm2"
28536  } : 0)("&&&{", baseLabelTypography, ";box-sizing:border-box;display:block;padding-top:0;padding-bottom:0;max-width:100%;z-index:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}" + ( true ? "" : 0));
28537  const Label = props => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BaseLabel, {
28538    ...props,
28539    as: "label"
28540  });
28541  const LabelWrapper = /*#__PURE__*/emotion_styled_base_browser_esm(flex_item_component,  true ? {
28542    target: "em5sgkm1"
28543  } : 0)( true ? {
28544    name: "1b6uupn",
28545    styles: "max-width:calc( 100% - 10px )"
28546  } : 0);
28547  const prefixSuffixWrapperStyles = ({
28548    variant = 'default',
28549    size,
28550    __next40pxDefaultSize,
28551    isPrefix
28552  }) => {
28553    const {
28554      paddingLeft: padding
28555    } = getSizeConfig({
28556      inputSize: size,
28557      __next40pxDefaultSize
28558    });
28559    const paddingProperty = isPrefix ? 'paddingInlineStart' : 'paddingInlineEnd';
28560    if (variant === 'default') {
28561      return /*#__PURE__*/emotion_react_browser_esm_css({
28562        [paddingProperty]: padding
28563      },  true ? "" : 0,  true ? "" : 0);
28564    }
28565  
28566    // If variant is 'icon' or 'control'
28567    return /*#__PURE__*/emotion_react_browser_esm_css({
28568      display: 'flex',
28569      [paddingProperty]: padding - 4
28570    },  true ? "" : 0,  true ? "" : 0);
28571  };
28572  const PrefixSuffixWrapper = /*#__PURE__*/emotion_styled_base_browser_esm("div",  true ? {
28573    target: "em5sgkm0"
28574  } : 0)(prefixSuffixWrapperStyles, ";" + ( true ? "" : 0));
28575  
28576  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/input-control/backdrop.js
28577  /**
28578   * WordPress dependencies
28579   */
28580  
28581  /**
28582   * Internal dependencies
28583   */
28584  
28585  
28586  function Backdrop({
28587    disabled = false,
28588    isBorderless = false
28589  }) {
28590    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BackdropUI, {
28591      "aria-hidden": "true",
28592      className: "components-input-control__backdrop",
28593      disabled: disabled,
28594      isBorderless: isBorderless
28595    });
28596  }
28597  const MemoizedBackdrop = (0,external_wp_element_namespaceObject.memo)(Backdrop);
28598  /* harmony default export */ const backdrop = (MemoizedBackdrop);
28599  
28600  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/input-control/label.js
28601  /**
28602   * Internal dependencies
28603   */
28604  
28605  
28606  
28607  function label_Label({
28608    children,
28609    hideLabelFromVision,
28610    htmlFor,
28611    ...props
28612  }) {
28613    if (!children) {
28614      return null;
28615    }
28616    if (hideLabelFromVision) {
28617      return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(visually_hidden_component, {
28618        as: "label",
28619        htmlFor: htmlFor,
28620        children: children
28621      });
28622    }
28623    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(LabelWrapper, {
28624      children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Label, {
28625        htmlFor: htmlFor,
28626        ...props,
28627        children: children
28628      })
28629    });
28630  }
28631  
28632  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/utils/use-deprecated-props.js
28633  function useDeprecated36pxDefaultSizeProp(props) {
28634    const {
28635      __next36pxDefaultSize,
28636      __next40pxDefaultSize,
28637      ...otherProps
28638    } = props;
28639    return {
28640      ...otherProps,
28641      __next40pxDefaultSize: __next40pxDefaultSize !== null && __next40pxDefaultSize !== void 0 ? __next40pxDefaultSize : __next36pxDefaultSize
28642    };
28643  }
28644  
28645  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/input-control/input-base.js
28646  /**
28647   * External dependencies
28648   */
28649  
28650  /**
28651   * WordPress dependencies
28652   */
28653  
28654  
28655  
28656  /**
28657   * Internal dependencies
28658   */
28659  
28660  
28661  
28662  
28663  
28664  
28665  
28666  function useUniqueId(idProp) {
28667    const instanceId = (0,external_wp_compose_namespaceObject.useInstanceId)(InputBase);
28668    const id = `input-base-control-$instanceId}`;
28669    return idProp || id;
28670  }
28671  
28672  // Adapter to map props for the new ui/flex component.
28673  function getUIFlexProps(labelPosition) {
28674    const props = {};
28675    switch (labelPosition) {
28676      case 'top':
28677        props.direction = 'column';
28678        props.expanded = false;
28679        props.gap = 0;
28680        break;
28681      case 'bottom':
28682        props.direction = 'column-reverse';
28683        props.expanded = false;
28684        props.gap = 0;
28685        break;
28686      case 'edge':
28687        props.justify = 'space-between';
28688        break;
28689    }
28690    return props;
28691  }
28692  function InputBase(props, ref) {
28693    const {
28694      __next40pxDefaultSize,
28695      __unstableInputWidth,
28696      children,
28697      className,
28698      disabled = false,
28699      hideLabelFromVision = false,
28700      labelPosition,
28701      id: idProp,
28702      isBorderless = false,
28703      label,
28704      prefix,
28705      size = 'default',
28706      suffix,
28707      ...restProps
28708    } = useDeprecated36pxDefaultSizeProp(useContextSystem(props, 'InputBase'));
28709    const id = useUniqueId(idProp);
28710    const hideLabel = hideLabelFromVision || !label;
28711    const prefixSuffixContextValue = (0,external_wp_element_namespaceObject.useMemo)(() => {
28712      return {
28713        InputControlPrefixWrapper: {
28714          __next40pxDefaultSize,
28715          size
28716        },
28717        InputControlSuffixWrapper: {
28718          __next40pxDefaultSize,
28719          size
28720        }
28721      };
28722    }, [__next40pxDefaultSize, size]);
28723    return (
28724      /*#__PURE__*/
28725      // @ts-expect-error The `direction` prop from Flex (FlexDirection) conflicts with legacy SVGAttributes `direction` (string) that come from React intrinsic prop definitions.
28726      (0,external_ReactJSXRuntime_namespaceObject.jsxs)(Root, {
28727        ...restProps,
28728        ...getUIFlexProps(labelPosition),
28729        className: className,
28730        gap: 2,
28731        ref: ref,
28732        children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(label_Label, {
28733          className: "components-input-control__label",
28734          hideLabelFromVision: hideLabelFromVision,
28735          labelPosition: labelPosition,
28736          htmlFor: id,
28737          children: label
28738        }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(Container, {
28739          __unstableInputWidth: __unstableInputWidth,
28740          className: "components-input-control__container",
28741          disabled: disabled,
28742          hideLabel: hideLabel,
28743          labelPosition: labelPosition,
28744          children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(ContextSystemProvider, {
28745            value: prefixSuffixContextValue,
28746            children: [prefix && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Prefix, {
28747              className: "components-input-control__prefix",
28748              children: prefix
28749            }), children, suffix && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Suffix, {
28750              className: "components-input-control__suffix",
28751              children: suffix
28752            })]
28753          }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(backdrop, {
28754            disabled: disabled,
28755            isBorderless: isBorderless
28756          })]
28757        })]
28758      })
28759    );
28760  }
28761  
28762  /**
28763   * `InputBase` is an internal component used to style the standard borders for an input,
28764   * as well as handle the layout for prefix/suffix elements.
28765   */
28766  /* harmony default export */ const input_base = (contextConnect(InputBase, 'InputBase'));
28767  
28768  ;// CONCATENATED MODULE: ./node_modules/@use-gesture/core/dist/maths-0ab39ae9.esm.js
28769  function maths_0ab39ae9_esm_clamp(v, min, max) {
28770    return Math.max(min, Math.min(v, max));
28771  }
28772  const V = {
28773    toVector(v, fallback) {
28774      if (v === undefined) v = fallback;
28775      return Array.isArray(v) ? v : [v, v];
28776    },
28777    add(v1, v2) {
28778      return [v1[0] + v2[0], v1[1] + v2[1]];
28779    },
28780    sub(v1, v2) {
28781      return [v1[0] - v2[0], v1[1] - v2[1]];
28782    },
28783    addTo(v1, v2) {
28784      v1[0] += v2[0];
28785      v1[1] += v2[1];
28786    },
28787    subTo(v1, v2) {
28788      v1[0] -= v2[0];
28789      v1[1] -= v2[1];
28790    }
28791  };
28792  function rubberband(distance, dimension, constant) {
28793    if (dimension === 0 || Math.abs(dimension) === Infinity) return Math.pow(distance, constant * 5);
28794    return distance * dimension * constant / (dimension + constant * distance);
28795  }
28796  function rubberbandIfOutOfBounds(position, min, max, constant = 0.15) {
28797    if (constant === 0) return maths_0ab39ae9_esm_clamp(position, min, max);
28798    if (position < min) return -rubberband(min - position, max - min, constant) + min;
28799    if (position > max) return +rubberband(position - max, max - min, constant) + max;
28800    return position;
28801  }
28802  function computeRubberband(bounds, [Vx, Vy], [Rx, Ry]) {
28803    const [[X0, X1], [Y0, Y1]] = bounds;
28804    return [rubberbandIfOutOfBounds(Vx, X0, X1, Rx), rubberbandIfOutOfBounds(Vy, Y0, Y1, Ry)];
28805  }
28806  
28807  
28808  
28809  ;// CONCATENATED MODULE: ./node_modules/@use-gesture/core/dist/actions-fe213e88.esm.js
28810  
28811  
28812  function _toPrimitive(input, hint) {
28813    if (typeof input !== "object" || input === null) return input;
28814    var prim = input[Symbol.toPrimitive];
28815    if (prim !== undefined) {
28816      var res = prim.call(input, hint || "default");
28817      if (typeof res !== "object") return res;
28818      throw new TypeError("@@toPrimitive must return a primitive value.");
28819    }
28820    return (hint === "string" ? String : Number)(input);
28821  }
28822  
28823  function _toPropertyKey(arg) {
28824    var key = _toPrimitive(arg, "string");
28825    return typeof key === "symbol" ? key : String(key);
28826  }
28827  
28828  function _defineProperty(obj, key, value) {
28829    key = _toPropertyKey(key);
28830    if (key in obj) {
28831      Object.defineProperty(obj, key, {
28832        value: value,
28833        enumerable: true,
28834        configurable: true,
28835        writable: true
28836      });
28837    } else {
28838      obj[key] = value;
28839    }
28840    return obj;
28841  }
28842  
28843  function ownKeys(e, r) {
28844    var t = Object.keys(e);
28845    if (Object.getOwnPropertySymbols) {
28846      var o = Object.getOwnPropertySymbols(e);
28847      r && (o = o.filter(function (r) {
28848        return Object.getOwnPropertyDescriptor(e, r).enumerable;
28849      })), t.push.apply(t, o);
28850    }
28851    return t;
28852  }
28853  function _objectSpread2(e) {
28854    for (var r = 1; r < arguments.length; r++) {
28855      var t = null != arguments[r] ? arguments[r] : {};
28856      r % 2 ? ownKeys(Object(t), !0).forEach(function (r) {
28857        _defineProperty(e, r, t[r]);
28858      }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) {
28859        Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r));
28860      });
28861    }
28862    return e;
28863  }
28864  
28865  const EVENT_TYPE_MAP = {
28866    pointer: {
28867      start: 'down',
28868      change: 'move',
28869      end: 'up'
28870    },
28871    mouse: {
28872      start: 'down',
28873      change: 'move',
28874      end: 'up'
28875    },
28876    touch: {
28877      start: 'start',
28878      change: 'move',
28879      end: 'end'
28880    },
28881    gesture: {
28882      start: 'start',
28883      change: 'change',
28884      end: 'end'
28885    }
28886  };
28887  function capitalize(string) {
28888    if (!string) return '';
28889    return string[0].toUpperCase() + string.slice(1);
28890  }
28891  const actionsWithoutCaptureSupported = ['enter', 'leave'];
28892  function hasCapture(capture = false, actionKey) {
28893    return capture && !actionsWithoutCaptureSupported.includes(actionKey);
28894  }
28895  function toHandlerProp(device, action = '', capture = false) {
28896    const deviceProps = EVENT_TYPE_MAP[device];
28897    const actionKey = deviceProps ? deviceProps[action] || action : action;
28898    return 'on' + capitalize(device) + capitalize(actionKey) + (hasCapture(capture, actionKey) ? 'Capture' : '');
28899  }
28900  const pointerCaptureEvents = ['gotpointercapture', 'lostpointercapture'];
28901  function parseProp(prop) {
28902    let eventKey = prop.substring(2).toLowerCase();
28903    const passive = !!~eventKey.indexOf('passive');
28904    if (passive) eventKey = eventKey.replace('passive', '');
28905    const captureKey = pointerCaptureEvents.includes(eventKey) ? 'capturecapture' : 'capture';
28906    const capture = !!~eventKey.indexOf(captureKey);
28907    if (capture) eventKey = eventKey.replace('capture', '');
28908    return {
28909      device: eventKey,
28910      capture,
28911      passive
28912    };
28913  }
28914  function toDomEventType(device, action = '') {
28915    const deviceProps = EVENT_TYPE_MAP[device];
28916    const actionKey = deviceProps ? deviceProps[action] || action : action;
28917    return device + actionKey;
28918  }
28919  function isTouch(event) {
28920    return 'touches' in event;
28921  }
28922  function getPointerType(event) {
28923    if (isTouch(event)) return 'touch';
28924    if ('pointerType' in event) return event.pointerType;
28925    return 'mouse';
28926  }
28927  function getCurrentTargetTouchList(event) {
28928    return Array.from(event.touches).filter(e => {
28929      var _event$currentTarget, _event$currentTarget$;
28930      return e.target === event.currentTarget || ((_event$currentTarget = event.currentTarget) === null || _event$currentTarget === void 0 || (_event$currentTarget$ = _event$currentTarget.contains) === null || _event$currentTarget$ === void 0 ? void 0 : _event$currentTarget$.call(_event$currentTarget, e.target));
28931    });
28932  }
28933  function getTouchList(event) {
28934    return event.type === 'touchend' || event.type === 'touchcancel' ? event.changedTouches : event.targetTouches;
28935  }
28936  function getValueEvent(event) {
28937    return isTouch(event) ? getTouchList(event)[0] : event;
28938  }
28939  function distanceAngle(P1, P2) {
28940    try {
28941      const dx = P2.clientX - P1.clientX;
28942      const dy = P2.clientY - P1.clientY;
28943      const cx = (P2.clientX + P1.clientX) / 2;
28944      const cy = (P2.clientY + P1.clientY) / 2;
28945      const distance = Math.hypot(dx, dy);
28946      const angle = -(Math.atan2(dx, dy) * 180) / Math.PI;
28947      const origin = [cx, cy];
28948      return {
28949        angle,
28950        distance,
28951        origin
28952      };
28953    } catch (_unused) {}
28954    return null;
28955  }
28956  function touchIds(event) {
28957    return getCurrentTargetTouchList(event).map(touch => touch.identifier);
28958  }
28959  function touchDistanceAngle(event, ids) {
28960    const [P1, P2] = Array.from(event.touches).filter(touch => ids.includes(touch.identifier));
28961    return distanceAngle(P1, P2);
28962  }
28963  function pointerId(event) {
28964    const valueEvent = getValueEvent(event);
28965    return isTouch(event) ? valueEvent.identifier : valueEvent.pointerId;
28966  }
28967  function pointerValues(event) {
28968    const valueEvent = getValueEvent(event);
28969    return [valueEvent.clientX, valueEvent.clientY];
28970  }
28971  const LINE_HEIGHT = 40;
28972  const PAGE_HEIGHT = 800;
28973  function wheelValues(event) {
28974    let {
28975      deltaX,
28976      deltaY,
28977      deltaMode
28978    } = event;
28979    if (deltaMode === 1) {
28980      deltaX *= LINE_HEIGHT;
28981      deltaY *= LINE_HEIGHT;
28982    } else if (deltaMode === 2) {
28983      deltaX *= PAGE_HEIGHT;
28984      deltaY *= PAGE_HEIGHT;
28985    }
28986    return [deltaX, deltaY];
28987  }
28988  function scrollValues(event) {
28989    var _ref, _ref2;
28990    const {
28991      scrollX,
28992      scrollY,
28993      scrollLeft,
28994      scrollTop
28995    } = event.currentTarget;
28996    return [(_ref = scrollX !== null && scrollX !== void 0 ? scrollX : scrollLeft) !== null && _ref !== void 0 ? _ref : 0, (_ref2 = scrollY !== null && scrollY !== void 0 ? scrollY : scrollTop) !== null && _ref2 !== void 0 ? _ref2 : 0];
28997  }
28998  function getEventDetails(event) {
28999    const payload = {};
29000    if ('buttons' in event) payload.buttons = event.buttons;
29001    if ('shiftKey' in event) {
29002      const {
29003        shiftKey,
29004        altKey,
29005        metaKey,
29006        ctrlKey
29007      } = event;
29008      Object.assign(payload, {
29009        shiftKey,
29010        altKey,
29011        metaKey,
29012        ctrlKey
29013      });
29014    }
29015    return payload;
29016  }
29017  
29018  function call(v, ...args) {
29019    if (typeof v === 'function') {
29020      return v(...args);
29021    } else {
29022      return v;
29023    }
29024  }
29025  function actions_fe213e88_esm_noop() {}
29026  function actions_fe213e88_esm_chain(...fns) {
29027    if (fns.length === 0) return actions_fe213e88_esm_noop;
29028    if (fns.length === 1) return fns[0];
29029    return function () {
29030      let result;
29031      for (const fn of fns) {
29032        result = fn.apply(this, arguments) || result;
29033      }
29034      return result;
29035    };
29036  }
29037  function assignDefault(value, fallback) {
29038    return Object.assign({}, fallback, value || {});
29039  }
29040  
29041  const BEFORE_LAST_KINEMATICS_DELAY = 32;
29042  class Engine {
29043    constructor(ctrl, args, key) {
29044      this.ctrl = ctrl;
29045      this.args = args;
29046      this.key = key;
29047      if (!this.state) {
29048        this.state = {};
29049        this.computeValues([0, 0]);
29050        this.computeInitial();
29051        if (this.init) this.init();
29052        this.reset();
29053      }
29054    }
29055    get state() {
29056      return this.ctrl.state[this.key];
29057    }
29058    set state(state) {
29059      this.ctrl.state[this.key] = state;
29060    }
29061    get shared() {
29062      return this.ctrl.state.shared;
29063    }
29064    get eventStore() {
29065      return this.ctrl.gestureEventStores[this.key];
29066    }
29067    get timeoutStore() {
29068      return this.ctrl.gestureTimeoutStores[this.key];
29069    }
29070    get config() {
29071      return this.ctrl.config[this.key];
29072    }
29073    get sharedConfig() {
29074      return this.ctrl.config.shared;
29075    }
29076    get handler() {
29077      return this.ctrl.handlers[this.key];
29078    }
29079    reset() {
29080      const {
29081        state,
29082        shared,
29083        ingKey,
29084        args
29085      } = this;
29086      shared[ingKey] = state._active = state.active = state._blocked = state._force = false;
29087      state._step = [false, false];
29088      state.intentional = false;
29089      state._movement = [0, 0];
29090      state._distance = [0, 0];
29091      state._direction = [0, 0];
29092      state._delta = [0, 0];
29093      state._bounds = [[-Infinity, Infinity], [-Infinity, Infinity]];
29094      state.args = args;
29095      state.axis = undefined;
29096      state.memo = undefined;
29097      state.elapsedTime = state.timeDelta = 0;
29098      state.direction = [0, 0];
29099      state.distance = [0, 0];
29100      state.overflow = [0, 0];
29101      state._movementBound = [false, false];
29102      state.velocity = [0, 0];
29103      state.movement = [0, 0];
29104      state.delta = [0, 0];
29105      state.timeStamp = 0;
29106    }
29107    start(event) {
29108      const state = this.state;
29109      const config = this.config;
29110      if (!state._active) {
29111        this.reset();
29112        this.computeInitial();
29113        state._active = true;
29114        state.target = event.target;
29115        state.currentTarget = event.currentTarget;
29116        state.lastOffset = config.from ? call(config.from, state) : state.offset;
29117        state.offset = state.lastOffset;
29118        state.startTime = state.timeStamp = event.timeStamp;
29119      }
29120    }
29121    computeValues(values) {
29122      const state = this.state;
29123      state._values = values;
29124      state.values = this.config.transform(values);
29125    }
29126    computeInitial() {
29127      const state = this.state;
29128      state._initial = state._values;
29129      state.initial = state.values;
29130    }
29131    compute(event) {
29132      const {
29133        state,
29134        config,
29135        shared
29136      } = this;
29137      state.args = this.args;
29138      let dt = 0;
29139      if (event) {
29140        state.event = event;
29141        if (config.preventDefault && event.cancelable) state.event.preventDefault();
29142        state.type = event.type;
29143        shared.touches = this.ctrl.pointerIds.size || this.ctrl.touchIds.size;
29144        shared.locked = !!document.pointerLockElement;
29145        Object.assign(shared, getEventDetails(event));
29146        shared.down = shared.pressed = shared.buttons % 2 === 1 || shared.touches > 0;
29147        dt = event.timeStamp - state.timeStamp;
29148        state.timeStamp = event.timeStamp;
29149        state.elapsedTime = state.timeStamp - state.startTime;
29150      }
29151      if (state._active) {
29152        const _absoluteDelta = state._delta.map(Math.abs);
29153        V.addTo(state._distance, _absoluteDelta);
29154      }
29155      if (this.axisIntent) this.axisIntent(event);
29156      const [_m0, _m1] = state._movement;
29157      const [t0, t1] = config.threshold;
29158      const {
29159        _step,
29160        values
29161      } = state;
29162      if (config.hasCustomTransform) {
29163        if (_step[0] === false) _step[0] = Math.abs(_m0) >= t0 && values[0];
29164        if (_step[1] === false) _step[1] = Math.abs(_m1) >= t1 && values[1];
29165      } else {
29166        if (_step[0] === false) _step[0] = Math.abs(_m0) >= t0 && Math.sign(_m0) * t0;
29167        if (_step[1] === false) _step[1] = Math.abs(_m1) >= t1 && Math.sign(_m1) * t1;
29168      }
29169      state.intentional = _step[0] !== false || _step[1] !== false;
29170      if (!state.intentional) return;
29171      const movement = [0, 0];
29172      if (config.hasCustomTransform) {
29173        const [v0, v1] = values;
29174        movement[0] = _step[0] !== false ? v0 - _step[0] : 0;
29175        movement[1] = _step[1] !== false ? v1 - _step[1] : 0;
29176      } else {
29177        movement[0] = _step[0] !== false ? _m0 - _step[0] : 0;
29178        movement[1] = _step[1] !== false ? _m1 - _step[1] : 0;
29179      }
29180      if (this.restrictToAxis && !state._blocked) this.restrictToAxis(movement);
29181      const previousOffset = state.offset;
29182      const gestureIsActive = state._active && !state._blocked || state.active;
29183      if (gestureIsActive) {
29184        state.first = state._active && !state.active;
29185        state.last = !state._active && state.active;
29186        state.active = shared[this.ingKey] = state._active;
29187        if (event) {
29188          if (state.first) {
29189            if ('bounds' in config) state._bounds = call(config.bounds, state);
29190            if (this.setup) this.setup();
29191          }
29192          state.movement = movement;
29193          this.computeOffset();
29194        }
29195      }
29196      const [ox, oy] = state.offset;
29197      const [[x0, x1], [y0, y1]] = state._bounds;
29198      state.overflow = [ox < x0 ? -1 : ox > x1 ? 1 : 0, oy < y0 ? -1 : oy > y1 ? 1 : 0];
29199      state._movementBound[0] = state.overflow[0] ? state._movementBound[0] === false ? state._movement[0] : state._movementBound[0] : false;
29200      state._movementBound[1] = state.overflow[1] ? state._movementBound[1] === false ? state._movement[1] : state._movementBound[1] : false;
29201      const rubberband = state._active ? config.rubberband || [0, 0] : [0, 0];
29202      state.offset = computeRubberband(state._bounds, state.offset, rubberband);
29203      state.delta = V.sub(state.offset, previousOffset);
29204      this.computeMovement();
29205      if (gestureIsActive && (!state.last || dt > BEFORE_LAST_KINEMATICS_DELAY)) {
29206        state.delta = V.sub(state.offset, previousOffset);
29207        const absoluteDelta = state.delta.map(Math.abs);
29208        V.addTo(state.distance, absoluteDelta);
29209        state.direction = state.delta.map(Math.sign);
29210        state._direction = state._delta.map(Math.sign);
29211        if (!state.first && dt > 0) {
29212          state.velocity = [absoluteDelta[0] / dt, absoluteDelta[1] / dt];
29213          state.timeDelta = dt;
29214        }
29215      }
29216    }
29217    emit() {
29218      const state = this.state;
29219      const shared = this.shared;
29220      const config = this.config;
29221      if (!state._active) this.clean();
29222      if ((state._blocked || !state.intentional) && !state._force && !config.triggerAllEvents) return;
29223      const memo = this.handler(_objectSpread2(_objectSpread2(_objectSpread2({}, shared), state), {}, {
29224        [this.aliasKey]: state.values
29225      }));
29226      if (memo !== undefined) state.memo = memo;
29227    }
29228    clean() {
29229      this.eventStore.clean();
29230      this.timeoutStore.clean();
29231    }
29232  }
29233  
29234  function selectAxis([dx, dy], threshold) {
29235    const absDx = Math.abs(dx);
29236    const absDy = Math.abs(dy);
29237    if (absDx > absDy && absDx > threshold) {
29238      return 'x';
29239    }
29240    if (absDy > absDx && absDy > threshold) {
29241      return 'y';
29242    }
29243    return undefined;
29244  }
29245  class CoordinatesEngine extends Engine {
29246    constructor(...args) {
29247      super(...args);
29248      _defineProperty(this, "aliasKey", 'xy');
29249    }
29250    reset() {
29251      super.reset();
29252      this.state.axis = undefined;
29253    }
29254    init() {
29255      this.state.offset = [0, 0];
29256      this.state.lastOffset = [0, 0];
29257    }
29258    computeOffset() {
29259      this.state.offset = V.add(this.state.lastOffset, this.state.movement);
29260    }
29261    computeMovement() {
29262      this.state.movement = V.sub(this.state.offset, this.state.lastOffset);
29263    }
29264    axisIntent(event) {
29265      const state = this.state;
29266      const config = this.config;
29267      if (!state.axis && event) {
29268        const threshold = typeof config.axisThreshold === 'object' ? config.axisThreshold[getPointerType(event)] : config.axisThreshold;
29269        state.axis = selectAxis(state._movement, threshold);
29270      }
29271      state._blocked = (config.lockDirection || !!config.axis) && !state.axis || !!config.axis && config.axis !== state.axis;
29272    }
29273    restrictToAxis(v) {
29274      if (this.config.axis || this.config.lockDirection) {
29275        switch (this.state.axis) {
29276          case 'x':
29277            v[1] = 0;
29278            break;
29279          case 'y':
29280            v[0] = 0;
29281            break;
29282        }
29283      }
29284    }
29285  }
29286  
29287  const actions_fe213e88_esm_identity = v => v;
29288  const DEFAULT_RUBBERBAND = 0.15;
29289  const commonConfigResolver = {
29290    enabled(value = true) {
29291      return value;
29292    },
29293    eventOptions(value, _k, config) {
29294      return _objectSpread2(_objectSpread2({}, config.shared.eventOptions), value);
29295    },
29296    preventDefault(value = false) {
29297      return value;
29298    },
29299    triggerAllEvents(value = false) {
29300      return value;
29301    },
29302    rubberband(value = 0) {
29303      switch (value) {
29304        case true:
29305          return [DEFAULT_RUBBERBAND, DEFAULT_RUBBERBAND];
29306        case false:
29307          return [0, 0];
29308        default:
29309          return V.toVector(value);
29310      }
29311    },
29312    from(value) {
29313      if (typeof value === 'function') return value;
29314      if (value != null) return V.toVector(value);
29315    },
29316    transform(value, _k, config) {
29317      const transform = value || config.shared.transform;
29318      this.hasCustomTransform = !!transform;
29319      if (false) {}
29320      return transform || actions_fe213e88_esm_identity;
29321    },
29322    threshold(value) {
29323      return V.toVector(value, 0);
29324    }
29325  };
29326  if (false) {}
29327  
29328  const DEFAULT_AXIS_THRESHOLD = 0;
29329  const coordinatesConfigResolver = _objectSpread2(_objectSpread2({}, commonConfigResolver), {}, {
29330    axis(_v, _k, {
29331      axis
29332    }) {
29333      this.lockDirection = axis === 'lock';
29334      if (!this.lockDirection) return axis;
29335    },
29336    axisThreshold(value = DEFAULT_AXIS_THRESHOLD) {
29337      return value;
29338    },
29339    bounds(value = {}) {
29340      if (typeof value === 'function') {
29341        return state => coordinatesConfigResolver.bounds(value(state));
29342      }
29343      if ('current' in value) {
29344        return () => value.current;
29345      }
29346      if (typeof HTMLElement === 'function' && value instanceof HTMLElement) {
29347        return value;
29348      }
29349      const {
29350        left = -Infinity,
29351        right = Infinity,
29352        top = -Infinity,
29353        bottom = Infinity
29354      } = value;
29355      return [[left, right], [top, bottom]];
29356    }
29357  });
29358  
29359  const KEYS_DELTA_MAP = {
29360    ArrowRight: (displacement, factor = 1) => [displacement * factor, 0],
29361    ArrowLeft: (displacement, factor = 1) => [-1 * displacement * factor, 0],
29362    ArrowUp: (displacement, factor = 1) => [0, -1 * displacement * factor],
29363    ArrowDown: (displacement, factor = 1) => [0, displacement * factor]
29364  };
29365  class DragEngine extends CoordinatesEngine {
29366    constructor(...args) {
29367      super(...args);
29368      _defineProperty(this, "ingKey", 'dragging');
29369    }
29370    reset() {
29371      super.reset();
29372      const state = this.state;
29373      state._pointerId = undefined;
29374      state._pointerActive = false;
29375      state._keyboardActive = false;
29376      state._preventScroll = false;
29377      state._delayed = false;
29378      state.swipe = [0, 0];
29379      state.tap = false;
29380      state.canceled = false;
29381      state.cancel = this.cancel.bind(this);
29382    }
29383    setup() {
29384      const state = this.state;
29385      if (state._bounds instanceof HTMLElement) {
29386        const boundRect = state._bounds.getBoundingClientRect();
29387        const targetRect = state.currentTarget.getBoundingClientRect();
29388        const _bounds = {
29389          left: boundRect.left - targetRect.left + state.offset[0],
29390          right: boundRect.right - targetRect.right + state.offset[0],
29391          top: boundRect.top - targetRect.top + state.offset[1],
29392          bottom: boundRect.bottom - targetRect.bottom + state.offset[1]
29393        };
29394        state._bounds = coordinatesConfigResolver.bounds(_bounds);
29395      }
29396    }
29397    cancel() {
29398      const state = this.state;
29399      if (state.canceled) return;
29400      state.canceled = true;
29401      state._active = false;
29402      setTimeout(() => {
29403        this.compute();
29404        this.emit();
29405      }, 0);
29406    }
29407    setActive() {
29408      this.state._active = this.state._pointerActive || this.state._keyboardActive;
29409    }
29410    clean() {
29411      this.pointerClean();
29412      this.state._pointerActive = false;
29413      this.state._keyboardActive = false;
29414      super.clean();
29415    }
29416    pointerDown(event) {
29417      const config = this.config;
29418      const state = this.state;
29419      if (event.buttons != null && (Array.isArray(config.pointerButtons) ? !config.pointerButtons.includes(event.buttons) : config.pointerButtons !== -1 && config.pointerButtons !== event.buttons)) return;
29420      const ctrlIds = this.ctrl.setEventIds(event);
29421      if (config.pointerCapture) {
29422        event.target.setPointerCapture(event.pointerId);
29423      }
29424      if (ctrlIds && ctrlIds.size > 1 && state._pointerActive) return;
29425      this.start(event);
29426      this.setupPointer(event);
29427      state._pointerId = pointerId(event);
29428      state._pointerActive = true;
29429      this.computeValues(pointerValues(event));
29430      this.computeInitial();
29431      if (config.preventScrollAxis && getPointerType(event) !== 'mouse') {
29432        state._active = false;
29433        this.setupScrollPrevention(event);
29434      } else if (config.delay > 0) {
29435        this.setupDelayTrigger(event);
29436        if (config.triggerAllEvents) {
29437          this.compute(event);
29438          this.emit();
29439        }
29440      } else {
29441        this.startPointerDrag(event);
29442      }
29443    }
29444    startPointerDrag(event) {
29445      const state = this.state;
29446      state._active = true;
29447      state._preventScroll = true;
29448      state._delayed = false;
29449      this.compute(event);
29450      this.emit();
29451    }
29452    pointerMove(event) {
29453      const state = this.state;
29454      const config = this.config;
29455      if (!state._pointerActive) return;
29456      const id = pointerId(event);
29457      if (state._pointerId !== undefined && id !== state._pointerId) return;
29458      const _values = pointerValues(event);
29459      if (document.pointerLockElement === event.target) {
29460        state._delta = [event.movementX, event.movementY];
29461      } else {
29462        state._delta = V.sub(_values, state._values);
29463        this.computeValues(_values);
29464      }
29465      V.addTo(state._movement, state._delta);
29466      this.compute(event);
29467      if (state._delayed && state.intentional) {
29468        this.timeoutStore.remove('dragDelay');
29469        state.active = false;
29470        this.startPointerDrag(event);
29471        return;
29472      }
29473      if (config.preventScrollAxis && !state._preventScroll) {
29474        if (state.axis) {
29475          if (state.axis === config.preventScrollAxis || config.preventScrollAxis === 'xy') {
29476            state._active = false;
29477            this.clean();
29478            return;
29479          } else {
29480            this.timeoutStore.remove('startPointerDrag');
29481            this.startPointerDrag(event);
29482            return;
29483          }
29484        } else {
29485          return;
29486        }
29487      }
29488      this.emit();
29489    }
29490    pointerUp(event) {
29491      this.ctrl.setEventIds(event);
29492      try {
29493        if (this.config.pointerCapture && event.target.hasPointerCapture(event.pointerId)) {
29494          ;
29495          event.target.releasePointerCapture(event.pointerId);
29496        }
29497      } catch (_unused) {
29498        if (false) {}
29499      }
29500      const state = this.state;
29501      const config = this.config;
29502      if (!state._active || !state._pointerActive) return;
29503      const id = pointerId(event);
29504      if (state._pointerId !== undefined && id !== state._pointerId) return;
29505      this.state._pointerActive = false;
29506      this.setActive();
29507      this.compute(event);
29508      const [dx, dy] = state._distance;
29509      state.tap = dx <= config.tapsThreshold && dy <= config.tapsThreshold;
29510      if (state.tap && config.filterTaps) {
29511        state._force = true;
29512      } else {
29513        const [_dx, _dy] = state._delta;
29514        const [_mx, _my] = state._movement;
29515        const [svx, svy] = config.swipe.velocity;
29516        const [sx, sy] = config.swipe.distance;
29517        const sdt = config.swipe.duration;
29518        if (state.elapsedTime < sdt) {
29519          const _vx = Math.abs(_dx / state.timeDelta);
29520          const _vy = Math.abs(_dy / state.timeDelta);
29521          if (_vx > svx && Math.abs(_mx) > sx) state.swipe[0] = Math.sign(_dx);
29522          if (_vy > svy && Math.abs(_my) > sy) state.swipe[1] = Math.sign(_dy);
29523        }
29524      }
29525      this.emit();
29526    }
29527    pointerClick(event) {
29528      if (!this.state.tap && event.detail > 0) {
29529        event.preventDefault();
29530        event.stopPropagation();
29531      }
29532    }
29533    setupPointer(event) {
29534      const config = this.config;
29535      const device = config.device;
29536      if (false) {}
29537      if (config.pointerLock) {
29538        event.currentTarget.requestPointerLock();
29539      }
29540      if (!config.pointerCapture) {
29541        this.eventStore.add(this.sharedConfig.window, device, 'change', this.pointerMove.bind(this));
29542        this.eventStore.add(this.sharedConfig.window, device, 'end', this.pointerUp.bind(this));
29543        this.eventStore.add(this.sharedConfig.window, device, 'cancel', this.pointerUp.bind(this));
29544      }
29545    }
29546    pointerClean() {
29547      if (this.config.pointerLock && document.pointerLockElement === this.state.currentTarget) {
29548        document.exitPointerLock();
29549      }
29550    }
29551    preventScroll(event) {
29552      if (this.state._preventScroll && event.cancelable) {
29553        event.preventDefault();
29554      }
29555    }
29556    setupScrollPrevention(event) {
29557      this.state._preventScroll = false;
29558      persistEvent(event);
29559      const remove = this.eventStore.add(this.sharedConfig.window, 'touch', 'change', this.preventScroll.bind(this), {
29560        passive: false
29561      });
29562      this.eventStore.add(this.sharedConfig.window, 'touch', 'end', remove);
29563      this.eventStore.add(this.sharedConfig.window, 'touch', 'cancel', remove);
29564      this.timeoutStore.add('startPointerDrag', this.startPointerDrag.bind(this), this.config.preventScrollDelay, event);
29565    }
29566    setupDelayTrigger(event) {
29567      this.state._delayed = true;
29568      this.timeoutStore.add('dragDelay', () => {
29569        this.state._step = [0, 0];
29570        this.startPointerDrag(event);
29571      }, this.config.delay);
29572    }
29573    keyDown(event) {
29574      const deltaFn = KEYS_DELTA_MAP[event.key];
29575      if (deltaFn) {
29576        const state = this.state;
29577        const factor = event.shiftKey ? 10 : event.altKey ? 0.1 : 1;
29578        this.start(event);
29579        state._delta = deltaFn(this.config.keyboardDisplacement, factor);
29580        state._keyboardActive = true;
29581        V.addTo(state._movement, state._delta);
29582        this.compute(event);
29583        this.emit();
29584      }
29585    }
29586    keyUp(event) {
29587      if (!(event.key in KEYS_DELTA_MAP)) return;
29588      this.state._keyboardActive = false;
29589      this.setActive();
29590      this.compute(event);
29591      this.emit();
29592    }
29593    bind(bindFunction) {
29594      const device = this.config.device;
29595      bindFunction(device, 'start', this.pointerDown.bind(this));
29596      if (this.config.pointerCapture) {
29597        bindFunction(device, 'change', this.pointerMove.bind(this));
29598        bindFunction(device, 'end', this.pointerUp.bind(this));
29599        bindFunction(device, 'cancel', this.pointerUp.bind(this));
29600        bindFunction('lostPointerCapture', '', this.pointerUp.bind(this));
29601      }
29602      if (this.config.keys) {
29603        bindFunction('key', 'down', this.keyDown.bind(this));
29604        bindFunction('key', 'up', this.keyUp.bind(this));
29605      }
29606      if (this.config.filterTaps) {
29607        bindFunction('click', '', this.pointerClick.bind(this), {
29608          capture: true,
29609          passive: false
29610        });
29611      }
29612    }
29613  }
29614  function persistEvent(event) {
29615    'persist' in event && typeof event.persist === 'function' && event.persist();
29616  }
29617  
29618  const actions_fe213e88_esm_isBrowser = typeof window !== 'undefined' && window.document && window.document.createElement;
29619  function supportsTouchEvents() {
29620    return actions_fe213e88_esm_isBrowser && 'ontouchstart' in window;
29621  }
29622  function isTouchScreen() {
29623    return supportsTouchEvents() || actions_fe213e88_esm_isBrowser && window.navigator.maxTouchPoints > 1;
29624  }
29625  function supportsPointerEvents() {
29626    return actions_fe213e88_esm_isBrowser && 'onpointerdown' in window;
29627  }
29628  function supportsPointerLock() {
29629    return actions_fe213e88_esm_isBrowser && 'exitPointerLock' in window.document;
29630  }
29631  function supportsGestureEvents() {
29632    try {
29633      return 'constructor' in GestureEvent;
29634    } catch (e) {
29635      return false;
29636    }
29637  }
29638  const SUPPORT = {
29639    isBrowser: actions_fe213e88_esm_isBrowser,
29640    gesture: supportsGestureEvents(),
29641    touch: supportsTouchEvents(),
29642    touchscreen: isTouchScreen(),
29643    pointer: supportsPointerEvents(),
29644    pointerLock: supportsPointerLock()
29645  };
29646  
29647  const DEFAULT_PREVENT_SCROLL_DELAY = 250;
29648  const DEFAULT_DRAG_DELAY = 180;
29649  const DEFAULT_SWIPE_VELOCITY = 0.5;
29650  const DEFAULT_SWIPE_DISTANCE = 50;
29651  const DEFAULT_SWIPE_DURATION = 250;
29652  const DEFAULT_KEYBOARD_DISPLACEMENT = 10;
29653  const DEFAULT_DRAG_AXIS_THRESHOLD = {
29654    mouse: 0,
29655    touch: 0,
29656    pen: 8
29657  };
29658  const dragConfigResolver = _objectSpread2(_objectSpread2({}, coordinatesConfigResolver), {}, {
29659    device(_v, _k, {
29660      pointer: {
29661        touch = false,
29662        lock = false,
29663        mouse = false
29664      } = {}
29665    }) {
29666      this.pointerLock = lock && SUPPORT.pointerLock;
29667      if (SUPPORT.touch && touch) return 'touch';
29668      if (this.pointerLock) return 'mouse';
29669      if (SUPPORT.pointer && !mouse) return 'pointer';
29670      if (SUPPORT.touch) return 'touch';
29671      return 'mouse';
29672    },
29673    preventScrollAxis(value, _k, {
29674      preventScroll
29675    }) {
29676      this.preventScrollDelay = typeof preventScroll === 'number' ? preventScroll : preventScroll || preventScroll === undefined && value ? DEFAULT_PREVENT_SCROLL_DELAY : undefined;
29677      if (!SUPPORT.touchscreen || preventScroll === false) return undefined;
29678      return value ? value : preventScroll !== undefined ? 'y' : undefined;
29679    },
29680    pointerCapture(_v, _k, {
29681      pointer: {
29682        capture = true,
29683        buttons = 1,
29684        keys = true
29685      } = {}
29686    }) {
29687      this.pointerButtons = buttons;
29688      this.keys = keys;
29689      return !this.pointerLock && this.device === 'pointer' && capture;
29690    },
29691    threshold(value, _k, {
29692      filterTaps = false,
29693      tapsThreshold = 3,
29694      axis = undefined
29695    }) {
29696      const threshold = V.toVector(value, filterTaps ? tapsThreshold : axis ? 1 : 0);
29697      this.filterTaps = filterTaps;
29698      this.tapsThreshold = tapsThreshold;
29699      return threshold;
29700    },
29701    swipe({
29702      velocity = DEFAULT_SWIPE_VELOCITY,
29703      distance = DEFAULT_SWIPE_DISTANCE,
29704      duration = DEFAULT_SWIPE_DURATION
29705    } = {}) {
29706      return {
29707        velocity: this.transform(V.toVector(velocity)),
29708        distance: this.transform(V.toVector(distance)),
29709        duration
29710      };
29711    },
29712    delay(value = 0) {
29713      switch (value) {
29714        case true:
29715          return DEFAULT_DRAG_DELAY;
29716        case false:
29717          return 0;
29718        default:
29719          return value;
29720      }
29721    },
29722    axisThreshold(value) {
29723      if (!value) return DEFAULT_DRAG_AXIS_THRESHOLD;
29724      return _objectSpread2(_objectSpread2({}, DEFAULT_DRAG_AXIS_THRESHOLD), value);
29725    },
29726    keyboardDisplacement(value = DEFAULT_KEYBOARD_DISPLACEMENT) {
29727      return value;
29728    }
29729  });
29730  if (false) {}
29731  
29732  function clampStateInternalMovementToBounds(state) {
29733    const [ox, oy] = state.overflow;
29734    const [dx, dy] = state._delta;
29735    const [dirx, diry] = state._direction;
29736    if (ox < 0 && dx > 0 && dirx < 0 || ox > 0 && dx < 0 && dirx > 0) {
29737      state._movement[0] = state._movementBound[0];
29738    }
29739    if (oy < 0 && dy > 0 && diry < 0 || oy > 0 && dy < 0 && diry > 0) {
29740      state._movement[1] = state._movementBound[1];
29741    }
29742  }
29743  
29744  const SCALE_ANGLE_RATIO_INTENT_DEG = 30;
29745  const PINCH_WHEEL_RATIO = 100;
29746  class PinchEngine extends Engine {
29747    constructor(...args) {
29748      super(...args);
29749      _defineProperty(this, "ingKey", 'pinching');
29750      _defineProperty(this, "aliasKey", 'da');
29751    }
29752    init() {
29753      this.state.offset = [1, 0];
29754      this.state.lastOffset = [1, 0];
29755      this.state._pointerEvents = new Map();
29756    }
29757    reset() {
29758      super.reset();
29759      const state = this.state;
29760      state._touchIds = [];
29761      state.canceled = false;
29762      state.cancel = this.cancel.bind(this);
29763      state.turns = 0;
29764    }
29765    computeOffset() {
29766      const {
29767        type,
29768        movement,
29769        lastOffset
29770      } = this.state;
29771      if (type === 'wheel') {
29772        this.state.offset = V.add(movement, lastOffset);
29773      } else {
29774        this.state.offset = [(1 + movement[0]) * lastOffset[0], movement[1] + lastOffset[1]];
29775      }
29776    }
29777    computeMovement() {
29778      const {
29779        offset,
29780        lastOffset
29781      } = this.state;
29782      this.state.movement = [offset[0] / lastOffset[0], offset[1] - lastOffset[1]];
29783    }
29784    axisIntent() {
29785      const state = this.state;
29786      const [_m0, _m1] = state._movement;
29787      if (!state.axis) {
29788        const axisMovementDifference = Math.abs(_m0) * SCALE_ANGLE_RATIO_INTENT_DEG - Math.abs(_m1);
29789        if (axisMovementDifference < 0) state.axis = 'angle';else if (axisMovementDifference > 0) state.axis = 'scale';
29790      }
29791    }
29792    restrictToAxis(v) {
29793      if (this.config.lockDirection) {
29794        if (this.state.axis === 'scale') v[1] = 0;else if (this.state.axis === 'angle') v[0] = 0;
29795      }
29796    }
29797    cancel() {
29798      const state = this.state;
29799      if (state.canceled) return;
29800      setTimeout(() => {
29801        state.canceled = true;
29802        state._active = false;
29803        this.compute();
29804        this.emit();
29805      }, 0);
29806    }
29807    touchStart(event) {
29808      this.ctrl.setEventIds(event);
29809      const state = this.state;
29810      const ctrlTouchIds = this.ctrl.touchIds;
29811      if (state._active) {
29812        if (state._touchIds.every(id => ctrlTouchIds.has(id))) return;
29813      }
29814      if (ctrlTouchIds.size < 2) return;
29815      this.start(event);
29816      state._touchIds = Array.from(ctrlTouchIds).slice(0, 2);
29817      const payload = touchDistanceAngle(event, state._touchIds);
29818      if (!payload) return;
29819      this.pinchStart(event, payload);
29820    }
29821    pointerStart(event) {
29822      if (event.buttons != null && event.buttons % 2 !== 1) return;
29823      this.ctrl.setEventIds(event);
29824      event.target.setPointerCapture(event.pointerId);
29825      const state = this.state;
29826      const _pointerEvents = state._pointerEvents;
29827      const ctrlPointerIds = this.ctrl.pointerIds;
29828      if (state._active) {
29829        if (Array.from(_pointerEvents.keys()).every(id => ctrlPointerIds.has(id))) return;
29830      }
29831      if (_pointerEvents.size < 2) {
29832        _pointerEvents.set(event.pointerId, event);
29833      }
29834      if (state._pointerEvents.size < 2) return;
29835      this.start(event);
29836      const payload = distanceAngle(...Array.from(_pointerEvents.values()));
29837      if (!payload) return;
29838      this.pinchStart(event, payload);
29839    }
29840    pinchStart(event, payload) {
29841      const state = this.state;
29842      state.origin = payload.origin;
29843      this.computeValues([payload.distance, payload.angle]);
29844      this.computeInitial();
29845      this.compute(event);
29846      this.emit();
29847    }
29848    touchMove(event) {
29849      if (!this.state._active) return;
29850      const payload = touchDistanceAngle(event, this.state._touchIds);
29851      if (!payload) return;
29852      this.pinchMove(event, payload);
29853    }
29854    pointerMove(event) {
29855      const _pointerEvents = this.state._pointerEvents;
29856      if (_pointerEvents.has(event.pointerId)) {
29857        _pointerEvents.set(event.pointerId, event);
29858      }
29859      if (!this.state._active) return;
29860      const payload = distanceAngle(...Array.from(_pointerEvents.values()));
29861      if (!payload) return;
29862      this.pinchMove(event, payload);
29863    }
29864    pinchMove(event, payload) {
29865      const state = this.state;
29866      const prev_a = state._values[1];
29867      const delta_a = payload.angle - prev_a;
29868      let delta_turns = 0;
29869      if (Math.abs(delta_a) > 270) delta_turns += Math.sign(delta_a);
29870      this.computeValues([payload.distance, payload.angle - 360 * delta_turns]);
29871      state.origin = payload.origin;
29872      state.turns = delta_turns;
29873      state._movement = [state._values[0] / state._initial[0] - 1, state._values[1] - state._initial[1]];
29874      this.compute(event);
29875      this.emit();
29876    }
29877    touchEnd(event) {
29878      this.ctrl.setEventIds(event);
29879      if (!this.state._active) return;
29880      if (this.state._touchIds.some(id => !this.ctrl.touchIds.has(id))) {
29881        this.state._active = false;
29882        this.compute(event);
29883        this.emit();
29884      }
29885    }
29886    pointerEnd(event) {
29887      const state = this.state;
29888      this.ctrl.setEventIds(event);
29889      try {
29890        event.target.releasePointerCapture(event.pointerId);
29891      } catch (_unused) {}
29892      if (state._pointerEvents.has(event.pointerId)) {
29893        state._pointerEvents.delete(event.pointerId);
29894      }
29895      if (!state._active) return;
29896      if (state._pointerEvents.size < 2) {
29897        state._active = false;
29898        this.compute(event);
29899        this.emit();
29900      }
29901    }
29902    gestureStart(event) {
29903      if (event.cancelable) event.preventDefault();
29904      const state = this.state;
29905      if (state._active) return;
29906      this.start(event);
29907      this.computeValues([event.scale, event.rotation]);
29908      state.origin = [event.clientX, event.clientY];
29909      this.compute(event);
29910      this.emit();
29911    }
29912    gestureMove(event) {
29913      if (event.cancelable) event.preventDefault();
29914      if (!this.state._active) return;
29915      const state = this.state;
29916      this.computeValues([event.scale, event.rotation]);
29917      state.origin = [event.clientX, event.clientY];
29918      const _previousMovement = state._movement;
29919      state._movement = [event.scale - 1, event.rotation];
29920      state._delta = V.sub(state._movement, _previousMovement);
29921      this.compute(event);
29922      this.emit();
29923    }
29924    gestureEnd(event) {
29925      if (!this.state._active) return;
29926      this.state._active = false;
29927      this.compute(event);
29928      this.emit();
29929    }
29930    wheel(event) {
29931      const modifierKey = this.config.modifierKey;
29932      if (modifierKey && (Array.isArray(modifierKey) ? !modifierKey.find(k => event[k]) : !event[modifierKey])) return;
29933      if (!this.state._active) this.wheelStart(event);else this.wheelChange(event);
29934      this.timeoutStore.add('wheelEnd', this.wheelEnd.bind(this));
29935    }
29936    wheelStart(event) {
29937      this.start(event);
29938      this.wheelChange(event);
29939    }
29940    wheelChange(event) {
29941      const isR3f = ('uv' in event);
29942      if (!isR3f) {
29943        if (event.cancelable) {
29944          event.preventDefault();
29945        }
29946        if (false) {}
29947      }
29948      const state = this.state;
29949      state._delta = [-wheelValues(event)[1] / PINCH_WHEEL_RATIO * state.offset[0], 0];
29950      V.addTo(state._movement, state._delta);
29951      clampStateInternalMovementToBounds(state);
29952      this.state.origin = [event.clientX, event.clientY];
29953      this.compute(event);
29954      this.emit();
29955    }
29956    wheelEnd() {
29957      if (!this.state._active) return;
29958      this.state._active = false;
29959      this.compute();
29960      this.emit();
29961    }
29962    bind(bindFunction) {
29963      const device = this.config.device;
29964      if (!!device) {
29965        bindFunction(device, 'start', this[device + 'Start'].bind(this));
29966        bindFunction(device, 'change', this[device + 'Move'].bind(this));
29967        bindFunction(device, 'end', this[device + 'End'].bind(this));
29968        bindFunction(device, 'cancel', this[device + 'End'].bind(this));
29969        bindFunction('lostPointerCapture', '', this[device + 'End'].bind(this));
29970      }
29971      if (this.config.pinchOnWheel) {
29972        bindFunction('wheel', '', this.wheel.bind(this), {
29973          passive: false
29974        });
29975      }
29976    }
29977  }
29978  
29979  const pinchConfigResolver = _objectSpread2(_objectSpread2({}, commonConfigResolver), {}, {
29980    device(_v, _k, {
29981      shared,
29982      pointer: {
29983        touch = false
29984      } = {}
29985    }) {
29986      const sharedConfig = shared;
29987      if (sharedConfig.target && !SUPPORT.touch && SUPPORT.gesture) return 'gesture';
29988      if (SUPPORT.touch && touch) return 'touch';
29989      if (SUPPORT.touchscreen) {
29990        if (SUPPORT.pointer) return 'pointer';
29991        if (SUPPORT.touch) return 'touch';
29992      }
29993    },
29994    bounds(_v, _k, {
29995      scaleBounds = {},
29996      angleBounds = {}
29997    }) {
29998      const _scaleBounds = state => {
29999        const D = assignDefault(call(scaleBounds, state), {
30000          min: -Infinity,
30001          max: Infinity
30002        });
30003        return [D.min, D.max];
30004      };
30005      const _angleBounds = state => {
30006        const A = assignDefault(call(angleBounds, state), {
30007          min: -Infinity,
30008          max: Infinity
30009        });
30010        return [A.min, A.max];
30011      };
30012      if (typeof scaleBounds !== 'function' && typeof angleBounds !== 'function') return [_scaleBounds(), _angleBounds()];
30013      return state => [_scaleBounds(state), _angleBounds(state)];
30014    },
30015    threshold(value, _k, config) {
30016      this.lockDirection = config.axis === 'lock';
30017      const threshold = V.toVector(value, this.lockDirection ? [0.1, 3] : 0);
30018      return threshold;
30019    },
30020    modifierKey(value) {
30021      if (value === undefined) return 'ctrlKey';
30022      return value;
30023    },
30024    pinchOnWheel(value = true) {
30025      return value;
30026    }
30027  });
30028  
30029  class MoveEngine extends CoordinatesEngine {
30030    constructor(...args) {
30031      super(...args);
30032      _defineProperty(this, "ingKey", 'moving');
30033    }
30034    move(event) {
30035      if (this.config.mouseOnly && event.pointerType !== 'mouse') return;
30036      if (!this.state._active) this.moveStart(event);else this.moveChange(event);
30037      this.timeoutStore.add('moveEnd', this.moveEnd.bind(this));
30038    }
30039    moveStart(event) {
30040      this.start(event);
30041      this.computeValues(pointerValues(event));
30042      this.compute(event);
30043      this.computeInitial();
30044      this.emit();
30045    }
30046    moveChange(event) {
30047      if (!this.state._active) return;
30048      const values = pointerValues(event);
30049      const state = this.state;
30050      state._delta = V.sub(values, state._values);
30051      V.addTo(state._movement, state._delta);
30052      this.computeValues(values);
30053      this.compute(event);
30054      this.emit();
30055    }
30056    moveEnd(event) {
30057      if (!this.state._active) return;
30058      this.state._active = false;
30059      this.compute(event);
30060      this.emit();
30061    }
30062    bind(bindFunction) {
30063      bindFunction('pointer', 'change', this.move.bind(this));
30064      bindFunction('pointer', 'leave', this.moveEnd.bind(this));
30065    }
30066  }
30067  
30068  const moveConfigResolver = _objectSpread2(_objectSpread2({}, coordinatesConfigResolver), {}, {
30069    mouseOnly: (value = true) => value
30070  });
30071  
30072  class ScrollEngine extends CoordinatesEngine {
30073    constructor(...args) {
30074      super(...args);
30075      _defineProperty(this, "ingKey", 'scrolling');
30076    }
30077    scroll(event) {
30078      if (!this.state._active) this.start(event);
30079      this.scrollChange(event);
30080      this.timeoutStore.add('scrollEnd', this.scrollEnd.bind(this));
30081    }
30082    scrollChange(event) {
30083      if (event.cancelable) event.preventDefault();
30084      const state = this.state;
30085      const values = scrollValues(event);
30086      state._delta = V.sub(values, state._values);
30087      V.addTo(state._movement, state._delta);
30088      this.computeValues(values);
30089      this.compute(event);
30090      this.emit();
30091    }
30092    scrollEnd() {
30093      if (!this.state._active) return;
30094      this.state._active = false;
30095      this.compute();
30096      this.emit();
30097    }
30098    bind(bindFunction) {
30099      bindFunction('scroll', '', this.scroll.bind(this));
30100    }
30101  }
30102  
30103  const scrollConfigResolver = coordinatesConfigResolver;
30104  
30105  class WheelEngine extends CoordinatesEngine {
30106    constructor(...args) {
30107      super(...args);
30108      _defineProperty(this, "ingKey", 'wheeling');
30109    }
30110    wheel(event) {
30111      if (!this.state._active) this.start(event);
30112      this.wheelChange(event);
30113      this.timeoutStore.add('wheelEnd', this.wheelEnd.bind(this));
30114    }
30115    wheelChange(event) {
30116      const state = this.state;
30117      state._delta = wheelValues(event);
30118      V.addTo(state._movement, state._delta);
30119      clampStateInternalMovementToBounds(state);
30120      this.compute(event);
30121      this.emit();
30122    }
30123    wheelEnd() {
30124      if (!this.state._active) return;
30125      this.state._active = false;
30126      this.compute();
30127      this.emit();
30128    }
30129    bind(bindFunction) {
30130      bindFunction('wheel', '', this.wheel.bind(this));
30131    }
30132  }
30133  
30134  const wheelConfigResolver = coordinatesConfigResolver;
30135  
30136  class HoverEngine extends CoordinatesEngine {
30137    constructor(...args) {
30138      super(...args);
30139      _defineProperty(this, "ingKey", 'hovering');
30140    }
30141    enter(event) {
30142      if (this.config.mouseOnly && event.pointerType !== 'mouse') return;
30143      this.start(event);
30144      this.computeValues(pointerValues(event));
30145      this.compute(event);
30146      this.emit();
30147    }
30148    leave(event) {
30149      if (this.config.mouseOnly && event.pointerType !== 'mouse') return;
30150      const state = this.state;
30151      if (!state._active) return;
30152      state._active = false;
30153      const values = pointerValues(event);
30154      state._movement = state._delta = V.sub(values, state._values);
30155      this.computeValues(values);
30156      this.compute(event);
30157      state.delta = state.movement;
30158      this.emit();
30159    }
30160    bind(bindFunction) {
30161      bindFunction('pointer', 'enter', this.enter.bind(this));
30162      bindFunction('pointer', 'leave', this.leave.bind(this));
30163    }
30164  }
30165  
30166  const hoverConfigResolver = _objectSpread2(_objectSpread2({}, coordinatesConfigResolver), {}, {
30167    mouseOnly: (value = true) => value
30168  });
30169  
30170  const actions_fe213e88_esm_EngineMap = new Map();
30171  const ConfigResolverMap = new Map();
30172  function actions_fe213e88_esm_registerAction(action) {
30173    actions_fe213e88_esm_EngineMap.set(action.key, action.engine);
30174    ConfigResolverMap.set(action.key, action.resolver);
30175  }
30176  const actions_fe213e88_esm_dragAction = {
30177    key: 'drag',
30178    engine: DragEngine,
30179    resolver: dragConfigResolver
30180  };
30181  const actions_fe213e88_esm_hoverAction = {
30182    key: 'hover',
30183    engine: HoverEngine,
30184    resolver: hoverConfigResolver
30185  };
30186  const actions_fe213e88_esm_moveAction = {
30187    key: 'move',
30188    engine: MoveEngine,
30189    resolver: moveConfigResolver
30190  };
30191  const actions_fe213e88_esm_pinchAction = {
30192    key: 'pinch',
30193    engine: PinchEngine,
30194    resolver: pinchConfigResolver
30195  };
30196  const actions_fe213e88_esm_scrollAction = {
30197    key: 'scroll',
30198    engine: ScrollEngine,
30199    resolver: scrollConfigResolver
30200  };
30201  const actions_fe213e88_esm_wheelAction = {
30202    key: 'wheel',
30203    engine: WheelEngine,
30204    resolver: wheelConfigResolver
30205  };
30206  
30207  
30208  
30209  ;// CONCATENATED MODULE: ./node_modules/@use-gesture/core/dist/use-gesture-core.esm.js
30210  
30211  
30212  
30213  function _objectWithoutPropertiesLoose(source, excluded) {
30214    if (source == null) return {};
30215    var target = {};
30216    var sourceKeys = Object.keys(source);
30217    var key, i;
30218    for (i = 0; i < sourceKeys.length; i++) {
30219      key = sourceKeys[i];
30220      if (excluded.indexOf(key) >= 0) continue;
30221      target[key] = source[key];
30222    }
30223    return target;
30224  }
30225  
30226  function _objectWithoutProperties(source, excluded) {
30227    if (source == null) return {};
30228    var target = _objectWithoutPropertiesLoose(source, excluded);
30229    var key, i;
30230    if (Object.getOwnPropertySymbols) {
30231      var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
30232      for (i = 0; i < sourceSymbolKeys.length; i++) {
30233        key = sourceSymbolKeys[i];
30234        if (excluded.indexOf(key) >= 0) continue;
30235        if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
30236        target[key] = source[key];
30237      }
30238    }
30239    return target;
30240  }
30241  
30242  const sharedConfigResolver = {
30243    target(value) {
30244      if (value) {
30245        return () => 'current' in value ? value.current : value;
30246      }
30247      return undefined;
30248    },
30249    enabled(value = true) {
30250      return value;
30251    },
30252    window(value = SUPPORT.isBrowser ? window : undefined) {
30253      return value;
30254    },
30255    eventOptions({
30256      passive = true,
30257      capture = false
30258    } = {}) {
30259      return {
30260        passive,
30261        capture
30262      };
30263    },
30264    transform(value) {
30265      return value;
30266    }
30267  };
30268  
30269  const _excluded = ["target", "eventOptions", "window", "enabled", "transform"];
30270  function resolveWith(config = {}, resolvers) {
30271    const result = {};
30272    for (const [key, resolver] of Object.entries(resolvers)) {
30273      switch (typeof resolver) {
30274        case 'function':
30275          if (false) {} else {
30276            result[key] = resolver.call(result, config[key], key, config);
30277          }
30278          break;
30279        case 'object':
30280          result[key] = resolveWith(config[key], resolver);
30281          break;
30282        case 'boolean':
30283          if (resolver) result[key] = config[key];
30284          break;
30285      }
30286    }
30287    return result;
30288  }
30289  function use_gesture_core_esm_parse(newConfig, gestureKey, _config = {}) {
30290    const _ref = newConfig,
30291      {
30292        target,
30293        eventOptions,
30294        window,
30295        enabled,
30296        transform
30297      } = _ref,
30298      rest = _objectWithoutProperties(_ref, _excluded);
30299    _config.shared = resolveWith({
30300      target,
30301      eventOptions,
30302      window,
30303      enabled,
30304      transform
30305    }, sharedConfigResolver);
30306    if (gestureKey) {
30307      const resolver = ConfigResolverMap.get(gestureKey);
30308      _config[gestureKey] = resolveWith(_objectSpread2({
30309        shared: _config.shared
30310      }, rest), resolver);
30311    } else {
30312      for (const key in rest) {
30313        const resolver = ConfigResolverMap.get(key);
30314        if (resolver) {
30315          _config[key] = resolveWith(_objectSpread2({
30316            shared: _config.shared
30317          }, rest[key]), resolver);
30318        } else if (false) {}
30319      }
30320    }
30321    return _config;
30322  }
30323  
30324  class EventStore {
30325    constructor(ctrl, gestureKey) {
30326      _defineProperty(this, "_listeners", new Set());
30327      this._ctrl = ctrl;
30328      this._gestureKey = gestureKey;
30329    }
30330    add(element, device, action, handler, options) {
30331      const listeners = this._listeners;
30332      const type = toDomEventType(device, action);
30333      const _options = this._gestureKey ? this._ctrl.config[this._gestureKey].eventOptions : {};
30334      const eventOptions = _objectSpread2(_objectSpread2({}, _options), options);
30335      element.addEventListener(type, handler, eventOptions);
30336      const remove = () => {
30337        element.removeEventListener(type, handler, eventOptions);
30338        listeners.delete(remove);
30339      };
30340      listeners.add(remove);
30341      return remove;
30342    }
30343    clean() {
30344      this._listeners.forEach(remove => remove());
30345      this._listeners.clear();
30346    }
30347  }
30348  
30349  class TimeoutStore {
30350    constructor() {
30351      _defineProperty(this, "_timeouts", new Map());
30352    }
30353    add(key, callback, ms = 140, ...args) {
30354      this.remove(key);
30355      this._timeouts.set(key, window.setTimeout(callback, ms, ...args));
30356    }
30357    remove(key) {
30358      const timeout = this._timeouts.get(key);
30359      if (timeout) window.clearTimeout(timeout);
30360    }
30361    clean() {
30362      this._timeouts.forEach(timeout => void window.clearTimeout(timeout));
30363      this._timeouts.clear();
30364    }
30365  }
30366  
30367  class Controller {
30368    constructor(handlers) {
30369      _defineProperty(this, "gestures", new Set());
30370      _defineProperty(this, "_targetEventStore", new EventStore(this));
30371      _defineProperty(this, "gestureEventStores", {});
30372      _defineProperty(this, "gestureTimeoutStores", {});
30373      _defineProperty(this, "handlers", {});
30374      _defineProperty(this, "config", {});
30375      _defineProperty(this, "pointerIds", new Set());
30376      _defineProperty(this, "touchIds", new Set());
30377      _defineProperty(this, "state", {
30378        shared: {
30379          shiftKey: false,
30380          metaKey: false,
30381          ctrlKey: false,
30382          altKey: false
30383        }
30384      });
30385      resolveGestures(this, handlers);
30386    }
30387    setEventIds(event) {
30388      if (isTouch(event)) {
30389        this.touchIds = new Set(touchIds(event));
30390        return this.touchIds;
30391      } else if ('pointerId' in event) {
30392        if (event.type === 'pointerup' || event.type === 'pointercancel') this.pointerIds.delete(event.pointerId);else if (event.type === 'pointerdown') this.pointerIds.add(event.pointerId);
30393        return this.pointerIds;
30394      }
30395    }
30396    applyHandlers(handlers, nativeHandlers) {
30397      this.handlers = handlers;
30398      this.nativeHandlers = nativeHandlers;
30399    }
30400    applyConfig(config, gestureKey) {
30401      this.config = use_gesture_core_esm_parse(config, gestureKey, this.config);
30402    }
30403    clean() {
30404      this._targetEventStore.clean();
30405      for (const key of this.gestures) {
30406        this.gestureEventStores[key].clean();
30407        this.gestureTimeoutStores[key].clean();
30408      }
30409    }
30410    effect() {
30411      if (this.config.shared.target) this.bind();
30412      return () => this._targetEventStore.clean();
30413    }
30414    bind(...args) {
30415      const sharedConfig = this.config.shared;
30416      const props = {};
30417      let target;
30418      if (sharedConfig.target) {
30419        target = sharedConfig.target();
30420        if (!target) return;
30421      }
30422      if (sharedConfig.enabled) {
30423        for (const gestureKey of this.gestures) {
30424          const gestureConfig = this.config[gestureKey];
30425          const bindFunction = bindToProps(props, gestureConfig.eventOptions, !!target);
30426          if (gestureConfig.enabled) {
30427            const Engine = actions_fe213e88_esm_EngineMap.get(gestureKey);
30428            new Engine(this, args, gestureKey).bind(bindFunction);
30429          }
30430        }
30431        const nativeBindFunction = bindToProps(props, sharedConfig.eventOptions, !!target);
30432        for (const eventKey in this.nativeHandlers) {
30433          nativeBindFunction(eventKey, '', event => this.nativeHandlers[eventKey](_objectSpread2(_objectSpread2({}, this.state.shared), {}, {
30434            event,
30435            args
30436          })), undefined, true);
30437        }
30438      }
30439      for (const handlerProp in props) {
30440        props[handlerProp] = actions_fe213e88_esm_chain(...props[handlerProp]);
30441      }
30442      if (!target) return props;
30443      for (const handlerProp in props) {
30444        const {
30445          device,
30446          capture,
30447          passive
30448        } = parseProp(handlerProp);
30449        this._targetEventStore.add(target, device, '', props[handlerProp], {
30450          capture,
30451          passive
30452        });
30453      }
30454    }
30455  }
30456  function setupGesture(ctrl, gestureKey) {
30457    ctrl.gestures.add(gestureKey);
30458    ctrl.gestureEventStores[gestureKey] = new EventStore(ctrl, gestureKey);
30459    ctrl.gestureTimeoutStores[gestureKey] = new TimeoutStore();
30460  }
30461  function resolveGestures(ctrl, internalHandlers) {
30462    if (internalHandlers.drag) setupGesture(ctrl, 'drag');
30463    if (internalHandlers.wheel) setupGesture(ctrl, 'wheel');
30464    if (internalHandlers.scroll) setupGesture(ctrl, 'scroll');
30465    if (internalHandlers.move) setupGesture(ctrl, 'move');
30466    if (internalHandlers.pinch) setupGesture(ctrl, 'pinch');
30467    if (internalHandlers.hover) setupGesture(ctrl, 'hover');
30468  }
30469  const bindToProps = (props, eventOptions, withPassiveOption) => (device, action, handler, options = {}, isNative = false) => {
30470    var _options$capture, _options$passive;
30471    const capture = (_options$capture = options.capture) !== null && _options$capture !== void 0 ? _options$capture : eventOptions.capture;
30472    const passive = (_options$passive = options.passive) !== null && _options$passive !== void 0 ? _options$passive : eventOptions.passive;
30473    let handlerProp = isNative ? device : toHandlerProp(device, action, capture);
30474    if (withPassiveOption && passive) handlerProp += 'Passive';
30475    props[handlerProp] = props[handlerProp] || [];
30476    props[handlerProp].push(handler);
30477  };
30478  
30479  const RE_NOT_NATIVE = /^on(Drag|Wheel|Scroll|Move|Pinch|Hover)/;
30480  function sortHandlers(_handlers) {
30481    const native = {};
30482    const handlers = {};
30483    const actions = new Set();
30484    for (let key in _handlers) {
30485      if (RE_NOT_NATIVE.test(key)) {
30486        actions.add(RegExp.lastMatch);
30487        handlers[key] = _handlers[key];
30488      } else {
30489        native[key] = _handlers[key];
30490      }
30491    }
30492    return [handlers, native, actions];
30493  }
30494  function registerGesture(actions, handlers, handlerKey, key, internalHandlers, config) {
30495    if (!actions.has(handlerKey)) return;
30496    if (!EngineMap.has(key)) {
30497      if (false) {}
30498      return;
30499    }
30500    const startKey = handlerKey + 'Start';
30501    const endKey = handlerKey + 'End';
30502    const fn = state => {
30503      let memo = undefined;
30504      if (state.first && startKey in handlers) handlers[startKey](state);
30505      if (handlerKey in handlers) memo = handlers[handlerKey](state);
30506      if (state.last && endKey in handlers) handlers[endKey](state);
30507      return memo;
30508    };
30509    internalHandlers[key] = fn;
30510    config[key] = config[key] || {};
30511  }
30512  function use_gesture_core_esm_parseMergedHandlers(mergedHandlers, mergedConfig) {
30513    const [handlers, nativeHandlers, actions] = sortHandlers(mergedHandlers);
30514    const internalHandlers = {};
30515    registerGesture(actions, handlers, 'onDrag', 'drag', internalHandlers, mergedConfig);
30516    registerGesture(actions, handlers, 'onWheel', 'wheel', internalHandlers, mergedConfig);
30517    registerGesture(actions, handlers, 'onScroll', 'scroll', internalHandlers, mergedConfig);
30518    registerGesture(actions, handlers, 'onPinch', 'pinch', internalHandlers, mergedConfig);
30519    registerGesture(actions, handlers, 'onMove', 'move', internalHandlers, mergedConfig);
30520    registerGesture(actions, handlers, 'onHover', 'hover', internalHandlers, mergedConfig);
30521    return {
30522      handlers: internalHandlers,
30523      config: mergedConfig,
30524      nativeHandlers
30525    };
30526  }
30527  
30528  
30529  
30530  ;// CONCATENATED MODULE: ./node_modules/@use-gesture/react/dist/use-gesture-react.esm.js
30531  
30532  
30533  
30534  
30535  
30536  
30537  
30538  function useRecognizers(handlers, config = {}, gestureKey, nativeHandlers) {
30539    const ctrl = external_React_default().useMemo(() => new Controller(handlers), []);
30540    ctrl.applyHandlers(handlers, nativeHandlers);
30541    ctrl.applyConfig(config, gestureKey);
30542    external_React_default().useEffect(ctrl.effect.bind(ctrl));
30543    external_React_default().useEffect(() => {
30544      return ctrl.clean.bind(ctrl);
30545    }, []);
30546    if (config.target === undefined) {
30547      return ctrl.bind.bind(ctrl);
30548    }
30549    return undefined;
30550  }
30551  
30552  function useDrag(handler, config) {
30553    actions_fe213e88_esm_registerAction(actions_fe213e88_esm_dragAction);
30554    return useRecognizers({
30555      drag: handler
30556    }, config || {}, 'drag');
30557  }
30558  
30559  function usePinch(handler, config) {
30560    registerAction(pinchAction);
30561    return useRecognizers({
30562      pinch: handler
30563    }, config || {}, 'pinch');
30564  }
30565  
30566  function useWheel(handler, config) {
30567    registerAction(wheelAction);
30568    return useRecognizers({
30569      wheel: handler
30570    }, config || {}, 'wheel');
30571  }
30572  
30573  function useScroll(handler, config) {
30574    registerAction(scrollAction);
30575    return useRecognizers({
30576      scroll: handler
30577    }, config || {}, 'scroll');
30578  }
30579  
30580  function useMove(handler, config) {
30581    registerAction(moveAction);
30582    return useRecognizers({
30583      move: handler
30584    }, config || {}, 'move');
30585  }
30586  
30587  function useHover(handler, config) {
30588    registerAction(hoverAction);
30589    return useRecognizers({
30590      hover: handler
30591    }, config || {}, 'hover');
30592  }
30593  
30594  function createUseGesture(actions) {
30595    actions.forEach(registerAction);
30596    return function useGesture(_handlers, _config) {
30597      const {
30598        handlers,
30599        nativeHandlers,
30600        config
30601      } = parseMergedHandlers(_handlers, _config || {});
30602      return useRecognizers(handlers, config, undefined, nativeHandlers);
30603    };
30604  }
30605  
30606  function useGesture(handlers, config) {
30607    const hook = createUseGesture([dragAction, pinchAction, scrollAction, wheelAction, moveAction, hoverAction]);
30608    return hook(handlers, config || {});
30609  }
30610  
30611  
30612  
30613  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/input-control/utils.js
30614  /**
30615   * External dependencies
30616   */
30617  
30618  /**
30619   * WordPress dependencies
30620   */
30621  
30622  
30623  /**
30624   * Internal dependencies
30625   */
30626  
30627  /**
30628   * Gets a CSS cursor value based on a drag direction.
30629   *
30630   * @param dragDirection The drag direction.
30631   * @return  The CSS cursor value.
30632   */
30633  function getDragCursor(dragDirection) {
30634    let dragCursor = 'ns-resize';
30635    switch (dragDirection) {
30636      case 'n':
30637      case 's':
30638        dragCursor = 'ns-resize';
30639        break;
30640      case 'e':
30641      case 'w':
30642        dragCursor = 'ew-resize';
30643        break;
30644    }
30645    return dragCursor;
30646  }
30647  
30648  /**
30649   * Custom hook that renders a drag cursor when dragging.
30650   *
30651   * @param {boolean} isDragging    The dragging state.
30652   * @param {string}  dragDirection The drag direction.
30653   *
30654   * @return {string} The CSS cursor value.
30655   */
30656  function useDragCursor(isDragging, dragDirection) {
30657    const dragCursor = getDragCursor(dragDirection);
30658    (0,external_wp_element_namespaceObject.useEffect)(() => {
30659      if (isDragging) {
30660        document.documentElement.style.cursor = dragCursor;
30661      } else {
30662        // @ts-expect-error
30663        document.documentElement.style.cursor = null;
30664      }
30665    }, [isDragging, dragCursor]);
30666    return dragCursor;
30667  }
30668  function useDraft(props) {
30669    const previousValueRef = (0,external_wp_element_namespaceObject.useRef)(props.value);
30670    const [draft, setDraft] = (0,external_wp_element_namespaceObject.useState)({});
30671    const value = draft.value !== undefined ? draft.value : props.value;
30672  
30673    // Determines when to discard the draft value to restore controlled status.
30674    // To do so, it tracks the previous value and marks the draft value as stale
30675    // after each render.
30676    (0,external_wp_element_namespaceObject.useLayoutEffect)(() => {
30677      const {
30678        current: previousValue
30679      } = previousValueRef;
30680      previousValueRef.current = props.value;
30681      if (draft.value !== undefined && !draft.isStale) {
30682        setDraft({
30683          ...draft,
30684          isStale: true
30685        });
30686      } else if (draft.isStale && props.value !== previousValue) {
30687        setDraft({});
30688      }
30689    }, [props.value, draft]);
30690    const onChange = (nextValue, extra) => {
30691      // Mutates the draft value to avoid an extra effect run.
30692      setDraft(current => Object.assign(current, {
30693        value: nextValue,
30694        isStale: false
30695      }));
30696      props.onChange(nextValue, extra);
30697    };
30698    const onBlur = event => {
30699      setDraft({});
30700      props.onBlur?.(event);
30701    };
30702    return {
30703      value,
30704      onBlur,
30705      onChange
30706    };
30707  }
30708  
30709  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/input-control/reducer/state.js
30710  /**
30711   * External dependencies
30712   */
30713  
30714  /**
30715   * Internal dependencies
30716   */
30717  
30718  const initialStateReducer = state => state;
30719  const initialInputControlState = {
30720    error: null,
30721    initialValue: '',
30722    isDirty: false,
30723    isDragEnabled: false,
30724    isDragging: false,
30725    isPressEnterToChange: false,
30726    value: ''
30727  };
30728  
30729  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/input-control/reducer/actions.js
30730  /**
30731   * External dependencies
30732   */
30733  
30734  /**
30735   * Internal dependencies
30736   */
30737  
30738  const CHANGE = 'CHANGE';
30739  const COMMIT = 'COMMIT';
30740  const CONTROL = 'CONTROL';
30741  const DRAG_END = 'DRAG_END';
30742  const DRAG_START = 'DRAG_START';
30743  const DRAG = 'DRAG';
30744  const INVALIDATE = 'INVALIDATE';
30745  const PRESS_DOWN = 'PRESS_DOWN';
30746  const PRESS_ENTER = 'PRESS_ENTER';
30747  const PRESS_UP = 'PRESS_UP';
30748  const RESET = 'RESET';
30749  
30750  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/input-control/reducer/reducer.js
30751  /**
30752   * External dependencies
30753   */
30754  
30755  /**
30756   * WordPress dependencies
30757   */
30758  
30759  
30760  /**
30761   * Internal dependencies
30762   */
30763  
30764  
30765  
30766  /**
30767   * Prepares initialState for the reducer.
30768   *
30769   * @param initialState The initial state.
30770   * @return Prepared initialState for the reducer
30771   */
30772  function mergeInitialState(initialState = initialInputControlState) {
30773    const {
30774      value
30775    } = initialState;
30776    return {
30777      ...initialInputControlState,
30778      ...initialState,
30779      initialValue: value
30780    };
30781  }
30782  
30783  /**
30784   * Creates the base reducer which may be coupled to a specializing reducer.
30785   * As its final step, for all actions other than CONTROL, the base reducer
30786   * passes the state and action on through the specializing reducer. The
30787   * exception for CONTROL actions is because they represent controlled updates
30788   * from props and no case has yet presented for their specialization.
30789   *
30790   * @param composedStateReducers A reducer to specialize state changes.
30791   * @return The reducer.
30792   */
30793  function inputControlStateReducer(composedStateReducers) {
30794    return (state, action) => {
30795      const nextState = {
30796        ...state
30797      };
30798      switch (action.type) {
30799        /*
30800         * Controlled updates
30801         */
30802        case CONTROL:
30803          nextState.value = action.payload.value;
30804          nextState.isDirty = false;
30805          nextState._event = undefined;
30806          // Returns immediately to avoid invoking additional reducers.
30807          return nextState;
30808  
30809        /**
30810         * Keyboard events
30811         */
30812        case PRESS_UP:
30813          nextState.isDirty = false;
30814          break;
30815        case PRESS_DOWN:
30816          nextState.isDirty = false;
30817          break;
30818  
30819        /**
30820         * Drag events
30821         */
30822        case DRAG_START:
30823          nextState.isDragging = true;
30824          break;
30825        case DRAG_END:
30826          nextState.isDragging = false;
30827          break;
30828  
30829        /**
30830         * Input events
30831         */
30832        case CHANGE:
30833          nextState.error = null;
30834          nextState.value = action.payload.value;
30835          if (state.isPressEnterToChange) {
30836            nextState.isDirty = true;
30837          }
30838          break;
30839        case COMMIT:
30840          nextState.value = action.payload.value;
30841          nextState.isDirty = false;
30842          break;
30843        case RESET:
30844          nextState.error = null;
30845          nextState.isDirty = false;
30846          nextState.value = action.payload.value || state.initialValue;
30847          break;
30848  
30849        /**
30850         * Validation
30851         */
30852        case INVALIDATE:
30853          nextState.error = action.payload.error;
30854          break;
30855      }
30856      nextState._event = action.payload.event;
30857  
30858      /**
30859       * Send the nextState + action to the composedReducers via
30860       * this "bridge" mechanism. This allows external stateReducers
30861       * to hook into actions, and modify state if needed.
30862       */
30863      return composedStateReducers(nextState, action);
30864    };
30865  }
30866  
30867  /**
30868   * A custom hook that connects and external stateReducer with an internal
30869   * reducer. This hook manages the internal state of InputControl.
30870   * However, by connecting an external stateReducer function, other
30871   * components can react to actions as well as modify state before it is
30872   * applied.
30873   *
30874   * This technique uses the "stateReducer" design pattern:
30875   * https://kentcdodds.com/blog/the-state-reducer-pattern/
30876   *
30877   * @param stateReducer    An external state reducer.
30878   * @param initialState    The initial state for the reducer.
30879   * @param onChangeHandler A handler for the onChange event.
30880   * @return State, dispatch, and a collection of actions.
30881   */
30882  function useInputControlStateReducer(stateReducer = initialStateReducer, initialState = initialInputControlState, onChangeHandler) {
30883    const [state, dispatch] = (0,external_wp_element_namespaceObject.useReducer)(inputControlStateReducer(stateReducer), mergeInitialState(initialState));
30884    const createChangeEvent = type => (nextValue, event) => {
30885      dispatch({
30886        type,
30887        payload: {
30888          value: nextValue,
30889          event
30890        }
30891      });
30892    };
30893    const createKeyEvent = type => event => {
30894      dispatch({
30895        type,
30896        payload: {
30897          event
30898        }
30899      });
30900    };
30901    const createDragEvent = type => payload => {
30902      dispatch({
30903        type,
30904        payload
30905      });
30906    };
30907  
30908    /**
30909     * Actions for the reducer
30910     */
30911    const change = createChangeEvent(CHANGE);
30912    const invalidate = (error, event) => dispatch({
30913      type: INVALIDATE,
30914      payload: {
30915        error,
30916        event
30917      }
30918    });
30919    const reset = createChangeEvent(RESET);
30920    const commit = createChangeEvent(COMMIT);
30921    const dragStart = createDragEvent(DRAG_START);
30922    const drag = createDragEvent(DRAG);
30923    const dragEnd = createDragEvent(DRAG_END);
30924    const pressUp = createKeyEvent(PRESS_UP);
30925    const pressDown = createKeyEvent(PRESS_DOWN);
30926    const pressEnter = createKeyEvent(PRESS_ENTER);
30927    const currentStateRef = (0,external_wp_element_namespaceObject.useRef)(state);
30928    const refPropsRef = (0,external_wp_element_namespaceObject.useRef)({
30929      value: initialState.value,
30930      onChangeHandler
30931    });
30932  
30933    // Freshens refs to props and state so that subsequent effects have access
30934    // to their latest values without their changes causing effect runs.
30935    (0,external_wp_element_namespaceObject.useLayoutEffect)(() => {
30936      currentStateRef.current = state;
30937      refPropsRef.current = {
30938        value: initialState.value,
30939        onChangeHandler
30940      };
30941    });
30942  
30943    // Propagates the latest state through onChange.
30944    (0,external_wp_element_namespaceObject.useLayoutEffect)(() => {
30945      if (currentStateRef.current._event !== undefined && state.value !== refPropsRef.current.value && !state.isDirty) {
30946        var _state$value;
30947        refPropsRef.current.onChangeHandler((_state$value = state.value) !== null && _state$value !== void 0 ? _state$value : '', {
30948          event: currentStateRef.current._event
30949        });
30950      }
30951    }, [state.value, state.isDirty]);
30952  
30953    // Updates the state from props.
30954    (0,external_wp_element_namespaceObject.useLayoutEffect)(() => {
30955      if (initialState.value !== currentStateRef.current.value && !currentStateRef.current.isDirty) {
30956        var _initialState$value;
30957        dispatch({
30958          type: CONTROL,
30959          payload: {
30960            value: (_initialState$value = initialState.value) !== null && _initialState$value !== void 0 ? _initialState$value : ''
30961          }
30962        });
30963      }
30964    }, [initialState.value]);
30965    return {
30966      change,
30967      commit,
30968      dispatch,
30969      drag,
30970      dragEnd,
30971      dragStart,
30972      invalidate,
30973      pressDown,
30974      pressEnter,
30975      pressUp,
30976      reset,
30977      state
30978    };
30979  }
30980  
30981  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/utils/with-ignore-ime-events.js
30982  /**
30983   * A higher-order function that wraps a keydown event handler to ensure it is not an IME event.
30984   *
30985   * In CJK languages, an IME (Input Method Editor) is used to input complex characters.
30986   * During an IME composition, keydown events (e.g. Enter or Escape) can be fired
30987   * which are intended to control the IME and not the application.
30988   * These events should be ignored by any application logic.
30989   *
30990   * @param keydownHandler The keydown event handler to execute after ensuring it was not an IME event.
30991   *
30992   * @return A wrapped version of the given event handler that ignores IME events.
30993   */
30994  function withIgnoreIMEEvents(keydownHandler) {
30995    return event => {
30996      const {
30997        isComposing
30998      } = 'nativeEvent' in event ? event.nativeEvent : event;
30999      if (isComposing ||
31000      // Workaround for Mac Safari where the final Enter/Backspace of an IME composition
31001      // is `isComposing=false`, even though it's technically still part of the composition.
31002      // These can only be detected by keyCode.
31003      event.keyCode === 229) {
31004        return;
31005      }
31006      keydownHandler(event);
31007    };
31008  }
31009  
31010  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/input-control/input-field.js
31011  /**
31012   * External dependencies
31013   */
31014  
31015  /**
31016   * WordPress dependencies
31017   */
31018  
31019  /**
31020   * Internal dependencies
31021   */
31022  
31023  
31024  
31025  
31026  
31027  
31028  const input_field_noop = () => {};
31029  function InputField({
31030    disabled = false,
31031    dragDirection = 'n',
31032    dragThreshold = 10,
31033    id,
31034    isDragEnabled = false,
31035    isPressEnterToChange = false,
31036    onBlur = input_field_noop,
31037    onChange = input_field_noop,
31038    onDrag = input_field_noop,
31039    onDragEnd = input_field_noop,
31040    onDragStart = input_field_noop,
31041    onKeyDown = input_field_noop,
31042    onValidate = input_field_noop,
31043    size = 'default',
31044    stateReducer = state => state,
31045    value: valueProp,
31046    type,
31047    ...props
31048  }, ref) {
31049    const {
31050      // State.
31051      state,
31052      // Actions.
31053      change,
31054      commit,
31055      drag,
31056      dragEnd,
31057      dragStart,
31058      invalidate,
31059      pressDown,
31060      pressEnter,
31061      pressUp,
31062      reset
31063    } = useInputControlStateReducer(stateReducer, {
31064      isDragEnabled,
31065      value: valueProp,
31066      isPressEnterToChange
31067    }, onChange);
31068    const {
31069      value,
31070      isDragging,
31071      isDirty
31072    } = state;
31073    const wasDirtyOnBlur = (0,external_wp_element_namespaceObject.useRef)(false);
31074    const dragCursor = useDragCursor(isDragging, dragDirection);
31075    const handleOnBlur = event => {
31076      onBlur(event);
31077  
31078      /**
31079       * If isPressEnterToChange is set, this commits the value to
31080       * the onChange callback.
31081       */
31082      if (isDirty || !event.target.validity.valid) {
31083        wasDirtyOnBlur.current = true;
31084        handleOnCommit(event);
31085      }
31086    };
31087    const handleOnChange = event => {
31088      const nextValue = event.target.value;
31089      change(nextValue, event);
31090    };
31091    const handleOnCommit = event => {
31092      const nextValue = event.currentTarget.value;
31093      try {
31094        onValidate(nextValue);
31095        commit(nextValue, event);
31096      } catch (err) {
31097        invalidate(err, event);
31098      }
31099    };
31100    const handleOnKeyDown = event => {
31101      const {
31102        key
31103      } = event;
31104      onKeyDown(event);
31105      switch (key) {
31106        case 'ArrowUp':
31107          pressUp(event);
31108          break;
31109        case 'ArrowDown':
31110          pressDown(event);
31111          break;
31112        case 'Enter':
31113          pressEnter(event);
31114          if (isPressEnterToChange) {
31115            event.preventDefault();
31116            handleOnCommit(event);
31117          }
31118          break;
31119        case 'Escape':
31120          if (isPressEnterToChange && isDirty) {
31121            event.preventDefault();
31122            reset(valueProp, event);
31123          }
31124          break;
31125      }
31126    };
31127    const dragGestureProps = useDrag(dragProps => {
31128      const {
31129        distance,
31130        dragging,
31131        event,
31132        target
31133      } = dragProps;
31134  
31135      // The `target` prop always references the `input` element while, by
31136      // default, the `dragProps.event.target` property would reference the real
31137      // event target (i.e. any DOM element that the pointer is hovering while
31138      // dragging). Ensuring that the `target` is always the `input` element
31139      // allows consumers of `InputControl` (or any higher-level control) to
31140      // check the input's validity by accessing `event.target.validity.valid`.
31141      dragProps.event = {
31142        ...dragProps.event,
31143        target
31144      };
31145      if (!distance) {
31146        return;
31147      }
31148      event.stopPropagation();
31149  
31150      /**
31151       * Quick return if no longer dragging.
31152       * This prevents unnecessary value calculations.
31153       */
31154      if (!dragging) {
31155        onDragEnd(dragProps);
31156        dragEnd(dragProps);
31157        return;
31158      }
31159      onDrag(dragProps);
31160      drag(dragProps);
31161      if (!isDragging) {
31162        onDragStart(dragProps);
31163        dragStart(dragProps);
31164      }
31165    }, {
31166      axis: dragDirection === 'e' || dragDirection === 'w' ? 'x' : 'y',
31167      threshold: dragThreshold,
31168      enabled: isDragEnabled,
31169      pointer: {
31170        capture: false
31171      }
31172    });
31173    const dragProps = isDragEnabled ? dragGestureProps() : {};
31174    /*
31175     * Works around the odd UA (e.g. Firefox) that does not focus inputs of
31176     * type=number when their spinner arrows are pressed.
31177     */
31178    let handleOnMouseDown;
31179    if (type === 'number') {
31180      handleOnMouseDown = event => {
31181        props.onMouseDown?.(event);
31182        if (event.currentTarget !== event.currentTarget.ownerDocument.activeElement) {
31183          event.currentTarget.focus();
31184        }
31185      };
31186    }
31187    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Input, {
31188      ...props,
31189      ...dragProps,
31190      className: "components-input-control__input",
31191      disabled: disabled,
31192      dragCursor: dragCursor,
31193      isDragging: isDragging,
31194      id: id,
31195      onBlur: handleOnBlur,
31196      onChange: handleOnChange,
31197      onKeyDown: withIgnoreIMEEvents(handleOnKeyDown),
31198      onMouseDown: handleOnMouseDown,
31199      ref: ref,
31200      inputSize: size
31201      // Fallback to `''` to avoid "uncontrolled to controlled" warning.
31202      // See https://github.com/WordPress/gutenberg/pull/47250 for details.
31203      ,
31204      value: value !== null && value !== void 0 ? value : '',
31205      type: type
31206    });
31207  }
31208  const ForwardedComponent = (0,external_wp_element_namespaceObject.forwardRef)(InputField);
31209  /* harmony default export */ const input_field = (ForwardedComponent);
31210  
31211  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/utils/font-values.js
31212  /* harmony default export */ const font_values = ({
31213    'default.fontFamily': "-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen-Sans, Ubuntu, Cantarell, 'Helvetica Neue', sans-serif",
31214    'default.fontSize': '13px',
31215    'helpText.fontSize': '12px',
31216    mobileTextMinFontSize: '16px'
31217  });
31218  
31219  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/utils/font.js
31220  /**
31221   * Internal dependencies
31222   */
31223  
31224  
31225  /**
31226   *
31227   * @param {keyof FONT} value Path of value from `FONT`
31228   * @return {string} Font rule value
31229   */
31230  function font(value) {
31231    var _FONT$value;
31232    return (_FONT$value = font_values[value]) !== null && _FONT$value !== void 0 ? _FONT$value : '';
31233  }
31234  
31235  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/utils/box-sizing.js
31236  function box_sizing_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)."; }
31237  /**
31238   * External dependencies
31239   */
31240  
31241  const boxSizingReset =  true ? {
31242    name: "kv6lnz",
31243    styles: "box-sizing:border-box;*,*::before,*::after{box-sizing:inherit;}"
31244  } : 0;
31245  
31246  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/base-control/styles/base-control-styles.js
31247  
31248  function base_control_styles_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)."; }
31249  /**
31250   * External dependencies
31251   */
31252  
31253  
31254  
31255  /**
31256   * Internal dependencies
31257   */
31258  
31259  
31260  const Wrapper = /*#__PURE__*/emotion_styled_base_browser_esm("div",  true ? {
31261    target: "ej5x27r4"
31262  } : 0)("font-family:", font('default.fontFamily'), ";font-size:", font('default.fontSize'), ";", boxSizingReset, ";" + ( true ? "" : 0));
31263  const deprecatedMarginField = ({
31264    __nextHasNoMarginBottom = false
31265  }) => {
31266    return !__nextHasNoMarginBottom && /*#__PURE__*/emotion_react_browser_esm_css("margin-bottom:", space(2), ";" + ( true ? "" : 0),  true ? "" : 0);
31267  };
31268  const StyledField = /*#__PURE__*/emotion_styled_base_browser_esm("div",  true ? {
31269    target: "ej5x27r3"
31270  } : 0)(deprecatedMarginField, " .components-panel__row &{margin-bottom:inherit;}" + ( true ? "" : 0));
31271  const labelStyles = /*#__PURE__*/emotion_react_browser_esm_css(baseLabelTypography, ";display:block;margin-bottom:", space(2), ";padding:0;" + ( true ? "" : 0),  true ? "" : 0);
31272  const StyledLabel = /*#__PURE__*/emotion_styled_base_browser_esm("label",  true ? {
31273    target: "ej5x27r2"
31274  } : 0)(labelStyles, ";" + ( true ? "" : 0));
31275  var base_control_styles_ref =  true ? {
31276    name: "11yad0w",
31277    styles: "margin-bottom:revert"
31278  } : 0;
31279  const deprecatedMarginHelp = ({
31280    __nextHasNoMarginBottom = false
31281  }) => {
31282    return !__nextHasNoMarginBottom && base_control_styles_ref;
31283  };
31284  const StyledHelp = /*#__PURE__*/emotion_styled_base_browser_esm("p",  true ? {
31285    target: "ej5x27r1"
31286  } : 0)("margin-top:", space(2), ";margin-bottom:0;font-size:", font('helpText.fontSize'), ";font-style:normal;color:", COLORS.gray[700], ";", deprecatedMarginHelp, ";" + ( true ? "" : 0));
31287  const StyledVisualLabel = /*#__PURE__*/emotion_styled_base_browser_esm("span",  true ? {
31288    target: "ej5x27r0"
31289  } : 0)(labelStyles, ";" + ( true ? "" : 0));
31290  
31291  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/base-control/index.js
31292  /**
31293   * External dependencies
31294   */
31295  
31296  /**
31297   * WordPress dependencies
31298   */
31299  
31300  
31301  
31302  /**
31303   * Internal dependencies
31304   */
31305  
31306  
31307  
31308  
31309  
31310  
31311  const UnconnectedBaseControl = props => {
31312    const {
31313      __nextHasNoMarginBottom = false,
31314      __associatedWPComponentName = 'BaseControl',
31315      id,
31316      label,
31317      hideLabelFromVision = false,
31318      help,
31319      className,
31320      children
31321    } = useContextSystem(props, 'BaseControl');
31322    if (!__nextHasNoMarginBottom) {
31323      external_wp_deprecated_default()(`Bottom margin styles for wp.components.$__associatedWPComponentName}`, {
31324        since: '6.7',
31325        version: '7.0',
31326        hint: 'Set the `__nextHasNoMarginBottom` prop to true to start opting into the new styles, which will become the default in a future version.'
31327      });
31328    }
31329    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(Wrapper, {
31330      className: className,
31331      children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(StyledField, {
31332        className: "components-base-control__field"
31333        // TODO: Official deprecation for this should start after all internal usages have been migrated
31334        ,
31335        __nextHasNoMarginBottom: __nextHasNoMarginBottom,
31336        children: [label && id && (hideLabelFromVision ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(visually_hidden_component, {
31337          as: "label",
31338          htmlFor: id,
31339          children: label
31340        }) : /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(StyledLabel, {
31341          className: "components-base-control__label",
31342          htmlFor: id,
31343          children: label
31344        })), label && !id && (hideLabelFromVision ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(visually_hidden_component, {
31345          as: "label",
31346          children: label
31347        }) : /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(VisualLabel, {
31348          children: label
31349        })), children]
31350      }), !!help && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(StyledHelp, {
31351        id: id ? id + '__help' : undefined,
31352        className: "components-base-control__help",
31353        __nextHasNoMarginBottom: __nextHasNoMarginBottom,
31354        children: help
31355      })]
31356    });
31357  };
31358  const UnforwardedVisualLabel = (props, ref) => {
31359    const {
31360      className,
31361      children,
31362      ...restProps
31363    } = props;
31364    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(StyledVisualLabel, {
31365      ref: ref,
31366      ...restProps,
31367      className: dist_clsx('components-base-control__label', className),
31368      children: children
31369    });
31370  };
31371  const VisualLabel = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedVisualLabel);
31372  
31373  /**
31374   * `BaseControl` is a component used to generate labels and help text for components handling user inputs.
31375   *
31376   * ```jsx
31377   * import { BaseControl, useBaseControlProps } from '@wordpress/components';
31378   *
31379   * // Render a `BaseControl` for a textarea input
31380   * const MyCustomTextareaControl = ({ children, ...baseProps }) => (
31381   *     // `useBaseControlProps` is a convenience hook to get the props for the `BaseControl`
31382   *     // and the inner control itself. Namely, it takes care of generating a unique `id`,
31383   *     // properly associating it with the `label` and `help` elements.
31384   *     const { baseControlProps, controlProps } = useBaseControlProps( baseProps );
31385   *
31386   *     return (
31387   *         <BaseControl { ...baseControlProps } __nextHasNoMarginBottom>
31388   *             <textarea { ...controlProps }>
31389   *               { children }
31390   *             </textarea>
31391   *         </BaseControl>
31392   *     );
31393   * );
31394   * ```
31395   */
31396  const BaseControl = Object.assign(contextConnectWithoutRef(UnconnectedBaseControl, 'BaseControl'), {
31397    /**
31398     * `BaseControl.VisualLabel` is used to render a purely visual label inside a `BaseControl` component.
31399     *
31400     * It should only be used in cases where the children being rendered inside `BaseControl` are already accessibly labeled,
31401     * e.g., a button, but we want an additional visual label for that section equivalent to the labels `BaseControl` would
31402     * otherwise use if the `label` prop was passed.
31403     *
31404     * ```jsx
31405     * import { BaseControl } from '@wordpress/components';
31406     *
31407     * const MyBaseControl = () => (
31408     *     <BaseControl
31409     *         __nextHasNoMarginBottom
31410     *         help="This button is already accessibly labeled."
31411     *     >
31412     *         <BaseControl.VisualLabel>Author</BaseControl.VisualLabel>
31413     *         <Button>Select an author</Button>
31414     *     </BaseControl>
31415     * );
31416     * ```
31417     */
31418    VisualLabel
31419  });
31420  /* harmony default export */ const base_control = (BaseControl);
31421  
31422  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/input-control/index.js
31423  /**
31424   * External dependencies
31425   */
31426  
31427  /**
31428   * WordPress dependencies
31429   */
31430  
31431  
31432  
31433  /**
31434   * Internal dependencies
31435   */
31436  
31437  
31438  
31439  
31440  
31441  
31442  
31443  const input_control_noop = () => {};
31444  function input_control_useUniqueId(idProp) {
31445    const instanceId = (0,external_wp_compose_namespaceObject.useInstanceId)(InputControl);
31446    const id = `inspector-input-control-$instanceId}`;
31447    return idProp || id;
31448  }
31449  function UnforwardedInputControl(props, ref) {
31450    const {
31451      __next40pxDefaultSize,
31452      __unstableStateReducer: stateReducer = state => state,
31453      __unstableInputWidth,
31454      className,
31455      disabled = false,
31456      help,
31457      hideLabelFromVision = false,
31458      id: idProp,
31459      isPressEnterToChange = false,
31460      label,
31461      labelPosition = 'top',
31462      onChange = input_control_noop,
31463      onValidate = input_control_noop,
31464      onKeyDown = input_control_noop,
31465      prefix,
31466      size = 'default',
31467      style,
31468      suffix,
31469      value,
31470      ...restProps
31471    } = useDeprecated36pxDefaultSizeProp(props);
31472    const id = input_control_useUniqueId(idProp);
31473    const classes = dist_clsx('components-input-control', className);
31474    const draftHookProps = useDraft({
31475      value,
31476      onBlur: restProps.onBlur,
31477      onChange
31478    });
31479    const helpProp = !!help ? {
31480      'aria-describedby': `$id}__help`
31481    } : {};
31482    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(base_control, {
31483      className: classes,
31484      help: help,
31485      id: id,
31486      __nextHasNoMarginBottom: true,
31487      children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(input_base, {
31488        __next40pxDefaultSize: __next40pxDefaultSize,
31489        __unstableInputWidth: __unstableInputWidth,
31490        disabled: disabled,
31491        gap: 3,
31492        hideLabelFromVision: hideLabelFromVision,
31493        id: id,
31494        justify: "left",
31495        label: label,
31496        labelPosition: labelPosition,
31497        prefix: prefix,
31498        size: size,
31499        style: style,
31500        suffix: suffix,
31501        children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(input_field, {
31502          ...restProps,
31503          ...helpProp,
31504          __next40pxDefaultSize: __next40pxDefaultSize,
31505          className: "components-input-control__input",
31506          disabled: disabled,
31507          id: id,
31508          isPressEnterToChange: isPressEnterToChange,
31509          onKeyDown: onKeyDown,
31510          onValidate: onValidate,
31511          paddingInlineStart: prefix ? space(1) : undefined,
31512          paddingInlineEnd: suffix ? space(1) : undefined,
31513          ref: ref,
31514          size: size,
31515          stateReducer: stateReducer,
31516          ...draftHookProps
31517        })
31518      })
31519    });
31520  }
31521  
31522  /**
31523   * InputControl components let users enter and edit text. This is an experimental component
31524   * intended to (in time) merge with or replace `TextControl`.
31525   *
31526   * ```jsx
31527   * import { __experimentalInputControl as InputControl } from '@wordpress/components';
31528   * import { useState } from 'react';
31529   *
31530   * const Example = () => {
31531   *   const [ value, setValue ] = useState( '' );
31532   *
31533   *   return (
31534   *      <InputControl
31535   *          value={ value }
31536   *          onChange={ ( nextValue ) => setValue( nextValue ?? '' ) }
31537   *      />
31538   *   );
31539   * };
31540   * ```
31541   */
31542  const InputControl = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedInputControl);
31543  /* harmony default export */ const input_control = (InputControl);
31544  
31545  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/dashicon/index.js
31546  
31547  /**
31548   * @typedef OwnProps
31549   *
31550   * @property {import('./types').IconKey} icon        Icon name
31551   * @property {string}                    [className] Class name
31552   * @property {number}                    [size]      Size of the icon
31553   */
31554  
31555  /**
31556   * Internal dependencies
31557   */
31558  
31559  function Dashicon({
31560    icon,
31561    className,
31562    size = 20,
31563    style = {},
31564    ...extraProps
31565  }) {
31566    const iconClass = ['dashicon', 'dashicons', 'dashicons-' + icon, className].filter(Boolean).join(' ');
31567  
31568    // For retro-compatibility reasons (for example if people are overriding icon size with CSS), we add inline styles just if the size is different to the default
31569    const sizeStyles =
31570    // using `!=` to catch both 20 and "20"
31571    // eslint-disable-next-line eqeqeq
31572    20 != size ? {
31573      fontSize: `$size}px`,
31574      width: `$size}px`,
31575      height: `$size}px`
31576    } : {};
31577    const styles = {
31578      ...sizeStyles,
31579      ...style
31580    };
31581    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", {
31582      className: iconClass,
31583      style: styles,
31584      ...extraProps
31585    });
31586  }
31587  /* harmony default export */ const dashicon = (Dashicon);
31588  
31589  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/icon/index.js
31590  /**
31591   * External dependencies
31592   */
31593  
31594  /**
31595   * WordPress dependencies
31596   */
31597  
31598  
31599  
31600  /**
31601   * Internal dependencies
31602   */
31603  
31604  
31605  function Icon({
31606    icon = null,
31607    size = 'string' === typeof icon ? 20 : 24,
31608    ...additionalProps
31609  }) {
31610    if ('string' === typeof icon) {
31611      return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(dashicon, {
31612        icon: icon,
31613        size: size,
31614        ...additionalProps
31615      });
31616    }
31617    if ((0,external_wp_element_namespaceObject.isValidElement)(icon) && dashicon === icon.type) {
31618      return (0,external_wp_element_namespaceObject.cloneElement)(icon, {
31619        ...additionalProps
31620      });
31621    }
31622    if ('function' === typeof icon) {
31623      return (0,external_wp_element_namespaceObject.createElement)(icon, {
31624        size,
31625        ...additionalProps
31626      });
31627    }
31628    if (icon && (icon.type === 'svg' || icon.type === external_wp_primitives_namespaceObject.SVG)) {
31629      const appliedProps = {
31630        ...icon.props,
31631        width: size,
31632        height: size,
31633        ...additionalProps
31634      };
31635      return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, {
31636        ...appliedProps
31637      });
31638    }
31639    if ((0,external_wp_element_namespaceObject.isValidElement)(icon)) {
31640      return (0,external_wp_element_namespaceObject.cloneElement)(icon, {
31641        // @ts-ignore Just forwarding the size prop along
31642        size,
31643        ...additionalProps
31644      });
31645    }
31646    return icon;
31647  }
31648  /* harmony default export */ const build_module_icon = (Icon);
31649  
31650  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/button/index.js
31651  /**
31652   * External dependencies
31653   */
31654  
31655  /**
31656   * WordPress dependencies
31657   */
31658  
31659  
31660  
31661  
31662  /**
31663   * Internal dependencies
31664   */
31665  
31666  
31667  
31668  
31669  
31670  
31671  
31672  const disabledEventsOnDisabledButton = ['onMouseDown', 'onClick'];
31673  function button_useDeprecatedProps({
31674    __experimentalIsFocusable,
31675    isDefault,
31676    isPrimary,
31677    isSecondary,
31678    isTertiary,
31679    isLink,
31680    isPressed,
31681    isSmall,
31682    size,
31683    variant,
31684    describedBy,
31685    ...otherProps
31686  }) {
31687    let computedSize = size;
31688    let computedVariant = variant;
31689    const newProps = {
31690      accessibleWhenDisabled: __experimentalIsFocusable,
31691      // @todo Mark `isPressed` as deprecated
31692      'aria-pressed': isPressed,
31693      description: describedBy
31694    };
31695    if (isSmall) {
31696      var _computedSize;
31697      (_computedSize = computedSize) !== null && _computedSize !== void 0 ? _computedSize : computedSize = 'small';
31698    }
31699    if (isPrimary) {
31700      var _computedVariant;
31701      (_computedVariant = computedVariant) !== null && _computedVariant !== void 0 ? _computedVariant : computedVariant = 'primary';
31702    }
31703    if (isTertiary) {
31704      var _computedVariant2;
31705      (_computedVariant2 = computedVariant) !== null && _computedVariant2 !== void 0 ? _computedVariant2 : computedVariant = 'tertiary';
31706    }
31707    if (isSecondary) {
31708      var _computedVariant3;
31709      (_computedVariant3 = computedVariant) !== null && _computedVariant3 !== void 0 ? _computedVariant3 : computedVariant = 'secondary';
31710    }
31711    if (isDefault) {
31712      var _computedVariant4;
31713      external_wp_deprecated_default()('wp.components.Button `isDefault` prop', {
31714        since: '5.4',
31715        alternative: 'variant="secondary"'
31716      });
31717      (_computedVariant4 = computedVariant) !== null && _computedVariant4 !== void 0 ? _computedVariant4 : computedVariant = 'secondary';
31718    }
31719    if (isLink) {
31720      var _computedVariant5;
31721      (_computedVariant5 = computedVariant) !== null && _computedVariant5 !== void 0 ? _computedVariant5 : computedVariant = 'link';
31722    }
31723    return {
31724      ...newProps,
31725      ...otherProps,
31726      size: computedSize,
31727      variant: computedVariant
31728    };
31729  }
31730  function UnforwardedButton(props, ref) {
31731    const {
31732      __next40pxDefaultSize,
31733      accessibleWhenDisabled,
31734      isBusy,
31735      isDestructive,
31736      className,
31737      disabled,
31738      icon,
31739      iconPosition = 'left',
31740      iconSize,
31741      showTooltip,
31742      tooltipPosition,
31743      shortcut,
31744      label,
31745      children,
31746      size = 'default',
31747      text,
31748      variant,
31749      description,
31750      ...buttonOrAnchorProps
31751    } = button_useDeprecatedProps(props);
31752    const {
31753      href,
31754      target,
31755      'aria-checked': ariaChecked,
31756      'aria-pressed': ariaPressed,
31757      'aria-selected': ariaSelected,
31758      ...additionalProps
31759    } = 'href' in buttonOrAnchorProps ? buttonOrAnchorProps : {
31760      href: undefined,
31761      target: undefined,
31762      ...buttonOrAnchorProps
31763    };
31764    const instanceId = (0,external_wp_compose_namespaceObject.useInstanceId)(Button, 'components-button__description');
31765    const hasChildren = 'string' === typeof children && !!children || Array.isArray(children) && children?.[0] && children[0] !== null &&
31766    // Tooltip should not considered as a child
31767    children?.[0]?.props?.className !== 'components-tooltip';
31768    const truthyAriaPressedValues = [true, 'true', 'mixed'];
31769    const classes = dist_clsx('components-button', className, {
31770      'is-next-40px-default-size': __next40pxDefaultSize,
31771      'is-secondary': variant === 'secondary',
31772      'is-primary': variant === 'primary',
31773      'is-small': size === 'small',
31774      'is-compact': size === 'compact',
31775      'is-tertiary': variant === 'tertiary',
31776      'is-pressed': truthyAriaPressedValues.includes(ariaPressed),
31777      'is-pressed-mixed': ariaPressed === 'mixed',
31778      'is-busy': isBusy,
31779      'is-link': variant === 'link',
31780      'is-destructive': isDestructive,
31781      'has-text': !!icon && (hasChildren || text),
31782      'has-icon': !!icon
31783    });
31784    const trulyDisabled = disabled && !accessibleWhenDisabled;
31785    const Tag = href !== undefined && !disabled ? 'a' : 'button';
31786    const buttonProps = Tag === 'button' ? {
31787      type: 'button',
31788      disabled: trulyDisabled,
31789      'aria-checked': ariaChecked,
31790      'aria-pressed': ariaPressed,
31791      'aria-selected': ariaSelected
31792    } : {};
31793    const anchorProps = Tag === 'a' ? {
31794      href,
31795      target
31796    } : {};
31797    const disableEventProps = {};
31798    if (disabled && accessibleWhenDisabled) {
31799      // In this case, the button will be disabled, but still focusable and
31800      // perceivable by screen reader users.
31801      buttonProps['aria-disabled'] = true;
31802      anchorProps['aria-disabled'] = true;
31803      for (const disabledEvent of disabledEventsOnDisabledButton) {
31804        disableEventProps[disabledEvent] = event => {
31805          if (event) {
31806            event.stopPropagation();
31807            event.preventDefault();
31808          }
31809        };
31810      }
31811    }
31812  
31813    // Should show the tooltip if...
31814    const shouldShowTooltip = !trulyDisabled && (
31815    // An explicit tooltip is passed or...
31816    showTooltip && !!label ||
31817    // There's a shortcut or...
31818    !!shortcut ||
31819    // There's a label and...
31820    !!label &&
31821    // The children are empty and...
31822    !children?.length &&
31823    // The tooltip is not explicitly disabled.
31824    false !== showTooltip);
31825    const descriptionId = description ? instanceId : undefined;
31826    const describedById = additionalProps['aria-describedby'] || descriptionId;
31827    const commonProps = {
31828      className: classes,
31829      'aria-label': additionalProps['aria-label'] || label,
31830      'aria-describedby': describedById,
31831      ref
31832    };
31833    const elementChildren = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, {
31834      children: [icon && iconPosition === 'left' && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_icon, {
31835        icon: icon,
31836        size: iconSize
31837      }), text && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_ReactJSXRuntime_namespaceObject.Fragment, {
31838        children: text
31839      }), children, icon && iconPosition === 'right' && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_icon, {
31840        icon: icon,
31841        size: iconSize
31842      })]
31843    });
31844    const element = Tag === 'a' ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("a", {
31845      ...anchorProps,
31846      ...additionalProps,
31847      ...disableEventProps,
31848      ...commonProps,
31849      children: elementChildren
31850    }) : /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("button", {
31851      ...buttonProps,
31852      ...additionalProps,
31853      ...disableEventProps,
31854      ...commonProps,
31855      children: elementChildren
31856    });
31857  
31858    // In order to avoid some React reconciliation issues, we are always rendering
31859    // the `Tooltip` component even when `shouldShowTooltip` is `false`.
31860    // In order to make sure that the tooltip doesn't show when it shouldn't,
31861    // we don't pass the props to the `Tooltip` component.
31862    const tooltipProps = shouldShowTooltip ? {
31863      text: children?.length && description ? description : label,
31864      shortcut,
31865      placement: tooltipPosition &&
31866      // Convert legacy `position` values to be used with the new `placement` prop
31867      positionToPlacement(tooltipPosition)
31868    } : {};
31869    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, {
31870      children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(tooltip, {
31871        ...tooltipProps,
31872        children: element
31873      }), description && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(visually_hidden_component, {
31874        children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", {
31875          id: descriptionId,
31876          children: description
31877        })
31878      })]
31879    });
31880  }
31881  
31882  /**
31883   * Lets users take actions and make choices with a single click or tap.
31884   *
31885   * ```jsx
31886   * import { Button } from '@wordpress/components';
31887   * const Mybutton = () => (
31888   *   <Button
31889   *     variant="primary"
31890   *     onClick={ handleClick }
31891   *   >
31892   *     Click here
31893   *   </Button>
31894   * );
31895   * ```
31896   */
31897  const Button = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedButton);
31898  /* harmony default export */ const build_module_button = (Button);
31899  
31900  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/number-control/styles/number-control-styles.js
31901  
31902  function number_control_styles_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)."; }
31903  /**
31904   * External dependencies
31905   */
31906  
31907  /**
31908   * Internal dependencies
31909   */
31910  
31911  
31912  
31913  
31914  var number_control_styles_ref =  true ? {
31915    name: "euqsgg",
31916    styles: "input[type='number']::-webkit-outer-spin-button,input[type='number']::-webkit-inner-spin-button{-webkit-appearance:none!important;margin:0!important;}input[type='number']{-moz-appearance:textfield;}"
31917  } : 0;
31918  const htmlArrowStyles = ({
31919    hideHTMLArrows
31920  }) => {
31921    if (!hideHTMLArrows) {
31922      return ``;
31923    }
31924    return number_control_styles_ref;
31925  };
31926  const number_control_styles_Input = /*#__PURE__*/emotion_styled_base_browser_esm(input_control,  true ? {
31927    target: "ep09it41"
31928  } : 0)(htmlArrowStyles, ";" + ( true ? "" : 0));
31929  const SpinButton = /*#__PURE__*/emotion_styled_base_browser_esm(build_module_button,  true ? {
31930    target: "ep09it40"
31931  } : 0)("&&&&&{color:", COLORS.theme.accent, ";}" + ( true ? "" : 0));
31932  const smallSpinButtons = /*#__PURE__*/emotion_react_browser_esm_css("width:", space(5), ";min-width:", space(5), ";height:", space(5), ";" + ( true ? "" : 0),  true ? "" : 0);
31933  const styles = {
31934    smallSpinButtons
31935  };
31936  
31937  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/utils/math.js
31938  /**
31939   * Parses and retrieves a number value.
31940   *
31941   * @param {unknown} value The incoming value.
31942   *
31943   * @return {number} The parsed number value.
31944   */
31945  function getNumber(value) {
31946    const number = Number(value);
31947    return isNaN(number) ? 0 : number;
31948  }
31949  
31950  /**
31951   * Safely adds 2 values.
31952   *
31953   * @param {Array<number|string>} args Values to add together.
31954   *
31955   * @return {number} The sum of values.
31956   */
31957  function add(...args) {
31958    return args.reduce( /** @type {(sum:number, arg: number|string) => number} */
31959    (sum, arg) => sum + getNumber(arg), 0);
31960  }
31961  
31962  /**
31963   * Safely subtracts 2 values.
31964   *
31965   * @param {Array<number|string>} args Values to subtract together.
31966   *
31967   * @return {number} The difference of the values.
31968   */
31969  function subtract(...args) {
31970    return args.reduce( /** @type {(diff:number, arg: number|string, index:number) => number} */
31971    (diff, arg, index) => {
31972      const value = getNumber(arg);
31973      return index === 0 ? value : diff - value;
31974    }, 0);
31975  }
31976  
31977  /**
31978   * Determines the decimal position of a number value.
31979   *
31980   * @param {number} value The number to evaluate.
31981   *
31982   * @return {number} The number of decimal places.
31983   */
31984  function getPrecision(value) {
31985    const split = (value + '').split('.');
31986    return split[1] !== undefined ? split[1].length : 0;
31987  }
31988  
31989  /**
31990   * Clamps a value based on a min/max range.
31991   *
31992   * @param {number} value The value.
31993   * @param {number} min   The minimum range.
31994   * @param {number} max   The maximum range.
31995   *
31996   * @return {number} The clamped value.
31997   */
31998  function math_clamp(value, min, max) {
31999    const baseValue = getNumber(value);
32000    return Math.max(min, Math.min(baseValue, max));
32001  }
32002  
32003  /**
32004   * Clamps a value based on a min/max range with rounding
32005   *
32006   * @param {number | string} value The value.
32007   * @param {number}          min   The minimum range.
32008   * @param {number}          max   The maximum range.
32009   * @param {number}          step  A multiplier for the value.
32010   *
32011   * @return {number} The rounded and clamped value.
32012   */
32013  function roundClamp(value = 0, min = Infinity, max = Infinity, step = 1) {
32014    const baseValue = getNumber(value);
32015    const stepValue = getNumber(step);
32016    const precision = getPrecision(step);
32017    const rounded = Math.round(baseValue / stepValue) * stepValue;
32018    const clampedValue = math_clamp(rounded, min, max);
32019    return precision ? getNumber(clampedValue.toFixed(precision)) : clampedValue;
32020  }
32021  
32022  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/h-stack/utils.js
32023  /**
32024   * External dependencies
32025   */
32026  
32027  /**
32028   * Internal dependencies
32029   */
32030  
32031  
32032  const H_ALIGNMENTS = {
32033    bottom: {
32034      align: 'flex-end',
32035      justify: 'center'
32036    },
32037    bottomLeft: {
32038      align: 'flex-end',
32039      justify: 'flex-start'
32040    },
32041    bottomRight: {
32042      align: 'flex-end',
32043      justify: 'flex-end'
32044    },
32045    center: {
32046      align: 'center',
32047      justify: 'center'
32048    },
32049    edge: {
32050      align: 'center',
32051      justify: 'space-between'
32052    },
32053    left: {
32054      align: 'center',
32055      justify: 'flex-start'
32056    },
32057    right: {
32058      align: 'center',
32059      justify: 'flex-end'
32060    },
32061    stretch: {
32062      align: 'stretch'
32063    },
32064    top: {
32065      align: 'flex-start',
32066      justify: 'center'
32067    },
32068    topLeft: {
32069      align: 'flex-start',
32070      justify: 'flex-start'
32071    },
32072    topRight: {
32073      align: 'flex-start',
32074      justify: 'flex-end'
32075    }
32076  };
32077  const V_ALIGNMENTS = {
32078    bottom: {
32079      justify: 'flex-end',
32080      align: 'center'
32081    },
32082    bottomLeft: {
32083      justify: 'flex-end',
32084      align: 'flex-start'
32085    },
32086    bottomRight: {
32087      justify: 'flex-end',
32088      align: 'flex-end'
32089    },
32090    center: {
32091      justify: 'center',
32092      align: 'center'
32093    },
32094    edge: {
32095      justify: 'space-between',
32096      align: 'center'
32097    },
32098    left: {
32099      justify: 'center',
32100      align: 'flex-start'
32101    },
32102    right: {
32103      justify: 'center',
32104      align: 'flex-end'
32105    },
32106    stretch: {
32107      align: 'stretch'
32108    },
32109    top: {
32110      justify: 'flex-start',
32111      align: 'center'
32112    },
32113    topLeft: {
32114      justify: 'flex-start',
32115      align: 'flex-start'
32116    },
32117    topRight: {
32118      justify: 'flex-start',
32119      align: 'flex-end'
32120    }
32121  };
32122  function getAlignmentProps(alignment, direction = 'row') {
32123    if (!isValueDefined(alignment)) {
32124      return {};
32125    }
32126    const isVertical = direction === 'column';
32127    const props = isVertical ? V_ALIGNMENTS : H_ALIGNMENTS;
32128    const alignmentProps = alignment in props ? props[alignment] : {
32129      align: alignment
32130    };
32131    return alignmentProps;
32132  }
32133  
32134  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/utils/get-valid-children.js
32135  /**
32136   * External dependencies
32137   */
32138  
32139  /**
32140   * WordPress dependencies
32141   */
32142  
32143  
32144  /**
32145   * Gets a collection of available children elements from a React component's children prop.
32146   *
32147   * @param children
32148   *
32149   * @return An array of available children.
32150   */
32151  function getValidChildren(children) {
32152    if (typeof children === 'string') {
32153      return [children];
32154    }
32155    return external_wp_element_namespaceObject.Children.toArray(children).filter(child => (0,external_wp_element_namespaceObject.isValidElement)(child));
32156  }
32157  
32158  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/h-stack/hook.js
32159  /**
32160   * External dependencies
32161   */
32162  
32163  /**
32164   * Internal dependencies
32165   */
32166  
32167  
32168  
32169  
32170  
32171  
32172  function useHStack(props) {
32173    const {
32174      alignment = 'edge',
32175      children,
32176      direction,
32177      spacing = 2,
32178      ...otherProps
32179    } = useContextSystem(props, 'HStack');
32180    const align = getAlignmentProps(alignment, direction);
32181    const validChildren = getValidChildren(children);
32182    const clonedChildren = validChildren.map((child, index) => {
32183      const _isSpacer = hasConnectNamespace(child, ['Spacer']);
32184      if (_isSpacer) {
32185        const childElement = child;
32186        const _key = childElement.key || `hstack-$index}`;
32187        return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(flex_item_component, {
32188          isBlock: true,
32189          ...childElement.props
32190        }, _key);
32191      }
32192      return child;
32193    });
32194    const propsForFlex = {
32195      children: clonedChildren,
32196      direction,
32197      justify: 'center',
32198      ...align,
32199      ...otherProps,
32200      gap: spacing
32201    };
32202  
32203    // Omit `isColumn` because it's not used in HStack.
32204    const {
32205      isColumn,
32206      ...flexProps
32207    } = useFlex(propsForFlex);
32208    return flexProps;
32209  }
32210  
32211  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/h-stack/component.js
32212  /**
32213   * Internal dependencies
32214   */
32215  
32216  
32217  
32218  
32219  
32220  function UnconnectedHStack(props, forwardedRef) {
32221    const hStackProps = useHStack(props);
32222    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(component, {
32223      ...hStackProps,
32224      ref: forwardedRef
32225    });
32226  }
32227  
32228  /**
32229   * `HStack` (Horizontal Stack) arranges child elements in a horizontal line.
32230   *
32231   * `HStack` can render anything inside.
32232   *
32233   * ```jsx
32234   * import {
32235   *     __experimentalHStack as HStack,
32236   *     __experimentalText as Text,
32237   * } from `@wordpress/components`;
32238   *
32239   * function Example() {
32240   *     return (
32241   *         <HStack>
32242   *             <Text>Code</Text>
32243   *             <Text>is</Text>
32244   *             <Text>Poetry</Text>
32245   *         </HStack>
32246   *     );
32247   * }
32248   * ```
32249   */
32250  const HStack = contextConnect(UnconnectedHStack, 'HStack');
32251  /* harmony default export */ const h_stack_component = (HStack);
32252  
32253  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/number-control/index.js
32254  /**
32255   * External dependencies
32256   */
32257  
32258  /**
32259   * WordPress dependencies
32260   */
32261  
32262  
32263  
32264  
32265  
32266  
32267  /**
32268   * Internal dependencies
32269   */
32270  
32271  
32272  
32273  
32274  
32275  
32276  
32277  
32278  
32279  
32280  
32281  const number_control_noop = () => {};
32282  function UnforwardedNumberControl(props, forwardedRef) {
32283    const {
32284      __unstableStateReducer: stateReducerProp,
32285      className,
32286      dragDirection = 'n',
32287      hideHTMLArrows = false,
32288      spinControls = hideHTMLArrows ? 'none' : 'native',
32289      isDragEnabled = true,
32290      isShiftStepEnabled = true,
32291      label,
32292      max = Infinity,
32293      min = -Infinity,
32294      required = false,
32295      shiftStep = 10,
32296      step = 1,
32297      spinFactor = 1,
32298      type: typeProp = 'number',
32299      value: valueProp,
32300      size = 'default',
32301      suffix,
32302      onChange = number_control_noop,
32303      ...restProps
32304    } = useDeprecated36pxDefaultSizeProp(props);
32305    if (hideHTMLArrows) {
32306      external_wp_deprecated_default()('wp.components.NumberControl hideHTMLArrows prop ', {
32307        alternative: 'spinControls="none"',
32308        since: '6.2',
32309        version: '6.3'
32310      });
32311    }
32312    const inputRef = (0,external_wp_element_namespaceObject.useRef)();
32313    const mergedRef = (0,external_wp_compose_namespaceObject.useMergeRefs)([inputRef, forwardedRef]);
32314    const isStepAny = step === 'any';
32315    const baseStep = isStepAny ? 1 : ensureNumber(step);
32316    const baseSpin = ensureNumber(spinFactor) * baseStep;
32317    const baseValue = roundClamp(0, min, max, baseStep);
32318    const constrainValue = (value, stepOverride) => {
32319      // When step is "any" clamp the value, otherwise round and clamp it.
32320      // Use '' + to convert to string for use in input value attribute.
32321      return isStepAny ? '' + Math.min(max, Math.max(min, ensureNumber(value))) : '' + roundClamp(value, min, max, stepOverride !== null && stepOverride !== void 0 ? stepOverride : baseStep);
32322    };
32323    const autoComplete = typeProp === 'number' ? 'off' : undefined;
32324    const classes = dist_clsx('components-number-control', className);
32325    const cx = useCx();
32326    const spinButtonClasses = cx(size === 'small' && styles.smallSpinButtons);
32327    const spinValue = (value, direction, event) => {
32328      event?.preventDefault();
32329      const shift = event?.shiftKey && isShiftStepEnabled;
32330      const delta = shift ? ensureNumber(shiftStep) * baseSpin : baseSpin;
32331      let nextValue = isValueEmpty(value) ? baseValue : value;
32332      if (direction === 'up') {
32333        nextValue = add(nextValue, delta);
32334      } else if (direction === 'down') {
32335        nextValue = subtract(nextValue, delta);
32336      }
32337      return constrainValue(nextValue, shift ? delta : undefined);
32338    };
32339  
32340    /**
32341     * "Middleware" function that intercepts updates from InputControl.
32342     * This allows us to tap into actions to transform the (next) state for
32343     * InputControl.
32344     *
32345     * @return The updated state to apply to InputControl
32346     */
32347    const numberControlStateReducer = (state, action) => {
32348      const nextState = {
32349        ...state
32350      };
32351      const {
32352        type,
32353        payload
32354      } = action;
32355      const event = payload.event;
32356      const currentValue = nextState.value;
32357  
32358      /**
32359       * Handles custom UP and DOWN Keyboard events
32360       */
32361      if (type === PRESS_UP || type === PRESS_DOWN) {
32362        nextState.value = spinValue(currentValue, type === PRESS_UP ? 'up' : 'down', event);
32363      }
32364  
32365      /**
32366       * Handles drag to update events
32367       */
32368      if (type === DRAG && isDragEnabled) {
32369        const [x, y] = payload.delta;
32370        const enableShift = payload.shiftKey && isShiftStepEnabled;
32371        const modifier = enableShift ? ensureNumber(shiftStep) * baseSpin : baseSpin;
32372        let directionModifier;
32373        let delta;
32374        switch (dragDirection) {
32375          case 'n':
32376            delta = y;
32377            directionModifier = -1;
32378            break;
32379          case 'e':
32380            delta = x;
32381            directionModifier = (0,external_wp_i18n_namespaceObject.isRTL)() ? -1 : 1;
32382            break;
32383          case 's':
32384            delta = y;
32385            directionModifier = 1;
32386            break;
32387          case 'w':
32388            delta = x;
32389            directionModifier = (0,external_wp_i18n_namespaceObject.isRTL)() ? 1 : -1;
32390            break;
32391        }
32392        if (delta !== 0) {
32393          delta = Math.ceil(Math.abs(delta)) * Math.sign(delta);
32394          const distance = delta * modifier * directionModifier;
32395          nextState.value = constrainValue(
32396          // @ts-expect-error TODO: Investigate if it's ok for currentValue to be undefined
32397          add(currentValue, distance), enableShift ? modifier : undefined);
32398        }
32399      }
32400  
32401      /**
32402       * Handles commit (ENTER key press or blur)
32403       */
32404      if (type === PRESS_ENTER || type === COMMIT) {
32405        const applyEmptyValue = required === false && currentValue === '';
32406        nextState.value = applyEmptyValue ? currentValue :
32407        // @ts-expect-error TODO: Investigate if it's ok for currentValue to be undefined
32408        constrainValue(currentValue);
32409      }
32410      return nextState;
32411    };
32412    const buildSpinButtonClickHandler = direction => event => onChange(String(spinValue(valueProp, direction, event)), {
32413      // Set event.target to the <input> so that consumers can use
32414      // e.g. event.target.validity.
32415      event: {
32416        ...event,
32417        target: inputRef.current
32418      }
32419    });
32420    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(number_control_styles_Input, {
32421      autoComplete: autoComplete,
32422      inputMode: "numeric",
32423      ...restProps,
32424      className: classes,
32425      dragDirection: dragDirection,
32426      hideHTMLArrows: spinControls !== 'native',
32427      isDragEnabled: isDragEnabled,
32428      label: label,
32429      max: max,
32430      min: min,
32431      ref: mergedRef,
32432      required: required,
32433      step: step,
32434      type: typeProp
32435      // @ts-expect-error TODO: Resolve discrepancy between `value` types in InputControl based components
32436      ,
32437      value: valueProp,
32438      __unstableStateReducer: (state, action) => {
32439        var _stateReducerProp;
32440        const baseState = numberControlStateReducer(state, action);
32441        return (_stateReducerProp = stateReducerProp?.(baseState, action)) !== null && _stateReducerProp !== void 0 ? _stateReducerProp : baseState;
32442      },
32443      size: size,
32444      suffix: spinControls === 'custom' ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, {
32445        children: [suffix, /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(spacer_component, {
32446          marginBottom: 0,
32447          marginRight: 2,
32448          children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(h_stack_component, {
32449            spacing: 1,
32450            children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(SpinButton, {
32451              className: spinButtonClasses,
32452              icon: library_plus,
32453              size: "small",
32454              label: (0,external_wp_i18n_namespaceObject.__)('Increment'),
32455              onClick: buildSpinButtonClickHandler('up')
32456            }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(SpinButton, {
32457              className: spinButtonClasses,
32458              icon: library_reset,
32459              size: "small",
32460              label: (0,external_wp_i18n_namespaceObject.__)('Decrement'),
32461              onClick: buildSpinButtonClickHandler('down')
32462            })]
32463          })
32464        })]
32465      }) : suffix,
32466      onChange: onChange
32467    });
32468  }
32469  const NumberControl = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedNumberControl);
32470  /* harmony default export */ const number_control = (NumberControl);
32471  
32472  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/angle-picker-control/styles/angle-picker-control-styles.js
32473  
32474  function angle_picker_control_styles_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)."; }
32475  /**
32476   * External dependencies
32477   */
32478  
32479  /**
32480   * Internal dependencies
32481   */
32482  
32483  
32484  
32485  
32486  const CIRCLE_SIZE = 32;
32487  const INNER_CIRCLE_SIZE = 6;
32488  const CircleRoot = /*#__PURE__*/emotion_styled_base_browser_esm("div",  true ? {
32489    target: "eln3bjz3"
32490  } : 0)("border-radius:", config_values.radiusRound, ";border:", config_values.borderWidth, " solid ", COLORS.ui.border, ";box-sizing:border-box;cursor:grab;height:", CIRCLE_SIZE, "px;overflow:hidden;width:", CIRCLE_SIZE, "px;:active{cursor:grabbing;}" + ( true ? "" : 0));
32491  const CircleIndicatorWrapper = /*#__PURE__*/emotion_styled_base_browser_esm("div",  true ? {
32492    target: "eln3bjz2"
32493  } : 0)( true ? {
32494    name: "1r307gh",
32495    styles: "box-sizing:border-box;position:relative;width:100%;height:100%;:focus-visible{outline:none;}"
32496  } : 0);
32497  const CircleIndicator = /*#__PURE__*/emotion_styled_base_browser_esm("div",  true ? {
32498    target: "eln3bjz1"
32499  } : 0)("background:", COLORS.theme.accent, ";border-radius:", config_values.radiusRound, ";box-sizing:border-box;display:block;left:50%;top:4px;transform:translateX( -50% );position:absolute;width:", INNER_CIRCLE_SIZE, "px;height:", INNER_CIRCLE_SIZE, "px;" + ( true ? "" : 0));
32500  const UnitText = /*#__PURE__*/emotion_styled_base_browser_esm(text_component,  true ? {
32501    target: "eln3bjz0"
32502  } : 0)("color:", COLORS.theme.accent, ";margin-right:", space(3), ";" + ( true ? "" : 0));
32503  
32504  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/angle-picker-control/angle-circle.js
32505  /**
32506   * WordPress dependencies
32507   */
32508  
32509  
32510  
32511  /**
32512   * Internal dependencies
32513   */
32514  
32515  
32516  function AngleCircle({
32517    value,
32518    onChange,
32519    ...props
32520  }) {
32521    const angleCircleRef = (0,external_wp_element_namespaceObject.useRef)(null);
32522    const angleCircleCenterRef = (0,external_wp_element_namespaceObject.useRef)();
32523    const previousCursorValueRef = (0,external_wp_element_namespaceObject.useRef)();
32524    const setAngleCircleCenter = () => {
32525      if (angleCircleRef.current === null) {
32526        return;
32527      }
32528      const rect = angleCircleRef.current.getBoundingClientRect();
32529      angleCircleCenterRef.current = {
32530        x: rect.x + rect.width / 2,
32531        y: rect.y + rect.height / 2
32532      };
32533    };
32534    const changeAngleToPosition = event => {
32535      if (event === undefined) {
32536        return;
32537      }
32538  
32539      // Prevent (drag) mouse events from selecting and accidentally
32540      // triggering actions from other elements.
32541      event.preventDefault();
32542      // Input control needs to lose focus and by preventDefault above, it doesn't.
32543      event.target?.focus();
32544      if (angleCircleCenterRef.current !== undefined && onChange !== undefined) {
32545        const {
32546          x: centerX,
32547          y: centerY
32548        } = angleCircleCenterRef.current;
32549        onChange(getAngle(centerX, centerY, event.clientX, event.clientY));
32550      }
32551    };
32552    const {
32553      startDrag,
32554      isDragging
32555    } = (0,external_wp_compose_namespaceObject.__experimentalUseDragging)({
32556      onDragStart: event => {
32557        setAngleCircleCenter();
32558        changeAngleToPosition(event);
32559      },
32560      onDragMove: changeAngleToPosition,
32561      onDragEnd: changeAngleToPosition
32562    });
32563    (0,external_wp_element_namespaceObject.useEffect)(() => {
32564      if (isDragging) {
32565        if (previousCursorValueRef.current === undefined) {
32566          previousCursorValueRef.current = document.body.style.cursor;
32567        }
32568        document.body.style.cursor = 'grabbing';
32569      } else {
32570        document.body.style.cursor = previousCursorValueRef.current || '';
32571        previousCursorValueRef.current = undefined;
32572      }
32573    }, [isDragging]);
32574    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(CircleRoot, {
32575      ref: angleCircleRef,
32576      onMouseDown: startDrag,
32577      className: "components-angle-picker-control__angle-circle",
32578      ...props,
32579      children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(CircleIndicatorWrapper, {
32580        style: value ? {
32581          transform: `rotate($value}deg)`
32582        } : undefined,
32583        className: "components-angle-picker-control__angle-circle-indicator-wrapper",
32584        tabIndex: -1,
32585        children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(CircleIndicator, {
32586          className: "components-angle-picker-control__angle-circle-indicator"
32587        })
32588      })
32589    });
32590  }
32591  function getAngle(centerX, centerY, pointX, pointY) {
32592    const y = pointY - centerY;
32593    const x = pointX - centerX;
32594    const angleInRadians = Math.atan2(y, x);
32595    const angleInDeg = Math.round(angleInRadians * (180 / Math.PI)) + 90;
32596    if (angleInDeg < 0) {
32597      return 360 + angleInDeg;
32598    }
32599    return angleInDeg;
32600  }
32601  /* harmony default export */ const angle_circle = (AngleCircle);
32602  
32603  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/angle-picker-control/index.js
32604  /**
32605   * External dependencies
32606   */
32607  
32608  
32609  
32610  /**
32611   * WordPress dependencies
32612   */
32613  
32614  
32615  
32616  /**
32617   * Internal dependencies
32618   */
32619  
32620  
32621  
32622  
32623  
32624  
32625  
32626  function UnforwardedAnglePickerControl(props, ref) {
32627    const {
32628      className,
32629      label = (0,external_wp_i18n_namespaceObject.__)('Angle'),
32630      onChange,
32631      value,
32632      ...restProps
32633    } = props;
32634    const handleOnNumberChange = unprocessedValue => {
32635      if (onChange === undefined) {
32636        return;
32637      }
32638      const inputValue = unprocessedValue !== undefined && unprocessedValue !== '' ? parseInt(unprocessedValue, 10) : 0;
32639      onChange(inputValue);
32640    };
32641    const classes = dist_clsx('components-angle-picker-control', className);
32642    const unitText = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(UnitText, {
32643      children: "\xB0"
32644    });
32645    const [prefixedUnitText, suffixedUnitText] = (0,external_wp_i18n_namespaceObject.isRTL)() ? [unitText, null] : [null, unitText];
32646    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(flex_component, {
32647      ...restProps,
32648      ref: ref,
32649      className: classes,
32650      gap: 2,
32651      children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(flex_block_component, {
32652        children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(number_control, {
32653          label: label,
32654          className: "components-angle-picker-control__input-field",
32655          max: 360,
32656          min: 0,
32657          onChange: handleOnNumberChange,
32658          size: "__unstable-large",
32659          step: "1",
32660          value: value,
32661          spinControls: "none",
32662          prefix: prefixedUnitText,
32663          suffix: suffixedUnitText
32664        })
32665      }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(spacer_component, {
32666        marginBottom: "1",
32667        marginTop: "auto",
32668        children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(angle_circle, {
32669          "aria-hidden": "true",
32670          value: value,
32671          onChange: onChange
32672        })
32673      })]
32674    });
32675  }
32676  
32677  /**
32678   * `AnglePickerControl` is a React component to render a UI that allows users to
32679   * pick an angle. Users can choose an angle in a visual UI with the mouse by
32680   * dragging an angle indicator inside a circle or by directly inserting the
32681   * desired angle in a text field.
32682   *
32683   * ```jsx
32684   * import { useState } from '@wordpress/element';
32685   * import { AnglePickerControl } from '@wordpress/components';
32686   *
32687   * function Example() {
32688   *   const [ angle, setAngle ] = useState( 0 );
32689   *   return (
32690   *     <AnglePickerControl
32691   *       value={ angle }
32692   *       onChange={ setAngle }
32693   *     </>
32694   *   );
32695   * }
32696   * ```
32697   */
32698  const AnglePickerControl = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedAnglePickerControl);
32699  /* harmony default export */ const angle_picker_control = (AnglePickerControl);
32700  
32701  // EXTERNAL MODULE: ./node_modules/remove-accents/index.js
32702  var remove_accents = __webpack_require__(9681);
32703  var remove_accents_default = /*#__PURE__*/__webpack_require__.n(remove_accents);
32704  ;// CONCATENATED MODULE: external ["wp","richText"]
32705  const external_wp_richText_namespaceObject = window["wp"]["richText"];
32706  ;// CONCATENATED MODULE: external ["wp","a11y"]
32707  const external_wp_a11y_namespaceObject = window["wp"]["a11y"];
32708  ;// CONCATENATED MODULE: external ["wp","keycodes"]
32709  const external_wp_keycodes_namespaceObject = window["wp"]["keycodes"];
32710  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/utils/strings.js
32711  /**
32712   * External dependencies
32713   */
32714  
32715  
32716  
32717  /**
32718   * All unicode characters that we consider "dash-like":
32719   * - `\u007e`: ~ (tilde)
32720   * - `\u00ad`: ­ (soft hyphen)
32721   * - `\u2053`: ⁓ (swung dash)
32722   * - `\u207b`: ⁻ (superscript minus)
32723   * - `\u208b`: ₋ (subscript minus)
32724   * - `\u2212`: − (minus sign)
32725   * - `\\p{Pd}`: any other Unicode dash character
32726   */
32727  const ALL_UNICODE_DASH_CHARACTERS = new RegExp(/[\u007e\u00ad\u2053\u207b\u208b\u2212\p{Pd}]/gu);
32728  const normalizeTextString = value => {
32729    return remove_accents_default()(value).toLocaleLowerCase().replace(ALL_UNICODE_DASH_CHARACTERS, '-');
32730  };
32731  
32732  /**
32733   * Converts any string to kebab case.
32734   * Backwards compatible with Lodash's `_.kebabCase()`.
32735   * Backwards compatible with `_wp_to_kebab_case()`.
32736   *
32737   * @see https://lodash.com/docs/4.17.15#kebabCase
32738   * @see https://developer.wordpress.org/reference/functions/_wp_to_kebab_case/
32739   *
32740   * @param str String to convert.
32741   * @return Kebab-cased string
32742   */
32743  function kebabCase(str) {
32744    var _str$toString;
32745    let input = (_str$toString = str?.toString?.()) !== null && _str$toString !== void 0 ? _str$toString : '';
32746  
32747    // See https://github.com/lodash/lodash/blob/b185fcee26b2133bd071f4aaca14b455c2ed1008/lodash.js#L4970
32748    input = input.replace(/['\u2019]/, '');
32749    return paramCase(input, {
32750      splitRegexp: [/(?!(?:1ST|2ND|3RD|[4-9]TH)(?![a-z]))([a-z0-9])([A-Z])/g,
32751      // fooBar => foo-bar, 3Bar => 3-bar
32752      /(?!(?:1st|2nd|3rd|[4-9]th)(?![a-z]))([0-9])([a-z])/g,
32753      // 3bar => 3-bar
32754      /([A-Za-z])([0-9])/g,
32755      // Foo3 => foo-3, foo3 => foo-3
32756      /([A-Z])([A-Z][a-z])/g // FOOBar => foo-bar
32757      ]
32758    });
32759  }
32760  
32761  /**
32762   * Escapes the RegExp special characters.
32763   *
32764   * @param string Input string.
32765   *
32766   * @return Regex-escaped string.
32767   */
32768  function escapeRegExp(string) {
32769    return string.replace(/[\\^$.*+?()[\]{}|]/g, '\\$&');
32770  }
32771  
32772  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/autocomplete/get-default-use-items.js
32773  /**
32774   * External dependencies
32775   */
32776  
32777  
32778  /**
32779   * WordPress dependencies
32780   */
32781  
32782  
32783  
32784  /**
32785   * Internal dependencies
32786   */
32787  
32788  function filterOptions(search, options = [], maxResults = 10) {
32789    const filtered = [];
32790    for (let i = 0; i < options.length; i++) {
32791      const option = options[i];
32792  
32793      // Merge label into keywords.
32794      let {
32795        keywords = []
32796      } = option;
32797      if ('string' === typeof option.label) {
32798        keywords = [...keywords, option.label];
32799      }
32800      const isMatch = keywords.some(keyword => search.test(remove_accents_default()(keyword)));
32801      if (!isMatch) {
32802        continue;
32803      }
32804      filtered.push(option);
32805  
32806      // Abort early if max reached.
32807      if (filtered.length === maxResults) {
32808        break;
32809      }
32810    }
32811    return filtered;
32812  }
32813  function getDefaultUseItems(autocompleter) {
32814    return filterValue => {
32815      const [items, setItems] = (0,external_wp_element_namespaceObject.useState)([]);
32816      /*
32817       * We support both synchronous and asynchronous retrieval of completer options
32818       * but internally treat all as async so we maintain a single, consistent code path.
32819       *
32820       * Because networks can be slow, and the internet is wonderfully unpredictable,
32821       * we don't want two promises updating the state at once. This ensures that only
32822       * the most recent promise will act on `optionsData`. This doesn't use the state
32823       * because `setState` is batched, and so there's no guarantee that setting
32824       * `activePromise` in the state would result in it actually being in `this.state`
32825       * before the promise resolves and we check to see if this is the active promise or not.
32826       */
32827      (0,external_wp_element_namespaceObject.useLayoutEffect)(() => {
32828        const {
32829          options,
32830          isDebounced
32831        } = autocompleter;
32832        const loadOptions = (0,external_wp_compose_namespaceObject.debounce)(() => {
32833          const promise = Promise.resolve(typeof options === 'function' ? options(filterValue) : options).then(optionsData => {
32834            if (promise.canceled) {
32835              return;
32836            }
32837            const keyedOptions = optionsData.map((optionData, optionIndex) => ({
32838              key: `$autocompleter.name}-$optionIndex}`,
32839              value: optionData,
32840              label: autocompleter.getOptionLabel(optionData),
32841              keywords: autocompleter.getOptionKeywords ? autocompleter.getOptionKeywords(optionData) : [],
32842              isDisabled: autocompleter.isOptionDisabled ? autocompleter.isOptionDisabled(optionData) : false
32843            }));
32844  
32845            // Create a regular expression to filter the options.
32846            const search = new RegExp('(?:\\b|\\s|^)' + escapeRegExp(filterValue), 'i');
32847            setItems(filterOptions(search, keyedOptions));
32848          });
32849          return promise;
32850        }, isDebounced ? 250 : 0);
32851        const promise = loadOptions();
32852        return () => {
32853          loadOptions.cancel();
32854          if (promise) {
32855            promise.canceled = true;
32856          }
32857        };
32858      }, [filterValue]);
32859      return [items];
32860    };
32861  }
32862  
32863  ;// CONCATENATED MODULE: ./node_modules/@floating-ui/react-dom/dist/floating-ui.react-dom.mjs
32864  
32865  
32866  
32867  
32868  
32869  
32870  /**
32871   * Provides data to position an inner element of the floating element so that it
32872   * appears centered to the reference element.
32873   * This wraps the core `arrow` middleware to allow React refs as the element.
32874   * @see https://floating-ui.com/docs/arrow
32875   */
32876  const floating_ui_react_dom_arrow = options => {
32877    function isRef(value) {
32878      return {}.hasOwnProperty.call(value, 'current');
32879    }
32880    return {
32881      name: 'arrow',
32882      options,
32883      fn(state) {
32884        const {
32885          element,
32886          padding
32887        } = typeof options === 'function' ? options(state) : options;
32888        if (element && isRef(element)) {
32889          if (element.current != null) {
32890            return floating_ui_dom_arrow({
32891              element: element.current,
32892              padding
32893            }).fn(state);
32894          }
32895          return {};
32896        }
32897        if (element) {
32898          return floating_ui_dom_arrow({
32899            element,
32900            padding
32901          }).fn(state);
32902        }
32903        return {};
32904      }
32905    };
32906  };
32907  
32908  var index = typeof document !== 'undefined' ? external_React_.useLayoutEffect : external_React_.useEffect;
32909  
32910  // Fork of `fast-deep-equal` that only does the comparisons we need and compares
32911  // functions
32912  function deepEqual(a, b) {
32913    if (a === b) {
32914      return true;
32915    }
32916    if (typeof a !== typeof b) {
32917      return false;
32918    }
32919    if (typeof a === 'function' && a.toString() === b.toString()) {
32920      return true;
32921    }
32922    let length;
32923    let i;
32924    let keys;
32925    if (a && b && typeof a === 'object') {
32926      if (Array.isArray(a)) {
32927        length = a.length;
32928        if (length !== b.length) return false;
32929        for (i = length; i-- !== 0;) {
32930          if (!deepEqual(a[i], b[i])) {
32931            return false;
32932          }
32933        }
32934        return true;
32935      }
32936      keys = Object.keys(a);
32937      length = keys.length;
32938      if (length !== Object.keys(b).length) {
32939        return false;
32940      }
32941      for (i = length; i-- !== 0;) {
32942        if (!{}.hasOwnProperty.call(b, keys[i])) {
32943          return false;
32944        }
32945      }
32946      for (i = length; i-- !== 0;) {
32947        const key = keys[i];
32948        if (key === '_owner' && a.$$typeof) {
32949          continue;
32950        }
32951        if (!deepEqual(a[key], b[key])) {
32952          return false;
32953        }
32954      }
32955      return true;
32956    }
32957  
32958    // biome-ignore lint/suspicious/noSelfCompare: in source
32959    return a !== a && b !== b;
32960  }
32961  
32962  function getDPR(element) {
32963    if (typeof window === 'undefined') {
32964      return 1;
32965    }
32966    const win = element.ownerDocument.defaultView || window;
32967    return win.devicePixelRatio || 1;
32968  }
32969  
32970  function floating_ui_react_dom_roundByDPR(element, value) {
32971    const dpr = getDPR(element);
32972    return Math.round(value * dpr) / dpr;
32973  }
32974  
32975  function useLatestRef(value) {
32976    const ref = external_React_.useRef(value);
32977    index(() => {
32978      ref.current = value;
32979    });
32980    return ref;
32981  }
32982  
32983  /**
32984   * Provides data to position a floating element.
32985   * @see https://floating-ui.com/docs/useFloating
32986   */
32987  function useFloating(options) {
32988    if (options === void 0) {
32989      options = {};
32990    }
32991    const {
32992      placement = 'bottom',
32993      strategy = 'absolute',
32994      middleware = [],
32995      platform,
32996      elements: {
32997        reference: externalReference,
32998        floating: externalFloating
32999      } = {},
33000      transform = true,
33001      whileElementsMounted,
33002      open
33003    } = options;
33004    const [data, setData] = external_React_.useState({
33005      x: 0,
33006      y: 0,
33007      strategy,
33008      placement,
33009      middlewareData: {},
33010      isPositioned: false
33011    });
33012    const [latestMiddleware, setLatestMiddleware] = external_React_.useState(middleware);
33013    if (!deepEqual(latestMiddleware, middleware)) {
33014      setLatestMiddleware(middleware);
33015    }
33016    const [_reference, _setReference] = external_React_.useState(null);
33017    const [_floating, _setFloating] = external_React_.useState(null);
33018    const setReference = external_React_.useCallback(node => {
33019      if (node !== referenceRef.current) {
33020        referenceRef.current = node;
33021        _setReference(node);
33022      }
33023    }, []);
33024    const setFloating = external_React_.useCallback(node => {
33025      if (node !== floatingRef.current) {
33026        floatingRef.current = node;
33027        _setFloating(node);
33028      }
33029    }, []);
33030    const referenceEl = externalReference || _reference;
33031    const floatingEl = externalFloating || _floating;
33032    const referenceRef = external_React_.useRef(null);
33033    const floatingRef = external_React_.useRef(null);
33034    const dataRef = external_React_.useRef(data);
33035    const hasWhileElementsMounted = whileElementsMounted != null;
33036    const whileElementsMountedRef = useLatestRef(whileElementsMounted);
33037    const platformRef = useLatestRef(platform);
33038    const update = external_React_.useCallback(() => {
33039      if (!referenceRef.current || !floatingRef.current) {
33040        return;
33041      }
33042      const config = {
33043        placement,
33044        strategy,
33045        middleware: latestMiddleware
33046      };
33047      if (platformRef.current) {
33048        config.platform = platformRef.current;
33049      }
33050      floating_ui_dom_computePosition(referenceRef.current, floatingRef.current, config).then(data => {
33051        const fullData = {
33052          ...data,
33053          isPositioned: true
33054        };
33055        if (isMountedRef.current && !deepEqual(dataRef.current, fullData)) {
33056          dataRef.current = fullData;
33057          external_ReactDOM_namespaceObject.flushSync(() => {
33058            setData(fullData);
33059          });
33060        }
33061      });
33062    }, [latestMiddleware, placement, strategy, platformRef]);
33063    index(() => {
33064      if (open === false && dataRef.current.isPositioned) {
33065        dataRef.current.isPositioned = false;
33066        setData(data => ({
33067          ...data,
33068          isPositioned: false
33069        }));
33070      }
33071    }, [open]);
33072    const isMountedRef = external_React_.useRef(false);
33073    index(() => {
33074      isMountedRef.current = true;
33075      return () => {
33076        isMountedRef.current = false;
33077      };
33078    }, []);
33079  
33080    // biome-ignore lint/correctness/useExhaustiveDependencies: `hasWhileElementsMounted` is intentionally included.
33081    index(() => {
33082      if (referenceEl) referenceRef.current = referenceEl;
33083      if (floatingEl) floatingRef.current = floatingEl;
33084      if (referenceEl && floatingEl) {
33085        if (whileElementsMountedRef.current) {
33086          return whileElementsMountedRef.current(referenceEl, floatingEl, update);
33087        }
33088        update();
33089      }
33090    }, [referenceEl, floatingEl, update, whileElementsMountedRef, hasWhileElementsMounted]);
33091    const refs = external_React_.useMemo(() => ({
33092      reference: referenceRef,
33093      floating: floatingRef,
33094      setReference,
33095      setFloating
33096    }), [setReference, setFloating]);
33097    const elements = external_React_.useMemo(() => ({
33098      reference: referenceEl,
33099      floating: floatingEl
33100    }), [referenceEl, floatingEl]);
33101    const floatingStyles = external_React_.useMemo(() => {
33102      const initialStyles = {
33103        position: strategy,
33104        left: 0,
33105        top: 0
33106      };
33107      if (!elements.floating) {
33108        return initialStyles;
33109      }
33110      const x = floating_ui_react_dom_roundByDPR(elements.floating, data.x);
33111      const y = floating_ui_react_dom_roundByDPR(elements.floating, data.y);
33112      if (transform) {
33113        return {
33114          ...initialStyles,
33115          transform: "translate(" + x + "px, " + y + "px)",
33116          ...(getDPR(elements.floating) >= 1.5 && {
33117            willChange: 'transform'
33118          })
33119        };
33120      }
33121      return {
33122        position: strategy,
33123        left: x,
33124        top: y
33125      };
33126    }, [strategy, transform, elements.floating, data.x, data.y]);
33127    return external_React_.useMemo(() => ({
33128      ...data,
33129      update,
33130      refs,
33131      elements,
33132      floatingStyles
33133    }), [data, update, refs, elements, floatingStyles]);
33134  }
33135  
33136  
33137  
33138  ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/close.js
33139  /**
33140   * WordPress dependencies
33141   */
33142  
33143  
33144  const close_close = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, {
33145    xmlns: "http://www.w3.org/2000/svg",
33146    viewBox: "0 0 24 24",
33147    children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, {
33148      d: "m13.06 12 6.47-6.47-1.06-1.06L12 10.94 5.53 4.47 4.47 5.53 10.94 12l-6.47 6.47 1.06 1.06L12 13.06l6.47 6.47 1.06-1.06L13.06 12Z"
33149    })
33150  });
33151  /* harmony default export */ const library_close = (close_close);
33152  
33153  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/scroll-lock/index.js
33154  /**
33155   * WordPress dependencies
33156   */
33157  
33158  
33159  /*
33160   * Setting `overflow: hidden` on html and body elements resets body scroll in iOS.
33161   * Save scroll top so we can restore it after locking scroll.
33162   *
33163   * NOTE: It would be cleaner and possibly safer to find a localized solution such
33164   * as preventing default on certain touchmove events.
33165   */
33166  let previousScrollTop = 0;
33167  function setLocked(locked) {
33168    const scrollingElement = document.scrollingElement || document.body;
33169    if (locked) {
33170      previousScrollTop = scrollingElement.scrollTop;
33171    }
33172    const methodName = locked ? 'add' : 'remove';
33173    scrollingElement.classList[methodName]('lockscroll');
33174  
33175    // Adding the class to the document element seems to be necessary in iOS.
33176    document.documentElement.classList[methodName]('lockscroll');
33177    if (!locked) {
33178      scrollingElement.scrollTop = previousScrollTop;
33179    }
33180  }
33181  let lockCounter = 0;
33182  
33183  /**
33184   * ScrollLock is a content-free React component for declaratively preventing
33185   * scroll bleed from modal UI to the page body. This component applies a
33186   * `lockscroll` class to the `document.documentElement` and
33187   * `document.scrollingElement` elements to stop the body from scrolling. When it
33188   * is present, the lock is applied.
33189   *
33190   * ```jsx
33191   * import { ScrollLock, Button } from '@wordpress/components';
33192   * import { useState } from '@wordpress/element';
33193   *
33194   * const MyScrollLock = () => {
33195   *   const [ isScrollLocked, setIsScrollLocked ] = useState( false );
33196   *
33197   *   const toggleLock = () => {
33198   *     setIsScrollLocked( ( locked ) => ! locked ) );
33199   *   };
33200   *
33201   *   return (
33202   *     <div>
33203   *       <Button variant="secondary" onClick={ toggleLock }>
33204   *         Toggle scroll lock
33205   *       </Button>
33206   *       { isScrollLocked && <ScrollLock /> }
33207   *       <p>
33208   *         Scroll locked:
33209   *         <strong>{ isScrollLocked ? 'Yes' : 'No' }</strong>
33210   *       </p>
33211   *     </div>
33212   *   );
33213   * };
33214   * ```
33215   */
33216  function ScrollLock() {
33217    (0,external_wp_element_namespaceObject.useEffect)(() => {
33218      if (lockCounter === 0) {
33219        setLocked(true);
33220      }
33221      ++lockCounter;
33222      return () => {
33223        if (lockCounter === 1) {
33224          setLocked(false);
33225        }
33226        --lockCounter;
33227      };
33228    }, []);
33229    return null;
33230  }
33231  /* harmony default export */ const scroll_lock = (ScrollLock);
33232  
33233  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/slot-fill/bubbles-virtually/slot-fill-context.js
33234  /**
33235   * WordPress dependencies
33236   */
33237  
33238  
33239  
33240  
33241  /**
33242   * Internal dependencies
33243   */
33244  
33245  const initialContextValue = {
33246    slots: (0,external_wp_compose_namespaceObject.observableMap)(),
33247    fills: (0,external_wp_compose_namespaceObject.observableMap)(),
33248    registerSlot: () => {
33249       true ? external_wp_warning_default()('Components must be wrapped within `SlotFillProvider`. ' + 'See https://developer.wordpress.org/block-editor/components/slot-fill/') : 0;
33250    },
33251    updateSlot: () => {},
33252    unregisterSlot: () => {},
33253    registerFill: () => {},
33254    unregisterFill: () => {},
33255    // This helps the provider know if it's using the default context value or not.
33256    isDefault: true
33257  };
33258  const SlotFillContext = (0,external_wp_element_namespaceObject.createContext)(initialContextValue);
33259  /* harmony default export */ const slot_fill_context = (SlotFillContext);
33260  
33261  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/slot-fill/bubbles-virtually/use-slot.js
33262  /**
33263   * WordPress dependencies
33264   */
33265  
33266  
33267  
33268  /**
33269   * Internal dependencies
33270   */
33271  
33272  function useSlot(name) {
33273    const registry = (0,external_wp_element_namespaceObject.useContext)(slot_fill_context);
33274    const slot = (0,external_wp_compose_namespaceObject.useObservableValue)(registry.slots, name);
33275    const api = (0,external_wp_element_namespaceObject.useMemo)(() => ({
33276      updateSlot: fillProps => registry.updateSlot(name, fillProps),
33277      unregisterSlot: ref => registry.unregisterSlot(name, ref),
33278      registerFill: ref => registry.registerFill(name, ref),
33279      unregisterFill: ref => registry.unregisterFill(name, ref)
33280    }), [name, registry]);
33281    return {
33282      ...slot,
33283      ...api
33284    };
33285  }
33286  
33287  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/slot-fill/context.js
33288  /**
33289   * WordPress dependencies
33290   */
33291  
33292  /**
33293   * Internal dependencies
33294   */
33295  
33296  const initialValue = {
33297    registerSlot: () => {},
33298    unregisterSlot: () => {},
33299    registerFill: () => {},
33300    unregisterFill: () => {},
33301    getSlot: () => undefined,
33302    getFills: () => [],
33303    subscribe: () => () => {}
33304  };
33305  const context_SlotFillContext = (0,external_wp_element_namespaceObject.createContext)(initialValue);
33306  /* harmony default export */ const context = (context_SlotFillContext);
33307  
33308  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/slot-fill/use-slot.js
33309  /**
33310   * WordPress dependencies
33311   */
33312  
33313  
33314  /**
33315   * Internal dependencies
33316   */
33317  
33318  /**
33319   * React hook returning the active slot given a name.
33320   *
33321   * @param name Slot name.
33322   * @return Slot object.
33323   */
33324  const use_slot_useSlot = name => {
33325    const {
33326      getSlot,
33327      subscribe
33328    } = (0,external_wp_element_namespaceObject.useContext)(context);
33329    return (0,external_wp_element_namespaceObject.useSyncExternalStore)(subscribe, () => getSlot(name), () => getSlot(name));
33330  };
33331  /* harmony default export */ const use_slot = (use_slot_useSlot);
33332  
33333  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/slot-fill/fill.js
33334  /**
33335   * WordPress dependencies
33336   */
33337  
33338  
33339  /**
33340   * Internal dependencies
33341   */
33342  
33343  
33344  function Fill({
33345    name,
33346    children
33347  }) {
33348    const {
33349      registerFill,
33350      unregisterFill
33351    } = (0,external_wp_element_namespaceObject.useContext)(context);
33352    const slot = use_slot(name);
33353    const ref = (0,external_wp_element_namespaceObject.useRef)({
33354      name,
33355      children
33356    });
33357    (0,external_wp_element_namespaceObject.useLayoutEffect)(() => {
33358      const refValue = ref.current;
33359      registerFill(name, refValue);
33360      return () => unregisterFill(name, refValue);
33361      // Ignore reason: the useLayoutEffects here are written to fire at specific times, and introducing new dependencies could cause unexpected changes in behavior.
33362      // We'll leave them as-is until a more detailed investigation/refactor can be performed.
33363      // eslint-disable-next-line react-hooks/exhaustive-deps
33364    }, []);
33365    (0,external_wp_element_namespaceObject.useLayoutEffect)(() => {
33366      ref.current.children = children;
33367      if (slot) {
33368        slot.forceUpdate();
33369      }
33370      // Ignore reason: the useLayoutEffects here are written to fire at specific times, and introducing new dependencies could cause unexpected changes in behavior.
33371      // We'll leave them as-is until a more detailed investigation/refactor can be performed.
33372      // eslint-disable-next-line react-hooks/exhaustive-deps
33373    }, [children]);
33374    (0,external_wp_element_namespaceObject.useLayoutEffect)(() => {
33375      if (name === ref.current.name) {
33376        // Ignore initial effect.
33377        return;
33378      }
33379      unregisterFill(ref.current.name, ref.current);
33380      ref.current.name = name;
33381      registerFill(name, ref.current);
33382      // Ignore reason: the useLayoutEffects here are written to fire at specific times, and introducing new dependencies could cause unexpected changes in behavior.
33383      // We'll leave them as-is until a more detailed investigation/refactor can be performed.
33384      // eslint-disable-next-line react-hooks/exhaustive-deps
33385    }, [name]);
33386    return null;
33387  }
33388  
33389  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/slot-fill/slot.js
33390  /**
33391   * External dependencies
33392   */
33393  
33394  /**
33395   * WordPress dependencies
33396   */
33397  
33398  
33399  /**
33400   * Internal dependencies
33401   */
33402  
33403  
33404  
33405  /**
33406   * Whether the argument is a function.
33407   *
33408   * @param maybeFunc The argument to check.
33409   * @return True if the argument is a function, false otherwise.
33410   */
33411  function isFunction(maybeFunc) {
33412    return typeof maybeFunc === 'function';
33413  }
33414  class SlotComponent extends external_wp_element_namespaceObject.Component {
33415    constructor(props) {
33416      super(props);
33417      this.isUnmounted = false;
33418    }
33419    componentDidMount() {
33420      const {
33421        registerSlot
33422      } = this.props;
33423      this.isUnmounted = false;
33424      registerSlot(this.props.name, this);
33425    }
33426    componentWillUnmount() {
33427      const {
33428        unregisterSlot
33429      } = this.props;
33430      this.isUnmounted = true;
33431      unregisterSlot(this.props.name, this);
33432    }
33433    componentDidUpdate(prevProps) {
33434      const {
33435        name,
33436        unregisterSlot,
33437        registerSlot
33438      } = this.props;
33439      if (prevProps.name !== name) {
33440        unregisterSlot(prevProps.name, this);
33441        registerSlot(name, this);
33442      }
33443    }
33444    forceUpdate() {
33445      if (this.isUnmounted) {
33446        return;
33447      }
33448      super.forceUpdate();
33449    }
33450    render() {
33451      var _getFills;
33452      const {
33453        children,
33454        name,
33455        fillProps = {},
33456        getFills
33457      } = this.props;
33458      const fills = ((_getFills = getFills(name, this)) !== null && _getFills !== void 0 ? _getFills : []).map(fill => {
33459        const fillChildren = isFunction(fill.children) ? fill.children(fillProps) : fill.children;
33460        return external_wp_element_namespaceObject.Children.map(fillChildren, (child, childIndex) => {
33461          if (!child || typeof child === 'string') {
33462            return child;
33463          }
33464          let childKey = childIndex;
33465          if (typeof child === 'object' && 'key' in child && child?.key) {
33466            childKey = child.key;
33467          }
33468          return (0,external_wp_element_namespaceObject.cloneElement)(child, {
33469            key: childKey
33470          });
33471        });
33472      }).filter(
33473      // In some cases fills are rendered only when some conditions apply.
33474      // This ensures that we only use non-empty fills when rendering, i.e.,
33475      // it allows us to render wrappers only when the fills are actually present.
33476      element => !(0,external_wp_element_namespaceObject.isEmptyElement)(element));
33477      return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_ReactJSXRuntime_namespaceObject.Fragment, {
33478        children: isFunction(children) ? children(fills) : fills
33479      });
33480    }
33481  }
33482  const Slot = props => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(context.Consumer, {
33483    children: ({
33484      registerSlot,
33485      unregisterSlot,
33486      getFills
33487    }) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(SlotComponent, {
33488      ...props,
33489      registerSlot: registerSlot,
33490      unregisterSlot: unregisterSlot,
33491      getFills: getFills
33492    })
33493  });
33494  /* harmony default export */ const slot = (Slot);
33495  
33496  ;// CONCATENATED MODULE: ./node_modules/uuid/dist/esm-browser/native.js
33497  const randomUUID = typeof crypto !== 'undefined' && crypto.randomUUID && crypto.randomUUID.bind(crypto);
33498  /* harmony default export */ const esm_browser_native = ({
33499    randomUUID
33500  });
33501  ;// CONCATENATED MODULE: ./node_modules/uuid/dist/esm-browser/rng.js
33502  // Unique ID creation requires a high quality random # generator. In the browser we therefore
33503  // require the crypto API and do not support built-in fallback to lower quality random number
33504  // generators (like Math.random()).
33505  let getRandomValues;
33506  const rnds8 = new Uint8Array(16);
33507  function rng() {
33508    // lazy load so that environments that need to polyfill have a chance to do so
33509    if (!getRandomValues) {
33510      // getRandomValues needs to be invoked in a context where "this" is a Crypto implementation.
33511      getRandomValues = typeof crypto !== 'undefined' && crypto.getRandomValues && crypto.getRandomValues.bind(crypto);
33512  
33513      if (!getRandomValues) {
33514        throw new Error('crypto.getRandomValues() not supported. See https://github.com/uuidjs/uuid#getrandomvalues-not-supported');
33515      }
33516    }
33517  
33518    return getRandomValues(rnds8);
33519  }
33520  ;// CONCATENATED MODULE: ./node_modules/uuid/dist/esm-browser/stringify.js
33521  
33522  /**
33523   * Convert array of 16 byte values to UUID string format of the form:
33524   * XXXXXXXX-XXXX-XXXX-XXXX-XXXXXXXXXXXX
33525   */
33526  
33527  const byteToHex = [];
33528  
33529  for (let i = 0; i < 256; ++i) {
33530    byteToHex.push((i + 0x100).toString(16).slice(1));
33531  }
33532  
33533  function unsafeStringify(arr, offset = 0) {
33534    // Note: Be careful editing this code!  It's been tuned for performance
33535    // and works in ways you may not expect. See https://github.com/uuidjs/uuid/pull/434
33536    return byteToHex[arr[offset + 0]] + byteToHex[arr[offset + 1]] + byteToHex[arr[offset + 2]] + byteToHex[arr[offset + 3]] + '-' + byteToHex[arr[offset + 4]] + byteToHex[arr[offset + 5]] + '-' + byteToHex[arr[offset + 6]] + byteToHex[arr[offset + 7]] + '-' + byteToHex[arr[offset + 8]] + byteToHex[arr[offset + 9]] + '-' + byteToHex[arr[offset + 10]] + byteToHex[arr[offset + 11]] + byteToHex[arr[offset + 12]] + byteToHex[arr[offset + 13]] + byteToHex[arr[offset + 14]] + byteToHex[arr[offset + 15]];
33537  }
33538  
33539  function stringify_stringify(arr, offset = 0) {
33540    const uuid = unsafeStringify(arr, offset); // Consistency check for valid UUID.  If this throws, it's likely due to one
33541    // of the following:
33542    // - One or more input array values don't map to a hex octet (leading to
33543    // "undefined" in the uuid)
33544    // - Invalid input values for the RFC `version` or `variant` fields
33545  
33546    if (!validate(uuid)) {
33547      throw TypeError('Stringified UUID is invalid');
33548    }
33549  
33550    return uuid;
33551  }
33552  
33553  /* harmony default export */ const esm_browser_stringify = ((/* unused pure expression or super */ null && (stringify_stringify)));
33554  ;// CONCATENATED MODULE: ./node_modules/uuid/dist/esm-browser/v4.js
33555  
33556  
33557  
33558  
33559  function v4(options, buf, offset) {
33560    if (esm_browser_native.randomUUID && !buf && !options) {
33561      return esm_browser_native.randomUUID();
33562    }
33563  
33564    options = options || {};
33565    const rnds = options.random || (options.rng || rng)(); // Per 4.4, set bits for version and `clock_seq_hi_and_reserved`
33566  
33567    rnds[6] = rnds[6] & 0x0f | 0x40;
33568    rnds[8] = rnds[8] & 0x3f | 0x80; // Copy bytes to buffer, if provided
33569  
33570    if (buf) {
33571      offset = offset || 0;
33572  
33573      for (let i = 0; i < 16; ++i) {
33574        buf[offset + i] = rnds[i];
33575      }
33576  
33577      return buf;
33578    }
33579  
33580    return unsafeStringify(rnds);
33581  }
33582  
33583  /* harmony default export */ const esm_browser_v4 = (v4);
33584  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/style-provider/index.js
33585  /**
33586   * External dependencies
33587   */
33588  
33589  
33590  
33591  
33592  /**
33593   * Internal dependencies
33594   */
33595  
33596  const uuidCache = new Set();
33597  // Use a weak map so that when the container is detached it's automatically
33598  // dereferenced to avoid memory leak.
33599  const containerCacheMap = new WeakMap();
33600  const memoizedCreateCacheWithContainer = container => {
33601    if (containerCacheMap.has(container)) {
33602      return containerCacheMap.get(container);
33603    }
33604  
33605    // Emotion only accepts alphabetical and hyphenated keys so we just
33606    // strip the numbers from the UUID. It _should_ be fine.
33607    let key = esm_browser_v4().replace(/[0-9]/g, '');
33608    while (uuidCache.has(key)) {
33609      key = esm_browser_v4().replace(/[0-9]/g, '');
33610    }
33611    uuidCache.add(key);
33612    const cache = emotion_cache_browser_esm({
33613      container,
33614      key
33615    });
33616    containerCacheMap.set(container, cache);
33617    return cache;
33618  };
33619  function StyleProvider(props) {
33620    const {
33621      children,
33622      document
33623    } = props;
33624    if (!document) {
33625      return null;
33626    }
33627    const cache = memoizedCreateCacheWithContainer(document.head);
33628    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(CacheProvider, {
33629      value: cache,
33630      children: children
33631    });
33632  }
33633  /* harmony default export */ const style_provider = (StyleProvider);
33634  
33635  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/slot-fill/bubbles-virtually/fill.js
33636  /**
33637   * WordPress dependencies
33638   */
33639  
33640  
33641  /**
33642   * Internal dependencies
33643   */
33644  
33645  
33646  
33647  function fill_useForceUpdate() {
33648    const [, setState] = (0,external_wp_element_namespaceObject.useState)({});
33649    const mountedRef = (0,external_wp_element_namespaceObject.useRef)(true);
33650    (0,external_wp_element_namespaceObject.useEffect)(() => {
33651      mountedRef.current = true;
33652      return () => {
33653        mountedRef.current = false;
33654      };
33655    }, []);
33656    return () => {
33657      if (mountedRef.current) {
33658        setState({});
33659      }
33660    };
33661  }
33662  function fill_Fill(props) {
33663    var _slot$fillProps;
33664    const {
33665      name,
33666      children
33667    } = props;
33668    const {
33669      registerFill,
33670      unregisterFill,
33671      ...slot
33672    } = useSlot(name);
33673    const rerender = fill_useForceUpdate();
33674    const ref = (0,external_wp_element_namespaceObject.useRef)({
33675      rerender
33676    });
33677    (0,external_wp_element_namespaceObject.useEffect)(() => {
33678      // We register fills so we can keep track of their existence.
33679      // Some Slot implementations need to know if there're already fills
33680      // registered so they can choose to render themselves or not.
33681      registerFill(ref);
33682      return () => {
33683        unregisterFill(ref);
33684      };
33685    }, [registerFill, unregisterFill]);
33686    if (!slot.ref || !slot.ref.current) {
33687      return null;
33688    }
33689  
33690    // When using a `Fill`, the `children` will be rendered in the document of the
33691    // `Slot`. This means that we need to wrap the `children` in a `StyleProvider`
33692    // to make sure we're referencing the right document/iframe (instead of the
33693    // context of the `Fill`'s parent).
33694    const wrappedChildren = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(style_provider, {
33695      document: slot.ref.current.ownerDocument,
33696      children: typeof children === 'function' ? children((_slot$fillProps = slot.fillProps) !== null && _slot$fillProps !== void 0 ? _slot$fillProps : {}) : children
33697    });
33698    return (0,external_wp_element_namespaceObject.createPortal)(wrappedChildren, slot.ref.current);
33699  }
33700  
33701  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/slot-fill/bubbles-virtually/slot.js
33702  /**
33703   * External dependencies
33704   */
33705  
33706  /**
33707   * WordPress dependencies
33708   */
33709  
33710  
33711  
33712  /**
33713   * Internal dependencies
33714   */
33715  
33716  
33717  
33718  function slot_Slot(props, forwardedRef) {
33719    const {
33720      name,
33721      fillProps = {},
33722      as,
33723      // `children` is not allowed. However, if it is passed,
33724      // it will be displayed as is, so remove `children`.
33725      // @ts-ignore
33726      children,
33727      ...restProps
33728    } = props;
33729    const {
33730      registerSlot,
33731      unregisterSlot,
33732      ...registry
33733    } = (0,external_wp_element_namespaceObject.useContext)(slot_fill_context);
33734    const ref = (0,external_wp_element_namespaceObject.useRef)(null);
33735    (0,external_wp_element_namespaceObject.useLayoutEffect)(() => {
33736      registerSlot(name, ref, fillProps);
33737      return () => {
33738        unregisterSlot(name, ref);
33739      };
33740      // Ignore reason: We don't want to unregister and register the slot whenever
33741      // `fillProps` change, which would cause the fill to be re-mounted. Instead,
33742      // we can just update the slot (see hook below).
33743      // For more context, see https://github.com/WordPress/gutenberg/pull/44403#discussion_r994415973
33744      // eslint-disable-next-line react-hooks/exhaustive-deps
33745    }, [registerSlot, unregisterSlot, name]);
33746    // fillProps may be an update that interacts with the layout, so we
33747    // useLayoutEffect.
33748    (0,external_wp_element_namespaceObject.useLayoutEffect)(() => {
33749      registry.updateSlot(name, fillProps);
33750    });
33751    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(component, {
33752      as: as,
33753      ref: (0,external_wp_compose_namespaceObject.useMergeRefs)([forwardedRef, ref]),
33754      ...restProps
33755    });
33756  }
33757  /* harmony default export */ const bubbles_virtually_slot = ((0,external_wp_element_namespaceObject.forwardRef)(slot_Slot));
33758  
33759  ;// CONCATENATED MODULE: external ["wp","isShallowEqual"]
33760  const external_wp_isShallowEqual_namespaceObject = window["wp"]["isShallowEqual"];
33761  var external_wp_isShallowEqual_default = /*#__PURE__*/__webpack_require__.n(external_wp_isShallowEqual_namespaceObject);
33762  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/slot-fill/bubbles-virtually/slot-fill-provider.js
33763  /**
33764   * WordPress dependencies
33765   */
33766  
33767  
33768  
33769  
33770  /**
33771   * Internal dependencies
33772   */
33773  
33774  
33775  function createSlotRegistry() {
33776    const slots = (0,external_wp_compose_namespaceObject.observableMap)();
33777    const fills = (0,external_wp_compose_namespaceObject.observableMap)();
33778    const registerSlot = (name, ref, fillProps) => {
33779      const slot = slots.get(name);
33780      slots.set(name, {
33781        ...slot,
33782        ref: ref || slot?.ref,
33783        fillProps: fillProps || slot?.fillProps || {}
33784      });
33785    };
33786    const unregisterSlot = (name, ref) => {
33787      // Make sure we're not unregistering a slot registered by another element
33788      // See https://github.com/WordPress/gutenberg/pull/19242#issuecomment-590295412
33789      if (slots.get(name)?.ref === ref) {
33790        slots.delete(name);
33791      }
33792    };
33793    const updateSlot = (name, fillProps) => {
33794      const slot = slots.get(name);
33795      if (!slot) {
33796        return;
33797      }
33798      if (external_wp_isShallowEqual_default()(slot.fillProps, fillProps)) {
33799        return;
33800      }
33801      slot.fillProps = fillProps;
33802      const slotFills = fills.get(name);
33803      if (slotFills) {
33804        // Force update fills.
33805        slotFills.forEach(fill => fill.current.rerender());
33806      }
33807    };
33808    const registerFill = (name, ref) => {
33809      fills.set(name, [...(fills.get(name) || []), ref]);
33810    };
33811    const unregisterFill = (name, ref) => {
33812      const fillsForName = fills.get(name);
33813      if (!fillsForName) {
33814        return;
33815      }
33816      fills.set(name, fillsForName.filter(fillRef => fillRef !== ref));
33817    };
33818    return {
33819      slots,
33820      fills,
33821      registerSlot,
33822      updateSlot,
33823      unregisterSlot,
33824      registerFill,
33825      unregisterFill
33826    };
33827  }
33828  function SlotFillProvider({
33829    children
33830  }) {
33831    const [registry] = (0,external_wp_element_namespaceObject.useState)(createSlotRegistry);
33832    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(slot_fill_context.Provider, {
33833      value: registry,
33834      children: children
33835    });
33836  }
33837  
33838  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/slot-fill/provider.js
33839  /**
33840   * WordPress dependencies
33841   */
33842  
33843  
33844  
33845  /**
33846   * Internal dependencies
33847   */
33848  
33849  
33850  function provider_createSlotRegistry() {
33851    const slots = {};
33852    const fills = {};
33853    let listeners = [];
33854    function registerSlot(name, slot) {
33855      const previousSlot = slots[name];
33856      slots[name] = slot;
33857      triggerListeners();
33858  
33859      // Sometimes the fills are registered after the initial render of slot
33860      // But before the registerSlot call, we need to rerender the slot.
33861      forceUpdateSlot(name);
33862  
33863      // If a new instance of a slot is being mounted while another with the
33864      // same name exists, force its update _after_ the new slot has been
33865      // assigned into the instance, such that its own rendering of children
33866      // will be empty (the new Slot will subsume all fills for this name).
33867      if (previousSlot) {
33868        previousSlot.forceUpdate();
33869      }
33870    }
33871    function registerFill(name, instance) {
33872      fills[name] = [...(fills[name] || []), instance];
33873      forceUpdateSlot(name);
33874    }
33875    function unregisterSlot(name, instance) {
33876      // If a previous instance of a Slot by this name unmounts, do nothing,
33877      // as the slot and its fills should only be removed for the current
33878      // known instance.
33879      if (slots[name] !== instance) {
33880        return;
33881      }
33882      delete slots[name];
33883      triggerListeners();
33884    }
33885    function unregisterFill(name, instance) {
33886      var _fills$name$filter;
33887      fills[name] = (_fills$name$filter = fills[name]?.filter(fill => fill !== instance)) !== null && _fills$name$filter !== void 0 ? _fills$name$filter : [];
33888      forceUpdateSlot(name);
33889    }
33890    function getSlot(name) {
33891      return slots[name];
33892    }
33893    function getFills(name, slotInstance) {
33894      // Fills should only be returned for the current instance of the slot
33895      // in which they occupy.
33896      if (slots[name] !== slotInstance) {
33897        return [];
33898      }
33899      return fills[name];
33900    }
33901    function forceUpdateSlot(name) {
33902      const slot = getSlot(name);
33903      if (slot) {
33904        slot.forceUpdate();
33905      }
33906    }
33907    function triggerListeners() {
33908      listeners.forEach(listener => listener());
33909    }
33910    function subscribe(listener) {
33911      listeners.push(listener);
33912      return () => {
33913        listeners = listeners.filter(l => l !== listener);
33914      };
33915    }
33916    return {
33917      registerSlot,
33918      unregisterSlot,
33919      registerFill,
33920      unregisterFill,
33921      getSlot,
33922      getFills,
33923      subscribe
33924    };
33925  }
33926  function provider_SlotFillProvider({
33927    children
33928  }) {
33929    const [contextValue] = (0,external_wp_element_namespaceObject.useState)(provider_createSlotRegistry);
33930    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(context.Provider, {
33931      value: contextValue,
33932      children: children
33933    });
33934  }
33935  /* harmony default export */ const provider = (provider_SlotFillProvider);
33936  
33937  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/slot-fill/index.js
33938  /**
33939   * External dependencies
33940   */
33941  
33942  /**
33943   * WordPress dependencies
33944   */
33945  
33946  
33947  /**
33948   * Internal dependencies
33949   */
33950  
33951  
33952  
33953  
33954  
33955  
33956  
33957  
33958  
33959  
33960  
33961  
33962  function slot_fill_Fill(props) {
33963    // We're adding both Fills here so they can register themselves before
33964    // their respective slot has been registered. Only the Fill that has a slot
33965    // will render. The other one will return null.
33966    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, {
33967      children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Fill, {
33968        ...props
33969      }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(fill_Fill, {
33970        ...props
33971      })]
33972    });
33973  }
33974  function UnforwardedSlot(props, ref) {
33975    const {
33976      bubblesVirtually,
33977      ...restProps
33978    } = props;
33979    if (bubblesVirtually) {
33980      return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(bubbles_virtually_slot, {
33981        ...restProps,
33982        ref: ref
33983      });
33984    }
33985    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(slot, {
33986      ...restProps
33987    });
33988  }
33989  const slot_fill_Slot = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedSlot);
33990  function Provider({
33991    children,
33992    passthrough = false
33993  }) {
33994    const parent = (0,external_wp_element_namespaceObject.useContext)(slot_fill_context);
33995    if (!parent.isDefault && passthrough) {
33996      return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_ReactJSXRuntime_namespaceObject.Fragment, {
33997        children: children
33998      });
33999    }
34000    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(provider, {
34001      children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(SlotFillProvider, {
34002        children: children
34003      })
34004    });
34005  }
34006  Provider.displayName = 'SlotFillProvider';
34007  function createSlotFill(key) {
34008    const baseName = typeof key === 'symbol' ? key.description : key;
34009    const FillComponent = props => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(slot_fill_Fill, {
34010      name: key,
34011      ...props
34012    });
34013    FillComponent.displayName = `$baseName}Fill`;
34014    const SlotComponent = props => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(slot_fill_Slot, {
34015      name: key,
34016      ...props
34017    });
34018    SlotComponent.displayName = `$baseName}Slot`;
34019    SlotComponent.__unstableName = key;
34020    return {
34021      Fill: FillComponent,
34022      Slot: SlotComponent
34023    };
34024  }
34025  const createPrivateSlotFill = name => {
34026    const privateKey = Symbol(name);
34027    const privateSlotFill = createSlotFill(privateKey);
34028    return {
34029      privateKey,
34030      ...privateSlotFill
34031    };
34032  };
34033  
34034  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/popover/overlay-middlewares.js
34035  /**
34036   * External dependencies
34037   */
34038  
34039  
34040  function overlayMiddlewares() {
34041    return [{
34042      name: 'overlay',
34043      fn({
34044        rects
34045      }) {
34046        return rects.reference;
34047      }
34048    }, floating_ui_dom_size({
34049      apply({
34050        rects,
34051        elements
34052      }) {
34053        var _elements$floating;
34054        const {
34055          firstElementChild
34056        } = (_elements$floating = elements.floating) !== null && _elements$floating !== void 0 ? _elements$floating : {};
34057  
34058        // Only HTMLElement instances have the `style` property.
34059        if (!(firstElementChild instanceof HTMLElement)) {
34060          return;
34061        }
34062  
34063        // Reduce the height of the popover to the available space.
34064        Object.assign(firstElementChild.style, {
34065          width: `$rects.reference.width}px`,
34066          height: `$rects.reference.height}px`
34067        });
34068      }
34069    })];
34070  }
34071  
34072  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/popover/index.js
34073  /**
34074   * External dependencies
34075   */
34076  
34077  
34078  
34079  
34080  
34081  /**
34082   * WordPress dependencies
34083   */
34084  
34085  
34086  
34087  
34088  
34089  
34090  /**
34091   * Internal dependencies
34092   */
34093  
34094  
34095  
34096  
34097  
34098  
34099  
34100  
34101  /**
34102   * Name of slot in which popover should fill.
34103   *
34104   * @type {string}
34105   */
34106  
34107  
34108  
34109  const SLOT_NAME = 'Popover';
34110  
34111  // An SVG displaying a triangle facing down, filled with a solid
34112  // color and bordered in such a way to create an arrow-like effect.
34113  // Keeping the SVG's viewbox squared simplify the arrow positioning
34114  // calculations.
34115  const ArrowTriangle = () => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_primitives_namespaceObject.SVG, {
34116    xmlns: "http://www.w3.org/2000/svg",
34117    viewBox: "0 0 100 100",
34118    className: "components-popover__triangle",
34119    role: "presentation",
34120    children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, {
34121      className: "components-popover__triangle-bg",
34122      d: "M 0 0 L 50 50 L 100 0"
34123    }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, {
34124      className: "components-popover__triangle-border",
34125      d: "M 0 0 L 50 50 L 100 0",
34126      vectorEffect: "non-scaling-stroke"
34127    })]
34128  });
34129  const slotNameContext = (0,external_wp_element_namespaceObject.createContext)(undefined);
34130  const fallbackContainerClassname = 'components-popover__fallback-container';
34131  const getPopoverFallbackContainer = () => {
34132    let container = document.body.querySelector('.' + fallbackContainerClassname);
34133    if (!container) {
34134      container = document.createElement('div');
34135      container.className = fallbackContainerClassname;
34136      document.body.append(container);
34137    }
34138    return container;
34139  };
34140  const UnforwardedPopover = (props, forwardedRef) => {
34141    const {
34142      animate = true,
34143      headerTitle,
34144      constrainTabbing,
34145      onClose,
34146      children,
34147      className,
34148      noArrow = true,
34149      position,
34150      placement: placementProp = 'bottom-start',
34151      offset: offsetProp = 0,
34152      focusOnMount = 'firstElement',
34153      anchor,
34154      expandOnMobile,
34155      onFocusOutside,
34156      __unstableSlotName = SLOT_NAME,
34157      flip = true,
34158      resize = true,
34159      shift = false,
34160      inline = false,
34161      variant,
34162      style: contentStyle,
34163      // Deprecated props
34164      __unstableForcePosition,
34165      anchorRef,
34166      anchorRect,
34167      getAnchorRect,
34168      isAlternate,
34169      // Rest
34170      ...contentProps
34171    } = useContextSystem(props, 'Popover');
34172    let computedFlipProp = flip;
34173    let computedResizeProp = resize;
34174    if (__unstableForcePosition !== undefined) {
34175      external_wp_deprecated_default()('`__unstableForcePosition` prop in wp.components.Popover', {
34176        since: '6.1',
34177        version: '6.3',
34178        alternative: '`flip={ false }` and  `resize={ false }`'
34179      });
34180  
34181      // Back-compat, set the `flip` and `resize` props
34182      // to `false` to replicate `__unstableForcePosition`.
34183      computedFlipProp = !__unstableForcePosition;
34184      computedResizeProp = !__unstableForcePosition;
34185    }
34186    if (anchorRef !== undefined) {
34187      external_wp_deprecated_default()('`anchorRef` prop in wp.components.Popover', {
34188        since: '6.1',
34189        alternative: '`anchor` prop'
34190      });
34191    }
34192    if (anchorRect !== undefined) {
34193      external_wp_deprecated_default()('`anchorRect` prop in wp.components.Popover', {
34194        since: '6.1',
34195        alternative: '`anchor` prop'
34196      });
34197    }
34198    if (getAnchorRect !== undefined) {
34199      external_wp_deprecated_default()('`getAnchorRect` prop in wp.components.Popover', {
34200        since: '6.1',
34201        alternative: '`anchor` prop'
34202      });
34203    }
34204    const computedVariant = isAlternate ? 'toolbar' : variant;
34205    if (isAlternate !== undefined) {
34206      external_wp_deprecated_default()('`isAlternate` prop in wp.components.Popover', {
34207        since: '6.2',
34208        alternative: "`variant` prop with the `'toolbar'` value"
34209      });
34210    }
34211    const arrowRef = (0,external_wp_element_namespaceObject.useRef)(null);
34212    const [fallbackReferenceElement, setFallbackReferenceElement] = (0,external_wp_element_namespaceObject.useState)(null);
34213    const anchorRefFallback = (0,external_wp_element_namespaceObject.useCallback)(node => {
34214      setFallbackReferenceElement(node);
34215    }, []);
34216    const isMobileViewport = (0,external_wp_compose_namespaceObject.useViewportMatch)('medium', '<');
34217    const isExpanded = expandOnMobile && isMobileViewport;
34218    const hasArrow = !isExpanded && !noArrow;
34219    const normalizedPlacementFromProps = position ? positionToPlacement(position) : placementProp;
34220    const middleware = [...(placementProp === 'overlay' ? overlayMiddlewares() : []), offset(offsetProp), computedFlipProp && floating_ui_dom_flip(), computedResizeProp && floating_ui_dom_size({
34221      apply(sizeProps) {
34222        var _refs$floating$curren;
34223        const {
34224          firstElementChild
34225        } = (_refs$floating$curren = refs.floating.current) !== null && _refs$floating$curren !== void 0 ? _refs$floating$curren : {};
34226  
34227        // Only HTMLElement instances have the `style` property.
34228        if (!(firstElementChild instanceof HTMLElement)) {
34229          return;
34230        }
34231  
34232        // Reduce the height of the popover to the available space.
34233        Object.assign(firstElementChild.style, {
34234          maxHeight: `$sizeProps.availableHeight}px`,
34235          overflow: 'auto'
34236        });
34237      }
34238    }), shift && floating_ui_dom_shift({
34239      crossAxis: true,
34240      limiter: floating_ui_dom_limitShift(),
34241      padding: 1 // Necessary to avoid flickering at the edge of the viewport.
34242    }), floating_ui_react_dom_arrow({
34243      element: arrowRef
34244    })];
34245    const slotName = (0,external_wp_element_namespaceObject.useContext)(slotNameContext) || __unstableSlotName;
34246    const slot = useSlot(slotName);
34247    let onDialogClose;
34248    if (onClose || onFocusOutside) {
34249      onDialogClose = (type, event) => {
34250        // Ideally the popover should have just a single onClose prop and
34251        // not three props that potentially do the same thing.
34252        if (type === 'focus-outside' && onFocusOutside) {
34253          onFocusOutside(event);
34254        } else if (onClose) {
34255          onClose();
34256        }
34257      };
34258    }
34259    const [dialogRef, dialogProps] = (0,external_wp_compose_namespaceObject.__experimentalUseDialog)({
34260      constrainTabbing,
34261      focusOnMount,
34262      __unstableOnClose: onDialogClose,
34263      // @ts-expect-error The __unstableOnClose property needs to be deprecated first (see https://github.com/WordPress/gutenberg/pull/27675)
34264      onClose: onDialogClose
34265    });
34266    const {
34267      // Positioning coordinates
34268      x,
34269      y,
34270      // Object with "regular" refs to both "reference" and "floating"
34271      refs,
34272      // Type of CSS position property to use (absolute or fixed)
34273      strategy,
34274      update,
34275      placement: computedPlacement,
34276      middlewareData: {
34277        arrow: arrowData
34278      }
34279    } = useFloating({
34280      placement: normalizedPlacementFromProps === 'overlay' ? undefined : normalizedPlacementFromProps,
34281      middleware,
34282      whileElementsMounted: (referenceParam, floatingParam, updateParam) => autoUpdate(referenceParam, floatingParam, updateParam, {
34283        layoutShift: false,
34284        animationFrame: true
34285      })
34286    });
34287    const arrowCallbackRef = (0,external_wp_element_namespaceObject.useCallback)(node => {
34288      arrowRef.current = node;
34289      update();
34290    }, [update]);
34291  
34292    // When any of the possible anchor "sources" change,
34293    // recompute the reference element (real or virtual) and its owner document.
34294  
34295    const anchorRefTop = anchorRef?.top;
34296    const anchorRefBottom = anchorRef?.bottom;
34297    const anchorRefStartContainer = anchorRef?.startContainer;
34298    const anchorRefCurrent = anchorRef?.current;
34299    (0,external_wp_element_namespaceObject.useLayoutEffect)(() => {
34300      const resultingReferenceElement = getReferenceElement({
34301        anchor,
34302        anchorRef,
34303        anchorRect,
34304        getAnchorRect,
34305        fallbackReferenceElement
34306      });
34307      refs.setReference(resultingReferenceElement);
34308    }, [anchor, anchorRef, anchorRefTop, anchorRefBottom, anchorRefStartContainer, anchorRefCurrent, anchorRect, getAnchorRect, fallbackReferenceElement, refs]);
34309    const mergedFloatingRef = (0,external_wp_compose_namespaceObject.useMergeRefs)([refs.setFloating, dialogRef, forwardedRef]);
34310    const style = isExpanded ? undefined : {
34311      position: strategy,
34312      top: 0,
34313      left: 0,
34314      // `x` and `y` are framer-motion specific props and are shorthands
34315      // for `translateX` and `translateY`. Currently it is not possible
34316      // to use `translateX` and `translateY` because those values would
34317      // be overridden by the return value of the
34318      // `placementToMotionAnimationProps` function.
34319      x: computePopoverPosition(x),
34320      y: computePopoverPosition(y)
34321    };
34322    const shouldReduceMotion = (0,external_wp_compose_namespaceObject.useReducedMotion)();
34323    const shouldAnimate = animate && !isExpanded && !shouldReduceMotion;
34324    const [animationFinished, setAnimationFinished] = (0,external_wp_element_namespaceObject.useState)(false);
34325    const {
34326      style: motionInlineStyles,
34327      ...otherMotionProps
34328    } = (0,external_wp_element_namespaceObject.useMemo)(() => placementToMotionAnimationProps(computedPlacement), [computedPlacement]);
34329    const animationProps = shouldAnimate ? {
34330      style: {
34331        ...contentStyle,
34332        ...motionInlineStyles,
34333        ...style
34334      },
34335      onAnimationComplete: () => setAnimationFinished(true),
34336      ...otherMotionProps
34337    } : {
34338      animate: false,
34339      style: {
34340        ...contentStyle,
34341        ...style
34342      }
34343    };
34344  
34345    // When Floating UI has finished positioning and Framer Motion has finished animating
34346    // the popover, add the `is-positioned` class to signal that all transitions have finished.
34347    const isPositioned = (!shouldAnimate || animationFinished) && x !== null && y !== null;
34348    let content = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(motion.div, {
34349      className: dist_clsx(className, {
34350        'is-expanded': isExpanded,
34351        'is-positioned': isPositioned,
34352        // Use the 'alternate' classname for 'toolbar' variant for back compat.
34353        [`is-$computedVariant === 'toolbar' ? 'alternate' : computedVariant}`]: computedVariant
34354      }),
34355      ...animationProps,
34356      ...contentProps,
34357      ref: mergedFloatingRef,
34358      ...dialogProps,
34359      tabIndex: -1,
34360      children: [isExpanded && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(scroll_lock, {}), isExpanded && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", {
34361        className: "components-popover__header",
34362        children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", {
34363          className: "components-popover__header-title",
34364          children: headerTitle
34365        }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, {
34366          className: "components-popover__close",
34367          icon: library_close,
34368          onClick: onClose
34369        })]
34370      }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", {
34371        className: "components-popover__content",
34372        children: children
34373      }), hasArrow && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", {
34374        ref: arrowCallbackRef,
34375        className: ['components-popover__arrow', `is-$computedPlacement.split('-')[0]}`].join(' '),
34376        style: {
34377          left: typeof arrowData?.x !== 'undefined' && Number.isFinite(arrowData.x) ? `$arrowData.x}px` : '',
34378          top: typeof arrowData?.y !== 'undefined' && Number.isFinite(arrowData.y) ? `$arrowData.y}px` : ''
34379        },
34380        children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ArrowTriangle, {})
34381      })]
34382    });
34383    const shouldRenderWithinSlot = slot.ref && !inline;
34384    const hasAnchor = anchorRef || anchorRect || anchor;
34385    if (shouldRenderWithinSlot) {
34386      content = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(slot_fill_Fill, {
34387        name: slotName,
34388        children: content
34389      });
34390    } else if (!inline) {
34391      content = (0,external_wp_element_namespaceObject.createPortal)( /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(StyleProvider, {
34392        document: document,
34393        children: content
34394      }), getPopoverFallbackContainer());
34395    }
34396    if (hasAnchor) {
34397      return content;
34398    }
34399    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, {
34400      children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", {
34401        ref: anchorRefFallback
34402      }), content]
34403    });
34404  };
34405  
34406  /**
34407   * `Popover` renders its content in a floating modal. If no explicit anchor is passed via props, it anchors to its parent element by default.
34408   *
34409   * ```jsx
34410   * import { Button, Popover } from '@wordpress/components';
34411   * import { useState } from '@wordpress/element';
34412   *
34413   * const MyPopover = () => {
34414   *     const [ isVisible, setIsVisible ] = useState( false );
34415   *     const toggleVisible = () => {
34416   *         setIsVisible( ( state ) => ! state );
34417   *     };
34418   *
34419   *     return (
34420   *         <Button variant="secondary" onClick={ toggleVisible }>
34421   *             Toggle Popover!
34422   *             { isVisible && <Popover>Popover is toggled!</Popover> }
34423   *         </Button>
34424   *     );
34425   * };
34426   * ```
34427   *
34428   */
34429  const popover_Popover = contextConnect(UnforwardedPopover, 'Popover');
34430  function PopoverSlot({
34431    name = SLOT_NAME
34432  }, ref) {
34433    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(slot_fill_Slot, {
34434      bubblesVirtually: true,
34435      name: name,
34436      className: "popover-slot",
34437      ref: ref
34438    });
34439  }
34440  
34441  // @ts-expect-error For Legacy Reasons
34442  popover_Popover.Slot = (0,external_wp_element_namespaceObject.forwardRef)(PopoverSlot);
34443  // @ts-expect-error For Legacy Reasons
34444  popover_Popover.__unstableSlotNameProvider = slotNameContext.Provider;
34445  /* harmony default export */ const popover = (popover_Popover);
34446  
34447  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/autocomplete/autocompleter-ui.js
34448  /**
34449   * External dependencies
34450   */
34451  
34452  
34453  /**
34454   * WordPress dependencies
34455   */
34456  
34457  
34458  
34459  
34460  
34461  
34462  /**
34463   * Internal dependencies
34464   */
34465  
34466  
34467  
34468  
34469  
34470  
34471  
34472  
34473  function ListBox({
34474    items,
34475    onSelect,
34476    selectedIndex,
34477    instanceId,
34478    listBoxId,
34479    className,
34480    Component = 'div'
34481  }) {
34482    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Component, {
34483      id: listBoxId,
34484      role: "listbox",
34485      className: "components-autocomplete__results",
34486      children: items.map((option, index) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, {
34487        id: `components-autocomplete-item-$instanceId}-$option.key}`,
34488        role: "option",
34489        "aria-selected": index === selectedIndex,
34490        accessibleWhenDisabled: true,
34491        disabled: option.isDisabled,
34492        className: dist_clsx('components-autocomplete__result', className, {
34493          // Unused, for backwards compatibility.
34494          'is-selected': index === selectedIndex
34495        }),
34496        variant: index === selectedIndex ? 'primary' : undefined,
34497        onClick: () => onSelect(option),
34498        children: option.label
34499      }, option.key))
34500    });
34501  }
34502  function getAutoCompleterUI(autocompleter) {
34503    var _autocompleter$useIte;
34504    const useItems = (_autocompleter$useIte = autocompleter.useItems) !== null && _autocompleter$useIte !== void 0 ? _autocompleter$useIte : getDefaultUseItems(autocompleter);
34505    function AutocompleterUI({
34506      filterValue,
34507      instanceId,
34508      listBoxId,
34509      className,
34510      selectedIndex,
34511      onChangeOptions,
34512      onSelect,
34513      onReset,
34514      reset,
34515      contentRef
34516    }) {
34517      const [items] = useItems(filterValue);
34518      const popoverAnchor = (0,external_wp_richText_namespaceObject.useAnchor)({
34519        editableContentElement: contentRef.current
34520      });
34521      const [needsA11yCompat, setNeedsA11yCompat] = (0,external_wp_element_namespaceObject.useState)(false);
34522      const popoverRef = (0,external_wp_element_namespaceObject.useRef)(null);
34523      const popoverRefs = (0,external_wp_compose_namespaceObject.useMergeRefs)([popoverRef, (0,external_wp_compose_namespaceObject.useRefEffect)(node => {
34524        if (!contentRef.current) {
34525          return;
34526        }
34527  
34528        // If the popover is rendered in a different document than
34529        // the content, we need to duplicate the options list in the
34530        // content document so that it's available to the screen
34531        // readers, which check the DOM ID based aria-* attributes.
34532        setNeedsA11yCompat(node.ownerDocument !== contentRef.current.ownerDocument);
34533      }, [contentRef])]);
34534      useOnClickOutside(popoverRef, reset);
34535      const debouncedSpeak = (0,external_wp_compose_namespaceObject.useDebounce)(external_wp_a11y_namespaceObject.speak, 500);
34536      function announce(options) {
34537        if (!debouncedSpeak) {
34538          return;
34539        }
34540        if (!!options.length) {
34541          if (filterValue) {
34542            debouncedSpeak((0,external_wp_i18n_namespaceObject.sprintf)( /* translators: %d: number of results. */
34543            (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.', options.length), options.length), 'assertive');
34544          } else {
34545            debouncedSpeak((0,external_wp_i18n_namespaceObject.sprintf)( /* translators: %d: number of results. */
34546            (0,external_wp_i18n_namespaceObject._n)('Initial %d result loaded. Type to filter all available results. Use up and down arrow keys to navigate.', 'Initial %d results loaded. Type to filter all available results. Use up and down arrow keys to navigate.', options.length), options.length), 'assertive');
34547          }
34548        } else {
34549          debouncedSpeak((0,external_wp_i18n_namespaceObject.__)('No results.'), 'assertive');
34550        }
34551      }
34552      (0,external_wp_element_namespaceObject.useLayoutEffect)(() => {
34553        onChangeOptions(items);
34554        announce(items);
34555        // Temporarily disabling exhaustive-deps to avoid introducing unexpected side effecst.
34556        // See https://github.com/WordPress/gutenberg/pull/41820
34557        // eslint-disable-next-line react-hooks/exhaustive-deps
34558      }, [items]);
34559      if (items.length === 0) {
34560        return null;
34561      }
34562      return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, {
34563        children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(popover, {
34564          focusOnMount: false,
34565          onClose: onReset,
34566          placement: "top-start",
34567          className: "components-autocomplete__popover",
34568          anchor: popoverAnchor,
34569          ref: popoverRefs,
34570          children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ListBox, {
34571            items: items,
34572            onSelect: onSelect,
34573            selectedIndex: selectedIndex,
34574            instanceId: instanceId,
34575            listBoxId: listBoxId,
34576            className: className
34577          })
34578        }), contentRef.current && needsA11yCompat && (0,external_ReactDOM_namespaceObject.createPortal)( /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ListBox, {
34579          items: items,
34580          onSelect: onSelect,
34581          selectedIndex: selectedIndex,
34582          instanceId: instanceId,
34583          listBoxId: listBoxId,
34584          className: className,
34585          Component: visually_hidden_component
34586        }), contentRef.current.ownerDocument.body)]
34587      });
34588    }
34589    return AutocompleterUI;
34590  }
34591  function useOnClickOutside(ref, handler) {
34592    (0,external_wp_element_namespaceObject.useEffect)(() => {
34593      const listener = event => {
34594        // Do nothing if clicking ref's element or descendent elements, or if the ref is not referencing an element
34595        if (!ref.current || ref.current.contains(event.target)) {
34596          return;
34597        }
34598        handler(event);
34599      };
34600      document.addEventListener('mousedown', listener);
34601      document.addEventListener('touchstart', listener);
34602      return () => {
34603        document.removeEventListener('mousedown', listener);
34604        document.removeEventListener('touchstart', listener);
34605      };
34606      // Disable reason: `ref` is a ref object and should not be included in a
34607      // hook's dependency list.
34608      // eslint-disable-next-line react-hooks/exhaustive-deps
34609    }, [handler]);
34610  }
34611  
34612  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/autocomplete/index.js
34613  /**
34614   * External dependencies
34615   */
34616  
34617  
34618  /**
34619   * WordPress dependencies
34620   */
34621  
34622  
34623  
34624  
34625  
34626  
34627  /**
34628   * Internal dependencies
34629   */
34630  
34631  
34632  
34633  
34634  
34635  
34636  const getNodeText = node => {
34637    if (node === null) {
34638      return '';
34639    }
34640    switch (typeof node) {
34641      case 'string':
34642      case 'number':
34643        return node.toString();
34644        break;
34645      case 'boolean':
34646        return '';
34647        break;
34648      case 'object':
34649        {
34650          if (node instanceof Array) {
34651            return node.map(getNodeText).join('');
34652          }
34653          if ('props' in node) {
34654            return getNodeText(node.props.children);
34655          }
34656          break;
34657        }
34658      default:
34659        return '';
34660    }
34661    return '';
34662  };
34663  const EMPTY_FILTERED_OPTIONS = [];
34664  function useAutocomplete({
34665    record,
34666    onChange,
34667    onReplace,
34668    completers,
34669    contentRef
34670  }) {
34671    const instanceId = (0,external_wp_compose_namespaceObject.useInstanceId)(useAutocomplete);
34672    const [selectedIndex, setSelectedIndex] = (0,external_wp_element_namespaceObject.useState)(0);
34673    const [filteredOptions, setFilteredOptions] = (0,external_wp_element_namespaceObject.useState)(EMPTY_FILTERED_OPTIONS);
34674    const [filterValue, setFilterValue] = (0,external_wp_element_namespaceObject.useState)('');
34675    const [autocompleter, setAutocompleter] = (0,external_wp_element_namespaceObject.useState)(null);
34676    const [AutocompleterUI, setAutocompleterUI] = (0,external_wp_element_namespaceObject.useState)(null);
34677    const backspacing = (0,external_wp_element_namespaceObject.useRef)(false);
34678    function insertCompletion(replacement) {
34679      if (autocompleter === null) {
34680        return;
34681      }
34682      const end = record.start;
34683      const start = end - autocompleter.triggerPrefix.length - filterValue.length;
34684      const toInsert = (0,external_wp_richText_namespaceObject.create)({
34685        html: (0,external_wp_element_namespaceObject.renderToString)(replacement)
34686      });
34687      onChange((0,external_wp_richText_namespaceObject.insert)(record, toInsert, start, end));
34688    }
34689    function select(option) {
34690      const {
34691        getOptionCompletion
34692      } = autocompleter || {};
34693      if (option.isDisabled) {
34694        return;
34695      }
34696      if (getOptionCompletion) {
34697        const completion = getOptionCompletion(option.value, filterValue);
34698        const isCompletionObject = obj => {
34699          return obj !== null && typeof obj === 'object' && 'action' in obj && obj.action !== undefined && 'value' in obj && obj.value !== undefined;
34700        };
34701        const completionObject = isCompletionObject(completion) ? completion : {
34702          action: 'insert-at-caret',
34703          value: completion
34704        };
34705        if ('replace' === completionObject.action) {
34706          onReplace([completionObject.value]);
34707          // When replacing, the component will unmount, so don't reset
34708          // state (below) on an unmounted component.
34709          return;
34710        } else if ('insert-at-caret' === completionObject.action) {
34711          insertCompletion(completionObject.value);
34712        }
34713      }
34714  
34715      // Reset autocomplete state after insertion rather than before
34716      // so insertion events don't cause the completion menu to redisplay.
34717      reset();
34718    }
34719    function reset() {
34720      setSelectedIndex(0);
34721      setFilteredOptions(EMPTY_FILTERED_OPTIONS);
34722      setFilterValue('');
34723      setAutocompleter(null);
34724      setAutocompleterUI(null);
34725    }
34726  
34727    /**
34728     * Load options for an autocompleter.
34729     *
34730     * @param {Array} options
34731     */
34732    function onChangeOptions(options) {
34733      setSelectedIndex(options.length === filteredOptions.length ? selectedIndex : 0);
34734      setFilteredOptions(options);
34735    }
34736    function handleKeyDown(event) {
34737      backspacing.current = event.key === 'Backspace';
34738      if (!autocompleter) {
34739        return;
34740      }
34741      if (filteredOptions.length === 0) {
34742        return;
34743      }
34744      if (event.defaultPrevented) {
34745        return;
34746      }
34747      switch (event.key) {
34748        case 'ArrowUp':
34749          {
34750            const newIndex = (selectedIndex === 0 ? filteredOptions.length : selectedIndex) - 1;
34751            setSelectedIndex(newIndex);
34752            // See the related PR as to why this is necessary: https://github.com/WordPress/gutenberg/pull/54902.
34753            if ((0,external_wp_keycodes_namespaceObject.isAppleOS)()) {
34754              (0,external_wp_a11y_namespaceObject.speak)(getNodeText(filteredOptions[newIndex].label), 'assertive');
34755            }
34756            break;
34757          }
34758        case 'ArrowDown':
34759          {
34760            const newIndex = (selectedIndex + 1) % filteredOptions.length;
34761            setSelectedIndex(newIndex);
34762            if ((0,external_wp_keycodes_namespaceObject.isAppleOS)()) {
34763              (0,external_wp_a11y_namespaceObject.speak)(getNodeText(filteredOptions[newIndex].label), 'assertive');
34764            }
34765            break;
34766          }
34767        case 'Escape':
34768          setAutocompleter(null);
34769          setAutocompleterUI(null);
34770          event.preventDefault();
34771          break;
34772        case 'Enter':
34773          select(filteredOptions[selectedIndex]);
34774          break;
34775        case 'ArrowLeft':
34776        case 'ArrowRight':
34777          reset();
34778          return;
34779        default:
34780          return;
34781      }
34782  
34783      // Any handled key should prevent original behavior. This relies on
34784      // the early return in the default case.
34785      event.preventDefault();
34786    }
34787  
34788    // textContent is a primitive (string), memoizing is not strictly necessary
34789    // but this is a preemptive performance improvement, since the autocompleter
34790    // is a potential bottleneck for the editor type metric.
34791    const textContent = (0,external_wp_element_namespaceObject.useMemo)(() => {
34792      if ((0,external_wp_richText_namespaceObject.isCollapsed)(record)) {
34793        return (0,external_wp_richText_namespaceObject.getTextContent)((0,external_wp_richText_namespaceObject.slice)(record, 0));
34794      }
34795      return '';
34796    }, [record]);
34797    (0,external_wp_element_namespaceObject.useEffect)(() => {
34798      if (!textContent) {
34799        if (autocompleter) {
34800          reset();
34801        }
34802        return;
34803      }
34804  
34805      // Find the completer with the highest triggerPrefix index in the
34806      // textContent.
34807      const completer = completers.reduce((lastTrigger, currentCompleter) => {
34808        const triggerIndex = textContent.lastIndexOf(currentCompleter.triggerPrefix);
34809        const lastTriggerIndex = lastTrigger !== null ? textContent.lastIndexOf(lastTrigger.triggerPrefix) : -1;
34810        return triggerIndex > lastTriggerIndex ? currentCompleter : lastTrigger;
34811      }, null);
34812      if (!completer) {
34813        if (autocompleter) {
34814          reset();
34815        }
34816        return;
34817      }
34818      const {
34819        allowContext,
34820        triggerPrefix
34821      } = completer;
34822      const triggerIndex = textContent.lastIndexOf(triggerPrefix);
34823      const textWithoutTrigger = textContent.slice(triggerIndex + triggerPrefix.length);
34824      const tooDistantFromTrigger = textWithoutTrigger.length > 50; // 50 chars seems to be a good limit.
34825      // This is a final barrier to prevent the effect from completing with
34826      // an extremely long string, which causes the editor to slow-down
34827      // significantly. This could happen, for example, if `matchingWhileBackspacing`
34828      // is true and one of the "words" end up being too long. If that's the case,
34829      // it will be caught by this guard.
34830      if (tooDistantFromTrigger) {
34831        return;
34832      }
34833      const mismatch = filteredOptions.length === 0;
34834      const wordsFromTrigger = textWithoutTrigger.split(/\s/);
34835      // We need to allow the effect to run when not backspacing and if there
34836      // was a mismatch. i.e when typing a trigger + the match string or when
34837      // clicking in an existing trigger word on the page. We do that if we
34838      // detect that we have one word from trigger in the current textual context.
34839      //
34840      // Ex.: "Some text @a" <-- "@a" will be detected as the trigger word and
34841      // allow the effect to run. It will run until there's a mismatch.
34842      const hasOneTriggerWord = wordsFromTrigger.length === 1;
34843      // This is used to allow the effect to run when backspacing and if
34844      // "touching" a word that "belongs" to a trigger. We consider a "trigger
34845      // word" any word up to the limit of 3 from the trigger character.
34846      // Anything beyond that is ignored if there's a mismatch. This allows
34847      // us to "escape" a mismatch when backspacing, but still imposing some
34848      // sane limits.
34849      //
34850      // Ex: "Some text @marcelo sekkkk" <--- "kkkk" caused a mismatch, but
34851      // if the user presses backspace here, it will show the completion popup again.
34852      const matchingWhileBackspacing = backspacing.current && wordsFromTrigger.length <= 3;
34853      if (mismatch && !(matchingWhileBackspacing || hasOneTriggerWord)) {
34854        if (autocompleter) {
34855          reset();
34856        }
34857        return;
34858      }
34859      const textAfterSelection = (0,external_wp_richText_namespaceObject.getTextContent)((0,external_wp_richText_namespaceObject.slice)(record, undefined, (0,external_wp_richText_namespaceObject.getTextContent)(record).length));
34860      if (allowContext && !allowContext(textContent.slice(0, triggerIndex), textAfterSelection)) {
34861        if (autocompleter) {
34862          reset();
34863        }
34864        return;
34865      }
34866      if (/^\s/.test(textWithoutTrigger) || /\s\s+$/.test(textWithoutTrigger)) {
34867        if (autocompleter) {
34868          reset();
34869        }
34870        return;
34871      }
34872      if (!/[\u0000-\uFFFF]*$/.test(textWithoutTrigger)) {
34873        if (autocompleter) {
34874          reset();
34875        }
34876        return;
34877      }
34878      const safeTrigger = escapeRegExp(completer.triggerPrefix);
34879      const text = remove_accents_default()(textContent);
34880      const match = text.slice(text.lastIndexOf(completer.triggerPrefix)).match(new RegExp(`$safeTrigger}([\u0000-\uFFFF]*)$`));
34881      const query = match && match[1];
34882      setAutocompleter(completer);
34883      setAutocompleterUI(() => completer !== autocompleter ? getAutoCompleterUI(completer) : AutocompleterUI);
34884      setFilterValue(query === null ? '' : query);
34885      // Temporarily disabling exhaustive-deps to avoid introducing unexpected side effecst.
34886      // See https://github.com/WordPress/gutenberg/pull/41820
34887      // eslint-disable-next-line react-hooks/exhaustive-deps
34888    }, [textContent]);
34889    const {
34890      key: selectedKey = ''
34891    } = filteredOptions[selectedIndex] || {};
34892    const {
34893      className
34894    } = autocompleter || {};
34895    const isExpanded = !!autocompleter && filteredOptions.length > 0;
34896    const listBoxId = isExpanded ? `components-autocomplete-listbox-$instanceId}` : undefined;
34897    const activeId = isExpanded ? `components-autocomplete-item-$instanceId}-$selectedKey}` : null;
34898    const hasSelection = record.start !== undefined;
34899    return {
34900      listBoxId,
34901      activeId,
34902      onKeyDown: withIgnoreIMEEvents(handleKeyDown),
34903      popover: hasSelection && AutocompleterUI && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(AutocompleterUI, {
34904        className: className,
34905        filterValue: filterValue,
34906        instanceId: instanceId,
34907        listBoxId: listBoxId,
34908        selectedIndex: selectedIndex,
34909        onChangeOptions: onChangeOptions,
34910        onSelect: select,
34911        value: record,
34912        contentRef: contentRef,
34913        reset: reset
34914      })
34915    };
34916  }
34917  function useLastDifferentValue(value) {
34918    const history = (0,external_wp_element_namespaceObject.useRef)(new Set());
34919    history.current.add(value);
34920  
34921    // Keep the history size to 2.
34922    if (history.current.size > 2) {
34923      history.current.delete(Array.from(history.current)[0]);
34924    }
34925    return Array.from(history.current)[0];
34926  }
34927  function useAutocompleteProps(options) {
34928    const ref = (0,external_wp_element_namespaceObject.useRef)(null);
34929    const onKeyDownRef = (0,external_wp_element_namespaceObject.useRef)();
34930    const {
34931      record
34932    } = options;
34933    const previousRecord = useLastDifferentValue(record);
34934    const {
34935      popover,
34936      listBoxId,
34937      activeId,
34938      onKeyDown
34939    } = useAutocomplete({
34940      ...options,
34941      contentRef: ref
34942    });
34943    onKeyDownRef.current = onKeyDown;
34944    const mergedRefs = (0,external_wp_compose_namespaceObject.useMergeRefs)([ref, (0,external_wp_compose_namespaceObject.useRefEffect)(element => {
34945      function _onKeyDown(event) {
34946        onKeyDownRef.current?.(event);
34947      }
34948      element.addEventListener('keydown', _onKeyDown);
34949      return () => {
34950        element.removeEventListener('keydown', _onKeyDown);
34951      };
34952    }, [])]);
34953  
34954    // We only want to show the popover if the user has typed something.
34955    const didUserInput = record.text !== previousRecord?.text;
34956    if (!didUserInput) {
34957      return {
34958        ref: mergedRefs
34959      };
34960    }
34961    return {
34962      ref: mergedRefs,
34963      children: popover,
34964      'aria-autocomplete': listBoxId ? 'list' : undefined,
34965      'aria-owns': listBoxId,
34966      'aria-activedescendant': activeId
34967    };
34968  }
34969  function Autocomplete({
34970    children,
34971    isSelected,
34972    ...options
34973  }) {
34974    const {
34975      popover,
34976      ...props
34977    } = useAutocomplete(options);
34978    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, {
34979      children: [children(props), isSelected && popover]
34980    });
34981  }
34982  
34983  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/base-control/hooks.js
34984  /**
34985   * WordPress dependencies
34986   */
34987  
34988  
34989  /**
34990   * Internal dependencies
34991   */
34992  
34993  /**
34994   * Generate props for the `BaseControl` and the inner control itself.
34995   *
34996   * Namely, it takes care of generating a unique `id`, properly associating it with the `label` and `help` elements.
34997   *
34998   * @param props
34999   */
35000  function useBaseControlProps(props) {
35001    const {
35002      help,
35003      id: preferredId,
35004      ...restProps
35005    } = props;
35006    const uniqueId = (0,external_wp_compose_namespaceObject.useInstanceId)(base_control, 'wp-components-base-control', preferredId);
35007    return {
35008      baseControlProps: {
35009        id: uniqueId,
35010        help,
35011        ...restProps
35012      },
35013      controlProps: {
35014        id: uniqueId,
35015        ...(!!help ? {
35016          'aria-describedby': `$uniqueId}__help`
35017        } : {})
35018      }
35019    };
35020  }
35021  
35022  ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/link.js
35023  /**
35024   * WordPress dependencies
35025   */
35026  
35027  
35028  const link_link = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, {
35029    xmlns: "http://www.w3.org/2000/svg",
35030    viewBox: "0 0 24 24",
35031    children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, {
35032      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"
35033    })
35034  });
35035  /* harmony default export */ const library_link = (link_link);
35036  
35037  ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/link-off.js
35038  /**
35039   * WordPress dependencies
35040   */
35041  
35042  
35043  const linkOff = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, {
35044    xmlns: "http://www.w3.org/2000/svg",
35045    viewBox: "0 0 24 24",
35046    children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, {
35047      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"
35048    })
35049  });
35050  /* harmony default export */ const link_off = (linkOff);
35051  
35052  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/border-box-control/styles.js
35053  function border_box_control_styles_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)."; }
35054  /**
35055   * External dependencies
35056   */
35057  
35058  
35059  /**
35060   * Internal dependencies
35061   */
35062  
35063  const borderBoxControl = /*#__PURE__*/emotion_react_browser_esm_css( true ? "" : 0,  true ? "" : 0);
35064  const linkedBorderControl = () => /*#__PURE__*/emotion_react_browser_esm_css("flex:1;", rtl({
35065    marginRight: '24px'
35066  })(), ";" + ( true ? "" : 0),  true ? "" : 0);
35067  const wrapper =  true ? {
35068    name: "bjn8wh",
35069    styles: "position:relative"
35070  } : 0;
35071  const borderBoxControlLinkedButton = size => {
35072    return /*#__PURE__*/emotion_react_browser_esm_css("position:absolute;top:", size === '__unstable-large' ? '8px' : '3px', ";", rtl({
35073      right: 0
35074    })(), " line-height:0;" + ( true ? "" : 0),  true ? "" : 0);
35075  };
35076  const borderBoxStyleWithFallback = border => {
35077    const {
35078      color = COLORS.gray[200],
35079      style = 'solid',
35080      width = config_values.borderWidth
35081    } = border || {};
35082    const clampedWidth = width !== config_values.borderWidth ? `clamp(1px, $width}, 10px)` : width;
35083    const hasVisibleBorder = !!width && width !== '0' || !!color;
35084    const borderStyle = hasVisibleBorder ? style || 'solid' : style;
35085    return `$color} $borderStyle} $clampedWidth}`;
35086  };
35087  const borderBoxControlVisualizer = (borders, size) => {
35088    return /*#__PURE__*/emotion_react_browser_esm_css("position:absolute;top:", size === '__unstable-large' ? '20px' : '15px', ";right:", size === '__unstable-large' ? '39px' : '29px', ";bottom:", size === '__unstable-large' ? '20px' : '15px', ";left:", size === '__unstable-large' ? '39px' : '29px', ";border-top:", borderBoxStyleWithFallback(borders?.top), ";border-bottom:", borderBoxStyleWithFallback(borders?.bottom), ";", rtl({
35089      borderLeft: borderBoxStyleWithFallback(borders?.left)
35090    })(), " ", rtl({
35091      borderRight: borderBoxStyleWithFallback(borders?.right)
35092    })(), ";" + ( true ? "" : 0),  true ? "" : 0);
35093  };
35094  const borderBoxControlSplitControls = size => /*#__PURE__*/emotion_react_browser_esm_css("position:relative;flex:1;width:", size === '__unstable-large' ? undefined : '80%', ";" + ( true ? "" : 0),  true ? "" : 0);
35095  const centeredBorderControl =  true ? {
35096    name: "1nwbfnf",
35097    styles: "grid-column:span 2;margin:0 auto"
35098  } : 0;
35099  const rightBorderControl = () => /*#__PURE__*/emotion_react_browser_esm_css(rtl({
35100    marginLeft: 'auto'
35101  })(), ";" + ( true ? "" : 0),  true ? "" : 0);
35102  
35103  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/border-box-control/border-box-control-linked-button/hook.js
35104  /**
35105   * WordPress dependencies
35106   */
35107  
35108  
35109  /**
35110   * Internal dependencies
35111   */
35112  
35113  
35114  
35115  function useBorderBoxControlLinkedButton(props) {
35116    const {
35117      className,
35118      size = 'default',
35119      ...otherProps
35120    } = useContextSystem(props, 'BorderBoxControlLinkedButton');
35121  
35122    // Generate class names.
35123    const cx = useCx();
35124    const classes = (0,external_wp_element_namespaceObject.useMemo)(() => {
35125      return cx(borderBoxControlLinkedButton(size), className);
35126    }, [className, cx, size]);
35127    return {
35128      ...otherProps,
35129      className: classes
35130    };
35131  }
35132  
35133  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/border-box-control/border-box-control-linked-button/component.js
35134  /**
35135   * WordPress dependencies
35136   */
35137  
35138  
35139  
35140  /**
35141   * Internal dependencies
35142   */
35143  
35144  
35145  
35146  
35147  
35148  
35149  const BorderBoxControlLinkedButton = (props, forwardedRef) => {
35150    const {
35151      className,
35152      isLinked,
35153      ...buttonProps
35154    } = useBorderBoxControlLinkedButton(props);
35155    const label = isLinked ? (0,external_wp_i18n_namespaceObject.__)('Unlink sides') : (0,external_wp_i18n_namespaceObject.__)('Link sides');
35156    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(tooltip, {
35157      text: label,
35158      children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(component, {
35159        className: className,
35160        children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, {
35161          ...buttonProps,
35162          size: "small",
35163          icon: isLinked ? library_link : link_off,
35164          iconSize: 24,
35165          "aria-label": label,
35166          ref: forwardedRef
35167        })
35168      })
35169    });
35170  };
35171  const ConnectedBorderBoxControlLinkedButton = contextConnect(BorderBoxControlLinkedButton, 'BorderBoxControlLinkedButton');
35172  /* harmony default export */ const border_box_control_linked_button_component = (ConnectedBorderBoxControlLinkedButton);
35173  
35174  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/border-box-control/border-box-control-visualizer/hook.js
35175  /**
35176   * WordPress dependencies
35177   */
35178  
35179  
35180  /**
35181   * Internal dependencies
35182   */
35183  
35184  
35185  
35186  function useBorderBoxControlVisualizer(props) {
35187    const {
35188      className,
35189      value,
35190      size = 'default',
35191      ...otherProps
35192    } = useContextSystem(props, 'BorderBoxControlVisualizer');
35193  
35194    // Generate class names.
35195    const cx = useCx();
35196    const classes = (0,external_wp_element_namespaceObject.useMemo)(() => {
35197      return cx(borderBoxControlVisualizer(value, size), className);
35198    }, [cx, className, value, size]);
35199    return {
35200      ...otherProps,
35201      className: classes,
35202      value
35203    };
35204  }
35205  
35206  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/border-box-control/border-box-control-visualizer/component.js
35207  /**
35208   * Internal dependencies
35209   */
35210  
35211  
35212  
35213  
35214  const BorderBoxControlVisualizer = (props, forwardedRef) => {
35215    const {
35216      value,
35217      ...otherProps
35218    } = useBorderBoxControlVisualizer(props);
35219    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(component, {
35220      ...otherProps,
35221      ref: forwardedRef
35222    });
35223  };
35224  const ConnectedBorderBoxControlVisualizer = contextConnect(BorderBoxControlVisualizer, 'BorderBoxControlVisualizer');
35225  /* harmony default export */ const border_box_control_visualizer_component = (ConnectedBorderBoxControlVisualizer);
35226  
35227  ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/close-small.js
35228  /**
35229   * WordPress dependencies
35230   */
35231  
35232  
35233  const closeSmall = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, {
35234    xmlns: "http://www.w3.org/2000/svg",
35235    viewBox: "0 0 24 24",
35236    children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, {
35237      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"
35238    })
35239  });
35240  /* harmony default export */ const close_small = (closeSmall);
35241  
35242  ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/line-solid.js
35243  /**
35244   * WordPress dependencies
35245   */
35246  
35247  
35248  const lineSolid = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, {
35249    xmlns: "http://www.w3.org/2000/svg",
35250    viewBox: "0 0 24 24",
35251    children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, {
35252      d: "M5 11.25h14v1.5H5z"
35253    })
35254  });
35255  /* harmony default export */ const line_solid = (lineSolid);
35256  
35257  ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/line-dashed.js
35258  /**
35259   * WordPress dependencies
35260   */
35261  
35262  
35263  const lineDashed = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, {
35264    xmlns: "http://www.w3.org/2000/svg",
35265    viewBox: "0 0 24 24",
35266    children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, {
35267      fillRule: "evenodd",
35268      d: "M5 11.25h3v1.5H5v-1.5zm5.5 0h3v1.5h-3v-1.5zm8.5 0h-3v1.5h3v-1.5z",
35269      clipRule: "evenodd"
35270    })
35271  });
35272  /* harmony default export */ const line_dashed = (lineDashed);
35273  
35274  ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/line-dotted.js
35275  /**
35276   * WordPress dependencies
35277   */
35278  
35279  
35280  const lineDotted = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, {
35281    xmlns: "http://www.w3.org/2000/svg",
35282    viewBox: "0 0 24 24",
35283    children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, {
35284      fillRule: "evenodd",
35285      d: "M5.25 11.25h1.5v1.5h-1.5v-1.5zm3 0h1.5v1.5h-1.5v-1.5zm4.5 0h-1.5v1.5h1.5v-1.5zm1.5 0h1.5v1.5h-1.5v-1.5zm4.5 0h-1.5v1.5h1.5v-1.5z",
35286      clipRule: "evenodd"
35287    })
35288  });
35289  /* harmony default export */ const line_dotted = (lineDotted);
35290  
35291  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/context/DeprecatedLayoutGroupContext.mjs
35292  
35293  
35294  /**
35295   * Note: Still used by components generated by old versions of Framer
35296   *
35297   * @deprecated
35298   */
35299  const DeprecatedLayoutGroupContext = (0,external_React_.createContext)(null);
35300  
35301  
35302  
35303  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/projection/node/group.mjs
35304  const notify = (node) => !node.isLayoutDirty && node.willUpdate(false);
35305  function nodeGroup() {
35306      const nodes = new Set();
35307      const subscriptions = new WeakMap();
35308      const dirtyAll = () => nodes.forEach(notify);
35309      return {
35310          add: (node) => {
35311              nodes.add(node);
35312              subscriptions.set(node, node.addEventListener("willUpdate", dirtyAll));
35313          },
35314          remove: (node) => {
35315              nodes.delete(node);
35316              const unsubscribe = subscriptions.get(node);
35317              if (unsubscribe) {
35318                  unsubscribe();
35319                  subscriptions.delete(node);
35320              }
35321              dirtyAll();
35322          },
35323          dirty: dirtyAll,
35324      };
35325  }
35326  
35327  
35328  
35329  ;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/components/LayoutGroup/index.mjs
35330  
35331  
35332  
35333  
35334  
35335  
35336  
35337  const shouldInheritGroup = (inherit) => inherit === true;
35338  const shouldInheritId = (inherit) => shouldInheritGroup(inherit === true) || inherit === "id";
35339  const LayoutGroup = ({ children, id, inherit = true }) => {
35340      const layoutGroupContext = (0,external_React_.useContext)(LayoutGroupContext);
35341      const deprecatedLayoutGroupContext = (0,external_React_.useContext)(DeprecatedLayoutGroupContext);
35342      const [forceRender, key] = use_force_update_useForceUpdate();
35343      const context = (0,external_React_.useRef)(null);
35344      const upstreamId = layoutGroupContext.id || deprecatedLayoutGroupContext;
35345      if (context.current === null) {
35346          if (shouldInheritId(inherit) && upstreamId) {
35347              id = id ? upstreamId + "-" + id : upstreamId;
35348          }
35349          context.current = {
35350              id,
35351              group: shouldInheritGroup(inherit)
35352                  ? layoutGroupContext.group || nodeGroup()
35353                  : nodeGroup(),
35354          };
35355      }
35356      const memoizedContext = (0,external_React_.useMemo)(() => ({ ...context.current, forceRender }), [key]);
35357      return ((0,external_ReactJSXRuntime_namespaceObject.jsx)(LayoutGroupContext.Provider, { value: memoizedContext, children: children }));
35358  };
35359  
35360  
35361  
35362  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/toggle-group-control/toggle-group-control/styles.js
35363  
35364  function toggle_group_control_styles_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)."; }
35365  /**
35366   * External dependencies
35367   */
35368  
35369  /**
35370   * Internal dependencies
35371   */
35372  
35373  const toggleGroupControl = ({
35374    isBlock,
35375    isDeselectable,
35376    size
35377  }) => /*#__PURE__*/emotion_react_browser_esm_css("background:", COLORS.ui.background, ";border:1px solid transparent;border-radius:", config_values.radiusSmall, ";display:inline-flex;min-width:0;position:relative;", toggleGroupControlSize(size), " ", !isDeselectable && enclosingBorders(isBlock), ";" + ( true ? "" : 0),  true ? "" : 0);
35378  const enclosingBorders = isBlock => {
35379    const enclosingBorder = /*#__PURE__*/emotion_react_browser_esm_css("border-color:", COLORS.ui.border, ";" + ( true ? "" : 0),  true ? "" : 0);
35380    return /*#__PURE__*/emotion_react_browser_esm_css(isBlock && enclosingBorder, " &:hover{border-color:", COLORS.ui.borderHover, ";}&:focus-within{border-color:", COLORS.ui.borderFocus, ";box-shadow:", config_values.controlBoxShadowFocus, ";z-index:1;outline:2px solid transparent;outline-offset:-2px;}" + ( true ? "" : 0),  true ? "" : 0);
35381  };
35382  var styles_ref =  true ? {
35383    name: "1aqh2c7",
35384    styles: "min-height:40px;padding:3px"
35385  } : 0;
35386  var _ref2 =  true ? {
35387    name: "1ndywgm",
35388    styles: "min-height:36px;padding:2px"
35389  } : 0;
35390  const toggleGroupControlSize = size => {
35391    const styles = {
35392      default: _ref2,
35393      '__unstable-large': styles_ref
35394    };
35395    return styles[size];
35396  };
35397  const toggle_group_control_styles_block =  true ? {
35398    name: "7whenc",
35399    styles: "display:flex;width:100%"
35400  } : 0;
35401  const VisualLabelWrapper = /*#__PURE__*/emotion_styled_base_browser_esm("div",  true ? {
35402    target: "eakva830"
35403  } : 0)( true ? {
35404    name: "zjik7",
35405    styles: "display:flex"
35406  } : 0);
35407  
35408  ;// CONCATENATED MODULE: ./node_modules/@ariakit/core/esm/radio/radio-store.js
35409  "use client";
35410  
35411  
35412  
35413  
35414  
35415  
35416  
35417  
35418  // src/radio/radio-store.ts
35419  function createRadioStore(_a = {}) {
35420    var props = _3YLGPPWQ_objRest(_a, []);
35421    var _a2;
35422    const syncState = (_a2 = props.store) == null ? void 0 : _a2.getState();
35423    const composite = createCompositeStore(_chunks_3YLGPPWQ_spreadProps(_chunks_3YLGPPWQ_spreadValues({}, props), {
35424      focusLoop: defaultValue(props.focusLoop, syncState == null ? void 0 : syncState.focusLoop, true)
35425    }));
35426    const initialState = _chunks_3YLGPPWQ_spreadProps(_chunks_3YLGPPWQ_spreadValues({}, composite.getState()), {
35427      value: defaultValue(
35428        props.value,
35429        syncState == null ? void 0 : syncState.value,
35430        props.defaultValue,
35431        null
35432      )
35433    });
35434    const radio = createStore(initialState, composite, props.store);
35435    return _chunks_3YLGPPWQ_spreadProps(_chunks_3YLGPPWQ_spreadValues(_chunks_3YLGPPWQ_spreadValues({}, composite), radio), {
35436      setValue: (value) => radio.setState("value", value)
35437    });
35438  }
35439  
35440  
35441  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/DYHFBFEH.js
35442  "use client";
35443  
35444  
35445  
35446  // src/radio/radio-store.ts
35447  
35448  function useRadioStoreProps(store, update, props) {
35449    store = useCompositeStoreProps(store, update, props);
35450    useStoreProps(store, props, "value", "setValue");
35451    return store;
35452  }
35453  function useRadioStore(props = {}) {
35454    const [store, update] = _2GXGCHW6_useStore(createRadioStore, props);
35455    return useRadioStoreProps(store, update, props);
35456  }
35457  
35458  
35459  
35460  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/SOKV3TSX.js
35461  "use client";
35462  
35463  
35464  
35465  // src/radio/radio-context.tsx
35466  var SOKV3TSX_ctx = createStoreContext(
35467    [CompositeContextProvider],
35468    [CompositeScopedContextProvider]
35469  );
35470  var useRadioContext = SOKV3TSX_ctx.useContext;
35471  var useRadioScopedContext = SOKV3TSX_ctx.useScopedContext;
35472  var useRadioProviderContext = SOKV3TSX_ctx.useProviderContext;
35473  var RadioContextProvider = SOKV3TSX_ctx.ContextProvider;
35474  var RadioScopedContextProvider = SOKV3TSX_ctx.ScopedContextProvider;
35475  
35476  
35477  
35478  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/radio/radio-group.js
35479  "use client";
35480  
35481  
35482  
35483  
35484  
35485  
35486  
35487  
35488  
35489  
35490  
35491  
35492  // src/radio/radio-group.tsx
35493  
35494  
35495  var radio_group_TagName = "div";
35496  var useRadioGroup = createHook(
35497    function useRadioGroup2(_a) {
35498      var _b = _a, { store } = _b, props = __objRest(_b, ["store"]);
35499      const context = useRadioProviderContext();
35500      store = store || context;
35501      invariant(
35502        store,
35503         false && 0
35504      );
35505      props = useWrapElement(
35506        props,
35507        (element) => /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(RadioScopedContextProvider, { value: store, children: element }),
35508        [store]
35509      );
35510      props = _3YLGPPWQ_spreadValues({
35511        role: "radiogroup"
35512      }, props);
35513      props = useComposite(_3YLGPPWQ_spreadValues({ store }, props));
35514      return props;
35515    }
35516  );
35517  var RadioGroup = forwardRef2(function RadioGroup2(props) {
35518    const htmlProps = useRadioGroup(props);
35519    return HKOOKEDE_createElement(radio_group_TagName, htmlProps);
35520  });
35521  
35522  
35523  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/toggle-group-control/context.js
35524  /**
35525   * WordPress dependencies
35526   */
35527  
35528  
35529  /**
35530   * Internal dependencies
35531   */
35532  
35533  const ToggleGroupControlContext = (0,external_wp_element_namespaceObject.createContext)({});
35534  const useToggleGroupControlContext = () => (0,external_wp_element_namespaceObject.useContext)(ToggleGroupControlContext);
35535  /* harmony default export */ const toggle_group_control_context = (ToggleGroupControlContext);
35536  
35537  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/toggle-group-control/toggle-group-control/utils.js
35538  /**
35539   * WordPress dependencies
35540   */
35541  
35542  
35543  
35544  /**
35545   * Internal dependencies
35546   */
35547  
35548  /**
35549   * Used to determine, via an internal heuristics, whether an `undefined` value
35550   * received for the `value` prop should be interpreted as the component being
35551   * used in uncontrolled mode, or as an "empty" value for controlled mode.
35552   *
35553   * @param valueProp The received `value`
35554   */
35555  function useComputeControlledOrUncontrolledValue(valueProp) {
35556    const isInitialRenderRef = (0,external_wp_element_namespaceObject.useRef)(true);
35557    const prevValueProp = (0,external_wp_compose_namespaceObject.usePrevious)(valueProp);
35558    const prevIsControlledRef = (0,external_wp_element_namespaceObject.useRef)(false);
35559    (0,external_wp_element_namespaceObject.useEffect)(() => {
35560      if (isInitialRenderRef.current) {
35561        isInitialRenderRef.current = false;
35562      }
35563    }, []);
35564  
35565    // Assume the component is being used in controlled mode on the first re-render
35566    // that has a different `valueProp` from the previous render.
35567    const isControlled = prevIsControlledRef.current || !isInitialRenderRef.current && prevValueProp !== valueProp;
35568    (0,external_wp_element_namespaceObject.useEffect)(() => {
35569      prevIsControlledRef.current = isControlled;
35570    }, [isControlled]);
35571    if (isControlled) {
35572      // When in controlled mode, use `''` instead of `undefined`
35573      return {
35574        value: valueProp !== null && valueProp !== void 0 ? valueProp : '',
35575        defaultValue: undefined
35576      };
35577    }
35578  
35579    // When in uncontrolled mode, the `value` should be intended as the initial value
35580    return {
35581      value: undefined,
35582      defaultValue: valueProp
35583    };
35584  }
35585  
35586  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/toggle-group-control/toggle-group-control/as-radio-group.js
35587  /**
35588   * External dependencies
35589   */
35590  
35591  
35592  
35593  
35594  /**
35595   * WordPress dependencies
35596   */
35597  
35598  
35599  
35600  
35601  /**
35602   * Internal dependencies
35603   */
35604  
35605  
35606  
35607  
35608  function UnforwardedToggleGroupControlAsRadioGroup({
35609    children,
35610    isAdaptiveWidth,
35611    label,
35612    onChange: onChangeProp,
35613    size,
35614    value: valueProp,
35615    id: idProp,
35616    ...otherProps
35617  }, forwardedRef) {
35618    const generatedId = (0,external_wp_compose_namespaceObject.useInstanceId)(ToggleGroupControlAsRadioGroup, 'toggle-group-control-as-radio-group');
35619    const baseId = idProp || generatedId;
35620  
35621    // Use a heuristic to understand if the component is being used in controlled
35622    // or uncontrolled mode, and consequently:
35623    // - when controlled, convert `undefined` values to `''` (ie. "no value")
35624    // - use the `value` prop as the `defaultValue` when uncontrolled
35625    const {
35626      value,
35627      defaultValue
35628    } = useComputeControlledOrUncontrolledValue(valueProp);
35629  
35630    // `useRadioStore`'s `setValue` prop can be called with `null`, while
35631    // the component's `onChange` prop only expects `undefined`
35632    const wrappedOnChangeProp = onChangeProp ? v => {
35633      onChangeProp(v !== null && v !== void 0 ? v : undefined);
35634    } : undefined;
35635    const radio = useRadioStore({
35636      defaultValue,
35637      value,
35638      setValue: wrappedOnChangeProp,
35639      rtl: (0,external_wp_i18n_namespaceObject.isRTL)()
35640    });
35641    const selectedValue = useStoreState(radio, 'value');
35642    const setValue = radio.setValue;
35643  
35644    // Ensures that the active id is also reset after the value is "reset" by the consumer.
35645    (0,external_wp_element_namespaceObject.useEffect)(() => {
35646      if (selectedValue === '') {
35647        radio.setActiveId(undefined);
35648      }
35649    }, [radio, selectedValue]);
35650    const groupContextValue = (0,external_wp_element_namespaceObject.useMemo)(() => ({
35651      activeItemIsNotFirstItem: () => radio.getState().activeId !== radio.first(),
35652      baseId,
35653      isBlock: !isAdaptiveWidth,
35654      size,
35655      value: selectedValue,
35656      setValue
35657    }), [baseId, isAdaptiveWidth, radio, size, selectedValue, setValue]);
35658    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(toggle_group_control_context.Provider, {
35659      value: groupContextValue,
35660      children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(RadioGroup, {
35661        store: radio,
35662        "aria-label": label,
35663        render: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(component, {}),
35664        ...otherProps,
35665        id: baseId,
35666        ref: forwardedRef,
35667        children: children
35668      })
35669    });
35670  }
35671  const ToggleGroupControlAsRadioGroup = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedToggleGroupControlAsRadioGroup);
35672  
35673  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/utils/hooks/use-controlled-value.js
35674  /**
35675   * WordPress dependencies
35676   */
35677  
35678  /**
35679   * Simplified and improved implementation of useControlledState.
35680   *
35681   * @param props
35682   * @param props.defaultValue
35683   * @param props.value
35684   * @param props.onChange
35685   * @return The controlled value and the value setter.
35686   */
35687  function useControlledValue({
35688    defaultValue,
35689    onChange,
35690    value: valueProp
35691  }) {
35692    const hasValue = typeof valueProp !== 'undefined';
35693    const initialValue = hasValue ? valueProp : defaultValue;
35694    const [state, setState] = (0,external_wp_element_namespaceObject.useState)(initialValue);
35695    const value = hasValue ? valueProp : state;
35696    let setValue;
35697    if (hasValue && typeof onChange === 'function') {
35698      setValue = onChange;
35699    } else if (!hasValue && typeof onChange === 'function') {
35700      setValue = nextValue => {
35701        onChange(nextValue);
35702        setState(nextValue);
35703      };
35704    } else {
35705      setValue = setState;
35706    }
35707    return [value, setValue];
35708  }
35709  
35710  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/toggle-group-control/toggle-group-control/as-button-group.js
35711  /**
35712   * WordPress dependencies
35713   */
35714  
35715  
35716  
35717  /**
35718   * Internal dependencies
35719   */
35720  
35721  
35722  
35723  
35724  
35725  function UnforwardedToggleGroupControlAsButtonGroup({
35726    children,
35727    isAdaptiveWidth,
35728    label,
35729    onChange,
35730    size,
35731    value: valueProp,
35732    id: idProp,
35733    ...otherProps
35734  }, forwardedRef) {
35735    const generatedId = (0,external_wp_compose_namespaceObject.useInstanceId)(ToggleGroupControlAsButtonGroup, 'toggle-group-control-as-button-group');
35736    const baseId = idProp || generatedId;
35737  
35738    // Use a heuristic to understand if the component is being used in controlled
35739    // or uncontrolled mode, and consequently:
35740    // - when controlled, convert `undefined` values to `''` (ie. "no value")
35741    // - use the `value` prop as the `defaultValue` when uncontrolled
35742    const {
35743      value,
35744      defaultValue
35745    } = useComputeControlledOrUncontrolledValue(valueProp);
35746    const [selectedValue, setSelectedValue] = useControlledValue({
35747      defaultValue,
35748      value,
35749      onChange
35750    });
35751    const groupContextValue = (0,external_wp_element_namespaceObject.useMemo)(() => ({
35752      baseId,
35753      value: selectedValue,
35754      setValue: setSelectedValue,
35755      isBlock: !isAdaptiveWidth,
35756      isDeselectable: true,
35757      size
35758    }), [baseId, selectedValue, setSelectedValue, isAdaptiveWidth, size]);
35759    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(toggle_group_control_context.Provider, {
35760      value: groupContextValue,
35761      children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(component, {
35762        "aria-label": label,
35763        ...otherProps,
35764        ref: forwardedRef,
35765        role: "group",
35766        children: children
35767      })
35768    });
35769  }
35770  const ToggleGroupControlAsButtonGroup = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedToggleGroupControlAsButtonGroup);
35771  
35772  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/toggle-group-control/toggle-group-control/component.js
35773  /**
35774   * External dependencies
35775   */
35776  
35777  
35778  
35779  /**
35780   * WordPress dependencies
35781   */
35782  
35783  
35784  
35785  /**
35786   * Internal dependencies
35787   */
35788  
35789  
35790  
35791  
35792  
35793  
35794  
35795  
35796  
35797  
35798  function UnconnectedToggleGroupControl(props, forwardedRef) {
35799    const {
35800      __nextHasNoMarginBottom = false,
35801      __next40pxDefaultSize = false,
35802      className,
35803      isAdaptiveWidth = false,
35804      isBlock = false,
35805      isDeselectable = false,
35806      label,
35807      hideLabelFromVision = false,
35808      help,
35809      onChange,
35810      size = 'default',
35811      value,
35812      children,
35813      ...otherProps
35814    } = useContextSystem(props, 'ToggleGroupControl');
35815    const baseId = (0,external_wp_compose_namespaceObject.useInstanceId)(ToggleGroupControl, 'toggle-group-control');
35816    const normalizedSize = __next40pxDefaultSize && size === 'default' ? '__unstable-large' : size;
35817    const cx = useCx();
35818    const classes = (0,external_wp_element_namespaceObject.useMemo)(() => cx(toggleGroupControl({
35819      isBlock,
35820      isDeselectable,
35821      size: normalizedSize
35822    }), isBlock && toggle_group_control_styles_block, className), [className, cx, isBlock, isDeselectable, normalizedSize]);
35823    const MainControl = isDeselectable ? ToggleGroupControlAsButtonGroup : ToggleGroupControlAsRadioGroup;
35824    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(base_control, {
35825      help: help,
35826      __nextHasNoMarginBottom: __nextHasNoMarginBottom,
35827      __associatedWPComponentName: "ToggleGroupControl",
35828      children: [!hideLabelFromVision && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(VisualLabelWrapper, {
35829        children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(base_control.VisualLabel, {
35830          children: label
35831        })
35832      }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(MainControl, {
35833        ...otherProps,
35834        className: classes,
35835        isAdaptiveWidth: isAdaptiveWidth,
35836        label: label,
35837        onChange: onChange,
35838        ref: forwardedRef,
35839        size: normalizedSize,
35840        value: value,
35841        children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(LayoutGroup, {
35842          id: baseId,
35843          children: children
35844        })
35845      })]
35846    });
35847  }
35848  
35849  /**
35850   * `ToggleGroupControl` is a form component that lets users choose options
35851   * represented in horizontal segments. To render options for this control use
35852   * `ToggleGroupControlOption` component.
35853   *
35854   * This component is intended for selecting a single persistent value from a set of options,
35855   * similar to a how a radio button group would work. If you simply want a toggle to switch between views,
35856   * use a `TabPanel` instead.
35857   *
35858   * Only use this control when you know for sure the labels of items inside won't
35859   * wrap. For items with longer labels, you can consider a `SelectControl` or a
35860   * `CustomSelectControl` component instead.
35861   *
35862   * ```jsx
35863   * import {
35864   *   __experimentalToggleGroupControl as ToggleGroupControl,
35865   *   __experimentalToggleGroupControlOption as ToggleGroupControlOption,
35866   * } from '@wordpress/components';
35867   *
35868   * function Example() {
35869   *   return (
35870   *     <ToggleGroupControl
35871   *       label="my label"
35872   *       value="vertical"
35873   *       isBlock
35874   *       __nextHasNoMarginBottom
35875   *     >
35876   *       <ToggleGroupControlOption value="horizontal" label="Horizontal" />
35877   *       <ToggleGroupControlOption value="vertical" label="Vertical" />
35878   *     </ToggleGroupControl>
35879   *   );
35880   * }
35881   * ```
35882   */
35883  const ToggleGroupControl = contextConnect(UnconnectedToggleGroupControl, 'ToggleGroupControl');
35884  /* harmony default export */ const toggle_group_control_component = (ToggleGroupControl);
35885  
35886  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/6N3EKIOI.js
35887  "use client";
35888  
35889  
35890  
35891  
35892  
35893  
35894  
35895  // src/radio/radio.tsx
35896  
35897  
35898  var _6N3EKIOI_TagName = "input";
35899  function getIsChecked(value, storeValue) {
35900    if (storeValue === void 0) return;
35901    if (value != null && storeValue != null) {
35902      return storeValue === value;
35903    }
35904    return !!storeValue;
35905  }
35906  function isNativeRadio(tagName, type) {
35907    return tagName === "input" && (!type || type === "radio");
35908  }
35909  var useRadio = createHook(function useRadio2(_a) {
35910    var _b = _a, {
35911      store,
35912      name,
35913      value,
35914      checked
35915    } = _b, props = __objRest(_b, [
35916      "store",
35917      "name",
35918      "value",
35919      "checked"
35920    ]);
35921    const context = useRadioContext();
35922    store = store || context;
35923    const id = useId(props.id);
35924    const ref = (0,external_React_.useRef)(null);
35925    const isChecked = useStoreState(
35926      store,
35927      (state) => checked != null ? checked : getIsChecked(value, state == null ? void 0 : state.value)
35928    );
35929    (0,external_React_.useEffect)(() => {
35930      if (!id) return;
35931      if (!isChecked) return;
35932      const isActiveItem = (store == null ? void 0 : store.getState().activeId) === id;
35933      if (isActiveItem) return;
35934      store == null ? void 0 : store.setActiveId(id);
35935    }, [store, isChecked, id]);
35936    const onChangeProp = props.onChange;
35937    const tagName = useTagName(ref, _6N3EKIOI_TagName);
35938    const nativeRadio = isNativeRadio(tagName, props.type);
35939    const disabled = disabledFromProps(props);
35940    const [propertyUpdated, schedulePropertyUpdate] = useForceUpdate();
35941    (0,external_React_.useEffect)(() => {
35942      const element = ref.current;
35943      if (!element) return;
35944      if (nativeRadio) return;
35945      if (isChecked !== void 0) {
35946        element.checked = isChecked;
35947      }
35948      if (name !== void 0) {
35949        element.name = name;
35950      }
35951      if (value !== void 0) {
35952        element.value = `$value}`;
35953      }
35954    }, [propertyUpdated, nativeRadio, isChecked, name, value]);
35955    const onChange = useEvent((event) => {
35956      if (disabled) {
35957        event.preventDefault();
35958        event.stopPropagation();
35959        return;
35960      }
35961      if (!nativeRadio) {
35962        event.currentTarget.checked = true;
35963        schedulePropertyUpdate();
35964      }
35965      onChangeProp == null ? void 0 : onChangeProp(event);
35966      if (event.defaultPrevented) return;
35967      store == null ? void 0 : store.setValue(value);
35968    });
35969    const onClickProp = props.onClick;
35970    const onClick = useEvent((event) => {
35971      onClickProp == null ? void 0 : onClickProp(event);
35972      if (event.defaultPrevented) return;
35973      if (nativeRadio) return;
35974      onChange(event);
35975    });
35976    const onFocusProp = props.onFocus;
35977    const onFocus = useEvent((event) => {
35978      onFocusProp == null ? void 0 : onFocusProp(event);
35979      if (event.defaultPrevented) return;
35980      if (!nativeRadio) return;
35981      if (!store) return;
35982      const { moves, activeId } = store.getState();
35983      if (!moves) return;
35984      if (id && activeId !== id) return;
35985      onChange(event);
35986    });
35987    props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({
35988      id,
35989      role: !nativeRadio ? "radio" : void 0,
35990      type: nativeRadio ? "radio" : void 0,
35991      "aria-checked": isChecked
35992    }, props), {
35993      ref: useMergeRefs(ref, props.ref),
35994      onChange,
35995      onClick,
35996      onFocus
35997    });
35998    props = useCompositeItem(_3YLGPPWQ_spreadValues({
35999      store,
36000      clickOnEnter: !nativeRadio
36001    }, props));
36002    return removeUndefinedValues(_3YLGPPWQ_spreadValues({
36003      name: nativeRadio ? name : void 0,
36004      value: nativeRadio ? value : void 0,
36005      checked: isChecked
36006    }, props));
36007  });
36008  var Radio = memo2(
36009    forwardRef2(function Radio2(props) {
36010      const htmlProps = useRadio(props);
36011      return HKOOKEDE_createElement(_6N3EKIOI_TagName, htmlProps);
36012    })
36013  );
36014  
36015  
36016  
36017  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/toggle-group-control/toggle-group-control-option-base/styles.js
36018  
36019  function toggle_group_control_option_base_styles_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)."; }
36020  /**
36021   * External dependencies
36022   */
36023  
36024  /**
36025   * Internal dependencies
36026   */
36027  
36028  const LabelView = /*#__PURE__*/emotion_styled_base_browser_esm("div",  true ? {
36029    target: "et6ln9s1"
36030  } : 0)( true ? {
36031    name: "sln1fl",
36032    styles: "display:inline-flex;max-width:100%;min-width:0;position:relative"
36033  } : 0);
36034  const labelBlock =  true ? {
36035    name: "82a6rk",
36036    styles: "flex:1"
36037  } : 0;
36038  const buttonView = ({
36039    isDeselectable,
36040    isIcon,
36041    isPressed,
36042    size
36043  }) => /*#__PURE__*/emotion_react_browser_esm_css("align-items:center;appearance:none;background:transparent;border:none;border-radius:", config_values.radiusXSmall, ";color:", COLORS.gray[700], ";fill:currentColor;cursor:pointer;display:flex;font-family:inherit;height:100%;justify-content:center;line-height:100%;outline:none;padding:0 12px;position:relative;text-align:center;@media not ( prefers-reduced-motion ){transition:background ", config_values.transitionDurationFast, " linear,color ", config_values.transitionDurationFast, " linear,font-weight 60ms linear;}user-select:none;width:100%;z-index:2;&::-moz-focus-inner{border:0;}&[disabled]{opacity:0.4;cursor:default;}&:active{background:", config_values.controlBackgroundColor, ";}", isDeselectable && deselectable, " ", isIcon && isIconStyles({
36044    size
36045  }), " ", isPressed && pressed, ";" + ( true ? "" : 0),  true ? "" : 0);
36046  const pressed = /*#__PURE__*/emotion_react_browser_esm_css("color:", COLORS.white, ";&:active{background:transparent;}" + ( true ? "" : 0),  true ? "" : 0);
36047  const deselectable = /*#__PURE__*/emotion_react_browser_esm_css("color:", COLORS.gray[900], ";&:focus{box-shadow:inset 0 0 0 1px ", COLORS.white, ",0 0 0 ", config_values.borderWidthFocus, " ", COLORS.theme.accent, ";outline:2px solid transparent;}" + ( true ? "" : 0),  true ? "" : 0);
36048  const ButtonContentView = /*#__PURE__*/emotion_styled_base_browser_esm("div",  true ? {
36049    target: "et6ln9s0"
36050  } : 0)("display:flex;font-size:", config_values.fontSize, ";line-height:1;" + ( true ? "" : 0));
36051  const isIconStyles = ({
36052    size = 'default'
36053  }) => {
36054    const iconButtonSizes = {
36055      default: '30px',
36056      '__unstable-large': '32px'
36057    };
36058    return /*#__PURE__*/emotion_react_browser_esm_css("color:", COLORS.gray[900], ";height:", iconButtonSizes[size], ";aspect-ratio:1;padding-left:0;padding-right:0;" + ( true ? "" : 0),  true ? "" : 0);
36059  };
36060  const backdropView = /*#__PURE__*/emotion_react_browser_esm_css("background:", COLORS.gray[900], ";border-radius:", config_values.radiusXSmall, ";position:absolute;inset:0;z-index:1;outline:2px solid transparent;outline-offset:-3px;" + ( true ? "" : 0),  true ? "" : 0);
36061  
36062  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/toggle-group-control/toggle-group-control-option-base/component.js
36063  /**
36064   * External dependencies
36065   */
36066  
36067  
36068  
36069  
36070  /**
36071   * WordPress dependencies
36072   */
36073  
36074  
36075  
36076  /**
36077   * Internal dependencies
36078   */
36079  
36080  
36081  
36082  
36083  
36084  
36085  
36086  
36087  
36088  const {
36089    ButtonContentView: component_ButtonContentView,
36090    LabelView: component_LabelView
36091  } = toggle_group_control_option_base_styles_namespaceObject;
36092  const REDUCED_MOTION_TRANSITION_CONFIG = {
36093    duration: 0
36094  };
36095  const LAYOUT_ID = 'toggle-group-backdrop-shared-layout-id';
36096  const WithToolTip = ({
36097    showTooltip,
36098    text,
36099    children
36100  }) => {
36101    if (showTooltip && text) {
36102      return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(tooltip, {
36103        text: text,
36104        placement: "top",
36105        children: children
36106      });
36107    }
36108    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_ReactJSXRuntime_namespaceObject.Fragment, {
36109      children: children
36110    });
36111  };
36112  function ToggleGroupControlOptionBase(props, forwardedRef) {
36113    const shouldReduceMotion = (0,external_wp_compose_namespaceObject.useReducedMotion)();
36114    const toggleGroupControlContext = useToggleGroupControlContext();
36115    const id = (0,external_wp_compose_namespaceObject.useInstanceId)(ToggleGroupControlOptionBase, toggleGroupControlContext.baseId || 'toggle-group-control-option-base');
36116    const buttonProps = useContextSystem({
36117      ...props,
36118      id
36119    }, 'ToggleGroupControlOptionBase');
36120    const {
36121      isBlock = false,
36122      isDeselectable = false,
36123      size = 'default'
36124    } = toggleGroupControlContext;
36125    const {
36126      className,
36127      isIcon = false,
36128      value,
36129      children,
36130      showTooltip = false,
36131      disabled,
36132      ...otherButtonProps
36133    } = buttonProps;
36134    const isPressed = toggleGroupControlContext.value === value;
36135    const cx = useCx();
36136    const labelViewClasses = (0,external_wp_element_namespaceObject.useMemo)(() => cx(isBlock && labelBlock), [cx, isBlock]);
36137    const itemClasses = (0,external_wp_element_namespaceObject.useMemo)(() => cx(buttonView({
36138      isDeselectable,
36139      isIcon,
36140      isPressed,
36141      size
36142    }), className), [cx, isDeselectable, isIcon, isPressed, size, className]);
36143    const backdropClasses = (0,external_wp_element_namespaceObject.useMemo)(() => cx(backdropView), [cx]);
36144    const buttonOnClick = () => {
36145      if (isDeselectable && isPressed) {
36146        toggleGroupControlContext.setValue(undefined);
36147      } else {
36148        toggleGroupControlContext.setValue(value);
36149      }
36150    };
36151    const commonProps = {
36152      ...otherButtonProps,
36153      className: itemClasses,
36154      'data-value': value,
36155      ref: forwardedRef
36156    };
36157    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(component_LabelView, {
36158      className: labelViewClasses,
36159      children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(WithToolTip, {
36160        showTooltip: showTooltip,
36161        text: otherButtonProps['aria-label'],
36162        children: isDeselectable ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("button", {
36163          ...commonProps,
36164          disabled: disabled,
36165          "aria-pressed": isPressed,
36166          type: "button",
36167          onClick: buttonOnClick,
36168          children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(component_ButtonContentView, {
36169            children: children
36170          })
36171        }) : /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Radio, {
36172          disabled: disabled,
36173          onFocusVisible: () => {
36174            const selectedValueIsEmpty = toggleGroupControlContext.value === null || toggleGroupControlContext.value === '';
36175  
36176            // Conditions ensure that the first visible focus to a radio group
36177            // without a selected option will not automatically select the option.
36178            if (!selectedValueIsEmpty || toggleGroupControlContext.activeItemIsNotFirstItem?.()) {
36179              toggleGroupControlContext.setValue(value);
36180            }
36181          },
36182          render: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("button", {
36183            type: "button",
36184            ...commonProps
36185          }),
36186          value: value,
36187          children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(component_ButtonContentView, {
36188            children: children
36189          })
36190        })
36191      }), isPressed ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(motion.div, {
36192        layout: true,
36193        layoutRoot: true,
36194        children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(motion.div, {
36195          className: backdropClasses,
36196          transition: shouldReduceMotion ? REDUCED_MOTION_TRANSITION_CONFIG : undefined,
36197          role: "presentation",
36198          layoutId: LAYOUT_ID
36199        })
36200      }) : null]
36201    });
36202  }
36203  
36204  /**
36205   * `ToggleGroupControlOptionBase` is a form component and is meant to be used as an internal,
36206   * generic component for any children of `ToggleGroupControl`.
36207   *
36208   * @example
36209   * ```jsx
36210   * import {
36211   *   __experimentalToggleGroupControl as ToggleGroupControl,
36212   *   __experimentalToggleGroupControlOptionBase as ToggleGroupControlOptionBase,
36213   * } from '@wordpress/components';
36214   *
36215   * function Example() {
36216   *   return (
36217   *     <ToggleGroupControl label="my label" value="vertical" isBlock>
36218   *       <ToggleGroupControlOption value="horizontal" label="Horizontal" />
36219   *       <ToggleGroupControlOption value="vertical" label="Vertical" />
36220   *     </ToggleGroupControl>
36221   *   );
36222   * }
36223   * ```
36224   */
36225  const ConnectedToggleGroupControlOptionBase = contextConnect(ToggleGroupControlOptionBase, 'ToggleGroupControlOptionBase');
36226  /* harmony default export */ const toggle_group_control_option_base_component = (ConnectedToggleGroupControlOptionBase);
36227  
36228  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/toggle-group-control/toggle-group-control-option-icon/component.js
36229  /**
36230   * External dependencies
36231   */
36232  
36233  /**
36234   * WordPress dependencies
36235   */
36236  
36237  
36238  /**
36239   * Internal dependencies
36240   */
36241  
36242  
36243  
36244  
36245  function UnforwardedToggleGroupControlOptionIcon(props, ref) {
36246    const {
36247      icon,
36248      label,
36249      ...restProps
36250    } = props;
36251    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(toggle_group_control_option_base_component, {
36252      ...restProps,
36253      isIcon: true,
36254      "aria-label": label,
36255      showTooltip: true,
36256      ref: ref,
36257      children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_icon, {
36258        icon: icon
36259      })
36260    });
36261  }
36262  
36263  /**
36264   * `ToggleGroupControlOptionIcon` is a form component which is meant to be used as a
36265   * child of `ToggleGroupControl` and displays an icon.
36266   *
36267   * ```jsx
36268   *
36269   * import {
36270   *    __experimentalToggleGroupControl as ToggleGroupControl,
36271   *    __experimentalToggleGroupControlOptionIcon as ToggleGroupControlOptionIcon,
36272   * from '@wordpress/components';
36273   * import { formatLowercase, formatUppercase } from '@wordpress/icons';
36274   *
36275   * function Example() {
36276   *  return (
36277   *    <ToggleGroupControl __nextHasNoMarginBottom>
36278   *      <ToggleGroupControlOptionIcon
36279   *        value="uppercase"
36280   *        label="Uppercase"
36281   *        icon={ formatUppercase }
36282   *      />
36283   *      <ToggleGroupControlOptionIcon
36284   *        value="lowercase"
36285   *        label="Lowercase"
36286   *        icon={ formatLowercase }
36287   *      />
36288   *    </ToggleGroupControl>
36289   *  );
36290   * }
36291   * ```
36292   */
36293  const ToggleGroupControlOptionIcon = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedToggleGroupControlOptionIcon);
36294  /* harmony default export */ const toggle_group_control_option_icon_component = (ToggleGroupControlOptionIcon);
36295  
36296  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/border-control/border-control-style-picker/component.js
36297  /**
36298   * WordPress dependencies
36299   */
36300  
36301  
36302  
36303  /**
36304   * Internal dependencies
36305   */
36306  
36307  
36308  
36309  const BORDER_STYLES = [{
36310    label: (0,external_wp_i18n_namespaceObject.__)('Solid'),
36311    icon: line_solid,
36312    value: 'solid'
36313  }, {
36314    label: (0,external_wp_i18n_namespaceObject.__)('Dashed'),
36315    icon: line_dashed,
36316    value: 'dashed'
36317  }, {
36318    label: (0,external_wp_i18n_namespaceObject.__)('Dotted'),
36319    icon: line_dotted,
36320    value: 'dotted'
36321  }];
36322  function UnconnectedBorderControlStylePicker({
36323    onChange,
36324    ...restProps
36325  }, forwardedRef) {
36326    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(toggle_group_control_component, {
36327      __nextHasNoMarginBottom: true,
36328      __next40pxDefaultSize: true,
36329      ref: forwardedRef,
36330      isDeselectable: true,
36331      onChange: value => {
36332        onChange?.(value);
36333      },
36334      ...restProps,
36335      children: BORDER_STYLES.map(borderStyle => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(toggle_group_control_option_icon_component, {
36336        value: borderStyle.value,
36337        icon: borderStyle.icon,
36338        label: borderStyle.label
36339      }, borderStyle.value))
36340    });
36341  }
36342  const BorderControlStylePicker = contextConnect(UnconnectedBorderControlStylePicker, 'BorderControlStylePicker');
36343  /* harmony default export */ const border_control_style_picker_component = (BorderControlStylePicker);
36344  
36345  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/color-indicator/index.js
36346  /**
36347   * External dependencies
36348   */
36349  
36350  /**
36351   * WordPress dependencies
36352   */
36353  
36354  
36355  /**
36356   * Internal dependencies
36357   */
36358  
36359  function UnforwardedColorIndicator(props, forwardedRef) {
36360    const {
36361      className,
36362      colorValue,
36363      ...additionalProps
36364    } = props;
36365    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", {
36366      className: dist_clsx('component-color-indicator', className),
36367      style: {
36368        background: colorValue
36369      },
36370      ref: forwardedRef,
36371      ...additionalProps
36372    });
36373  }
36374  
36375  /**
36376   * ColorIndicator is a React component that renders a specific color in a
36377   * circle. It's often used to summarize a collection of used colors in a child
36378   * component.
36379   *
36380   * ```jsx
36381   * import { ColorIndicator } from '@wordpress/components';
36382   *
36383   * const MyColorIndicator = () => <ColorIndicator colorValue="#0073aa" />;
36384   * ```
36385   */
36386  const ColorIndicator = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedColorIndicator);
36387  /* harmony default export */ const color_indicator = (ColorIndicator);
36388  
36389  ;// CONCATENATED MODULE: ./node_modules/colord/plugins/a11y.mjs
36390  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}}
36391  
36392  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/dropdown/index.js
36393  /**
36394   * External dependencies
36395   */
36396  
36397  /**
36398   * WordPress dependencies
36399   */
36400  
36401  
36402  
36403  
36404  /**
36405   * Internal dependencies
36406   */
36407  
36408  
36409  
36410  
36411  
36412  const UnconnectedDropdown = (props, forwardedRef) => {
36413    const {
36414      renderContent,
36415      renderToggle,
36416      className,
36417      contentClassName,
36418      expandOnMobile,
36419      headerTitle,
36420      focusOnMount,
36421      popoverProps,
36422      onClose,
36423      onToggle,
36424      style,
36425      open,
36426      defaultOpen,
36427      // Deprecated props
36428      position,
36429      // From context system
36430      variant
36431    } = useContextSystem(props, 'Dropdown');
36432    if (position !== undefined) {
36433      external_wp_deprecated_default()('`position` prop in wp.components.Dropdown', {
36434        since: '6.2',
36435        alternative: '`popoverProps.placement` prop',
36436        hint: 'Note that the `position` prop will override any values passed through the `popoverProps.placement` prop.'
36437      });
36438    }
36439  
36440    // Use internal state instead of a ref to make sure that the component
36441    // re-renders when the popover's anchor updates.
36442    const [fallbackPopoverAnchor, setFallbackPopoverAnchor] = (0,external_wp_element_namespaceObject.useState)(null);
36443    const containerRef = (0,external_wp_element_namespaceObject.useRef)();
36444    const [isOpen, setIsOpen] = useControlledValue({
36445      defaultValue: defaultOpen,
36446      value: open,
36447      onChange: onToggle
36448    });
36449  
36450    /**
36451     * Closes the popover when focus leaves it unless the toggle was pressed or
36452     * focus has moved to a separate dialog. The former is to let the toggle
36453     * handle closing the popover and the latter is to preserve presence in
36454     * case a dialog has opened, allowing focus to return when it's dismissed.
36455     */
36456    function closeIfFocusOutside() {
36457      if (!containerRef.current) {
36458        return;
36459      }
36460      const {
36461        ownerDocument
36462      } = containerRef.current;
36463      const dialog = ownerDocument?.activeElement?.closest('[role="dialog"]');
36464      if (!containerRef.current.contains(ownerDocument.activeElement) && (!dialog || dialog.contains(containerRef.current))) {
36465        close();
36466      }
36467    }
36468    function close() {
36469      onClose?.();
36470      setIsOpen(false);
36471    }
36472    const args = {
36473      isOpen: !!isOpen,
36474      onToggle: () => setIsOpen(!isOpen),
36475      onClose: close
36476    };
36477    const popoverPropsHaveAnchor = !!popoverProps?.anchor ||
36478    // Note: `anchorRef`, `getAnchorRect` and `anchorRect` are deprecated and
36479    // be removed from `Popover` from WordPress 6.3
36480    !!popoverProps?.anchorRef || !!popoverProps?.getAnchorRect || !!popoverProps?.anchorRect;
36481    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", {
36482      className: className,
36483      ref: (0,external_wp_compose_namespaceObject.useMergeRefs)([containerRef, forwardedRef, setFallbackPopoverAnchor])
36484      // Some UAs focus the closest focusable parent when the toggle is
36485      // clicked. Making this div focusable ensures such UAs will focus
36486      // it and `closeIfFocusOutside` can tell if the toggle was clicked.
36487      ,
36488      tabIndex: -1,
36489      style: style,
36490      children: [renderToggle(args), isOpen && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(popover, {
36491        position: position,
36492        onClose: close,
36493        onFocusOutside: closeIfFocusOutside,
36494        expandOnMobile: expandOnMobile,
36495        headerTitle: headerTitle,
36496        focusOnMount: focusOnMount
36497        // This value is used to ensure that the dropdowns
36498        // align with the editor header by default.
36499        ,
36500        offset: 13,
36501        anchor: !popoverPropsHaveAnchor ? fallbackPopoverAnchor : undefined,
36502        variant: variant,
36503        ...popoverProps,
36504        className: dist_clsx('components-dropdown__content', popoverProps?.className, contentClassName),
36505        children: renderContent(args)
36506      })]
36507    });
36508  };
36509  
36510  /**
36511   * Renders a button that opens a floating content modal when clicked.
36512   *
36513   * ```jsx
36514   * import { Button, Dropdown } from '@wordpress/components';
36515   *
36516   * const MyDropdown = () => (
36517   *   <Dropdown
36518   *     className="my-container-class-name"
36519   *     contentClassName="my-dropdown-content-classname"
36520   *     popoverProps={ { placement: 'bottom-start' } }
36521   *     renderToggle={ ( { isOpen, onToggle } ) => (
36522   *       <Button
36523   *         variant="primary"
36524   *         onClick={ onToggle }
36525   *         aria-expanded={ isOpen }
36526   *       >
36527   *         Toggle Dropdown!
36528   *       </Button>
36529   *     ) }
36530   *     renderContent={ () => <div>This is the content of the dropdown.</div> }
36531   *   />
36532   * );
36533   * ```
36534   */
36535  const Dropdown = contextConnect(UnconnectedDropdown, 'Dropdown');
36536  /* harmony default export */ const dropdown = (Dropdown);
36537  
36538  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/input-control/input-suffix-wrapper.js
36539  /**
36540   * External dependencies
36541   */
36542  
36543  /**
36544   * Internal dependencies
36545   */
36546  
36547  
36548  
36549  
36550  function UnconnectedInputControlSuffixWrapper(props, forwardedRef) {
36551    const derivedProps = useContextSystem(props, 'InputControlSuffixWrapper');
36552    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(PrefixSuffixWrapper, {
36553      ...derivedProps,
36554      ref: forwardedRef
36555    });
36556  }
36557  
36558  /**
36559   * A convenience wrapper for the `suffix` when you want to apply
36560   * standard padding in accordance with the size variant.
36561   *
36562   * ```jsx
36563   * import {
36564   *   __experimentalInputControl as InputControl,
36565   *   __experimentalInputControlSuffixWrapper as InputControlSuffixWrapper,
36566   * } from '@wordpress/components';
36567   *
36568   * <InputControl
36569   *   suffix={<InputControlSuffixWrapper>%</InputControlSuffixWrapper>}
36570   * />
36571   * ```
36572   */
36573  const InputControlSuffixWrapper = contextConnect(UnconnectedInputControlSuffixWrapper, 'InputControlSuffixWrapper');
36574  /* harmony default export */ const input_suffix_wrapper = (InputControlSuffixWrapper);
36575  
36576  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/select-control/styles/select-control-styles.js
36577  
36578  function select_control_styles_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)."; }
36579  /**
36580   * External dependencies
36581   */
36582  
36583  /**
36584   * Internal dependencies
36585   */
36586  
36587  
36588  
36589  
36590  
36591  const select_control_styles_disabledStyles = ({
36592    disabled
36593  }) => {
36594    if (!disabled) {
36595      return '';
36596    }
36597    return /*#__PURE__*/emotion_react_browser_esm_css("color:", COLORS.ui.textDisabled, ";cursor:default;" + ( true ? "" : 0),  true ? "" : 0);
36598  };
36599  var select_control_styles_ref2 =  true ? {
36600    name: "1lv1yo7",
36601    styles: "display:inline-flex"
36602  } : 0;
36603  const inputBaseVariantStyles = ({
36604    variant
36605  }) => {
36606    if (variant === 'minimal') {
36607      return select_control_styles_ref2;
36608    }
36609    return '';
36610  };
36611  const StyledInputBase = /*#__PURE__*/emotion_styled_base_browser_esm(input_base,  true ? {
36612    target: "e1mv6sxx3"
36613  } : 0)("color:", COLORS.theme.foreground, ";cursor:pointer;", select_control_styles_disabledStyles, " ", inputBaseVariantStyles, ";" + ( true ? "" : 0));
36614  const select_control_styles_sizeStyles = ({
36615    __next40pxDefaultSize,
36616    multiple,
36617    selectSize = 'default'
36618  }) => {
36619    if (multiple) {
36620      // When `multiple`, just use the native browser styles
36621      // without setting explicit height.
36622      return;
36623    }
36624    const sizes = {
36625      default: {
36626        height: 40,
36627        minHeight: 40,
36628        paddingTop: 0,
36629        paddingBottom: 0
36630      },
36631      small: {
36632        height: 24,
36633        minHeight: 24,
36634        paddingTop: 0,
36635        paddingBottom: 0
36636      },
36637      compact: {
36638        height: 32,
36639        minHeight: 32,
36640        paddingTop: 0,
36641        paddingBottom: 0
36642      },
36643      '__unstable-large': {
36644        height: 40,
36645        minHeight: 40,
36646        paddingTop: 0,
36647        paddingBottom: 0
36648      }
36649    };
36650    if (!__next40pxDefaultSize) {
36651      sizes.default = sizes.compact;
36652    }
36653    const style = sizes[selectSize] || sizes.default;
36654    return /*#__PURE__*/emotion_react_browser_esm_css(style,  true ? "" : 0,  true ? "" : 0);
36655  };
36656  const chevronIconSize = 18;
36657  const sizePaddings = ({
36658    __next40pxDefaultSize,
36659    multiple,
36660    selectSize = 'default'
36661  }) => {
36662    const padding = {
36663      default: config_values.controlPaddingX,
36664      small: config_values.controlPaddingXSmall,
36665      compact: config_values.controlPaddingXSmall,
36666      '__unstable-large': config_values.controlPaddingX
36667    };
36668    if (!__next40pxDefaultSize) {
36669      padding.default = padding.compact;
36670    }
36671    const selectedPadding = padding[selectSize] || padding.default;
36672    return rtl({
36673      paddingLeft: selectedPadding,
36674      paddingRight: selectedPadding + chevronIconSize,
36675      ...(multiple ? {
36676        paddingTop: selectedPadding,
36677        paddingBottom: selectedPadding
36678      } : {})
36679    });
36680  };
36681  const overflowStyles = ({
36682    multiple
36683  }) => {
36684    return {
36685      overflow: multiple ? 'auto' : 'hidden'
36686    };
36687  };
36688  var select_control_styles_ref =  true ? {
36689    name: "n1jncc",
36690    styles: "field-sizing:content"
36691  } : 0;
36692  const variantStyles = ({
36693    variant
36694  }) => {
36695    if (variant === 'minimal') {
36696      return select_control_styles_ref;
36697    }
36698    return '';
36699  };
36700  
36701  // TODO: Resolve need to use &&& to increase specificity
36702  // https://github.com/WordPress/gutenberg/issues/18483
36703  
36704  const Select = /*#__PURE__*/emotion_styled_base_browser_esm("select",  true ? {
36705    target: "e1mv6sxx2"
36706  } : 0)("&&&{appearance:none;background:transparent;box-sizing:border-box;border:none;box-shadow:none!important;color:currentColor;cursor:inherit;display:block;font-family:inherit;margin:0;width:100%;max-width:none;white-space:nowrap;text-overflow:ellipsis;", fontSizeStyles, ";", select_control_styles_sizeStyles, ";", sizePaddings, ";", overflowStyles, " ", variantStyles, ";}" + ( true ? "" : 0));
36707  const DownArrowWrapper = /*#__PURE__*/emotion_styled_base_browser_esm("div",  true ? {
36708    target: "e1mv6sxx1"
36709  } : 0)("margin-inline-end:", space(-1), ";line-height:0;path{fill:currentColor;}" + ( true ? "" : 0));
36710  const InputControlSuffixWrapperWithClickThrough = /*#__PURE__*/emotion_styled_base_browser_esm(input_suffix_wrapper,  true ? {
36711    target: "e1mv6sxx0"
36712  } : 0)("position:absolute;pointer-events:none;", rtl({
36713    right: 0
36714  }), ";" + ( true ? "" : 0));
36715  
36716  ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/icon/index.js
36717  /**
36718   * WordPress dependencies
36719   */
36720  
36721  
36722  /** @typedef {{icon: JSX.Element, size?: number} & import('@wordpress/primitives').SVGProps} IconProps */
36723  
36724  /**
36725   * Return an SVG icon.
36726   *
36727   * @param {IconProps}                                 props icon is the SVG component to render
36728   *                                                          size is a number specifiying the icon size in pixels
36729   *                                                          Other props will be passed to wrapped SVG component
36730   * @param {import('react').ForwardedRef<HTMLElement>} ref   The forwarded ref to the SVG element.
36731   *
36732   * @return {JSX.Element}  Icon component
36733   */
36734  function icon_Icon({
36735    icon,
36736    size = 24,
36737    ...props
36738  }, ref) {
36739    return (0,external_wp_element_namespaceObject.cloneElement)(icon, {
36740      width: size,
36741      height: size,
36742      ...props,
36743      ref
36744    });
36745  }
36746  /* harmony default export */ const icons_build_module_icon = ((0,external_wp_element_namespaceObject.forwardRef)(icon_Icon));
36747  
36748  ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/chevron-down.js
36749  /**
36750   * WordPress dependencies
36751   */
36752  
36753  
36754  const chevronDown = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, {
36755    viewBox: "0 0 24 24",
36756    xmlns: "http://www.w3.org/2000/svg",
36757    children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, {
36758      d: "M17.5 11.6L12 16l-5.5-4.4.9-1.2L12 14l4.5-3.6 1 1.2z"
36759    })
36760  });
36761  /* harmony default export */ const chevron_down = (chevronDown);
36762  
36763  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/select-control/chevron-down.js
36764  /**
36765   * WordPress dependencies
36766   */
36767  
36768  
36769  /**
36770   * Internal dependencies
36771   */
36772  
36773  
36774  const SelectControlChevronDown = () => {
36775    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(InputControlSuffixWrapperWithClickThrough, {
36776      children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(DownArrowWrapper, {
36777        children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(icons_build_module_icon, {
36778          icon: chevron_down,
36779          size: chevronIconSize
36780        })
36781      })
36782    });
36783  };
36784  /* harmony default export */ const select_control_chevron_down = (SelectControlChevronDown);
36785  
36786  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/select-control/index.js
36787  /**
36788   * External dependencies
36789   */
36790  
36791  
36792  /**
36793   * WordPress dependencies
36794   */
36795  
36796  
36797  
36798  /**
36799   * Internal dependencies
36800   */
36801  
36802  
36803  
36804  
36805  
36806  function select_control_useUniqueId(idProp) {
36807    const instanceId = (0,external_wp_compose_namespaceObject.useInstanceId)(SelectControl);
36808    const id = `inspector-select-control-$instanceId}`;
36809    return idProp || id;
36810  }
36811  function SelectOptions({
36812    options
36813  }) {
36814    return options.map(({
36815      id,
36816      label,
36817      value,
36818      ...optionProps
36819    }, index) => {
36820      const key = id || `$label}-$value}-$index}`;
36821      return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("option", {
36822        value: value,
36823        ...optionProps,
36824        children: label
36825      }, key);
36826    });
36827  }
36828  function UnforwardedSelectControl(props, ref) {
36829    const {
36830      className,
36831      disabled = false,
36832      help,
36833      hideLabelFromVision,
36834      id: idProp,
36835      label,
36836      multiple = false,
36837      onChange,
36838      options = [],
36839      size = 'default',
36840      value: valueProp,
36841      labelPosition = 'top',
36842      children,
36843      prefix,
36844      suffix,
36845      variant = 'default',
36846      __next40pxDefaultSize = false,
36847      __nextHasNoMarginBottom = false,
36848      ...restProps
36849    } = useDeprecated36pxDefaultSizeProp(props);
36850    const id = select_control_useUniqueId(idProp);
36851    const helpId = help ? `$id}__help` : undefined;
36852  
36853    // Disable reason: A select with an onchange throws a warning.
36854    if (!options?.length && !children) {
36855      return null;
36856    }
36857    const handleOnChange = event => {
36858      if (props.multiple) {
36859        const selectedOptions = Array.from(event.target.options).filter(({
36860          selected
36861        }) => selected);
36862        const newValues = selectedOptions.map(({
36863          value
36864        }) => value);
36865        props.onChange?.(newValues, {
36866          event
36867        });
36868        return;
36869      }
36870      props.onChange?.(event.target.value, {
36871        event
36872      });
36873    };
36874    const classes = dist_clsx('components-select-control', className);
36875    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(base_control, {
36876      help: help,
36877      id: id,
36878      __nextHasNoMarginBottom: __nextHasNoMarginBottom,
36879      __associatedWPComponentName: "SelectControl",
36880      children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(StyledInputBase, {
36881        className: classes,
36882        disabled: disabled,
36883        hideLabelFromVision: hideLabelFromVision,
36884        id: id,
36885        isBorderless: variant === 'minimal',
36886        label: label,
36887        size: size,
36888        suffix: suffix || !multiple && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(select_control_chevron_down, {}),
36889        prefix: prefix,
36890        labelPosition: labelPosition,
36891        __unstableInputWidth: variant === 'minimal' ? 'auto' : undefined,
36892        variant: variant,
36893        __next40pxDefaultSize: __next40pxDefaultSize,
36894        children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Select, {
36895          ...restProps,
36896          __next40pxDefaultSize: __next40pxDefaultSize,
36897          "aria-describedby": helpId,
36898          className: "components-select-control__input",
36899          disabled: disabled,
36900          id: id,
36901          multiple: multiple,
36902          onChange: handleOnChange,
36903          ref: ref,
36904          selectSize: size,
36905          value: valueProp,
36906          variant: variant,
36907          children: children || /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(SelectOptions, {
36908            options: options
36909          })
36910        })
36911      })
36912    });
36913  }
36914  
36915  /**
36916   * `SelectControl` allows users to select from a single or multiple option menu.
36917   * It functions as a wrapper around the browser's native `<select>` element.
36918   *
36919   * ```jsx
36920   * import { SelectControl } from '@wordpress/components';
36921   * import { useState } from '@wordpress/element';
36922   *
36923   * const MySelectControl = () => {
36924   *   const [ size, setSize ] = useState( '50%' );
36925   *
36926   *   return (
36927   *     <SelectControl
36928   *       __nextHasNoMarginBottom
36929   *       label="Size"
36930   *       value={ size }
36931   *       options={ [
36932   *         { label: 'Big', value: '100%' },
36933   *         { label: 'Medium', value: '50%' },
36934   *         { label: 'Small', value: '25%' },
36935   *       ] }
36936   *       onChange={ setSize }
36937   *     />
36938   *   );
36939   * };
36940   * ```
36941   */
36942  const SelectControl = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedSelectControl);
36943  /* harmony default export */ const select_control = (SelectControl);
36944  
36945  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/utils/hooks/use-controlled-state.js
36946  /**
36947   * WordPress dependencies
36948   */
36949  
36950  
36951  /**
36952   * Internal dependencies
36953   */
36954  
36955  
36956  /**
36957   * @template T
36958   * @typedef Options
36959   * @property {T}      [initial] Initial value
36960   * @property {T | ""} fallback  Fallback value
36961   */
36962  
36963  /** @type {Readonly<{ initial: undefined, fallback: '' }>} */
36964  const defaultOptions = {
36965    initial: undefined,
36966    /**
36967     * Defaults to empty string, as that is preferred for usage with
36968     * <input />, <textarea />, and <select /> form elements.
36969     */
36970    fallback: ''
36971  };
36972  
36973  /**
36974   * Custom hooks for "controlled" components to track and consolidate internal
36975   * state and incoming values. This is useful for components that render
36976   * `input`, `textarea`, or `select` HTML elements.
36977   *
36978   * https://reactjs.org/docs/forms.html#controlled-components
36979   *
36980   * At first, a component using useControlledState receives an initial prop
36981   * value, which is used as initial internal state.
36982   *
36983   * This internal state can be maintained and updated without
36984   * relying on new incoming prop values.
36985   *
36986   * Unlike the basic useState hook, useControlledState's state can
36987   * be updated if a new incoming prop value is changed.
36988   *
36989   * @template T
36990   *
36991   * @param {T | undefined} currentState             The current value.
36992   * @param {Options<T>}    [options=defaultOptions] Additional options for the hook.
36993   *
36994   * @return {[T | "", (nextState: T) => void]} The controlled value and the value setter.
36995   */
36996  function useControlledState(currentState, options = defaultOptions) {
36997    const {
36998      initial,
36999      fallback
37000    } = {
37001      ...defaultOptions,
37002      ...options
37003    };
37004    const [internalState, setInternalState] = (0,external_wp_element_namespaceObject.useState)(currentState);
37005    const hasCurrentState = isValueDefined(currentState);
37006  
37007    /*
37008     * Resets internal state if value every changes from uncontrolled <-> controlled.
37009     */
37010    (0,external_wp_element_namespaceObject.useEffect)(() => {
37011      if (hasCurrentState && internalState) {
37012        setInternalState(undefined);
37013      }
37014    }, [hasCurrentState, internalState]);
37015    const state = getDefinedValue([currentState, internalState, initial], fallback);
37016  
37017    /* eslint-disable jsdoc/no-undefined-types */
37018    /** @type {(nextState: T) => void} */
37019    const setState = (0,external_wp_element_namespaceObject.useCallback)(nextState => {
37020      if (!hasCurrentState) {
37021        setInternalState(nextState);
37022      }
37023    }, [hasCurrentState]);
37024    /* eslint-enable jsdoc/no-undefined-types */
37025  
37026    return [state, setState];
37027  }
37028  /* harmony default export */ const use_controlled_state = (useControlledState);
37029  
37030  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/range-control/utils.js
37031  /**
37032   * WordPress dependencies
37033   */
37034  
37035  
37036  /**
37037   * Internal dependencies
37038   */
37039  
37040  
37041  /**
37042   * A float supported clamp function for a specific value.
37043   *
37044   * @param value The value to clamp.
37045   * @param min   The minimum value.
37046   * @param max   The maximum value.
37047   *
37048   * @return A (float) number
37049   */
37050  function floatClamp(value, min, max) {
37051    if (typeof value !== 'number') {
37052      return null;
37053    }
37054    return parseFloat(`$math_clamp(value, min, max)}`);
37055  }
37056  
37057  /**
37058   * Hook to store a clamped value, derived from props.
37059   *
37060   * @param settings
37061   * @return The controlled value and the value setter.
37062   */
37063  function useControlledRangeValue(settings) {
37064    const {
37065      min,
37066      max,
37067      value: valueProp,
37068      initial
37069    } = settings;
37070    const [state, setInternalState] = use_controlled_state(floatClamp(valueProp, min, max), {
37071      initial: floatClamp(initial !== null && initial !== void 0 ? initial : null, min, max),
37072      fallback: null
37073    });
37074    const setState = (0,external_wp_element_namespaceObject.useCallback)(nextValue => {
37075      if (nextValue === null) {
37076        setInternalState(null);
37077      } else {
37078        setInternalState(floatClamp(nextValue, min, max));
37079      }
37080    }, [min, max, setInternalState]);
37081  
37082    // `state` can't be an empty string because we specified a fallback value of
37083    // `null` in `useControlledState`
37084    return [state, setState];
37085  }
37086  
37087  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/range-control/styles/range-control-styles.js
37088  
37089  function range_control_styles_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)."; }
37090  /**
37091   * External dependencies
37092   */
37093  
37094  /**
37095   * Internal dependencies
37096   */
37097  
37098  
37099  
37100  const rangeHeightValue = 30;
37101  const railHeight = 4;
37102  const rangeHeight = () => /*#__PURE__*/emotion_react_browser_esm_css({
37103    height: rangeHeightValue,
37104    minHeight: rangeHeightValue
37105  },  true ? "" : 0,  true ? "" : 0);
37106  const thumbSize = 12;
37107  const deprecatedHeight = ({
37108    __next40pxDefaultSize
37109  }) => !__next40pxDefaultSize && /*#__PURE__*/emotion_react_browser_esm_css({
37110    minHeight: rangeHeightValue
37111  },  true ? "" : 0,  true ? "" : 0);
37112  const range_control_styles_Root = /*#__PURE__*/emotion_styled_base_browser_esm("div",  true ? {
37113    target: "e1epgpqk14"
37114  } : 0)("-webkit-tap-highlight-color:transparent;align-items:center;display:flex;justify-content:flex-start;padding:0;position:relative;touch-action:none;width:100%;min-height:40px;", deprecatedHeight, ";" + ( true ? "" : 0));
37115  const wrapperColor = ({
37116    color = COLORS.ui.borderFocus
37117  }) => /*#__PURE__*/emotion_react_browser_esm_css({
37118    color
37119  },  true ? "" : 0,  true ? "" : 0);
37120  const wrapperMargin = ({
37121    marks,
37122    __nextHasNoMarginBottom
37123  }) => {
37124    if (!__nextHasNoMarginBottom) {
37125      return /*#__PURE__*/emotion_react_browser_esm_css({
37126        marginBottom: marks ? 16 : undefined
37127      },  true ? "" : 0,  true ? "" : 0);
37128    }
37129    return '';
37130  };
37131  const range_control_styles_Wrapper = /*#__PURE__*/emotion_styled_base_browser_esm("div",  true ? {
37132    target: "e1epgpqk13"
37133  } : 0)("display:block;flex:1;position:relative;width:100%;", wrapperColor, ";", rangeHeight, ";", wrapperMargin, ";" + ( true ? "" : 0));
37134  const BeforeIconWrapper = /*#__PURE__*/emotion_styled_base_browser_esm("span",  true ? {
37135    target: "e1epgpqk12"
37136  } : 0)("display:flex;margin-top:", railHeight, "px;", rtl({
37137    marginRight: 6
37138  }), ";" + ( true ? "" : 0));
37139  const AfterIconWrapper = /*#__PURE__*/emotion_styled_base_browser_esm("span",  true ? {
37140    target: "e1epgpqk11"
37141  } : 0)("display:flex;margin-top:", railHeight, "px;", rtl({
37142    marginLeft: 6
37143  }), ";" + ( true ? "" : 0));
37144  const railBackgroundColor = ({
37145    disabled,
37146    railColor
37147  }) => {
37148    let background = railColor || '';
37149    if (disabled) {
37150      background = COLORS.ui.backgroundDisabled;
37151    }
37152    return /*#__PURE__*/emotion_react_browser_esm_css({
37153      background
37154    },  true ? "" : 0,  true ? "" : 0);
37155  };
37156  const Rail = /*#__PURE__*/emotion_styled_base_browser_esm("span",  true ? {
37157    target: "e1epgpqk10"
37158  } : 0)("background-color:", COLORS.gray[300], ";left:0;pointer-events:none;right:0;display:block;height:", railHeight, "px;position:absolute;margin-top:", (rangeHeightValue - railHeight) / 2, "px;top:0;border-radius:", config_values.radiusFull, ";", railBackgroundColor, ";" + ( true ? "" : 0));
37159  const trackBackgroundColor = ({
37160    disabled,
37161    trackColor
37162  }) => {
37163    let background = trackColor || 'currentColor';
37164    if (disabled) {
37165      background = COLORS.gray[400];
37166    }
37167    return /*#__PURE__*/emotion_react_browser_esm_css({
37168      background
37169    },  true ? "" : 0,  true ? "" : 0);
37170  };
37171  const Track = /*#__PURE__*/emotion_styled_base_browser_esm("span",  true ? {
37172    target: "e1epgpqk9"
37173  } : 0)("background-color:currentColor;border-radius:", config_values.radiusFull, ";height:", railHeight, "px;pointer-events:none;display:block;position:absolute;margin-top:", (rangeHeightValue - railHeight) / 2, "px;top:0;", trackBackgroundColor, ";" + ( true ? "" : 0));
37174  const MarksWrapper = /*#__PURE__*/emotion_styled_base_browser_esm("span",  true ? {
37175    target: "e1epgpqk8"
37176  } : 0)( true ? {
37177    name: "l7tjj5",
37178    styles: "display:block;pointer-events:none;position:relative;width:100%;user-select:none"
37179  } : 0);
37180  const markFill = ({
37181    disabled,
37182    isFilled
37183  }) => {
37184    let backgroundColor = isFilled ? 'currentColor' : COLORS.gray[300];
37185    if (disabled) {
37186      backgroundColor = COLORS.gray[400];
37187    }
37188    return /*#__PURE__*/emotion_react_browser_esm_css({
37189      backgroundColor
37190    },  true ? "" : 0,  true ? "" : 0);
37191  };
37192  const Mark = /*#__PURE__*/emotion_styled_base_browser_esm("span",  true ? {
37193    target: "e1epgpqk7"
37194  } : 0)("height:", thumbSize, "px;left:0;position:absolute;top:9px;width:1px;", markFill, ";" + ( true ? "" : 0));
37195  const markLabelFill = ({
37196    isFilled
37197  }) => {
37198    return /*#__PURE__*/emotion_react_browser_esm_css({
37199      color: isFilled ? COLORS.gray[700] : COLORS.gray[300]
37200    },  true ? "" : 0,  true ? "" : 0);
37201  };
37202  const MarkLabel = /*#__PURE__*/emotion_styled_base_browser_esm("span",  true ? {
37203    target: "e1epgpqk6"
37204  } : 0)("color:", COLORS.gray[300], ";font-size:11px;position:absolute;top:22px;white-space:nowrap;", rtl({
37205    left: 0
37206  }), ";", rtl({
37207    transform: 'translateX( -50% )'
37208  }, {
37209    transform: 'translateX( 50% )'
37210  }), ";", markLabelFill, ";" + ( true ? "" : 0));
37211  const thumbColor = ({
37212    disabled
37213  }) => disabled ? /*#__PURE__*/emotion_react_browser_esm_css("background-color:", COLORS.gray[400], ";" + ( true ? "" : 0),  true ? "" : 0) : /*#__PURE__*/emotion_react_browser_esm_css("background-color:", COLORS.theme.accent, ";" + ( true ? "" : 0),  true ? "" : 0);
37214  const ThumbWrapper = /*#__PURE__*/emotion_styled_base_browser_esm("span",  true ? {
37215    target: "e1epgpqk5"
37216  } : 0)("align-items:center;display:flex;height:", thumbSize, "px;justify-content:center;margin-top:", (rangeHeightValue - thumbSize) / 2, "px;outline:0;pointer-events:none;position:absolute;top:0;user-select:none;width:", thumbSize, "px;border-radius:", config_values.radiusRound, ";", thumbColor, ";", rtl({
37217    marginLeft: -10
37218  }), ";", rtl({
37219    transform: 'translateX( 4.5px )'
37220  }, {
37221    transform: 'translateX( -4.5px )'
37222  }), ";" + ( true ? "" : 0));
37223  const thumbFocus = ({
37224    isFocused
37225  }) => {
37226    return isFocused ? /*#__PURE__*/emotion_react_browser_esm_css("&::before{content:' ';position:absolute;background-color:", COLORS.theme.accent, ";opacity:0.4;border-radius:", config_values.radiusRound, ";height:", thumbSize + 8, "px;width:", thumbSize + 8, "px;top:-4px;left:-4px;}" + ( true ? "" : 0),  true ? "" : 0) : '';
37227  };
37228  const Thumb = /*#__PURE__*/emotion_styled_base_browser_esm("span",  true ? {
37229    target: "e1epgpqk4"
37230  } : 0)("align-items:center;border-radius:", config_values.radiusRound, ";height:100%;outline:0;position:absolute;user-select:none;width:100%;box-shadow:", config_values.elevationXSmall, ";", thumbColor, ";", thumbFocus, ";" + ( true ? "" : 0));
37231  const InputRange = /*#__PURE__*/emotion_styled_base_browser_esm("input",  true ? {
37232    target: "e1epgpqk3"
37233  } : 0)("box-sizing:border-box;cursor:pointer;display:block;height:100%;left:0;margin:0 -", thumbSize / 2, "px;opacity:0;outline:none;position:absolute;right:0;top:0;width:calc( 100% + ", thumbSize, "px );" + ( true ? "" : 0));
37234  const tooltipShow = ({
37235    show
37236  }) => {
37237    return /*#__PURE__*/emotion_react_browser_esm_css({
37238      opacity: show ? 1 : 0
37239    },  true ? "" : 0,  true ? "" : 0);
37240  };
37241  var range_control_styles_ref =  true ? {
37242    name: "1cypxip",
37243    styles: "top:-80%"
37244  } : 0;
37245  var range_control_styles_ref2 =  true ? {
37246    name: "1lr98c4",
37247    styles: "bottom:-80%"
37248  } : 0;
37249  const tooltipPosition = ({
37250    position
37251  }) => {
37252    const isBottom = position === 'bottom';
37253    if (isBottom) {
37254      return range_control_styles_ref2;
37255    }
37256    return range_control_styles_ref;
37257  };
37258  const range_control_styles_Tooltip = /*#__PURE__*/emotion_styled_base_browser_esm("span",  true ? {
37259    target: "e1epgpqk2"
37260  } : 0)("background:rgba( 0, 0, 0, 0.8 );border-radius:", config_values.radiusSmall, ";color:white;display:inline-block;font-size:12px;min-width:32px;opacity:0;padding:4px 8px;pointer-events:none;position:absolute;text-align:center;user-select:none;line-height:1.4;@media not ( prefers-reduced-motion ){transition:opacity 120ms ease;}", tooltipShow, ";", tooltipPosition, ";", rtl({
37261    transform: 'translateX(-50%)'
37262  }, {
37263    transform: 'translateX(50%)'
37264  }), ";" + ( true ? "" : 0));
37265  
37266  // @todo Refactor RangeControl with latest HStack configuration
37267  // @see: packages/components/src/h-stack
37268  const InputNumber = /*#__PURE__*/emotion_styled_base_browser_esm(number_control,  true ? {
37269    target: "e1epgpqk1"
37270  } : 0)("display:inline-block;font-size:13px;margin-top:0;input[type='number']&{", rangeHeight, ";}", rtl({
37271    marginLeft: `$space(4)} !important`
37272  }), ";" + ( true ? "" : 0));
37273  const ActionRightWrapper = /*#__PURE__*/emotion_styled_base_browser_esm("span",  true ? {
37274    target: "e1epgpqk0"
37275  } : 0)("display:block;margin-top:0;button,button.is-small{margin-left:0;", rangeHeight, ";}", rtl({
37276    marginLeft: 8
37277  }), ";" + ( true ? "" : 0));
37278  
37279  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/range-control/input-range.js
37280  /**
37281   * WordPress dependencies
37282   */
37283  
37284  
37285  /**
37286   * Internal dependencies
37287   */
37288  
37289  
37290  function input_range_InputRange(props, ref) {
37291    const {
37292      describedBy,
37293      label,
37294      value,
37295      ...otherProps
37296    } = props;
37297    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(InputRange, {
37298      ...otherProps,
37299      "aria-describedby": describedBy,
37300      "aria-label": label,
37301      "aria-hidden": false,
37302      ref: ref,
37303      tabIndex: 0,
37304      type: "range",
37305      value: value
37306    });
37307  }
37308  const input_range_ForwardedComponent = (0,external_wp_element_namespaceObject.forwardRef)(input_range_InputRange);
37309  /* harmony default export */ const input_range = (input_range_ForwardedComponent);
37310  
37311  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/range-control/mark.js
37312  /**
37313   * External dependencies
37314   */
37315  
37316  
37317  /**
37318   * Internal dependencies
37319   */
37320  
37321  
37322  
37323  
37324  function RangeMark(props) {
37325    const {
37326      className,
37327      isFilled = false,
37328      label,
37329      style = {},
37330      ...otherProps
37331    } = props;
37332    const classes = dist_clsx('components-range-control__mark', isFilled && 'is-filled', className);
37333    const labelClasses = dist_clsx('components-range-control__mark-label', isFilled && 'is-filled');
37334    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, {
37335      children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Mark, {
37336        ...otherProps,
37337        "aria-hidden": "true",
37338        className: classes,
37339        isFilled: isFilled,
37340        style: style
37341      }), label && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(MarkLabel, {
37342        "aria-hidden": "true",
37343        className: labelClasses,
37344        isFilled: isFilled,
37345        style: style,
37346        children: label
37347      })]
37348    });
37349  }
37350  
37351  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/range-control/rail.js
37352  /**
37353   * WordPress dependencies
37354   */
37355  
37356  
37357  /**
37358   * Internal dependencies
37359   */
37360  
37361  
37362  
37363  
37364  
37365  
37366  function RangeRail(props) {
37367    const {
37368      disabled = false,
37369      marks = false,
37370      min = 0,
37371      max = 100,
37372      step = 1,
37373      value = 0,
37374      ...restProps
37375    } = props;
37376    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, {
37377      children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Rail, {
37378        disabled: disabled,
37379        ...restProps
37380      }), marks && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Marks, {
37381        disabled: disabled,
37382        marks: marks,
37383        min: min,
37384        max: max,
37385        step: step,
37386        value: value
37387      })]
37388    });
37389  }
37390  function Marks(props) {
37391    const {
37392      disabled = false,
37393      marks = false,
37394      min = 0,
37395      max = 100,
37396      step: stepProp = 1,
37397      value = 0
37398    } = props;
37399    const step = stepProp === 'any' ? 1 : stepProp;
37400    const marksData = useMarks({
37401      marks,
37402      min,
37403      max,
37404      step,
37405      value
37406    });
37407    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(MarksWrapper, {
37408      "aria-hidden": "true",
37409      className: "components-range-control__marks",
37410      children: marksData.map(mark => /*#__PURE__*/(0,external_React_.createElement)(RangeMark, {
37411        ...mark,
37412        key: mark.key,
37413        "aria-hidden": "true",
37414        disabled: disabled
37415      }))
37416    });
37417  }
37418  function useMarks({
37419    marks,
37420    min = 0,
37421    max = 100,
37422    step = 1,
37423    value = 0
37424  }) {
37425    if (!marks) {
37426      return [];
37427    }
37428    const range = max - min;
37429    if (!Array.isArray(marks)) {
37430      marks = [];
37431      const count = 1 + Math.round(range / step);
37432      while (count > marks.push({
37433        value: step * marks.length + min
37434      })) {}
37435    }
37436    const placedMarks = [];
37437    marks.forEach((mark, index) => {
37438      if (mark.value < min || mark.value > max) {
37439        return;
37440      }
37441      const key = `mark-$index}`;
37442      const isFilled = mark.value <= value;
37443      const offset = `${(mark.value - min) / range * 100}%`;
37444      const offsetStyle = {
37445        [(0,external_wp_i18n_namespaceObject.isRTL)() ? 'right' : 'left']: offset
37446      };
37447      placedMarks.push({
37448        ...mark,
37449        isFilled,
37450        key,
37451        style: offsetStyle
37452      });
37453    });
37454    return placedMarks;
37455  }
37456  
37457  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/range-control/tooltip.js
37458  /**
37459   * External dependencies
37460   */
37461  
37462  
37463  /**
37464   * WordPress dependencies
37465   */
37466  
37467  
37468  /**
37469   * Internal dependencies
37470   */
37471  
37472  
37473  function SimpleTooltip(props) {
37474    const {
37475      className,
37476      inputRef,
37477      tooltipPosition,
37478      show = false,
37479      style = {},
37480      value = 0,
37481      renderTooltipContent = v => v,
37482      zIndex = 100,
37483      ...restProps
37484    } = props;
37485    const position = useTooltipPosition({
37486      inputRef,
37487      tooltipPosition
37488    });
37489    const classes = dist_clsx('components-simple-tooltip', className);
37490    const styles = {
37491      ...style,
37492      zIndex
37493    };
37494    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(range_control_styles_Tooltip, {
37495      ...restProps,
37496      "aria-hidden": show,
37497      className: classes,
37498      position: position,
37499      show: show,
37500      role: "tooltip",
37501      style: styles,
37502      children: renderTooltipContent(value)
37503    });
37504  }
37505  function useTooltipPosition({
37506    inputRef,
37507    tooltipPosition
37508  }) {
37509    const [position, setPosition] = (0,external_wp_element_namespaceObject.useState)();
37510    const setTooltipPosition = (0,external_wp_element_namespaceObject.useCallback)(() => {
37511      if (inputRef && inputRef.current) {
37512        setPosition(tooltipPosition);
37513      }
37514    }, [tooltipPosition, inputRef]);
37515    (0,external_wp_element_namespaceObject.useEffect)(() => {
37516      setTooltipPosition();
37517    }, [setTooltipPosition]);
37518    (0,external_wp_element_namespaceObject.useEffect)(() => {
37519      window.addEventListener('resize', setTooltipPosition);
37520      return () => {
37521        window.removeEventListener('resize', setTooltipPosition);
37522      };
37523    });
37524    return position;
37525  }
37526  
37527  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/range-control/index.js
37528  /**
37529   * External dependencies
37530   */
37531  
37532  /**
37533   * WordPress dependencies
37534   */
37535  
37536  
37537  
37538  
37539  /**
37540   * Internal dependencies
37541   */
37542  
37543  
37544  
37545  
37546  
37547  
37548  
37549  
37550  
37551  
37552  
37553  
37554  
37555  const range_control_noop = () => {};
37556  
37557  /**
37558   * Computes the value that `RangeControl` should reset to when pressing
37559   * the reset button.
37560   */
37561  function computeResetValue({
37562    resetFallbackValue,
37563    initialPosition
37564  }) {
37565    if (resetFallbackValue !== undefined) {
37566      return !Number.isNaN(resetFallbackValue) ? resetFallbackValue : null;
37567    }
37568    if (initialPosition !== undefined) {
37569      return !Number.isNaN(initialPosition) ? initialPosition : null;
37570    }
37571    return null;
37572  }
37573  function UnforwardedRangeControl(props, forwardedRef) {
37574    const {
37575      __nextHasNoMarginBottom = false,
37576      afterIcon,
37577      allowReset = false,
37578      beforeIcon,
37579      className,
37580      color: colorProp = COLORS.theme.accent,
37581      currentInput,
37582      disabled = false,
37583      help,
37584      hideLabelFromVision = false,
37585      initialPosition,
37586      isShiftStepEnabled = true,
37587      label,
37588      marks = false,
37589      max = 100,
37590      min = 0,
37591      onBlur = range_control_noop,
37592      onChange = range_control_noop,
37593      onFocus = range_control_noop,
37594      onMouseLeave = range_control_noop,
37595      onMouseMove = range_control_noop,
37596      railColor,
37597      renderTooltipContent = v => v,
37598      resetFallbackValue,
37599      __next40pxDefaultSize = false,
37600      shiftStep = 10,
37601      showTooltip: showTooltipProp,
37602      step = 1,
37603      trackColor,
37604      value: valueProp,
37605      withInputField = true,
37606      ...otherProps
37607    } = props;
37608    const [value, setValue] = useControlledRangeValue({
37609      min,
37610      max,
37611      value: valueProp !== null && valueProp !== void 0 ? valueProp : null,
37612      initial: initialPosition
37613    });
37614    const isResetPendent = (0,external_wp_element_namespaceObject.useRef)(false);
37615    let hasTooltip = showTooltipProp;
37616    let hasInputField = withInputField;
37617    if (step === 'any') {
37618      // The tooltip and number input field are hidden when the step is "any"
37619      // because the decimals get too lengthy to fit well.
37620      hasTooltip = false;
37621      hasInputField = false;
37622    }
37623    const [showTooltip, setShowTooltip] = (0,external_wp_element_namespaceObject.useState)(hasTooltip);
37624    const [isFocused, setIsFocused] = (0,external_wp_element_namespaceObject.useState)(false);
37625    const inputRef = (0,external_wp_element_namespaceObject.useRef)();
37626    const isCurrentlyFocused = inputRef.current?.matches(':focus');
37627    const isThumbFocused = !disabled && isFocused;
37628    const isValueReset = value === null;
37629    const currentValue = value !== undefined ? value : currentInput;
37630    const inputSliderValue = isValueReset ? '' : currentValue;
37631    const rangeFillValue = isValueReset ? (max - min) / 2 + min : value;
37632    const fillValue = isValueReset ? 50 : (value - min) / (max - min) * 100;
37633    const fillValueOffset = `$math_clamp(fillValue, 0, 100)}%`;
37634    const classes = dist_clsx('components-range-control', className);
37635    const wrapperClasses = dist_clsx('components-range-control__wrapper', !!marks && 'is-marked');
37636    const id = (0,external_wp_compose_namespaceObject.useInstanceId)(UnforwardedRangeControl, 'inspector-range-control');
37637    const describedBy = !!help ? `$id}__help` : undefined;
37638    const enableTooltip = hasTooltip !== false && Number.isFinite(value);
37639    const handleOnRangeChange = event => {
37640      const nextValue = parseFloat(event.target.value);
37641      setValue(nextValue);
37642      onChange(nextValue);
37643    };
37644    const handleOnChange = next => {
37645      // @ts-expect-error TODO: Investigate if it's problematic for setValue() to
37646      // potentially receive a NaN when next is undefined.
37647      let nextValue = parseFloat(next);
37648      setValue(nextValue);
37649  
37650      /*
37651       * Calls onChange only when nextValue is numeric
37652       * otherwise may queue a reset for the blur event.
37653       */
37654      if (!isNaN(nextValue)) {
37655        if (nextValue < min || nextValue > max) {
37656          nextValue = floatClamp(nextValue, min, max);
37657        }
37658        onChange(nextValue);
37659        isResetPendent.current = false;
37660      } else if (allowReset) {
37661        isResetPendent.current = true;
37662      }
37663    };
37664    const handleOnInputNumberBlur = () => {
37665      if (isResetPendent.current) {
37666        handleOnReset();
37667        isResetPendent.current = false;
37668      }
37669    };
37670    const handleOnReset = () => {
37671      // Reset to `resetFallbackValue` if defined, otherwise set internal value
37672      // to `null` — which, if propagated to the `value` prop, will cause
37673      // the value to be reset to the `initialPosition` prop if defined.
37674      const resetValue = Number.isNaN(resetFallbackValue) ? null : resetFallbackValue !== null && resetFallbackValue !== void 0 ? resetFallbackValue : null;
37675      setValue(resetValue);
37676  
37677      /**
37678       * Previously, this callback would always receive undefined as
37679       * an argument. This behavior is unexpected, specifically
37680       * when resetFallbackValue is defined.
37681       *
37682       * The value of undefined is not ideal. Passing it through
37683       * to internal <input /> elements would change it from a
37684       * controlled component to an uncontrolled component.
37685       *
37686       * For now, to minimize unexpected regressions, we're going to
37687       * preserve the undefined callback argument, except when a
37688       * resetFallbackValue is defined.
37689       */
37690      onChange(resetValue !== null && resetValue !== void 0 ? resetValue : undefined);
37691    };
37692    const handleShowTooltip = () => setShowTooltip(true);
37693    const handleHideTooltip = () => setShowTooltip(false);
37694    const handleOnBlur = event => {
37695      onBlur(event);
37696      setIsFocused(false);
37697      handleHideTooltip();
37698    };
37699    const handleOnFocus = event => {
37700      onFocus(event);
37701      setIsFocused(true);
37702      handleShowTooltip();
37703    };
37704    const offsetStyle = {
37705      [(0,external_wp_i18n_namespaceObject.isRTL)() ? 'right' : 'left']: fillValueOffset
37706    };
37707    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(base_control, {
37708      __nextHasNoMarginBottom: __nextHasNoMarginBottom,
37709      __associatedWPComponentName: "RangeControl",
37710      className: classes,
37711      label: label,
37712      hideLabelFromVision: hideLabelFromVision,
37713      id: `$id}`,
37714      help: help,
37715      children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(range_control_styles_Root, {
37716        className: "components-range-control__root",
37717        __next40pxDefaultSize: __next40pxDefaultSize,
37718        children: [beforeIcon && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BeforeIconWrapper, {
37719          children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_icon, {
37720            icon: beforeIcon
37721          })
37722        }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(range_control_styles_Wrapper, {
37723          __nextHasNoMarginBottom: __nextHasNoMarginBottom,
37724          className: wrapperClasses,
37725          color: colorProp,
37726          marks: !!marks,
37727          children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(input_range, {
37728            ...otherProps,
37729            className: "components-range-control__slider",
37730            describedBy: describedBy,
37731            disabled: disabled,
37732            id: `$id}`,
37733            label: label,
37734            max: max,
37735            min: min,
37736            onBlur: handleOnBlur,
37737            onChange: handleOnRangeChange,
37738            onFocus: handleOnFocus,
37739            onMouseMove: onMouseMove,
37740            onMouseLeave: onMouseLeave,
37741            ref: (0,external_wp_compose_namespaceObject.useMergeRefs)([inputRef, forwardedRef]),
37742            step: step,
37743            value: inputSliderValue !== null && inputSliderValue !== void 0 ? inputSliderValue : undefined
37744          }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(RangeRail, {
37745            "aria-hidden": true,
37746            disabled: disabled,
37747            marks: marks,
37748            max: max,
37749            min: min,
37750            railColor: railColor,
37751            step: step,
37752            value: rangeFillValue
37753          }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Track, {
37754            "aria-hidden": true,
37755            className: "components-range-control__track",
37756            disabled: disabled,
37757            style: {
37758              width: fillValueOffset
37759            },
37760            trackColor: trackColor
37761          }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ThumbWrapper, {
37762            className: "components-range-control__thumb-wrapper",
37763            style: offsetStyle,
37764            disabled: disabled,
37765            children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Thumb, {
37766              "aria-hidden": true,
37767              isFocused: isThumbFocused,
37768              disabled: disabled
37769            })
37770          }), enableTooltip && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(SimpleTooltip, {
37771            className: "components-range-control__tooltip",
37772            inputRef: inputRef,
37773            tooltipPosition: "bottom",
37774            renderTooltipContent: renderTooltipContent,
37775            show: isCurrentlyFocused || showTooltip,
37776            style: offsetStyle,
37777            value: value
37778          })]
37779        }), afterIcon && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(AfterIconWrapper, {
37780          children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_icon, {
37781            icon: afterIcon
37782          })
37783        }), hasInputField && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(InputNumber, {
37784          "aria-label": label,
37785          className: "components-range-control__number",
37786          disabled: disabled,
37787          inputMode: "decimal",
37788          isShiftStepEnabled: isShiftStepEnabled,
37789          max: max,
37790          min: min,
37791          onBlur: handleOnInputNumberBlur,
37792          onChange: handleOnChange,
37793          shiftStep: shiftStep,
37794          size: __next40pxDefaultSize ? '__unstable-large' : 'default',
37795          __unstableInputWidth: __next40pxDefaultSize ? space(20) : space(16),
37796          step: step
37797          // @ts-expect-error TODO: Investigate if the `null` value is necessary
37798          ,
37799          value: inputSliderValue
37800        }), allowReset && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ActionRightWrapper, {
37801          children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, {
37802            className: "components-range-control__reset"
37803            // If the RangeControl itself is disabled, the reset button shouldn't be in the tab sequence.
37804            ,
37805            accessibleWhenDisabled: !disabled
37806            // The reset button should be disabled if RangeControl itself is disabled,
37807            // or if the current `value` is equal to the value that would be currently
37808            // assigned when clicking the button.
37809            ,
37810            disabled: disabled || value === computeResetValue({
37811              resetFallbackValue,
37812              initialPosition
37813            }),
37814            variant: "secondary",
37815            size: "small",
37816            onClick: handleOnReset,
37817            children: (0,external_wp_i18n_namespaceObject.__)('Reset')
37818          })
37819        })]
37820      })
37821    });
37822  }
37823  
37824  /**
37825   * RangeControls are used to make selections from a range of incremental values.
37826   *
37827   * ```jsx
37828   * import { RangeControl } from '@wordpress/components';
37829   * import { useState } from '@wordpress/element';
37830   *
37831   * const MyRangeControl = () => {
37832   *   const [ isChecked, setChecked ] = useState( true );
37833   *   return (
37834   *     <RangeControl
37835   *       __nextHasNoMarginBottom
37836   *       help="Please select how transparent you would like this."
37837   *       initialPosition={50}
37838   *       label="Opacity"
37839   *       max={100}
37840   *       min={0}
37841   *       onChange={() => {}}
37842   *     />
37843   *   );
37844   * };
37845   * ```
37846   */
37847  const RangeControl = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedRangeControl);
37848  /* harmony default export */ const range_control = (RangeControl);
37849  
37850  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/color-picker/styles.js
37851  
37852  /**
37853   * External dependencies
37854   */
37855  
37856  /**
37857   * Internal dependencies
37858   */
37859  
37860  
37861  
37862  
37863  
37864  
37865  
37866  
37867  
37868  const NumberControlWrapper = /*#__PURE__*/emotion_styled_base_browser_esm(number_control,  true ? {
37869    target: "ez9hsf47"
37870  } : 0)("width:", space(24), ";" + ( true ? "" : 0));
37871  const styles_SelectControl = /*#__PURE__*/emotion_styled_base_browser_esm(select_control,  true ? {
37872    target: "ez9hsf46"
37873  } : 0)("margin-left:", space(-2), ";width:5em;" + ( true ? "" : 0));
37874  const styles_RangeControl = /*#__PURE__*/emotion_styled_base_browser_esm(range_control,  true ? {
37875    target: "ez9hsf45"
37876  } : 0)("flex:1;margin-right:", space(2), ";" + ( true ? "" : 0));
37877  
37878  // Make the Hue circle picker not go out of the bar.
37879  const interactiveHueStyles = `
37880  .react-colorful__interactive {
37881      width: calc( 100% - $space(2)} );
37882      margin-left: $space(1)};
37883  }`;
37884  const AuxiliaryColorArtefactWrapper = /*#__PURE__*/emotion_styled_base_browser_esm("div",  true ? {
37885    target: "ez9hsf44"
37886  } : 0)("padding-top:", space(2), ";padding-right:0;padding-left:0;padding-bottom:0;" + ( true ? "" : 0));
37887  const AuxiliaryColorArtefactHStackHeader = /*#__PURE__*/emotion_styled_base_browser_esm(h_stack_component,  true ? {
37888    target: "ez9hsf43"
37889  } : 0)("padding-left:", space(4), ";padding-right:", space(4), ";" + ( true ? "" : 0));
37890  const ColorInputWrapper = /*#__PURE__*/emotion_styled_base_browser_esm(flex_component,  true ? {
37891    target: "ez9hsf42"
37892  } : 0)("padding-top:", space(4), ";padding-left:", space(4), ";padding-right:", space(3), ";padding-bottom:", space(5), ";" + ( true ? "" : 0));
37893  const ColorfulWrapper = /*#__PURE__*/emotion_styled_base_browser_esm("div",  true ? {
37894    target: "ez9hsf41"
37895  } : 0)(boxSizingReset, ";width:216px;.react-colorful{display:flex;flex-direction:column;align-items:center;width:216px;height:auto;}.react-colorful__saturation{width:100%;border-radius:0;height:216px;margin-bottom:", space(4), ";border-bottom:none;}.react-colorful__hue,.react-colorful__alpha{width:184px;height:16px;border-radius:", config_values.radiusFull, ";margin-bottom:", space(2), ";}.react-colorful__pointer{height:16px;width:16px;border:none;box-shadow:0 0 2px 0 rgba( 0, 0, 0, 0.25 );outline:2px solid transparent;}.react-colorful__pointer-fill{box-shadow:inset 0 0 0 ", config_values.borderWidthFocus, " #fff;}", interactiveHueStyles, ";" + ( true ? "" : 0));
37896  const CopyButton = /*#__PURE__*/emotion_styled_base_browser_esm(build_module_button,  true ? {
37897    target: "ez9hsf40"
37898  } : 0)("&&&&&{min-width:", space(6), ";padding:0;>svg{margin-right:0;}}" + ( true ? "" : 0));
37899  
37900  ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/copy.js
37901  /**
37902   * WordPress dependencies
37903   */
37904  
37905  
37906  const copy_copy = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, {
37907    xmlns: "http://www.w3.org/2000/svg",
37908    viewBox: "0 0 24 24",
37909    children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, {
37910      fillRule: "evenodd",
37911      clipRule: "evenodd",
37912      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"
37913    })
37914  });
37915  /* harmony default export */ const library_copy = (copy_copy);
37916  
37917  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/color-picker/color-copy-button.js
37918  /**
37919   * WordPress dependencies
37920   */
37921  
37922  
37923  
37924  
37925  
37926  /**
37927   * Internal dependencies
37928   */
37929  
37930  
37931  
37932  const ColorCopyButton = props => {
37933    const {
37934      color,
37935      colorType
37936    } = props;
37937    const [copiedColor, setCopiedColor] = (0,external_wp_element_namespaceObject.useState)(null);
37938    const copyTimerRef = (0,external_wp_element_namespaceObject.useRef)();
37939    const copyRef = (0,external_wp_compose_namespaceObject.useCopyToClipboard)(() => {
37940      switch (colorType) {
37941        case 'hsl':
37942          {
37943            return color.toHslString();
37944          }
37945        case 'rgb':
37946          {
37947            return color.toRgbString();
37948          }
37949        default:
37950        case 'hex':
37951          {
37952            return color.toHex();
37953          }
37954      }
37955    }, () => {
37956      if (copyTimerRef.current) {
37957        clearTimeout(copyTimerRef.current);
37958      }
37959      setCopiedColor(color.toHex());
37960      copyTimerRef.current = setTimeout(() => {
37961        setCopiedColor(null);
37962        copyTimerRef.current = undefined;
37963      }, 3000);
37964    });
37965    (0,external_wp_element_namespaceObject.useEffect)(() => {
37966      // Clear copyTimerRef on component unmount.
37967      return () => {
37968        if (copyTimerRef.current) {
37969          clearTimeout(copyTimerRef.current);
37970        }
37971      };
37972    }, []);
37973    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(tooltip, {
37974      delay: 0,
37975      hideOnClick: false,
37976      text: copiedColor === color.toHex() ? (0,external_wp_i18n_namespaceObject.__)('Copied!') : (0,external_wp_i18n_namespaceObject.__)('Copy'),
37977      children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(CopyButton, {
37978        size: "small",
37979        ref: copyRef,
37980        icon: library_copy,
37981        showTooltip: false
37982      })
37983    });
37984  };
37985  
37986  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/input-control/input-prefix-wrapper.js
37987  /**
37988   * External dependencies
37989   */
37990  
37991  /**
37992   * Internal dependencies
37993   */
37994  
37995  
37996  
37997  
37998  function UnconnectedInputControlPrefixWrapper(props, forwardedRef) {
37999    const derivedProps = useContextSystem(props, 'InputControlPrefixWrapper');
38000    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(PrefixSuffixWrapper, {
38001      ...derivedProps,
38002      isPrefix: true,
38003      ref: forwardedRef
38004    });
38005  }
38006  
38007  /**
38008   * A convenience wrapper for the `prefix` when you want to apply
38009   * standard padding in accordance with the size variant.
38010   *
38011   * ```jsx
38012   * import {
38013   *   __experimentalInputControl as InputControl,
38014   *   __experimentalInputControlPrefixWrapper as InputControlPrefixWrapper,
38015   * } from '@wordpress/components';
38016   *
38017   * <InputControl
38018   *   prefix={<InputControlPrefixWrapper>@</InputControlPrefixWrapper>}
38019   * />
38020   * ```
38021   */
38022  const InputControlPrefixWrapper = contextConnect(UnconnectedInputControlPrefixWrapper, 'InputControlPrefixWrapper');
38023  /* harmony default export */ const input_prefix_wrapper = (InputControlPrefixWrapper);
38024  
38025  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/color-picker/input-with-slider.js
38026  /**
38027   * Internal dependencies
38028   */
38029  
38030  
38031  
38032  
38033  
38034  
38035  
38036  const InputWithSlider = ({
38037    min,
38038    max,
38039    label,
38040    abbreviation,
38041    onChange,
38042    value
38043  }) => {
38044    const onNumberControlChange = newValue => {
38045      if (!newValue) {
38046        onChange(0);
38047        return;
38048      }
38049      if (typeof newValue === 'string') {
38050        onChange(parseInt(newValue, 10));
38051        return;
38052      }
38053      onChange(newValue);
38054    };
38055    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(h_stack_component, {
38056      spacing: 4,
38057      children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(NumberControlWrapper, {
38058        min: min,
38059        max: max,
38060        label: label,
38061        hideLabelFromVision: true,
38062        value: value,
38063        onChange: onNumberControlChange,
38064        prefix: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(input_prefix_wrapper, {
38065          children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(text_component, {
38066            color: COLORS.theme.accent,
38067            lineHeight: 1,
38068            children: abbreviation
38069          })
38070        }),
38071        spinControls: "none",
38072        size: "__unstable-large"
38073      }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(styles_RangeControl, {
38074        __nextHasNoMarginBottom: true,
38075        __next40pxDefaultSize: true,
38076        label: label,
38077        hideLabelFromVision: true,
38078        min: min,
38079        max: max,
38080        value: value
38081        // @ts-expect-error
38082        // See: https://github.com/WordPress/gutenberg/pull/40535#issuecomment-1172418185
38083        ,
38084        onChange: onChange,
38085        withInputField: false
38086      })]
38087    });
38088  };
38089  
38090  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/color-picker/rgb-input.js
38091  /**
38092   * External dependencies
38093   */
38094  
38095  
38096  /**
38097   * Internal dependencies
38098   */
38099  
38100  
38101  
38102  
38103  const RgbInput = ({
38104    color,
38105    onChange,
38106    enableAlpha
38107  }) => {
38108    const {
38109      r,
38110      g,
38111      b,
38112      a
38113    } = color.toRgb();
38114    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, {
38115      children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(InputWithSlider, {
38116        min: 0,
38117        max: 255,
38118        label: "Red",
38119        abbreviation: "R",
38120        value: r,
38121        onChange: nextR => onChange(w({
38122          r: nextR,
38123          g,
38124          b,
38125          a
38126        }))
38127      }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(InputWithSlider, {
38128        min: 0,
38129        max: 255,
38130        label: "Green",
38131        abbreviation: "G",
38132        value: g,
38133        onChange: nextG => onChange(w({
38134          r,
38135          g: nextG,
38136          b,
38137          a
38138        }))
38139      }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(InputWithSlider, {
38140        min: 0,
38141        max: 255,
38142        label: "Blue",
38143        abbreviation: "B",
38144        value: b,
38145        onChange: nextB => onChange(w({
38146          r,
38147          g,
38148          b: nextB,
38149          a
38150        }))
38151      }), enableAlpha && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(InputWithSlider, {
38152        min: 0,
38153        max: 100,
38154        label: "Alpha",
38155        abbreviation: "A",
38156        value: Math.trunc(a * 100),
38157        onChange: nextA => onChange(w({
38158          r,
38159          g,
38160          b,
38161          a: nextA / 100
38162        }))
38163      })]
38164    });
38165  };
38166  
38167  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/color-picker/hsl-input.js
38168  /**
38169   * External dependencies
38170   */
38171  
38172  
38173  /**
38174   * WordPress dependencies
38175   */
38176  
38177  
38178  /**
38179   * Internal dependencies
38180   */
38181  
38182  
38183  
38184  
38185  const HslInput = ({
38186    color,
38187    onChange,
38188    enableAlpha
38189  }) => {
38190    const colorPropHSLA = (0,external_wp_element_namespaceObject.useMemo)(() => color.toHsl(), [color]);
38191    const [internalHSLA, setInternalHSLA] = (0,external_wp_element_namespaceObject.useState)({
38192      ...colorPropHSLA
38193    });
38194    const isInternalColorSameAsReceivedColor = color.isEqual(w(internalHSLA));
38195    (0,external_wp_element_namespaceObject.useEffect)(() => {
38196      if (!isInternalColorSameAsReceivedColor) {
38197        // Keep internal HSLA color up to date with the received color prop
38198        setInternalHSLA(colorPropHSLA);
38199      }
38200    }, [colorPropHSLA, isInternalColorSameAsReceivedColor]);
38201  
38202    // If the internal color is equal to the received color prop, we can use the
38203    // HSLA values from the local state which, compared to the received color prop,
38204    // retain more details about the actual H and S values that the user selected,
38205    // and thus allow for better UX when interacting with the H and S sliders.
38206    const colorValue = isInternalColorSameAsReceivedColor ? internalHSLA : colorPropHSLA;
38207    const updateHSLAValue = partialNewValue => {
38208      const nextOnChangeValue = w({
38209        ...colorValue,
38210        ...partialNewValue
38211      });
38212  
38213      // Fire `onChange` only if the resulting color is different from the
38214      // current one.
38215      // Otherwise, update the internal HSLA color to cause a re-render.
38216      if (!color.isEqual(nextOnChangeValue)) {
38217        onChange(nextOnChangeValue);
38218      } else {
38219        setInternalHSLA(prevHSLA => ({
38220          ...prevHSLA,
38221          ...partialNewValue
38222        }));
38223      }
38224    };
38225    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, {
38226      children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(InputWithSlider, {
38227        min: 0,
38228        max: 359,
38229        label: "Hue",
38230        abbreviation: "H",
38231        value: colorValue.h,
38232        onChange: nextH => {
38233          updateHSLAValue({
38234            h: nextH
38235          });
38236        }
38237      }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(InputWithSlider, {
38238        min: 0,
38239        max: 100,
38240        label: "Saturation",
38241        abbreviation: "S",
38242        value: colorValue.s,
38243        onChange: nextS => {
38244          updateHSLAValue({
38245            s: nextS
38246          });
38247        }
38248      }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(InputWithSlider, {
38249        min: 0,
38250        max: 100,
38251        label: "Lightness",
38252        abbreviation: "L",
38253        value: colorValue.l,
38254        onChange: nextL => {
38255          updateHSLAValue({
38256            l: nextL
38257          });
38258        }
38259      }), enableAlpha && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(InputWithSlider, {
38260        min: 0,
38261        max: 100,
38262        label: "Alpha",
38263        abbreviation: "A",
38264        value: Math.trunc(100 * colorValue.a),
38265        onChange: nextA => {
38266          updateHSLAValue({
38267            a: nextA / 100
38268          });
38269        }
38270      })]
38271    });
38272  };
38273  
38274  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/color-picker/hex-input.js
38275  /**
38276   * External dependencies
38277   */
38278  
38279  
38280  /**
38281   * WordPress dependencies
38282   */
38283  
38284  
38285  /**
38286   * Internal dependencies
38287   */
38288  
38289  
38290  
38291  
38292  
38293  const HexInput = ({
38294    color,
38295    onChange,
38296    enableAlpha
38297  }) => {
38298    const handleChange = nextValue => {
38299      if (!nextValue) {
38300        return;
38301      }
38302      const hexValue = nextValue.startsWith('#') ? nextValue : '#' + nextValue;
38303      onChange(w(hexValue));
38304    };
38305    const stateReducer = (state, action) => {
38306      const nativeEvent = action.payload?.event?.nativeEvent;
38307      if ('insertFromPaste' !== nativeEvent?.inputType) {
38308        return {
38309          ...state
38310        };
38311      }
38312      const value = state.value?.startsWith('#') ? state.value.slice(1).toUpperCase() : state.value?.toUpperCase();
38313      return {
38314        ...state,
38315        value
38316      };
38317    };
38318    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(InputControl, {
38319      prefix: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(input_prefix_wrapper, {
38320        children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(text_component, {
38321          color: COLORS.theme.accent,
38322          lineHeight: 1,
38323          children: "#"
38324        })
38325      }),
38326      value: color.toHex().slice(1).toUpperCase(),
38327      onChange: handleChange,
38328      maxLength: enableAlpha ? 9 : 7,
38329      label: (0,external_wp_i18n_namespaceObject.__)('Hex color'),
38330      hideLabelFromVision: true,
38331      size: "__unstable-large",
38332      __unstableStateReducer: stateReducer,
38333      __unstableInputWidth: "9em"
38334    });
38335  };
38336  
38337  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/color-picker/color-input.js
38338  /**
38339   * Internal dependencies
38340   */
38341  
38342  
38343  
38344  
38345  const ColorInput = ({
38346    colorType,
38347    color,
38348    onChange,
38349    enableAlpha
38350  }) => {
38351    const props = {
38352      color,
38353      onChange,
38354      enableAlpha
38355    };
38356    switch (colorType) {
38357      case 'hsl':
38358        return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(HslInput, {
38359          ...props
38360        });
38361      case 'rgb':
38362        return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(RgbInput, {
38363          ...props
38364        });
38365      default:
38366      case 'hex':
38367        return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(HexInput, {
38368          ...props
38369        });
38370    }
38371  };
38372  
38373  ;// CONCATENATED MODULE: ./node_modules/react-colorful/dist/index.mjs
38374  function dist_u(){return(dist_u=Object.assign||function(e){for(var r=1;r<arguments.length;r++){var t=arguments[r];for(var n in t)Object.prototype.hasOwnProperty.call(t,n)&&(e[n]=t[n])}return e}).apply(this,arguments)}function dist_c(e,r){if(null==e)return{};var t,n,o={},a=Object.keys(e);for(n=0;n<a.length;n++)r.indexOf(t=a[n])>=0||(o[t]=e[t]);return o}function dist_i(e){var t=(0,external_React_.useRef)(e),n=(0,external_React_.useRef)(function(e){t.current&&t.current(e)});return t.current=e,n.current}var dist_s=function(e,r,t){return void 0===r&&(r=0),void 0===t&&(t=1),e>t?t:e<r?r:e},dist_f=function(e){return"touches"in e},dist_v=function(e){return e&&e.ownerDocument.defaultView||self},dist_d=function(e,r,t){var n=e.getBoundingClientRect(),o=dist_f(r)?function(e,r){for(var t=0;t<e.length;t++)if(e[t].identifier===r)return e[t];return e[0]}(r.touches,t):r;return{left:dist_s((o.pageX-(n.left+dist_v(e).pageXOffset))/n.width),top:dist_s((o.pageY-(n.top+dist_v(e).pageYOffset))/n.height)}},dist_h=function(e){!dist_f(e)&&e.preventDefault()},dist_m=external_React_.memo(function(o){var a=o.onMove,l=o.onKey,s=dist_c(o,["onMove","onKey"]),m=(0,external_React_.useRef)(null),g=dist_i(a),p=dist_i(l),b=(0,external_React_.useRef)(null),_=(0,external_React_.useRef)(!1),x=(0,external_React_.useMemo)(function(){var e=function(e){dist_h(e),(dist_f(e)?e.touches.length>0:e.buttons>0)&&m.current?g(dist_d(m.current,e,b.current)):t(!1)},r=function(){return t(!1)};function t(t){var n=_.current,o=dist_v(m.current),a=t?o.addEventListener:o.removeEventListener;a(n?"touchmove":"mousemove",e),a(n?"touchend":"mouseup",r)}return[function(e){var r=e.nativeEvent,n=m.current;if(n&&(dist_h(r),!function(e,r){return r&&!dist_f(e)}(r,_.current)&&n)){if(dist_f(r)){_.current=!0;var o=r.changedTouches||[];o.length&&(b.current=o[0].identifier)}n.focus(),g(dist_d(n,r,b.current)),t(!0)}},function(e){var r=e.which||e.keyCode;r<37||r>40||(e.preventDefault(),p({left:39===r?.05:37===r?-.05:0,top:40===r?.05:38===r?-.05:0}))},t]},[p,g]),C=x[0],E=x[1],H=x[2];return (0,external_React_.useEffect)(function(){return H},[H]),external_React_.createElement("div",dist_u({},s,{onTouchStart:C,onMouseDown:C,className:"react-colorful__interactive",ref:m,onKeyDown:E,tabIndex:0,role:"slider"}))}),dist_g=function(e){return e.filter(Boolean).join(" ")},dist_p=function(r){var t=r.color,n=r.left,o=r.top,a=void 0===o?.5:o,l=dist_g(["react-colorful__pointer",r.className]);return external_React_.createElement("div",{className:l,style:{top:100*a+"%",left:100*n+"%"}},external_React_.createElement("div",{className:"react-colorful__pointer-fill",style:{backgroundColor:t}}))},dist_b=function(e,r,t){return void 0===r&&(r=0),void 0===t&&(t=Math.pow(10,r)),Math.round(t*e)/t},_={grad:.9,turn:360,rad:360/(2*Math.PI)},dist_x=function(e){return L(C(e))},C=function(e){return"#"===e[0]&&(e=e.substring(1)),e.length<6?{r:parseInt(e[0]+e[0],16),g:parseInt(e[1]+e[1],16),b:parseInt(e[2]+e[2],16),a:4===e.length?dist_b(parseInt(e[3]+e[3],16)/255,2):1}:{r:parseInt(e.substring(0,2),16),g:parseInt(e.substring(2,4),16),b:parseInt(e.substring(4,6),16),a:8===e.length?dist_b(parseInt(e.substring(6,8),16)/255,2):1}},dist_E=function(e,r){return void 0===r&&(r="deg"),Number(e)*(_[r]||1)},dist_H=function(e){var r=/hsla?\(?\s*(-?\d*\.?\d+)(deg|rad|grad|turn)?[,\s]+(-?\d*\.?\d+)%?[,\s]+(-?\d*\.?\d+)%?,?\s*[/\s]*(-?\d*\.?\d+)?(%)?\s*\)?/i.exec(e);return r?dist_N({h:dist_E(r[1],r[2]),s:Number(r[3]),l:Number(r[4]),a:void 0===r[5]?1:Number(r[5])/(r[6]?100:1)}):{h:0,s:0,v:0,a:1}},dist_M=dist_H,dist_N=function(e){var r=e.s,t=e.l;return{h:e.h,s:(r*=(t<50?t:100-t)/100)>0?2*r/(t+r)*100:0,v:t+r,a:e.a}},dist_w=function(e){return K(dist_I(e))},dist_y=function(e){var r=e.s,t=e.v,n=e.a,o=(200-r)*t/100;return{h:dist_b(e.h),s:dist_b(o>0&&o<200?r*t/100/(o<=100?o:200-o)*100:0),l:dist_b(o/2),a:dist_b(n,2)}},q=function(e){var r=dist_y(e);return"hsl("+r.h+", "+r.s+"%, "+r.l+"%)"},dist_k=function(e){var r=dist_y(e);return"hsla("+r.h+", "+r.s+"%, "+r.l+"%, "+r.a+")"},dist_I=function(e){var r=e.h,t=e.s,n=e.v,o=e.a;r=r/360*6,t/=100,n/=100;var a=Math.floor(r),l=n*(1-t),u=n*(1-(r-a)*t),c=n*(1-(1-r+a)*t),i=a%6;return{r:dist_b(255*[n,u,l,l,c,n][i]),g:dist_b(255*[c,n,n,u,l,l][i]),b:dist_b(255*[l,l,c,n,n,u][i]),a:dist_b(o,2)}},O=function(e){var r=/hsva?\(?\s*(-?\d*\.?\d+)(deg|rad|grad|turn)?[,\s]+(-?\d*\.?\d+)%?[,\s]+(-?\d*\.?\d+)%?,?\s*[/\s]*(-?\d*\.?\d+)?(%)?\s*\)?/i.exec(e);return r?A({h:dist_E(r[1],r[2]),s:Number(r[3]),v:Number(r[4]),a:void 0===r[5]?1:Number(r[5])/(r[6]?100:1)}):{h:0,s:0,v:0,a:1}},dist_j=O,z=function(e){var r=/rgba?\(?\s*(-?\d*\.?\d+)(%)?[,\s]+(-?\d*\.?\d+)(%)?[,\s]+(-?\d*\.?\d+)(%)?,?\s*[/\s]*(-?\d*\.?\d+)?(%)?\s*\)?/i.exec(e);return r?L({r:Number(r[1])/(r[2]?100/255:1),g:Number(r[3])/(r[4]?100/255:1),b:Number(r[5])/(r[6]?100/255:1),a:void 0===r[7]?1:Number(r[7])/(r[8]?100:1)}):{h:0,s:0,v:0,a:1}},B=z,D=function(e){var r=e.toString(16);return r.length<2?"0"+r:r},K=function(e){var r=e.r,t=e.g,n=e.b,o=e.a,a=o<1?D(dist_b(255*o)):"";return"#"+D(r)+D(t)+D(n)+a},L=function(e){var r=e.r,t=e.g,n=e.b,o=e.a,a=Math.max(r,t,n),l=a-Math.min(r,t,n),u=l?a===r?(t-n)/l:a===t?2+(n-r)/l:4+(r-t)/l:0;return{h:dist_b(60*(u<0?u+6:u)),s:dist_b(a?l/a*100:0),v:dist_b(a/255*100),a:o}},A=function(e){return{h:dist_b(e.h),s:dist_b(e.s),v:dist_b(e.v),a:dist_b(e.a,2)}},dist_S=external_React_.memo(function(r){var t=r.hue,n=r.onChange,o=dist_g(["react-colorful__hue",r.className]);return external_React_.createElement("div",{className:o},external_React_.createElement(dist_m,{onMove:function(e){n({h:360*e.left})},onKey:function(e){n({h:dist_s(t+360*e.left,0,360)})},"aria-label":"Hue","aria-valuenow":dist_b(t),"aria-valuemax":"360","aria-valuemin":"0"},external_React_.createElement(dist_p,{className:"react-colorful__hue-pointer",left:t/360,color:q({h:t,s:100,v:100,a:1})})))}),T=external_React_.memo(function(r){var t=r.hsva,n=r.onChange,o={backgroundColor:q({h:t.h,s:100,v:100,a:1})};return external_React_.createElement("div",{className:"react-colorful__saturation",style:o},external_React_.createElement(dist_m,{onMove:function(e){n({s:100*e.left,v:100-100*e.top})},onKey:function(e){n({s:dist_s(t.s+100*e.left,0,100),v:dist_s(t.v-100*e.top,0,100)})},"aria-label":"Color","aria-valuetext":"Saturation "+dist_b(t.s)+"%, Brightness "+dist_b(t.v)+"%"},external_React_.createElement(dist_p,{className:"react-colorful__saturation-pointer",top:1-t.v/100,left:t.s/100,color:q(t)})))}),F=function(e,r){if(e===r)return!0;for(var t in e)if(e[t]!==r[t])return!1;return!0},P=function(e,r){return e.replace(/\s/g,"")===r.replace(/\s/g,"")},X=function(e,r){return e.toLowerCase()===r.toLowerCase()||F(C(e),C(r))};function Y(e,t,l){var u=dist_i(l),c=(0,external_React_.useState)(function(){return e.toHsva(t)}),s=c[0],f=c[1],v=(0,external_React_.useRef)({color:t,hsva:s});(0,external_React_.useEffect)(function(){if(!e.equal(t,v.current.color)){var r=e.toHsva(t);v.current={hsva:r,color:t},f(r)}},[t,e]),(0,external_React_.useEffect)(function(){var r;F(s,v.current.hsva)||e.equal(r=e.fromHsva(s),v.current.color)||(v.current={hsva:s,color:r},u(r))},[s,e,u]);var d=(0,external_React_.useCallback)(function(e){f(function(r){return Object.assign({},r,e)})},[]);return[s,d]}var R,dist_V="undefined"!=typeof window?external_React_.useLayoutEffect:external_React_.useEffect,dist_$=function(){return R||( true?__webpack_require__.nc:0)},G=function(e){R=e},J=new Map,Q=function(e){dist_V(function(){var r=e.current?e.current.ownerDocument:document;if(void 0!==r&&!J.has(r)){var t=r.createElement("style");t.innerHTML='.react-colorful{position:relative;display:flex;flex-direction:column;width:200px;height:200px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;cursor:default}.react-colorful__saturation{position:relative;flex-grow:1;border-color:transparent;border-bottom:12px solid #000;border-radius:8px 8px 0 0;background-image:linear-gradient(0deg,#000,transparent),linear-gradient(90deg,#fff,hsla(0,0%,100%,0))}.react-colorful__alpha-gradient,.react-colorful__pointer-fill{content:"";position:absolute;left:0;top:0;right:0;bottom:0;pointer-events:none;border-radius:inherit}.react-colorful__alpha-gradient,.react-colorful__saturation{box-shadow:inset 0 0 0 1px rgba(0,0,0,.05)}.react-colorful__alpha,.react-colorful__hue{position:relative;height:24px}.react-colorful__hue{background:linear-gradient(90deg,red 0,#ff0 17%,#0f0 33%,#0ff 50%,#00f 67%,#f0f 83%,red)}.react-colorful__last-control{border-radius:0 0 8px 8px}.react-colorful__interactive{position:absolute;left:0;top:0;right:0;bottom:0;border-radius:inherit;outline:none;touch-action:none}.react-colorful__pointer{position:absolute;z-index:1;box-sizing:border-box;width:28px;height:28px;transform:translate(-50%,-50%);background-color:#fff;border:2px solid #fff;border-radius:50%;box-shadow:0 2px 4px rgba(0,0,0,.2)}.react-colorful__interactive:focus .react-colorful__pointer{transform:translate(-50%,-50%) scale(1.1)}.react-colorful__alpha,.react-colorful__alpha-pointer{background-color:#fff;background-image:url(\'data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill-opacity=".05"><path d="M8 0h8v8H8zM0 8h8v8H0z"/></svg>\')}.react-colorful__saturation-pointer{z-index:3}.react-colorful__hue-pointer{z-index:2}',J.set(r,t);var n=dist_$();n&&t.setAttribute("nonce",n),r.head.appendChild(t)}},[])},U=function(t){var n=t.className,o=t.colorModel,a=t.color,l=void 0===a?o.defaultColor:a,i=t.onChange,s=dist_c(t,["className","colorModel","color","onChange"]),f=(0,external_React_.useRef)(null);Q(f);var v=Y(o,l,i),d=v[0],h=v[1],m=dist_g(["react-colorful",n]);return external_React_.createElement("div",dist_u({},s,{ref:f,className:m}),external_React_.createElement(T,{hsva:d,onChange:h}),external_React_.createElement(dist_S,{hue:d.h,onChange:h,className:"react-colorful__last-control"}))},W={defaultColor:"000",toHsva:dist_x,fromHsva:function(e){return dist_w({h:e.h,s:e.s,v:e.v,a:1})},equal:X},Z=function(r){return e.createElement(U,dist_u({},r,{colorModel:W}))},ee=function(r){var t=r.className,n=r.hsva,o=r.onChange,a={backgroundImage:"linear-gradient(90deg, "+dist_k(Object.assign({},n,{a:0}))+", "+dist_k(Object.assign({},n,{a:1}))+")"},l=dist_g(["react-colorful__alpha",t]),u=dist_b(100*n.a);return external_React_.createElement("div",{className:l},external_React_.createElement("div",{className:"react-colorful__alpha-gradient",style:a}),external_React_.createElement(dist_m,{onMove:function(e){o({a:e.left})},onKey:function(e){o({a:dist_s(n.a+e.left)})},"aria-label":"Alpha","aria-valuetext":u+"%","aria-valuenow":u,"aria-valuemin":"0","aria-valuemax":"100"},external_React_.createElement(dist_p,{className:"react-colorful__alpha-pointer",left:n.a,color:dist_k(n)})))},re=function(t){var n=t.className,o=t.colorModel,a=t.color,l=void 0===a?o.defaultColor:a,i=t.onChange,s=dist_c(t,["className","colorModel","color","onChange"]),f=(0,external_React_.useRef)(null);Q(f);var v=Y(o,l,i),d=v[0],h=v[1],m=dist_g(["react-colorful",n]);return external_React_.createElement("div",dist_u({},s,{ref:f,className:m}),external_React_.createElement(T,{hsva:d,onChange:h}),external_React_.createElement(dist_S,{hue:d.h,onChange:h}),external_React_.createElement(ee,{hsva:d,onChange:h,className:"react-colorful__last-control"}))},te={defaultColor:"0001",toHsva:dist_x,fromHsva:dist_w,equal:X},ne=function(r){return e.createElement(re,dist_u({},r,{colorModel:te}))},oe={defaultColor:{h:0,s:0,l:0,a:1},toHsva:dist_N,fromHsva:dist_y,equal:F},ae=function(r){return e.createElement(re,dist_u({},r,{colorModel:oe}))},le={defaultColor:"hsla(0, 0%, 0%, 1)",toHsva:dist_H,fromHsva:dist_k,equal:P},ue=function(r){return e.createElement(re,dist_u({},r,{colorModel:le}))},ce={defaultColor:{h:0,s:0,l:0},toHsva:function(e){return dist_N({h:e.h,s:e.s,l:e.l,a:1})},fromHsva:function(e){return{h:(r=dist_y(e)).h,s:r.s,l:r.l};var r},equal:F},ie=function(r){return e.createElement(U,dist_u({},r,{colorModel:ce}))},se={defaultColor:"hsl(0, 0%, 0%)",toHsva:dist_M,fromHsva:q,equal:P},fe=function(r){return e.createElement(U,dist_u({},r,{colorModel:se}))},ve={defaultColor:{h:0,s:0,v:0,a:1},toHsva:function(e){return e},fromHsva:A,equal:F},de=function(r){return e.createElement(re,dist_u({},r,{colorModel:ve}))},he={defaultColor:"hsva(0, 0%, 0%, 1)",toHsva:O,fromHsva:function(e){var r=A(e);return"hsva("+r.h+", "+r.s+"%, "+r.v+"%, "+r.a+")"},equal:P},me=function(r){return e.createElement(re,dist_u({},r,{colorModel:he}))},ge={defaultColor:{h:0,s:0,v:0},toHsva:function(e){return{h:e.h,s:e.s,v:e.v,a:1}},fromHsva:function(e){var r=A(e);return{h:r.h,s:r.s,v:r.v}},equal:F},pe=function(r){return e.createElement(U,dist_u({},r,{colorModel:ge}))},be={defaultColor:"hsv(0, 0%, 0%)",toHsva:dist_j,fromHsva:function(e){var r=A(e);return"hsv("+r.h+", "+r.s+"%, "+r.v+"%)"},equal:P},_e=function(r){return e.createElement(U,dist_u({},r,{colorModel:be}))},xe={defaultColor:{r:0,g:0,b:0,a:1},toHsva:L,fromHsva:dist_I,equal:F},Ce=function(r){return e.createElement(re,dist_u({},r,{colorModel:xe}))},Ee={defaultColor:"rgba(0, 0, 0, 1)",toHsva:z,fromHsva:function(e){var r=dist_I(e);return"rgba("+r.r+", "+r.g+", "+r.b+", "+r.a+")"},equal:P},He=function(r){return external_React_.createElement(re,dist_u({},r,{colorModel:Ee}))},Me={defaultColor:{r:0,g:0,b:0},toHsva:function(e){return L({r:e.r,g:e.g,b:e.b,a:1})},fromHsva:function(e){return{r:(r=dist_I(e)).r,g:r.g,b:r.b};var r},equal:F},Ne=function(r){return e.createElement(U,dist_u({},r,{colorModel:Me}))},we={defaultColor:"rgb(0, 0, 0)",toHsva:B,fromHsva:function(e){var r=dist_I(e);return"rgb("+r.r+", "+r.g+", "+r.b+")"},equal:P},ye=function(r){return external_React_.createElement(U,dist_u({},r,{colorModel:we}))},qe=/^#?([0-9A-F]{3,8})$/i,ke=function(r){var t=r.color,l=void 0===t?"":t,s=r.onChange,f=r.onBlur,v=r.escape,d=r.validate,h=r.format,m=r.process,g=dist_c(r,["color","onChange","onBlur","escape","validate","format","process"]),p=o(function(){return v(l)}),b=p[0],_=p[1],x=dist_i(s),C=dist_i(f),E=a(function(e){var r=v(e.target.value);_(r),d(r)&&x(m?m(r):r)},[v,m,d,x]),H=a(function(e){d(e.target.value)||_(v(l)),C(e)},[l,v,d,C]);return n(function(){_(v(l))},[l,v]),e.createElement("input",dist_u({},g,{value:h?h(b):b,spellCheck:"false",onChange:E,onBlur:H}))},Ie=function(e){return"#"+e},Oe=function(r){var t=r.prefixed,n=r.alpha,o=dist_c(r,["prefixed","alpha"]),l=a(function(e){return e.replace(/([^0-9A-F]+)/gi,"").substring(0,n?8:6)},[n]),i=a(function(e){return function(e,r){var t=qe.exec(e),n=t?t[1].length:0;return 3===n||6===n||!!r&&4===n||!!r&&8===n}(e,n)},[n]);return e.createElement(ke,dist_u({},o,{escape:l,format:t?Ie:void 0,process:Ie,validate:i}))};
38375  //# sourceMappingURL=index.module.js.map
38376  
38377  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/color-picker/picker.js
38378  /**
38379   * External dependencies
38380   */
38381  
38382  
38383  
38384  /**
38385   * WordPress dependencies
38386   */
38387  
38388  /**
38389   * Internal dependencies
38390   */
38391  
38392  const Picker = ({
38393    color,
38394    enableAlpha,
38395    onChange
38396  }) => {
38397    const Component = enableAlpha ? He : ye;
38398    const rgbColor = (0,external_wp_element_namespaceObject.useMemo)(() => color.toRgbString(), [color]);
38399    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Component, {
38400      color: rgbColor,
38401      onChange: nextColor => {
38402        onChange(w(nextColor));
38403      }
38404      // Pointer capture fortifies drag gestures so that they continue to
38405      // work while dragging outside the component over objects like
38406      // iframes. If a newer version of react-colorful begins to employ
38407      // pointer capture this will be redundant and should be removed.
38408      ,
38409      onPointerDown: ({
38410        currentTarget,
38411        pointerId
38412      }) => {
38413        currentTarget.setPointerCapture(pointerId);
38414      },
38415      onPointerUp: ({
38416        currentTarget,
38417        pointerId
38418      }) => {
38419        currentTarget.releasePointerCapture(pointerId);
38420      }
38421    });
38422  };
38423  
38424  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/color-picker/component.js
38425  /**
38426   * External dependencies
38427   */
38428  
38429  
38430  
38431  
38432  /**
38433   * WordPress dependencies
38434   */
38435  
38436  
38437  
38438  
38439  /**
38440   * Internal dependencies
38441   */
38442  
38443  
38444  
38445  
38446  
38447  
38448  
38449  
38450  k([names]);
38451  const options = [{
38452    label: 'RGB',
38453    value: 'rgb'
38454  }, {
38455    label: 'HSL',
38456    value: 'hsl'
38457  }, {
38458    label: 'Hex',
38459    value: 'hex'
38460  }];
38461  const UnconnectedColorPicker = (props, forwardedRef) => {
38462    const {
38463      enableAlpha = false,
38464      color: colorProp,
38465      onChange,
38466      defaultValue = '#fff',
38467      copyFormat,
38468      ...divProps
38469    } = useContextSystem(props, 'ColorPicker');
38470  
38471    // Use a safe default value for the color and remove the possibility of `undefined`.
38472    const [color, setColor] = useControlledValue({
38473      onChange,
38474      value: colorProp,
38475      defaultValue
38476    });
38477    const safeColordColor = (0,external_wp_element_namespaceObject.useMemo)(() => {
38478      return w(color || '');
38479    }, [color]);
38480    const debouncedSetColor = (0,external_wp_compose_namespaceObject.useDebounce)(setColor);
38481    const handleChange = (0,external_wp_element_namespaceObject.useCallback)(nextValue => {
38482      debouncedSetColor(nextValue.toHex());
38483    }, [debouncedSetColor]);
38484    const [colorType, setColorType] = (0,external_wp_element_namespaceObject.useState)(copyFormat || 'hex');
38485    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(ColorfulWrapper, {
38486      ref: forwardedRef,
38487      ...divProps,
38488      children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Picker, {
38489        onChange: handleChange,
38490        color: safeColordColor,
38491        enableAlpha: enableAlpha
38492      }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(AuxiliaryColorArtefactWrapper, {
38493        children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(AuxiliaryColorArtefactHStackHeader, {
38494          justify: "space-between",
38495          children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(styles_SelectControl, {
38496            __nextHasNoMarginBottom: true,
38497            options: options,
38498            value: colorType,
38499            onChange: nextColorType => setColorType(nextColorType),
38500            label: (0,external_wp_i18n_namespaceObject.__)('Color format'),
38501            hideLabelFromVision: true,
38502            variant: "minimal"
38503          }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ColorCopyButton, {
38504            color: safeColordColor,
38505            colorType: copyFormat || colorType
38506          })]
38507        }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ColorInputWrapper, {
38508          direction: "column",
38509          gap: 2,
38510          children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ColorInput, {
38511            colorType: colorType,
38512            color: safeColordColor,
38513            onChange: handleChange,
38514            enableAlpha: enableAlpha
38515          })
38516        })]
38517      })]
38518    });
38519  };
38520  const ColorPicker = contextConnect(UnconnectedColorPicker, 'ColorPicker');
38521  /* harmony default export */ const color_picker_component = (ColorPicker);
38522  
38523  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/color-picker/use-deprecated-props.js
38524  /**
38525   * External dependencies
38526   */
38527  
38528  
38529  
38530  /**
38531   * WordPress dependencies
38532   */
38533  
38534  
38535  /**
38536   * Internal dependencies
38537   */
38538  
38539  function isLegacyProps(props) {
38540    return typeof props.onChangeComplete !== 'undefined' || typeof props.disableAlpha !== 'undefined' || typeof props.color?.hex === 'string';
38541  }
38542  function getColorFromLegacyProps(color) {
38543    if (color === undefined) {
38544      return;
38545    }
38546    if (typeof color === 'string') {
38547      return color;
38548    }
38549    if (color.hex) {
38550      return color.hex;
38551    }
38552    return undefined;
38553  }
38554  const transformColorStringToLegacyColor = memize(color => {
38555    const colordColor = w(color);
38556    const hex = colordColor.toHex();
38557    const rgb = colordColor.toRgb();
38558    const hsv = colordColor.toHsv();
38559    const hsl = colordColor.toHsl();
38560    return {
38561      hex,
38562      rgb,
38563      hsv,
38564      hsl,
38565      source: 'hex',
38566      oldHue: hsl.h
38567    };
38568  });
38569  function use_deprecated_props_useDeprecatedProps(props) {
38570    const {
38571      onChangeComplete
38572    } = props;
38573    const legacyChangeHandler = (0,external_wp_element_namespaceObject.useCallback)(color => {
38574      onChangeComplete(transformColorStringToLegacyColor(color));
38575    }, [onChangeComplete]);
38576    if (isLegacyProps(props)) {
38577      return {
38578        color: getColorFromLegacyProps(props.color),
38579        enableAlpha: !props.disableAlpha,
38580        onChange: legacyChangeHandler
38581      };
38582    }
38583    return {
38584      ...props,
38585      color: props.color,
38586      enableAlpha: props.enableAlpha,
38587      onChange: props.onChange
38588    };
38589  }
38590  
38591  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/color-picker/legacy-adapter.js
38592  /**
38593   * Internal dependencies
38594   */
38595  
38596  
38597  
38598  const LegacyAdapter = props => {
38599    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(color_picker_component, {
38600      ...use_deprecated_props_useDeprecatedProps(props)
38601    });
38602  };
38603  
38604  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/circular-option-picker/circular-option-picker-context.js
38605  /**
38606   * WordPress dependencies
38607   */
38608  
38609  
38610  /**
38611   * Internal dependencies
38612   */
38613  
38614  const CircularOptionPickerContext = (0,external_wp_element_namespaceObject.createContext)({});
38615  
38616  ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/check.js
38617  /**
38618   * WordPress dependencies
38619   */
38620  
38621  
38622  const check = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, {
38623    xmlns: "http://www.w3.org/2000/svg",
38624    viewBox: "0 0 24 24",
38625    children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, {
38626      d: "M16.7 7.1l-6.3 8.5-3.3-2.5-.9 1.2 4.5 3.4L17.9 8z"
38627    })
38628  });
38629  /* harmony default export */ const library_check = (check);
38630  
38631  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/circular-option-picker/circular-option-picker-option.js
38632  /**
38633   * External dependencies
38634   */
38635  
38636  /**
38637   * WordPress dependencies
38638   */
38639  
38640  
38641  
38642  
38643  /**
38644   * Internal dependencies
38645   */
38646  
38647  
38648  
38649  
38650  
38651  
38652  function UnforwardedOptionAsButton(props, forwardedRef) {
38653    const {
38654      isPressed,
38655      ...additionalProps
38656    } = props;
38657    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, {
38658      ...additionalProps,
38659      "aria-pressed": isPressed,
38660      ref: forwardedRef
38661    });
38662  }
38663  const OptionAsButton = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedOptionAsButton);
38664  function UnforwardedOptionAsOption(props, forwardedRef) {
38665    const {
38666      id,
38667      isSelected,
38668      ...additionalProps
38669    } = props;
38670    const {
38671      setActiveId,
38672      activeId
38673    } = (0,external_wp_element_namespaceObject.useContext)(CircularOptionPickerContext);
38674    (0,external_wp_element_namespaceObject.useEffect)(() => {
38675      if (isSelected && !activeId) {
38676        // The setTimeout call is necessary to make sure that this update
38677        // doesn't get overridden by `Composite`'s internal logic, which picks
38678        // an initial active item if one is not specifically set.
38679        window.setTimeout(() => setActiveId?.(id), 0);
38680      }
38681    }, [isSelected, setActiveId, activeId, id]);
38682    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Composite.Item, {
38683      render: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, {
38684        ...additionalProps,
38685        role: "option",
38686        "aria-selected": !!isSelected,
38687        ref: forwardedRef
38688      }),
38689      id: id
38690    });
38691  }
38692  const OptionAsOption = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedOptionAsOption);
38693  function Option({
38694    className,
38695    isSelected,
38696    selectedIconProps = {},
38697    tooltipText,
38698    ...additionalProps
38699  }) {
38700    const {
38701      baseId,
38702      setActiveId
38703    } = (0,external_wp_element_namespaceObject.useContext)(CircularOptionPickerContext);
38704    const id = (0,external_wp_compose_namespaceObject.useInstanceId)(Option, baseId || 'components-circular-option-picker__option');
38705    const commonProps = {
38706      id,
38707      className: 'components-circular-option-picker__option',
38708      ...additionalProps
38709    };
38710    const isListbox = setActiveId !== undefined;
38711    const optionControl = isListbox ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(OptionAsOption, {
38712      ...commonProps,
38713      isSelected: isSelected
38714    }) : /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(OptionAsButton, {
38715      ...commonProps,
38716      isPressed: isSelected
38717    });
38718    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", {
38719      className: dist_clsx(className, 'components-circular-option-picker__option-wrapper'),
38720      children: [tooltipText ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(tooltip, {
38721        text: tooltipText,
38722        children: optionControl
38723      }) : optionControl, isSelected && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(icons_build_module_icon, {
38724        icon: library_check,
38725        ...selectedIconProps
38726      })]
38727    });
38728  }
38729  
38730  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/circular-option-picker/circular-option-picker-option-group.js
38731  /**
38732   * External dependencies
38733   */
38734  
38735  
38736  /**
38737   * Internal dependencies
38738   */
38739  
38740  function OptionGroup({
38741    className,
38742    options,
38743    ...additionalProps
38744  }) {
38745    const role = 'aria-label' in additionalProps || 'aria-labelledby' in additionalProps ? 'group' : undefined;
38746    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", {
38747      ...additionalProps,
38748      role: role,
38749      className: dist_clsx('components-circular-option-picker__option-group', 'components-circular-option-picker__swatches', className),
38750      children: options
38751    });
38752  }
38753  
38754  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/circular-option-picker/circular-option-picker-actions.js
38755  /**
38756   * External dependencies
38757   */
38758  
38759  
38760  /**
38761   * Internal dependencies
38762   */
38763  
38764  
38765  
38766  function DropdownLinkAction({
38767    buttonProps,
38768    className,
38769    dropdownProps,
38770    linkText
38771  }) {
38772    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(dropdown, {
38773      className: dist_clsx('components-circular-option-picker__dropdown-link-action', className),
38774      renderToggle: ({
38775        isOpen,
38776        onToggle
38777      }) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, {
38778        "aria-expanded": isOpen,
38779        "aria-haspopup": "true",
38780        onClick: onToggle,
38781        variant: "link",
38782        ...buttonProps,
38783        children: linkText
38784      }),
38785      ...dropdownProps
38786    });
38787  }
38788  function ButtonAction({
38789    className,
38790    children,
38791    ...additionalProps
38792  }) {
38793    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, {
38794      className: dist_clsx('components-circular-option-picker__clear', className),
38795      variant: "tertiary",
38796      ...additionalProps,
38797      children: children
38798    });
38799  }
38800  
38801  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/circular-option-picker/circular-option-picker.js
38802  /**
38803   * External dependencies
38804   */
38805  
38806  
38807  /**
38808   * WordPress dependencies
38809   */
38810  
38811  
38812  
38813  
38814  /**
38815   * Internal dependencies
38816   */
38817  
38818  
38819  
38820  
38821  
38822  
38823  /**
38824   *`CircularOptionPicker` is a component that displays a set of options as circular buttons.
38825   *
38826   * ```jsx
38827   * import { CircularOptionPicker } from '../circular-option-picker';
38828   * import { useState } from '@wordpress/element';
38829   *
38830   * const Example = () => {
38831   *     const [ currentColor, setCurrentColor ] = useState();
38832   *     const colors = [
38833   *         { color: '#f00', name: 'Red' },
38834   *         { color: '#0f0', name: 'Green' },
38835   *         { color: '#00f', name: 'Blue' },
38836   *     ];
38837   *     const colorOptions = (
38838   *         <>
38839   *             { colors.map( ( { color, name }, index ) => {
38840   *                 return (
38841   *                     <CircularOptionPicker.Option
38842   *                         key={ `${ color }-${ index }` }
38843   *                         tooltipText={ name }
38844   *                         style={ { backgroundColor: color, color } }
38845   *                         isSelected={ index === currentColor }
38846   *                         onClick={ () => setCurrentColor( index ) }
38847   *                         aria-label={ name }
38848   *                     />
38849   *                 );
38850   *             } ) }
38851   *         </>
38852   *     );
38853   *     return (
38854   *         <CircularOptionPicker
38855   *                 options={ colorOptions }
38856   *                 actions={
38857   *                     <CircularOptionPicker.ButtonAction
38858   *                         onClick={ () => setCurrentColor( undefined ) }
38859   *                     >
38860   *                         { 'Clear' }
38861   *                     </CircularOptionPicker.ButtonAction>
38862   *                 }
38863   *             />
38864   *     );
38865   * };
38866   * ```
38867   */
38868  
38869  
38870  function ListboxCircularOptionPicker(props) {
38871    const {
38872      actions,
38873      options,
38874      baseId,
38875      className,
38876      loop = true,
38877      children,
38878      ...additionalProps
38879    } = props;
38880    const [activeId, setActiveId] = (0,external_wp_element_namespaceObject.useState)(undefined);
38881    const contextValue = (0,external_wp_element_namespaceObject.useMemo)(() => ({
38882      baseId,
38883      activeId,
38884      setActiveId
38885    }), [baseId, activeId, setActiveId]);
38886    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", {
38887      className: className,
38888      children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(CircularOptionPickerContext.Provider, {
38889        value: contextValue,
38890        children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Composite, {
38891          ...additionalProps,
38892          id: baseId,
38893          focusLoop: loop,
38894          rtl: (0,external_wp_i18n_namespaceObject.isRTL)(),
38895          role: "listbox",
38896          activeId: activeId,
38897          setActiveId: setActiveId,
38898          children: options
38899        }), children, actions]
38900      })
38901    });
38902  }
38903  function ButtonsCircularOptionPicker(props) {
38904    const {
38905      actions,
38906      options,
38907      children,
38908      baseId,
38909      ...additionalProps
38910    } = props;
38911    const contextValue = (0,external_wp_element_namespaceObject.useMemo)(() => ({
38912      baseId
38913    }), [baseId]);
38914    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", {
38915      ...additionalProps,
38916      id: baseId,
38917      children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(CircularOptionPickerContext.Provider, {
38918        value: contextValue,
38919        children: [options, children, actions]
38920      })
38921    });
38922  }
38923  function CircularOptionPicker(props) {
38924    const {
38925      asButtons,
38926      actions: actionsProp,
38927      options: optionsProp,
38928      children,
38929      className,
38930      ...additionalProps
38931    } = props;
38932    const baseId = (0,external_wp_compose_namespaceObject.useInstanceId)(CircularOptionPicker, 'components-circular-option-picker', additionalProps.id);
38933    const OptionPickerImplementation = asButtons ? ButtonsCircularOptionPicker : ListboxCircularOptionPicker;
38934    const actions = actionsProp ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", {
38935      className: "components-circular-option-picker__custom-clear-wrapper",
38936      children: actionsProp
38937    }) : undefined;
38938    const options = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", {
38939      className: "components-circular-option-picker__swatches",
38940      children: optionsProp
38941    });
38942    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(OptionPickerImplementation, {
38943      ...additionalProps,
38944      baseId: baseId,
38945      className: dist_clsx('components-circular-option-picker', className),
38946      actions: actions,
38947      options: options,
38948      children: children
38949    });
38950  }
38951  CircularOptionPicker.Option = Option;
38952  CircularOptionPicker.OptionGroup = OptionGroup;
38953  CircularOptionPicker.ButtonAction = ButtonAction;
38954  CircularOptionPicker.DropdownLinkAction = DropdownLinkAction;
38955  /* harmony default export */ const circular_option_picker = (CircularOptionPicker);
38956  
38957  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/circular-option-picker/index.js
38958  /**
38959   * Internal dependencies
38960   */
38961  
38962  
38963  
38964  
38965  /* harmony default export */ const build_module_circular_option_picker = (circular_option_picker);
38966  
38967  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/v-stack/hook.js
38968  /**
38969   * Internal dependencies
38970   */
38971  
38972  
38973  
38974  function useVStack(props) {
38975    const {
38976      expanded = false,
38977      alignment = 'stretch',
38978      ...otherProps
38979    } = useContextSystem(props, 'VStack');
38980    const hStackProps = useHStack({
38981      direction: 'column',
38982      expanded,
38983      alignment,
38984      ...otherProps
38985    });
38986    return hStackProps;
38987  }
38988  
38989  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/v-stack/component.js
38990  /**
38991   * External dependencies
38992   */
38993  
38994  /**
38995   * Internal dependencies
38996   */
38997  
38998  
38999  
39000  
39001  
39002  function UnconnectedVStack(props, forwardedRef) {
39003    const vStackProps = useVStack(props);
39004    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(component, {
39005      ...vStackProps,
39006      ref: forwardedRef
39007    });
39008  }
39009  
39010  /**
39011   * `VStack` (or Vertical Stack) is a layout component that arranges child
39012   * elements in a vertical line.
39013   *
39014   * `VStack` can render anything inside.
39015   *
39016   * ```jsx
39017   * import {
39018   *     __experimentalText as Text,
39019   *     __experimentalVStack as VStack,
39020   * } from `@wordpress/components`;
39021   *
39022   * function Example() {
39023   *     return (
39024   *         <VStack>
39025   *             <Text>Code</Text>
39026   *             <Text>is</Text>
39027   *             <Text>Poetry</Text>
39028   *         </VStack>
39029   *     );
39030   * }
39031   * ```
39032   */
39033  const VStack = contextConnect(UnconnectedVStack, 'VStack');
39034  /* harmony default export */ const v_stack_component = (VStack);
39035  
39036  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/truncate/component.js
39037  /**
39038   * External dependencies
39039   */
39040  
39041  /**
39042   * Internal dependencies
39043   */
39044  
39045  
39046  
39047  
39048  
39049  function UnconnectedTruncate(props, forwardedRef) {
39050    const truncateProps = useTruncate(props);
39051    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(component, {
39052      as: "span",
39053      ...truncateProps,
39054      ref: forwardedRef
39055    });
39056  }
39057  
39058  /**
39059   * `Truncate` is a typography primitive that trims text content.
39060   * For almost all cases, it is recommended that `Text`, `Heading`, or
39061   * `Subheading` is used to render text content. However,`Truncate` is
39062   * available for custom implementations.
39063   *
39064   * ```jsx
39065   * import { __experimentalTruncate as Truncate } from `@wordpress/components`;
39066   *
39067   * function Example() {
39068   *     return (
39069   *         <Truncate>
39070   *             Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc ex
39071   *             neque, vulputate a diam et, luctus convallis lacus. Vestibulum ac
39072   *             mollis mi. Morbi id elementum massa.
39073   *         </Truncate>
39074   *     );
39075   * }
39076   * ```
39077   */
39078  const component_Truncate = contextConnect(UnconnectedTruncate, 'Truncate');
39079  /* harmony default export */ const truncate_component = (component_Truncate);
39080  
39081  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/heading/hook.js
39082  /**
39083   * Internal dependencies
39084   */
39085  
39086  
39087  
39088  
39089  
39090  function useHeading(props) {
39091    const {
39092      as: asProp,
39093      level = 2,
39094      color = COLORS.gray[900],
39095      isBlock = true,
39096      weight = config_values.fontWeightHeading,
39097      ...otherProps
39098    } = useContextSystem(props, 'Heading');
39099    const as = asProp || `h$level}`;
39100    const a11yProps = {};
39101    if (typeof as === 'string' && as[0] !== 'h') {
39102      // If not a semantic `h` element, add a11y props:
39103      a11yProps.role = 'heading';
39104      a11yProps['aria-level'] = typeof level === 'string' ? parseInt(level) : level;
39105    }
39106    const textProps = useText({
39107      color,
39108      isBlock,
39109      weight,
39110      size: getHeadingFontSize(level),
39111      ...otherProps
39112    });
39113    return {
39114      ...textProps,
39115      ...a11yProps,
39116      as
39117    };
39118  }
39119  
39120  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/heading/component.js
39121  /**
39122   * External dependencies
39123   */
39124  
39125  /**
39126   * Internal dependencies
39127   */
39128  
39129  
39130  
39131  
39132  
39133  function UnconnectedHeading(props, forwardedRef) {
39134    const headerProps = useHeading(props);
39135    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(component, {
39136      ...headerProps,
39137      ref: forwardedRef
39138    });
39139  }
39140  
39141  /**
39142   * `Heading` renders headings and titles using the library's typography system.
39143   *
39144   * ```jsx
39145   * import { __experimentalHeading as Heading } from "@wordpress/components";
39146   *
39147   * function Example() {
39148   *   return <Heading>Code is Poetry</Heading>;
39149   * }
39150   * ```
39151   */
39152  const Heading = contextConnect(UnconnectedHeading, 'Heading');
39153  /* harmony default export */ const heading_component = (Heading);
39154  
39155  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/color-palette/styles.js
39156  
39157  function color_palette_styles_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)."; }
39158  /**
39159   * External dependencies
39160   */
39161  
39162  /**
39163   * Internal dependencies
39164   */
39165  
39166  const ColorHeading = /*#__PURE__*/emotion_styled_base_browser_esm(heading_component,  true ? {
39167    target: "ev9wop70"
39168  } : 0)( true ? {
39169    name: "13lxv2o",
39170    styles: "text-transform:uppercase;line-height:24px;font-weight:500;&&&{font-size:11px;margin-bottom:0;}"
39171  } : 0);
39172  
39173  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/dropdown/styles.js
39174  
39175  /**
39176   * External dependencies
39177   */
39178  
39179  /**
39180   * Internal dependencies
39181   */
39182  
39183  const padding = ({
39184    paddingSize = 'small'
39185  }) => {
39186    if (paddingSize === 'none') {
39187      return;
39188    }
39189    const paddingValues = {
39190      small: space(2),
39191      medium: space(4)
39192    };
39193    return /*#__PURE__*/emotion_react_browser_esm_css("padding:", paddingValues[paddingSize] || paddingValues.small, ";" + ( true ? "" : 0),  true ? "" : 0);
39194  };
39195  const DropdownContentWrapperDiv = /*#__PURE__*/emotion_styled_base_browser_esm("div",  true ? {
39196    target: "eovvns30"
39197  } : 0)("margin-left:", space(-2), ";margin-right:", space(-2), ";&:first-of-type{margin-top:", space(-2), ";}&:last-of-type{margin-bottom:", space(-2), ";}", padding, ";" + ( true ? "" : 0));
39198  
39199  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/dropdown/dropdown-content-wrapper.js
39200  /**
39201   * External dependencies
39202   */
39203  
39204  /**
39205   * Internal dependencies
39206   */
39207  
39208  
39209  
39210  
39211  function UnconnectedDropdownContentWrapper(props, forwardedRef) {
39212    const {
39213      paddingSize = 'small',
39214      ...derivedProps
39215    } = useContextSystem(props, 'DropdownContentWrapper');
39216    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(DropdownContentWrapperDiv, {
39217      ...derivedProps,
39218      paddingSize: paddingSize,
39219      ref: forwardedRef
39220    });
39221  }
39222  
39223  /**
39224   * A convenience wrapper for the `renderContent` when you want to apply
39225   * different padding. (Default is `paddingSize="small"`).
39226   *
39227   * ```jsx
39228   * import {
39229   *   Dropdown,
39230   *   __experimentalDropdownContentWrapper as DropdownContentWrapper,
39231   * } from '@wordpress/components';
39232   *
39233   * <Dropdown
39234   *   renderContent={ () => (
39235   *     <DropdownContentWrapper paddingSize="medium">
39236   *       My dropdown content
39237   *     </DropdownContentWrapper>
39238   * ) }
39239   * />
39240   * ```
39241   */
39242  const DropdownContentWrapper = contextConnect(UnconnectedDropdownContentWrapper, 'DropdownContentWrapper');
39243  /* harmony default export */ const dropdown_content_wrapper = (DropdownContentWrapper);
39244  
39245  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/color-palette/utils.js
39246  /**
39247   * External dependencies
39248   */
39249  
39250  
39251  
39252  
39253  /**
39254   * WordPress dependencies
39255   */
39256  
39257  
39258  /**
39259   * Internal dependencies
39260   */
39261  
39262  k([names, a11y]);
39263  
39264  /**
39265   * Checks if a color value is a simple CSS color.
39266   *
39267   * @param value The color value to check.
39268   * @return A boolean indicating whether the color value is a simple CSS color.
39269   */
39270  const isSimpleCSSColor = value => {
39271    const valueIsCssVariable = /var\(/.test(value !== null && value !== void 0 ? value : '');
39272    const valueIsColorMix = /color-mix\(/.test(value !== null && value !== void 0 ? value : '');
39273    return !valueIsCssVariable && !valueIsColorMix;
39274  };
39275  const extractColorNameFromCurrentValue = (currentValue, colors = [], showMultiplePalettes = false) => {
39276    if (!currentValue) {
39277      return '';
39278    }
39279    const currentValueIsSimpleColor = currentValue ? isSimpleCSSColor(currentValue) : false;
39280    const normalizedCurrentValue = currentValueIsSimpleColor ? w(currentValue).toHex() : currentValue;
39281  
39282    // Normalize format of `colors` to simplify the following loop
39283  
39284    const colorPalettes = showMultiplePalettes ? colors : [{
39285      colors: colors
39286    }];
39287    for (const {
39288      colors: paletteColors
39289    } of colorPalettes) {
39290      for (const {
39291        name: colorName,
39292        color: colorValue
39293      } of paletteColors) {
39294        const normalizedColorValue = currentValueIsSimpleColor ? w(colorValue).toHex() : colorValue;
39295        if (normalizedCurrentValue === normalizedColorValue) {
39296          return colorName;
39297        }
39298      }
39299    }
39300  
39301    // translators: shown when the user has picked a custom color (i.e not in the palette of colors).
39302    return (0,external_wp_i18n_namespaceObject.__)('Custom');
39303  };
39304  
39305  // The PaletteObject type has a `colors` property (an array of ColorObject),
39306  // while the ColorObject type has a `color` property (the CSS color value).
39307  const isMultiplePaletteObject = obj => Array.isArray(obj.colors) && !('color' in obj);
39308  const isMultiplePaletteArray = arr => {
39309    return arr.length > 0 && arr.every(colorObj => isMultiplePaletteObject(colorObj));
39310  };
39311  
39312  /**
39313   * Transform a CSS variable used as background color into the color value itself.
39314   *
39315   * @param value   The color value that may be a CSS variable.
39316   * @param element The element for which to get the computed style.
39317   * @return The background color value computed from a element.
39318   */
39319  const normalizeColorValue = (value, element) => {
39320    if (!value || !element || isSimpleCSSColor(value)) {
39321      return value;
39322    }
39323    const {
39324      ownerDocument
39325    } = element;
39326    const {
39327      defaultView
39328    } = ownerDocument;
39329    const computedBackgroundColor = defaultView?.getComputedStyle(element).backgroundColor;
39330    return computedBackgroundColor ? w(computedBackgroundColor).toHex() : value;
39331  };
39332  
39333  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/color-palette/index.js
39334  /**
39335   * External dependencies
39336   */
39337  
39338  
39339  
39340  
39341  
39342  
39343  /**
39344   * WordPress dependencies
39345   */
39346  
39347  
39348  
39349  
39350  /**
39351   * Internal dependencies
39352   */
39353  
39354  
39355  
39356  
39357  
39358  
39359  
39360  
39361  
39362  
39363  k([names, a11y]);
39364  function SinglePalette({
39365    className,
39366    clearColor,
39367    colors,
39368    onChange,
39369    value,
39370    ...additionalProps
39371  }) {
39372    const colorOptions = (0,external_wp_element_namespaceObject.useMemo)(() => {
39373      return colors.map(({
39374        color,
39375        name
39376      }, index) => {
39377        const colordColor = w(color);
39378        const isSelected = value === color;
39379        return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_circular_option_picker.Option, {
39380          isSelected: isSelected,
39381          selectedIconProps: isSelected ? {
39382            fill: colordColor.contrast() > colordColor.contrast('#000') ? '#fff' : '#000'
39383          } : {},
39384          tooltipText: name ||
39385          // translators: %s: color hex code e.g: "#f00".
39386          (0,external_wp_i18n_namespaceObject.sprintf)((0,external_wp_i18n_namespaceObject.__)('Color code: %s'), color),
39387          style: {
39388            backgroundColor: color,
39389            color
39390          },
39391          onClick: isSelected ? clearColor : () => onChange(color, index),
39392          "aria-label": name ?
39393          // translators: %s: The name of the color e.g: "vivid red".
39394          (0,external_wp_i18n_namespaceObject.sprintf)((0,external_wp_i18n_namespaceObject.__)('Color: %s'), name) :
39395          // translators: %s: color hex code e.g: "#f00".
39396          (0,external_wp_i18n_namespaceObject.sprintf)((0,external_wp_i18n_namespaceObject.__)('Color code: %s'), color)
39397        }, `$color}-$index}`);
39398      });
39399    }, [colors, value, onChange, clearColor]);
39400    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_circular_option_picker.OptionGroup, {
39401      className: className,
39402      options: colorOptions,
39403      ...additionalProps
39404    });
39405  }
39406  function MultiplePalettes({
39407    className,
39408    clearColor,
39409    colors,
39410    onChange,
39411    value,
39412    headingLevel
39413  }) {
39414    const instanceId = (0,external_wp_compose_namespaceObject.useInstanceId)(MultiplePalettes, 'color-palette');
39415    if (colors.length === 0) {
39416      return null;
39417    }
39418    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(v_stack_component, {
39419      spacing: 3,
39420      className: className,
39421      children: colors.map(({
39422        name,
39423        colors: colorPalette
39424      }, index) => {
39425        const id = `$instanceId}-$index}`;
39426        return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(v_stack_component, {
39427          spacing: 2,
39428          children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ColorHeading, {
39429            id: id,
39430            level: headingLevel,
39431            children: name
39432          }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(SinglePalette, {
39433            clearColor: clearColor,
39434            colors: colorPalette,
39435            onChange: newColor => onChange(newColor, index),
39436            value: value,
39437            "aria-labelledby": id
39438          })]
39439        }, index);
39440      })
39441    });
39442  }
39443  function CustomColorPickerDropdown({
39444    isRenderedInSidebar,
39445    popoverProps: receivedPopoverProps,
39446    ...props
39447  }) {
39448    const popoverProps = (0,external_wp_element_namespaceObject.useMemo)(() => ({
39449      shift: true,
39450      // Disabling resize as it would otherwise cause the popover to show
39451      // scrollbars while dragging the color picker's handle close to the
39452      // popover edge.
39453      resize: false,
39454      ...(isRenderedInSidebar ? {
39455        // When in the sidebar: open to the left (stacking),
39456        // leaving the same gap as the parent popover.
39457        placement: 'left-start',
39458        offset: 34
39459      } : {
39460        // Default behavior: open below the anchor
39461        placement: 'bottom',
39462        offset: 8
39463      }),
39464      ...receivedPopoverProps
39465    }), [isRenderedInSidebar, receivedPopoverProps]);
39466    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(dropdown, {
39467      contentClassName: "components-color-palette__custom-color-dropdown-content",
39468      popoverProps: popoverProps,
39469      ...props
39470    });
39471  }
39472  function UnforwardedColorPalette(props, forwardedRef) {
39473    const {
39474      asButtons,
39475      loop,
39476      clearable = true,
39477      colors = [],
39478      disableCustomColors = false,
39479      enableAlpha = false,
39480      onChange,
39481      value,
39482      __experimentalIsRenderedInSidebar = false,
39483      headingLevel = 2,
39484      'aria-label': ariaLabel,
39485      'aria-labelledby': ariaLabelledby,
39486      ...additionalProps
39487    } = props;
39488    const [normalizedColorValue, setNormalizedColorValue] = (0,external_wp_element_namespaceObject.useState)(value);
39489    const clearColor = (0,external_wp_element_namespaceObject.useCallback)(() => onChange(undefined), [onChange]);
39490    const customColorPaletteCallbackRef = (0,external_wp_element_namespaceObject.useCallback)(node => {
39491      setNormalizedColorValue(normalizeColorValue(value, node));
39492    }, [value]);
39493    const hasMultipleColorOrigins = isMultiplePaletteArray(colors);
39494    const buttonLabelName = (0,external_wp_element_namespaceObject.useMemo)(() => extractColorNameFromCurrentValue(value, colors, hasMultipleColorOrigins), [value, colors, hasMultipleColorOrigins]);
39495    const renderCustomColorPicker = () => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(dropdown_content_wrapper, {
39496      paddingSize: "none",
39497      children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(LegacyAdapter, {
39498        color: normalizedColorValue,
39499        onChange: color => onChange(color),
39500        enableAlpha: enableAlpha
39501      })
39502    });
39503    const isHex = value?.startsWith('#');
39504  
39505    // Leave hex values as-is. Remove the `var()` wrapper from CSS vars.
39506    const displayValue = value?.replace(/^var\((.+)\)$/, '$1');
39507    const customColorAccessibleLabel = !!displayValue ? (0,external_wp_i18n_namespaceObject.sprintf)(
39508    // translators: 1: The name of the color e.g: "vivid red". 2: The color's hex code e.g: "#f00".
39509    (0,external_wp_i18n_namespaceObject.__)('Custom color picker. The currently selected color is called "%1$s" and has a value of "%2$s".'), buttonLabelName, displayValue) : (0,external_wp_i18n_namespaceObject.__)('Custom color picker.');
39510    const paletteCommonProps = {
39511      clearColor,
39512      onChange,
39513      value
39514    };
39515    const actions = !!clearable && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_circular_option_picker.ButtonAction, {
39516      onClick: clearColor,
39517      children: (0,external_wp_i18n_namespaceObject.__)('Clear')
39518    });
39519    let metaProps;
39520    if (asButtons) {
39521      metaProps = {
39522        asButtons: true
39523      };
39524    } else {
39525      const _metaProps = {
39526        asButtons: false,
39527        loop
39528      };
39529      if (ariaLabel) {
39530        metaProps = {
39531          ..._metaProps,
39532          'aria-label': ariaLabel
39533        };
39534      } else if (ariaLabelledby) {
39535        metaProps = {
39536          ..._metaProps,
39537          'aria-labelledby': ariaLabelledby
39538        };
39539      } else {
39540        metaProps = {
39541          ..._metaProps,
39542          'aria-label': (0,external_wp_i18n_namespaceObject.__)('Custom color picker.')
39543        };
39544      }
39545    }
39546    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(v_stack_component, {
39547      spacing: 3,
39548      ref: forwardedRef,
39549      ...additionalProps,
39550      children: [!disableCustomColors && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(CustomColorPickerDropdown, {
39551        isRenderedInSidebar: __experimentalIsRenderedInSidebar,
39552        renderContent: renderCustomColorPicker,
39553        renderToggle: ({
39554          isOpen,
39555          onToggle
39556        }) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(v_stack_component, {
39557          className: "components-color-palette__custom-color-wrapper",
39558          spacing: 0,
39559          children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("button", {
39560            ref: customColorPaletteCallbackRef,
39561            className: "components-color-palette__custom-color-button",
39562            "aria-expanded": isOpen,
39563            "aria-haspopup": "true",
39564            onClick: onToggle,
39565            "aria-label": customColorAccessibleLabel,
39566            style: {
39567              background: value
39568            },
39569            type: "button"
39570          }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(v_stack_component, {
39571            className: "components-color-palette__custom-color-text-wrapper",
39572            spacing: 0.5,
39573            children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(truncate_component, {
39574              className: "components-color-palette__custom-color-name",
39575              children: value ? buttonLabelName : (0,external_wp_i18n_namespaceObject.__)('No color selected')
39576            }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(truncate_component, {
39577              className: dist_clsx('components-color-palette__custom-color-value', {
39578                'components-color-palette__custom-color-value--is-hex': isHex
39579              }),
39580              children: displayValue
39581            })]
39582          })]
39583        })
39584      }), (colors.length > 0 || actions) && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_circular_option_picker, {
39585        ...metaProps,
39586        actions: actions,
39587        options: hasMultipleColorOrigins ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(MultiplePalettes, {
39588          ...paletteCommonProps,
39589          headingLevel: headingLevel,
39590          colors: colors,
39591          value: value
39592        }) : /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(SinglePalette, {
39593          ...paletteCommonProps,
39594          colors: colors,
39595          value: value
39596        })
39597      })]
39598    });
39599  }
39600  
39601  /**
39602   * Allows the user to pick a color from a list of pre-defined color entries.
39603   *
39604   * ```jsx
39605   * import { ColorPalette } from '@wordpress/components';
39606   * import { useState } from '@wordpress/element';
39607   *
39608   * const MyColorPalette = () => {
39609   *   const [ color, setColor ] = useState ( '#f00' )
39610   *   const colors = [
39611   *     { name: 'red', color: '#f00' },
39612   *     { name: 'white', color: '#fff' },
39613   *     { name: 'blue', color: '#00f' },
39614   *   ];
39615   *   return (
39616   *     <ColorPalette
39617   *       colors={ colors }
39618   *       value={ color }
39619   *       onChange={ ( color ) => setColor( color ) }
39620   *     />
39621   *   );
39622   * } );
39623   * ```
39624   */
39625  const ColorPalette = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedColorPalette);
39626  /* harmony default export */ const color_palette = (ColorPalette);
39627  
39628  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/unit-control/styles/unit-control-styles.js
39629  
39630  /**
39631   * External dependencies
39632   */
39633  
39634  /**
39635   * Internal dependencies
39636   */
39637  
39638  
39639  
39640  
39641  
39642  // Using `selectSize` instead of `size` to avoid a type conflict with the
39643  // `size` HTML attribute of the `select` element.
39644  
39645  // TODO: Resolve need to use &&& to increase specificity
39646  // https://github.com/WordPress/gutenberg/issues/18483
39647  
39648  const ValueInput = /*#__PURE__*/emotion_styled_base_browser_esm(number_control,  true ? {
39649    target: "e1bagdl32"
39650  } : 0)("&&&{input{display:block;width:100%;}", BackdropUI, "{transition:box-shadow 0.1s linear;}}" + ( true ? "" : 0));
39651  const baseUnitLabelStyles = ({
39652    selectSize
39653  }) => {
39654    const sizes = {
39655      small: /*#__PURE__*/emotion_react_browser_esm_css("box-sizing:border-box;padding:2px 1px;width:20px;font-size:8px;line-height:1;letter-spacing:-0.5px;text-transform:uppercase;text-align-last:center;&:not( :disabled ){color:", COLORS.gray[800], ";}" + ( true ? "" : 0),  true ? "" : 0),
39656      default: /*#__PURE__*/emotion_react_browser_esm_css("box-sizing:border-box;min-width:24px;max-width:48px;height:24px;margin-inline-end:", space(2), ";padding:", space(1), ";font-size:13px;line-height:1;text-align-last:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;field-sizing:content;&:not( :disabled ){color:", COLORS.theme.accent, ";}" + ( true ? "" : 0),  true ? "" : 0)
39657    };
39658    return sizes[selectSize];
39659  };
39660  const UnitLabel = /*#__PURE__*/emotion_styled_base_browser_esm("div",  true ? {
39661    target: "e1bagdl31"
39662  } : 0)("&&&{pointer-events:none;", baseUnitLabelStyles, ";color:", COLORS.gray[900], ";}" + ( true ? "" : 0));
39663  const unitSelectSizes = ({
39664    selectSize = 'default'
39665  }) => {
39666    const sizes = {
39667      small: /*#__PURE__*/emotion_react_browser_esm_css("height:100%;border:1px solid transparent;transition:box-shadow 0.1s linear,border 0.1s linear;", rtl({
39668        borderTopLeftRadius: 0,
39669        borderBottomLeftRadius: 0
39670      })(), " &:not(:disabled):hover{background-color:", COLORS.gray[100], ";}&:focus{border:1px solid ", COLORS.ui.borderFocus, ";box-shadow:inset 0 0 0 ", config_values.borderWidth + ' ' + COLORS.ui.borderFocus, ";outline-offset:0;outline:2px solid transparent;z-index:1;}" + ( true ? "" : 0),  true ? "" : 0),
39671      default: /*#__PURE__*/emotion_react_browser_esm_css("display:flex;justify-content:center;align-items:center;&:where( :not( :disabled ) ):hover{box-shadow:0 0 0 ", config_values.borderWidth + ' ' + COLORS.ui.borderFocus, ";outline:", config_values.borderWidth, " solid transparent;}&:focus{box-shadow:0 0 0 ", config_values.borderWidthFocus + ' ' + COLORS.ui.borderFocus, ";outline:", config_values.borderWidthFocus, " solid transparent;}" + ( true ? "" : 0),  true ? "" : 0)
39672    };
39673    return sizes[selectSize];
39674  };
39675  const UnitSelect = /*#__PURE__*/emotion_styled_base_browser_esm("select",  true ? {
39676    target: "e1bagdl30"
39677  } : 0)("&&&{appearance:none;background:transparent;border-radius:", config_values.radiusXSmall, ";border:none;display:block;outline:none;margin:0;min-height:auto;font-family:inherit;", baseUnitLabelStyles, ";", unitSelectSizes, ";&:not( :disabled ){cursor:pointer;}}" + ( true ? "" : 0));
39678  
39679  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/border-control/styles.js
39680  /**
39681   * External dependencies
39682   */
39683  
39684  
39685  /**
39686   * Internal dependencies
39687   */
39688  
39689  
39690  
39691  
39692  const focusBoxShadow = /*#__PURE__*/emotion_react_browser_esm_css("box-shadow:inset ", config_values.controlBoxShadowFocus, ";" + ( true ? "" : 0),  true ? "" : 0);
39693  const borderControl = /*#__PURE__*/emotion_react_browser_esm_css("border:0;padding:0;margin:0;", boxSizingReset, ";" + ( true ? "" : 0),  true ? "" : 0);
39694  const innerWrapper = () => /*#__PURE__*/emotion_react_browser_esm_css(ValueInput, "{flex:1 1 40%;}&& ", UnitSelect, "{min-height:0;}" + ( true ? "" : 0),  true ? "" : 0);
39695  
39696  /*
39697   * This style is only applied to the UnitControl wrapper when the border width
39698   * field should be a set width. Omitting this allows the UnitControl &
39699   * RangeControl to share the available width in a 40/60 split respectively.
39700   */
39701  const styles_wrapperWidth = /*#__PURE__*/emotion_react_browser_esm_css(ValueInput, "{flex:0 0 auto;}" + ( true ? "" : 0),  true ? "" : 0);
39702  const wrapperHeight = size => {
39703    return /*#__PURE__*/emotion_react_browser_esm_css("height:", size === '__unstable-large' ? '40px' : '30px', ";" + ( true ? "" : 0),  true ? "" : 0);
39704  };
39705  const borderControlDropdown = /*#__PURE__*/emotion_react_browser_esm_css("background:#fff;&&>button{aspect-ratio:1;padding:0;display:flex;align-items:center;justify-content:center;", rtl({
39706    borderRadius: `2px 0 0 2px`
39707  }, {
39708    borderRadius: `0 2px 2px 0`
39709  })(), " border:", config_values.borderWidth, " solid ", COLORS.ui.border, ";&:focus,&:hover:not( :disabled ){", focusBoxShadow, " border-color:", COLORS.ui.borderFocus, ";z-index:1;position:relative;}}" + ( true ? "" : 0),  true ? "" : 0);
39710  const colorIndicatorBorder = border => {
39711    const {
39712      color,
39713      style
39714    } = border || {};
39715    const fallbackColor = !!style && style !== 'none' ? COLORS.gray[300] : undefined;
39716    return /*#__PURE__*/emotion_react_browser_esm_css("border-style:", style === 'none' ? 'solid' : style, ";border-color:", color || fallbackColor, ";" + ( true ? "" : 0),  true ? "" : 0);
39717  };
39718  const colorIndicatorWrapper = (border, size) => {
39719    const {
39720      style
39721    } = border || {};
39722    return /*#__PURE__*/emotion_react_browser_esm_css("border-radius:", config_values.radiusFull, ";border:2px solid transparent;", style ? colorIndicatorBorder(border) : undefined, " width:", size === '__unstable-large' ? '24px' : '22px', ";height:", size === '__unstable-large' ? '24px' : '22px', ";padding:", size === '__unstable-large' ? '2px' : '1px', ";&>span{height:", space(4), ";width:", space(4), ";background:linear-gradient(\n\t\t\t\t-45deg,\n\t\t\t\ttransparent 48%,\n\t\t\t\trgb( 0 0 0 / 20% ) 48%,\n\t\t\t\trgb( 0 0 0 / 20% ) 52%,\n\t\t\t\ttransparent 52%\n\t\t\t);}" + ( true ? "" : 0),  true ? "" : 0);
39723  };
39724  
39725  // Must equal $color-palette-circle-size from:
39726  // @wordpress/components/src/circular-option-picker/style.scss
39727  const swatchSize = 28;
39728  const swatchGap = 12;
39729  const borderControlPopoverControls = /*#__PURE__*/emotion_react_browser_esm_css("width:", swatchSize * 6 + swatchGap * 5, "px;>div:first-of-type>", StyledLabel, "{margin-bottom:0;}&& ", StyledLabel, "+button:not( .has-text ){min-width:24px;padding:0;}" + ( true ? "" : 0),  true ? "" : 0);
39730  const borderControlPopoverContent = /*#__PURE__*/emotion_react_browser_esm_css( true ? "" : 0,  true ? "" : 0);
39731  const borderColorIndicator = /*#__PURE__*/emotion_react_browser_esm_css( true ? "" : 0,  true ? "" : 0);
39732  const resetButton = /*#__PURE__*/emotion_react_browser_esm_css("justify-content:center;width:100%;&&{border-top:", config_values.borderWidth, " solid ", COLORS.gray[400], ";border-top-left-radius:0;border-top-right-radius:0;height:40px;}" + ( true ? "" : 0),  true ? "" : 0);
39733  const borderSlider = () => /*#__PURE__*/emotion_react_browser_esm_css("flex:1 1 60%;", rtl({
39734    marginRight: space(3)
39735  })(), ";" + ( true ? "" : 0),  true ? "" : 0);
39736  
39737  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/unit-control/utils.js
39738  /**
39739   * WordPress dependencies
39740   */
39741  
39742  
39743  
39744  /**
39745   * Internal dependencies
39746   */
39747  
39748  const isWeb = external_wp_element_namespaceObject.Platform.OS === 'web';
39749  const allUnits = {
39750    px: {
39751      value: 'px',
39752      label: isWeb ? 'px' : (0,external_wp_i18n_namespaceObject.__)('Pixels (px)'),
39753      a11yLabel: (0,external_wp_i18n_namespaceObject.__)('Pixels (px)'),
39754      step: 1
39755    },
39756    '%': {
39757      value: '%',
39758      label: isWeb ? '%' : (0,external_wp_i18n_namespaceObject.__)('Percentage (%)'),
39759      a11yLabel: (0,external_wp_i18n_namespaceObject.__)('Percent (%)'),
39760      step: 0.1
39761    },
39762    em: {
39763      value: 'em',
39764      label: isWeb ? 'em' : (0,external_wp_i18n_namespaceObject.__)('Relative to parent font size (em)'),
39765      a11yLabel: (0,external_wp_i18n_namespaceObject._x)('ems', 'Relative to parent font size (em)'),
39766      step: 0.01
39767    },
39768    rem: {
39769      value: 'rem',
39770      label: isWeb ? 'rem' : (0,external_wp_i18n_namespaceObject.__)('Relative to root font size (rem)'),
39771      a11yLabel: (0,external_wp_i18n_namespaceObject._x)('rems', 'Relative to root font size (rem)'),
39772      step: 0.01
39773    },
39774    vw: {
39775      value: 'vw',
39776      label: isWeb ? 'vw' : (0,external_wp_i18n_namespaceObject.__)('Viewport width (vw)'),
39777      a11yLabel: (0,external_wp_i18n_namespaceObject.__)('Viewport width (vw)'),
39778      step: 0.1
39779    },
39780    vh: {
39781      value: 'vh',
39782      label: isWeb ? 'vh' : (0,external_wp_i18n_namespaceObject.__)('Viewport height (vh)'),
39783      a11yLabel: (0,external_wp_i18n_namespaceObject.__)('Viewport height (vh)'),
39784      step: 0.1
39785    },
39786    vmin: {
39787      value: 'vmin',
39788      label: isWeb ? 'vmin' : (0,external_wp_i18n_namespaceObject.__)('Viewport smallest dimension (vmin)'),
39789      a11yLabel: (0,external_wp_i18n_namespaceObject.__)('Viewport smallest dimension (vmin)'),
39790      step: 0.1
39791    },
39792    vmax: {
39793      value: 'vmax',
39794      label: isWeb ? 'vmax' : (0,external_wp_i18n_namespaceObject.__)('Viewport largest dimension (vmax)'),
39795      a11yLabel: (0,external_wp_i18n_namespaceObject.__)('Viewport largest dimension (vmax)'),
39796      step: 0.1
39797    },
39798    ch: {
39799      value: 'ch',
39800      label: isWeb ? 'ch' : (0,external_wp_i18n_namespaceObject.__)('Width of the zero (0) character (ch)'),
39801      a11yLabel: (0,external_wp_i18n_namespaceObject.__)('Width of the zero (0) character (ch)'),
39802      step: 0.01
39803    },
39804    ex: {
39805      value: 'ex',
39806      label: isWeb ? 'ex' : (0,external_wp_i18n_namespaceObject.__)('x-height of the font (ex)'),
39807      a11yLabel: (0,external_wp_i18n_namespaceObject.__)('x-height of the font (ex)'),
39808      step: 0.01
39809    },
39810    cm: {
39811      value: 'cm',
39812      label: isWeb ? 'cm' : (0,external_wp_i18n_namespaceObject.__)('Centimeters (cm)'),
39813      a11yLabel: (0,external_wp_i18n_namespaceObject.__)('Centimeters (cm)'),
39814      step: 0.001
39815    },
39816    mm: {
39817      value: 'mm',
39818      label: isWeb ? 'mm' : (0,external_wp_i18n_namespaceObject.__)('Millimeters (mm)'),
39819      a11yLabel: (0,external_wp_i18n_namespaceObject.__)('Millimeters (mm)'),
39820      step: 0.1
39821    },
39822    in: {
39823      value: 'in',
39824      label: isWeb ? 'in' : (0,external_wp_i18n_namespaceObject.__)('Inches (in)'),
39825      a11yLabel: (0,external_wp_i18n_namespaceObject.__)('Inches (in)'),
39826      step: 0.001
39827    },
39828    pc: {
39829      value: 'pc',
39830      label: isWeb ? 'pc' : (0,external_wp_i18n_namespaceObject.__)('Picas (pc)'),
39831      a11yLabel: (0,external_wp_i18n_namespaceObject.__)('Picas (pc)'),
39832      step: 1
39833    },
39834    pt: {
39835      value: 'pt',
39836      label: isWeb ? 'pt' : (0,external_wp_i18n_namespaceObject.__)('Points (pt)'),
39837      a11yLabel: (0,external_wp_i18n_namespaceObject.__)('Points (pt)'),
39838      step: 1
39839    },
39840    svw: {
39841      value: 'svw',
39842      label: isWeb ? 'svw' : (0,external_wp_i18n_namespaceObject.__)('Small viewport width (svw)'),
39843      a11yLabel: (0,external_wp_i18n_namespaceObject.__)('Small viewport width (svw)'),
39844      step: 0.1
39845    },
39846    svh: {
39847      value: 'svh',
39848      label: isWeb ? 'svh' : (0,external_wp_i18n_namespaceObject.__)('Small viewport height (svh)'),
39849      a11yLabel: (0,external_wp_i18n_namespaceObject.__)('Small viewport height (svh)'),
39850      step: 0.1
39851    },
39852    svi: {
39853      value: 'svi',
39854      label: isWeb ? 'svi' : (0,external_wp_i18n_namespaceObject.__)('Viewport smallest size in the inline direction (svi)'),
39855      a11yLabel: (0,external_wp_i18n_namespaceObject.__)('Small viewport width or height (svi)'),
39856      step: 0.1
39857    },
39858    svb: {
39859      value: 'svb',
39860      label: isWeb ? 'svb' : (0,external_wp_i18n_namespaceObject.__)('Viewport smallest size in the block direction (svb)'),
39861      a11yLabel: (0,external_wp_i18n_namespaceObject.__)('Small viewport width or height (svb)'),
39862      step: 0.1
39863    },
39864    svmin: {
39865      value: 'svmin',
39866      label: isWeb ? 'svmin' : (0,external_wp_i18n_namespaceObject.__)('Small viewport smallest dimension (svmin)'),
39867      a11yLabel: (0,external_wp_i18n_namespaceObject.__)('Small viewport smallest dimension (svmin)'),
39868      step: 0.1
39869    },
39870    lvw: {
39871      value: 'lvw',
39872      label: isWeb ? 'lvw' : (0,external_wp_i18n_namespaceObject.__)('Large viewport width (lvw)'),
39873      a11yLabel: (0,external_wp_i18n_namespaceObject.__)('Large viewport width (lvw)'),
39874      step: 0.1
39875    },
39876    lvh: {
39877      value: 'lvh',
39878      label: isWeb ? 'lvh' : (0,external_wp_i18n_namespaceObject.__)('Large viewport height (lvh)'),
39879      a11yLabel: (0,external_wp_i18n_namespaceObject.__)('Large viewport height (lvh)'),
39880      step: 0.1
39881    },
39882    lvi: {
39883      value: 'lvi',
39884      label: isWeb ? 'lvi' : (0,external_wp_i18n_namespaceObject.__)('Large viewport width or height (lvi)'),
39885      a11yLabel: (0,external_wp_i18n_namespaceObject.__)('Large viewport width or height (lvi)'),
39886      step: 0.1
39887    },
39888    lvb: {
39889      value: 'lvb',
39890      label: isWeb ? 'lvb' : (0,external_wp_i18n_namespaceObject.__)('Large viewport width or height (lvb)'),
39891      a11yLabel: (0,external_wp_i18n_namespaceObject.__)('Large viewport width or height (lvb)'),
39892      step: 0.1
39893    },
39894    lvmin: {
39895      value: 'lvmin',
39896      label: isWeb ? 'lvmin' : (0,external_wp_i18n_namespaceObject.__)('Large viewport smallest dimension (lvmin)'),
39897      a11yLabel: (0,external_wp_i18n_namespaceObject.__)('Large viewport smallest dimension (lvmin)'),
39898      step: 0.1
39899    },
39900    dvw: {
39901      value: 'dvw',
39902      label: isWeb ? 'dvw' : (0,external_wp_i18n_namespaceObject.__)('Dynamic viewport width (dvw)'),
39903      a11yLabel: (0,external_wp_i18n_namespaceObject.__)('Dynamic viewport width (dvw)'),
39904      step: 0.1
39905    },
39906    dvh: {
39907      value: 'dvh',
39908      label: isWeb ? 'dvh' : (0,external_wp_i18n_namespaceObject.__)('Dynamic viewport height (dvh)'),
39909      a11yLabel: (0,external_wp_i18n_namespaceObject.__)('Dynamic viewport height (dvh)'),
39910      step: 0.1
39911    },
39912    dvi: {
39913      value: 'dvi',
39914      label: isWeb ? 'dvi' : (0,external_wp_i18n_namespaceObject.__)('Dynamic viewport width or height (dvi)'),
39915      a11yLabel: (0,external_wp_i18n_namespaceObject.__)('Dynamic viewport width or height (dvi)'),
39916      step: 0.1
39917    },
39918    dvb: {
39919      value: 'dvb',
39920      label: isWeb ? 'dvb' : (0,external_wp_i18n_namespaceObject.__)('Dynamic viewport width or height (dvb)'),
39921      a11yLabel: (0,external_wp_i18n_namespaceObject.__)('Dynamic viewport width or height (dvb)'),
39922      step: 0.1
39923    },
39924    dvmin: {
39925      value: 'dvmin',
39926      label: isWeb ? 'dvmin' : (0,external_wp_i18n_namespaceObject.__)('Dynamic viewport smallest dimension (dvmin)'),
39927      a11yLabel: (0,external_wp_i18n_namespaceObject.__)('Dynamic viewport smallest dimension (dvmin)'),
39928      step: 0.1
39929    },
39930    dvmax: {
39931      value: 'dvmax',
39932      label: isWeb ? 'dvmax' : (0,external_wp_i18n_namespaceObject.__)('Dynamic viewport largest dimension (dvmax)'),
39933      a11yLabel: (0,external_wp_i18n_namespaceObject.__)('Dynamic viewport largest dimension (dvmax)'),
39934      step: 0.1
39935    },
39936    svmax: {
39937      value: 'svmax',
39938      label: isWeb ? 'svmax' : (0,external_wp_i18n_namespaceObject.__)('Small viewport largest dimension (svmax)'),
39939      a11yLabel: (0,external_wp_i18n_namespaceObject.__)('Small viewport largest dimension (svmax)'),
39940      step: 0.1
39941    },
39942    lvmax: {
39943      value: 'lvmax',
39944      label: isWeb ? 'lvmax' : (0,external_wp_i18n_namespaceObject.__)('Large viewport largest dimension (lvmax)'),
39945      a11yLabel: (0,external_wp_i18n_namespaceObject.__)('Large viewport largest dimension (lvmax)'),
39946      step: 0.1
39947    }
39948  };
39949  
39950  /**
39951   * An array of all available CSS length units.
39952   */
39953  const ALL_CSS_UNITS = Object.values(allUnits);
39954  
39955  /**
39956   * Units of measurements. `a11yLabel` is used by screenreaders.
39957   */
39958  const CSS_UNITS = [allUnits.px, allUnits['%'], allUnits.em, allUnits.rem, allUnits.vw, allUnits.vh];
39959  const DEFAULT_UNIT = allUnits.px;
39960  
39961  /**
39962   * Handles legacy value + unit handling.
39963   * This component use to manage both incoming value and units separately.
39964   *
39965   * Moving forward, ideally the value should be a string that contains both
39966   * the value and unit, example: '10px'
39967   *
39968   * @param rawValue     The raw value as a string (may or may not contain the unit)
39969   * @param fallbackUnit The unit used as a fallback, if not unit is detected in the `value`
39970   * @param allowedUnits Units to derive from.
39971   * @return The extracted quantity and unit. The quantity can be `undefined` in case the raw value
39972   * could not be parsed to a number correctly. The unit can be `undefined` in case the unit parse
39973   * from the raw value could not be matched against the list of allowed units.
39974   */
39975  function getParsedQuantityAndUnit(rawValue, fallbackUnit, allowedUnits) {
39976    const initialValue = fallbackUnit ? `$rawValue !== null && rawValue !== void 0 ? rawValue : ''}$fallbackUnit}` : rawValue;
39977    return parseQuantityAndUnitFromRawValue(initialValue, allowedUnits);
39978  }
39979  
39980  /**
39981   * Checks if units are defined.
39982   *
39983   * @param units List of units.
39984   * @return Whether the list actually contains any units.
39985   */
39986  function hasUnits(units) {
39987    // Although the `isArray` check shouldn't be necessary (given the signature of
39988    // this typed function), it's better to stay on the side of caution, since
39989    // this function may be called from un-typed environments.
39990    return Array.isArray(units) && !!units.length;
39991  }
39992  
39993  /**
39994   * Parses a quantity and unit from a raw string value, given a list of allowed
39995   * units and otherwise falling back to the default unit.
39996   *
39997   * @param rawValue     The raw value as a string (may or may not contain the unit)
39998   * @param allowedUnits Units to derive from.
39999   * @return The extracted quantity and unit. The quantity can be `undefined` in case the raw value
40000   * could not be parsed to a number correctly. The unit can be `undefined` in case the unit parsed
40001   * from the raw value could not be matched against the list of allowed units.
40002   */
40003  function parseQuantityAndUnitFromRawValue(rawValue, allowedUnits = ALL_CSS_UNITS) {
40004    let trimmedValue;
40005    let quantityToReturn;
40006    if (typeof rawValue !== 'undefined' || rawValue === null) {
40007      trimmedValue = `$rawValue}`.trim();
40008      const parsedQuantity = parseFloat(trimmedValue);
40009      quantityToReturn = !isFinite(parsedQuantity) ? undefined : parsedQuantity;
40010    }
40011    const unitMatch = trimmedValue?.match(/[\d.\-\+]*\s*(.*)/);
40012    const matchedUnit = unitMatch?.[1]?.toLowerCase();
40013    let unitToReturn;
40014    if (hasUnits(allowedUnits)) {
40015      const match = allowedUnits.find(item => item.value === matchedUnit);
40016      unitToReturn = match?.value;
40017    } else {
40018      unitToReturn = DEFAULT_UNIT.value;
40019    }
40020    return [quantityToReturn, unitToReturn];
40021  }
40022  
40023  /**
40024   * Parses quantity and unit from a raw value. Validates parsed value, using fallback
40025   * value if invalid.
40026   *
40027   * @param rawValue         The next value.
40028   * @param allowedUnits     Units to derive from.
40029   * @param fallbackQuantity The fallback quantity, used in case it's not possible to parse a valid quantity from the raw value.
40030   * @param fallbackUnit     The fallback unit, used in case it's not possible to parse a valid unit from the raw value.
40031   * @return The extracted quantity and unit. The quantity can be `undefined` in case the raw value
40032   * could not be parsed to a number correctly, and the `fallbackQuantity` was also `undefined`. The
40033   * unit can be `undefined` only if the unit parsed from the raw value could not be matched against
40034   * the list of allowed units, the `fallbackQuantity` is also `undefined` and the list of
40035   * `allowedUnits` is passed empty.
40036   */
40037  function getValidParsedQuantityAndUnit(rawValue, allowedUnits, fallbackQuantity, fallbackUnit) {
40038    const [parsedQuantity, parsedUnit] = parseQuantityAndUnitFromRawValue(rawValue, allowedUnits);
40039  
40040    // The parsed value from `parseQuantityAndUnitFromRawValue` should now be
40041    // either a real number or undefined. If undefined, use the fallback value.
40042    const quantityToReturn = parsedQuantity !== null && parsedQuantity !== void 0 ? parsedQuantity : fallbackQuantity;
40043  
40044    // If no unit is parsed from the raw value, or if the fallback unit is not
40045    // defined, use the first value from the list of allowed units as fallback.
40046    let unitToReturn = parsedUnit || fallbackUnit;
40047    if (!unitToReturn && hasUnits(allowedUnits)) {
40048      unitToReturn = allowedUnits[0].value;
40049    }
40050    return [quantityToReturn, unitToReturn];
40051  }
40052  
40053  /**
40054   * Takes a unit value and finds the matching accessibility label for the
40055   * unit abbreviation.
40056   *
40057   * @param unit Unit value (example: `px`)
40058   * @return a11y label for the unit abbreviation
40059   */
40060  function getAccessibleLabelForUnit(unit) {
40061    const match = ALL_CSS_UNITS.find(item => item.value === unit);
40062    return match?.a11yLabel ? match?.a11yLabel : match?.value;
40063  }
40064  
40065  /**
40066   * Filters available units based on values defined a list of allowed unit values.
40067   *
40068   * @param allowedUnitValues Collection of allowed unit value strings.
40069   * @param availableUnits    Collection of available unit objects.
40070   * @return Filtered units.
40071   */
40072  function filterUnitsWithSettings(allowedUnitValues = [], availableUnits) {
40073    // Although the `isArray` check shouldn't be necessary (given the signature of
40074    // this typed function), it's better to stay on the side of caution, since
40075    // this function may be called from un-typed environments.
40076    return Array.isArray(availableUnits) ? availableUnits.filter(unit => allowedUnitValues.includes(unit.value)) : [];
40077  }
40078  
40079  /**
40080   * Custom hook to retrieve and consolidate units setting from add_theme_support().
40081   * TODO: ideally this hook shouldn't be needed
40082   * https://github.com/WordPress/gutenberg/pull/31822#discussion_r633280823
40083   *
40084   * @param args                An object containing units, settingPath & defaultUnits.
40085   * @param args.units          Collection of all potentially available units.
40086   * @param args.availableUnits Collection of unit value strings for filtering available units.
40087   * @param args.defaultValues  Collection of default values for defined units. Example: `{ px: 350, em: 15 }`.
40088   *
40089   * @return Filtered list of units, with their default values updated following the `defaultValues`
40090   * argument's property.
40091   */
40092  const useCustomUnits = ({
40093    units = ALL_CSS_UNITS,
40094    availableUnits = [],
40095    defaultValues
40096  }) => {
40097    const customUnitsToReturn = filterUnitsWithSettings(availableUnits, units);
40098    if (defaultValues) {
40099      customUnitsToReturn.forEach((unit, i) => {
40100        if (defaultValues[unit.value]) {
40101          const [parsedDefaultValue] = parseQuantityAndUnitFromRawValue(defaultValues[unit.value]);
40102          customUnitsToReturn[i].default = parsedDefaultValue;
40103        }
40104      });
40105    }
40106    return customUnitsToReturn;
40107  };
40108  
40109  /**
40110   * Get available units with the unit for the currently selected value
40111   * prepended if it is not available in the list of units.
40112   *
40113   * This is useful to ensure that the current value's unit is always
40114   * accurately displayed in the UI, even if the intention is to hide
40115   * the availability of that unit.
40116   *
40117   * @param rawValue   Selected value to parse.
40118   * @param legacyUnit Legacy unit value, if rawValue needs it appended.
40119   * @param units      List of available units.
40120   *
40121   * @return A collection of units containing the unit for the current value.
40122   */
40123  function getUnitsWithCurrentUnit(rawValue, legacyUnit, units = ALL_CSS_UNITS) {
40124    const unitsToReturn = Array.isArray(units) ? [...units] : [];
40125    const [, currentUnit] = getParsedQuantityAndUnit(rawValue, legacyUnit, ALL_CSS_UNITS);
40126    if (currentUnit && !unitsToReturn.some(unit => unit.value === currentUnit)) {
40127      if (allUnits[currentUnit]) {
40128        unitsToReturn.unshift(allUnits[currentUnit]);
40129      }
40130    }
40131    return unitsToReturn;
40132  }
40133  
40134  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/border-control/border-control-dropdown/hook.js
40135  /**
40136   * WordPress dependencies
40137   */
40138  
40139  
40140  /**
40141   * Internal dependencies
40142   */
40143  
40144  
40145  
40146  
40147  function useBorderControlDropdown(props) {
40148    const {
40149      border,
40150      className,
40151      colors = [],
40152      enableAlpha = false,
40153      enableStyle = true,
40154      onChange,
40155      previousStyleSelection,
40156      size = 'default',
40157      __experimentalIsRenderedInSidebar = false,
40158      ...otherProps
40159    } = useContextSystem(props, 'BorderControlDropdown');
40160    const [widthValue] = parseQuantityAndUnitFromRawValue(border?.width);
40161    const hasZeroWidth = widthValue === 0;
40162    const onColorChange = color => {
40163      const style = border?.style === 'none' ? previousStyleSelection : border?.style;
40164      const width = hasZeroWidth && !!color ? '1px' : border?.width;
40165      onChange({
40166        color,
40167        style,
40168        width
40169      });
40170    };
40171    const onStyleChange = style => {
40172      const width = hasZeroWidth && !!style ? '1px' : border?.width;
40173      onChange({
40174        ...border,
40175        style,
40176        width
40177      });
40178    };
40179    const onReset = () => {
40180      onChange({
40181        ...border,
40182        color: undefined,
40183        style: undefined
40184      });
40185    };
40186  
40187    // Generate class names.
40188    const cx = useCx();
40189    const classes = (0,external_wp_element_namespaceObject.useMemo)(() => {
40190      return cx(borderControlDropdown, className);
40191    }, [className, cx]);
40192    const indicatorClassName = (0,external_wp_element_namespaceObject.useMemo)(() => {
40193      return cx(borderColorIndicator);
40194    }, [cx]);
40195    const indicatorWrapperClassName = (0,external_wp_element_namespaceObject.useMemo)(() => {
40196      return cx(colorIndicatorWrapper(border, size));
40197    }, [border, cx, size]);
40198    const popoverControlsClassName = (0,external_wp_element_namespaceObject.useMemo)(() => {
40199      return cx(borderControlPopoverControls);
40200    }, [cx]);
40201    const popoverContentClassName = (0,external_wp_element_namespaceObject.useMemo)(() => {
40202      return cx(borderControlPopoverContent);
40203    }, [cx]);
40204    const resetButtonClassName = (0,external_wp_element_namespaceObject.useMemo)(() => {
40205      return cx(resetButton);
40206    }, [cx]);
40207    return {
40208      ...otherProps,
40209      border,
40210      className: classes,
40211      colors,
40212      enableAlpha,
40213      enableStyle,
40214      indicatorClassName,
40215      indicatorWrapperClassName,
40216      onColorChange,
40217      onStyleChange,
40218      onReset,
40219      popoverContentClassName,
40220      popoverControlsClassName,
40221      resetButtonClassName,
40222      size,
40223      __experimentalIsRenderedInSidebar
40224    };
40225  }
40226  
40227  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/border-control/border-control-dropdown/component.js
40228  /**
40229   * External dependencies
40230   */
40231  
40232  /**
40233   * WordPress dependencies
40234   */
40235  
40236  
40237  
40238  /**
40239   * Internal dependencies
40240   */
40241  
40242  
40243  
40244  
40245  
40246  
40247  
40248  
40249  
40250  
40251  
40252  
40253  
40254  
40255  
40256  const getAriaLabelColorValue = colorValue => {
40257    // Leave hex values as-is. Remove the `var()` wrapper from CSS vars.
40258    return colorValue.replace(/^var\((.+)\)$/, '$1');
40259  };
40260  const getColorObject = (colorValue, colors) => {
40261    if (!colorValue || !colors) {
40262      return;
40263    }
40264    if (isMultiplePaletteArray(colors)) {
40265      // Multiple origins
40266      let matchedColor;
40267      colors.some(origin => origin.colors.some(color => {
40268        if (color.color === colorValue) {
40269          matchedColor = color;
40270          return true;
40271        }
40272        return false;
40273      }));
40274      return matchedColor;
40275    }
40276  
40277    // Single origin
40278    return colors.find(color => color.color === colorValue);
40279  };
40280  const getToggleAriaLabel = (colorValue, colorObject, style, isStyleEnabled) => {
40281    if (isStyleEnabled) {
40282      if (colorObject) {
40283        const ariaLabelValue = getAriaLabelColorValue(colorObject.color);
40284        return style ? (0,external_wp_i18n_namespaceObject.sprintf)(
40285        // translators: 1: The name of the color e.g. "vivid red". 2: The color's hex code e.g.: "#f00:". 3: The current border style selection e.g. "solid".
40286        (0,external_wp_i18n_namespaceObject.__)('Border color and style picker. The currently selected color is called "%1$s" and has a value of "%2$s". The currently selected style is "%3$s".'), colorObject.name, ariaLabelValue, style) : (0,external_wp_i18n_namespaceObject.sprintf)(
40287        // translators: 1: The name of the color e.g. "vivid red". 2: The color's hex code e.g.: "#f00:".
40288        (0,external_wp_i18n_namespaceObject.__)('Border color and style picker. The currently selected color is called "%1$s" and has a value of "%2$s".'), colorObject.name, ariaLabelValue);
40289      }
40290      if (colorValue) {
40291        const ariaLabelValue = getAriaLabelColorValue(colorValue);
40292        return style ? (0,external_wp_i18n_namespaceObject.sprintf)(
40293        // translators: 1: The color's hex code e.g.: "#f00:". 2: The current border style selection e.g. "solid".
40294        (0,external_wp_i18n_namespaceObject.__)('Border color and style picker. The currently selected color has a value of "%1$s". The currently selected style is "%2$s".'), ariaLabelValue, style) : (0,external_wp_i18n_namespaceObject.sprintf)(
40295        // translators: %s: The color's hex code e.g: "#f00".
40296        (0,external_wp_i18n_namespaceObject.__)('Border color and style picker. The currently selected color has a value of "%s".'), ariaLabelValue);
40297      }
40298      return (0,external_wp_i18n_namespaceObject.__)('Border color and style picker.');
40299    }
40300    if (colorObject) {
40301      return (0,external_wp_i18n_namespaceObject.sprintf)(
40302      // translators: 1: The name of the color e.g. "vivid red". 2: The color's hex code e.g: "#f00".
40303      (0,external_wp_i18n_namespaceObject.__)('Border color picker. The currently selected color is called "%1$s" and has a value of "%2$s".'), colorObject.name, getAriaLabelColorValue(colorObject.color));
40304    }
40305    if (colorValue) {
40306      return (0,external_wp_i18n_namespaceObject.sprintf)(
40307      // translators: %s: The color's hex code e.g: "#f00".
40308      (0,external_wp_i18n_namespaceObject.__)('Border color picker. The currently selected color has a value of "%s".'), getAriaLabelColorValue(colorValue));
40309    }
40310    return (0,external_wp_i18n_namespaceObject.__)('Border color picker.');
40311  };
40312  const BorderControlDropdown = (props, forwardedRef) => {
40313    const {
40314      __experimentalIsRenderedInSidebar,
40315      border,
40316      colors,
40317      disableCustomColors,
40318      enableAlpha,
40319      enableStyle,
40320      indicatorClassName,
40321      indicatorWrapperClassName,
40322      isStyleSettable,
40323      onReset,
40324      onColorChange,
40325      onStyleChange,
40326      popoverContentClassName,
40327      popoverControlsClassName,
40328      resetButtonClassName,
40329      showDropdownHeader,
40330      size,
40331      __unstablePopoverProps,
40332      ...otherProps
40333    } = useBorderControlDropdown(props);
40334    const {
40335      color,
40336      style
40337    } = border || {};
40338    const colorObject = getColorObject(color, colors);
40339    const toggleAriaLabel = getToggleAriaLabel(color, colorObject, style, enableStyle);
40340    const showResetButton = color || style && style !== 'none';
40341    const dropdownPosition = __experimentalIsRenderedInSidebar ? 'bottom left' : undefined;
40342    const renderToggle = ({
40343      onToggle
40344    }) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, {
40345      onClick: onToggle,
40346      variant: "tertiary",
40347      "aria-label": toggleAriaLabel,
40348      tooltipPosition: dropdownPosition,
40349      label: (0,external_wp_i18n_namespaceObject.__)('Border color and style picker'),
40350      showTooltip: true,
40351      __next40pxDefaultSize: size === '__unstable-large' ? true : false,
40352      children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", {
40353        className: indicatorWrapperClassName,
40354        children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(color_indicator, {
40355          className: indicatorClassName,
40356          colorValue: color
40357        })
40358      })
40359    });
40360    const renderContent = ({
40361      onClose
40362    }) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, {
40363      children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(dropdown_content_wrapper, {
40364        paddingSize: "medium",
40365        children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(v_stack_component, {
40366          className: popoverControlsClassName,
40367          spacing: 6,
40368          children: [showDropdownHeader ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(h_stack_component, {
40369            children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(StyledLabel, {
40370              children: (0,external_wp_i18n_namespaceObject.__)('Border color')
40371            }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, {
40372              size: "small",
40373              label: (0,external_wp_i18n_namespaceObject.__)('Close border color'),
40374              icon: close_small,
40375              onClick: onClose
40376            })]
40377          }) : undefined, /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(color_palette, {
40378            className: popoverContentClassName,
40379            value: color,
40380            onChange: onColorChange,
40381            colors,
40382            disableCustomColors,
40383            __experimentalIsRenderedInSidebar: __experimentalIsRenderedInSidebar,
40384            clearable: false,
40385            enableAlpha: enableAlpha
40386          }), enableStyle && isStyleSettable && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(border_control_style_picker_component, {
40387            label: (0,external_wp_i18n_namespaceObject.__)('Style'),
40388            value: style,
40389            onChange: onStyleChange
40390          })]
40391        })
40392      }), showResetButton && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(dropdown_content_wrapper, {
40393        paddingSize: "none",
40394        children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, {
40395          className: resetButtonClassName,
40396          variant: "tertiary",
40397          onClick: () => {
40398            onReset();
40399            onClose();
40400          },
40401          children: (0,external_wp_i18n_namespaceObject.__)('Reset')
40402        })
40403      })]
40404    });
40405    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(dropdown, {
40406      renderToggle: renderToggle,
40407      renderContent: renderContent,
40408      popoverProps: {
40409        ...__unstablePopoverProps
40410      },
40411      ...otherProps,
40412      ref: forwardedRef
40413    });
40414  };
40415  const ConnectedBorderControlDropdown = contextConnect(BorderControlDropdown, 'BorderControlDropdown');
40416  /* harmony default export */ const border_control_dropdown_component = (ConnectedBorderControlDropdown);
40417  
40418  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/unit-control/unit-select-control.js
40419  /**
40420   * External dependencies
40421   */
40422  
40423  /**
40424   * WordPress dependencies
40425   */
40426  
40427  
40428  /**
40429   * Internal dependencies
40430   */
40431  
40432  
40433  
40434  
40435  function UnitSelectControl({
40436    className,
40437    isUnitSelectTabbable: isTabbable = true,
40438    onChange,
40439    size = 'default',
40440    unit = 'px',
40441    units = CSS_UNITS,
40442    ...props
40443  }, ref) {
40444    if (!hasUnits(units) || units?.length === 1) {
40445      return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(UnitLabel, {
40446        className: "components-unit-control__unit-label",
40447        selectSize: size,
40448        children: unit
40449      });
40450    }
40451    const handleOnChange = event => {
40452      const {
40453        value: unitValue
40454      } = event.target;
40455      const data = units.find(option => option.value === unitValue);
40456      onChange?.(unitValue, {
40457        event,
40458        data
40459      });
40460    };
40461    const classes = dist_clsx('components-unit-control__select', className);
40462    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(UnitSelect, {
40463      ref: ref,
40464      className: classes,
40465      onChange: handleOnChange,
40466      selectSize: size,
40467      tabIndex: isTabbable ? undefined : -1,
40468      value: unit,
40469      ...props,
40470      children: units.map(option => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("option", {
40471        value: option.value,
40472        children: option.label
40473      }, option.value))
40474    });
40475  }
40476  /* harmony default export */ const unit_select_control = ((0,external_wp_element_namespaceObject.forwardRef)(UnitSelectControl));
40477  
40478  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/unit-control/index.js
40479  /**
40480   * External dependencies
40481   */
40482  
40483  
40484  
40485  /**
40486   * WordPress dependencies
40487   */
40488  
40489  
40490  
40491  
40492  /**
40493   * Internal dependencies
40494   */
40495  
40496  
40497  
40498  
40499  
40500  
40501  
40502  
40503  function UnforwardedUnitControl(unitControlProps, forwardedRef) {
40504    const {
40505      __unstableStateReducer,
40506      autoComplete = 'off',
40507      // @ts-expect-error Ensure that children is omitted from restProps
40508      children,
40509      className,
40510      disabled = false,
40511      disableUnits = false,
40512      isPressEnterToChange = false,
40513      isResetValueOnUnitChange = false,
40514      isUnitSelectTabbable = true,
40515      label,
40516      onChange: onChangeProp,
40517      onUnitChange,
40518      size = 'default',
40519      unit: unitProp,
40520      units: unitsProp = CSS_UNITS,
40521      value: valueProp,
40522      onFocus: onFocusProp,
40523      ...props
40524    } = useDeprecated36pxDefaultSizeProp(unitControlProps);
40525    if ('unit' in unitControlProps) {
40526      external_wp_deprecated_default()('UnitControl unit prop', {
40527        since: '5.6',
40528        hint: 'The unit should be provided within the `value` prop.',
40529        version: '6.2'
40530      });
40531    }
40532  
40533    // The `value` prop, in theory, should not be `null`, but the following line
40534    // ensures it fallback to `undefined` in case a consumer of `UnitControl`
40535    // still passes `null` as a `value`.
40536    const nonNullValueProp = valueProp !== null && valueProp !== void 0 ? valueProp : undefined;
40537    const [units, reFirstCharacterOfUnits] = (0,external_wp_element_namespaceObject.useMemo)(() => {
40538      const list = getUnitsWithCurrentUnit(nonNullValueProp, unitProp, unitsProp);
40539      const [{
40540        value: firstUnitValue = ''
40541      } = {}, ...rest] = list;
40542      const firstCharacters = rest.reduce((carry, {
40543        value
40544      }) => {
40545        const first = escapeRegExp(value?.substring(0, 1) || '');
40546        return carry.includes(first) ? carry : `$carry}|$first}`;
40547      }, escapeRegExp(firstUnitValue.substring(0, 1)));
40548      return [list, new RegExp(`^(?:$firstCharacters})$`, 'i')];
40549    }, [nonNullValueProp, unitProp, unitsProp]);
40550    const [parsedQuantity, parsedUnit] = getParsedQuantityAndUnit(nonNullValueProp, unitProp, units);
40551    const [unit, setUnit] = use_controlled_state(units.length === 1 ? units[0].value : unitProp, {
40552      initial: parsedUnit,
40553      fallback: ''
40554    });
40555    (0,external_wp_element_namespaceObject.useEffect)(() => {
40556      if (parsedUnit !== undefined) {
40557        setUnit(parsedUnit);
40558      }
40559    }, [parsedUnit, setUnit]);
40560    const classes = dist_clsx('components-unit-control',
40561    // This class is added for legacy purposes to maintain it on the outer
40562    // wrapper. See: https://github.com/WordPress/gutenberg/pull/45139
40563    'components-unit-control-wrapper', className);
40564    const handleOnQuantityChange = (nextQuantityValue, changeProps) => {
40565      if (nextQuantityValue === '' || typeof nextQuantityValue === 'undefined' || nextQuantityValue === null) {
40566        onChangeProp?.('', changeProps);
40567        return;
40568      }
40569  
40570      /*
40571       * Customizing the onChange callback.
40572       * This allows as to broadcast a combined value+unit to onChange.
40573       */
40574      const onChangeValue = getValidParsedQuantityAndUnit(nextQuantityValue, units, parsedQuantity, unit).join('');
40575      onChangeProp?.(onChangeValue, changeProps);
40576    };
40577    const handleOnUnitChange = (nextUnitValue, changeProps) => {
40578      const {
40579        data
40580      } = changeProps;
40581      let nextValue = `$parsedQuantity !== null && parsedQuantity !== void 0 ? parsedQuantity : ''}$nextUnitValue}`;
40582      if (isResetValueOnUnitChange && data?.default !== undefined) {
40583        nextValue = `$data.default}$nextUnitValue}`;
40584      }
40585      onChangeProp?.(nextValue, changeProps);
40586      onUnitChange?.(nextUnitValue, changeProps);
40587      setUnit(nextUnitValue);
40588    };
40589    let handleOnKeyDown;
40590    if (!disableUnits && isUnitSelectTabbable && units.length) {
40591      handleOnKeyDown = event => {
40592        props.onKeyDown?.(event);
40593        // Unless the meta or ctrl key was pressed (to avoid interfering with
40594        // shortcuts, e.g. pastes), move focus to the unit select if a key
40595        // matches the first character of a unit.
40596        if (!event.metaKey && !event.ctrlKey && reFirstCharacterOfUnits.test(event.key)) {
40597          refInputSuffix.current?.focus();
40598        }
40599      };
40600    }
40601    const refInputSuffix = (0,external_wp_element_namespaceObject.useRef)(null);
40602    const inputSuffix = !disableUnits ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(unit_select_control, {
40603      ref: refInputSuffix,
40604      "aria-label": (0,external_wp_i18n_namespaceObject.__)('Select unit'),
40605      disabled: disabled,
40606      isUnitSelectTabbable: isUnitSelectTabbable,
40607      onChange: handleOnUnitChange,
40608      size: ['small', 'compact'].includes(size) || size === 'default' && !props.__next40pxDefaultSize ? 'small' : 'default',
40609      unit: unit,
40610      units: units,
40611      onFocus: onFocusProp,
40612      onBlur: unitControlProps.onBlur
40613    }) : null;
40614    let step = props.step;
40615  
40616    /*
40617     * If no step prop has been passed, lookup the active unit and
40618     * try to get step from `units`, or default to a value of `1`
40619     */
40620    if (!step && units) {
40621      var _activeUnit$step;
40622      const activeUnit = units.find(option => option.value === unit);
40623      step = (_activeUnit$step = activeUnit?.step) !== null && _activeUnit$step !== void 0 ? _activeUnit$step : 1;
40624    }
40625    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ValueInput, {
40626      ...props,
40627      autoComplete: autoComplete,
40628      className: classes,
40629      disabled: disabled,
40630      spinControls: "none",
40631      isPressEnterToChange: isPressEnterToChange,
40632      label: label,
40633      onKeyDown: handleOnKeyDown,
40634      onChange: handleOnQuantityChange,
40635      ref: forwardedRef,
40636      size: size,
40637      suffix: inputSuffix,
40638      type: isPressEnterToChange ? 'text' : 'number',
40639      value: parsedQuantity !== null && parsedQuantity !== void 0 ? parsedQuantity : '',
40640      step: step,
40641      onFocus: onFocusProp,
40642      __unstableStateReducer: __unstableStateReducer
40643    });
40644  }
40645  
40646  /**
40647   * `UnitControl` allows the user to set a numeric quantity as well as a unit (e.g. `px`).
40648   *
40649   *
40650   * ```jsx
40651   * import { __experimentalUnitControl as UnitControl } from '@wordpress/components';
40652   * import { useState } from '@wordpress/element';
40653   *
40654   * const Example = () => {
40655   *   const [ value, setValue ] = useState( '10px' );
40656   *
40657   *   return <UnitControl onChange={ setValue } value={ value } />;
40658   * };
40659   * ```
40660   */
40661  const UnitControl = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedUnitControl);
40662  
40663  /* harmony default export */ const unit_control = (UnitControl);
40664  
40665  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/border-control/border-control/hook.js
40666  /**
40667   * WordPress dependencies
40668   */
40669  
40670  
40671  /**
40672   * Internal dependencies
40673   */
40674  
40675  
40676  
40677  
40678  // If either width or color are defined, the border is considered valid
40679  // and a border style can be set as well.
40680  const isValidBorder = border => {
40681    const hasWidth = border?.width !== undefined && border.width !== '';
40682    const hasColor = border?.color !== undefined;
40683    return hasWidth || hasColor;
40684  };
40685  function useBorderControl(props) {
40686    const {
40687      className,
40688      colors = [],
40689      isCompact,
40690      onChange,
40691      enableAlpha = true,
40692      enableStyle = true,
40693      shouldSanitizeBorder = true,
40694      size = 'default',
40695      value: border,
40696      width,
40697      __experimentalIsRenderedInSidebar = false,
40698      __next40pxDefaultSize,
40699      ...otherProps
40700    } = useContextSystem(props, 'BorderControl');
40701    const computedSize = size === 'default' && __next40pxDefaultSize ? '__unstable-large' : size;
40702    const [widthValue, originalWidthUnit] = parseQuantityAndUnitFromRawValue(border?.width);
40703    const widthUnit = originalWidthUnit || 'px';
40704    const hadPreviousZeroWidth = widthValue === 0;
40705    const [colorSelection, setColorSelection] = (0,external_wp_element_namespaceObject.useState)();
40706    const [styleSelection, setStyleSelection] = (0,external_wp_element_namespaceObject.useState)();
40707    const isStyleSettable = shouldSanitizeBorder ? isValidBorder(border) : true;
40708    const onBorderChange = (0,external_wp_element_namespaceObject.useCallback)(newBorder => {
40709      if (shouldSanitizeBorder && !isValidBorder(newBorder)) {
40710        onChange(undefined);
40711        return;
40712      }
40713      onChange(newBorder);
40714    }, [onChange, shouldSanitizeBorder]);
40715    const onWidthChange = (0,external_wp_element_namespaceObject.useCallback)(newWidth => {
40716      const newWidthValue = newWidth === '' ? undefined : newWidth;
40717      const [parsedValue] = parseQuantityAndUnitFromRawValue(newWidth);
40718      const hasZeroWidth = parsedValue === 0;
40719      const updatedBorder = {
40720        ...border,
40721        width: newWidthValue
40722      };
40723  
40724      // Setting the border width explicitly to zero will also set the
40725      // border style to `none` and clear the border color.
40726      if (hasZeroWidth && !hadPreviousZeroWidth) {
40727        // Before clearing the color and style selections, keep track of
40728        // the current selections so they can be restored when the width
40729        // changes to a non-zero value.
40730        setColorSelection(border?.color);
40731        setStyleSelection(border?.style);
40732  
40733        // Clear the color and style border properties.
40734        updatedBorder.color = undefined;
40735        updatedBorder.style = 'none';
40736      }
40737  
40738      // Selection has changed from zero border width to non-zero width.
40739      if (!hasZeroWidth && hadPreviousZeroWidth) {
40740        // Restore previous border color and style selections if width
40741        // is now not zero.
40742        if (updatedBorder.color === undefined) {
40743          updatedBorder.color = colorSelection;
40744        }
40745        if (updatedBorder.style === 'none') {
40746          updatedBorder.style = styleSelection;
40747        }
40748      }
40749      onBorderChange(updatedBorder);
40750    }, [border, hadPreviousZeroWidth, colorSelection, styleSelection, onBorderChange]);
40751    const onSliderChange = (0,external_wp_element_namespaceObject.useCallback)(value => {
40752      onWidthChange(`$value}$widthUnit}`);
40753    }, [onWidthChange, widthUnit]);
40754  
40755    // Generate class names.
40756    const cx = useCx();
40757    const classes = (0,external_wp_element_namespaceObject.useMemo)(() => {
40758      return cx(borderControl, className);
40759    }, [className, cx]);
40760    let wrapperWidth = width;
40761    if (isCompact) {
40762      // Widths below represent the minimum usable width for compact controls.
40763      // Taller controls contain greater internal padding, thus greater width.
40764      wrapperWidth = size === '__unstable-large' ? '116px' : '90px';
40765    }
40766    const innerWrapperClassName = (0,external_wp_element_namespaceObject.useMemo)(() => {
40767      const widthStyle = !!wrapperWidth && styles_wrapperWidth;
40768      const heightStyle = wrapperHeight(computedSize);
40769      return cx(innerWrapper(), widthStyle, heightStyle);
40770    }, [wrapperWidth, cx, computedSize]);
40771    const sliderClassName = (0,external_wp_element_namespaceObject.useMemo)(() => {
40772      return cx(borderSlider());
40773    }, [cx]);
40774    return {
40775      ...otherProps,
40776      className: classes,
40777      colors,
40778      enableAlpha,
40779      enableStyle,
40780      innerWrapperClassName,
40781      inputWidth: wrapperWidth,
40782      isStyleSettable,
40783      onBorderChange,
40784      onSliderChange,
40785      onWidthChange,
40786      previousStyleSelection: styleSelection,
40787      sliderClassName,
40788      value: border,
40789      widthUnit,
40790      widthValue,
40791      size: computedSize,
40792      __experimentalIsRenderedInSidebar,
40793      __next40pxDefaultSize
40794    };
40795  }
40796  
40797  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/border-control/border-control/component.js
40798  /**
40799   * WordPress dependencies
40800   */
40801  
40802  
40803  /**
40804   * Internal dependencies
40805   */
40806  
40807  
40808  
40809  
40810  
40811  
40812  
40813  
40814  
40815  
40816  
40817  
40818  const BorderLabel = props => {
40819    const {
40820      label,
40821      hideLabelFromVision
40822    } = props;
40823    if (!label) {
40824      return null;
40825    }
40826    return hideLabelFromVision ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(visually_hidden_component, {
40827      as: "legend",
40828      children: label
40829    }) : /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(StyledLabel, {
40830      as: "legend",
40831      children: label
40832    });
40833  };
40834  const UnconnectedBorderControl = (props, forwardedRef) => {
40835    const {
40836      __next40pxDefaultSize = false,
40837      colors,
40838      disableCustomColors,
40839      disableUnits,
40840      enableAlpha,
40841      enableStyle,
40842      hideLabelFromVision,
40843      innerWrapperClassName,
40844      inputWidth,
40845      isStyleSettable,
40846      label,
40847      onBorderChange,
40848      onSliderChange,
40849      onWidthChange,
40850      placeholder,
40851      __unstablePopoverProps,
40852      previousStyleSelection,
40853      showDropdownHeader,
40854      size,
40855      sliderClassName,
40856      value: border,
40857      widthUnit,
40858      widthValue,
40859      withSlider,
40860      __experimentalIsRenderedInSidebar,
40861      ...otherProps
40862    } = useBorderControl(props);
40863    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(component, {
40864      as: "fieldset",
40865      ...otherProps,
40866      ref: forwardedRef,
40867      children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BorderLabel, {
40868        label: label,
40869        hideLabelFromVision: hideLabelFromVision
40870      }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(h_stack_component, {
40871        spacing: 4,
40872        className: innerWrapperClassName,
40873        children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(unit_control, {
40874          prefix: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(spacer_component, {
40875            marginRight: 1,
40876            marginBottom: 0,
40877            children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(border_control_dropdown_component, {
40878              border: border,
40879              colors: colors,
40880              __unstablePopoverProps: __unstablePopoverProps,
40881              disableCustomColors: disableCustomColors,
40882              enableAlpha: enableAlpha,
40883              enableStyle: enableStyle,
40884              isStyleSettable: isStyleSettable,
40885              onChange: onBorderChange,
40886              previousStyleSelection: previousStyleSelection,
40887              showDropdownHeader: showDropdownHeader,
40888              __experimentalIsRenderedInSidebar: __experimentalIsRenderedInSidebar,
40889              size: size
40890            })
40891          }),
40892          label: (0,external_wp_i18n_namespaceObject.__)('Border width'),
40893          hideLabelFromVision: true,
40894          min: 0,
40895          onChange: onWidthChange,
40896          value: border?.width || '',
40897          placeholder: placeholder,
40898          disableUnits: disableUnits,
40899          __unstableInputWidth: inputWidth,
40900          size: size
40901        }), withSlider && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(range_control, {
40902          __nextHasNoMarginBottom: true,
40903          label: (0,external_wp_i18n_namespaceObject.__)('Border width'),
40904          hideLabelFromVision: true,
40905          className: sliderClassName,
40906          initialPosition: 0,
40907          max: 100,
40908          min: 0,
40909          onChange: onSliderChange,
40910          step: ['px', '%'].includes(widthUnit) ? 1 : 0.1,
40911          value: widthValue || undefined,
40912          withInputField: false,
40913          __next40pxDefaultSize: __next40pxDefaultSize
40914        })]
40915      })]
40916    });
40917  };
40918  
40919  /**
40920   * The `BorderControl` brings together internal sub-components which allow users to
40921   * set the various properties of a border. The first sub-component, a
40922   * `BorderDropdown` contains options representing border color and style. The
40923   * border width is controlled via a `UnitControl` and an optional `RangeControl`.
40924   *
40925   * Border radius is not covered by this control as it may be desired separate to
40926   * color, style, and width. For example, the border radius may be absorbed under
40927   * a "shape" abstraction.
40928   *
40929   * ```jsx
40930   * import { __experimentalBorderControl as BorderControl } from '@wordpress/components';
40931   * import { __ } from '@wordpress/i18n';
40932   *
40933   * const colors = [
40934   *     { name: 'Blue 20', color: '#72aee6' },
40935   *     // ...
40936   * ];
40937   *
40938   * const MyBorderControl = () => {
40939   *     const [ border, setBorder ] = useState();
40940   *     const onChange = ( newBorder ) => setBorder( newBorder );
40941   *
40942   *     return (
40943   *         <BorderControl
40944   *             colors={ colors }
40945   *             label={ __( 'Border' ) }
40946   *             onChange={ onChange }
40947   *             value={ border }
40948   *         />
40949   *     );
40950   * };
40951   * ```
40952   */
40953  const BorderControl = contextConnect(UnconnectedBorderControl, 'BorderControl');
40954  /* harmony default export */ const border_control_component = (BorderControl);
40955  
40956  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/grid/utils.js
40957  /**
40958   * External dependencies
40959   */
40960  
40961  const utils_ALIGNMENTS = {
40962    bottom: {
40963      alignItems: 'flex-end',
40964      justifyContent: 'center'
40965    },
40966    bottomLeft: {
40967      alignItems: 'flex-start',
40968      justifyContent: 'flex-end'
40969    },
40970    bottomRight: {
40971      alignItems: 'flex-end',
40972      justifyContent: 'flex-end'
40973    },
40974    center: {
40975      alignItems: 'center',
40976      justifyContent: 'center'
40977    },
40978    spaced: {
40979      alignItems: 'center',
40980      justifyContent: 'space-between'
40981    },
40982    left: {
40983      alignItems: 'center',
40984      justifyContent: 'flex-start'
40985    },
40986    right: {
40987      alignItems: 'center',
40988      justifyContent: 'flex-end'
40989    },
40990    stretch: {
40991      alignItems: 'stretch'
40992    },
40993    top: {
40994      alignItems: 'flex-start',
40995      justifyContent: 'center'
40996    },
40997    topLeft: {
40998      alignItems: 'flex-start',
40999      justifyContent: 'flex-start'
41000    },
41001    topRight: {
41002      alignItems: 'flex-start',
41003      justifyContent: 'flex-end'
41004    }
41005  };
41006  function utils_getAlignmentProps(alignment) {
41007    const alignmentProps = alignment ? utils_ALIGNMENTS[alignment] : {};
41008    return alignmentProps;
41009  }
41010  
41011  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/grid/hook.js
41012  /**
41013   * External dependencies
41014   */
41015  
41016  
41017  /**
41018   * WordPress dependencies
41019   */
41020  
41021  
41022  /**
41023   * Internal dependencies
41024   */
41025  
41026  
41027  
41028  
41029  
41030  
41031  function useGrid(props) {
41032    const {
41033      align,
41034      alignment,
41035      className,
41036      columnGap,
41037      columns = 2,
41038      gap = 3,
41039      isInline = false,
41040      justify,
41041      rowGap,
41042      rows,
41043      templateColumns,
41044      templateRows,
41045      ...otherProps
41046    } = useContextSystem(props, 'Grid');
41047    const columnsAsArray = Array.isArray(columns) ? columns : [columns];
41048    const column = useResponsiveValue(columnsAsArray);
41049    const rowsAsArray = Array.isArray(rows) ? rows : [rows];
41050    const row = useResponsiveValue(rowsAsArray);
41051    const gridTemplateColumns = templateColumns || !!columns && `repeat( $column}, 1fr )`;
41052    const gridTemplateRows = templateRows || !!rows && `repeat( $row}, 1fr )`;
41053    const cx = useCx();
41054    const classes = (0,external_wp_element_namespaceObject.useMemo)(() => {
41055      const alignmentProps = utils_getAlignmentProps(alignment);
41056      const gridClasses = /*#__PURE__*/emotion_react_browser_esm_css({
41057        alignItems: align,
41058        display: isInline ? 'inline-grid' : 'grid',
41059        gap: `calc( $config_values.gridBase} * $gap} )`,
41060        gridTemplateColumns: gridTemplateColumns || undefined,
41061        gridTemplateRows: gridTemplateRows || undefined,
41062        gridRowGap: rowGap,
41063        gridColumnGap: columnGap,
41064        justifyContent: justify,
41065        verticalAlign: isInline ? 'middle' : undefined,
41066        ...alignmentProps
41067      },  true ? "" : 0,  true ? "" : 0);
41068      return cx(gridClasses, className);
41069    }, [align, alignment, className, columnGap, cx, gap, gridTemplateColumns, gridTemplateRows, isInline, justify, rowGap]);
41070    return {
41071      ...otherProps,
41072      className: classes
41073    };
41074  }
41075  
41076  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/grid/component.js
41077  /**
41078   * External dependencies
41079   */
41080  
41081  /**
41082   * Internal dependencies
41083   */
41084  
41085  
41086  
41087  
41088  
41089  function UnconnectedGrid(props, forwardedRef) {
41090    const gridProps = useGrid(props);
41091    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(component, {
41092      ...gridProps,
41093      ref: forwardedRef
41094    });
41095  }
41096  
41097  /**
41098   * `Grid` is a primitive layout component that can arrange content in a grid configuration.
41099   *
41100   * ```jsx
41101   * import {
41102   *     __experimentalGrid as Grid,
41103   *     __experimentalText as Text
41104   * } from `@wordpress/components`;
41105   *
41106   * function Example() {
41107   *     return (
41108   *         <Grid columns={ 3 }>
41109   *             <Text>Code</Text>
41110   *             <Text>is</Text>
41111   *             <Text>Poetry</Text>
41112   *         </Grid>
41113   *     );
41114   * }
41115   * ```
41116   */
41117  const Grid = contextConnect(UnconnectedGrid, 'Grid');
41118  /* harmony default export */ const grid_component = (Grid);
41119  
41120  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/border-box-control/border-box-control-split-controls/hook.js
41121  /**
41122   * WordPress dependencies
41123   */
41124  
41125  
41126  /**
41127   * Internal dependencies
41128   */
41129  
41130  
41131  
41132  function useBorderBoxControlSplitControls(props) {
41133    const {
41134      className,
41135      colors = [],
41136      enableAlpha = false,
41137      enableStyle = true,
41138      size = 'default',
41139      __experimentalIsRenderedInSidebar = false,
41140      ...otherProps
41141    } = useContextSystem(props, 'BorderBoxControlSplitControls');
41142  
41143    // Generate class names.
41144    const cx = useCx();
41145    const classes = (0,external_wp_element_namespaceObject.useMemo)(() => {
41146      return cx(borderBoxControlSplitControls(size), className);
41147    }, [cx, className, size]);
41148    const centeredClassName = (0,external_wp_element_namespaceObject.useMemo)(() => {
41149      return cx(centeredBorderControl, className);
41150    }, [cx, className]);
41151    const rightAlignedClassName = (0,external_wp_element_namespaceObject.useMemo)(() => {
41152      return cx(rightBorderControl(), className);
41153    }, [cx, className]);
41154    return {
41155      ...otherProps,
41156      centeredClassName,
41157      className: classes,
41158      colors,
41159      enableAlpha,
41160      enableStyle,
41161      rightAlignedClassName,
41162      size,
41163      __experimentalIsRenderedInSidebar
41164    };
41165  }
41166  
41167  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/border-box-control/border-box-control-split-controls/component.js
41168  /**
41169   * WordPress dependencies
41170   */
41171  
41172  
41173  
41174  
41175  /**
41176   * Internal dependencies
41177   */
41178  
41179  
41180  
41181  
41182  
41183  
41184  
41185  const BorderBoxControlSplitControls = (props, forwardedRef) => {
41186    const {
41187      centeredClassName,
41188      colors,
41189      disableCustomColors,
41190      enableAlpha,
41191      enableStyle,
41192      onChange,
41193      popoverPlacement,
41194      popoverOffset,
41195      rightAlignedClassName,
41196      size = 'default',
41197      value,
41198      __experimentalIsRenderedInSidebar,
41199      ...otherProps
41200    } = useBorderBoxControlSplitControls(props);
41201  
41202    // Use internal state instead of a ref to make sure that the component
41203    // re-renders when the popover's anchor updates.
41204    const [popoverAnchor, setPopoverAnchor] = (0,external_wp_element_namespaceObject.useState)(null);
41205  
41206    // Memoize popoverProps to avoid returning a new object every time.
41207    const popoverProps = (0,external_wp_element_namespaceObject.useMemo)(() => popoverPlacement ? {
41208      placement: popoverPlacement,
41209      offset: popoverOffset,
41210      anchor: popoverAnchor,
41211      shift: true
41212    } : undefined, [popoverPlacement, popoverOffset, popoverAnchor]);
41213    const sharedBorderControlProps = {
41214      colors,
41215      disableCustomColors,
41216      enableAlpha,
41217      enableStyle,
41218      isCompact: true,
41219      __experimentalIsRenderedInSidebar,
41220      size
41221    };
41222    const mergedRef = (0,external_wp_compose_namespaceObject.useMergeRefs)([setPopoverAnchor, forwardedRef]);
41223    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(grid_component, {
41224      ...otherProps,
41225      ref: mergedRef,
41226      gap: 4,
41227      children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(border_box_control_visualizer_component, {
41228        value: value,
41229        size: size
41230      }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(border_control_component, {
41231        className: centeredClassName,
41232        hideLabelFromVision: true,
41233        label: (0,external_wp_i18n_namespaceObject.__)('Top border'),
41234        onChange: newBorder => onChange(newBorder, 'top'),
41235        __unstablePopoverProps: popoverProps,
41236        value: value?.top,
41237        ...sharedBorderControlProps
41238      }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(border_control_component, {
41239        hideLabelFromVision: true,
41240        label: (0,external_wp_i18n_namespaceObject.__)('Left border'),
41241        onChange: newBorder => onChange(newBorder, 'left'),
41242        __unstablePopoverProps: popoverProps,
41243        value: value?.left,
41244        ...sharedBorderControlProps
41245      }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(border_control_component, {
41246        className: rightAlignedClassName,
41247        hideLabelFromVision: true,
41248        label: (0,external_wp_i18n_namespaceObject.__)('Right border'),
41249        onChange: newBorder => onChange(newBorder, 'right'),
41250        __unstablePopoverProps: popoverProps,
41251        value: value?.right,
41252        ...sharedBorderControlProps
41253      }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(border_control_component, {
41254        className: centeredClassName,
41255        hideLabelFromVision: true,
41256        label: (0,external_wp_i18n_namespaceObject.__)('Bottom border'),
41257        onChange: newBorder => onChange(newBorder, 'bottom'),
41258        __unstablePopoverProps: popoverProps,
41259        value: value?.bottom,
41260        ...sharedBorderControlProps
41261      })]
41262    });
41263  };
41264  const ConnectedBorderBoxControlSplitControls = contextConnect(BorderBoxControlSplitControls, 'BorderBoxControlSplitControls');
41265  /* harmony default export */ const border_box_control_split_controls_component = (ConnectedBorderBoxControlSplitControls);
41266  
41267  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/utils/unit-values.js
41268  const UNITED_VALUE_REGEX = /^([\d.\-+]*)\s*(fr|cm|mm|Q|in|pc|pt|px|em|ex|ch|rem|lh|vw|vh|vmin|vmax|%|cap|ic|rlh|vi|vb|deg|grad|rad|turn|s|ms|Hz|kHz|dpi|dpcm|dppx|svw|lvw|dvw|svh|lvh|dvh|svi|lvi|dvi|svb|lvb|dvb|svmin|lvmin|dvmin|svmax|lvmax|dvmax)?$/;
41269  
41270  /**
41271   * Parses a number and unit from a value.
41272   *
41273   * @param toParse Value to parse
41274   *
41275   * @return  The extracted number and unit.
41276   */
41277  function parseCSSUnitValue(toParse) {
41278    const value = toParse.trim();
41279    const matched = value.match(UNITED_VALUE_REGEX);
41280    if (!matched) {
41281      return [undefined, undefined];
41282    }
41283    const [, num, unit] = matched;
41284    let numParsed = parseFloat(num);
41285    numParsed = Number.isNaN(numParsed) ? undefined : numParsed;
41286    return [numParsed, unit];
41287  }
41288  
41289  /**
41290   * Combines a value and a unit into a unit value.
41291   *
41292   * @param value
41293   * @param unit
41294   *
41295   * @return The unit value.
41296   */
41297  function createCSSUnitValue(value, unit) {
41298    return `$value}$unit}`;
41299  }
41300  
41301  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/border-box-control/utils.js
41302  /**
41303   * External dependencies
41304   */
41305  
41306  /**
41307   * Internal dependencies
41308   */
41309  
41310  const utils_sides = ['top', 'right', 'bottom', 'left'];
41311  const borderProps = ['color', 'style', 'width'];
41312  const isEmptyBorder = border => {
41313    if (!border) {
41314      return true;
41315    }
41316    return !borderProps.some(prop => border[prop] !== undefined);
41317  };
41318  const isDefinedBorder = border => {
41319    // No border, no worries :)
41320    if (!border) {
41321      return false;
41322    }
41323  
41324    // If we have individual borders per side within the border object we
41325    // need to check whether any of those side borders have been set.
41326    if (hasSplitBorders(border)) {
41327      const allSidesEmpty = utils_sides.every(side => isEmptyBorder(border[side]));
41328      return !allSidesEmpty;
41329    }
41330  
41331    // If we have a top-level border only, check if that is empty. e.g.
41332    // { color: undefined, style: undefined, width: undefined }
41333    // Border radius can still be set within the border object as it is
41334    // handled separately.
41335    return !isEmptyBorder(border);
41336  };
41337  const isCompleteBorder = border => {
41338    if (!border) {
41339      return false;
41340    }
41341    return borderProps.every(prop => border[prop] !== undefined);
41342  };
41343  const hasSplitBorders = (border = {}) => {
41344    return Object.keys(border).some(side => utils_sides.indexOf(side) !== -1);
41345  };
41346  const hasMixedBorders = borders => {
41347    if (!hasSplitBorders(borders)) {
41348      return false;
41349    }
41350    const shorthandBorders = utils_sides.map(side => getShorthandBorderStyle(borders?.[side]));
41351    return !shorthandBorders.every(border => border === shorthandBorders[0]);
41352  };
41353  const getSplitBorders = border => {
41354    if (!border || isEmptyBorder(border)) {
41355      return undefined;
41356    }
41357    return {
41358      top: border,
41359      right: border,
41360      bottom: border,
41361      left: border
41362    };
41363  };
41364  const getBorderDiff = (original, updated) => {
41365    const diff = {};
41366    if (original.color !== updated.color) {
41367      diff.color = updated.color;
41368    }
41369    if (original.style !== updated.style) {
41370      diff.style = updated.style;
41371    }
41372    if (original.width !== updated.width) {
41373      diff.width = updated.width;
41374    }
41375    return diff;
41376  };
41377  const getCommonBorder = borders => {
41378    if (!borders) {
41379      return undefined;
41380    }
41381    const colors = [];
41382    const styles = [];
41383    const widths = [];
41384    utils_sides.forEach(side => {
41385      colors.push(borders[side]?.color);
41386      styles.push(borders[side]?.style);
41387      widths.push(borders[side]?.width);
41388    });
41389    const allColorsMatch = colors.every(value => value === colors[0]);
41390    const allStylesMatch = styles.every(value => value === styles[0]);
41391    const allWidthsMatch = widths.every(value => value === widths[0]);
41392    return {
41393      color: allColorsMatch ? colors[0] : undefined,
41394      style: allStylesMatch ? styles[0] : undefined,
41395      width: allWidthsMatch ? widths[0] : getMostCommonUnit(widths)
41396    };
41397  };
41398  const getShorthandBorderStyle = (border, fallbackBorder) => {
41399    if (isEmptyBorder(border)) {
41400      return fallbackBorder;
41401    }
41402    const {
41403      color: fallbackColor,
41404      style: fallbackStyle,
41405      width: fallbackWidth
41406    } = fallbackBorder || {};
41407    const {
41408      color = fallbackColor,
41409      style = fallbackStyle,
41410      width = fallbackWidth
41411    } = border;
41412    const hasVisibleBorder = !!width && width !== '0' || !!color;
41413    const borderStyle = hasVisibleBorder ? style || 'solid' : style;
41414    return [width, borderStyle, color].filter(Boolean).join(' ');
41415  };
41416  const getMostCommonUnit = values => {
41417    // Collect all the CSS units.
41418    const units = values.map(value => value === undefined ? undefined : parseCSSUnitValue(`$value}`)[1]);
41419  
41420    // Return the most common unit out of only the defined CSS units.
41421    const filteredUnits = units.filter(value => value !== undefined);
41422    return mode(filteredUnits);
41423  };
41424  
41425  /**
41426   * Finds the mode value out of the array passed favouring the first value
41427   * as a tiebreaker.
41428   *
41429   * @param values Values to determine the mode from.
41430   *
41431   * @return The mode value.
41432   */
41433  function mode(values) {
41434    if (values.length === 0) {
41435      return undefined;
41436    }
41437    const map = {};
41438    let maxCount = 0;
41439    let currentMode;
41440    values.forEach(value => {
41441      map[value] = map[value] === undefined ? 1 : map[value] + 1;
41442      if (map[value] > maxCount) {
41443        currentMode = value;
41444        maxCount = map[value];
41445      }
41446    });
41447    return currentMode;
41448  }
41449  
41450  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/border-box-control/border-box-control/hook.js
41451  /**
41452   * WordPress dependencies
41453   */
41454  
41455  
41456  /**
41457   * Internal dependencies
41458   */
41459  
41460  
41461  
41462  
41463  function useBorderBoxControl(props) {
41464    const {
41465      className,
41466      colors = [],
41467      onChange,
41468      enableAlpha = false,
41469      enableStyle = true,
41470      size = 'default',
41471      value,
41472      __experimentalIsRenderedInSidebar = false,
41473      __next40pxDefaultSize,
41474      ...otherProps
41475    } = useContextSystem(props, 'BorderBoxControl');
41476    const computedSize = size === 'default' && __next40pxDefaultSize ? '__unstable-large' : size;
41477    const mixedBorders = hasMixedBorders(value);
41478    const splitBorders = hasSplitBorders(value);
41479    const linkedValue = splitBorders ? getCommonBorder(value) : value;
41480    const splitValue = splitBorders ? value : getSplitBorders(value);
41481  
41482    // If no numeric width value is set, the unit select will be disabled.
41483    const hasWidthValue = !isNaN(parseFloat(`$linkedValue?.width}`));
41484    const [isLinked, setIsLinked] = (0,external_wp_element_namespaceObject.useState)(!mixedBorders);
41485    const toggleLinked = () => setIsLinked(!isLinked);
41486    const onLinkedChange = newBorder => {
41487      if (!newBorder) {
41488        return onChange(undefined);
41489      }
41490  
41491      // If we have all props defined on the new border apply it.
41492      if (!mixedBorders || isCompleteBorder(newBorder)) {
41493        return onChange(isEmptyBorder(newBorder) ? undefined : newBorder);
41494      }
41495  
41496      // If we had mixed borders we might have had some shared border props
41497      // that we need to maintain. For example; we could have mixed borders
41498      // with all the same color but different widths. Then from the linked
41499      // control we change the color. We should keep the separate  widths.
41500      const changes = getBorderDiff(linkedValue, newBorder);
41501      const updatedBorders = {
41502        top: {
41503          ...value?.top,
41504          ...changes
41505        },
41506        right: {
41507          ...value?.right,
41508          ...changes
41509        },
41510        bottom: {
41511          ...value?.bottom,
41512          ...changes
41513        },
41514        left: {
41515          ...value?.left,
41516          ...changes
41517        }
41518      };
41519      if (hasMixedBorders(updatedBorders)) {
41520        return onChange(updatedBorders);
41521      }
41522      const filteredResult = isEmptyBorder(updatedBorders.top) ? undefined : updatedBorders.top;
41523      onChange(filteredResult);
41524    };
41525    const onSplitChange = (newBorder, side) => {
41526      const updatedBorders = {
41527        ...splitValue,
41528        [side]: newBorder
41529      };
41530      if (hasMixedBorders(updatedBorders)) {
41531        onChange(updatedBorders);
41532      } else {
41533        onChange(newBorder);
41534      }
41535    };
41536    const cx = useCx();
41537    const classes = (0,external_wp_element_namespaceObject.useMemo)(() => {
41538      return cx(borderBoxControl, className);
41539    }, [cx, className]);
41540    const linkedControlClassName = (0,external_wp_element_namespaceObject.useMemo)(() => {
41541      return cx(linkedBorderControl());
41542    }, [cx]);
41543    const wrapperClassName = (0,external_wp_element_namespaceObject.useMemo)(() => {
41544      return cx(wrapper);
41545    }, [cx]);
41546    return {
41547      ...otherProps,
41548      className: classes,
41549      colors,
41550      disableUnits: mixedBorders && !hasWidthValue,
41551      enableAlpha,
41552      enableStyle,
41553      hasMixedBorders: mixedBorders,
41554      isLinked,
41555      linkedControlClassName,
41556      onLinkedChange,
41557      onSplitChange,
41558      toggleLinked,
41559      linkedValue,
41560      size: computedSize,
41561      splitValue,
41562      wrapperClassName,
41563      __experimentalIsRenderedInSidebar
41564    };
41565  }
41566  
41567  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/border-box-control/border-box-control/component.js
41568  /**
41569   * WordPress dependencies
41570   */
41571  
41572  
41573  
41574  
41575  /**
41576   * Internal dependencies
41577   */
41578  
41579  
41580  
41581  
41582  
41583  
41584  
41585  
41586  
41587  
41588  const component_BorderLabel = props => {
41589    const {
41590      label,
41591      hideLabelFromVision
41592    } = props;
41593    if (!label) {
41594      return null;
41595    }
41596    return hideLabelFromVision ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(visually_hidden_component, {
41597      as: "label",
41598      children: label
41599    }) : /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(StyledLabel, {
41600      children: label
41601    });
41602  };
41603  const UnconnectedBorderBoxControl = (props, forwardedRef) => {
41604    const {
41605      className,
41606      colors,
41607      disableCustomColors,
41608      disableUnits,
41609      enableAlpha,
41610      enableStyle,
41611      hasMixedBorders,
41612      hideLabelFromVision,
41613      isLinked,
41614      label,
41615      linkedControlClassName,
41616      linkedValue,
41617      onLinkedChange,
41618      onSplitChange,
41619      popoverPlacement,
41620      popoverOffset,
41621      size,
41622      splitValue,
41623      toggleLinked,
41624      wrapperClassName,
41625      __experimentalIsRenderedInSidebar,
41626      ...otherProps
41627    } = useBorderBoxControl(props);
41628  
41629    // Use internal state instead of a ref to make sure that the component
41630    // re-renders when the popover's anchor updates.
41631    const [popoverAnchor, setPopoverAnchor] = (0,external_wp_element_namespaceObject.useState)(null);
41632  
41633    // Memoize popoverProps to avoid returning a new object every time.
41634    const popoverProps = (0,external_wp_element_namespaceObject.useMemo)(() => popoverPlacement ? {
41635      placement: popoverPlacement,
41636      offset: popoverOffset,
41637      anchor: popoverAnchor,
41638      shift: true
41639    } : undefined, [popoverPlacement, popoverOffset, popoverAnchor]);
41640    const mergedRef = (0,external_wp_compose_namespaceObject.useMergeRefs)([setPopoverAnchor, forwardedRef]);
41641    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(component, {
41642      className: className,
41643      ...otherProps,
41644      ref: mergedRef,
41645      children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(component_BorderLabel, {
41646        label: label,
41647        hideLabelFromVision: hideLabelFromVision
41648      }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(component, {
41649        className: wrapperClassName,
41650        children: [isLinked ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(border_control_component, {
41651          className: linkedControlClassName,
41652          colors: colors,
41653          disableUnits: disableUnits,
41654          disableCustomColors: disableCustomColors,
41655          enableAlpha: enableAlpha,
41656          enableStyle: enableStyle,
41657          onChange: onLinkedChange,
41658          placeholder: hasMixedBorders ? (0,external_wp_i18n_namespaceObject.__)('Mixed') : undefined,
41659          __unstablePopoverProps: popoverProps,
41660          shouldSanitizeBorder: false // This component will handle that.
41661          ,
41662          value: linkedValue,
41663          withSlider: true,
41664          width: size === '__unstable-large' ? '116px' : '110px',
41665          __experimentalIsRenderedInSidebar: __experimentalIsRenderedInSidebar,
41666          size: size
41667        }) : /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(border_box_control_split_controls_component, {
41668          colors: colors,
41669          disableCustomColors: disableCustomColors,
41670          enableAlpha: enableAlpha,
41671          enableStyle: enableStyle,
41672          onChange: onSplitChange,
41673          popoverPlacement: popoverPlacement,
41674          popoverOffset: popoverOffset,
41675          value: splitValue,
41676          __experimentalIsRenderedInSidebar: __experimentalIsRenderedInSidebar,
41677          size: size
41678        }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(border_box_control_linked_button_component, {
41679          onClick: toggleLinked,
41680          isLinked: isLinked,
41681          size: size
41682        })]
41683      })]
41684    });
41685  };
41686  
41687  /**
41688   * The `BorderBoxControl` effectively has two view states. The first, a "linked"
41689   * view, allows configuration of a flat border via a single `BorderControl`.
41690   * The second, a "split" view, contains a `BorderControl` for each side
41691   * as well as a visualizer for the currently selected borders. Each view also
41692   * contains a button to toggle between the two.
41693   *
41694   * When switching from the "split" view to "linked", if the individual side
41695   * borders are not consistent, the "linked" view will display any border
41696   * properties selections that are consistent while showing a mixed state for
41697   * those that aren't. For example, if all borders had the same color and style
41698   * but different widths, then the border dropdown in the "linked" view's
41699   * `BorderControl` would show that consistent color and style but the "linked"
41700   * view's width input would show "Mixed" placeholder text.
41701   *
41702   * ```jsx
41703   * import { __experimentalBorderBoxControl as BorderBoxControl } from '@wordpress/components';
41704   * import { __ } from '@wordpress/i18n';
41705   *
41706   * const colors = [
41707   *     { name: 'Blue 20', color: '#72aee6' },
41708   *     // ...
41709   * ];
41710   *
41711   * const MyBorderBoxControl = () => {
41712   *     const defaultBorder = {
41713   *         color: '#72aee6',
41714   *         style: 'dashed',
41715   *         width: '1px',
41716   *     };
41717   *     const [ borders, setBorders ] = useState( {
41718   *         top: defaultBorder,
41719   *         right: defaultBorder,
41720   *         bottom: defaultBorder,
41721   *         left: defaultBorder,
41722   *     } );
41723   *     const onChange = ( newBorders ) => setBorders( newBorders );
41724   *
41725   *     return (
41726   *         <BorderBoxControl
41727   *             colors={ colors }
41728   *             label={ __( 'Borders' ) }
41729   *             onChange={ onChange }
41730   *             value={ borders }
41731   *         />
41732   *     );
41733   * };
41734   * ```
41735   */
41736  const BorderBoxControl = contextConnect(UnconnectedBorderBoxControl, 'BorderBoxControl');
41737  /* harmony default export */ const border_box_control_component = (BorderBoxControl);
41738  
41739  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/box-control/styles/box-control-icon-styles.js
41740  
41741  function box_control_icon_styles_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)."; }
41742  /**
41743   * External dependencies
41744   */
41745  
41746  const box_control_icon_styles_Root = /*#__PURE__*/emotion_styled_base_browser_esm("span",  true ? {
41747    target: "e1j5nr4z8"
41748  } : 0)( true ? {
41749    name: "1w884gc",
41750    styles: "box-sizing:border-box;display:block;width:24px;height:24px;position:relative;padding:4px"
41751  } : 0);
41752  const Viewbox = /*#__PURE__*/emotion_styled_base_browser_esm("span",  true ? {
41753    target: "e1j5nr4z7"
41754  } : 0)( true ? {
41755    name: "i6vjox",
41756    styles: "box-sizing:border-box;display:block;position:relative;width:100%;height:100%"
41757  } : 0);
41758  const strokeFocus = ({
41759    isFocused
41760  }) => {
41761    return /*#__PURE__*/emotion_react_browser_esm_css({
41762      backgroundColor: 'currentColor',
41763      opacity: isFocused ? 1 : 0.3
41764    },  true ? "" : 0,  true ? "" : 0);
41765  };
41766  const Stroke = /*#__PURE__*/emotion_styled_base_browser_esm("span",  true ? {
41767    target: "e1j5nr4z6"
41768  } : 0)("box-sizing:border-box;display:block;pointer-events:none;position:absolute;", strokeFocus, ";" + ( true ? "" : 0));
41769  const VerticalStroke = /*#__PURE__*/emotion_styled_base_browser_esm(Stroke,  true ? {
41770    target: "e1j5nr4z5"
41771  } : 0)( true ? {
41772    name: "1k2w39q",
41773    styles: "bottom:3px;top:3px;width:2px"
41774  } : 0);
41775  const HorizontalStroke = /*#__PURE__*/emotion_styled_base_browser_esm(Stroke,  true ? {
41776    target: "e1j5nr4z4"
41777  } : 0)( true ? {
41778    name: "1q9b07k",
41779    styles: "height:2px;left:3px;right:3px"
41780  } : 0);
41781  const TopStroke = /*#__PURE__*/emotion_styled_base_browser_esm(HorizontalStroke,  true ? {
41782    target: "e1j5nr4z3"
41783  } : 0)( true ? {
41784    name: "abcix4",
41785    styles: "top:0"
41786  } : 0);
41787  const RightStroke = /*#__PURE__*/emotion_styled_base_browser_esm(VerticalStroke,  true ? {
41788    target: "e1j5nr4z2"
41789  } : 0)( true ? {
41790    name: "1wf8jf",
41791    styles: "right:0"
41792  } : 0);
41793  const BottomStroke = /*#__PURE__*/emotion_styled_base_browser_esm(HorizontalStroke,  true ? {
41794    target: "e1j5nr4z1"
41795  } : 0)( true ? {
41796    name: "8tapst",
41797    styles: "bottom:0"
41798  } : 0);
41799  const LeftStroke = /*#__PURE__*/emotion_styled_base_browser_esm(VerticalStroke,  true ? {
41800    target: "e1j5nr4z0"
41801  } : 0)( true ? {
41802    name: "1ode3cm",
41803    styles: "left:0"
41804  } : 0);
41805  
41806  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/box-control/icon.js
41807  /**
41808   * Internal dependencies
41809   */
41810  
41811  
41812  
41813  
41814  const BASE_ICON_SIZE = 24;
41815  function BoxControlIcon({
41816    size = 24,
41817    side = 'all',
41818    sides,
41819    ...props
41820  }) {
41821    const isSideDisabled = value => sides?.length && !sides.includes(value);
41822    const hasSide = value => {
41823      if (isSideDisabled(value)) {
41824        return false;
41825      }
41826      return side === 'all' || side === value;
41827    };
41828    const top = hasSide('top') || hasSide('vertical');
41829    const right = hasSide('right') || hasSide('horizontal');
41830    const bottom = hasSide('bottom') || hasSide('vertical');
41831    const left = hasSide('left') || hasSide('horizontal');
41832  
41833    // Simulates SVG Icon scaling.
41834    const scale = size / BASE_ICON_SIZE;
41835    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(box_control_icon_styles_Root, {
41836      style: {
41837        transform: `scale($scale})`
41838      },
41839      ...props,
41840      children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(Viewbox, {
41841        children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(TopStroke, {
41842          isFocused: top
41843        }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(RightStroke, {
41844          isFocused: right
41845        }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BottomStroke, {
41846          isFocused: bottom
41847        }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(LeftStroke, {
41848          isFocused: left
41849        })]
41850      })
41851    });
41852  }
41853  
41854  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/box-control/styles/box-control-styles.js
41855  
41856  function box_control_styles_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)."; }
41857  /**
41858   * External dependencies
41859   */
41860  
41861  /**
41862   * Internal dependencies
41863   */
41864  
41865  
41866  
41867  
41868  
41869  
41870  const StyledUnitControl = /*#__PURE__*/emotion_styled_base_browser_esm(unit_control,  true ? {
41871    target: "e1jovhle5"
41872  } : 0)( true ? {
41873    name: "1ejyr19",
41874    styles: "max-width:90px"
41875  } : 0);
41876  const InputWrapper = /*#__PURE__*/emotion_styled_base_browser_esm(h_stack_component,  true ? {
41877    target: "e1jovhle4"
41878  } : 0)( true ? {
41879    name: "1j1lmoi",
41880    styles: "grid-column:1/span 3"
41881  } : 0);
41882  const ResetButton = /*#__PURE__*/emotion_styled_base_browser_esm(build_module_button,  true ? {
41883    target: "e1jovhle3"
41884  } : 0)( true ? {
41885    name: "tkya7b",
41886    styles: "grid-area:1/2;justify-self:end"
41887  } : 0);
41888  const LinkedButtonWrapper = /*#__PURE__*/emotion_styled_base_browser_esm("div",  true ? {
41889    target: "e1jovhle2"
41890  } : 0)( true ? {
41891    name: "1dfa8al",
41892    styles: "grid-area:1/3;justify-self:end"
41893  } : 0);
41894  const FlexedBoxControlIcon = /*#__PURE__*/emotion_styled_base_browser_esm(BoxControlIcon,  true ? {
41895    target: "e1jovhle1"
41896  } : 0)( true ? {
41897    name: "ou8xsw",
41898    styles: "flex:0 0 auto"
41899  } : 0);
41900  const FlexedRangeControl = /*#__PURE__*/emotion_styled_base_browser_esm(range_control,  true ? {
41901    target: "e1jovhle0"
41902  } : 0)("width:100%;margin-inline-end:", space(2), ";" + ( true ? "" : 0));
41903  
41904  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/box-control/utils.js
41905  /**
41906   * WordPress dependencies
41907   */
41908  
41909  
41910  /**
41911   * Internal dependencies
41912   */
41913  
41914  const CUSTOM_VALUE_SETTINGS = {
41915    px: {
41916      max: 300,
41917      step: 1
41918    },
41919    '%': {
41920      max: 100,
41921      step: 1
41922    },
41923    vw: {
41924      max: 100,
41925      step: 1
41926    },
41927    vh: {
41928      max: 100,
41929      step: 1
41930    },
41931    em: {
41932      max: 10,
41933      step: 0.1
41934    },
41935    rm: {
41936      max: 10,
41937      step: 0.1
41938    },
41939    svw: {
41940      max: 100,
41941      step: 1
41942    },
41943    lvw: {
41944      max: 100,
41945      step: 1
41946    },
41947    dvw: {
41948      max: 100,
41949      step: 1
41950    },
41951    svh: {
41952      max: 100,
41953      step: 1
41954    },
41955    lvh: {
41956      max: 100,
41957      step: 1
41958    },
41959    dvh: {
41960      max: 100,
41961      step: 1
41962    },
41963    vi: {
41964      max: 100,
41965      step: 1
41966    },
41967    svi: {
41968      max: 100,
41969      step: 1
41970    },
41971    lvi: {
41972      max: 100,
41973      step: 1
41974    },
41975    dvi: {
41976      max: 100,
41977      step: 1
41978    },
41979    vb: {
41980      max: 100,
41981      step: 1
41982    },
41983    svb: {
41984      max: 100,
41985      step: 1
41986    },
41987    lvb: {
41988      max: 100,
41989      step: 1
41990    },
41991    dvb: {
41992      max: 100,
41993      step: 1
41994    },
41995    vmin: {
41996      max: 100,
41997      step: 1
41998    },
41999    svmin: {
42000      max: 100,
42001      step: 1
42002    },
42003    lvmin: {
42004      max: 100,
42005      step: 1
42006    },
42007    dvmin: {
42008      max: 100,
42009      step: 1
42010    },
42011    vmax: {
42012      max: 100,
42013      step: 1
42014    },
42015    svmax: {
42016      max: 100,
42017      step: 1
42018    },
42019    lvmax: {
42020      max: 100,
42021      step: 1
42022    },
42023    dvmax: {
42024      max: 100,
42025      step: 1
42026    }
42027  };
42028  const LABELS = {
42029    all: (0,external_wp_i18n_namespaceObject.__)('All sides'),
42030    top: (0,external_wp_i18n_namespaceObject.__)('Top side'),
42031    bottom: (0,external_wp_i18n_namespaceObject.__)('Bottom side'),
42032    left: (0,external_wp_i18n_namespaceObject.__)('Left side'),
42033    right: (0,external_wp_i18n_namespaceObject.__)('Right side'),
42034    mixed: (0,external_wp_i18n_namespaceObject.__)('Mixed'),
42035    vertical: (0,external_wp_i18n_namespaceObject.__)('Top and bottom sides'),
42036    horizontal: (0,external_wp_i18n_namespaceObject.__)('Left and right sides')
42037  };
42038  const DEFAULT_VALUES = {
42039    top: undefined,
42040    right: undefined,
42041    bottom: undefined,
42042    left: undefined
42043  };
42044  const ALL_SIDES = ['top', 'right', 'bottom', 'left'];
42045  
42046  /**
42047   * Gets an items with the most occurrence within an array
42048   * https://stackoverflow.com/a/20762713
42049   *
42050   * @param arr Array of items to check.
42051   * @return The item with the most occurrences.
42052   */
42053  function utils_mode(arr) {
42054    return arr.sort((a, b) => arr.filter(v => v === a).length - arr.filter(v => v === b).length).pop();
42055  }
42056  
42057  /**
42058   * Gets the 'all' input value and unit from values data.
42059   *
42060   * @param values         Box values.
42061   * @param selectedUnits  Box units.
42062   * @param availableSides Available box sides to evaluate.
42063   *
42064   * @return A value + unit for the 'all' input.
42065   */
42066  function getAllValue(values = {}, selectedUnits, availableSides = ALL_SIDES) {
42067    const sides = normalizeSides(availableSides);
42068    const parsedQuantitiesAndUnits = sides.map(side => parseQuantityAndUnitFromRawValue(values[side]));
42069    const allParsedQuantities = parsedQuantitiesAndUnits.map(value => {
42070      var _value$;
42071      return (_value$ = value[0]) !== null && _value$ !== void 0 ? _value$ : '';
42072    });
42073    const allParsedUnits = parsedQuantitiesAndUnits.map(value => value[1]);
42074    const commonQuantity = allParsedQuantities.every(v => v === allParsedQuantities[0]) ? allParsedQuantities[0] : '';
42075  
42076    /**
42077     * The typeof === 'number' check is important. On reset actions, the incoming value
42078     * may be null or an empty string.
42079     *
42080     * Also, the value may also be zero (0), which is considered a valid unit value.
42081     *
42082     * typeof === 'number' is more specific for these cases, rather than relying on a
42083     * simple truthy check.
42084     */
42085    let commonUnit;
42086    if (typeof commonQuantity === 'number') {
42087      commonUnit = utils_mode(allParsedUnits);
42088    } else {
42089      var _getAllUnitFallback;
42090      // Set meaningful unit selection if no commonQuantity and user has previously
42091      // selected units without assigning values while controls were unlinked.
42092      commonUnit = (_getAllUnitFallback = getAllUnitFallback(selectedUnits)) !== null && _getAllUnitFallback !== void 0 ? _getAllUnitFallback : utils_mode(allParsedUnits);
42093    }
42094    return [commonQuantity, commonUnit].join('');
42095  }
42096  
42097  /**
42098   * Determine the most common unit selection to use as a fallback option.
42099   *
42100   * @param selectedUnits Current unit selections for individual sides.
42101   * @return  Most common unit selection.
42102   */
42103  function getAllUnitFallback(selectedUnits) {
42104    if (!selectedUnits || typeof selectedUnits !== 'object') {
42105      return undefined;
42106    }
42107    const filteredUnits = Object.values(selectedUnits).filter(Boolean);
42108    return utils_mode(filteredUnits);
42109  }
42110  
42111  /**
42112   * Checks to determine if values are mixed.
42113   *
42114   * @param values        Box values.
42115   * @param selectedUnits Box units.
42116   * @param sides         Available box sides to evaluate.
42117   *
42118   * @return Whether values are mixed.
42119   */
42120  function isValuesMixed(values = {}, selectedUnits, sides = ALL_SIDES) {
42121    const allValue = getAllValue(values, selectedUnits, sides);
42122    const isMixed = isNaN(parseFloat(allValue));
42123    return isMixed;
42124  }
42125  
42126  /**
42127   * Checks to determine if values are defined.
42128   *
42129   * @param values Box values.
42130   *
42131   * @return  Whether values are mixed.
42132   */
42133  function isValuesDefined(values) {
42134    return values && Object.values(values).filter(
42135    // Switching units when input is empty causes values only
42136    // containing units. This gives false positive on mixed values
42137    // unless filtered.
42138    value => !!value && /\d/.test(value)).length > 0;
42139  }
42140  
42141  /**
42142   * Get initial selected side, factoring in whether the sides are linked,
42143   * and whether the vertical / horizontal directions are grouped via splitOnAxis.
42144   *
42145   * @param isLinked    Whether the box control's fields are linked.
42146   * @param splitOnAxis Whether splitting by horizontal or vertical axis.
42147   * @return The initial side.
42148   */
42149  function getInitialSide(isLinked, splitOnAxis) {
42150    let initialSide = 'all';
42151    if (!isLinked) {
42152      initialSide = splitOnAxis ? 'vertical' : 'top';
42153    }
42154    return initialSide;
42155  }
42156  
42157  /**
42158   * Normalizes provided sides configuration to an array containing only top,
42159   * right, bottom and left. This essentially just maps `horizontal` or `vertical`
42160   * to their appropriate sides to facilitate correctly determining value for
42161   * all input control.
42162   *
42163   * @param sides Available sides for box control.
42164   * @return Normalized sides configuration.
42165   */
42166  function normalizeSides(sides) {
42167    const filteredSides = [];
42168    if (!sides?.length) {
42169      return ALL_SIDES;
42170    }
42171    if (sides.includes('vertical')) {
42172      filteredSides.push(...['top', 'bottom']);
42173    } else if (sides.includes('horizontal')) {
42174      filteredSides.push(...['left', 'right']);
42175    } else {
42176      const newSides = ALL_SIDES.filter(side => sides.includes(side));
42177      filteredSides.push(...newSides);
42178    }
42179    return filteredSides;
42180  }
42181  
42182  /**
42183   * Applies a value to an object representing top, right, bottom and left sides
42184   * while taking into account any custom side configuration.
42185   *
42186   * @param currentValues The current values for each side.
42187   * @param newValue      The value to apply to the sides object.
42188   * @param sides         Array defining valid sides.
42189   *
42190   * @return Object containing the updated values for each side.
42191   */
42192  function applyValueToSides(currentValues, newValue, sides) {
42193    const newValues = {
42194      ...currentValues
42195    };
42196    if (sides?.length) {
42197      sides.forEach(side => {
42198        if (side === 'vertical') {
42199          newValues.top = newValue;
42200          newValues.bottom = newValue;
42201        } else if (side === 'horizontal') {
42202          newValues.left = newValue;
42203          newValues.right = newValue;
42204        } else {
42205          newValues[side] = newValue;
42206        }
42207      });
42208    } else {
42209      ALL_SIDES.forEach(side => newValues[side] = newValue);
42210    }
42211    return newValues;
42212  }
42213  
42214  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/box-control/all-input-control.js
42215  /**
42216   * WordPress dependencies
42217   */
42218  
42219  /**
42220   * Internal dependencies
42221   */
42222  
42223  
42224  
42225  
42226  
42227  
42228  
42229  const all_input_control_noop = () => {};
42230  function AllInputControl({
42231    __next40pxDefaultSize,
42232    onChange = all_input_control_noop,
42233    onFocus = all_input_control_noop,
42234    values,
42235    sides,
42236    selectedUnits,
42237    setSelectedUnits,
42238    ...props
42239  }) {
42240    var _CUSTOM_VALUE_SETTING, _CUSTOM_VALUE_SETTING2;
42241    const inputId = (0,external_wp_compose_namespaceObject.useInstanceId)(AllInputControl, 'box-control-input-all');
42242    const allValue = getAllValue(values, selectedUnits, sides);
42243    const hasValues = isValuesDefined(values);
42244    const isMixed = hasValues && isValuesMixed(values, selectedUnits, sides);
42245    const allPlaceholder = isMixed ? LABELS.mixed : undefined;
42246    const [parsedQuantity, parsedUnit] = parseQuantityAndUnitFromRawValue(allValue);
42247    const handleOnFocus = event => {
42248      onFocus(event, {
42249        side: 'all'
42250      });
42251    };
42252    const onValueChange = next => {
42253      const isNumeric = next !== undefined && !isNaN(parseFloat(next));
42254      const nextValue = isNumeric ? next : undefined;
42255      const nextValues = applyValueToSides(values, nextValue, sides);
42256      onChange(nextValues);
42257    };
42258    const sliderOnChange = next => {
42259      onValueChange(next !== undefined ? [next, parsedUnit].join('') : undefined);
42260    };
42261  
42262    // Set selected unit so it can be used as fallback by unlinked controls
42263    // when individual sides do not have a value containing a unit.
42264    const handleOnUnitChange = unit => {
42265      const newUnits = applyValueToSides(selectedUnits, unit, sides);
42266      setSelectedUnits(newUnits);
42267    };
42268    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, {
42269      children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(StyledUnitControl, {
42270        ...props,
42271        __next40pxDefaultSize: __next40pxDefaultSize,
42272        className: "component-box-control__unit-control",
42273        disableUnits: isMixed,
42274        id: inputId,
42275        isPressEnterToChange: true,
42276        value: allValue,
42277        onChange: onValueChange,
42278        onUnitChange: handleOnUnitChange,
42279        onFocus: handleOnFocus,
42280        placeholder: allPlaceholder,
42281        label: LABELS.all,
42282        hideLabelFromVision: true
42283      }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(FlexedRangeControl, {
42284        __nextHasNoMarginBottom: true,
42285        __next40pxDefaultSize: __next40pxDefaultSize,
42286        "aria-controls": inputId,
42287        label: LABELS.all,
42288        hideLabelFromVision: true,
42289        onChange: sliderOnChange,
42290        min: 0,
42291        max: (_CUSTOM_VALUE_SETTING = CUSTOM_VALUE_SETTINGS[parsedUnit !== null && parsedUnit !== void 0 ? parsedUnit : 'px']?.max) !== null && _CUSTOM_VALUE_SETTING !== void 0 ? _CUSTOM_VALUE_SETTING : 10,
42292        step: (_CUSTOM_VALUE_SETTING2 = CUSTOM_VALUE_SETTINGS[parsedUnit !== null && parsedUnit !== void 0 ? parsedUnit : 'px']?.step) !== null && _CUSTOM_VALUE_SETTING2 !== void 0 ? _CUSTOM_VALUE_SETTING2 : 0.1,
42293        value: parsedQuantity !== null && parsedQuantity !== void 0 ? parsedQuantity : 0,
42294        withInputField: false
42295      })]
42296    });
42297  }
42298  
42299  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/box-control/input-controls.js
42300  /**
42301   * WordPress dependencies
42302   */
42303  
42304  /**
42305   * Internal dependencies
42306   */
42307  
42308  
42309  
42310  
42311  
42312  
42313  
42314  const input_controls_noop = () => {};
42315  function BoxInputControls({
42316    __next40pxDefaultSize,
42317    onChange = input_controls_noop,
42318    onFocus = input_controls_noop,
42319    values,
42320    selectedUnits,
42321    setSelectedUnits,
42322    sides,
42323    ...props
42324  }) {
42325    const generatedId = (0,external_wp_compose_namespaceObject.useInstanceId)(BoxInputControls, 'box-control-input');
42326    const createHandleOnFocus = side => event => {
42327      onFocus(event, {
42328        side
42329      });
42330    };
42331    const handleOnChange = nextValues => {
42332      onChange(nextValues);
42333    };
42334    const handleOnValueChange = (side, next, extra) => {
42335      const nextValues = {
42336        ...values
42337      };
42338      const isNumeric = next !== undefined && !isNaN(parseFloat(next));
42339      const nextValue = isNumeric ? next : undefined;
42340      nextValues[side] = nextValue;
42341  
42342      /**
42343       * Supports changing pair sides. For example, holding the ALT key
42344       * when changing the TOP will also update BOTTOM.
42345       */
42346      // @ts-expect-error - TODO: event.altKey is only present when the change event was
42347      // triggered by a keyboard event. Should this feature be implemented differently so
42348      // it also works with drag events?
42349      if (extra?.event.altKey) {
42350        switch (side) {
42351          case 'top':
42352            nextValues.bottom = nextValue;
42353            break;
42354          case 'bottom':
42355            nextValues.top = nextValue;
42356            break;
42357          case 'left':
42358            nextValues.right = nextValue;
42359            break;
42360          case 'right':
42361            nextValues.left = nextValue;
42362            break;
42363        }
42364      }
42365      handleOnChange(nextValues);
42366    };
42367    const createHandleOnUnitChange = side => next => {
42368      const newUnits = {
42369        ...selectedUnits
42370      };
42371      newUnits[side] = next;
42372      setSelectedUnits(newUnits);
42373    };
42374  
42375    // Filter sides if custom configuration provided, maintaining default order.
42376    const filteredSides = sides?.length ? ALL_SIDES.filter(side => sides.includes(side)) : ALL_SIDES;
42377    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_ReactJSXRuntime_namespaceObject.Fragment, {
42378      children: filteredSides.map(side => {
42379        var _CUSTOM_VALUE_SETTING, _CUSTOM_VALUE_SETTING2;
42380        const [parsedQuantity, parsedUnit] = parseQuantityAndUnitFromRawValue(values[side]);
42381        const computedUnit = values[side] ? parsedUnit : selectedUnits[side];
42382        const inputId = [generatedId, side].join('-');
42383        return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(InputWrapper, {
42384          expanded: true,
42385          children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(FlexedBoxControlIcon, {
42386            side: side,
42387            sides: sides
42388          }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(tooltip, {
42389            placement: "top-end",
42390            text: LABELS[side],
42391            children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(StyledUnitControl, {
42392              ...props,
42393              __next40pxDefaultSize: __next40pxDefaultSize,
42394              className: "component-box-control__unit-control",
42395              id: inputId,
42396              isPressEnterToChange: true,
42397              value: [parsedQuantity, computedUnit].join(''),
42398              onChange: (nextValue, extra) => handleOnValueChange(side, nextValue, extra),
42399              onUnitChange: createHandleOnUnitChange(side),
42400              onFocus: createHandleOnFocus(side),
42401              label: LABELS[side],
42402              hideLabelFromVision: true
42403            })
42404          }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(FlexedRangeControl, {
42405            __nextHasNoMarginBottom: true,
42406            __next40pxDefaultSize: __next40pxDefaultSize,
42407            "aria-controls": inputId,
42408            label: LABELS[side],
42409            hideLabelFromVision: true,
42410            onChange: newValue => {
42411              handleOnValueChange(side, newValue !== undefined ? [newValue, computedUnit].join('') : undefined);
42412            },
42413            min: 0,
42414            max: (_CUSTOM_VALUE_SETTING = CUSTOM_VALUE_SETTINGS[computedUnit !== null && computedUnit !== void 0 ? computedUnit : 'px']?.max) !== null && _CUSTOM_VALUE_SETTING !== void 0 ? _CUSTOM_VALUE_SETTING : 10,
42415            step: (_CUSTOM_VALUE_SETTING2 = CUSTOM_VALUE_SETTINGS[computedUnit !== null && computedUnit !== void 0 ? computedUnit : 'px']?.step) !== null && _CUSTOM_VALUE_SETTING2 !== void 0 ? _CUSTOM_VALUE_SETTING2 : 0.1,
42416            value: parsedQuantity !== null && parsedQuantity !== void 0 ? parsedQuantity : 0,
42417            withInputField: false
42418          })]
42419        }, `box-control-$side}`);
42420      })
42421    });
42422  }
42423  
42424  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/box-control/axial-input-controls.js
42425  /**
42426   * WordPress dependencies
42427   */
42428  
42429  /**
42430   * Internal dependencies
42431   */
42432  
42433  
42434  
42435  
42436  
42437  
42438  
42439  
42440  const groupedSides = ['vertical', 'horizontal'];
42441  function AxialInputControls({
42442    __next40pxDefaultSize,
42443    onChange,
42444    onFocus,
42445    values,
42446    selectedUnits,
42447    setSelectedUnits,
42448    sides,
42449    ...props
42450  }) {
42451    const generatedId = (0,external_wp_compose_namespaceObject.useInstanceId)(AxialInputControls, `box-control-input`);
42452    const createHandleOnFocus = side => event => {
42453      if (!onFocus) {
42454        return;
42455      }
42456      onFocus(event, {
42457        side
42458      });
42459    };
42460    const handleOnValueChange = (side, next) => {
42461      if (!onChange) {
42462        return;
42463      }
42464      const nextValues = {
42465        ...values
42466      };
42467      const isNumeric = next !== undefined && !isNaN(parseFloat(next));
42468      const nextValue = isNumeric ? next : undefined;
42469      if (side === 'vertical') {
42470        nextValues.top = nextValue;
42471        nextValues.bottom = nextValue;
42472      }
42473      if (side === 'horizontal') {
42474        nextValues.left = nextValue;
42475        nextValues.right = nextValue;
42476      }
42477      onChange(nextValues);
42478    };
42479    const createHandleOnUnitChange = side => next => {
42480      const newUnits = {
42481        ...selectedUnits
42482      };
42483      if (side === 'vertical') {
42484        newUnits.top = next;
42485        newUnits.bottom = next;
42486      }
42487      if (side === 'horizontal') {
42488        newUnits.left = next;
42489        newUnits.right = next;
42490      }
42491      setSelectedUnits(newUnits);
42492    };
42493  
42494    // Filter sides if custom configuration provided, maintaining default order.
42495    const filteredSides = sides?.length ? groupedSides.filter(side => sides.includes(side)) : groupedSides;
42496    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_ReactJSXRuntime_namespaceObject.Fragment, {
42497      children: filteredSides.map(side => {
42498        var _CUSTOM_VALUE_SETTING, _CUSTOM_VALUE_SETTING2;
42499        const [parsedQuantity, parsedUnit] = parseQuantityAndUnitFromRawValue(side === 'vertical' ? values.top : values.left);
42500        const selectedUnit = side === 'vertical' ? selectedUnits.top : selectedUnits.left;
42501        const inputId = [generatedId, side].join('-');
42502        return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(InputWrapper, {
42503          children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(FlexedBoxControlIcon, {
42504            side: side,
42505            sides: sides
42506          }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(tooltip, {
42507            placement: "top-end",
42508            text: LABELS[side],
42509            children: /*#__PURE__*/(0,external_React_.createElement)(StyledUnitControl, {
42510              ...props,
42511              __next40pxDefaultSize: __next40pxDefaultSize,
42512              className: "component-box-control__unit-control",
42513              id: inputId,
42514              isPressEnterToChange: true,
42515              value: [parsedQuantity, selectedUnit !== null && selectedUnit !== void 0 ? selectedUnit : parsedUnit].join(''),
42516              onChange: newValue => handleOnValueChange(side, newValue),
42517              onUnitChange: createHandleOnUnitChange(side),
42518              onFocus: createHandleOnFocus(side),
42519              label: LABELS[side],
42520              hideLabelFromVision: true,
42521              key: side
42522            })
42523          }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(FlexedRangeControl, {
42524            __nextHasNoMarginBottom: true,
42525            __next40pxDefaultSize: __next40pxDefaultSize,
42526            "aria-controls": inputId,
42527            label: LABELS[side],
42528            hideLabelFromVision: true,
42529            onChange: newValue => handleOnValueChange(side, newValue !== undefined ? [newValue, selectedUnit !== null && selectedUnit !== void 0 ? selectedUnit : parsedUnit].join('') : undefined),
42530            min: 0,
42531            max: (_CUSTOM_VALUE_SETTING = CUSTOM_VALUE_SETTINGS[selectedUnit !== null && selectedUnit !== void 0 ? selectedUnit : 'px']?.max) !== null && _CUSTOM_VALUE_SETTING !== void 0 ? _CUSTOM_VALUE_SETTING : 10,
42532            step: (_CUSTOM_VALUE_SETTING2 = CUSTOM_VALUE_SETTINGS[selectedUnit !== null && selectedUnit !== void 0 ? selectedUnit : 'px']?.step) !== null && _CUSTOM_VALUE_SETTING2 !== void 0 ? _CUSTOM_VALUE_SETTING2 : 0.1,
42533            value: parsedQuantity !== null && parsedQuantity !== void 0 ? parsedQuantity : 0,
42534            withInputField: false
42535          })]
42536        }, side);
42537      })
42538    });
42539  }
42540  
42541  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/box-control/linked-button.js
42542  /**
42543   * WordPress dependencies
42544   */
42545  
42546  
42547  
42548  /**
42549   * Internal dependencies
42550   */
42551  
42552  
42553  
42554  function LinkedButton({
42555    isLinked,
42556    ...props
42557  }) {
42558    const label = isLinked ? (0,external_wp_i18n_namespaceObject.__)('Unlink sides') : (0,external_wp_i18n_namespaceObject.__)('Link sides');
42559    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(tooltip, {
42560      text: label,
42561      children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, {
42562        ...props,
42563        className: "component-box-control__linked-button",
42564        size: "small",
42565        icon: isLinked ? library_link : link_off,
42566        iconSize: 24,
42567        "aria-label": label
42568      })
42569    });
42570  }
42571  
42572  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/box-control/index.js
42573  /**
42574   * WordPress dependencies
42575   */
42576  
42577  
42578  
42579  
42580  /**
42581   * Internal dependencies
42582   */
42583  
42584  
42585  
42586  
42587  
42588  
42589  
42590  
42591  
42592  
42593  
42594  
42595  const defaultInputProps = {
42596    min: 0
42597  };
42598  const box_control_noop = () => {};
42599  function box_control_useUniqueId(idProp) {
42600    const instanceId = (0,external_wp_compose_namespaceObject.useInstanceId)(BoxControl, 'inspector-box-control');
42601    return idProp || instanceId;
42602  }
42603  
42604  /**
42605   * BoxControl components let users set values for Top, Right, Bottom, and Left.
42606   * This can be used as an input control for values like `padding` or `margin`.
42607   *
42608   * ```jsx
42609   * import { __experimentalBoxControl as BoxControl } from '@wordpress/components';
42610   * import { useState } from '@wordpress/element';
42611   *
42612   * const Example = () => {
42613   *     const [ values, setValues ] = useState( {
42614   *         top: '50px',
42615   *         left: '10%',
42616   *         right: '10%',
42617   *         bottom: '50px',
42618   *     } );
42619   *
42620   *     return (
42621   *         <BoxControl
42622   *             values={ values }
42623   *             onChange={ ( nextValues ) => setValues( nextValues ) }
42624   *         />
42625   *     );
42626   * };
42627   * ```
42628   */
42629  function BoxControl({
42630    __next40pxDefaultSize = false,
42631    id: idProp,
42632    inputProps = defaultInputProps,
42633    onChange = box_control_noop,
42634    label = (0,external_wp_i18n_namespaceObject.__)('Box Control'),
42635    values: valuesProp,
42636    units,
42637    sides,
42638    splitOnAxis = false,
42639    allowReset = true,
42640    resetValues = DEFAULT_VALUES,
42641    onMouseOver,
42642    onMouseOut
42643  }) {
42644    const [values, setValues] = use_controlled_state(valuesProp, {
42645      fallback: DEFAULT_VALUES
42646    });
42647    const inputValues = values || DEFAULT_VALUES;
42648    const hasInitialValue = isValuesDefined(valuesProp);
42649    const hasOneSide = sides?.length === 1;
42650    const [isDirty, setIsDirty] = (0,external_wp_element_namespaceObject.useState)(hasInitialValue);
42651    const [isLinked, setIsLinked] = (0,external_wp_element_namespaceObject.useState)(!hasInitialValue || !isValuesMixed(inputValues) || hasOneSide);
42652    const [side, setSide] = (0,external_wp_element_namespaceObject.useState)(getInitialSide(isLinked, splitOnAxis));
42653  
42654    // Tracking selected units via internal state allows filtering of CSS unit
42655    // only values from being saved while maintaining preexisting unit selection
42656    // behaviour. Filtering CSS only values prevents invalid style values.
42657    const [selectedUnits, setSelectedUnits] = (0,external_wp_element_namespaceObject.useState)({
42658      top: parseQuantityAndUnitFromRawValue(valuesProp?.top)[1],
42659      right: parseQuantityAndUnitFromRawValue(valuesProp?.right)[1],
42660      bottom: parseQuantityAndUnitFromRawValue(valuesProp?.bottom)[1],
42661      left: parseQuantityAndUnitFromRawValue(valuesProp?.left)[1]
42662    });
42663    const id = box_control_useUniqueId(idProp);
42664    const headingId = `$id}-heading`;
42665    const toggleLinked = () => {
42666      setIsLinked(!isLinked);
42667      setSide(getInitialSide(!isLinked, splitOnAxis));
42668    };
42669    const handleOnFocus = (_event, {
42670      side: nextSide
42671    }) => {
42672      setSide(nextSide);
42673    };
42674    const handleOnChange = nextValues => {
42675      onChange(nextValues);
42676      setValues(nextValues);
42677      setIsDirty(true);
42678    };
42679    const handleOnReset = () => {
42680      onChange(resetValues);
42681      setValues(resetValues);
42682      setSelectedUnits(resetValues);
42683      setIsDirty(false);
42684    };
42685    const inputControlProps = {
42686      ...inputProps,
42687      onChange: handleOnChange,
42688      onFocus: handleOnFocus,
42689      isLinked,
42690      units,
42691      selectedUnits,
42692      setSelectedUnits,
42693      sides,
42694      values: inputValues,
42695      onMouseOver,
42696      onMouseOut,
42697      __next40pxDefaultSize
42698    };
42699    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(grid_component, {
42700      id: id,
42701      columns: 3,
42702      templateColumns: "1fr min-content min-content",
42703      role: "group",
42704      "aria-labelledby": headingId,
42705      children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BaseControl.VisualLabel, {
42706        id: headingId,
42707        children: label
42708      }), isLinked && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(InputWrapper, {
42709        children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(FlexedBoxControlIcon, {
42710          side: side,
42711          sides: sides
42712        }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(AllInputControl, {
42713          ...inputControlProps
42714        })]
42715      }), !hasOneSide && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(LinkedButtonWrapper, {
42716        children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(LinkedButton, {
42717          onClick: toggleLinked,
42718          isLinked: isLinked
42719        })
42720      }), !isLinked && splitOnAxis && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(AxialInputControls, {
42721        ...inputControlProps
42722      }), !isLinked && !splitOnAxis && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BoxInputControls, {
42723        ...inputControlProps
42724      }), allowReset && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ResetButton, {
42725        className: "component-box-control__reset-button",
42726        variant: "secondary",
42727        size: "small",
42728        onClick: handleOnReset,
42729        disabled: !isDirty,
42730        children: (0,external_wp_i18n_namespaceObject.__)('Reset')
42731      })]
42732    });
42733  }
42734  
42735  /* harmony default export */ const box_control = (BoxControl);
42736  
42737  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/button-group/index.js
42738  /**
42739   * External dependencies
42740   */
42741  
42742  /**
42743   * WordPress dependencies
42744   */
42745  
42746  
42747  /**
42748   * Internal dependencies
42749   */
42750  
42751  function UnforwardedButtonGroup(props, ref) {
42752    const {
42753      className,
42754      ...restProps
42755    } = props;
42756    const classes = dist_clsx('components-button-group', className);
42757    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", {
42758      ref: ref,
42759      role: "group",
42760      className: classes,
42761      ...restProps
42762    });
42763  }
42764  
42765  /**
42766   * ButtonGroup can be used to group any related buttons together. To emphasize
42767   * related buttons, a group should share a common container.
42768   *
42769   * ```jsx
42770   * import { Button, ButtonGroup } from '@wordpress/components';
42771   *
42772   * const MyButtonGroup = () => (
42773   *   <ButtonGroup>
42774   *     <Button variant="primary">Button 1</Button>
42775   *     <Button variant="primary">Button 2</Button>
42776   *   </ButtonGroup>
42777   * );
42778   * ```
42779   */
42780  const ButtonGroup = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedButtonGroup);
42781  /* harmony default export */ const button_group = (ButtonGroup);
42782  
42783  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/elevation/styles.js
42784  function elevation_styles_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)."; }
42785  /**
42786   * External dependencies
42787   */
42788  
42789  const Elevation =  true ? {
42790    name: "12ip69d",
42791    styles: "background:transparent;display:block;margin:0!important;pointer-events:none;position:absolute;will-change:box-shadow"
42792  } : 0;
42793  
42794  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/elevation/hook.js
42795  /**
42796   * External dependencies
42797   */
42798  
42799  
42800  
42801  /**
42802   * WordPress dependencies
42803   */
42804  
42805  
42806  /**
42807   * Internal dependencies
42808   */
42809  
42810  
42811  
42812  
42813  
42814  
42815  function getBoxShadow(value) {
42816    const boxShadowColor = `rgba(0, 0, 0, $value / 20})`;
42817    const boxShadow = `0 $value}px $value * 2}px 0
42818      $boxShadowColor}`;
42819    return boxShadow;
42820  }
42821  function useElevation(props) {
42822    const {
42823      active,
42824      borderRadius = 'inherit',
42825      className,
42826      focus,
42827      hover,
42828      isInteractive = false,
42829      offset = 0,
42830      value = 0,
42831      ...otherProps
42832    } = useContextSystem(props, 'Elevation');
42833    const cx = useCx();
42834    const classes = (0,external_wp_element_namespaceObject.useMemo)(() => {
42835      let hoverValue = isValueDefined(hover) ? hover : value * 2;
42836      let activeValue = isValueDefined(active) ? active : value / 2;
42837      if (!isInteractive) {
42838        hoverValue = isValueDefined(hover) ? hover : undefined;
42839        activeValue = isValueDefined(active) ? active : undefined;
42840      }
42841      const transition = `box-shadow $config_values.transitionDuration} $config_values.transitionTimingFunction}`;
42842      const sx = {};
42843      sx.Base = /*#__PURE__*/emotion_react_browser_esm_css({
42844        borderRadius,
42845        bottom: offset,
42846        boxShadow: getBoxShadow(value),
42847        opacity: config_values.elevationIntensity,
42848        left: offset,
42849        right: offset,
42850        top: offset
42851      }, /*#__PURE__*/emotion_react_browser_esm_css("@media not ( prefers-reduced-motion ){transition:", transition, ";}" + ( true ? "" : 0),  true ? "" : 0),  true ? "" : 0,  true ? "" : 0);
42852      if (isValueDefined(hoverValue)) {
42853        sx.hover = /*#__PURE__*/emotion_react_browser_esm_css("*:hover>&{box-shadow:", getBoxShadow(hoverValue), ";}" + ( true ? "" : 0),  true ? "" : 0);
42854      }
42855      if (isValueDefined(activeValue)) {
42856        sx.active = /*#__PURE__*/emotion_react_browser_esm_css("*:active>&{box-shadow:", getBoxShadow(activeValue), ";}" + ( true ? "" : 0),  true ? "" : 0);
42857      }
42858      if (isValueDefined(focus)) {
42859        sx.focus = /*#__PURE__*/emotion_react_browser_esm_css("*:focus>&{box-shadow:", getBoxShadow(focus), ";}" + ( true ? "" : 0),  true ? "" : 0);
42860      }
42861      return cx(Elevation, sx.Base, sx.hover, sx.focus, sx.active, className);
42862    }, [active, borderRadius, className, cx, focus, hover, isInteractive, offset, value]);
42863    return {
42864      ...otherProps,
42865      className: classes,
42866      'aria-hidden': true
42867    };
42868  }
42869  
42870  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/elevation/component.js
42871  /**
42872   * External dependencies
42873   */
42874  
42875  /**
42876   * Internal dependencies
42877   */
42878  
42879  
42880  
42881  
42882  
42883  function UnconnectedElevation(props, forwardedRef) {
42884    const elevationProps = useElevation(props);
42885    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(component, {
42886      ...elevationProps,
42887      ref: forwardedRef
42888    });
42889  }
42890  
42891  /**
42892   * `Elevation` is a core component that renders shadow, using the component
42893   * system's shadow system.
42894   *
42895   * The shadow effect is generated using the `value` prop.
42896   *
42897   * ```jsx
42898   * import {
42899   *    __experimentalElevation as Elevation,
42900   *    __experimentalSurface as Surface,
42901   *    __experimentalText as Text,
42902   * } from '@wordpress/components';
42903   *
42904   * function Example() {
42905   *   return (
42906   *     <Surface>
42907   *       <Text>Code is Poetry</Text>
42908   *       <Elevation value={ 5 } />
42909   *     </Surface>
42910   *   );
42911   * }
42912   * ```
42913   */
42914  const component_Elevation = contextConnect(UnconnectedElevation, 'Elevation');
42915  /* harmony default export */ const elevation_component = (component_Elevation);
42916  
42917  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/card/styles.js
42918  function card_styles_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)."; }
42919  /**
42920   * External dependencies
42921   */
42922  
42923  
42924  /**
42925   * Internal dependencies
42926   */
42927  
42928  
42929  // Since the border for `Card` is rendered via the `box-shadow` property
42930  // (as opposed to the `border` property), the value of the border radius needs
42931  // to be adjusted by removing 1px (this is because the `box-shadow` renders
42932  // as an "outer radius").
42933  const adjustedBorderRadius = `calc($config_values.radiusLarge} - 1px)`;
42934  const Card = /*#__PURE__*/emotion_react_browser_esm_css("box-shadow:0 0 0 1px ", config_values.surfaceBorderColor, ";outline:none;" + ( true ? "" : 0),  true ? "" : 0);
42935  const Header =  true ? {
42936    name: "1showjb",
42937    styles: "border-bottom:1px solid;box-sizing:border-box;&:last-child{border-bottom:none;}"
42938  } : 0;
42939  const Footer =  true ? {
42940    name: "14n5oej",
42941    styles: "border-top:1px solid;box-sizing:border-box;&:first-of-type{border-top:none;}"
42942  } : 0;
42943  const Content =  true ? {
42944    name: "13udsys",
42945    styles: "height:100%"
42946  } : 0;
42947  const Body =  true ? {
42948    name: "6ywzd",
42949    styles: "box-sizing:border-box;height:auto;max-height:100%"
42950  } : 0;
42951  const Media =  true ? {
42952    name: "dq805e",
42953    styles: "box-sizing:border-box;overflow:hidden;&>img,&>iframe{display:block;height:auto;max-width:100%;width:100%;}"
42954  } : 0;
42955  const Divider =  true ? {
42956    name: "c990dr",
42957    styles: "box-sizing:border-box;display:block;width:100%"
42958  } : 0;
42959  const borderRadius = /*#__PURE__*/emotion_react_browser_esm_css("&:first-of-type{border-top-left-radius:", adjustedBorderRadius, ";border-top-right-radius:", adjustedBorderRadius, ";}&:last-of-type{border-bottom-left-radius:", adjustedBorderRadius, ";border-bottom-right-radius:", adjustedBorderRadius, ";}" + ( true ? "" : 0),  true ? "" : 0);
42960  const borderColor = /*#__PURE__*/emotion_react_browser_esm_css("border-color:", config_values.colorDivider, ";" + ( true ? "" : 0),  true ? "" : 0);
42961  const boxShadowless =  true ? {
42962    name: "1t90u8d",
42963    styles: "box-shadow:none"
42964  } : 0;
42965  const borderless =  true ? {
42966    name: "1e1ncky",
42967    styles: "border:none"
42968  } : 0;
42969  const rounded = /*#__PURE__*/emotion_react_browser_esm_css("border-radius:", adjustedBorderRadius, ";" + ( true ? "" : 0),  true ? "" : 0);
42970  const xSmallCardPadding = /*#__PURE__*/emotion_react_browser_esm_css("padding:", config_values.cardPaddingXSmall, ";" + ( true ? "" : 0),  true ? "" : 0);
42971  const cardPaddings = {
42972    large: /*#__PURE__*/emotion_react_browser_esm_css("padding:", config_values.cardPaddingLarge, ";" + ( true ? "" : 0),  true ? "" : 0),
42973    medium: /*#__PURE__*/emotion_react_browser_esm_css("padding:", config_values.cardPaddingMedium, ";" + ( true ? "" : 0),  true ? "" : 0),
42974    small: /*#__PURE__*/emotion_react_browser_esm_css("padding:", config_values.cardPaddingSmall, ";" + ( true ? "" : 0),  true ? "" : 0),
42975    xSmall: xSmallCardPadding,
42976    // The `extraSmall` size is not officially documented, but the following styles
42977    // are kept for legacy reasons to support older values of the `size` prop.
42978    extraSmall: xSmallCardPadding
42979  };
42980  const shady = /*#__PURE__*/emotion_react_browser_esm_css("background-color:", COLORS.ui.backgroundDisabled, ";" + ( true ? "" : 0),  true ? "" : 0);
42981  
42982  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/surface/styles.js
42983  /**
42984   * External dependencies
42985   */
42986  
42987  
42988  /**
42989   * Internal dependencies
42990   */
42991  
42992  const Surface = /*#__PURE__*/emotion_react_browser_esm_css("background-color:", config_values.surfaceColor, ";color:", COLORS.gray[900], ";position:relative;" + ( true ? "" : 0),  true ? "" : 0);
42993  const background = /*#__PURE__*/emotion_react_browser_esm_css("background-color:", config_values.surfaceBackgroundColor, ";" + ( true ? "" : 0),  true ? "" : 0);
42994  function getBorders({
42995    borderBottom,
42996    borderLeft,
42997    borderRight,
42998    borderTop
42999  }) {
43000    const borderStyle = `1px solid $config_values.surfaceBorderColor}`;
43001    return /*#__PURE__*/emotion_react_browser_esm_css({
43002      borderBottom: borderBottom ? borderStyle : undefined,
43003      borderLeft: borderLeft ? borderStyle : undefined,
43004      borderRight: borderRight ? borderStyle : undefined,
43005      borderTop: borderTop ? borderStyle : undefined
43006    },  true ? "" : 0,  true ? "" : 0);
43007  }
43008  const primary = /*#__PURE__*/emotion_react_browser_esm_css( true ? "" : 0,  true ? "" : 0);
43009  const secondary = /*#__PURE__*/emotion_react_browser_esm_css("background:", config_values.surfaceBackgroundTintColor, ";" + ( true ? "" : 0),  true ? "" : 0);
43010  const tertiary = /*#__PURE__*/emotion_react_browser_esm_css("background:", config_values.surfaceBackgroundTertiaryColor, ";" + ( true ? "" : 0),  true ? "" : 0);
43011  const customBackgroundSize = surfaceBackgroundSize => [surfaceBackgroundSize, surfaceBackgroundSize].join(' ');
43012  const dottedBackground1 = surfaceBackgroundSizeDotted => ['90deg', [config_values.surfaceBackgroundColor, surfaceBackgroundSizeDotted].join(' '), 'transparent 1%'].join(',');
43013  const dottedBackground2 = surfaceBackgroundSizeDotted => [[config_values.surfaceBackgroundColor, surfaceBackgroundSizeDotted].join(' '), 'transparent 1%'].join(',');
43014  const dottedBackgroundCombined = surfaceBackgroundSizeDotted => [`linear-gradient( $dottedBackground1(surfaceBackgroundSizeDotted)} ) center`, `linear-gradient( $dottedBackground2(surfaceBackgroundSizeDotted)} ) center`, config_values.surfaceBorderBoldColor].join(',');
43015  const getDotted = (surfaceBackgroundSize, surfaceBackgroundSizeDotted) => /*#__PURE__*/emotion_react_browser_esm_css("background:", dottedBackgroundCombined(surfaceBackgroundSizeDotted), ";background-size:", customBackgroundSize(surfaceBackgroundSize), ";" + ( true ? "" : 0),  true ? "" : 0);
43016  const gridBackground1 = [`$config_values.surfaceBorderSubtleColor} 1px`, 'transparent 1px'].join(',');
43017  const gridBackground2 = ['90deg', `$config_values.surfaceBorderSubtleColor} 1px`, 'transparent 1px'].join(',');
43018  const gridBackgroundCombined = [`linear-gradient( $gridBackground1} )`, `linear-gradient( $gridBackground2} )`].join(',');
43019  const getGrid = surfaceBackgroundSize => {
43020    return /*#__PURE__*/emotion_react_browser_esm_css("background:", config_values.surfaceBackgroundColor, ";background-image:", gridBackgroundCombined, ";background-size:", customBackgroundSize(surfaceBackgroundSize), ";" + ( true ? "" : 0),  true ? "" : 0);
43021  };
43022  const getVariant = (variant, surfaceBackgroundSize, surfaceBackgroundSizeDotted) => {
43023    switch (variant) {
43024      case 'dotted':
43025        {
43026          return getDotted(surfaceBackgroundSize, surfaceBackgroundSizeDotted);
43027        }
43028      case 'grid':
43029        {
43030          return getGrid(surfaceBackgroundSize);
43031        }
43032      case 'primary':
43033        {
43034          return primary;
43035        }
43036      case 'secondary':
43037        {
43038          return secondary;
43039        }
43040      case 'tertiary':
43041        {
43042          return tertiary;
43043        }
43044    }
43045  };
43046  
43047  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/surface/hook.js
43048  /**
43049   * WordPress dependencies
43050   */
43051  
43052  
43053  /**
43054   * Internal dependencies
43055   */
43056  
43057  
43058  
43059  function useSurface(props) {
43060    const {
43061      backgroundSize = 12,
43062      borderBottom = false,
43063      borderLeft = false,
43064      borderRight = false,
43065      borderTop = false,
43066      className,
43067      variant = 'primary',
43068      ...otherProps
43069    } = useContextSystem(props, 'Surface');
43070    const cx = useCx();
43071    const classes = (0,external_wp_element_namespaceObject.useMemo)(() => {
43072      const sx = {
43073        borders: getBorders({
43074          borderBottom,
43075          borderLeft,
43076          borderRight,
43077          borderTop
43078        })
43079      };
43080      return cx(Surface, sx.borders, getVariant(variant, `$backgroundSize}px`, `$backgroundSize - 1}px`), className);
43081    }, [backgroundSize, borderBottom, borderLeft, borderRight, borderTop, className, cx, variant]);
43082    return {
43083      ...otherProps,
43084      className: classes
43085    };
43086  }
43087  
43088  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/card/card/hook.js
43089  /**
43090   * WordPress dependencies
43091   */
43092  
43093  
43094  
43095  /**
43096   * Internal dependencies
43097   */
43098  
43099  
43100  
43101  
43102  
43103  function hook_useDeprecatedProps({
43104    elevation,
43105    isElevated,
43106    ...otherProps
43107  }) {
43108    const propsToReturn = {
43109      ...otherProps
43110    };
43111    let computedElevation = elevation;
43112    if (isElevated) {
43113      var _computedElevation;
43114      external_wp_deprecated_default()('Card isElevated prop', {
43115        since: '5.9',
43116        alternative: 'elevation'
43117      });
43118      (_computedElevation = computedElevation) !== null && _computedElevation !== void 0 ? _computedElevation : computedElevation = 2;
43119    }
43120  
43121    // The `elevation` prop should only be passed when it's not `undefined`,
43122    // otherwise it will override the value that gets derived from `useContextSystem`.
43123    if (typeof computedElevation !== 'undefined') {
43124      propsToReturn.elevation = computedElevation;
43125    }
43126    return propsToReturn;
43127  }
43128  function useCard(props) {
43129    const {
43130      className,
43131      elevation = 0,
43132      isBorderless = false,
43133      isRounded = true,
43134      size = 'medium',
43135      ...otherProps
43136    } = useContextSystem(hook_useDeprecatedProps(props), 'Card');
43137    const cx = useCx();
43138    const classes = (0,external_wp_element_namespaceObject.useMemo)(() => {
43139      return cx(Card, isBorderless && boxShadowless, isRounded && rounded, className);
43140    }, [className, cx, isBorderless, isRounded]);
43141    const surfaceProps = useSurface({
43142      ...otherProps,
43143      className: classes
43144    });
43145    return {
43146      ...surfaceProps,
43147      elevation,
43148      isBorderless,
43149      isRounded,
43150      size
43151    };
43152  }
43153  
43154  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/card/card/component.js
43155  /**
43156   * External dependencies
43157   */
43158  
43159  /**
43160   * WordPress dependencies
43161   */
43162  
43163  
43164  /**
43165   * Internal dependencies
43166   */
43167  
43168  
43169  
43170  
43171  
43172  
43173  
43174  
43175  
43176  
43177  function UnconnectedCard(props, forwardedRef) {
43178    const {
43179      children,
43180      elevation,
43181      isBorderless,
43182      isRounded,
43183      size,
43184      ...otherProps
43185    } = useCard(props);
43186    const elevationBorderRadius = isRounded ? config_values.radiusLarge : 0;
43187    const cx = useCx();
43188    const elevationClassName = (0,external_wp_element_namespaceObject.useMemo)(() => cx( /*#__PURE__*/emotion_react_browser_esm_css({
43189      borderRadius: elevationBorderRadius
43190    },  true ? "" : 0,  true ? "" : 0)), [cx, elevationBorderRadius]);
43191    const contextProviderValue = (0,external_wp_element_namespaceObject.useMemo)(() => {
43192      const contextProps = {
43193        size,
43194        isBorderless
43195      };
43196      return {
43197        CardBody: contextProps,
43198        CardHeader: contextProps,
43199        CardFooter: contextProps
43200      };
43201    }, [isBorderless, size]);
43202    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ContextSystemProvider, {
43203      value: contextProviderValue,
43204      children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(component, {
43205        ...otherProps,
43206        ref: forwardedRef,
43207        children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(component, {
43208          className: cx(Content),
43209          children: children
43210        }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(elevation_component, {
43211          className: elevationClassName,
43212          isInteractive: false,
43213          value: elevation ? 1 : 0
43214        }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(elevation_component, {
43215          className: elevationClassName,
43216          isInteractive: false,
43217          value: elevation
43218        })]
43219      })
43220    });
43221  }
43222  
43223  /**
43224   * `Card` provides a flexible and extensible content container.
43225   * `Card` also provides a convenient set of sub-components such as `CardBody`,
43226   * `CardHeader`, `CardFooter`, and more.
43227   *
43228   * ```jsx
43229   * import {
43230   *   Card,
43231   *   CardHeader,
43232   *   CardBody,
43233   *   CardFooter,
43234   *   __experimentalText as Text,
43235   *   __experimentalHeading as Heading,
43236   * } from `@wordpress/components`;
43237   *
43238   * function Example() {
43239   *   return (
43240   *     <Card>
43241   *       <CardHeader>
43242   *         <Heading level={ 4 }>Card Title</Heading>
43243   *       </CardHeader>
43244   *       <CardBody>
43245   *         <Text>Card Content</Text>
43246   *       </CardBody>
43247   *       <CardFooter>
43248   *         <Text>Card Footer</Text>
43249   *       </CardFooter>
43250   *     </Card>
43251   *   );
43252   * }
43253   * ```
43254   */
43255  const component_Card = contextConnect(UnconnectedCard, 'Card');
43256  /* harmony default export */ const card_component = (component_Card);
43257  
43258  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/scrollable/styles.js
43259  function scrollable_styles_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)."; }
43260  /**
43261   * External dependencies
43262   */
43263  
43264  
43265  /**
43266   * Internal dependencies
43267   */
43268  
43269  const scrollableScrollbar = /*#__PURE__*/emotion_react_browser_esm_css("@media only screen and ( min-device-width: 40em ){&::-webkit-scrollbar{height:12px;width:12px;}&::-webkit-scrollbar-track{background-color:transparent;}&::-webkit-scrollbar-track{background:", config_values.colorScrollbarTrack, ";border-radius:8px;}&::-webkit-scrollbar-thumb{background-clip:padding-box;background-color:", config_values.colorScrollbarThumb, ";border:2px solid rgba( 0, 0, 0, 0 );border-radius:7px;}&:hover::-webkit-scrollbar-thumb{background-color:", config_values.colorScrollbarThumbHover, ";}}" + ( true ? "" : 0),  true ? "" : 0);
43270  const Scrollable =  true ? {
43271    name: "13udsys",
43272    styles: "height:100%"
43273  } : 0;
43274  const styles_Content =  true ? {
43275    name: "bjn8wh",
43276    styles: "position:relative"
43277  } : 0;
43278  const styles_smoothScroll =  true ? {
43279    name: "7zq9w",
43280    styles: "scroll-behavior:smooth"
43281  } : 0;
43282  const scrollX =  true ? {
43283    name: "q33xhg",
43284    styles: "overflow-x:auto;overflow-y:hidden"
43285  } : 0;
43286  const scrollY =  true ? {
43287    name: "103x71s",
43288    styles: "overflow-x:hidden;overflow-y:auto"
43289  } : 0;
43290  const scrollAuto =  true ? {
43291    name: "umwchj",
43292    styles: "overflow-y:auto"
43293  } : 0;
43294  
43295  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/scrollable/hook.js
43296  /**
43297   * WordPress dependencies
43298   */
43299  
43300  
43301  /**
43302   * Internal dependencies
43303   */
43304  
43305  
43306  
43307  
43308  function useScrollable(props) {
43309    const {
43310      className,
43311      scrollDirection = 'y',
43312      smoothScroll = false,
43313      ...otherProps
43314    } = useContextSystem(props, 'Scrollable');
43315    const cx = useCx();
43316    const classes = (0,external_wp_element_namespaceObject.useMemo)(() => cx(Scrollable, scrollableScrollbar, smoothScroll && styles_smoothScroll, scrollDirection === 'x' && scrollX, scrollDirection === 'y' && scrollY, scrollDirection === 'auto' && scrollAuto, className), [className, cx, scrollDirection, smoothScroll]);
43317    return {
43318      ...otherProps,
43319      className: classes
43320    };
43321  }
43322  
43323  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/scrollable/component.js
43324  /**
43325   * External dependencies
43326   */
43327  
43328  /**
43329   * Internal dependencies
43330   */
43331  
43332  
43333  
43334  
43335  
43336  function UnconnectedScrollable(props, forwardedRef) {
43337    const scrollableProps = useScrollable(props);
43338    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(component, {
43339      ...scrollableProps,
43340      ref: forwardedRef
43341    });
43342  }
43343  
43344  /**
43345   * `Scrollable` is a layout component that content in a scrollable container.
43346   *
43347   * ```jsx
43348   * import { __experimentalScrollable as Scrollable } from `@wordpress/components`;
43349   *
43350   * function Example() {
43351   *     return (
43352   *         <Scrollable style={ { maxHeight: 200 } }>
43353   *             <div style={ { height: 500 } }>...</div>
43354   *         </Scrollable>
43355   *     );
43356   * }
43357   * ```
43358   */
43359  const component_Scrollable = contextConnect(UnconnectedScrollable, 'Scrollable');
43360  /* harmony default export */ const scrollable_component = (component_Scrollable);
43361  
43362  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/card/card-body/hook.js
43363  /**
43364   * WordPress dependencies
43365   */
43366  
43367  
43368  /**
43369   * Internal dependencies
43370   */
43371  
43372  
43373  
43374  
43375  function useCardBody(props) {
43376    const {
43377      className,
43378      isScrollable = false,
43379      isShady = false,
43380      size = 'medium',
43381      ...otherProps
43382    } = useContextSystem(props, 'CardBody');
43383    const cx = useCx();
43384    const classes = (0,external_wp_element_namespaceObject.useMemo)(() => cx(Body, borderRadius, cardPaddings[size], isShady && shady,
43385    // This classname is added for legacy compatibility reasons.
43386    'components-card__body', className), [className, cx, isShady, size]);
43387    return {
43388      ...otherProps,
43389      className: classes,
43390      isScrollable
43391    };
43392  }
43393  
43394  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/card/card-body/component.js
43395  /**
43396   * External dependencies
43397   */
43398  
43399  /**
43400   * Internal dependencies
43401   */
43402  
43403  
43404  
43405  
43406  
43407  
43408  function UnconnectedCardBody(props, forwardedRef) {
43409    const {
43410      isScrollable,
43411      ...otherProps
43412    } = useCardBody(props);
43413    if (isScrollable) {
43414      return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(scrollable_component, {
43415        ...otherProps,
43416        ref: forwardedRef
43417      });
43418    }
43419    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(component, {
43420      ...otherProps,
43421      ref: forwardedRef
43422    });
43423  }
43424  
43425  /**
43426   * `CardBody` renders an optional content area for a `Card`.
43427   * Multiple `CardBody` components can be used within `Card` if needed.
43428   *
43429   * ```jsx
43430   * import { Card, CardBody } from `@wordpress/components`;
43431   *
43432   * <Card>
43433   *     <CardBody>
43434   *         ...
43435   *     </CardBody>
43436   * </Card>
43437   * ```
43438   */
43439  const CardBody = contextConnect(UnconnectedCardBody, 'CardBody');
43440  /* harmony default export */ const card_body_component = (CardBody);
43441  
43442  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/LOI6GHIP.js
43443  "use client";
43444  
43445  
43446  
43447  // src/separator/separator.tsx
43448  var LOI6GHIP_TagName = "hr";
43449  var useSeparator = createHook(
43450    function useSeparator2(_a) {
43451      var _b = _a, { orientation = "horizontal" } = _b, props = __objRest(_b, ["orientation"]);
43452      props = _3YLGPPWQ_spreadValues({
43453        role: "separator",
43454        "aria-orientation": orientation
43455      }, props);
43456      return props;
43457    }
43458  );
43459  var Separator = forwardRef2(function Separator2(props) {
43460    const htmlProps = useSeparator(props);
43461    return HKOOKEDE_createElement(LOI6GHIP_TagName, htmlProps);
43462  });
43463  
43464  
43465  
43466  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/divider/styles.js
43467  
43468  function divider_styles_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)."; }
43469  /**
43470   * External dependencies
43471   */
43472  
43473  
43474  
43475  /**
43476   * Internal dependencies
43477   */
43478  
43479  
43480  const MARGIN_DIRECTIONS = {
43481    vertical: {
43482      start: 'marginLeft',
43483      end: 'marginRight'
43484    },
43485    horizontal: {
43486      start: 'marginTop',
43487      end: 'marginBottom'
43488    }
43489  };
43490  
43491  // Renders the correct margins given the Divider's `orientation` and the writing direction.
43492  // When both the generic `margin` and the specific `marginStart|marginEnd` props are defined,
43493  // the latter will take priority.
43494  const renderMargin = ({
43495    'aria-orientation': orientation = 'horizontal',
43496    margin,
43497    marginStart,
43498    marginEnd
43499  }) => /*#__PURE__*/emotion_react_browser_esm_css(rtl({
43500    [MARGIN_DIRECTIONS[orientation].start]: space(marginStart !== null && marginStart !== void 0 ? marginStart : margin),
43501    [MARGIN_DIRECTIONS[orientation].end]: space(marginEnd !== null && marginEnd !== void 0 ? marginEnd : margin)
43502  })(),  true ? "" : 0,  true ? "" : 0);
43503  var divider_styles_ref =  true ? {
43504    name: "1u4hpl4",
43505    styles: "display:inline"
43506  } : 0;
43507  const renderDisplay = ({
43508    'aria-orientation': orientation = 'horizontal'
43509  }) => {
43510    return orientation === 'vertical' ? divider_styles_ref : undefined;
43511  };
43512  const renderBorder = ({
43513    'aria-orientation': orientation = 'horizontal'
43514  }) => {
43515    return /*#__PURE__*/emotion_react_browser_esm_css({
43516      [orientation === 'vertical' ? 'borderRight' : 'borderBottom']: '1px solid currentColor'
43517    },  true ? "" : 0,  true ? "" : 0);
43518  };
43519  const renderSize = ({
43520    'aria-orientation': orientation = 'horizontal'
43521  }) => /*#__PURE__*/emotion_react_browser_esm_css({
43522    height: orientation === 'vertical' ? 'auto' : 0,
43523    width: orientation === 'vertical' ? 0 : 'auto'
43524  },  true ? "" : 0,  true ? "" : 0);
43525  const DividerView = /*#__PURE__*/emotion_styled_base_browser_esm("hr",  true ? {
43526    target: "e19on6iw0"
43527  } : 0)("border:0;margin:0;", renderDisplay, " ", renderBorder, " ", renderSize, " ", renderMargin, ";" + ( true ? "" : 0));
43528  
43529  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/divider/component.js
43530  /**
43531   * External dependencies
43532   */
43533  
43534  
43535  /**
43536   * Internal dependencies
43537   */
43538  
43539  
43540  
43541  
43542  function UnconnectedDivider(props, forwardedRef) {
43543    const contextProps = useContextSystem(props, 'Divider');
43544    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Separator, {
43545      render: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(DividerView, {}),
43546      ...contextProps,
43547      ref: forwardedRef
43548    });
43549  }
43550  
43551  /**
43552   * `Divider` is a layout component that separates groups of related content.
43553   *
43554   * ```js
43555   * import {
43556   *         __experimentalDivider as Divider,
43557   *         __experimentalText as Text,
43558   *         __experimentalVStack as VStack,
43559   * } from `@wordpress/components`;
43560   *
43561   * function Example() {
43562   *     return (
43563   *         <VStack spacing={4}>
43564   *             <Text>Some text here</Text>
43565   *             <Divider />
43566   *             <Text>Some more text here</Text>
43567   *         </VStack>
43568   *     );
43569   * }
43570   * ```
43571   */
43572  const component_Divider = contextConnect(UnconnectedDivider, 'Divider');
43573  /* harmony default export */ const divider_component = (component_Divider);
43574  
43575  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/card/card-divider/hook.js
43576  /**
43577   * WordPress dependencies
43578   */
43579  
43580  
43581  /**
43582   * Internal dependencies
43583   */
43584  
43585  
43586  
43587  
43588  function useCardDivider(props) {
43589    const {
43590      className,
43591      ...otherProps
43592    } = useContextSystem(props, 'CardDivider');
43593    const cx = useCx();
43594    const classes = (0,external_wp_element_namespaceObject.useMemo)(() => cx(Divider, borderColor,
43595    // This classname is added for legacy compatibility reasons.
43596    'components-card__divider', className), [className, cx]);
43597    return {
43598      ...otherProps,
43599      className: classes
43600    };
43601  }
43602  
43603  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/card/card-divider/component.js
43604  /**
43605   * External dependencies
43606   */
43607  
43608  /**
43609   * Internal dependencies
43610   */
43611  
43612  
43613  
43614  
43615  
43616  function UnconnectedCardDivider(props, forwardedRef) {
43617    const dividerProps = useCardDivider(props);
43618    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(divider_component, {
43619      ...dividerProps,
43620      ref: forwardedRef
43621    });
43622  }
43623  
43624  /**
43625   * `CardDivider` renders an optional divider within a `Card`.
43626   * It is typically used to divide multiple `CardBody` components from each other.
43627   *
43628   * ```jsx
43629   * import { Card, CardBody, CardDivider } from `@wordpress/components`;
43630   *
43631   * <Card>
43632   *  <CardBody>...</CardBody>
43633   *  <CardDivider />
43634   *  <CardBody>...</CardBody>
43635   * </Card>
43636   * ```
43637   */
43638  const CardDivider = contextConnect(UnconnectedCardDivider, 'CardDivider');
43639  /* harmony default export */ const card_divider_component = (CardDivider);
43640  
43641  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/card/card-footer/hook.js
43642  /**
43643   * WordPress dependencies
43644   */
43645  
43646  
43647  /**
43648   * Internal dependencies
43649   */
43650  
43651  
43652  
43653  
43654  function useCardFooter(props) {
43655    const {
43656      className,
43657      justify,
43658      isBorderless = false,
43659      isShady = false,
43660      size = 'medium',
43661      ...otherProps
43662    } = useContextSystem(props, 'CardFooter');
43663    const cx = useCx();
43664    const classes = (0,external_wp_element_namespaceObject.useMemo)(() => cx(Footer, borderRadius, borderColor, cardPaddings[size], isBorderless && borderless, isShady && shady,
43665    // This classname is added for legacy compatibility reasons.
43666    'components-card__footer', className), [className, cx, isBorderless, isShady, size]);
43667    return {
43668      ...otherProps,
43669      className: classes,
43670      justify
43671    };
43672  }
43673  
43674  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/card/card-footer/component.js
43675  /**
43676   * External dependencies
43677   */
43678  
43679  /**
43680   * Internal dependencies
43681   */
43682  
43683  
43684  
43685  
43686  
43687  function UnconnectedCardFooter(props, forwardedRef) {
43688    const footerProps = useCardFooter(props);
43689    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(flex_component, {
43690      ...footerProps,
43691      ref: forwardedRef
43692    });
43693  }
43694  
43695  /**
43696   * `CardFooter` renders an optional footer within a `Card`.
43697   *
43698   * ```jsx
43699   * import { Card, CardBody, CardFooter } from `@wordpress/components`;
43700   *
43701   * <Card>
43702   *     <CardBody>...</CardBody>
43703   *     <CardFooter>...</CardFooter>
43704   * </Card>
43705   * ```
43706   */
43707  const CardFooter = contextConnect(UnconnectedCardFooter, 'CardFooter');
43708  /* harmony default export */ const card_footer_component = (CardFooter);
43709  
43710  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/card/card-header/hook.js
43711  /**
43712   * WordPress dependencies
43713   */
43714  
43715  
43716  /**
43717   * Internal dependencies
43718   */
43719  
43720  
43721  
43722  
43723  function useCardHeader(props) {
43724    const {
43725      className,
43726      isBorderless = false,
43727      isShady = false,
43728      size = 'medium',
43729      ...otherProps
43730    } = useContextSystem(props, 'CardHeader');
43731    const cx = useCx();
43732    const classes = (0,external_wp_element_namespaceObject.useMemo)(() => cx(Header, borderRadius, borderColor, cardPaddings[size], isBorderless && borderless, isShady && shady,
43733    // This classname is added for legacy compatibility reasons.
43734    'components-card__header', className), [className, cx, isBorderless, isShady, size]);
43735    return {
43736      ...otherProps,
43737      className: classes
43738    };
43739  }
43740  
43741  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/card/card-header/component.js
43742  /**
43743   * External dependencies
43744   */
43745  
43746  /**
43747   * Internal dependencies
43748   */
43749  
43750  
43751  
43752  
43753  
43754  function UnconnectedCardHeader(props, forwardedRef) {
43755    const headerProps = useCardHeader(props);
43756    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(flex_component, {
43757      ...headerProps,
43758      ref: forwardedRef
43759    });
43760  }
43761  
43762  /**
43763   * `CardHeader` renders an optional header within a `Card`.
43764   *
43765   * ```jsx
43766   * import { Card, CardBody, CardHeader } from `@wordpress/components`;
43767   *
43768   * <Card>
43769   *     <CardHeader>...</CardHeader>
43770   *     <CardBody>...</CardBody>
43771   * </Card>
43772   * ```
43773   */
43774  const CardHeader = contextConnect(UnconnectedCardHeader, 'CardHeader');
43775  /* harmony default export */ const card_header_component = (CardHeader);
43776  
43777  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/card/card-media/hook.js
43778  /**
43779   * WordPress dependencies
43780   */
43781  
43782  
43783  /**
43784   * Internal dependencies
43785   */
43786  
43787  
43788  
43789  
43790  function useCardMedia(props) {
43791    const {
43792      className,
43793      ...otherProps
43794    } = useContextSystem(props, 'CardMedia');
43795    const cx = useCx();
43796    const classes = (0,external_wp_element_namespaceObject.useMemo)(() => cx(Media, borderRadius,
43797    // This classname is added for legacy compatibility reasons.
43798    'components-card__media', className), [className, cx]);
43799    return {
43800      ...otherProps,
43801      className: classes
43802    };
43803  }
43804  
43805  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/card/card-media/component.js
43806  /**
43807   * External dependencies
43808   */
43809  
43810  /**
43811   * Internal dependencies
43812   */
43813  
43814  
43815  
43816  
43817  
43818  function UnconnectedCardMedia(props, forwardedRef) {
43819    const cardMediaProps = useCardMedia(props);
43820    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(component, {
43821      ...cardMediaProps,
43822      ref: forwardedRef
43823    });
43824  }
43825  
43826  /**
43827   * `CardMedia` provides a container for full-bleed content within a `Card`,
43828   * such as images, video, or even just a background color.
43829   *
43830   * @example
43831   * ```jsx
43832   * import { Card, CardBody, CardMedia } from '@wordpress/components';
43833   *
43834   * const Example = () => (
43835   *  <Card>
43836   *      <CardMedia>
43837   *          <img src="..." />
43838   *    </CardMedia>
43839   *    <CardBody>...</CardBody>
43840   *  </Card>
43841   * );
43842   * ```
43843   */
43844  const CardMedia = contextConnect(UnconnectedCardMedia, 'CardMedia');
43845  /* harmony default export */ const card_media_component = (CardMedia);
43846  
43847  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/checkbox-control/index.js
43848  /**
43849   * External dependencies
43850   */
43851  
43852  /**
43853   * WordPress dependencies
43854   */
43855  
43856  
43857  
43858  
43859  
43860  /**
43861   * Internal dependencies
43862   */
43863  
43864  
43865  
43866  
43867  /**
43868   * Checkboxes allow the user to select one or more items from a set.
43869   *
43870   * ```jsx
43871   * import { CheckboxControl } from '@wordpress/components';
43872   * import { useState } from '@wordpress/element';
43873   *
43874   * const MyCheckboxControl = () => {
43875   *   const [ isChecked, setChecked ] = useState( true );
43876   *   return (
43877   *     <CheckboxControl
43878   *       __nextHasNoMarginBottom
43879   *       label="Is author"
43880   *       help="Is the user a author or not?"
43881   *       checked={ isChecked }
43882   *       onChange={ setChecked }
43883   *     />
43884   *   );
43885   * };
43886   * ```
43887   */
43888  function CheckboxControl(props) {
43889    const {
43890      __nextHasNoMarginBottom,
43891      label,
43892      className,
43893      heading,
43894      checked,
43895      indeterminate,
43896      help,
43897      id: idProp,
43898      onChange,
43899      ...additionalProps
43900    } = props;
43901    if (heading) {
43902      external_wp_deprecated_default()('`heading` prop in `CheckboxControl`', {
43903        alternative: 'a separate element to implement a heading',
43904        since: '5.8'
43905      });
43906    }
43907    const [showCheckedIcon, setShowCheckedIcon] = (0,external_wp_element_namespaceObject.useState)(false);
43908    const [showIndeterminateIcon, setShowIndeterminateIcon] = (0,external_wp_element_namespaceObject.useState)(false);
43909  
43910    // Run the following callback every time the `ref` (and the additional
43911    // dependencies) change.
43912    const ref = (0,external_wp_compose_namespaceObject.useRefEffect)(node => {
43913      if (!node) {
43914        return;
43915      }
43916  
43917      // It cannot be set using an HTML attribute.
43918      node.indeterminate = !!indeterminate;
43919      setShowCheckedIcon(node.matches(':checked'));
43920      setShowIndeterminateIcon(node.matches(':indeterminate'));
43921    }, [checked, indeterminate]);
43922    const id = (0,external_wp_compose_namespaceObject.useInstanceId)(CheckboxControl, 'inspector-checkbox-control', idProp);
43923    const onChangeValue = event => onChange(event.target.checked);
43924    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(base_control, {
43925      __nextHasNoMarginBottom: __nextHasNoMarginBottom,
43926      __associatedWPComponentName: "CheckboxControl",
43927      label: heading,
43928      id: id,
43929      help: help && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", {
43930        className: "components-checkbox-control__help",
43931        children: help
43932      }),
43933      className: dist_clsx('components-checkbox-control', className),
43934      children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(h_stack_component, {
43935        spacing: 0,
43936        justify: "start",
43937        alignment: "top",
43938        children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("span", {
43939          className: "components-checkbox-control__input-container",
43940          children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("input", {
43941            ref: ref,
43942            id: id,
43943            className: "components-checkbox-control__input",
43944            type: "checkbox",
43945            value: "1",
43946            onChange: onChangeValue,
43947            checked: checked,
43948            "aria-describedby": !!help ? id + '__help' : undefined,
43949            ...additionalProps
43950          }), showIndeterminateIcon ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(icons_build_module_icon, {
43951            icon: library_reset,
43952            className: "components-checkbox-control__indeterminate",
43953            role: "presentation"
43954          }) : null, showCheckedIcon ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(icons_build_module_icon, {
43955            icon: library_check,
43956            className: "components-checkbox-control__checked",
43957            role: "presentation"
43958          }) : null]
43959        }), label && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("label", {
43960          className: "components-checkbox-control__label",
43961          htmlFor: id,
43962          children: label
43963        })]
43964      })
43965    });
43966  }
43967  /* harmony default export */ const checkbox_control = (CheckboxControl);
43968  
43969  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/clipboard-button/index.js
43970  /**
43971   * External dependencies
43972   */
43973  
43974  
43975  /**
43976   * WordPress dependencies
43977   */
43978  
43979  
43980  
43981  
43982  /**
43983   * Internal dependencies
43984   */
43985  
43986  
43987  const TIMEOUT = 4000;
43988  function ClipboardButton({
43989    className,
43990    children,
43991    onCopy,
43992    onFinishCopy,
43993    text,
43994    ...buttonProps
43995  }) {
43996    external_wp_deprecated_default()('wp.components.ClipboardButton', {
43997      since: '5.8',
43998      alternative: 'wp.compose.useCopyToClipboard'
43999    });
44000    const timeoutIdRef = (0,external_wp_element_namespaceObject.useRef)();
44001    const ref = (0,external_wp_compose_namespaceObject.useCopyToClipboard)(text, () => {
44002      onCopy();
44003      if (timeoutIdRef.current) {
44004        clearTimeout(timeoutIdRef.current);
44005      }
44006      if (onFinishCopy) {
44007        timeoutIdRef.current = setTimeout(() => onFinishCopy(), TIMEOUT);
44008      }
44009    });
44010    (0,external_wp_element_namespaceObject.useEffect)(() => {
44011      if (timeoutIdRef.current) {
44012        clearTimeout(timeoutIdRef.current);
44013      }
44014    }, []);
44015    const classes = dist_clsx('components-clipboard-button', className);
44016  
44017    // Workaround for inconsistent behavior in Safari, where <textarea> is not
44018    // the document.activeElement at the moment when the copy event fires.
44019    // This causes documentHasSelection() in the copy-handler component to
44020    // mistakenly override the ClipboardButton, and copy a serialized string
44021    // of the current block instead.
44022    const focusOnCopyEventTarget = event => {
44023      // @ts-expect-error: Should be currentTarget, but not changing because this component is deprecated.
44024      event.target.focus();
44025    };
44026    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, {
44027      ...buttonProps,
44028      className: classes,
44029      ref: ref,
44030      onCopy: focusOnCopyEventTarget,
44031      children: children
44032    });
44033  }
44034  
44035  ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/more-vertical.js
44036  /**
44037   * WordPress dependencies
44038   */
44039  
44040  
44041  const moreVertical = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, {
44042    xmlns: "http://www.w3.org/2000/svg",
44043    viewBox: "0 0 24 24",
44044    children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, {
44045      d: "M13 19h-2v-2h2v2zm0-6h-2v-2h2v2zm0-6h-2V5h2v2z"
44046    })
44047  });
44048  /* harmony default export */ const more_vertical = (moreVertical);
44049  
44050  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/item-group/styles.js
44051  function item_group_styles_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)."; }
44052  /**
44053   * External dependencies
44054   */
44055  
44056  
44057  /**
44058   * Internal dependencies
44059   */
44060  
44061  const unstyledButton = as => {
44062    return /*#__PURE__*/emotion_react_browser_esm_css("font-size:", font('default.fontSize'), ";font-family:inherit;appearance:none;border:1px solid transparent;cursor:pointer;background:none;text-align:start;text-decoration:", as === 'a' ? 'none' : undefined, ";svg,path{fill:currentColor;}&:hover{color:", COLORS.theme.accent, ";}&:focus{box-shadow:none;outline:none;}&:focus-visible{box-shadow:0 0 0 var( --wp-admin-border-width-focus ) ", COLORS.theme.accent, ";outline:2px solid transparent;outline-offset:0;}" + ( true ? "" : 0),  true ? "" : 0);
44063  };
44064  const itemWrapper =  true ? {
44065    name: "1bcj5ek",
44066    styles: "width:100%;display:block"
44067  } : 0;
44068  const item =  true ? {
44069    name: "150ruhm",
44070    styles: "box-sizing:border-box;width:100%;display:block;margin:0;color:inherit"
44071  } : 0;
44072  const bordered = /*#__PURE__*/emotion_react_browser_esm_css("border:1px solid ", config_values.surfaceBorderColor, ";" + ( true ? "" : 0),  true ? "" : 0);
44073  const separated = /*#__PURE__*/emotion_react_browser_esm_css(">*:not( marquee )>*{border-bottom:1px solid ", config_values.surfaceBorderColor, ";}>*:last-of-type>*:not( :focus ){border-bottom-color:transparent;}" + ( true ? "" : 0),  true ? "" : 0);
44074  const styles_borderRadius = config_values.radiusSmall;
44075  const styles_spacedAround = /*#__PURE__*/emotion_react_browser_esm_css("border-radius:", styles_borderRadius, ";" + ( true ? "" : 0),  true ? "" : 0);
44076  const styles_rounded = /*#__PURE__*/emotion_react_browser_esm_css("border-radius:", styles_borderRadius, ";>*:first-of-type>*{border-top-left-radius:", styles_borderRadius, ";border-top-right-radius:", styles_borderRadius, ";}>*:last-of-type>*{border-bottom-left-radius:", styles_borderRadius, ";border-bottom-right-radius:", styles_borderRadius, ";}" + ( true ? "" : 0),  true ? "" : 0);
44077  const baseFontHeight = `calc($config_values.fontSize} * $config_values.fontLineHeightBase})`;
44078  
44079  /*
44080   * Math:
44081   * - Use the desired height as the base value
44082   * - Subtract the computed height of (default) text
44083   * - Subtract the effects of border
44084   * - Divide the calculated number by 2, in order to get an individual top/bottom padding
44085   */
44086  const paddingY = `calc(($config_values.controlHeight} - $baseFontHeight} - 2px) / 2)`;
44087  const paddingYSmall = `calc(($config_values.controlHeightSmall} - $baseFontHeight} - 2px) / 2)`;
44088  const paddingYLarge = `calc(($config_values.controlHeightLarge} - $baseFontHeight} - 2px) / 2)`;
44089  const itemSizes = {
44090    small: /*#__PURE__*/emotion_react_browser_esm_css("padding:", paddingYSmall, " ", config_values.controlPaddingXSmall, "px;" + ( true ? "" : 0),  true ? "" : 0),
44091    medium: /*#__PURE__*/emotion_react_browser_esm_css("padding:", paddingY, " ", config_values.controlPaddingX, "px;" + ( true ? "" : 0),  true ? "" : 0),
44092    large: /*#__PURE__*/emotion_react_browser_esm_css("padding:", paddingYLarge, " ", config_values.controlPaddingXLarge, "px;" + ( true ? "" : 0),  true ? "" : 0)
44093  };
44094  
44095  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/item-group/item-group/hook.js
44096  /**
44097   * Internal dependencies
44098   */
44099  
44100  
44101  
44102  /**
44103   * Internal dependencies
44104   */
44105  
44106  
44107  function useItemGroup(props) {
44108    const {
44109      className,
44110      isBordered = false,
44111      isRounded = true,
44112      isSeparated = false,
44113      role = 'list',
44114      ...otherProps
44115    } = useContextSystem(props, 'ItemGroup');
44116    const cx = useCx();
44117    const classes = cx(isBordered && bordered, isSeparated && separated, isRounded && styles_rounded, className);
44118    return {
44119      isBordered,
44120      className: classes,
44121      role,
44122      isSeparated,
44123      ...otherProps
44124    };
44125  }
44126  
44127  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/item-group/context.js
44128  /**
44129   * WordPress dependencies
44130   */
44131  
44132  
44133  /**
44134   * Internal dependencies
44135   */
44136  
44137  const ItemGroupContext = (0,external_wp_element_namespaceObject.createContext)({
44138    size: 'medium'
44139  });
44140  const useItemGroupContext = () => (0,external_wp_element_namespaceObject.useContext)(ItemGroupContext);
44141  
44142  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/item-group/item-group/component.js
44143  /**
44144   * External dependencies
44145   */
44146  
44147  /**
44148   * Internal dependencies
44149   */
44150  
44151  
44152  
44153  
44154  
44155  
44156  function UnconnectedItemGroup(props, forwardedRef) {
44157    const {
44158      isBordered,
44159      isSeparated,
44160      size: sizeProp,
44161      ...otherProps
44162    } = useItemGroup(props);
44163    const {
44164      size: contextSize
44165    } = useItemGroupContext();
44166    const spacedAround = !isBordered && !isSeparated;
44167    const size = sizeProp || contextSize;
44168    const contextValue = {
44169      spacedAround,
44170      size
44171    };
44172    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ItemGroupContext.Provider, {
44173      value: contextValue,
44174      children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(component, {
44175        ...otherProps,
44176        ref: forwardedRef
44177      })
44178    });
44179  }
44180  
44181  /**
44182   * `ItemGroup` displays a list of `Item`s grouped and styled together.
44183   *
44184   * ```jsx
44185   * import {
44186   *   __experimentalItemGroup as ItemGroup,
44187   *   __experimentalItem as Item,
44188   * } from '@wordpress/components';
44189   *
44190   * function Example() {
44191   *   return (
44192   *     <ItemGroup>
44193   *       <Item>Code</Item>
44194   *       <Item>is</Item>
44195   *       <Item>Poetry</Item>
44196   *     </ItemGroup>
44197   *   );
44198   * }
44199   * ```
44200   */
44201  const ItemGroup = contextConnect(UnconnectedItemGroup, 'ItemGroup');
44202  /* harmony default export */ const item_group_component = (ItemGroup);
44203  
44204  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/custom-gradient-picker/gradient-bar/constants.js
44205  const GRADIENT_MARKERS_WIDTH = 16;
44206  const INSERT_POINT_WIDTH = 16;
44207  const MINIMUM_DISTANCE_BETWEEN_INSERTER_AND_POINT = 10;
44208  const MINIMUM_DISTANCE_BETWEEN_POINTS = 0;
44209  const MINIMUM_SIGNIFICANT_MOVE = 5;
44210  const KEYBOARD_CONTROL_POINT_VARIATION = MINIMUM_DISTANCE_BETWEEN_INSERTER_AND_POINT;
44211  const MINIMUM_DISTANCE_BETWEEN_INSERTER_AND_MARKER = (INSERT_POINT_WIDTH + GRADIENT_MARKERS_WIDTH) / 2;
44212  
44213  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/custom-gradient-picker/gradient-bar/utils.js
44214  /**
44215   * Internal dependencies
44216   */
44217  
44218  /**
44219   * Clamps a number between 0 and 100.
44220   *
44221   * @param value Value to clamp.
44222   *
44223   * @return Value clamped between 0 and 100.
44224   */
44225  function clampPercent(value) {
44226    return Math.max(0, Math.min(100, value));
44227  }
44228  
44229  /**
44230   * Check if a control point is overlapping with another.
44231   *
44232   * @param value        Array of control points.
44233   * @param initialIndex Index of the position to test.
44234   * @param newPosition  New position of the control point.
44235   * @param minDistance  Distance considered to be overlapping.
44236   *
44237   * @return True if the point is overlapping.
44238   */
44239  function isOverlapping(value, initialIndex, newPosition, minDistance = MINIMUM_DISTANCE_BETWEEN_POINTS) {
44240    const initialPosition = value[initialIndex].position;
44241    const minPosition = Math.min(initialPosition, newPosition);
44242    const maxPosition = Math.max(initialPosition, newPosition);
44243    return value.some(({
44244      position
44245    }, index) => {
44246      return index !== initialIndex && (Math.abs(position - newPosition) < minDistance || minPosition < position && position < maxPosition);
44247    });
44248  }
44249  
44250  /**
44251   * Adds a control point from an array and returns the new array.
44252   *
44253   * @param points   Array of control points.
44254   * @param position Position to insert the new point.
44255   * @param color    Color to update the control point at index.
44256   *
44257   * @return New array of control points.
44258   */
44259  function addControlPoint(points, position, color) {
44260    const nextIndex = points.findIndex(point => point.position > position);
44261    const newPoint = {
44262      color,
44263      position
44264    };
44265    const newPoints = points.slice();
44266    newPoints.splice(nextIndex - 1, 0, newPoint);
44267    return newPoints;
44268  }
44269  
44270  /**
44271   * Removes a control point from an array and returns the new array.
44272   *
44273   * @param points Array of control points.
44274   * @param index  Index to remove.
44275   *
44276   * @return New array of control points.
44277   */
44278  function removeControlPoint(points, index) {
44279    return points.filter((_point, pointIndex) => {
44280      return pointIndex !== index;
44281    });
44282  }
44283  /**
44284   * Updates a control point from an array and returns the new array.
44285   *
44286   * @param points   Array of control points.
44287   * @param index    Index to update.
44288   * @param newPoint New control point to replace the index.
44289   *
44290   * @return New array of control points.
44291   */
44292  function updateControlPoint(points, index, newPoint) {
44293    const newValue = points.slice();
44294    newValue[index] = newPoint;
44295    return newValue;
44296  }
44297  
44298  /**
44299   * Updates the position of a control point from an array and returns the new array.
44300   *
44301   * @param points      Array of control points.
44302   * @param index       Index to update.
44303   * @param newPosition Position to move the control point at index.
44304   *
44305   * @return New array of control points.
44306   */
44307  function updateControlPointPosition(points, index, newPosition) {
44308    if (isOverlapping(points, index, newPosition)) {
44309      return points;
44310    }
44311    const newPoint = {
44312      ...points[index],
44313      position: newPosition
44314    };
44315    return updateControlPoint(points, index, newPoint);
44316  }
44317  
44318  /**
44319   * Updates the position of a control point from an array and returns the new array.
44320   *
44321   * @param points   Array of control points.
44322   * @param index    Index to update.
44323   * @param newColor Color to update the control point at index.
44324   *
44325   * @return New array of control points.
44326   */
44327  function updateControlPointColor(points, index, newColor) {
44328    const newPoint = {
44329      ...points[index],
44330      color: newColor
44331    };
44332    return updateControlPoint(points, index, newPoint);
44333  }
44334  
44335  /**
44336   * Updates the position of a control point from an array and returns the new array.
44337   *
44338   * @param points   Array of control points.
44339   * @param position Position of the color stop.
44340   * @param newColor Color to update the control point at index.
44341   *
44342   * @return New array of control points.
44343   */
44344  function updateControlPointColorByPosition(points, position, newColor) {
44345    const index = points.findIndex(point => point.position === position);
44346    return updateControlPointColor(points, index, newColor);
44347  }
44348  
44349  /**
44350   * Gets the horizontal coordinate when dragging a control point with the mouse.
44351   *
44352   * @param mouseXcoordinate Horizontal coordinate of the mouse position.
44353   * @param containerElement Container for the gradient picker.
44354   *
44355   * @return Whole number percentage from the left.
44356   */
44357  
44358  function getHorizontalRelativeGradientPosition(mouseXCoordinate, containerElement) {
44359    if (!containerElement) {
44360      return;
44361    }
44362    const {
44363      x,
44364      width
44365    } = containerElement.getBoundingClientRect();
44366    const absolutePositionValue = mouseXCoordinate - x;
44367    return Math.round(clampPercent(absolutePositionValue * 100 / width));
44368  }
44369  
44370  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/custom-gradient-picker/gradient-bar/control-points.js
44371  /**
44372   * External dependencies
44373   */
44374  
44375  
44376  
44377  /**
44378   * WordPress dependencies
44379   */
44380  
44381  
44382  
44383  
44384  
44385  /**
44386   * Internal dependencies
44387   */
44388  
44389  
44390  
44391  
44392  
44393  
44394  
44395  
44396  
44397  
44398  
44399  function ControlPointButton({
44400    isOpen,
44401    position,
44402    color,
44403    ...additionalProps
44404  }) {
44405    const instanceId = (0,external_wp_compose_namespaceObject.useInstanceId)(ControlPointButton);
44406    const descriptionId = `components-custom-gradient-picker__control-point-button-description-$instanceId}`;
44407    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, {
44408      children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, {
44409        "aria-label": (0,external_wp_i18n_namespaceObject.sprintf)(
44410        // translators: 1: gradient position e.g: 70. 2: gradient color code e.g: rgb(52,121,151).
44411        (0,external_wp_i18n_namespaceObject.__)('Gradient control point at position %1$s%% with color code %2$s.'), position, color),
44412        "aria-describedby": descriptionId,
44413        "aria-haspopup": "true",
44414        "aria-expanded": isOpen,
44415        className: dist_clsx('components-custom-gradient-picker__control-point-button', {
44416          'is-active': isOpen
44417        }),
44418        ...additionalProps
44419      }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(visually_hidden_component, {
44420        id: descriptionId,
44421        children: (0,external_wp_i18n_namespaceObject.__)('Use your left or right arrow keys or drag and drop with the mouse to change the gradient position. Press the button to change the color or remove the control point.')
44422      })]
44423    });
44424  }
44425  function GradientColorPickerDropdown({
44426    isRenderedInSidebar,
44427    className,
44428    ...props
44429  }) {
44430    // Open the popover below the gradient control/insertion point
44431    const popoverProps = (0,external_wp_element_namespaceObject.useMemo)(() => ({
44432      placement: 'bottom',
44433      offset: 8,
44434      // Disabling resize as it would otherwise cause the popover to show
44435      // scrollbars while dragging the color picker's handle close to the
44436      // popover edge.
44437      resize: false
44438    }), []);
44439    const mergedClassName = dist_clsx('components-custom-gradient-picker__control-point-dropdown', className);
44440    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(CustomColorPickerDropdown, {
44441      isRenderedInSidebar: isRenderedInSidebar,
44442      popoverProps: popoverProps,
44443      className: mergedClassName,
44444      ...props
44445    });
44446  }
44447  function ControlPoints({
44448    disableRemove,
44449    disableAlpha,
44450    gradientPickerDomRef,
44451    ignoreMarkerPosition,
44452    value: controlPoints,
44453    onChange,
44454    onStartControlPointChange,
44455    onStopControlPointChange,
44456    __experimentalIsRenderedInSidebar
44457  }) {
44458    const controlPointMoveStateRef = (0,external_wp_element_namespaceObject.useRef)();
44459    const onMouseMove = event => {
44460      if (controlPointMoveStateRef.current === undefined || gradientPickerDomRef.current === null) {
44461        return;
44462      }
44463      const relativePosition = getHorizontalRelativeGradientPosition(event.clientX, gradientPickerDomRef.current);
44464      const {
44465        initialPosition,
44466        index,
44467        significantMoveHappened
44468      } = controlPointMoveStateRef.current;
44469      if (!significantMoveHappened && Math.abs(initialPosition - relativePosition) >= MINIMUM_SIGNIFICANT_MOVE) {
44470        controlPointMoveStateRef.current.significantMoveHappened = true;
44471      }
44472      onChange(updateControlPointPosition(controlPoints, index, relativePosition));
44473    };
44474    const cleanEventListeners = () => {
44475      if (window && window.removeEventListener && controlPointMoveStateRef.current && controlPointMoveStateRef.current.listenersActivated) {
44476        window.removeEventListener('mousemove', onMouseMove);
44477        window.removeEventListener('mouseup', cleanEventListeners);
44478        onStopControlPointChange();
44479        controlPointMoveStateRef.current.listenersActivated = false;
44480      }
44481    };
44482  
44483    // Adding `cleanEventListeners` to the dependency array below requires the function itself to be wrapped in a `useCallback`
44484    // This memoization would prevent the event listeners from being properly cleaned.
44485    // Instead, we'll pass a ref to the function in our `useEffect` so `cleanEventListeners` itself is no longer a dependency.
44486    const cleanEventListenersRef = (0,external_wp_element_namespaceObject.useRef)();
44487    cleanEventListenersRef.current = cleanEventListeners;
44488    (0,external_wp_element_namespaceObject.useEffect)(() => {
44489      return () => {
44490        cleanEventListenersRef.current?.();
44491      };
44492    }, []);
44493    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_ReactJSXRuntime_namespaceObject.Fragment, {
44494      children: controlPoints.map((point, index) => {
44495        const initialPosition = point?.position;
44496        return ignoreMarkerPosition !== initialPosition && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(GradientColorPickerDropdown, {
44497          isRenderedInSidebar: __experimentalIsRenderedInSidebar,
44498          onClose: onStopControlPointChange,
44499          renderToggle: ({
44500            isOpen,
44501            onToggle
44502          }) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ControlPointButton, {
44503            onClick: () => {
44504              if (controlPointMoveStateRef.current && controlPointMoveStateRef.current.significantMoveHappened) {
44505                return;
44506              }
44507              if (isOpen) {
44508                onStopControlPointChange();
44509              } else {
44510                onStartControlPointChange();
44511              }
44512              onToggle();
44513            },
44514            onMouseDown: () => {
44515              if (window && window.addEventListener) {
44516                controlPointMoveStateRef.current = {
44517                  initialPosition,
44518                  index,
44519                  significantMoveHappened: false,
44520                  listenersActivated: true
44521                };
44522                onStartControlPointChange();
44523                window.addEventListener('mousemove', onMouseMove);
44524                window.addEventListener('mouseup', cleanEventListeners);
44525              }
44526            },
44527            onKeyDown: event => {
44528              if (event.code === 'ArrowLeft') {
44529                // Stop propagation of the key press event to avoid focus moving
44530                // to another editor area.
44531                event.stopPropagation();
44532                onChange(updateControlPointPosition(controlPoints, index, clampPercent(point.position - KEYBOARD_CONTROL_POINT_VARIATION)));
44533              } else if (event.code === 'ArrowRight') {
44534                // Stop propagation of the key press event to avoid focus moving
44535                // to another editor area.
44536                event.stopPropagation();
44537                onChange(updateControlPointPosition(controlPoints, index, clampPercent(point.position + KEYBOARD_CONTROL_POINT_VARIATION)));
44538              }
44539            },
44540            isOpen: isOpen,
44541            position: point.position,
44542            color: point.color
44543          }, index),
44544          renderContent: ({
44545            onClose
44546          }) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(dropdown_content_wrapper, {
44547            paddingSize: "none",
44548            children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(LegacyAdapter, {
44549              enableAlpha: !disableAlpha,
44550              color: point.color,
44551              onChange: color => {
44552                onChange(updateControlPointColor(controlPoints, index, w(color).toRgbString()));
44553              }
44554            }), !disableRemove && controlPoints.length > 2 && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(h_stack_component, {
44555              className: "components-custom-gradient-picker__remove-control-point-wrapper",
44556              alignment: "center",
44557              children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, {
44558                onClick: () => {
44559                  onChange(removeControlPoint(controlPoints, index));
44560                  onClose();
44561                },
44562                variant: "link",
44563                children: (0,external_wp_i18n_namespaceObject.__)('Remove Control Point')
44564              })
44565            })]
44566          }),
44567          style: {
44568            left: `$point.position}%`,
44569            transform: 'translateX( -50% )'
44570          }
44571        }, index);
44572      })
44573    });
44574  }
44575  function InsertPoint({
44576    value: controlPoints,
44577    onChange,
44578    onOpenInserter,
44579    onCloseInserter,
44580    insertPosition,
44581    disableAlpha,
44582    __experimentalIsRenderedInSidebar
44583  }) {
44584    const [alreadyInsertedPoint, setAlreadyInsertedPoint] = (0,external_wp_element_namespaceObject.useState)(false);
44585    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(GradientColorPickerDropdown, {
44586      isRenderedInSidebar: __experimentalIsRenderedInSidebar,
44587      className: "components-custom-gradient-picker__inserter",
44588      onClose: () => {
44589        onCloseInserter();
44590      },
44591      renderToggle: ({
44592        isOpen,
44593        onToggle
44594      }) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, {
44595        "aria-expanded": isOpen,
44596        "aria-haspopup": "true",
44597        onClick: () => {
44598          if (isOpen) {
44599            onCloseInserter();
44600          } else {
44601            setAlreadyInsertedPoint(false);
44602            onOpenInserter();
44603          }
44604          onToggle();
44605        },
44606        className: "components-custom-gradient-picker__insert-point-dropdown",
44607        icon: library_plus
44608      }),
44609      renderContent: () => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(dropdown_content_wrapper, {
44610        paddingSize: "none",
44611        children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(LegacyAdapter, {
44612          enableAlpha: !disableAlpha,
44613          onChange: color => {
44614            if (!alreadyInsertedPoint) {
44615              onChange(addControlPoint(controlPoints, insertPosition, w(color).toRgbString()));
44616              setAlreadyInsertedPoint(true);
44617            } else {
44618              onChange(updateControlPointColorByPosition(controlPoints, insertPosition, w(color).toRgbString()));
44619            }
44620          }
44621        })
44622      }),
44623      style: insertPosition !== null ? {
44624        left: `$insertPosition}%`,
44625        transform: 'translateX( -50% )'
44626      } : undefined
44627    });
44628  }
44629  ControlPoints.InsertPoint = InsertPoint;
44630  /* harmony default export */ const control_points = (ControlPoints);
44631  
44632  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/custom-gradient-picker/gradient-bar/index.js
44633  /**
44634   * External dependencies
44635   */
44636  
44637  
44638  /**
44639   * WordPress dependencies
44640   */
44641  
44642  
44643  /**
44644   * Internal dependencies
44645   */
44646  
44647  
44648  
44649  
44650  
44651  const customGradientBarReducer = (state, action) => {
44652    switch (action.type) {
44653      case 'MOVE_INSERTER':
44654        if (state.id === 'IDLE' || state.id === 'MOVING_INSERTER') {
44655          return {
44656            id: 'MOVING_INSERTER',
44657            insertPosition: action.insertPosition
44658          };
44659        }
44660        break;
44661      case 'STOP_INSERTER_MOVE':
44662        if (state.id === 'MOVING_INSERTER') {
44663          return {
44664            id: 'IDLE'
44665          };
44666        }
44667        break;
44668      case 'OPEN_INSERTER':
44669        if (state.id === 'MOVING_INSERTER') {
44670          return {
44671            id: 'INSERTING_CONTROL_POINT',
44672            insertPosition: state.insertPosition
44673          };
44674        }
44675        break;
44676      case 'CLOSE_INSERTER':
44677        if (state.id === 'INSERTING_CONTROL_POINT') {
44678          return {
44679            id: 'IDLE'
44680          };
44681        }
44682        break;
44683      case 'START_CONTROL_CHANGE':
44684        if (state.id === 'IDLE') {
44685          return {
44686            id: 'MOVING_CONTROL_POINT'
44687          };
44688        }
44689        break;
44690      case 'STOP_CONTROL_CHANGE':
44691        if (state.id === 'MOVING_CONTROL_POINT') {
44692          return {
44693            id: 'IDLE'
44694          };
44695        }
44696        break;
44697    }
44698    return state;
44699  };
44700  const customGradientBarReducerInitialState = {
44701    id: 'IDLE'
44702  };
44703  function CustomGradientBar({
44704    background,
44705    hasGradient,
44706    value: controlPoints,
44707    onChange,
44708    disableInserter = false,
44709    disableAlpha = false,
44710    __experimentalIsRenderedInSidebar = false
44711  }) {
44712    const gradientMarkersContainerDomRef = (0,external_wp_element_namespaceObject.useRef)(null);
44713    const [gradientBarState, gradientBarStateDispatch] = (0,external_wp_element_namespaceObject.useReducer)(customGradientBarReducer, customGradientBarReducerInitialState);
44714    const onMouseEnterAndMove = event => {
44715      if (!gradientMarkersContainerDomRef.current) {
44716        return;
44717      }
44718      const insertPosition = getHorizontalRelativeGradientPosition(event.clientX, gradientMarkersContainerDomRef.current);
44719  
44720      // If the insert point is close to an existing control point don't show it.
44721      if (controlPoints.some(({
44722        position
44723      }) => {
44724        return Math.abs(insertPosition - position) < MINIMUM_DISTANCE_BETWEEN_INSERTER_AND_POINT;
44725      })) {
44726        if (gradientBarState.id === 'MOVING_INSERTER') {
44727          gradientBarStateDispatch({
44728            type: 'STOP_INSERTER_MOVE'
44729          });
44730        }
44731        return;
44732      }
44733      gradientBarStateDispatch({
44734        type: 'MOVE_INSERTER',
44735        insertPosition
44736      });
44737    };
44738    const onMouseLeave = () => {
44739      gradientBarStateDispatch({
44740        type: 'STOP_INSERTER_MOVE'
44741      });
44742    };
44743    const isMovingInserter = gradientBarState.id === 'MOVING_INSERTER';
44744    const isInsertingControlPoint = gradientBarState.id === 'INSERTING_CONTROL_POINT';
44745    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", {
44746      className: dist_clsx('components-custom-gradient-picker__gradient-bar', {
44747        'has-gradient': hasGradient
44748      }),
44749      onMouseEnter: onMouseEnterAndMove,
44750      onMouseMove: onMouseEnterAndMove,
44751      onMouseLeave: onMouseLeave,
44752      children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", {
44753        className: "components-custom-gradient-picker__gradient-bar-background",
44754        style: {
44755          background,
44756          opacity: hasGradient ? 1 : 0.4
44757        }
44758      }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", {
44759        ref: gradientMarkersContainerDomRef,
44760        className: "components-custom-gradient-picker__markers-container",
44761        children: [!disableInserter && (isMovingInserter || isInsertingControlPoint) && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(control_points.InsertPoint, {
44762          __experimentalIsRenderedInSidebar: __experimentalIsRenderedInSidebar,
44763          disableAlpha: disableAlpha,
44764          insertPosition: gradientBarState.insertPosition,
44765          value: controlPoints,
44766          onChange: onChange,
44767          onOpenInserter: () => {
44768            gradientBarStateDispatch({
44769              type: 'OPEN_INSERTER'
44770            });
44771          },
44772          onCloseInserter: () => {
44773            gradientBarStateDispatch({
44774              type: 'CLOSE_INSERTER'
44775            });
44776          }
44777        }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(control_points, {
44778          __experimentalIsRenderedInSidebar: __experimentalIsRenderedInSidebar,
44779          disableAlpha: disableAlpha,
44780          disableRemove: disableInserter,
44781          gradientPickerDomRef: gradientMarkersContainerDomRef,
44782          ignoreMarkerPosition: isInsertingControlPoint ? gradientBarState.insertPosition : undefined,
44783          value: controlPoints,
44784          onChange: onChange,
44785          onStartControlPointChange: () => {
44786            gradientBarStateDispatch({
44787              type: 'START_CONTROL_CHANGE'
44788            });
44789          },
44790          onStopControlPointChange: () => {
44791            gradientBarStateDispatch({
44792              type: 'STOP_CONTROL_CHANGE'
44793            });
44794          }
44795        })]
44796      })]
44797    });
44798  }
44799  
44800  // EXTERNAL MODULE: ./node_modules/gradient-parser/build/node.js
44801  var build_node = __webpack_require__(8924);
44802  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/custom-gradient-picker/constants.js
44803  /**
44804   * WordPress dependencies
44805   */
44806  
44807  const DEFAULT_GRADIENT = 'linear-gradient(135deg, rgba(6, 147, 227, 1) 0%, rgb(155, 81, 224) 100%)';
44808  const DEFAULT_LINEAR_GRADIENT_ANGLE = 180;
44809  const HORIZONTAL_GRADIENT_ORIENTATION = {
44810    type: 'angular',
44811    value: '90'
44812  };
44813  const GRADIENT_OPTIONS = [{
44814    value: 'linear-gradient',
44815    label: (0,external_wp_i18n_namespaceObject.__)('Linear')
44816  }, {
44817    value: 'radial-gradient',
44818    label: (0,external_wp_i18n_namespaceObject.__)('Radial')
44819  }];
44820  const DIRECTIONAL_ORIENTATION_ANGLE_MAP = {
44821    top: 0,
44822    'top right': 45,
44823    'right top': 45,
44824    right: 90,
44825    'right bottom': 135,
44826    'bottom right': 135,
44827    bottom: 180,
44828    'bottom left': 225,
44829    'left bottom': 225,
44830    left: 270,
44831    'top left': 315,
44832    'left top': 315
44833  };
44834  
44835  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/custom-gradient-picker/serializer.js
44836  /**
44837   * External dependencies
44838   */
44839  
44840  function serializeGradientColor({
44841    type,
44842    value
44843  }) {
44844    if (type === 'literal') {
44845      return value;
44846    }
44847    if (type === 'hex') {
44848      return `#$value}`;
44849    }
44850    return `$type}($value.join(',')})`;
44851  }
44852  function serializeGradientPosition(position) {
44853    if (!position) {
44854      return '';
44855    }
44856    const {
44857      value,
44858      type
44859    } = position;
44860    return `$value}$type}`;
44861  }
44862  function serializeGradientColorStop({
44863    type,
44864    value,
44865    length
44866  }) {
44867    return `$serializeGradientColor({
44868      type,
44869      value
44870    })} $serializeGradientPosition(length)}`;
44871  }
44872  function serializeGradientOrientation(orientation) {
44873    if (Array.isArray(orientation) || !orientation || orientation.type !== 'angular') {
44874      return;
44875    }
44876    return `$orientation.value}deg`;
44877  }
44878  function serializeGradient({
44879    type,
44880    orientation,
44881    colorStops
44882  }) {
44883    const serializedOrientation = serializeGradientOrientation(orientation);
44884    const serializedColorStops = colorStops.sort((colorStop1, colorStop2) => {
44885      const getNumericStopValue = colorStop => {
44886        return colorStop?.length?.value === undefined ? 0 : parseInt(colorStop.length.value);
44887      };
44888      return getNumericStopValue(colorStop1) - getNumericStopValue(colorStop2);
44889    }).map(serializeGradientColorStop);
44890    return `$type}(${[serializedOrientation, ...serializedColorStops].filter(Boolean).join(',')})`;
44891  }
44892  
44893  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/custom-gradient-picker/utils.js
44894  /**
44895   * External dependencies
44896   */
44897  
44898  
44899  
44900  
44901  /**
44902   * Internal dependencies
44903   */
44904  
44905  
44906  k([names]);
44907  function getLinearGradientRepresentation(gradientAST) {
44908    return serializeGradient({
44909      type: 'linear-gradient',
44910      orientation: HORIZONTAL_GRADIENT_ORIENTATION,
44911      colorStops: gradientAST.colorStops
44912    });
44913  }
44914  function hasUnsupportedLength(item) {
44915    return item.length === undefined || item.length.type !== '%';
44916  }
44917  function getGradientAstWithDefault(value) {
44918    // gradientAST will contain the gradient AST as parsed by gradient-parser npm module.
44919    // More information of its structure available at https://www.npmjs.com/package/gradient-parser#ast.
44920    let gradientAST;
44921    let hasGradient = !!value;
44922    const valueToParse = value !== null && value !== void 0 ? value : DEFAULT_GRADIENT;
44923    try {
44924      gradientAST = build_node.parse(valueToParse)[0];
44925    } catch (error) {
44926      // eslint-disable-next-line no-console
44927      console.warn('wp.components.CustomGradientPicker failed to parse the gradient with error', error);
44928      gradientAST = build_node.parse(DEFAULT_GRADIENT)[0];
44929      hasGradient = false;
44930    }
44931    if (!Array.isArray(gradientAST.orientation) && gradientAST.orientation?.type === 'directional') {
44932      gradientAST.orientation = {
44933        type: 'angular',
44934        value: DIRECTIONAL_ORIENTATION_ANGLE_MAP[gradientAST.orientation.value].toString()
44935      };
44936    }
44937    if (gradientAST.colorStops.some(hasUnsupportedLength)) {
44938      const {
44939        colorStops
44940      } = gradientAST;
44941      const step = 100 / (colorStops.length - 1);
44942      colorStops.forEach((stop, index) => {
44943        stop.length = {
44944          value: `$step * index}`,
44945          type: '%'
44946        };
44947      });
44948    }
44949    return {
44950      gradientAST,
44951      hasGradient
44952    };
44953  }
44954  function getGradientAstWithControlPoints(gradientAST, newControlPoints) {
44955    return {
44956      ...gradientAST,
44957      colorStops: newControlPoints.map(({
44958        position,
44959        color
44960      }) => {
44961        const {
44962          r,
44963          g,
44964          b,
44965          a
44966        } = w(color).toRgb();
44967        return {
44968          length: {
44969            type: '%',
44970            value: position?.toString()
44971          },
44972          type: a < 1 ? 'rgba' : 'rgb',
44973          value: a < 1 ? [`$r}`, `$g}`, `$b}`, `$a}`] : [`$r}`, `$g}`, `$b}`]
44974        };
44975      })
44976    };
44977  }
44978  function getStopCssColor(colorStop) {
44979    switch (colorStop.type) {
44980      case 'hex':
44981        return `#$colorStop.value}`;
44982      case 'literal':
44983        return colorStop.value;
44984      case 'rgb':
44985      case 'rgba':
44986        return `$colorStop.type}($colorStop.value.join(',')})`;
44987      default:
44988        // Should be unreachable if passing an AST from gradient-parser.
44989        // See https://github.com/rafaelcaricio/gradient-parser#ast.
44990        return 'transparent';
44991    }
44992  }
44993  
44994  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/custom-gradient-picker/styles/custom-gradient-picker-styles.js
44995  
44996  function custom_gradient_picker_styles_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)."; }
44997  /**
44998   * External dependencies
44999   */
45000  
45001  /**
45002   * Internal dependencies
45003   */
45004  
45005  const SelectWrapper = /*#__PURE__*/emotion_styled_base_browser_esm(flex_block_component,  true ? {
45006    target: "e10bzpgi1"
45007  } : 0)( true ? {
45008    name: "1gvx10y",
45009    styles: "flex-grow:5"
45010  } : 0);
45011  const AccessoryWrapper = /*#__PURE__*/emotion_styled_base_browser_esm(flex_block_component,  true ? {
45012    target: "e10bzpgi0"
45013  } : 0)( true ? {
45014    name: "1gvx10y",
45015    styles: "flex-grow:5"
45016  } : 0);
45017  
45018  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/custom-gradient-picker/index.js
45019  /**
45020   * External dependencies
45021   */
45022  
45023  /**
45024   * WordPress dependencies
45025   */
45026  
45027  
45028  /**
45029   * Internal dependencies
45030   */
45031  
45032  
45033  
45034  
45035  
45036  
45037  
45038  
45039  
45040  
45041  
45042  const GradientAnglePicker = ({
45043    gradientAST,
45044    hasGradient,
45045    onChange
45046  }) => {
45047    var _gradientAST$orientat;
45048    const angle = (_gradientAST$orientat = gradientAST?.orientation?.value) !== null && _gradientAST$orientat !== void 0 ? _gradientAST$orientat : DEFAULT_LINEAR_GRADIENT_ANGLE;
45049    const onAngleChange = newAngle => {
45050      onChange(serializeGradient({
45051        ...gradientAST,
45052        orientation: {
45053          type: 'angular',
45054          value: `$newAngle}`
45055        }
45056      }));
45057    };
45058    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(angle_picker_control, {
45059      onChange: onAngleChange,
45060      value: hasGradient ? angle : ''
45061    });
45062  };
45063  const GradientTypePicker = ({
45064    gradientAST,
45065    hasGradient,
45066    onChange
45067  }) => {
45068    const {
45069      type
45070    } = gradientAST;
45071    const onSetLinearGradient = () => {
45072      onChange(serializeGradient({
45073        ...gradientAST,
45074        orientation: gradientAST.orientation ? undefined : HORIZONTAL_GRADIENT_ORIENTATION,
45075        type: 'linear-gradient'
45076      }));
45077    };
45078    const onSetRadialGradient = () => {
45079      const {
45080        orientation,
45081        ...restGradientAST
45082      } = gradientAST;
45083      onChange(serializeGradient({
45084        ...restGradientAST,
45085        type: 'radial-gradient'
45086      }));
45087    };
45088    const handleOnChange = next => {
45089      if (next === 'linear-gradient') {
45090        onSetLinearGradient();
45091      }
45092      if (next === 'radial-gradient') {
45093        onSetRadialGradient();
45094      }
45095    };
45096    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(select_control, {
45097      __nextHasNoMarginBottom: true,
45098      className: "components-custom-gradient-picker__type-picker",
45099      label: (0,external_wp_i18n_namespaceObject.__)('Type'),
45100      labelPosition: "top",
45101      onChange: handleOnChange,
45102      options: GRADIENT_OPTIONS,
45103      size: "__unstable-large",
45104      value: hasGradient ? type : undefined
45105    });
45106  };
45107  
45108  /**
45109   * CustomGradientPicker is a React component that renders a UI for specifying
45110   * linear or radial gradients. Radial gradients are displayed in the picker as
45111   * a slice of the gradient from the center to the outside.
45112   *
45113   * ```jsx
45114   * import { CustomGradientPicker } from '@wordpress/components';
45115   * import { useState } from '@wordpress/element';
45116   *
45117   * const MyCustomGradientPicker = () => {
45118   *   const [ gradient, setGradient ] = useState();
45119   *
45120   *   return (
45121   *     <CustomGradientPicker
45122   *            value={ gradient }
45123   *            onChange={ setGradient }
45124   *     />
45125   *   );
45126   * };
45127   * ```
45128   */
45129  function CustomGradientPicker({
45130    value,
45131    onChange,
45132    __experimentalIsRenderedInSidebar = false
45133  }) {
45134    const {
45135      gradientAST,
45136      hasGradient
45137    } = getGradientAstWithDefault(value);
45138  
45139    // On radial gradients the bar should display a linear gradient.
45140    // On radial gradients the bar represents a slice of the gradient from the center until the outside.
45141    // On liner gradients the bar represents the color stops from left to right independently of the angle.
45142    const background = getLinearGradientRepresentation(gradientAST);
45143  
45144    // Control points color option may be hex from presets, custom colors will be rgb.
45145    // The position should always be a percentage.
45146    const controlPoints = gradientAST.colorStops.map(colorStop => {
45147      return {
45148        color: getStopCssColor(colorStop),
45149        // Although it's already been checked by `hasUnsupportedLength` in `getGradientAstWithDefault`,
45150        // TypeScript doesn't know that `colorStop.length` is not undefined here.
45151        // @ts-expect-error
45152        position: parseInt(colorStop.length.value)
45153      };
45154    });
45155    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(v_stack_component, {
45156      spacing: 4,
45157      className: "components-custom-gradient-picker",
45158      children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(CustomGradientBar, {
45159        __experimentalIsRenderedInSidebar: __experimentalIsRenderedInSidebar,
45160        background: background,
45161        hasGradient: hasGradient,
45162        value: controlPoints,
45163        onChange: newControlPoints => {
45164          onChange(serializeGradient(getGradientAstWithControlPoints(gradientAST, newControlPoints)));
45165        }
45166      }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(flex_component, {
45167        gap: 3,
45168        className: "components-custom-gradient-picker__ui-line",
45169        children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(SelectWrapper, {
45170          children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(GradientTypePicker, {
45171            gradientAST: gradientAST,
45172            hasGradient: hasGradient,
45173            onChange: onChange
45174          })
45175        }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(AccessoryWrapper, {
45176          children: gradientAST.type === 'linear-gradient' && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(GradientAnglePicker, {
45177            gradientAST: gradientAST,
45178            hasGradient: hasGradient,
45179            onChange: onChange
45180          })
45181        })]
45182      })]
45183    });
45184  }
45185  /* harmony default export */ const custom_gradient_picker = (CustomGradientPicker);
45186  
45187  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/gradient-picker/index.js
45188  /**
45189   * WordPress dependencies
45190   */
45191  
45192  
45193  
45194  
45195  /**
45196   * Internal dependencies
45197   */
45198  
45199  
45200  
45201  
45202  
45203  
45204  // The Multiple Origin Gradients have a `gradients` property (an array of
45205  // gradient objects), while Single Origin ones have a `gradient` property.
45206  const isMultipleOriginObject = obj => Array.isArray(obj.gradients) && !('gradient' in obj);
45207  const isMultipleOriginArray = arr => {
45208    return arr.length > 0 && arr.every(gradientObj => isMultipleOriginObject(gradientObj));
45209  };
45210  function SingleOrigin({
45211    className,
45212    clearGradient,
45213    gradients,
45214    onChange,
45215    value,
45216    ...additionalProps
45217  }) {
45218    const gradientOptions = (0,external_wp_element_namespaceObject.useMemo)(() => {
45219      return gradients.map(({
45220        gradient,
45221        name,
45222        slug
45223      }, index) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_circular_option_picker.Option, {
45224        value: gradient,
45225        isSelected: value === gradient,
45226        tooltipText: name ||
45227        // translators: %s: gradient code e.g: "linear-gradient(90deg, rgba(98,16,153,1) 0%, rgba(172,110,22,1) 100%);".
45228        (0,external_wp_i18n_namespaceObject.sprintf)((0,external_wp_i18n_namespaceObject.__)('Gradient code: %s'), gradient),
45229        style: {
45230          color: 'rgba( 0,0,0,0 )',
45231          background: gradient
45232        },
45233        onClick: value === gradient ? clearGradient : () => onChange(gradient, index),
45234        "aria-label": name ?
45235        // translators: %s: The name of the gradient e.g: "Angular red to blue".
45236        (0,external_wp_i18n_namespaceObject.sprintf)((0,external_wp_i18n_namespaceObject.__)('Gradient: %s'), name) :
45237        // translators: %s: gradient code e.g: "linear-gradient(90deg, rgba(98,16,153,1) 0%, rgba(172,110,22,1) 100%);".
45238        (0,external_wp_i18n_namespaceObject.sprintf)((0,external_wp_i18n_namespaceObject.__)('Gradient code: %s'), gradient)
45239      }, slug));
45240    }, [gradients, value, onChange, clearGradient]);
45241    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_circular_option_picker.OptionGroup, {
45242      className: className,
45243      options: gradientOptions,
45244      ...additionalProps
45245    });
45246  }
45247  function MultipleOrigin({
45248    className,
45249    clearGradient,
45250    gradients,
45251    onChange,
45252    value,
45253    headingLevel
45254  }) {
45255    const instanceId = (0,external_wp_compose_namespaceObject.useInstanceId)(MultipleOrigin);
45256    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(v_stack_component, {
45257      spacing: 3,
45258      className: className,
45259      children: gradients.map(({
45260        name,
45261        gradients: gradientSet
45262      }, index) => {
45263        const id = `color-palette-$instanceId}-$index}`;
45264        return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(v_stack_component, {
45265          spacing: 2,
45266          children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ColorHeading, {
45267            level: headingLevel,
45268            id: id,
45269            children: name
45270          }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(SingleOrigin, {
45271            clearGradient: clearGradient,
45272            gradients: gradientSet,
45273            onChange: gradient => onChange(gradient, index),
45274            value: value,
45275            "aria-labelledby": id
45276          })]
45277        }, index);
45278      })
45279    });
45280  }
45281  function Component(props) {
45282    const {
45283      asButtons,
45284      loop,
45285      actions,
45286      headingLevel,
45287      'aria-label': ariaLabel,
45288      'aria-labelledby': ariaLabelledby,
45289      ...additionalProps
45290    } = props;
45291    const options = isMultipleOriginArray(props.gradients) ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(MultipleOrigin, {
45292      headingLevel: headingLevel,
45293      ...additionalProps
45294    }) : /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(SingleOrigin, {
45295      ...additionalProps
45296    });
45297    let metaProps;
45298    if (asButtons) {
45299      metaProps = {
45300        asButtons: true
45301      };
45302    } else {
45303      const _metaProps = {
45304        asButtons: false,
45305        loop
45306      };
45307      if (ariaLabel) {
45308        metaProps = {
45309          ..._metaProps,
45310          'aria-label': ariaLabel
45311        };
45312      } else if (ariaLabelledby) {
45313        metaProps = {
45314          ..._metaProps,
45315          'aria-labelledby': ariaLabelledby
45316        };
45317      } else {
45318        metaProps = {
45319          ..._metaProps,
45320          'aria-label': (0,external_wp_i18n_namespaceObject.__)('Custom color picker.')
45321        };
45322      }
45323    }
45324    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_circular_option_picker, {
45325      ...metaProps,
45326      actions: actions,
45327      options: options
45328    });
45329  }
45330  
45331  /**
45332   *  GradientPicker is a React component that renders a color gradient picker to
45333   * define a multi step gradient. There's either a _linear_ or a _radial_ type
45334   * available.
45335   *
45336   * ```jsx
45337   *import { GradientPicker } from '@wordpress/components';
45338   *import { useState } from '@wordpress/element';
45339   *
45340   *const myGradientPicker = () => {
45341   *    const [ gradient, setGradient ] = useState( null );
45342   *
45343   *    return (
45344   *        <GradientPicker
45345   *            value={ gradient }
45346   *            onChange={ ( currentGradient ) => setGradient( currentGradient ) }
45347   *            gradients={ [
45348   *                {
45349   *                    name: 'JShine',
45350   *                    gradient:
45351   *                        'linear-gradient(135deg,#12c2e9 0%,#c471ed 50%,#f64f59 100%)',
45352   *                    slug: 'jshine',
45353   *                },
45354   *                {
45355   *                    name: 'Moonlit Asteroid',
45356   *                    gradient:
45357   *                        'linear-gradient(135deg,#0F2027 0%, #203A43 0%, #2c5364 100%)',
45358   *                    slug: 'moonlit-asteroid',
45359   *                },
45360   *                {
45361   *                    name: 'Rastafarie',
45362   *                    gradient:
45363   *                        'linear-gradient(135deg,#1E9600 0%, #FFF200 0%, #FF0000 100%)',
45364   *                    slug: 'rastafari',
45365   *                },
45366   *            ] }
45367   *        />
45368   *    );
45369   *};
45370   *```
45371   *
45372   */
45373  function GradientPicker({
45374    className,
45375    gradients = [],
45376    onChange,
45377    value,
45378    clearable = true,
45379    disableCustomGradients = false,
45380    __experimentalIsRenderedInSidebar,
45381    headingLevel = 2,
45382    ...additionalProps
45383  }) {
45384    const clearGradient = (0,external_wp_element_namespaceObject.useCallback)(() => onChange(undefined), [onChange]);
45385    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(v_stack_component, {
45386      spacing: gradients.length ? 4 : 0,
45387      children: [!disableCustomGradients && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(custom_gradient_picker, {
45388        __experimentalIsRenderedInSidebar: __experimentalIsRenderedInSidebar,
45389        value: value,
45390        onChange: onChange
45391      }), (gradients.length > 0 || clearable) && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Component, {
45392        ...additionalProps,
45393        className: className,
45394        clearGradient: clearGradient,
45395        gradients: gradients,
45396        onChange: onChange,
45397        value: value,
45398        actions: clearable && !disableCustomGradients && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_circular_option_picker.ButtonAction, {
45399          onClick: clearGradient,
45400          children: (0,external_wp_i18n_namespaceObject.__)('Clear')
45401        }),
45402        headingLevel: headingLevel
45403      })]
45404    });
45405  }
45406  /* harmony default export */ const gradient_picker = (GradientPicker);
45407  
45408  ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/menu.js
45409  /**
45410   * WordPress dependencies
45411   */
45412  
45413  
45414  const menu = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, {
45415    xmlns: "http://www.w3.org/2000/svg",
45416    viewBox: "0 0 24 24",
45417    children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, {
45418      d: "M5 5v1.5h14V5H5zm0 7.8h14v-1.5H5v1.5zM5 19h14v-1.5H5V19z"
45419    })
45420  });
45421  /* harmony default export */ const library_menu = (menu);
45422  
45423  ;// CONCATENATED MODULE: external ["wp","dom"]
45424  const external_wp_dom_namespaceObject = window["wp"]["dom"];
45425  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/navigable-container/container.js
45426  /**
45427   * External dependencies
45428   */
45429  
45430  /**
45431   * WordPress dependencies
45432   */
45433  
45434  
45435  
45436  /**
45437   * Internal dependencies
45438   */
45439  
45440  const container_noop = () => {};
45441  const MENU_ITEM_ROLES = ['menuitem', 'menuitemradio', 'menuitemcheckbox'];
45442  function cycleValue(value, total, offset) {
45443    const nextValue = value + offset;
45444    if (nextValue < 0) {
45445      return total + nextValue;
45446    } else if (nextValue >= total) {
45447      return nextValue - total;
45448    }
45449    return nextValue;
45450  }
45451  class NavigableContainer extends external_wp_element_namespaceObject.Component {
45452    constructor(args) {
45453      super(args);
45454      this.onKeyDown = this.onKeyDown.bind(this);
45455      this.bindContainer = this.bindContainer.bind(this);
45456      this.getFocusableContext = this.getFocusableContext.bind(this);
45457      this.getFocusableIndex = this.getFocusableIndex.bind(this);
45458    }
45459    componentDidMount() {
45460      if (!this.container) {
45461        return;
45462      }
45463  
45464      // We use DOM event listeners instead of React event listeners
45465      // because we want to catch events from the underlying DOM tree
45466      // The React Tree can be different from the DOM tree when using
45467      // portals. Block Toolbars for instance are rendered in a separate
45468      // React Trees.
45469      this.container.addEventListener('keydown', this.onKeyDown);
45470    }
45471    componentWillUnmount() {
45472      if (!this.container) {
45473        return;
45474      }
45475      this.container.removeEventListener('keydown', this.onKeyDown);
45476    }
45477    bindContainer(ref) {
45478      const {
45479        forwardedRef
45480      } = this.props;
45481      this.container = ref;
45482      if (typeof forwardedRef === 'function') {
45483        forwardedRef(ref);
45484      } else if (forwardedRef && 'current' in forwardedRef) {
45485        forwardedRef.current = ref;
45486      }
45487    }
45488    getFocusableContext(target) {
45489      if (!this.container) {
45490        return null;
45491      }
45492      const {
45493        onlyBrowserTabstops
45494      } = this.props;
45495      const finder = onlyBrowserTabstops ? external_wp_dom_namespaceObject.focus.tabbable : external_wp_dom_namespaceObject.focus.focusable;
45496      const focusables = finder.find(this.container);
45497      const index = this.getFocusableIndex(focusables, target);
45498      if (index > -1 && target) {
45499        return {
45500          index,
45501          target,
45502          focusables
45503        };
45504      }
45505      return null;
45506    }
45507    getFocusableIndex(focusables, target) {
45508      return focusables.indexOf(target);
45509    }
45510    onKeyDown(event) {
45511      if (this.props.onKeyDown) {
45512        this.props.onKeyDown(event);
45513      }
45514      const {
45515        getFocusableContext
45516      } = this;
45517      const {
45518        cycle = true,
45519        eventToOffset,
45520        onNavigate = container_noop,
45521        stopNavigationEvents
45522      } = this.props;
45523      const offset = eventToOffset(event);
45524  
45525      // eventToOffset returns undefined if the event is not handled by the component.
45526      if (offset !== undefined && stopNavigationEvents) {
45527        // Prevents arrow key handlers bound to the document directly interfering.
45528        event.stopImmediatePropagation();
45529  
45530        // When navigating a collection of items, prevent scroll containers
45531        // from scrolling. The preventDefault also prevents Voiceover from
45532        // 'handling' the event, as voiceover will try to use arrow keys
45533        // for highlighting text.
45534        const targetRole = event.target?.getAttribute('role');
45535        const targetHasMenuItemRole = !!targetRole && MENU_ITEM_ROLES.includes(targetRole);
45536        if (targetHasMenuItemRole) {
45537          event.preventDefault();
45538        }
45539      }
45540      if (!offset) {
45541        return;
45542      }
45543      const activeElement = event.target?.ownerDocument?.activeElement;
45544      if (!activeElement) {
45545        return;
45546      }
45547      const context = getFocusableContext(activeElement);
45548      if (!context) {
45549        return;
45550      }
45551      const {
45552        index,
45553        focusables
45554      } = context;
45555      const nextIndex = cycle ? cycleValue(index, focusables.length, offset) : index + offset;
45556      if (nextIndex >= 0 && nextIndex < focusables.length) {
45557        focusables[nextIndex].focus();
45558        onNavigate(nextIndex, focusables[nextIndex]);
45559  
45560        // `preventDefault()` on tab to avoid having the browser move the focus
45561        // after this component has already moved it.
45562        if (event.code === 'Tab') {
45563          event.preventDefault();
45564        }
45565      }
45566    }
45567    render() {
45568      const {
45569        children,
45570        stopNavigationEvents,
45571        eventToOffset,
45572        onNavigate,
45573        onKeyDown,
45574        cycle,
45575        onlyBrowserTabstops,
45576        forwardedRef,
45577        ...restProps
45578      } = this.props;
45579      return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", {
45580        ref: this.bindContainer,
45581        ...restProps,
45582        children: children
45583      });
45584    }
45585  }
45586  const forwardedNavigableContainer = (props, ref) => {
45587    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(NavigableContainer, {
45588      ...props,
45589      forwardedRef: ref
45590    });
45591  };
45592  forwardedNavigableContainer.displayName = 'NavigableContainer';
45593  /* harmony default export */ const container = ((0,external_wp_element_namespaceObject.forwardRef)(forwardedNavigableContainer));
45594  
45595  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/navigable-container/menu.js
45596  /**
45597   * External dependencies
45598   */
45599  
45600  /**
45601   * WordPress dependencies
45602   */
45603  
45604  
45605  /**
45606   * Internal dependencies
45607   */
45608  
45609  
45610  function UnforwardedNavigableMenu({
45611    role = 'menu',
45612    orientation = 'vertical',
45613    ...rest
45614  }, ref) {
45615    const eventToOffset = evt => {
45616      const {
45617        code
45618      } = evt;
45619      let next = ['ArrowDown'];
45620      let previous = ['ArrowUp'];
45621      if (orientation === 'horizontal') {
45622        next = ['ArrowRight'];
45623        previous = ['ArrowLeft'];
45624      }
45625      if (orientation === 'both') {
45626        next = ['ArrowRight', 'ArrowDown'];
45627        previous = ['ArrowLeft', 'ArrowUp'];
45628      }
45629      if (next.includes(code)) {
45630        return 1;
45631      } else if (previous.includes(code)) {
45632        return -1;
45633      } else if (['ArrowDown', 'ArrowUp', 'ArrowLeft', 'ArrowRight'].includes(code)) {
45634        // Key press should be handled, e.g. have event propagation and
45635        // default behavior handled by NavigableContainer but not result
45636        // in an offset.
45637        return 0;
45638      }
45639      return undefined;
45640    };
45641    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(container, {
45642      ref: ref,
45643      stopNavigationEvents: true,
45644      onlyBrowserTabstops: false,
45645      role: role,
45646      "aria-orientation": role !== 'presentation' && (orientation === 'vertical' || orientation === 'horizontal') ? orientation : undefined,
45647      eventToOffset: eventToOffset,
45648      ...rest
45649    });
45650  }
45651  
45652  /**
45653   * A container for a navigable menu.
45654   *
45655   *  ```jsx
45656   *  import {
45657   *    NavigableMenu,
45658   *    Button,
45659   *  } from '@wordpress/components';
45660   *
45661   *  function onNavigate( index, target ) {
45662   *    console.log( `Navigates to ${ index }`, target );
45663   *  }
45664   *
45665   *  const MyNavigableContainer = () => (
45666   *    <div>
45667   *      <span>Navigable Menu:</span>
45668   *      <NavigableMenu onNavigate={ onNavigate } orientation="horizontal">
45669   *        <Button variant="secondary">Item 1</Button>
45670   *        <Button variant="secondary">Item 2</Button>
45671   *        <Button variant="secondary">Item 3</Button>
45672   *      </NavigableMenu>
45673   *    </div>
45674   *  );
45675   *  ```
45676   */
45677  const NavigableMenu = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedNavigableMenu);
45678  /* harmony default export */ const navigable_container_menu = (NavigableMenu);
45679  
45680  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/dropdown-menu/index.js
45681  /**
45682   * External dependencies
45683   */
45684  
45685  
45686  /**
45687   * WordPress dependencies
45688   */
45689  
45690  
45691  /**
45692   * Internal dependencies
45693   */
45694  
45695  
45696  
45697  
45698  
45699  
45700  function dropdown_menu_mergeProps(defaultProps = {}, props = {}) {
45701    const mergedProps = {
45702      ...defaultProps,
45703      ...props
45704    };
45705    if (props.className && defaultProps.className) {
45706      mergedProps.className = dist_clsx(props.className, defaultProps.className);
45707    }
45708    return mergedProps;
45709  }
45710  function dropdown_menu_isFunction(maybeFunc) {
45711    return typeof maybeFunc === 'function';
45712  }
45713  function UnconnectedDropdownMenu(dropdownMenuProps) {
45714    const {
45715      children,
45716      className,
45717      controls,
45718      icon = library_menu,
45719      label,
45720      popoverProps,
45721      toggleProps,
45722      menuProps,
45723      disableOpenOnArrowDown = false,
45724      text,
45725      noIcons,
45726      open,
45727      defaultOpen,
45728      onToggle: onToggleProp,
45729      // Context
45730      variant
45731    } = useContextSystem(dropdownMenuProps, 'DropdownMenu');
45732    if (!controls?.length && !dropdown_menu_isFunction(children)) {
45733      return null;
45734    }
45735  
45736    // Normalize controls to nested array of objects (sets of controls)
45737    let controlSets;
45738    if (controls?.length) {
45739      // @ts-expect-error The check below is needed because `DropdownMenus`
45740      // rendered by `ToolBarGroup` receive controls as a nested array.
45741      controlSets = controls;
45742      if (!Array.isArray(controlSets[0])) {
45743        // This is not ideal, but at this point we know that `controls` is
45744        // not a nested array, even if TypeScript doesn't.
45745        controlSets = [controls];
45746      }
45747    }
45748    const mergedPopoverProps = dropdown_menu_mergeProps({
45749      className: 'components-dropdown-menu__popover',
45750      variant
45751    }, popoverProps);
45752    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(dropdown, {
45753      className: className,
45754      popoverProps: mergedPopoverProps,
45755      renderToggle: ({
45756        isOpen,
45757        onToggle
45758      }) => {
45759        var _toggleProps$showTool;
45760        const openOnArrowDown = event => {
45761          if (disableOpenOnArrowDown) {
45762            return;
45763          }
45764          if (!isOpen && event.code === 'ArrowDown') {
45765            event.preventDefault();
45766            onToggle();
45767          }
45768        };
45769        const {
45770          as: Toggle = build_module_button,
45771          ...restToggleProps
45772        } = toggleProps !== null && toggleProps !== void 0 ? toggleProps : {};
45773        const mergedToggleProps = dropdown_menu_mergeProps({
45774          className: dist_clsx('components-dropdown-menu__toggle', {
45775            'is-opened': isOpen
45776          })
45777        }, restToggleProps);
45778        return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Toggle, {
45779          ...mergedToggleProps,
45780          icon: icon,
45781          onClick: event => {
45782            onToggle();
45783            if (mergedToggleProps.onClick) {
45784              mergedToggleProps.onClick(event);
45785            }
45786          },
45787          onKeyDown: event => {
45788            openOnArrowDown(event);
45789            if (mergedToggleProps.onKeyDown) {
45790              mergedToggleProps.onKeyDown(event);
45791            }
45792          },
45793          "aria-haspopup": "true",
45794          "aria-expanded": isOpen,
45795          label: label,
45796          text: text,
45797          showTooltip: (_toggleProps$showTool = toggleProps?.showTooltip) !== null && _toggleProps$showTool !== void 0 ? _toggleProps$showTool : true,
45798          children: mergedToggleProps.children
45799        });
45800      },
45801      renderContent: props => {
45802        const mergedMenuProps = dropdown_menu_mergeProps({
45803          'aria-label': label,
45804          className: dist_clsx('components-dropdown-menu__menu', {
45805            'no-icons': noIcons
45806          })
45807        }, menuProps);
45808        return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(navigable_container_menu, {
45809          ...mergedMenuProps,
45810          role: "menu",
45811          children: [dropdown_menu_isFunction(children) ? children(props) : null, controlSets?.flatMap((controlSet, indexOfSet) => controlSet.map((control, indexOfControl) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, {
45812            onClick: event => {
45813              event.stopPropagation();
45814              props.onClose();
45815              if (control.onClick) {
45816                control.onClick();
45817              }
45818            },
45819            className: dist_clsx('components-dropdown-menu__menu-item', {
45820              'has-separator': indexOfSet > 0 && indexOfControl === 0,
45821              'is-active': control.isActive,
45822              'is-icon-only': !control.title
45823            }),
45824            icon: control.icon,
45825            label: control.label,
45826            "aria-checked": control.role === 'menuitemcheckbox' || control.role === 'menuitemradio' ? control.isActive : undefined,
45827            role: control.role === 'menuitemcheckbox' || control.role === 'menuitemradio' ? control.role : 'menuitem',
45828            accessibleWhenDisabled: true,
45829            disabled: control.isDisabled,
45830            children: control.title
45831          }, [indexOfSet, indexOfControl].join())))]
45832        });
45833      },
45834      open: open,
45835      defaultOpen: defaultOpen,
45836      onToggle: onToggleProp
45837    });
45838  }
45839  
45840  /**
45841   *
45842   * The DropdownMenu displays a list of actions (each contained in a MenuItem,
45843   * MenuItemsChoice, or MenuGroup) in a compact way. It appears in a Popover
45844   * after the user has interacted with an element (a button or icon) or when
45845   * they perform a specific action.
45846   *
45847   * Render a Dropdown Menu with a set of controls:
45848   *
45849   * ```jsx
45850   * import { DropdownMenu } from '@wordpress/components';
45851   * import {
45852   *     more,
45853   *     arrowLeft,
45854   *     arrowRight,
45855   *     arrowUp,
45856   *     arrowDown,
45857   * } from '@wordpress/icons';
45858   *
45859   * const MyDropdownMenu = () => (
45860   *     <DropdownMenu
45861   *         icon={ more }
45862   *         label="Select a direction"
45863   *         controls={ [
45864   *             {
45865   *                 title: 'Up',
45866   *                 icon: arrowUp,
45867   *                 onClick: () => console.log( 'up' ),
45868   *             },
45869   *             {
45870   *                 title: 'Right',
45871   *                 icon: arrowRight,
45872   *                 onClick: () => console.log( 'right' ),
45873   *             },
45874   *             {
45875   *                 title: 'Down',
45876   *                 icon: arrowDown,
45877   *                 onClick: () => console.log( 'down' ),
45878   *             },
45879   *             {
45880   *                 title: 'Left',
45881   *                 icon: arrowLeft,
45882   *                 onClick: () => console.log( 'left' ),
45883   *             },
45884   *         ] }
45885   *     />
45886   * );
45887   * ```
45888   *
45889   * Alternatively, specify a `children` function which returns elements valid for
45890   * use in a DropdownMenu: `MenuItem`, `MenuItemsChoice`, or `MenuGroup`.
45891   *
45892   * ```jsx
45893   * import { DropdownMenu, MenuGroup, MenuItem } from '@wordpress/components';
45894   * import { more, arrowUp, arrowDown, trash } from '@wordpress/icons';
45895   *
45896   * const MyDropdownMenu = () => (
45897   *     <DropdownMenu icon={ more } label="Select a direction">
45898   *         { ( { onClose } ) => (
45899   *             <>
45900   *                 <MenuGroup>
45901   *                     <MenuItem icon={ arrowUp } onClick={ onClose }>
45902   *                         Move Up
45903   *                     </MenuItem>
45904   *                     <MenuItem icon={ arrowDown } onClick={ onClose }>
45905   *                         Move Down
45906   *                     </MenuItem>
45907   *                 </MenuGroup>
45908   *                 <MenuGroup>
45909   *                     <MenuItem icon={ trash } onClick={ onClose }>
45910   *                         Remove
45911   *                     </MenuItem>
45912   *                 </MenuGroup>
45913   *             </>
45914   *         ) }
45915   *     </DropdownMenu>
45916   * );
45917   * ```
45918   *
45919   */
45920  const DropdownMenu = contextConnectWithoutRef(UnconnectedDropdownMenu, 'DropdownMenu');
45921  /* harmony default export */ const dropdown_menu = (DropdownMenu);
45922  
45923  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/palette-edit/styles.js
45924  
45925  function palette_edit_styles_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)."; }
45926  /**
45927   * External dependencies
45928   */
45929  
45930  
45931  
45932  /**
45933   * Internal dependencies
45934   */
45935  
45936  
45937  
45938  
45939  
45940  
45941  
45942  
45943  const IndicatorStyled = /*#__PURE__*/emotion_styled_base_browser_esm(color_indicator,  true ? {
45944    target: "e1lpqc909"
45945  } : 0)("&&{flex-shrink:0;width:", space(6), ";height:", space(6), ";}" + ( true ? "" : 0));
45946  const NameInputControl = /*#__PURE__*/emotion_styled_base_browser_esm(input_control,  true ? {
45947    target: "e1lpqc908"
45948  } : 0)(Container, "{background:", COLORS.gray[100], ";border-radius:", config_values.radiusXSmall, ";", Input, Input, Input, Input, "{height:", space(8), ";}", BackdropUI, BackdropUI, BackdropUI, "{border-color:transparent;box-shadow:none;}}" + ( true ? "" : 0));
45949  const buttonStyleReset = ({
45950    as
45951  }) => {
45952    if (as === 'button') {
45953      return /*#__PURE__*/emotion_react_browser_esm_css("display:flex;align-items:center;width:100%;appearance:none;background:transparent;border:none;border-radius:0;padding:0;cursor:pointer;&:hover{color:", COLORS.theme.accent, ";}" + ( true ? "" : 0),  true ? "" : 0);
45954    }
45955    return null;
45956  };
45957  const PaletteItem = /*#__PURE__*/emotion_styled_base_browser_esm(component,  true ? {
45958    target: "e1lpqc907"
45959  } : 0)(buttonStyleReset, " padding-block:3px;padding-inline-start:", space(3), ";border:1px solid ", config_values.surfaceBorderColor, ";border-bottom-color:transparent;font-size:", font('default.fontSize'), ";&:focus-visible{border-color:transparent;box-shadow:0 0 0 var( --wp-admin-border-width-focus ) ", COLORS.theme.accent, ";outline:2px solid transparent;outline-offset:0;}border-top-left-radius:", config_values.radiusSmall, ";border-top-right-radius:", config_values.radiusSmall, ";&+&{border-top-left-radius:0;border-top-right-radius:0;}&:last-child{border-bottom-left-radius:", config_values.radiusSmall, ";border-bottom-right-radius:", config_values.radiusSmall, ";border-bottom-color:", config_values.surfaceBorderColor, ";}&.is-selected+&{border-top-color:transparent;}&.is-selected{border-color:", COLORS.theme.accent, ";}" + ( true ? "" : 0));
45960  const NameContainer = /*#__PURE__*/emotion_styled_base_browser_esm("div",  true ? {
45961    target: "e1lpqc906"
45962  } : 0)("line-height:", space(8), ";margin-left:", space(2), ";margin-right:", space(2), ";white-space:nowrap;overflow:hidden;" + ( true ? "" : 0));
45963  const PaletteHeading = /*#__PURE__*/emotion_styled_base_browser_esm(heading_component,  true ? {
45964    target: "e1lpqc905"
45965  } : 0)("text-transform:uppercase;line-height:", space(6), ";font-weight:500;&&&{font-size:11px;margin-bottom:0;}" + ( true ? "" : 0));
45966  const PaletteActionsContainer = /*#__PURE__*/emotion_styled_base_browser_esm(component,  true ? {
45967    target: "e1lpqc904"
45968  } : 0)("height:", space(6), ";display:flex;" + ( true ? "" : 0));
45969  const PaletteEditContents = /*#__PURE__*/emotion_styled_base_browser_esm(component,  true ? {
45970    target: "e1lpqc903"
45971  } : 0)("margin-top:", space(2), ";" + ( true ? "" : 0));
45972  const PaletteEditStyles = /*#__PURE__*/emotion_styled_base_browser_esm(component,  true ? {
45973    target: "e1lpqc902"
45974  } : 0)( true ? {
45975    name: "u6wnko",
45976    styles: "&&&{.components-button.has-icon{min-width:0;padding:0;}}"
45977  } : 0);
45978  const DoneButton = /*#__PURE__*/emotion_styled_base_browser_esm(build_module_button,  true ? {
45979    target: "e1lpqc901"
45980  } : 0)("&&{color:", COLORS.theme.accent, ";}" + ( true ? "" : 0));
45981  const RemoveButton = /*#__PURE__*/emotion_styled_base_browser_esm(build_module_button,  true ? {
45982    target: "e1lpqc900"
45983  } : 0)("&&{margin-top:", space(1), ";}" + ( true ? "" : 0));
45984  
45985  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/palette-edit/index.js
45986  /**
45987   * External dependencies
45988   */
45989  
45990  
45991  /**
45992   * WordPress dependencies
45993   */
45994  
45995  
45996  
45997  
45998  
45999  /**
46000   * Internal dependencies
46001   */
46002  
46003  
46004  
46005  
46006  
46007  
46008  
46009  
46010  
46011  
46012  
46013  
46014  
46015  
46016  
46017  
46018  
46019  
46020  const DEFAULT_COLOR = '#000';
46021  function NameInput({
46022    value,
46023    onChange,
46024    label
46025  }) {
46026    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(NameInputControl, {
46027      label: label,
46028      hideLabelFromVision: true,
46029      value: value,
46030      onChange: onChange
46031    });
46032  }
46033  
46034  /*
46035   * Deduplicates the slugs of the provided elements.
46036   */
46037  function deduplicateElementSlugs(elements) {
46038    const slugCounts = {};
46039    return elements.map(element => {
46040      var _newSlug;
46041      let newSlug;
46042      const {
46043        slug
46044      } = element;
46045      slugCounts[slug] = (slugCounts[slug] || 0) + 1;
46046      if (slugCounts[slug] > 1) {
46047        newSlug = `$slug}-$slugCounts[slug] - 1}`;
46048      }
46049      return {
46050        ...element,
46051        slug: (_newSlug = newSlug) !== null && _newSlug !== void 0 ? _newSlug : slug
46052      };
46053    });
46054  }
46055  
46056  /**
46057   * Returns a name and slug for a palette item. The name takes the format "Color + id".
46058   * To ensure there are no duplicate ids, this function checks all slugs.
46059   * It expects slugs to be in the format: slugPrefix + color- + number.
46060   * It then sets the id component of the new name based on the incremented id of the highest existing slug id.
46061   *
46062   * @param elements   An array of color palette items.
46063   * @param slugPrefix The slug prefix used to match the element slug.
46064   *
46065   * @return A name and slug for the new palette item.
46066   */
46067  function getNameAndSlugForPosition(elements, slugPrefix) {
46068    const nameRegex = new RegExp(`^$slugPrefix}color-([\\d]+)$`);
46069    const position = elements.reduce((previousValue, currentValue) => {
46070      if (typeof currentValue?.slug === 'string') {
46071        const matches = currentValue?.slug.match(nameRegex);
46072        if (matches) {
46073          const id = parseInt(matches[1], 10);
46074          if (id >= previousValue) {
46075            return id + 1;
46076          }
46077        }
46078      }
46079      return previousValue;
46080    }, 1);
46081    return {
46082      name: (0,external_wp_i18n_namespaceObject.sprintf)( /* translators: %s: is an id for a custom color */
46083      (0,external_wp_i18n_namespaceObject.__)('Color %s'), position),
46084      slug: `$slugPrefix}color-$position}`
46085    };
46086  }
46087  function ColorPickerPopover({
46088    isGradient,
46089    element,
46090    onChange,
46091    popoverProps: receivedPopoverProps,
46092    onClose = () => {}
46093  }) {
46094    const popoverProps = (0,external_wp_element_namespaceObject.useMemo)(() => ({
46095      shift: true,
46096      offset: 20,
46097      // Disabling resize as it would otherwise cause the popover to show
46098      // scrollbars while dragging the color picker's handle close to the
46099      // popover edge.
46100      resize: false,
46101      placement: 'left-start',
46102      ...receivedPopoverProps,
46103      className: dist_clsx('components-palette-edit__popover', receivedPopoverProps?.className)
46104    }), [receivedPopoverProps]);
46105    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(popover, {
46106      ...popoverProps,
46107      onClose: onClose,
46108      children: [!isGradient && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(LegacyAdapter, {
46109        color: element.color,
46110        enableAlpha: true,
46111        onChange: newColor => {
46112          onChange({
46113            ...element,
46114            color: newColor
46115          });
46116        }
46117      }), isGradient && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", {
46118        className: "components-palette-edit__popover-gradient-picker",
46119        children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(custom_gradient_picker, {
46120          __experimentalIsRenderedInSidebar: true,
46121          value: element.gradient,
46122          onChange: newGradient => {
46123            onChange({
46124              ...element,
46125              gradient: newGradient
46126            });
46127          }
46128        })
46129      })]
46130    });
46131  }
46132  function palette_edit_Option({
46133    canOnlyChangeValues,
46134    element,
46135    onChange,
46136    onRemove,
46137    popoverProps: receivedPopoverProps,
46138    slugPrefix,
46139    isGradient
46140  }) {
46141    const value = isGradient ? element.gradient : element.color;
46142    const [isEditingColor, setIsEditingColor] = (0,external_wp_element_namespaceObject.useState)(false);
46143  
46144    // Use internal state instead of a ref to make sure that the component
46145    // re-renders when the popover's anchor updates.
46146    const [popoverAnchor, setPopoverAnchor] = (0,external_wp_element_namespaceObject.useState)(null);
46147    const popoverProps = (0,external_wp_element_namespaceObject.useMemo)(() => ({
46148      ...receivedPopoverProps,
46149      // Use the custom palette color item as the popover anchor.
46150      anchor: popoverAnchor
46151    }), [popoverAnchor, receivedPopoverProps]);
46152    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(PaletteItem, {
46153      ref: setPopoverAnchor,
46154      as: "div",
46155      children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(h_stack_component, {
46156        justify: "flex-start",
46157        children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, {
46158          onClick: () => {
46159            setIsEditingColor(true);
46160          },
46161          "aria-label": (0,external_wp_i18n_namespaceObject.sprintf)(
46162          // translators: %s is a color or gradient name, e.g. "Red".
46163          (0,external_wp_i18n_namespaceObject.__)('Edit: %s'), element.name.trim().length ? element.name : value),
46164          style: {
46165            padding: 0
46166          },
46167          children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(IndicatorStyled, {
46168            colorValue: value
46169          })
46170        }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(flex_item_component, {
46171          children: !canOnlyChangeValues ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(NameInput, {
46172            label: isGradient ? (0,external_wp_i18n_namespaceObject.__)('Gradient name') : (0,external_wp_i18n_namespaceObject.__)('Color name'),
46173            value: element.name,
46174            onChange: nextName => onChange({
46175              ...element,
46176              name: nextName,
46177              slug: slugPrefix + kebabCase(nextName !== null && nextName !== void 0 ? nextName : '')
46178            })
46179          }) : /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(NameContainer, {
46180            children: element.name.trim().length ? element.name : /* Fall back to non-breaking space to maintain height */
46181            '\u00A0'
46182          })
46183        }), !canOnlyChangeValues && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(flex_item_component, {
46184          children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(RemoveButton, {
46185            size: "small",
46186            icon: line_solid,
46187            label: (0,external_wp_i18n_namespaceObject.sprintf)(
46188            // translators: %s is a color or gradient name, e.g. "Red".
46189            (0,external_wp_i18n_namespaceObject.__)('Remove color: %s'), element.name.trim().length ? element.name : value),
46190            onClick: onRemove
46191          })
46192        })]
46193      }), isEditingColor && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ColorPickerPopover, {
46194        isGradient: isGradient,
46195        onChange: onChange,
46196        element: element,
46197        popoverProps: popoverProps,
46198        onClose: () => setIsEditingColor(false)
46199      })]
46200    });
46201  }
46202  function PaletteEditListView({
46203    elements,
46204    onChange,
46205    canOnlyChangeValues,
46206    slugPrefix,
46207    isGradient,
46208    popoverProps,
46209    addColorRef
46210  }) {
46211    // When unmounting the component if there are empty elements (the user did not complete the insertion) clean them.
46212    const elementsReferenceRef = (0,external_wp_element_namespaceObject.useRef)();
46213    (0,external_wp_element_namespaceObject.useEffect)(() => {
46214      elementsReferenceRef.current = elements;
46215    }, [elements]);
46216    const debounceOnChange = (0,external_wp_compose_namespaceObject.useDebounce)(updatedElements => onChange(deduplicateElementSlugs(updatedElements)), 100);
46217    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(v_stack_component, {
46218      spacing: 3,
46219      children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(item_group_component, {
46220        isRounded: true,
46221        children: elements.map((element, index) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(palette_edit_Option, {
46222          isGradient: isGradient,
46223          canOnlyChangeValues: canOnlyChangeValues,
46224          element: element,
46225          onChange: newElement => {
46226            debounceOnChange(elements.map((currentElement, currentIndex) => {
46227              if (currentIndex === index) {
46228                return newElement;
46229              }
46230              return currentElement;
46231            }));
46232          },
46233          onRemove: () => {
46234            const newElements = elements.filter((_currentElement, currentIndex) => {
46235              if (currentIndex === index) {
46236                return false;
46237              }
46238              return true;
46239            });
46240            onChange(newElements.length ? newElements : undefined);
46241            addColorRef.current?.focus();
46242          },
46243          slugPrefix: slugPrefix,
46244          popoverProps: popoverProps
46245        }, index))
46246      })
46247    });
46248  }
46249  const EMPTY_ARRAY = [];
46250  
46251  /**
46252   * Allows editing a palette of colors or gradients.
46253   *
46254   * ```jsx
46255   * import { PaletteEdit } from '@wordpress/components';
46256   * const MyPaletteEdit = () => {
46257   *   const [ controlledColors, setControlledColors ] = useState( colors );
46258   *
46259   *   return (
46260   *     <PaletteEdit
46261   *       colors={ controlledColors }
46262   *       onChange={ ( newColors?: Color[] ) => {
46263   *         setControlledColors( newColors );
46264   *       } }
46265   *       paletteLabel="Here is a label"
46266   *     />
46267   *   );
46268   * };
46269   * ```
46270   */
46271  function PaletteEdit({
46272    gradients,
46273    colors = EMPTY_ARRAY,
46274    onChange,
46275    paletteLabel,
46276    paletteLabelHeadingLevel = 2,
46277    emptyMessage,
46278    canOnlyChangeValues,
46279    canReset,
46280    slugPrefix = '',
46281    popoverProps
46282  }) {
46283    const isGradient = !!gradients;
46284    const elements = isGradient ? gradients : colors;
46285    const [isEditing, setIsEditing] = (0,external_wp_element_namespaceObject.useState)(false);
46286    const [editingElement, setEditingElement] = (0,external_wp_element_namespaceObject.useState)(null);
46287    const isAdding = isEditing && !!editingElement && elements[editingElement] && !elements[editingElement].slug;
46288    const elementsLength = elements.length;
46289    const hasElements = elementsLength > 0;
46290    const debounceOnChange = (0,external_wp_compose_namespaceObject.useDebounce)(onChange, 100);
46291    const onSelectPaletteItem = (0,external_wp_element_namespaceObject.useCallback)((value, newEditingElementIndex) => {
46292      const selectedElement = newEditingElementIndex === undefined ? undefined : elements[newEditingElementIndex];
46293      const key = isGradient ? 'gradient' : 'color';
46294      // Ensures that the index returned matches a known element value.
46295      if (!!selectedElement && selectedElement[key] === value) {
46296        setEditingElement(newEditingElementIndex);
46297      } else {
46298        setIsEditing(true);
46299      }
46300    }, [isGradient, elements]);
46301    const addColorRef = (0,external_wp_element_namespaceObject.useRef)(null);
46302    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(PaletteEditStyles, {
46303      children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(h_stack_component, {
46304        children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(PaletteHeading, {
46305          level: paletteLabelHeadingLevel,
46306          children: paletteLabel
46307        }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(PaletteActionsContainer, {
46308          children: [hasElements && isEditing && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(DoneButton, {
46309            size: "small",
46310            onClick: () => {
46311              setIsEditing(false);
46312              setEditingElement(null);
46313            },
46314            children: (0,external_wp_i18n_namespaceObject.__)('Done')
46315          }), !canOnlyChangeValues && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, {
46316            ref: addColorRef,
46317            size: "small",
46318            isPressed: isAdding,
46319            icon: library_plus,
46320            label: isGradient ? (0,external_wp_i18n_namespaceObject.__)('Add gradient') : (0,external_wp_i18n_namespaceObject.__)('Add color'),
46321            onClick: () => {
46322              const {
46323                name,
46324                slug
46325              } = getNameAndSlugForPosition(elements, slugPrefix);
46326              if (!!gradients) {
46327                onChange([...gradients, {
46328                  gradient: DEFAULT_GRADIENT,
46329                  name,
46330                  slug
46331                }]);
46332              } else {
46333                onChange([...colors, {
46334                  color: DEFAULT_COLOR,
46335                  name,
46336                  slug
46337                }]);
46338              }
46339              setIsEditing(true);
46340              setEditingElement(elements.length);
46341            }
46342          }), hasElements && (!isEditing || !canOnlyChangeValues || canReset) && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(dropdown_menu, {
46343            icon: more_vertical,
46344            label: isGradient ? (0,external_wp_i18n_namespaceObject.__)('Gradient options') : (0,external_wp_i18n_namespaceObject.__)('Color options'),
46345            toggleProps: {
46346              size: 'small'
46347            },
46348            children: ({
46349              onClose
46350            }) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_ReactJSXRuntime_namespaceObject.Fragment, {
46351              children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(navigable_container_menu, {
46352                role: "menu",
46353                children: [!isEditing && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, {
46354                  variant: "tertiary",
46355                  onClick: () => {
46356                    setIsEditing(true);
46357                    onClose();
46358                  },
46359                  className: "components-palette-edit__menu-button",
46360                  children: (0,external_wp_i18n_namespaceObject.__)('Show details')
46361                }), !canOnlyChangeValues && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, {
46362                  variant: "tertiary",
46363                  onClick: () => {
46364                    setEditingElement(null);
46365                    setIsEditing(false);
46366                    onChange();
46367                    onClose();
46368                  },
46369                  className: "components-palette-edit__menu-button",
46370                  children: isGradient ? (0,external_wp_i18n_namespaceObject.__)('Remove all gradients') : (0,external_wp_i18n_namespaceObject.__)('Remove all colors')
46371                }), canReset && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, {
46372                  variant: "tertiary",
46373                  onClick: () => {
46374                    setEditingElement(null);
46375                    onChange();
46376                    onClose();
46377                  },
46378                  children: isGradient ? (0,external_wp_i18n_namespaceObject.__)('Reset gradient') : (0,external_wp_i18n_namespaceObject.__)('Reset colors')
46379                })]
46380              })
46381            })
46382          })]
46383        })]
46384      }), hasElements && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(PaletteEditContents, {
46385        children: [isEditing && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(PaletteEditListView, {
46386          canOnlyChangeValues: canOnlyChangeValues,
46387          elements: elements
46388          // @ts-expect-error TODO: Don't know how to resolve
46389          ,
46390          onChange: onChange,
46391          slugPrefix: slugPrefix,
46392          isGradient: isGradient,
46393          popoverProps: popoverProps,
46394          addColorRef: addColorRef
46395        }), !isEditing && editingElement !== null && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ColorPickerPopover, {
46396          isGradient: isGradient,
46397          onClose: () => setEditingElement(null),
46398          onChange: newElement => {
46399            debounceOnChange(
46400            // @ts-expect-error TODO: Don't know how to resolve
46401            elements.map((currentElement, currentIndex) => {
46402              if (currentIndex === editingElement) {
46403                return newElement;
46404              }
46405              return currentElement;
46406            }));
46407          },
46408          element: elements[editingElement !== null && editingElement !== void 0 ? editingElement : -1],
46409          popoverProps: popoverProps
46410        }), !isEditing && (isGradient ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(gradient_picker, {
46411          gradients: gradients,
46412          onChange: onSelectPaletteItem,
46413          clearable: false,
46414          disableCustomGradients: true
46415        }) : /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(color_palette, {
46416          colors: colors,
46417          onChange: onSelectPaletteItem,
46418          clearable: false,
46419          disableCustomColors: true
46420        }))]
46421      }), !hasElements && emptyMessage && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(PaletteEditContents, {
46422        children: emptyMessage
46423      })]
46424    });
46425  }
46426  /* harmony default export */ const palette_edit = (PaletteEdit);
46427  
46428  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/combobox-control/styles.js
46429  
46430  /**
46431   * External dependencies
46432   */
46433  
46434  
46435  
46436  /**
46437   * Internal dependencies
46438   */
46439  
46440  
46441  const deprecatedDefaultSize = ({
46442    __next40pxDefaultSize
46443  }) => !__next40pxDefaultSize && /*#__PURE__*/emotion_react_browser_esm_css("height:28px;padding-left:", space(1), ";padding-right:", space(1), ";" + ( true ? "" : 0),  true ? "" : 0);
46444  const InputWrapperFlex = /*#__PURE__*/emotion_styled_base_browser_esm(flex_component,  true ? {
46445    target: "evuatpg0"
46446  } : 0)("height:38px;padding-left:", space(2), ";padding-right:", space(2), ";", deprecatedDefaultSize, ";" + ( true ? "" : 0));
46447  
46448  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/form-token-field/token-input.js
46449  /**
46450   * External dependencies
46451   */
46452  
46453  /**
46454   * WordPress dependencies
46455   */
46456  
46457  
46458  /**
46459   * Internal dependencies
46460   */
46461  
46462  function UnForwardedTokenInput(props, ref) {
46463    const {
46464      value,
46465      isExpanded,
46466      instanceId,
46467      selectedSuggestionIndex,
46468      className,
46469      onChange,
46470      onFocus,
46471      onBlur,
46472      ...restProps
46473    } = props;
46474    const [hasFocus, setHasFocus] = (0,external_wp_element_namespaceObject.useState)(false);
46475    const size = value ? value.length + 1 : 0;
46476    const onChangeHandler = event => {
46477      if (onChange) {
46478        onChange({
46479          value: event.target.value
46480        });
46481      }
46482    };
46483    const onFocusHandler = e => {
46484      setHasFocus(true);
46485      onFocus?.(e);
46486    };
46487    const onBlurHandler = e => {
46488      setHasFocus(false);
46489      onBlur?.(e);
46490    };
46491    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("input", {
46492      ref: ref,
46493      id: `components-form-token-input-$instanceId}`,
46494      type: "text",
46495      ...restProps,
46496      value: value || '',
46497      onChange: onChangeHandler,
46498      onFocus: onFocusHandler,
46499      onBlur: onBlurHandler,
46500      size: size,
46501      className: dist_clsx(className, 'components-form-token-field__input'),
46502      autoComplete: "off",
46503      role: "combobox",
46504      "aria-expanded": isExpanded,
46505      "aria-autocomplete": "list",
46506      "aria-owns": isExpanded ? `components-form-token-suggestions-$instanceId}` : undefined,
46507      "aria-activedescendant":
46508      // Only add the `aria-activedescendant` attribute when:
46509      // - the user is actively interacting with the input (`hasFocus`)
46510      // - there is a selected suggestion (`selectedSuggestionIndex !== -1`)
46511      // - the list of suggestions are rendered in the DOM (`isExpanded`)
46512      hasFocus && selectedSuggestionIndex !== -1 && isExpanded ? `components-form-token-suggestions-$instanceId}-$selectedSuggestionIndex}` : undefined,
46513      "aria-describedby": `components-form-token-suggestions-howto-$instanceId}`
46514    });
46515  }
46516  const TokenInput = (0,external_wp_element_namespaceObject.forwardRef)(UnForwardedTokenInput);
46517  /* harmony default export */ const token_input = (TokenInput);
46518  
46519  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/form-token-field/suggestions-list.js
46520  /**
46521   * External dependencies
46522   */
46523  
46524  /**
46525   * WordPress dependencies
46526   */
46527  
46528  
46529  /**
46530   * Internal dependencies
46531   */
46532  
46533  
46534  const handleMouseDown = e => {
46535    // By preventing default here, we will not lose focus of <input> when clicking a suggestion.
46536    e.preventDefault();
46537  };
46538  function SuggestionsList({
46539    selectedIndex,
46540    scrollIntoView,
46541    match,
46542    onHover,
46543    onSelect,
46544    suggestions = [],
46545    displayTransform,
46546    instanceId,
46547    __experimentalRenderItem
46548  }) {
46549    const listRef = (0,external_wp_compose_namespaceObject.useRefEffect)(listNode => {
46550      // only have to worry about scrolling selected suggestion into view
46551      // when already expanded.
46552      let rafId;
46553      if (selectedIndex > -1 && scrollIntoView && listNode.children[selectedIndex]) {
46554        listNode.children[selectedIndex].scrollIntoView({
46555          behavior: 'instant',
46556          block: 'nearest',
46557          inline: 'nearest'
46558        });
46559      }
46560      return () => {
46561        if (rafId !== undefined) {
46562          cancelAnimationFrame(rafId);
46563        }
46564      };
46565    }, [selectedIndex, scrollIntoView]);
46566    const handleHover = suggestion => {
46567      return () => {
46568        onHover?.(suggestion);
46569      };
46570    };
46571    const handleClick = suggestion => {
46572      return () => {
46573        onSelect?.(suggestion);
46574      };
46575    };
46576    const computeSuggestionMatch = suggestion => {
46577      const matchText = displayTransform(match).toLocaleLowerCase();
46578      if (matchText.length === 0) {
46579        return null;
46580      }
46581      const transformedSuggestion = displayTransform(suggestion);
46582      const indexOfMatch = transformedSuggestion.toLocaleLowerCase().indexOf(matchText);
46583      return {
46584        suggestionBeforeMatch: transformedSuggestion.substring(0, indexOfMatch),
46585        suggestionMatch: transformedSuggestion.substring(indexOfMatch, indexOfMatch + matchText.length),
46586        suggestionAfterMatch: transformedSuggestion.substring(indexOfMatch + matchText.length)
46587      };
46588    };
46589    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("ul", {
46590      ref: listRef,
46591      className: "components-form-token-field__suggestions-list",
46592      id: `components-form-token-suggestions-$instanceId}`,
46593      role: "listbox",
46594      children: suggestions.map((suggestion, index) => {
46595        const matchText = computeSuggestionMatch(suggestion);
46596        const isSelected = index === selectedIndex;
46597        const isDisabled = typeof suggestion === 'object' && suggestion?.disabled;
46598        const key = typeof suggestion === 'object' && 'value' in suggestion ? suggestion?.value : displayTransform(suggestion);
46599        const className = dist_clsx('components-form-token-field__suggestion', {
46600          'is-selected': isSelected
46601        });
46602        let output;
46603        if (typeof __experimentalRenderItem === 'function') {
46604          output = __experimentalRenderItem({
46605            item: suggestion
46606          });
46607        } else if (matchText) {
46608          output = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("span", {
46609            "aria-label": displayTransform(suggestion),
46610            children: [matchText.suggestionBeforeMatch, /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("strong", {
46611              className: "components-form-token-field__suggestion-match",
46612              children: matchText.suggestionMatch
46613            }), matchText.suggestionAfterMatch]
46614          });
46615        } else {
46616          output = displayTransform(suggestion);
46617        }
46618  
46619        /* eslint-disable jsx-a11y/click-events-have-key-events */
46620        return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("li", {
46621          id: `components-form-token-suggestions-$instanceId}-$index}`,
46622          role: "option",
46623          className: className,
46624          onMouseDown: handleMouseDown,
46625          onClick: handleClick(suggestion),
46626          onMouseEnter: handleHover(suggestion),
46627          "aria-selected": index === selectedIndex,
46628          "aria-disabled": isDisabled,
46629          children: output
46630        }, key);
46631        /* eslint-enable jsx-a11y/click-events-have-key-events */
46632      })
46633    });
46634  }
46635  /* harmony default export */ const suggestions_list = (SuggestionsList);
46636  
46637  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/higher-order/with-focus-outside/index.js
46638  /**
46639   * WordPress dependencies
46640   */
46641  
46642  
46643  
46644  /* harmony default export */ const with_focus_outside = ((0,external_wp_compose_namespaceObject.createHigherOrderComponent)(WrappedComponent => props => {
46645    const [handleFocusOutside, setHandleFocusOutside] = (0,external_wp_element_namespaceObject.useState)(undefined);
46646    const bindFocusOutsideHandler = (0,external_wp_element_namespaceObject.useCallback)(node => setHandleFocusOutside(() => node?.handleFocusOutside ? node.handleFocusOutside.bind(node) : undefined), []);
46647    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", {
46648      ...(0,external_wp_compose_namespaceObject.__experimentalUseFocusOutside)(handleFocusOutside),
46649      children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(WrappedComponent, {
46650        ref: bindFocusOutsideHandler,
46651        ...props
46652      })
46653    });
46654  }, 'withFocusOutside'));
46655  
46656  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/combobox-control/index.js
46657  /**
46658   * External dependencies
46659   */
46660  
46661  
46662  /**
46663   * WordPress dependencies
46664   */
46665  
46666  
46667  
46668  
46669  
46670  
46671  /**
46672   * Internal dependencies
46673   */
46674  
46675  
46676  
46677  
46678  
46679  
46680  
46681  
46682  
46683  
46684  
46685  
46686  
46687  const combobox_control_noop = () => {};
46688  const DetectOutside = with_focus_outside(class extends external_wp_element_namespaceObject.Component {
46689    handleFocusOutside(event) {
46690      this.props.onFocusOutside(event);
46691    }
46692    render() {
46693      return this.props.children;
46694    }
46695  });
46696  const getIndexOfMatchingSuggestion = (selectedSuggestion, matchingSuggestions) => selectedSuggestion === null ? -1 : matchingSuggestions.indexOf(selectedSuggestion);
46697  
46698  /**
46699   * `ComboboxControl` is an enhanced version of a [`SelectControl`](../select-control/README.md) with the addition of
46700   * being able to search for options using a search input.
46701   *
46702   * ```jsx
46703   * import { ComboboxControl } from '@wordpress/components';
46704   * import { useState } from '@wordpress/element';
46705   *
46706   * const options = [
46707   *     {
46708   *         value: 'small',
46709   *         label: 'Small',
46710   *     },
46711   *     {
46712   *         value: 'normal',
46713   *         label: 'Normal',
46714   *         disabled: true,
46715   *     },
46716   *     {
46717   *         value: 'large',
46718   *         label: 'Large',
46719   *         disabled: false,
46720   *     },
46721   * ];
46722   *
46723   * function MyComboboxControl() {
46724   *     const [ fontSize, setFontSize ] = useState();
46725   *     const [ filteredOptions, setFilteredOptions ] = useState( options );
46726   *     return (
46727   *         <ComboboxControl
46728   *             __nextHasNoMarginBottom
46729   *             label="Font Size"
46730   *             value={ fontSize }
46731   *             onChange={ setFontSize }
46732   *             options={ filteredOptions }
46733   *             onFilterValueChange={ ( inputValue ) =>
46734   *                 setFilteredOptions(
46735   *                     options.filter( ( option ) =>
46736   *                         option.label
46737   *                             .toLowerCase()
46738   *                             .startsWith( inputValue.toLowerCase() )
46739   *                     )
46740   *                 )
46741   *             }
46742   *         />
46743   *     );
46744   * }
46745   * ```
46746   */
46747  function ComboboxControl(props) {
46748    var _currentOption$label;
46749    const {
46750      __nextHasNoMarginBottom = false,
46751      __next40pxDefaultSize = false,
46752      value: valueProp,
46753      label,
46754      options,
46755      onChange: onChangeProp,
46756      onFilterValueChange = combobox_control_noop,
46757      hideLabelFromVision,
46758      help,
46759      allowReset = true,
46760      className,
46761      messages = {
46762        selected: (0,external_wp_i18n_namespaceObject.__)('Item selected.')
46763      },
46764      __experimentalRenderItem,
46765      expandOnFocus = true,
46766      placeholder
46767    } = useDeprecated36pxDefaultSizeProp(props);
46768    const [value, setValue] = useControlledValue({
46769      value: valueProp,
46770      onChange: onChangeProp
46771    });
46772    const currentOption = options.find(option => option.value === value);
46773    const currentLabel = (_currentOption$label = currentOption?.label) !== null && _currentOption$label !== void 0 ? _currentOption$label : '';
46774    // Use a custom prefix when generating the `instanceId` to avoid having
46775    // duplicate input IDs when rendering this component and `FormTokenField`
46776    // in the same page (see https://github.com/WordPress/gutenberg/issues/42112).
46777    const instanceId = (0,external_wp_compose_namespaceObject.useInstanceId)(ComboboxControl, 'combobox-control');
46778    const [selectedSuggestion, setSelectedSuggestion] = (0,external_wp_element_namespaceObject.useState)(currentOption || null);
46779    const [isExpanded, setIsExpanded] = (0,external_wp_element_namespaceObject.useState)(false);
46780    const [inputHasFocus, setInputHasFocus] = (0,external_wp_element_namespaceObject.useState)(false);
46781    const [inputValue, setInputValue] = (0,external_wp_element_namespaceObject.useState)('');
46782    const inputContainer = (0,external_wp_element_namespaceObject.useRef)(null);
46783    const matchingSuggestions = (0,external_wp_element_namespaceObject.useMemo)(() => {
46784      const startsWithMatch = [];
46785      const containsMatch = [];
46786      const match = normalizeTextString(inputValue);
46787      options.forEach(option => {
46788        const index = normalizeTextString(option.label).indexOf(match);
46789        if (index === 0) {
46790          startsWithMatch.push(option);
46791        } else if (index > 0) {
46792          containsMatch.push(option);
46793        }
46794      });
46795      return startsWithMatch.concat(containsMatch);
46796    }, [inputValue, options]);
46797    const onSuggestionSelected = newSelectedSuggestion => {
46798      if (newSelectedSuggestion.disabled) {
46799        return;
46800      }
46801      setValue(newSelectedSuggestion.value);
46802      (0,external_wp_a11y_namespaceObject.speak)(messages.selected, 'assertive');
46803      setSelectedSuggestion(newSelectedSuggestion);
46804      setInputValue('');
46805      setIsExpanded(false);
46806    };
46807    const handleArrowNavigation = (offset = 1) => {
46808      const index = getIndexOfMatchingSuggestion(selectedSuggestion, matchingSuggestions);
46809      let nextIndex = index + offset;
46810      if (nextIndex < 0) {
46811        nextIndex = matchingSuggestions.length - 1;
46812      } else if (nextIndex >= matchingSuggestions.length) {
46813        nextIndex = 0;
46814      }
46815      setSelectedSuggestion(matchingSuggestions[nextIndex]);
46816      setIsExpanded(true);
46817    };
46818    const onKeyDown = withIgnoreIMEEvents(event => {
46819      let preventDefault = false;
46820      if (event.defaultPrevented) {
46821        return;
46822      }
46823      switch (event.code) {
46824        case 'Enter':
46825          if (selectedSuggestion) {
46826            onSuggestionSelected(selectedSuggestion);
46827            preventDefault = true;
46828          }
46829          break;
46830        case 'ArrowUp':
46831          handleArrowNavigation(-1);
46832          preventDefault = true;
46833          break;
46834        case 'ArrowDown':
46835          handleArrowNavigation(1);
46836          preventDefault = true;
46837          break;
46838        case 'Escape':
46839          setIsExpanded(false);
46840          setSelectedSuggestion(null);
46841          preventDefault = true;
46842          break;
46843        default:
46844          break;
46845      }
46846      if (preventDefault) {
46847        event.preventDefault();
46848      }
46849    });
46850    const onBlur = () => {
46851      setInputHasFocus(false);
46852    };
46853    const onFocus = () => {
46854      setInputHasFocus(true);
46855      if (expandOnFocus) {
46856        setIsExpanded(true);
46857      }
46858      onFilterValueChange('');
46859      setInputValue('');
46860    };
46861    const onClick = () => {
46862      setIsExpanded(true);
46863    };
46864    const onFocusOutside = () => {
46865      setIsExpanded(false);
46866    };
46867    const onInputChange = event => {
46868      const text = event.value;
46869      setInputValue(text);
46870      onFilterValueChange(text);
46871      if (inputHasFocus) {
46872        setIsExpanded(true);
46873      }
46874    };
46875    const handleOnReset = () => {
46876      setValue(null);
46877      inputContainer.current?.focus();
46878    };
46879  
46880    // Stop propagation of the keydown event when pressing Enter on the Reset
46881    // button to prevent calling the onKeydown callback on the container div
46882    // element which actually sets the selected suggestion.
46883    const handleResetStopPropagation = event => {
46884      event.stopPropagation();
46885    };
46886  
46887    // Update current selections when the filter input changes.
46888    (0,external_wp_element_namespaceObject.useEffect)(() => {
46889      const hasMatchingSuggestions = matchingSuggestions.length > 0;
46890      const hasSelectedMatchingSuggestions = getIndexOfMatchingSuggestion(selectedSuggestion, matchingSuggestions) > 0;
46891      if (hasMatchingSuggestions && !hasSelectedMatchingSuggestions) {
46892        // If the current selection isn't present in the list of suggestions, then automatically select the first item from the list of suggestions.
46893        setSelectedSuggestion(matchingSuggestions[0]);
46894      }
46895    }, [matchingSuggestions, selectedSuggestion]);
46896  
46897    // Announcements.
46898    (0,external_wp_element_namespaceObject.useEffect)(() => {
46899      const hasMatchingSuggestions = matchingSuggestions.length > 0;
46900      if (isExpanded) {
46901        const message = hasMatchingSuggestions ? (0,external_wp_i18n_namespaceObject.sprintf)( /* translators: %d: number of results. */
46902        (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.', matchingSuggestions.length), matchingSuggestions.length) : (0,external_wp_i18n_namespaceObject.__)('No results.');
46903        (0,external_wp_a11y_namespaceObject.speak)(message, 'polite');
46904      }
46905    }, [matchingSuggestions, isExpanded]);
46906  
46907    // Disable reason: There is no appropriate role which describes the
46908    // input container intended accessible usability.
46909    // TODO: Refactor click detection to use blur to stop propagation.
46910    /* eslint-disable jsx-a11y/no-static-element-interactions */
46911    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(DetectOutside, {
46912      onFocusOutside: onFocusOutside,
46913      children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(base_control, {
46914        __nextHasNoMarginBottom: __nextHasNoMarginBottom,
46915        __associatedWPComponentName: "ComboboxControl",
46916        className: dist_clsx(className, 'components-combobox-control'),
46917        label: label,
46918        id: `components-form-token-input-$instanceId}`,
46919        hideLabelFromVision: hideLabelFromVision,
46920        help: help,
46921        children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", {
46922          className: "components-combobox-control__suggestions-container",
46923          tabIndex: -1,
46924          onKeyDown: onKeyDown,
46925          children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(InputWrapperFlex, {
46926            __next40pxDefaultSize: __next40pxDefaultSize,
46927            children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(flex_block_component, {
46928              children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(token_input, {
46929                className: "components-combobox-control__input",
46930                instanceId: instanceId,
46931                ref: inputContainer,
46932                placeholder: placeholder,
46933                value: isExpanded ? inputValue : currentLabel,
46934                onFocus: onFocus,
46935                onBlur: onBlur,
46936                onClick: onClick,
46937                isExpanded: isExpanded,
46938                selectedSuggestionIndex: getIndexOfMatchingSuggestion(selectedSuggestion, matchingSuggestions),
46939                onChange: onInputChange
46940              })
46941            }), allowReset && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(flex_item_component, {
46942              children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, {
46943                className: "components-combobox-control__reset",
46944                icon: close_small
46945                // Disable reason: Focus returns to input field when reset is clicked.
46946                // eslint-disable-next-line no-restricted-syntax
46947                ,
46948                disabled: !value,
46949                onClick: handleOnReset,
46950                onKeyDown: handleResetStopPropagation,
46951                label: (0,external_wp_i18n_namespaceObject.__)('Reset')
46952              })
46953            })]
46954          }), isExpanded && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(suggestions_list, {
46955            instanceId: instanceId
46956            // The empty string for `value` here is not actually used, but is
46957            // just a quick way to satisfy the TypeScript requirements of SuggestionsList.
46958            // See: https://github.com/WordPress/gutenberg/pull/47581/files#r1091089330
46959            ,
46960            match: {
46961              label: inputValue,
46962              value: ''
46963            },
46964            displayTransform: suggestion => suggestion.label,
46965            suggestions: matchingSuggestions,
46966            selectedIndex: getIndexOfMatchingSuggestion(selectedSuggestion, matchingSuggestions),
46967            onHover: setSelectedSuggestion,
46968            onSelect: onSuggestionSelected,
46969            scrollIntoView: true,
46970            __experimentalRenderItem: __experimentalRenderItem
46971          })]
46972        })
46973      })
46974    });
46975    /* eslint-enable jsx-a11y/no-static-element-interactions */
46976  }
46977  /* harmony default export */ const combobox_control = (ComboboxControl);
46978  
46979  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/composite/legacy/index.js
46980  /**
46981   * Composite is a component that may contain navigable items represented by
46982   * CompositeItem. It's inspired by the WAI-ARIA Composite Role and implements
46983   * all the keyboard navigation mechanisms to ensure that there's only one
46984   * tab stop for the whole Composite element. This means that it can behave as
46985   * a roving tabindex or aria-activedescendant container.
46986   *
46987   * This file aims at providing components that are as close as possible to the
46988   * original `reakit`-based implementation (which was removed from the codebase),
46989   * although it is recommended that consumers of the package switch to the stable,
46990   * un-prefixed, `ariakit`-based version of `Composite`.
46991   *
46992   * @see https://ariakit.org/components/composite
46993   */
46994  
46995  /**
46996   * External dependencies
46997   */
46998  
46999  
47000  /**
47001   * WordPress dependencies
47002   */
47003  
47004  
47005  
47006  
47007  /**
47008   * Internal dependencies
47009   */
47010  
47011  
47012  // Legacy composite components can either provide state through a
47013  // single `state` prop, or via individual props, usually through
47014  // spreading the state generated by `useCompositeState`.
47015  // That is, `<Composite* { ...state }>`.
47016  
47017  function mapLegacyStatePropsToComponentProps(legacyProps) {
47018    // If a `state` prop is provided, we unpack that; otherwise,
47019    // the necessary props are provided directly in `legacyProps`.
47020    if (legacyProps.state) {
47021      const {
47022        state,
47023        ...rest
47024      } = legacyProps;
47025      const {
47026        store,
47027        ...props
47028      } = mapLegacyStatePropsToComponentProps(state);
47029      return {
47030        ...rest,
47031        ...props,
47032        store
47033      };
47034    }
47035    return legacyProps;
47036  }
47037  const LEGACY_TO_NEW_DISPLAY_NAME = {
47038    __unstableComposite: 'Composite',
47039    __unstableCompositeGroup: 'Composite.Group or Composite.Row',
47040    __unstableCompositeItem: 'Composite.Item',
47041    __unstableUseCompositeState: 'Composite'
47042  };
47043  function proxyComposite(ProxiedComponent, propMap = {}) {
47044    var _ProxiedComponent$dis;
47045    const displayName = (_ProxiedComponent$dis = ProxiedComponent.displayName) !== null && _ProxiedComponent$dis !== void 0 ? _ProxiedComponent$dis : '';
47046    const Component = legacyProps => {
47047      external_wp_deprecated_default()(`wp.components.$displayName}`, {
47048        since: '6.7',
47049        alternative: LEGACY_TO_NEW_DISPLAY_NAME.hasOwnProperty(displayName) ? LEGACY_TO_NEW_DISPLAY_NAME[displayName] : undefined
47050      });
47051      const {
47052        store,
47053        ...rest
47054      } = mapLegacyStatePropsToComponentProps(legacyProps);
47055      const props = rest;
47056      props.id = (0,external_wp_compose_namespaceObject.useInstanceId)(store, props.baseId, props.id);
47057      Object.entries(propMap).forEach(([from, to]) => {
47058        if (props.hasOwnProperty(from)) {
47059          Object.assign(props, {
47060            [to]: props[from]
47061          });
47062          delete props[from];
47063        }
47064      });
47065      delete props.baseId;
47066      return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ProxiedComponent, {
47067        ...props,
47068        store: store
47069      });
47070    };
47071    Component.displayName = displayName;
47072    return Component;
47073  }
47074  
47075  // The old `CompositeGroup` used to behave more like the current
47076  // `CompositeRow`, but this has been split into two different
47077  // components. We handle that difference by checking on the
47078  // provided role, and returning the appropriate component.
47079  const UnproxiedCompositeGroup = (0,external_wp_element_namespaceObject.forwardRef)(({
47080    role,
47081    ...props
47082  }, ref) => {
47083    const Component = role === 'row' ? Composite.Row : Composite.Group;
47084    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Component, {
47085      ref: ref,
47086      role: role,
47087      ...props
47088    });
47089  });
47090  
47091  /**
47092   * _Note: please use the `Composite` component instead._
47093   *
47094   * @deprecated
47095   */
47096  const legacy_Composite = proxyComposite(Object.assign(Composite, {
47097    displayName: '__unstableComposite'
47098  }), {
47099    baseId: 'id'
47100  });
47101  /**
47102   * _Note: please use the `Composite.Row` or `Composite.Group` components instead._
47103   *
47104   * @deprecated
47105   */
47106  const legacy_CompositeGroup = proxyComposite(Object.assign(UnproxiedCompositeGroup, {
47107    displayName: '__unstableCompositeGroup'
47108  }));
47109  /**
47110   * _Note: please use the `Composite.Item` component instead._
47111   *
47112   * @deprecated
47113   */
47114  const legacy_CompositeItem = proxyComposite(Object.assign(Composite.Item, {
47115    displayName: '__unstableCompositeItem'
47116  }), {
47117    focusable: 'accessibleWhenDisabled'
47118  });
47119  
47120  /**
47121   * _Note: please use the `Composite` component instead._
47122   *
47123   * @deprecated
47124   */
47125  function useCompositeState(legacyStateOptions = {}) {
47126    external_wp_deprecated_default()(`wp.components.__unstableUseCompositeState`, {
47127      since: '6.7',
47128      alternative: LEGACY_TO_NEW_DISPLAY_NAME.__unstableUseCompositeState
47129    });
47130    const {
47131      baseId,
47132      currentId: defaultActiveId,
47133      orientation,
47134      rtl = false,
47135      loop: focusLoop = false,
47136      wrap: focusWrap = false,
47137      shift: focusShift = false,
47138      // eslint-disable-next-line camelcase
47139      unstable_virtual: virtualFocus
47140    } = legacyStateOptions;
47141    return {
47142      baseId: (0,external_wp_compose_namespaceObject.useInstanceId)(legacy_Composite, 'composite', baseId),
47143      store: useCompositeStore({
47144        defaultActiveId,
47145        rtl,
47146        orientation,
47147        focusLoop,
47148        focusShift,
47149        focusWrap,
47150        virtualFocus
47151      })
47152    };
47153  }
47154  
47155  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/modal/aria-helper.js
47156  const LIVE_REGION_ARIA_ROLES = new Set(['alert', 'status', 'log', 'marquee', 'timer']);
47157  const hiddenElementsByDepth = [];
47158  
47159  /**
47160   * Hides all elements in the body element from screen-readers except
47161   * the provided element and elements that should not be hidden from
47162   * screen-readers.
47163   *
47164   * The reason we do this is because `aria-modal="true"` currently is bugged
47165   * in Safari, and support is spotty in other browsers overall. In the future
47166   * we should consider removing these helper functions in favor of
47167   * `aria-modal="true"`.
47168   *
47169   * @param modalElement The element that should not be hidden.
47170   */
47171  function modalize(modalElement) {
47172    const elements = Array.from(document.body.children);
47173    const hiddenElements = [];
47174    hiddenElementsByDepth.push(hiddenElements);
47175    for (const element of elements) {
47176      if (element === modalElement) {
47177        continue;
47178      }
47179      if (elementShouldBeHidden(element)) {
47180        element.setAttribute('aria-hidden', 'true');
47181        hiddenElements.push(element);
47182      }
47183    }
47184  }
47185  
47186  /**
47187   * Determines if the passed element should not be hidden from screen readers.
47188   *
47189   * @param element The element that should be checked.
47190   *
47191   * @return Whether the element should not be hidden from screen-readers.
47192   */
47193  function elementShouldBeHidden(element) {
47194    const role = element.getAttribute('role');
47195    return !(element.tagName === 'SCRIPT' || element.hasAttribute('aria-hidden') || element.hasAttribute('aria-live') || role && LIVE_REGION_ARIA_ROLES.has(role));
47196  }
47197  
47198  /**
47199   * Accessibly reveals the elements hidden by the latest modal.
47200   */
47201  function unmodalize() {
47202    const hiddenElements = hiddenElementsByDepth.pop();
47203    if (!hiddenElements) {
47204      return;
47205    }
47206    for (const element of hiddenElements) {
47207      element.removeAttribute('aria-hidden');
47208    }
47209  }
47210  
47211  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/modal/use-modal-exit-animation.js
47212  /**
47213   * WordPress dependencies
47214   */
47215  
47216  
47217  
47218  /**
47219   * Internal dependencies
47220   */
47221  
47222  
47223  
47224  // Animation duration (ms) extracted to JS in order to be used on a setTimeout.
47225  const FRAME_ANIMATION_DURATION = config_values.transitionDuration;
47226  const FRAME_ANIMATION_DURATION_NUMBER = Number.parseInt(config_values.transitionDuration);
47227  const EXIT_ANIMATION_NAME = 'components-modal__disappear-animation';
47228  function useModalExitAnimation() {
47229    const frameRef = (0,external_wp_element_namespaceObject.useRef)();
47230    const [isAnimatingOut, setIsAnimatingOut] = (0,external_wp_element_namespaceObject.useState)(false);
47231    const isReducedMotion = (0,external_wp_compose_namespaceObject.useReducedMotion)();
47232    const closeModal = (0,external_wp_element_namespaceObject.useCallback)(() => new Promise(closeModalResolve => {
47233      // Grab a "stable" reference of the frame element, since
47234      // the value held by the react ref might change at runtime.
47235      const frameEl = frameRef.current;
47236      if (isReducedMotion) {
47237        closeModalResolve();
47238        return;
47239      }
47240      if (!frameEl) {
47241         true ? external_wp_warning_default()("wp.components.Modal: the Modal component can't be closed with an exit animation because of a missing reference to the modal frame element.") : 0;
47242        closeModalResolve();
47243        return;
47244      }
47245      let handleAnimationEnd;
47246      const startAnimation = () => new Promise(animationResolve => {
47247        handleAnimationEnd = e => {
47248          if (e.animationName === EXIT_ANIMATION_NAME) {
47249            animationResolve();
47250          }
47251        };
47252        frameEl.addEventListener('animationend', handleAnimationEnd);
47253        setIsAnimatingOut(true);
47254      });
47255      const animationTimeout = () => new Promise(timeoutResolve => {
47256        setTimeout(() => timeoutResolve(),
47257        // Allow an extra 20% of the animation duration for the
47258        // animationend event to fire, in case the animation frame is
47259        // slightly delayes by some other events in the event loop.
47260        FRAME_ANIMATION_DURATION_NUMBER * 1.2);
47261      });
47262      Promise.race([startAnimation(), animationTimeout()]).then(() => {
47263        if (handleAnimationEnd) {
47264          frameEl.removeEventListener('animationend', handleAnimationEnd);
47265        }
47266        setIsAnimatingOut(false);
47267        closeModalResolve();
47268      });
47269    }), [isReducedMotion]);
47270    return {
47271      overlayClassname: isAnimatingOut ? 'is-animating-out' : undefined,
47272      frameRef,
47273      frameStyle: {
47274        '--modal-frame-animation-duration': `$FRAME_ANIMATION_DURATION}`
47275      },
47276      closeModal
47277    };
47278  }
47279  
47280  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/modal/index.js
47281  /**
47282   * External dependencies
47283   */
47284  
47285  
47286  /**
47287   * WordPress dependencies
47288   */
47289  
47290  
47291  
47292  
47293  
47294  
47295  /**
47296   * Internal dependencies
47297   */
47298  
47299  
47300  
47301  
47302  
47303  
47304  
47305  // Used to track and dismiss the prior modal when another opens unless nested.
47306  
47307  
47308  
47309  const ModalContext = (0,external_wp_element_namespaceObject.createContext)(new Set());
47310  
47311  // Used to track body class names applied while modals are open.
47312  const bodyOpenClasses = new Map();
47313  function UnforwardedModal(props, forwardedRef) {
47314    const {
47315      bodyOpenClassName = 'modal-open',
47316      role = 'dialog',
47317      title = null,
47318      focusOnMount = true,
47319      shouldCloseOnEsc = true,
47320      shouldCloseOnClickOutside = true,
47321      isDismissible = true,
47322      /* Accessibility. */
47323      aria = {
47324        labelledby: undefined,
47325        describedby: undefined
47326      },
47327      onRequestClose,
47328      icon,
47329      closeButtonLabel,
47330      children,
47331      style,
47332      overlayClassName: overlayClassnameProp,
47333      className,
47334      contentLabel,
47335      onKeyDown,
47336      isFullScreen = false,
47337      size,
47338      headerActions = null,
47339      __experimentalHideHeader = false
47340    } = props;
47341    const ref = (0,external_wp_element_namespaceObject.useRef)();
47342    const instanceId = (0,external_wp_compose_namespaceObject.useInstanceId)(Modal);
47343    const headingId = title ? `components-modal-header-$instanceId}` : aria.labelledby;
47344  
47345    // The focus hook does not support 'firstContentElement' but this is a valid
47346    // value for the Modal's focusOnMount prop. The following code ensures the focus
47347    // hook will focus the first focusable node within the element to which it is applied.
47348    // When `firstContentElement` is passed as the value of the focusOnMount prop,
47349    // the focus hook is applied to the Modal's content element.
47350    // Otherwise, the focus hook is applied to the Modal's ref. This ensures that the
47351    // focus hook will focus the first element in the Modal's **content** when
47352    // `firstContentElement` is passed.
47353    const focusOnMountRef = (0,external_wp_compose_namespaceObject.useFocusOnMount)(focusOnMount === 'firstContentElement' ? 'firstElement' : focusOnMount);
47354    const constrainedTabbingRef = (0,external_wp_compose_namespaceObject.useConstrainedTabbing)();
47355    const focusReturnRef = (0,external_wp_compose_namespaceObject.useFocusReturn)();
47356    const contentRef = (0,external_wp_element_namespaceObject.useRef)(null);
47357    const childrenContainerRef = (0,external_wp_element_namespaceObject.useRef)(null);
47358    const [hasScrolledContent, setHasScrolledContent] = (0,external_wp_element_namespaceObject.useState)(false);
47359    const [hasScrollableContent, setHasScrollableContent] = (0,external_wp_element_namespaceObject.useState)(false);
47360    let sizeClass;
47361    if (isFullScreen || size === 'fill') {
47362      sizeClass = 'is-full-screen';
47363    } else if (size) {
47364      sizeClass = `has-size-$size}`;
47365    }
47366  
47367    // Determines whether the Modal content is scrollable and updates the state.
47368    const isContentScrollable = (0,external_wp_element_namespaceObject.useCallback)(() => {
47369      if (!contentRef.current) {
47370        return;
47371      }
47372      const closestScrollContainer = (0,external_wp_dom_namespaceObject.getScrollContainer)(contentRef.current);
47373      if (contentRef.current === closestScrollContainer) {
47374        setHasScrollableContent(true);
47375      } else {
47376        setHasScrollableContent(false);
47377      }
47378    }, [contentRef]);
47379  
47380    // Accessibly isolates/unisolates the modal.
47381    (0,external_wp_element_namespaceObject.useEffect)(() => {
47382      modalize(ref.current);
47383      return () => unmodalize();
47384    }, []);
47385  
47386    // Keeps a fresh ref for the subsequent effect.
47387    const onRequestCloseRef = (0,external_wp_element_namespaceObject.useRef)();
47388    (0,external_wp_element_namespaceObject.useEffect)(() => {
47389      onRequestCloseRef.current = onRequestClose;
47390    }, [onRequestClose]);
47391  
47392    // The list of `onRequestClose` callbacks of open (non-nested) Modals. Only
47393    // one should remain open at a time and the list enables closing prior ones.
47394    const dismissers = (0,external_wp_element_namespaceObject.useContext)(ModalContext);
47395    // Used for the tracking and dismissing any nested modals.
47396    const [nestedDismissers] = (0,external_wp_element_namespaceObject.useState)(() => new Set());
47397  
47398    // Updates the stack tracking open modals at this level and calls
47399    // onRequestClose for any prior and/or nested modals as applicable.
47400    (0,external_wp_element_namespaceObject.useEffect)(() => {
47401      // add this modal instance to the dismissers set
47402      dismissers.add(onRequestCloseRef);
47403      // request that all the other modals close themselves
47404      for (const dismisser of dismissers) {
47405        if (dismisser !== onRequestCloseRef) {
47406          dismisser.current?.();
47407        }
47408      }
47409      return () => {
47410        // request that all the nested modals close themselves
47411        for (const dismisser of nestedDismissers) {
47412          dismisser.current?.();
47413        }
47414        // remove this modal instance from the dismissers set
47415        dismissers.delete(onRequestCloseRef);
47416      };
47417    }, [dismissers, nestedDismissers]);
47418  
47419    // Adds/removes the value of bodyOpenClassName to body element.
47420    (0,external_wp_element_namespaceObject.useEffect)(() => {
47421      var _bodyOpenClasses$get;
47422      const theClass = bodyOpenClassName;
47423      const oneMore = 1 + ((_bodyOpenClasses$get = bodyOpenClasses.get(theClass)) !== null && _bodyOpenClasses$get !== void 0 ? _bodyOpenClasses$get : 0);
47424      bodyOpenClasses.set(theClass, oneMore);
47425      document.body.classList.add(bodyOpenClassName);
47426      return () => {
47427        const oneLess = bodyOpenClasses.get(theClass) - 1;
47428        if (oneLess === 0) {
47429          document.body.classList.remove(theClass);
47430          bodyOpenClasses.delete(theClass);
47431        } else {
47432          bodyOpenClasses.set(theClass, oneLess);
47433        }
47434      };
47435    }, [bodyOpenClassName]);
47436    const {
47437      closeModal,
47438      frameRef,
47439      frameStyle,
47440      overlayClassname
47441    } = useModalExitAnimation();
47442  
47443    // Calls the isContentScrollable callback when the Modal children container resizes.
47444    (0,external_wp_element_namespaceObject.useLayoutEffect)(() => {
47445      if (!window.ResizeObserver || !childrenContainerRef.current) {
47446        return;
47447      }
47448      const resizeObserver = new ResizeObserver(isContentScrollable);
47449      resizeObserver.observe(childrenContainerRef.current);
47450      isContentScrollable();
47451      return () => {
47452        resizeObserver.disconnect();
47453      };
47454    }, [isContentScrollable, childrenContainerRef]);
47455    function handleEscapeKeyDown(event) {
47456      if (shouldCloseOnEsc && (event.code === 'Escape' || event.key === 'Escape') && !event.defaultPrevented) {
47457        event.preventDefault();
47458        closeModal().then(() => onRequestClose(event));
47459      }
47460    }
47461    const onContentContainerScroll = (0,external_wp_element_namespaceObject.useCallback)(e => {
47462      var _e$currentTarget$scro;
47463      const scrollY = (_e$currentTarget$scro = e?.currentTarget?.scrollTop) !== null && _e$currentTarget$scro !== void 0 ? _e$currentTarget$scro : -1;
47464      if (!hasScrolledContent && scrollY > 0) {
47465        setHasScrolledContent(true);
47466      } else if (hasScrolledContent && scrollY <= 0) {
47467        setHasScrolledContent(false);
47468      }
47469    }, [hasScrolledContent]);
47470    let pressTarget = null;
47471    const overlayPressHandlers = {
47472      onPointerDown: event => {
47473        if (event.target === event.currentTarget) {
47474          pressTarget = event.target;
47475          // Avoids focus changing so that focus return works as expected.
47476          event.preventDefault();
47477        }
47478      },
47479      // Closes the modal with two exceptions. 1. Opening the context menu on
47480      // the overlay. 2. Pressing on the overlay then dragging the pointer
47481      // over the modal and releasing. Due to the modal being a child of the
47482      // overlay, such a gesture is a `click` on the overlay and cannot be
47483      // excepted by a `click` handler. Thus the tactic of handling
47484      // `pointerup` and comparing its target to that of the `pointerdown`.
47485      onPointerUp: ({
47486        target,
47487        button
47488      }) => {
47489        const isSameTarget = target === pressTarget;
47490        pressTarget = null;
47491        if (button === 0 && isSameTarget) {
47492          closeModal().then(() => onRequestClose());
47493        }
47494      }
47495    };
47496    const modal =
47497    /*#__PURE__*/
47498    // eslint-disable-next-line jsx-a11y/no-static-element-interactions
47499    (0,external_ReactJSXRuntime_namespaceObject.jsx)("div", {
47500      ref: (0,external_wp_compose_namespaceObject.useMergeRefs)([ref, forwardedRef]),
47501      className: dist_clsx('components-modal__screen-overlay', overlayClassname, overlayClassnameProp),
47502      onKeyDown: withIgnoreIMEEvents(handleEscapeKeyDown),
47503      ...(shouldCloseOnClickOutside ? overlayPressHandlers : {}),
47504      children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(style_provider, {
47505        document: document,
47506        children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", {
47507          className: dist_clsx('components-modal__frame', sizeClass, className),
47508          style: {
47509            ...frameStyle,
47510            ...style
47511          },
47512          ref: (0,external_wp_compose_namespaceObject.useMergeRefs)([frameRef, constrainedTabbingRef, focusReturnRef, focusOnMount !== 'firstContentElement' ? focusOnMountRef : null]),
47513          role: role,
47514          "aria-label": contentLabel,
47515          "aria-labelledby": contentLabel ? undefined : headingId,
47516          "aria-describedby": aria.describedby,
47517          tabIndex: -1,
47518          onKeyDown: onKeyDown,
47519          children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", {
47520            className: dist_clsx('components-modal__content', {
47521              'hide-header': __experimentalHideHeader,
47522              'is-scrollable': hasScrollableContent,
47523              'has-scrolled-content': hasScrolledContent
47524            }),
47525            role: "document",
47526            onScroll: onContentContainerScroll,
47527            ref: contentRef,
47528            "aria-label": hasScrollableContent ? (0,external_wp_i18n_namespaceObject.__)('Scrollable section') : undefined,
47529            tabIndex: hasScrollableContent ? 0 : undefined,
47530            children: [!__experimentalHideHeader && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", {
47531              className: "components-modal__header",
47532              children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", {
47533                className: "components-modal__header-heading-container",
47534                children: [icon && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", {
47535                  className: "components-modal__icon-container",
47536                  "aria-hidden": true,
47537                  children: icon
47538                }), title && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("h1", {
47539                  id: headingId,
47540                  className: "components-modal__header-heading",
47541                  children: title
47542                })]
47543              }), headerActions, isDismissible && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, {
47544                children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(spacer_component, {
47545                  marginBottom: 0,
47546                  marginLeft: 3
47547                }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, {
47548                  size: "small",
47549                  onClick: event => closeModal().then(() => onRequestClose(event)),
47550                  icon: library_close,
47551                  label: closeButtonLabel || (0,external_wp_i18n_namespaceObject.__)('Close')
47552                })]
47553              })]
47554            }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", {
47555              ref: (0,external_wp_compose_namespaceObject.useMergeRefs)([childrenContainerRef, focusOnMount === 'firstContentElement' ? focusOnMountRef : null]),
47556              children: children
47557            })]
47558          })
47559        })
47560      })
47561    });
47562    return (0,external_wp_element_namespaceObject.createPortal)( /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ModalContext.Provider, {
47563      value: nestedDismissers,
47564      children: modal
47565    }), document.body);
47566  }
47567  
47568  /**
47569   * Modals give users information and choices related to a task they’re trying to
47570   * accomplish. They can contain critical information, require decisions, or
47571   * involve multiple tasks.
47572   *
47573   * ```jsx
47574   * import { Button, Modal } from '@wordpress/components';
47575   * import { useState } from '@wordpress/element';
47576   *
47577   * const MyModal = () => {
47578   *   const [ isOpen, setOpen ] = useState( false );
47579   *   const openModal = () => setOpen( true );
47580   *   const closeModal = () => setOpen( false );
47581   *
47582   *   return (
47583   *     <>
47584   *       <Button variant="secondary" onClick={ openModal }>
47585   *         Open Modal
47586   *       </Button>
47587   *       { isOpen && (
47588   *         <Modal title="This is my modal" onRequestClose={ closeModal }>
47589   *           <Button variant="secondary" onClick={ closeModal }>
47590   *             My custom close button
47591   *           </Button>
47592   *         </Modal>
47593   *       ) }
47594   *     </>
47595   *   );
47596   * };
47597   * ```
47598   */
47599  const Modal = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedModal);
47600  /* harmony default export */ const modal = (Modal);
47601  
47602  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/confirm-dialog/styles.js
47603  function confirm_dialog_styles_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)."; }
47604  /**
47605   * External dependencies
47606   */
47607  
47608  
47609  /**
47610   * The z-index for ConfirmDialog is being set here instead of in
47611   * packages/base-styles/_z-index.scss, because this component uses
47612   * emotion instead of sass.
47613   *
47614   * ConfirmDialog needs this higher z-index to ensure it renders on top of
47615   * any parent Popover component.
47616   */
47617  const styles_wrapper =  true ? {
47618    name: "7g5ii0",
47619    styles: "&&{z-index:1000001;}"
47620  } : 0;
47621  
47622  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/confirm-dialog/component.js
47623  /**
47624   * WordPress dependencies
47625   */
47626  
47627  
47628  
47629  /**
47630   * Internal dependencies
47631   */
47632  
47633  
47634  
47635  
47636  
47637  
47638  
47639  
47640  
47641  
47642  
47643  const UnconnectedConfirmDialog = (props, forwardedRef) => {
47644    const {
47645      isOpen: isOpenProp,
47646      onConfirm,
47647      onCancel,
47648      children,
47649      confirmButtonText,
47650      cancelButtonText,
47651      ...otherProps
47652    } = useContextSystem(props, 'ConfirmDialog');
47653    const cx = useCx();
47654    const wrapperClassName = cx(styles_wrapper);
47655    const cancelButtonRef = (0,external_wp_element_namespaceObject.useRef)();
47656    const confirmButtonRef = (0,external_wp_element_namespaceObject.useRef)();
47657    const [isOpen, setIsOpen] = (0,external_wp_element_namespaceObject.useState)();
47658    const [shouldSelfClose, setShouldSelfClose] = (0,external_wp_element_namespaceObject.useState)();
47659    (0,external_wp_element_namespaceObject.useEffect)(() => {
47660      // We only allow the dialog to close itself if `isOpenProp` is *not* set.
47661      // If `isOpenProp` is set, then it (probably) means it's controlled by a
47662      // parent component. In that case, `shouldSelfClose` might do more harm than
47663      // good, so we disable it.
47664      const isIsOpenSet = typeof isOpenProp !== 'undefined';
47665      setIsOpen(isIsOpenSet ? isOpenProp : true);
47666      setShouldSelfClose(!isIsOpenSet);
47667    }, [isOpenProp]);
47668    const handleEvent = (0,external_wp_element_namespaceObject.useCallback)(callback => event => {
47669      callback?.(event);
47670      if (shouldSelfClose) {
47671        setIsOpen(false);
47672      }
47673    }, [shouldSelfClose, setIsOpen]);
47674    const handleEnter = (0,external_wp_element_namespaceObject.useCallback)(event => {
47675      // Avoid triggering the 'confirm' action when a button is focused,
47676      // as this can cause a double submission.
47677      const isConfirmOrCancelButton = event.target === cancelButtonRef.current || event.target === confirmButtonRef.current;
47678      if (!isConfirmOrCancelButton && event.key === 'Enter') {
47679        handleEvent(onConfirm)(event);
47680      }
47681    }, [handleEvent, onConfirm]);
47682    const cancelLabel = cancelButtonText !== null && cancelButtonText !== void 0 ? cancelButtonText : (0,external_wp_i18n_namespaceObject.__)('Cancel');
47683    const confirmLabel = confirmButtonText !== null && confirmButtonText !== void 0 ? confirmButtonText : (0,external_wp_i18n_namespaceObject.__)('OK');
47684    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_ReactJSXRuntime_namespaceObject.Fragment, {
47685      children: isOpen && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(modal, {
47686        onRequestClose: handleEvent(onCancel),
47687        onKeyDown: handleEnter,
47688        closeButtonLabel: cancelLabel,
47689        isDismissible: true,
47690        ref: forwardedRef,
47691        overlayClassName: wrapperClassName,
47692        __experimentalHideHeader: true,
47693        ...otherProps,
47694        children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(v_stack_component, {
47695          spacing: 8,
47696          children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(text_component, {
47697            children: children
47698          }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(flex_component, {
47699            direction: "row",
47700            justify: "flex-end",
47701            children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, {
47702              __next40pxDefaultSize: true,
47703              ref: cancelButtonRef,
47704              variant: "tertiary",
47705              onClick: handleEvent(onCancel),
47706              children: cancelLabel
47707            }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, {
47708              __next40pxDefaultSize: true,
47709              ref: confirmButtonRef,
47710              variant: "primary",
47711              onClick: handleEvent(onConfirm),
47712              children: confirmLabel
47713            })]
47714          })]
47715        })
47716      })
47717    });
47718  };
47719  
47720  /**
47721   * `ConfirmDialog` is built of top of [`Modal`](/packages/components/src/modal/README.md)
47722   * and displays a confirmation dialog, with _confirm_ and _cancel_ buttons.
47723   * The dialog is confirmed by clicking the _confirm_ button or by pressing the `Enter` key.
47724   * It is cancelled (closed) by clicking the _cancel_ button, by pressing the `ESC` key, or by
47725   * clicking outside the dialog focus (i.e, the overlay).
47726   *
47727   * `ConfirmDialog` has two main implicit modes: controlled and uncontrolled.
47728   *
47729   * UnControlled:
47730   *
47731   * Allows the component to be used standalone, just by declaring it as part of another React's component render method:
47732   * -   It will be automatically open (displayed) upon mounting;
47733   * -   It will be automatically closed when clicking the _cancel_ button, by pressing the `ESC` key, or by clicking outside the dialog focus (i.e, the overlay);
47734   * -   `onCancel` is not mandatory but can be passed. Even if passed, the dialog will still be able to close itself.
47735   *
47736   * Activating this mode is as simple as omitting the `isOpen` prop. The only mandatory prop, in this case, is the `onConfirm` callback. The message is passed as the `children`. You can pass any JSX you'd like, which allows to further format the message or include sub-component if you'd like:
47737   *
47738   * ```jsx
47739   * import { __experimentalConfirmDialog as ConfirmDialog } from '@wordpress/components';
47740   *
47741   * function Example() {
47742   *     return (
47743   *         <ConfirmDialog onConfirm={ () => console.debug( ' Confirmed! ' ) }>
47744   *             Are you sure? <strong>This action cannot be undone!</strong>
47745   *         </ConfirmDialog>
47746   *     );
47747   * }
47748   * ```
47749   *
47750   *
47751   * Controlled mode:
47752   *  Let the parent component control when the dialog is open/closed. It's activated when a
47753   * boolean value is passed to `isOpen`:
47754   * -   It will not be automatically closed. You need to let it know when to open/close by updating the value of the `isOpen` prop;
47755   * -   Both `onConfirm` and the `onCancel` callbacks are mandatory props in this mode;
47756   * -   You'll want to update the state that controls `isOpen` by updating it from the `onCancel` and `onConfirm` callbacks.
47757   *
47758   *```jsx
47759   * import { __experimentalConfirmDialog as ConfirmDialog } from '@wordpress/components';
47760   * import { useState } from '@wordpress/element';
47761   *
47762   * function Example() {
47763   *     const [ isOpen, setIsOpen ] = useState( true );
47764   *
47765   *     const handleConfirm = () => {
47766   *         console.debug( 'Confirmed!' );
47767   *         setIsOpen( false );
47768   *     };
47769   *
47770   *     const handleCancel = () => {
47771   *         console.debug( 'Cancelled!' );
47772   *         setIsOpen( false );
47773   *     };
47774   *
47775   *     return (
47776   *         <ConfirmDialog
47777   *             isOpen={ isOpen }
47778   *             onConfirm={ handleConfirm }
47779   *             onCancel={ handleCancel }
47780   *         >
47781   *             Are you sure? <strong>This action cannot be undone!</strong>
47782   *         </ConfirmDialog>
47783   *     );
47784   * }
47785   * ```
47786   */
47787  const ConfirmDialog = contextConnect(UnconnectedConfirmDialog, 'ConfirmDialog');
47788  /* harmony default export */ const confirm_dialog_component = (ConfirmDialog);
47789  
47790  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/DWZ7E5TJ.js
47791  "use client";
47792  
47793  
47794  
47795  
47796  // src/combobox/combobox-context.tsx
47797  
47798  var ComboboxListRoleContext = (0,external_React_.createContext)(
47799    void 0
47800  );
47801  var DWZ7E5TJ_ctx = createStoreContext(
47802    [PopoverContextProvider, CompositeContextProvider],
47803    [PopoverScopedContextProvider, CompositeScopedContextProvider]
47804  );
47805  var useComboboxContext = DWZ7E5TJ_ctx.useContext;
47806  var useComboboxScopedContext = DWZ7E5TJ_ctx.useScopedContext;
47807  var useComboboxProviderContext = DWZ7E5TJ_ctx.useProviderContext;
47808  var ComboboxContextProvider = DWZ7E5TJ_ctx.ContextProvider;
47809  var ComboboxScopedContextProvider = DWZ7E5TJ_ctx.ScopedContextProvider;
47810  var ComboboxItemValueContext = (0,external_React_.createContext)(
47811    void 0
47812  );
47813  var ComboboxItemCheckedContext = (0,external_React_.createContext)(false);
47814  
47815  
47816  
47817  ;// CONCATENATED MODULE: ./node_modules/@ariakit/core/esm/select/select-store.js
47818  "use client";
47819  
47820  
47821  
47822  
47823  
47824  
47825  
47826  
47827  
47828  
47829  
47830  // src/select/select-store.ts
47831  function createSelectStore(_a = {}) {
47832    var _b = _a, {
47833      combobox
47834    } = _b, props = _3YLGPPWQ_objRest(_b, [
47835      "combobox"
47836    ]);
47837    const store = mergeStore(
47838      props.store,
47839      omit2(combobox, [
47840        "value",
47841        "items",
47842        "renderedItems",
47843        "baseElement",
47844        "arrowElement",
47845        "anchorElement",
47846        "contentElement",
47847        "popoverElement",
47848        "disclosureElement"
47849      ])
47850    );
47851    throwOnConflictingProps(props, store);
47852    const syncState = store.getState();
47853    const composite = createCompositeStore(_chunks_3YLGPPWQ_spreadProps(_chunks_3YLGPPWQ_spreadValues({}, props), {
47854      store,
47855      virtualFocus: defaultValue(
47856        props.virtualFocus,
47857        syncState.virtualFocus,
47858        true
47859      ),
47860      includesBaseElement: defaultValue(
47861        props.includesBaseElement,
47862        syncState.includesBaseElement,
47863        false
47864      ),
47865      activeId: defaultValue(
47866        props.activeId,
47867        syncState.activeId,
47868        props.defaultActiveId,
47869        null
47870      ),
47871      orientation: defaultValue(
47872        props.orientation,
47873        syncState.orientation,
47874        "vertical"
47875      )
47876    }));
47877    const popover = createPopoverStore(_chunks_3YLGPPWQ_spreadProps(_chunks_3YLGPPWQ_spreadValues({}, props), {
47878      store,
47879      placement: defaultValue(
47880        props.placement,
47881        syncState.placement,
47882        "bottom-start"
47883      )
47884    }));
47885    const initialValue = new String("");
47886    const initialState = _chunks_3YLGPPWQ_spreadProps(_chunks_3YLGPPWQ_spreadValues(_chunks_3YLGPPWQ_spreadValues({}, composite.getState()), popover.getState()), {
47887      value: defaultValue(
47888        props.value,
47889        syncState.value,
47890        props.defaultValue,
47891        initialValue
47892      ),
47893      setValueOnMove: defaultValue(
47894        props.setValueOnMove,
47895        syncState.setValueOnMove,
47896        false
47897      ),
47898      labelElement: defaultValue(syncState.labelElement, null),
47899      selectElement: defaultValue(syncState.selectElement, null),
47900      listElement: defaultValue(syncState.listElement, null)
47901    });
47902    const select = createStore(initialState, composite, popover, store);
47903    setup(
47904      select,
47905      () => sync(select, ["value", "items"], (state) => {
47906        if (state.value !== initialValue) return;
47907        if (!state.items.length) return;
47908        const item = state.items.find(
47909          (item2) => !item2.disabled && item2.value != null
47910        );
47911        if ((item == null ? void 0 : item.value) == null) return;
47912        select.setState("value", item.value);
47913      })
47914    );
47915    setup(
47916      select,
47917      () => sync(select, ["mounted"], (state) => {
47918        if (state.mounted) return;
47919        select.setState("activeId", initialState.activeId);
47920      })
47921    );
47922    setup(
47923      select,
47924      () => sync(select, ["mounted", "items", "value"], (state) => {
47925        if (combobox) return;
47926        if (state.mounted) return;
47927        const values = toArray(state.value);
47928        const lastValue = values[values.length - 1];
47929        if (lastValue == null) return;
47930        const item = state.items.find(
47931          (item2) => !item2.disabled && item2.value === lastValue
47932        );
47933        if (!item) return;
47934        select.setState("activeId", item.id);
47935      })
47936    );
47937    setup(
47938      select,
47939      () => batch(select, ["setValueOnMove", "moves"], (state) => {
47940        const { mounted, value, activeId } = select.getState();
47941        if (!state.setValueOnMove && mounted) return;
47942        if (Array.isArray(value)) return;
47943        if (!state.moves) return;
47944        if (!activeId) return;
47945        const item = composite.item(activeId);
47946        if (!item || item.disabled || item.value == null) return;
47947        select.setState("value", item.value);
47948      })
47949    );
47950    return _chunks_3YLGPPWQ_spreadProps(_chunks_3YLGPPWQ_spreadValues(_chunks_3YLGPPWQ_spreadValues(_chunks_3YLGPPWQ_spreadValues({}, composite), popover), select), {
47951      combobox,
47952      setValue: (value) => select.setState("value", value),
47953      setLabelElement: (element) => select.setState("labelElement", element),
47954      setSelectElement: (element) => select.setState("selectElement", element),
47955      setListElement: (element) => select.setState("listElement", element)
47956    });
47957  }
47958  
47959  
47960  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/X5LAA6JI.js
47961  "use client";
47962  
47963  
47964  
47965  
47966  
47967  
47968  
47969  // src/select/select-store.ts
47970  
47971  function useSelectStoreProps(store, update, props) {
47972    useUpdateEffect(update, [props.combobox]);
47973    useStoreProps(store, props, "value", "setValue");
47974    useStoreProps(store, props, "setValueOnMove");
47975    return Object.assign(
47976      usePopoverStoreProps(
47977        useCompositeStoreProps(store, update, props),
47978        update,
47979        props
47980      ),
47981      { combobox: props.combobox }
47982    );
47983  }
47984  function useSelectStore(props = {}) {
47985    const combobox = useComboboxProviderContext();
47986    props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, props), {
47987      combobox: props.combobox !== void 0 ? props.combobox : combobox
47988    });
47989    const [store, update] = _2GXGCHW6_useStore(createSelectStore, props);
47990    return useSelectStoreProps(store, update, props);
47991  }
47992  
47993  
47994  
47995  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/KZ2S4ZC5.js
47996  "use client";
47997  
47998  
47999  
48000  
48001  // src/select/select-context.tsx
48002  
48003  var KZ2S4ZC5_ctx = createStoreContext(
48004    [PopoverContextProvider, CompositeContextProvider],
48005    [PopoverScopedContextProvider, CompositeScopedContextProvider]
48006  );
48007  var useSelectContext = KZ2S4ZC5_ctx.useContext;
48008  var useSelectScopedContext = KZ2S4ZC5_ctx.useScopedContext;
48009  var useSelectProviderContext = KZ2S4ZC5_ctx.useProviderContext;
48010  var SelectContextProvider = KZ2S4ZC5_ctx.ContextProvider;
48011  var SelectScopedContextProvider = KZ2S4ZC5_ctx.ScopedContextProvider;
48012  var SelectItemCheckedContext = (0,external_React_.createContext)(false);
48013  var SelectHeadingContext = (0,external_React_.createContext)(null);
48014  
48015  
48016  
48017  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/select/select-label.js
48018  "use client";
48019  
48020  
48021  
48022  
48023  
48024  
48025  
48026  
48027  
48028  
48029  
48030  // src/select/select-label.tsx
48031  
48032  var select_label_TagName = "div";
48033  var useSelectLabel = createHook(
48034    function useSelectLabel2(_a) {
48035      var _b = _a, { store } = _b, props = __objRest(_b, ["store"]);
48036      const context = useSelectProviderContext();
48037      store = store || context;
48038      invariant(
48039        store,
48040         false && 0
48041      );
48042      const id = useId(props.id);
48043      const onClickProp = props.onClick;
48044      const onClick = useEvent((event) => {
48045        onClickProp == null ? void 0 : onClickProp(event);
48046        if (event.defaultPrevented) return;
48047        queueMicrotask(() => {
48048          const select = store == null ? void 0 : store.getState().selectElement;
48049          select == null ? void 0 : select.focus();
48050        });
48051      });
48052      props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({
48053        id
48054      }, props), {
48055        ref: useMergeRefs(store.setLabelElement, props.ref),
48056        onClick,
48057        style: _3YLGPPWQ_spreadValues({
48058          cursor: "default"
48059        }, props.style)
48060      });
48061      return removeUndefinedValues(props);
48062    }
48063  );
48064  var SelectLabel = memo2(
48065    forwardRef2(function SelectLabel2(props) {
48066      const htmlProps = useSelectLabel(props);
48067      return HKOOKEDE_createElement(select_label_TagName, htmlProps);
48068    })
48069  );
48070  
48071  
48072  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/HVQRJDA5.js
48073  "use client";
48074  
48075  
48076  
48077  
48078  
48079  // src/button/button.tsx
48080  
48081  
48082  var HVQRJDA5_TagName = "button";
48083  var useButton = createHook(
48084    function useButton2(props) {
48085      const ref = (0,external_React_.useRef)(null);
48086      const tagName = useTagName(ref, HVQRJDA5_TagName);
48087      const [isNativeButton, setIsNativeButton] = (0,external_React_.useState)(
48088        () => !!tagName && isButton({ tagName, type: props.type })
48089      );
48090      (0,external_React_.useEffect)(() => {
48091        if (!ref.current) return;
48092        setIsNativeButton(isButton(ref.current));
48093      }, []);
48094      props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({
48095        role: !isNativeButton && tagName !== "a" ? "button" : void 0
48096      }, props), {
48097        ref: useMergeRefs(ref, props.ref)
48098      });
48099      props = useCommand(props);
48100      return props;
48101    }
48102  );
48103  var HVQRJDA5_Button = forwardRef2(function Button2(props) {
48104    const htmlProps = useButton(props);
48105    return HKOOKEDE_createElement(HVQRJDA5_TagName, htmlProps);
48106  });
48107  
48108  
48109  
48110  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/WEUO55PT.js
48111  "use client";
48112  
48113  
48114  
48115  
48116  
48117  
48118  // src/disclosure/disclosure.tsx
48119  
48120  
48121  var WEUO55PT_TagName = "button";
48122  var WEUO55PT_symbol = Symbol("disclosure");
48123  var useDisclosure = createHook(
48124    function useDisclosure2(_a) {
48125      var _b = _a, { store, toggleOnClick = true } = _b, props = __objRest(_b, ["store", "toggleOnClick"]);
48126      const context = useDisclosureProviderContext();
48127      store = store || context;
48128      invariant(
48129        store,
48130         false && 0
48131      );
48132      const ref = (0,external_React_.useRef)(null);
48133      const [expanded, setExpanded] = (0,external_React_.useState)(false);
48134      const disclosureElement = store.useState("disclosureElement");
48135      const open = store.useState("open");
48136      (0,external_React_.useEffect)(() => {
48137        let isCurrentDisclosure = disclosureElement === ref.current;
48138        if (!(disclosureElement == null ? void 0 : disclosureElement.isConnected)) {
48139          store == null ? void 0 : store.setDisclosureElement(ref.current);
48140          isCurrentDisclosure = true;
48141        }
48142        setExpanded(open && isCurrentDisclosure);
48143      }, [disclosureElement, store, open]);
48144      const onClickProp = props.onClick;
48145      const toggleOnClickProp = useBooleanEvent(toggleOnClick);
48146      const [isDuplicate, metadataProps] = useMetadataProps(props, WEUO55PT_symbol, true);
48147      const onClick = useEvent((event) => {
48148        onClickProp == null ? void 0 : onClickProp(event);
48149        if (event.defaultPrevented) return;
48150        if (isDuplicate) return;
48151        if (!toggleOnClickProp(event)) return;
48152        store == null ? void 0 : store.setDisclosureElement(event.currentTarget);
48153        store == null ? void 0 : store.toggle();
48154      });
48155      const contentElement = store.useState("contentElement");
48156      props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues(_3YLGPPWQ_spreadValues({
48157        "aria-expanded": expanded,
48158        "aria-controls": contentElement == null ? void 0 : contentElement.id
48159      }, metadataProps), props), {
48160        ref: useMergeRefs(ref, props.ref),
48161        onClick
48162      });
48163      props = useButton(props);
48164      return props;
48165    }
48166  );
48167  var Disclosure = forwardRef2(function Disclosure2(props) {
48168    const htmlProps = useDisclosure(props);
48169    return HKOOKEDE_createElement(WEUO55PT_TagName, htmlProps);
48170  });
48171  
48172  
48173  
48174  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/LNWM7V7G.js
48175  "use client";
48176  
48177  
48178  
48179  
48180  
48181  // src/dialog/dialog-disclosure.tsx
48182  
48183  
48184  var LNWM7V7G_TagName = "button";
48185  var useDialogDisclosure = createHook(
48186    function useDialogDisclosure2(_a) {
48187      var _b = _a, { store } = _b, props = __objRest(_b, ["store"]);
48188      const context = useDialogProviderContext();
48189      store = store || context;
48190      invariant(
48191        store,
48192         false && 0
48193      );
48194      const contentElement = store.useState("contentElement");
48195      props = _3YLGPPWQ_spreadValues({
48196        "aria-haspopup": getPopupRole(contentElement, "dialog")
48197      }, props);
48198      props = useDisclosure(_3YLGPPWQ_spreadValues({ store }, props));
48199      return props;
48200    }
48201  );
48202  var DialogDisclosure = forwardRef2(function DialogDisclosure2(props) {
48203    const htmlProps = useDialogDisclosure(props);
48204    return HKOOKEDE_createElement(LNWM7V7G_TagName, htmlProps);
48205  });
48206  
48207  
48208  
48209  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/74NFH3UH.js
48210  "use client";
48211  
48212  
48213  
48214  
48215  
48216  // src/popover/popover-anchor.tsx
48217  var _74NFH3UH_TagName = "div";
48218  var usePopoverAnchor = createHook(
48219    function usePopoverAnchor2(_a) {
48220      var _b = _a, { store } = _b, props = __objRest(_b, ["store"]);
48221      const context = usePopoverProviderContext();
48222      store = store || context;
48223      props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, props), {
48224        ref: useMergeRefs(store == null ? void 0 : store.setAnchorElement, props.ref)
48225      });
48226      return props;
48227    }
48228  );
48229  var PopoverAnchor = forwardRef2(function PopoverAnchor2(props) {
48230    const htmlProps = usePopoverAnchor(props);
48231    return HKOOKEDE_createElement(_74NFH3UH_TagName, htmlProps);
48232  });
48233  
48234  
48235  
48236  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/52IKNGON.js
48237  "use client";
48238  
48239  
48240  
48241  
48242  
48243  
48244  
48245  // src/popover/popover-disclosure.tsx
48246  
48247  
48248  var _52IKNGON_TagName = "button";
48249  var usePopoverDisclosure = createHook(function usePopoverDisclosure2(_a) {
48250    var _b = _a, { store } = _b, props = __objRest(_b, ["store"]);
48251    const context = usePopoverProviderContext();
48252    store = store || context;
48253    invariant(
48254      store,
48255       false && 0
48256    );
48257    const onClickProp = props.onClick;
48258    const onClick = useEvent((event) => {
48259      store == null ? void 0 : store.setAnchorElement(event.currentTarget);
48260      onClickProp == null ? void 0 : onClickProp(event);
48261    });
48262    props = useWrapElement(
48263      props,
48264      (element) => /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(PopoverScopedContextProvider, { value: store, children: element }),
48265      [store]
48266    );
48267    props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, props), {
48268      onClick
48269    });
48270    props = usePopoverAnchor(_3YLGPPWQ_spreadValues({ store }, props));
48271    props = useDialogDisclosure(_3YLGPPWQ_spreadValues({ store }, props));
48272    return props;
48273  });
48274  var PopoverDisclosure = forwardRef2(function PopoverDisclosure2(props) {
48275    const htmlProps = usePopoverDisclosure(props);
48276    return HKOOKEDE_createElement(_52IKNGON_TagName, htmlProps);
48277  });
48278  
48279  
48280  
48281  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/CAGM4AEJ.js
48282  "use client";
48283  
48284  
48285  
48286  
48287  // src/popover/popover-disclosure-arrow.tsx
48288  
48289  
48290  
48291  var CAGM4AEJ_TagName = "span";
48292  var pointsMap = {
48293    top: "4,10 8,6 12,10",
48294    right: "6,4 10,8 6,12",
48295    bottom: "4,6 8,10 12,6",
48296    left: "10,4 6,8 10,12"
48297  };
48298  var usePopoverDisclosureArrow = createHook(function usePopoverDisclosureArrow2(_a) {
48299    var _b = _a, { store, placement } = _b, props = __objRest(_b, ["store", "placement"]);
48300    const context = usePopoverContext();
48301    store = store || context;
48302    invariant(
48303      store,
48304       false && 0
48305    );
48306    const position = store.useState((state) => placement || state.placement);
48307    const dir = position.split("-")[0];
48308    const points = pointsMap[dir];
48309    const children = (0,external_React_.useMemo)(
48310      () => /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(
48311        "svg",
48312        {
48313          display: "block",
48314          fill: "none",
48315          stroke: "currentColor",
48316          strokeLinecap: "round",
48317          strokeLinejoin: "round",
48318          strokeWidth: 1.5,
48319          viewBox: "0 0 16 16",
48320          height: "1em",
48321          width: "1em",
48322          children: /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)("polyline", { points })
48323        }
48324      ),
48325      [points]
48326    );
48327    props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({
48328      children,
48329      "aria-hidden": true
48330    }, props), {
48331      style: _3YLGPPWQ_spreadValues({
48332        width: "1em",
48333        height: "1em",
48334        pointerEvents: "none"
48335      }, props.style)
48336    });
48337    return removeUndefinedValues(props);
48338  });
48339  var PopoverDisclosureArrow = forwardRef2(
48340    function PopoverDisclosureArrow2(props) {
48341      const htmlProps = usePopoverDisclosureArrow(props);
48342      return HKOOKEDE_createElement(CAGM4AEJ_TagName, htmlProps);
48343    }
48344  );
48345  
48346  
48347  
48348  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/2UJDTHC7.js
48349  "use client";
48350  
48351  
48352  
48353  
48354  
48355  // src/select/select-arrow.tsx
48356  var _2UJDTHC7_TagName = "span";
48357  var useSelectArrow = createHook(
48358    function useSelectArrow2(_a) {
48359      var _b = _a, { store } = _b, props = __objRest(_b, ["store"]);
48360      const context = useSelectContext();
48361      store = store || context;
48362      props = usePopoverDisclosureArrow(_3YLGPPWQ_spreadValues({ store }, props));
48363      return props;
48364    }
48365  );
48366  var SelectArrow = forwardRef2(function SelectArrow2(props) {
48367    const htmlProps = useSelectArrow(props);
48368    return HKOOKEDE_createElement(_2UJDTHC7_TagName, htmlProps);
48369  });
48370  
48371  
48372  
48373  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/DS36B3MQ.js
48374  "use client";
48375  
48376  
48377  
48378  
48379  
48380  
48381  // src/composite/composite-typeahead.tsx
48382  
48383  
48384  
48385  
48386  var DS36B3MQ_TagName = "div";
48387  var chars = "";
48388  function clearChars() {
48389    chars = "";
48390  }
48391  function isValidTypeaheadEvent(event) {
48392    const target = event.target;
48393    if (target && isTextField(target)) return false;
48394    if (event.key === " " && chars.length) return true;
48395    return event.key.length === 1 && !event.ctrlKey && !event.altKey && !event.metaKey && /^[\p{Letter}\p{Number}]$/u.test(event.key);
48396  }
48397  function isSelfTargetOrItem(event, items) {
48398    if (isSelfTarget(event)) return true;
48399    const target = event.target;
48400    if (!target) return false;
48401    const isItem = items.some((item) => item.element === target);
48402    return isItem;
48403  }
48404  function DS36B3MQ_getEnabledItems(items) {
48405    return items.filter((item) => !item.disabled);
48406  }
48407  function itemTextStartsWith(item, text) {
48408    var _a;
48409    const itemText = ((_a = item.element) == null ? void 0 : _a.textContent) || item.children || // The composite item object itself doesn't include a value property, but
48410    // other components like Select do. Since CompositeTypeahead is a generic
48411    // component that can be used with those as well, we also consider the value
48412    // property as a fallback for the typeahead text content.
48413    "value" in item && item.value;
48414    if (!itemText) return false;
48415    return normalizeString(itemText).trim().toLowerCase().startsWith(text.toLowerCase());
48416  }
48417  function getSameInitialItems(items, char, activeId) {
48418    if (!activeId) return items;
48419    const activeItem = items.find((item) => item.id === activeId);
48420    if (!activeItem) return items;
48421    if (!itemTextStartsWith(activeItem, char)) return items;
48422    if (chars !== char && itemTextStartsWith(activeItem, chars)) return items;
48423    chars = char;
48424    return _5VQZOHHZ_flipItems(
48425      items.filter((item) => itemTextStartsWith(item, chars)),
48426      activeId
48427    ).filter((item) => item.id !== activeId);
48428  }
48429  var useCompositeTypeahead = createHook(function useCompositeTypeahead2(_a) {
48430    var _b = _a, { store, typeahead = true } = _b, props = __objRest(_b, ["store", "typeahead"]);
48431    const context = useCompositeContext();
48432    store = store || context;
48433    invariant(
48434      store,
48435       false && 0
48436    );
48437    const onKeyDownCaptureProp = props.onKeyDownCapture;
48438    const cleanupTimeoutRef = (0,external_React_.useRef)(0);
48439    const onKeyDownCapture = useEvent((event) => {
48440      onKeyDownCaptureProp == null ? void 0 : onKeyDownCaptureProp(event);
48441      if (event.defaultPrevented) return;
48442      if (!typeahead) return;
48443      if (!store) return;
48444      const { renderedItems, items, activeId } = store.getState();
48445      if (!isValidTypeaheadEvent(event)) return clearChars();
48446      let enabledItems = DS36B3MQ_getEnabledItems(
48447        renderedItems.length ? renderedItems : items
48448      );
48449      if (!isSelfTargetOrItem(event, enabledItems)) return clearChars();
48450      event.preventDefault();
48451      window.clearTimeout(cleanupTimeoutRef.current);
48452      cleanupTimeoutRef.current = window.setTimeout(() => {
48453        chars = "";
48454      }, 500);
48455      const char = event.key.toLowerCase();
48456      chars += char;
48457      enabledItems = getSameInitialItems(enabledItems, char, activeId);
48458      const item = enabledItems.find((item2) => itemTextStartsWith(item2, chars));
48459      if (item) {
48460        store.move(item.id);
48461      } else {
48462        clearChars();
48463      }
48464    });
48465    props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, props), {
48466      onKeyDownCapture
48467    });
48468    return removeUndefinedValues(props);
48469  });
48470  var DS36B3MQ_CompositeTypeahead = forwardRef2(function CompositeTypeahead2(props) {
48471    const htmlProps = useCompositeTypeahead(props);
48472    return HKOOKEDE_createElement(DS36B3MQ_TagName, htmlProps);
48473  });
48474  
48475  
48476  
48477  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/select/select.js
48478  "use client";
48479  
48480  
48481  
48482  
48483  
48484  
48485  
48486  
48487  
48488  
48489  
48490  
48491  
48492  
48493  
48494  
48495  
48496  
48497  
48498  
48499  
48500  
48501  
48502  // src/select/select.tsx
48503  
48504  
48505  
48506  
48507  
48508  
48509  var select_TagName = "button";
48510  function getSelectedValues(select) {
48511    return Array.from(select.selectedOptions).map((option) => option.value);
48512  }
48513  function nextWithValue(store, next) {
48514    return () => {
48515      const nextId = next();
48516      if (!nextId) return;
48517      let i = 0;
48518      let nextItem = store.item(nextId);
48519      const firstItem = nextItem;
48520      while (nextItem && nextItem.value == null) {
48521        const nextId2 = next(++i);
48522        if (!nextId2) return;
48523        nextItem = store.item(nextId2);
48524        if (nextItem === firstItem) break;
48525      }
48526      return nextItem == null ? void 0 : nextItem.id;
48527    };
48528  }
48529  var useSelect = createHook(function useSelect2(_a) {
48530    var _b = _a, {
48531      store,
48532      name,
48533      form,
48534      required,
48535      showOnKeyDown = true,
48536      moveOnKeyDown = true,
48537      toggleOnPress = true,
48538      toggleOnClick = toggleOnPress
48539    } = _b, props = __objRest(_b, [
48540      "store",
48541      "name",
48542      "form",
48543      "required",
48544      "showOnKeyDown",
48545      "moveOnKeyDown",
48546      "toggleOnPress",
48547      "toggleOnClick"
48548    ]);
48549    const context = useSelectProviderContext();
48550    store = store || context;
48551    invariant(
48552      store,
48553       false && 0
48554    );
48555    const onKeyDownProp = props.onKeyDown;
48556    const showOnKeyDownProp = useBooleanEvent(showOnKeyDown);
48557    const moveOnKeyDownProp = useBooleanEvent(moveOnKeyDown);
48558    const placement = store.useState("placement");
48559    const dir = placement.split("-")[0];
48560    const value = store.useState("value");
48561    const multiSelectable = Array.isArray(value);
48562    const onKeyDown = useEvent((event) => {
48563      var _a2;
48564      onKeyDownProp == null ? void 0 : onKeyDownProp(event);
48565      if (event.defaultPrevented) return;
48566      if (!store) return;
48567      const { orientation, items: items2, activeId } = store.getState();
48568      const isVertical = orientation !== "horizontal";
48569      const isHorizontal = orientation !== "vertical";
48570      const isGrid = !!((_a2 = items2.find((item) => !item.disabled && item.value != null)) == null ? void 0 : _a2.rowId);
48571      const moveKeyMap = {
48572        ArrowUp: (isGrid || isVertical) && nextWithValue(store, store.up),
48573        ArrowRight: (isGrid || isHorizontal) && nextWithValue(store, store.next),
48574        ArrowDown: (isGrid || isVertical) && nextWithValue(store, store.down),
48575        ArrowLeft: (isGrid || isHorizontal) && nextWithValue(store, store.previous)
48576      };
48577      const getId = moveKeyMap[event.key];
48578      if (getId && moveOnKeyDownProp(event)) {
48579        event.preventDefault();
48580        store.move(getId());
48581      }
48582      const isTopOrBottom = dir === "top" || dir === "bottom";
48583      const isLeft = dir === "left";
48584      const isRight = dir === "right";
48585      const canShowKeyMap = {
48586        ArrowDown: isTopOrBottom,
48587        ArrowUp: isTopOrBottom,
48588        ArrowLeft: isLeft,
48589        ArrowRight: isRight
48590      };
48591      const canShow = canShowKeyMap[event.key];
48592      if (canShow && showOnKeyDownProp(event)) {
48593        event.preventDefault();
48594        store.move(activeId);
48595        queueBeforeEvent(event.currentTarget, "keyup", store.show);
48596      }
48597    });
48598    props = useWrapElement(
48599      props,
48600      (element) => /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(SelectScopedContextProvider, { value: store, children: element }),
48601      [store]
48602    );
48603    const [autofill, setAutofill] = (0,external_React_.useState)(false);
48604    const nativeSelectChangedRef = (0,external_React_.useRef)(false);
48605    (0,external_React_.useEffect)(() => {
48606      const nativeSelectChanged = nativeSelectChangedRef.current;
48607      nativeSelectChangedRef.current = false;
48608      if (nativeSelectChanged) return;
48609      setAutofill(false);
48610    }, [value]);
48611    const labelId = store.useState((state) => {
48612      var _a2;
48613      return (_a2 = state.labelElement) == null ? void 0 : _a2.id;
48614    });
48615    const label = props["aria-label"];
48616    const labelledBy = props["aria-labelledby"] || labelId;
48617    const items = store.useState((state) => {
48618      if (!name) return;
48619      return state.items;
48620    });
48621    const values = (0,external_React_.useMemo)(() => {
48622      return [...new Set(items == null ? void 0 : items.map((i) => i.value).filter((v) => v != null))];
48623    }, [items]);
48624    props = useWrapElement(
48625      props,
48626      (element) => {
48627        if (!name) return element;
48628        return /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { children: [
48629          /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsxs)(
48630            "select",
48631            {
48632              style: {
48633                border: 0,
48634                clip: "rect(0 0 0 0)",
48635                height: "1px",
48636                margin: "-1px",
48637                overflow: "hidden",
48638                padding: 0,
48639                position: "absolute",
48640                whiteSpace: "nowrap",
48641                width: "1px"
48642              },
48643              tabIndex: -1,
48644              "aria-hidden": true,
48645              "aria-label": label,
48646              "aria-labelledby": labelledBy,
48647              name,
48648              form,
48649              required,
48650              value,
48651              multiple: multiSelectable,
48652              onFocus: () => {
48653                var _a2;
48654                return (_a2 = store == null ? void 0 : store.getState().selectElement) == null ? void 0 : _a2.focus();
48655              },
48656              onChange: (event) => {
48657                nativeSelectChangedRef.current = true;
48658                setAutofill(true);
48659                store == null ? void 0 : store.setValue(
48660                  multiSelectable ? getSelectedValues(event.target) : event.target.value
48661                );
48662              },
48663              children: [
48664                toArray(value).map((value2) => {
48665                  if (value2 == null) return null;
48666                  if (values.includes(value2)) return null;
48667                  return /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)("option", { value: value2, children: value2 }, value2);
48668                }),
48669                values.map((value2) => /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)("option", { value: value2, children: value2 }, value2))
48670              ]
48671            }
48672          ),
48673          element
48674        ] });
48675      },
48676      [
48677        store,
48678        label,
48679        labelledBy,
48680        name,
48681        form,
48682        required,
48683        value,
48684        multiSelectable,
48685        values
48686      ]
48687    );
48688    const children = /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { children: [
48689      value,
48690      /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(SelectArrow, {})
48691    ] });
48692    const contentElement = store.useState("contentElement");
48693    props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({
48694      role: "combobox",
48695      "aria-autocomplete": "none",
48696      "aria-labelledby": labelId,
48697      "aria-haspopup": getPopupRole(contentElement, "listbox"),
48698      "data-autofill": autofill || void 0,
48699      "data-name": name,
48700      children
48701    }, props), {
48702      ref: useMergeRefs(store.setSelectElement, props.ref),
48703      onKeyDown
48704    });
48705    props = usePopoverDisclosure(_3YLGPPWQ_spreadValues({ store, toggleOnClick }, props));
48706    props = useCompositeTypeahead(_3YLGPPWQ_spreadValues({ store }, props));
48707    return props;
48708  });
48709  var select_Select = forwardRef2(function Select2(props) {
48710    const htmlProps = useSelect(props);
48711    return HKOOKEDE_createElement(select_TagName, htmlProps);
48712  });
48713  
48714  
48715  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/EQC5P6YO.js
48716  "use client";
48717  
48718  
48719  
48720  
48721  
48722  
48723  
48724  
48725  // src/select/select-list.tsx
48726  
48727  
48728  
48729  
48730  var EQC5P6YO_TagName = "div";
48731  var SelectListContext = (0,external_React_.createContext)(null);
48732  var useSelectList = createHook(
48733    function useSelectList2(_a) {
48734      var _b = _a, {
48735        store,
48736        resetOnEscape = true,
48737        hideOnEnter = true,
48738        focusOnMove = true,
48739        composite,
48740        alwaysVisible
48741      } = _b, props = __objRest(_b, [
48742        "store",
48743        "resetOnEscape",
48744        "hideOnEnter",
48745        "focusOnMove",
48746        "composite",
48747        "alwaysVisible"
48748      ]);
48749      const context = useSelectContext();
48750      store = store || context;
48751      invariant(
48752        store,
48753         false && 0
48754      );
48755      const id = useId(props.id);
48756      const value = store.useState("value");
48757      const multiSelectable = Array.isArray(value);
48758      const [defaultValue, setDefaultValue] = (0,external_React_.useState)(value);
48759      const mounted = store.useState("mounted");
48760      (0,external_React_.useEffect)(() => {
48761        if (mounted) return;
48762        setDefaultValue(value);
48763      }, [mounted, value]);
48764      resetOnEscape = resetOnEscape && !multiSelectable;
48765      const onKeyDownProp = props.onKeyDown;
48766      const resetOnEscapeProp = useBooleanEvent(resetOnEscape);
48767      const hideOnEnterProp = useBooleanEvent(hideOnEnter);
48768      const onKeyDown = useEvent((event) => {
48769        onKeyDownProp == null ? void 0 : onKeyDownProp(event);
48770        if (event.defaultPrevented) return;
48771        if (event.key === "Escape" && resetOnEscapeProp(event)) {
48772          store == null ? void 0 : store.setValue(defaultValue);
48773        }
48774        if (event.key === " " || event.key === "Enter") {
48775          if (isSelfTarget(event) && hideOnEnterProp(event)) {
48776            event.preventDefault();
48777            store == null ? void 0 : store.hide();
48778          }
48779        }
48780      });
48781      const headingContext = (0,external_React_.useContext)(SelectHeadingContext);
48782      const headingState = (0,external_React_.useState)();
48783      const [headingId, setHeadingId] = headingContext || headingState;
48784      const headingContextValue = (0,external_React_.useMemo)(
48785        () => [headingId, setHeadingId],
48786        [headingId]
48787      );
48788      const [childStore, setChildStore] = (0,external_React_.useState)(null);
48789      const setStore = (0,external_React_.useContext)(SelectListContext);
48790      (0,external_React_.useEffect)(() => {
48791        if (!setStore) return;
48792        setStore(store);
48793        return () => setStore(null);
48794      }, [setStore, store]);
48795      props = useWrapElement(
48796        props,
48797        (element2) => /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(SelectScopedContextProvider, { value: store, children: /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(SelectListContext.Provider, { value: setChildStore, children: /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(SelectHeadingContext.Provider, { value: headingContextValue, children: element2 }) }) }),
48798        [store, headingContextValue]
48799      );
48800      const hasCombobox = !!store.combobox;
48801      composite = composite != null ? composite : !hasCombobox && childStore !== store;
48802      const [element, setElement] = useTransactionState(
48803        composite ? store.setListElement : null
48804      );
48805      const role = useAttribute(element, "role", props.role);
48806      const isCompositeRole = role === "listbox" || role === "menu" || role === "tree" || role === "grid";
48807      const ariaMultiSelectable = composite || isCompositeRole ? multiSelectable || void 0 : void 0;
48808      const hidden = isHidden(mounted, props.hidden, alwaysVisible);
48809      const style = hidden ? _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, props.style), { display: "none" }) : props.style;
48810      if (composite) {
48811        props = _3YLGPPWQ_spreadValues({
48812          role: "listbox",
48813          "aria-multiselectable": ariaMultiSelectable
48814        }, props);
48815      }
48816      const labelId = store.useState(
48817        (state) => {
48818          var _a2;
48819          return headingId || ((_a2 = state.labelElement) == null ? void 0 : _a2.id);
48820        }
48821      );
48822      props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({
48823        id,
48824        "aria-labelledby": labelId,
48825        hidden
48826      }, props), {
48827        ref: useMergeRefs(setElement, props.ref),
48828        style,
48829        onKeyDown
48830      });
48831      props = useComposite(_3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({ store }, props), { composite }));
48832      props = useCompositeTypeahead(_3YLGPPWQ_spreadValues({ store, typeahead: !hasCombobox }, props));
48833      return props;
48834    }
48835  );
48836  var SelectList = forwardRef2(function SelectList2(props) {
48837    const htmlProps = useSelectList(props);
48838    return HKOOKEDE_createElement(EQC5P6YO_TagName, htmlProps);
48839  });
48840  
48841  
48842  
48843  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/select/select-popover.js
48844  "use client";
48845  
48846  
48847  
48848  
48849  
48850  
48851  
48852  
48853  
48854  
48855  
48856  
48857  
48858  
48859  
48860  
48861  
48862  
48863  
48864  
48865  
48866  
48867  
48868  
48869  
48870  
48871  
48872  
48873  
48874  
48875  
48876  
48877  
48878  
48879  
48880  
48881  
48882  
48883  
48884  
48885  
48886  
48887  
48888  
48889  
48890  // src/select/select-popover.tsx
48891  var select_popover_TagName = "div";
48892  var useSelectPopover = createHook(
48893    function useSelectPopover2(_a) {
48894      var _b = _a, { store, alwaysVisible } = _b, props = __objRest(_b, ["store", "alwaysVisible"]);
48895      const context = useSelectProviderContext();
48896      store = store || context;
48897      props = useSelectList(_3YLGPPWQ_spreadValues({ store, alwaysVisible }, props));
48898      props = usePopover(_3YLGPPWQ_spreadValues({ store, alwaysVisible }, props));
48899      return props;
48900    }
48901  );
48902  var SelectPopover = createDialogComponent(
48903    forwardRef2(function SelectPopover2(props) {
48904      const htmlProps = useSelectPopover(props);
48905      return HKOOKEDE_createElement(select_popover_TagName, htmlProps);
48906    }),
48907    useSelectProviderContext
48908  );
48909  
48910  
48911  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/OBZMLI6J.js
48912  "use client";
48913  
48914  
48915  
48916  
48917  
48918  // src/composite/composite-hover.tsx
48919  
48920  
48921  
48922  
48923  var OBZMLI6J_TagName = "div";
48924  function getMouseDestination(event) {
48925    const relatedTarget = event.relatedTarget;
48926    if ((relatedTarget == null ? void 0 : relatedTarget.nodeType) === Node.ELEMENT_NODE) {
48927      return relatedTarget;
48928    }
48929    return null;
48930  }
48931  function hoveringInside(event) {
48932    const nextElement = getMouseDestination(event);
48933    if (!nextElement) return false;
48934    return contains(event.currentTarget, nextElement);
48935  }
48936  var OBZMLI6J_symbol = Symbol("composite-hover");
48937  function movingToAnotherItem(event) {
48938    let dest = getMouseDestination(event);
48939    if (!dest) return false;
48940    do {
48941      if (PBFD2E7P_hasOwnProperty(dest, OBZMLI6J_symbol) && dest[OBZMLI6J_symbol]) return true;
48942      dest = dest.parentElement;
48943    } while (dest);
48944    return false;
48945  }
48946  var useCompositeHover = createHook(
48947    function useCompositeHover2(_a) {
48948      var _b = _a, {
48949        store,
48950        focusOnHover = true,
48951        blurOnHoverEnd = !!focusOnHover
48952      } = _b, props = __objRest(_b, [
48953        "store",
48954        "focusOnHover",
48955        "blurOnHoverEnd"
48956      ]);
48957      const context = useCompositeContext();
48958      store = store || context;
48959      invariant(
48960        store,
48961         false && 0
48962      );
48963      const isMouseMoving = useIsMouseMoving();
48964      const onMouseMoveProp = props.onMouseMove;
48965      const focusOnHoverProp = useBooleanEvent(focusOnHover);
48966      const onMouseMove = useEvent((event) => {
48967        onMouseMoveProp == null ? void 0 : onMouseMoveProp(event);
48968        if (event.defaultPrevented) return;
48969        if (!isMouseMoving()) return;
48970        if (!focusOnHoverProp(event)) return;
48971        if (!hasFocusWithin(event.currentTarget)) {
48972          const baseElement = store == null ? void 0 : store.getState().baseElement;
48973          if (baseElement && !hasFocus(baseElement)) {
48974            baseElement.focus();
48975          }
48976        }
48977        store == null ? void 0 : store.setActiveId(event.currentTarget.id);
48978      });
48979      const onMouseLeaveProp = props.onMouseLeave;
48980      const blurOnHoverEndProp = useBooleanEvent(blurOnHoverEnd);
48981      const onMouseLeave = useEvent((event) => {
48982        var _a2;
48983        onMouseLeaveProp == null ? void 0 : onMouseLeaveProp(event);
48984        if (event.defaultPrevented) return;
48985        if (!isMouseMoving()) return;
48986        if (hoveringInside(event)) return;
48987        if (movingToAnotherItem(event)) return;
48988        if (!focusOnHoverProp(event)) return;
48989        if (!blurOnHoverEndProp(event)) return;
48990        store == null ? void 0 : store.setActiveId(null);
48991        (_a2 = store == null ? void 0 : store.getState().baseElement) == null ? void 0 : _a2.focus();
48992      });
48993      const ref = (0,external_React_.useCallback)((element) => {
48994        if (!element) return;
48995        element[OBZMLI6J_symbol] = true;
48996      }, []);
48997      props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, props), {
48998        ref: useMergeRefs(ref, props.ref),
48999        onMouseMove,
49000        onMouseLeave
49001      });
49002      return removeUndefinedValues(props);
49003    }
49004  );
49005  var OBZMLI6J_CompositeHover = memo2(
49006    forwardRef2(function CompositeHover2(props) {
49007      const htmlProps = useCompositeHover(props);
49008      return HKOOKEDE_createElement(OBZMLI6J_TagName, htmlProps);
49009    })
49010  );
49011  
49012  
49013  
49014  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/select/select-item.js
49015  "use client";
49016  
49017  
49018  
49019  
49020  
49021  
49022  
49023  
49024  
49025  
49026  
49027  
49028  
49029  
49030  
49031  
49032  
49033  
49034  
49035  // src/select/select-item.tsx
49036  
49037  
49038  
49039  
49040  
49041  var select_item_TagName = "div";
49042  function isSelected(storeValue, itemValue) {
49043    if (itemValue == null) return;
49044    if (storeValue == null) return false;
49045    if (Array.isArray(storeValue)) {
49046      return storeValue.includes(itemValue);
49047    }
49048    return storeValue === itemValue;
49049  }
49050  var useSelectItem = createHook(
49051    function useSelectItem2(_a) {
49052      var _b = _a, {
49053        store,
49054        value,
49055        getItem: getItemProp,
49056        hideOnClick,
49057        setValueOnClick = value != null,
49058        preventScrollOnKeyDown = true,
49059        focusOnHover = true
49060      } = _b, props = __objRest(_b, [
49061        "store",
49062        "value",
49063        "getItem",
49064        "hideOnClick",
49065        "setValueOnClick",
49066        "preventScrollOnKeyDown",
49067        "focusOnHover"
49068      ]);
49069      var _a2;
49070      const context = useSelectScopedContext();
49071      store = store || context;
49072      invariant(
49073        store,
49074         false && 0
49075      );
49076      const id = useId(props.id);
49077      const disabled = disabledFromProps(props);
49078      const getItem = (0,external_React_.useCallback)(
49079        (item) => {
49080          const nextItem = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, item), {
49081            value: disabled ? void 0 : value,
49082            children: value
49083          });
49084          if (getItemProp) {
49085            return getItemProp(nextItem);
49086          }
49087          return nextItem;
49088        },
49089        [disabled, value, getItemProp]
49090      );
49091      const multiSelectable = store.useState(
49092        (state) => Array.isArray(state.value)
49093      );
49094      hideOnClick = hideOnClick != null ? hideOnClick : value != null && !multiSelectable;
49095      const onClickProp = props.onClick;
49096      const setValueOnClickProp = useBooleanEvent(setValueOnClick);
49097      const hideOnClickProp = useBooleanEvent(hideOnClick);
49098      const onClick = useEvent((event) => {
49099        onClickProp == null ? void 0 : onClickProp(event);
49100        if (event.defaultPrevented) return;
49101        if (isDownloading(event)) return;
49102        if (isOpeningInNewTab(event)) return;
49103        if (setValueOnClickProp(event) && value != null) {
49104          store == null ? void 0 : store.setValue((prevValue) => {
49105            if (!Array.isArray(prevValue)) return value;
49106            if (prevValue.includes(value)) {
49107              return prevValue.filter((v) => v !== value);
49108            }
49109            return [...prevValue, value];
49110          });
49111        }
49112        if (hideOnClickProp(event)) {
49113          store == null ? void 0 : store.hide();
49114        }
49115      });
49116      const selected = store.useState((state) => isSelected(state.value, value));
49117      props = useWrapElement(
49118        props,
49119        (element) => /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(SelectItemCheckedContext.Provider, { value: selected != null ? selected : false, children: element }),
49120        [selected]
49121      );
49122      const listElement = store.useState("listElement");
49123      const autoFocus = store.useState((state) => {
49124        if (value == null) return false;
49125        if (state.value == null) return false;
49126        if (state.activeId !== id && (store == null ? void 0 : store.item(state.activeId))) return false;
49127        if (Array.isArray(state.value)) {
49128          return state.value[state.value.length - 1] === value;
49129        }
49130        return state.value === value;
49131      });
49132      props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({
49133        id,
49134        role: getPopupItemRole(listElement),
49135        "aria-selected": selected,
49136        children: value
49137      }, props), {
49138        autoFocus: (_a2 = props.autoFocus) != null ? _a2 : autoFocus,
49139        onClick
49140      });
49141      props = useCompositeItem(_3YLGPPWQ_spreadValues({
49142        store,
49143        getItem,
49144        preventScrollOnKeyDown
49145      }, props));
49146      const focusOnHoverProp = useBooleanEvent(focusOnHover);
49147      props = useCompositeHover(_3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({
49148        store
49149      }, props), {
49150        // We have to disable focusOnHover when the popup is closed, otherwise
49151        // the active item will change to null (the container) when the popup is
49152        // closed by clicking on an item.
49153        focusOnHover(event) {
49154          if (!focusOnHoverProp(event)) return false;
49155          const state = store == null ? void 0 : store.getState();
49156          return !!(state == null ? void 0 : state.open);
49157        }
49158      }));
49159      return props;
49160    }
49161  );
49162  var SelectItem = memo2(
49163    forwardRef2(function SelectItem2(props) {
49164      const htmlProps = useSelectItem(props);
49165      return HKOOKEDE_createElement(select_item_TagName, htmlProps);
49166    })
49167  );
49168  
49169  
49170  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/EYKMH5G5.js
49171  "use client";
49172  
49173  // src/checkbox/checkbox-checked-context.tsx
49174  
49175  var CheckboxCheckedContext = (0,external_React_.createContext)(false);
49176  
49177  
49178  
49179  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/RPLYUYNN.js
49180  "use client";
49181  
49182  
49183  
49184  
49185  // src/checkbox/checkbox-check.tsx
49186  
49187  
49188  
49189  var RPLYUYNN_TagName = "span";
49190  var checkmark = /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(
49191    "svg",
49192    {
49193      display: "block",
49194      fill: "none",
49195      stroke: "currentColor",
49196      strokeLinecap: "round",
49197      strokeLinejoin: "round",
49198      strokeWidth: 1.5,
49199      viewBox: "0 0 16 16",
49200      height: "1em",
49201      width: "1em",
49202      children: /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)("polyline", { points: "4,8 7,12 12,4" })
49203    }
49204  );
49205  function getChildren(props) {
49206    if (props.checked) {
49207      return props.children || checkmark;
49208    }
49209    if (typeof props.children === "function") {
49210      return props.children;
49211    }
49212    return null;
49213  }
49214  var useCheckboxCheck = createHook(
49215    function useCheckboxCheck2(_a) {
49216      var _b = _a, { store, checked } = _b, props = __objRest(_b, ["store", "checked"]);
49217      const context = (0,external_React_.useContext)(CheckboxCheckedContext);
49218      checked = checked != null ? checked : context;
49219      const children = getChildren({ checked, children: props.children });
49220      props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({
49221        "aria-hidden": true
49222      }, props), {
49223        children,
49224        style: _3YLGPPWQ_spreadValues({
49225          width: "1em",
49226          height: "1em",
49227          pointerEvents: "none"
49228        }, props.style)
49229      });
49230      return removeUndefinedValues(props);
49231    }
49232  );
49233  var CheckboxCheck = forwardRef2(function CheckboxCheck2(props) {
49234    const htmlProps = useCheckboxCheck(props);
49235    return HKOOKEDE_createElement(RPLYUYNN_TagName, htmlProps);
49236  });
49237  
49238  
49239  
49240  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/select/select-item-check.js
49241  "use client";
49242  
49243  
49244  
49245  
49246  
49247  
49248  
49249  
49250  
49251  
49252  
49253  
49254  
49255  // src/select/select-item-check.tsx
49256  
49257  var select_item_check_TagName = "span";
49258  var useSelectItemCheck = createHook(
49259    function useSelectItemCheck2(_a) {
49260      var _b = _a, { store, checked } = _b, props = __objRest(_b, ["store", "checked"]);
49261      const context = (0,external_React_.useContext)(SelectItemCheckedContext);
49262      checked = checked != null ? checked : context;
49263      props = useCheckboxCheck(_3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, props), { checked }));
49264      return props;
49265    }
49266  );
49267  var SelectItemCheck = forwardRef2(function SelectItemCheck2(props) {
49268    const htmlProps = useSelectItemCheck(props);
49269    return HKOOKEDE_createElement(select_item_check_TagName, htmlProps);
49270  });
49271  
49272  
49273  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/custom-select-control-v2/styles.js
49274  
49275  function custom_select_control_v2_styles_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)."; }
49276  /**
49277   * External dependencies
49278   */
49279  
49280  
49281  /**
49282   * Internal dependencies
49283   */
49284  
49285  
49286  
49287  
49288  // TODO: extract to common utils and apply to relevant components
49289  const ANIMATION_PARAMS = {
49290    SLIDE_AMOUNT: '2px',
49291    DURATION: '400ms',
49292    EASING: 'cubic-bezier( 0.16, 1, 0.3, 1 )'
49293  };
49294  const INLINE_PADDING = {
49295    compact: config_values.controlPaddingXSmall,
49296    small: config_values.controlPaddingXSmall,
49297    default: config_values.controlPaddingX
49298  };
49299  const getSelectSize = (size, heightProperty) => {
49300    const sizes = {
49301      compact: {
49302        [heightProperty]: 32,
49303        paddingInlineStart: INLINE_PADDING.compact,
49304        paddingInlineEnd: INLINE_PADDING.compact + chevronIconSize
49305      },
49306      default: {
49307        [heightProperty]: 40,
49308        paddingInlineStart: INLINE_PADDING.default,
49309        paddingInlineEnd: INLINE_PADDING.default + chevronIconSize
49310      },
49311      small: {
49312        [heightProperty]: 24,
49313        paddingInlineStart: INLINE_PADDING.small,
49314        paddingInlineEnd: INLINE_PADDING.small + chevronIconSize
49315      }
49316    };
49317    return sizes[size] || sizes.default;
49318  };
49319  const getSelectItemSize = size => {
49320    // Used to visually align the checkmark with the chevron
49321    const checkmarkCorrection = 6;
49322    const sizes = {
49323      compact: {
49324        paddingInlineStart: INLINE_PADDING.compact,
49325        paddingInlineEnd: INLINE_PADDING.compact - checkmarkCorrection
49326      },
49327      default: {
49328        paddingInlineStart: INLINE_PADDING.default,
49329        paddingInlineEnd: INLINE_PADDING.default - checkmarkCorrection
49330      },
49331      small: {
49332        paddingInlineStart: INLINE_PADDING.small,
49333        paddingInlineEnd: INLINE_PADDING.small - checkmarkCorrection
49334      }
49335    };
49336    return sizes[size] || sizes.default;
49337  };
49338  const styles_Select = /*#__PURE__*/emotion_styled_base_browser_esm(select_Select,  true ? {
49339    // Do not forward `hasCustomRenderProp` to the underlying Ariakit.Select component
49340    shouldForwardProp: prop => prop !== 'hasCustomRenderProp',
49341    target: "e1p3eej77"
49342  } : 0)(({
49343    size,
49344    hasCustomRenderProp
49345  }) => /*#__PURE__*/emotion_react_browser_esm_css("display:block;background-color:", COLORS.theme.background, ";border:none;color:", COLORS.theme.foreground, ";cursor:pointer;font-family:inherit;text-align:start;user-select:none;width:100%;&[data-focus-visible]{outline:none;}", getSelectSize(size, hasCustomRenderProp ? 'minHeight' : 'height'), " ", !hasCustomRenderProp && truncateStyles, " ", fontSizeStyles({
49346    inputSize: size
49347  }), ";" + ( true ? "" : 0),  true ? "" : 0),  true ? "" : 0);
49348  const slideDownAndFade = emotion_react_browser_esm_keyframes({
49349    '0%': {
49350      opacity: 0,
49351      transform: `translateY(-$ANIMATION_PARAMS.SLIDE_AMOUNT})`
49352    },
49353    '100%': {
49354      opacity: 1,
49355      transform: 'translateY(0)'
49356    }
49357  });
49358  const styles_SelectPopover = /*#__PURE__*/emotion_styled_base_browser_esm(SelectPopover,  true ? {
49359    target: "e1p3eej76"
49360  } : 0)("display:flex;flex-direction:column;background-color:", COLORS.theme.background, ";border-radius:", config_values.radiusSmall, ";border:1px solid ", COLORS.theme.foreground, ";box-shadow:", config_values.elevationMedium, ";z-index:1000000;max-height:min( var( --popover-available-height, 400px ), 400px );overflow:auto;overscroll-behavior:contain;min-width:min-content;&[data-open]{@media not ( prefers-reduced-motion ){animation-duration:", ANIMATION_PARAMS.DURATION, ";animation-timing-function:", ANIMATION_PARAMS.EASING, ";animation-name:", slideDownAndFade, ";will-change:transform,opacity;}}&[data-focus-visible]{outline:none;}" + ( true ? "" : 0));
49361  const styles_SelectItem = /*#__PURE__*/emotion_styled_base_browser_esm(SelectItem,  true ? {
49362    target: "e1p3eej75"
49363  } : 0)(({
49364    size
49365  }) => /*#__PURE__*/emotion_react_browser_esm_css("cursor:default;display:flex;align-items:center;justify-content:space-between;font-size:", config_values.fontSize, ";line-height:28px;padding-block:", space(2), ";scroll-margin:", space(1), ";user-select:none;&[aria-disabled='true']{cursor:not-allowed;}&[data-active-item]{background-color:", COLORS.theme.gray[300], ";}", getSelectItemSize(size), ";" + ( true ? "" : 0),  true ? "" : 0),  true ? "" : 0);
49366  const truncateStyles =  true ? {
49367    name: "1h52dri",
49368    styles: "overflow:hidden;text-overflow:ellipsis;white-space:nowrap"
49369  } : 0;
49370  const SelectedExperimentalHintWrapper = /*#__PURE__*/emotion_styled_base_browser_esm("div",  true ? {
49371    target: "e1p3eej74"
49372  } : 0)(truncateStyles, ";" + ( true ? "" : 0));
49373  const SelectedExperimentalHintItem = /*#__PURE__*/emotion_styled_base_browser_esm("span",  true ? {
49374    target: "e1p3eej73"
49375  } : 0)("color:", COLORS.theme.gray[600], ";margin-inline-start:", space(2), ";" + ( true ? "" : 0));
49376  const WithHintItemWrapper = /*#__PURE__*/emotion_styled_base_browser_esm("div",  true ? {
49377    target: "e1p3eej72"
49378  } : 0)("display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;flex:1;column-gap:", space(4), ";" + ( true ? "" : 0));
49379  const WithHintItemHint = /*#__PURE__*/emotion_styled_base_browser_esm("span",  true ? {
49380    target: "e1p3eej71"
49381  } : 0)("color:", COLORS.theme.gray[600], ";text-align:initial;line-height:", config_values.fontLineHeightBase, ";padding-inline-end:", space(1), ";margin-block:", space(1), ";" + ( true ? "" : 0));
49382  const SelectedItemCheck = /*#__PURE__*/emotion_styled_base_browser_esm(SelectItemCheck,  true ? {
49383    target: "e1p3eej70"
49384  } : 0)("display:flex;align-items:center;margin-inline-start:", space(2), ";align-self:start;margin-block-start:2px;font-size:0;", WithHintItemWrapper, "~&,&:not(:empty){font-size:24px;}" + ( true ? "" : 0));
49385  
49386  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/custom-select-control-v2/custom-select.js
49387  /**
49388   * External dependencies
49389   */
49390  
49391  
49392  
49393  /**
49394   * WordPress dependencies
49395   */
49396  
49397  
49398  
49399  /**
49400   * Internal dependencies
49401   */
49402  
49403  
49404  
49405  
49406  
49407  
49408  
49409  const CustomSelectContext = (0,external_wp_element_namespaceObject.createContext)(undefined);
49410  function defaultRenderSelectedValue(value) {
49411    const isValueEmpty = Array.isArray(value) ? value.length === 0 : value === undefined || value === null;
49412    if (isValueEmpty) {
49413      return (0,external_wp_i18n_namespaceObject.__)('Select an item');
49414    }
49415    if (Array.isArray(value)) {
49416      return value.length === 1 ? value[0] :
49417      // translators: %s: number of items selected (it will always be 2 or more items)
49418      (0,external_wp_i18n_namespaceObject.sprintf)((0,external_wp_i18n_namespaceObject.__)('%s items selected'), value.length);
49419    }
49420    return value;
49421  }
49422  const CustomSelectButton = ({
49423    renderSelectedValue,
49424    size = 'default',
49425    store,
49426    ...restProps
49427  }) => {
49428    const {
49429      value: currentValue
49430    } = useStoreState(store);
49431    const computedRenderSelectedValue = (0,external_wp_element_namespaceObject.useMemo)(() => renderSelectedValue !== null && renderSelectedValue !== void 0 ? renderSelectedValue : defaultRenderSelectedValue, [renderSelectedValue]);
49432    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(styles_Select, {
49433      ...restProps,
49434      size: size,
49435      hasCustomRenderProp: !!renderSelectedValue,
49436      store: store,
49437      children: computedRenderSelectedValue(currentValue)
49438    });
49439  };
49440  function _CustomSelect(props) {
49441    const {
49442      children,
49443      hideLabelFromVision = false,
49444      label,
49445      size,
49446      store,
49447      className,
49448      isLegacy = false,
49449      ...restProps
49450    } = props;
49451    const onSelectPopoverKeyDown = (0,external_wp_element_namespaceObject.useCallback)(e => {
49452      if (isLegacy) {
49453        e.stopPropagation();
49454      }
49455    }, [isLegacy]);
49456    const contextValue = (0,external_wp_element_namespaceObject.useMemo)(() => ({
49457      store,
49458      size
49459    }), [store, size]);
49460    return (
49461      /*#__PURE__*/
49462      // Where should `restProps` be forwarded to?
49463      (0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", {
49464        className: className,
49465        children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(SelectLabel, {
49466          store: store,
49467          render: hideLabelFromVision ?
49468          /*#__PURE__*/
49469          // @ts-expect-error `children` are passed via the render prop
49470          (0,external_ReactJSXRuntime_namespaceObject.jsx)(visually_hidden_component, {}) :
49471          /*#__PURE__*/
49472          // @ts-expect-error `children` are passed via the render prop
49473          (0,external_ReactJSXRuntime_namespaceObject.jsx)(base_control.VisualLabel, {
49474            as: "div"
49475          }),
49476          children: label
49477        }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(input_base, {
49478          __next40pxDefaultSize: true,
49479          size: size,
49480          suffix: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(select_control_chevron_down, {}),
49481          children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(CustomSelectButton, {
49482            ...restProps,
49483            size: size,
49484            store: store
49485            // Match legacy behavior (move selection rather than open the popover)
49486            ,
49487            showOnKeyDown: !isLegacy
49488          }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(styles_SelectPopover, {
49489            gutter: 12,
49490            store: store,
49491            sameWidth: true,
49492            slide: false,
49493            onKeyDown: onSelectPopoverKeyDown
49494            // Match legacy behavior
49495            ,
49496            flip: !isLegacy,
49497            children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(CustomSelectContext.Provider, {
49498              value: contextValue,
49499              children: children
49500            })
49501          })]
49502        })]
49503      })
49504    );
49505  }
49506  /* harmony default export */ const custom_select = (_CustomSelect);
49507  
49508  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/custom-select-control-v2/item.js
49509  /**
49510   * WordPress dependencies
49511   */
49512  
49513  
49514  /**
49515   * Internal dependencies
49516   */
49517  
49518  
49519  
49520  
49521  
49522  function CustomSelectItem({
49523    children,
49524    ...props
49525  }) {
49526    var _customSelectContext$;
49527    const customSelectContext = (0,external_wp_element_namespaceObject.useContext)(CustomSelectContext);
49528    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(styles_SelectItem, {
49529      store: customSelectContext?.store,
49530      size: (_customSelectContext$ = customSelectContext?.size) !== null && _customSelectContext$ !== void 0 ? _customSelectContext$ : 'default',
49531      ...props,
49532      children: [children !== null && children !== void 0 ? children : props.value, /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(SelectedItemCheck, {
49533        children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(icons_build_module_icon, {
49534          icon: library_check
49535        })
49536      })]
49537    });
49538  }
49539  CustomSelectItem.displayName = 'CustomSelectControlV2.Item';
49540  /* harmony default export */ const custom_select_control_v2_item = (CustomSelectItem);
49541  
49542  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/custom-select-control/index.js
49543  /**
49544   * External dependencies
49545   */
49546  
49547  
49548  
49549  /**
49550   * WordPress dependencies
49551   */
49552  
49553  
49554  
49555  /**
49556   * Internal dependencies
49557   */
49558  
49559  
49560  
49561  
49562  
49563  
49564  
49565  function custom_select_control_useDeprecatedProps({
49566    __experimentalShowSelectedHint,
49567    ...otherProps
49568  }) {
49569    return {
49570      showSelectedHint: __experimentalShowSelectedHint,
49571      ...otherProps
49572    };
49573  }
49574  
49575  // The removal of `__experimentalHint` in favour of `hint` doesn't happen in
49576  // the `useDeprecatedProps` hook in order not to break consumers that rely
49577  // on object identity (see https://github.com/WordPress/gutenberg/pull/63248#discussion_r1672213131)
49578  function applyOptionDeprecations({
49579    __experimentalHint,
49580    ...rest
49581  }) {
49582    return {
49583      hint: __experimentalHint,
49584      ...rest
49585    };
49586  }
49587  function getDescribedBy(currentValue, describedBy) {
49588    if (describedBy) {
49589      return describedBy;
49590    }
49591  
49592    // translators: %s: The selected option.
49593    return (0,external_wp_i18n_namespaceObject.sprintf)((0,external_wp_i18n_namespaceObject.__)('Currently selected: %s'), currentValue);
49594  }
49595  function CustomSelectControl(props) {
49596    const {
49597      __next40pxDefaultSize = false,
49598      describedBy,
49599      options,
49600      onChange,
49601      size = 'default',
49602      value,
49603      className: classNameProp,
49604      showSelectedHint = false,
49605      ...restProps
49606    } = custom_select_control_useDeprecatedProps(props);
49607    const descriptionId = (0,external_wp_compose_namespaceObject.useInstanceId)(CustomSelectControl, 'custom-select-control__description');
49608  
49609    // Forward props + store from v2 implementation
49610    const store = useSelectStore({
49611      async setValue(nextValue) {
49612        const nextOption = options.find(item => item.name === nextValue);
49613        if (!onChange || !nextOption) {
49614          return;
49615        }
49616  
49617        // Executes the logic in a microtask after the popup is closed.
49618        // This is simply to ensure the isOpen state matches the one from the
49619        // previous legacy implementation.
49620        await Promise.resolve();
49621        const state = store.getState();
49622        const changeObject = {
49623          highlightedIndex: state.renderedItems.findIndex(item => item.value === nextValue),
49624          inputValue: '',
49625          isOpen: state.open,
49626          selectedItem: nextOption,
49627          type: ''
49628        };
49629        onChange(changeObject);
49630      },
49631      value: value?.name,
49632      // Setting the first option as a default value when no value is provided
49633      // is already done natively by the underlying Ariakit component,
49634      // but doing this explicitly avoids the `onChange` callback from firing
49635      // on initial render, thus making this implementation closer to the v1.
49636      defaultValue: options[0]?.name
49637    });
49638    const children = options.map(applyOptionDeprecations).map(({
49639      name,
49640      key,
49641      hint,
49642      style,
49643      className
49644    }) => {
49645      const withHint = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(WithHintItemWrapper, {
49646        children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", {
49647          children: name
49648        }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(WithHintItemHint, {
49649          // Keeping the classname for legacy reasons
49650          className: "components-custom-select-control__item-hint",
49651          children: hint
49652        })]
49653      });
49654      return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(custom_select_control_v2_item, {
49655        value: name,
49656        children: hint ? withHint : name,
49657        style: style,
49658        className: dist_clsx(className,
49659        // Keeping the classnames for legacy reasons
49660        'components-custom-select-control__item', {
49661          'has-hint': hint
49662        })
49663      }, key);
49664    });
49665    const {
49666      value: currentValue
49667    } = store.getState();
49668    const renderSelectedValueHint = () => {
49669      const selectedOptionHint = options?.map(applyOptionDeprecations)?.find(({
49670        name
49671      }) => currentValue === name)?.hint;
49672      return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(SelectedExperimentalHintWrapper, {
49673        children: [currentValue, selectedOptionHint && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(SelectedExperimentalHintItem, {
49674          // Keeping the classname for legacy reasons
49675          className: "components-custom-select-control__hint",
49676          children: selectedOptionHint
49677        })]
49678      });
49679    };
49680    const translatedSize = (() => {
49681      if (__next40pxDefaultSize && size === 'default' || size === '__unstable-large') {
49682        return 'default';
49683      }
49684      if (!__next40pxDefaultSize && size === 'default') {
49685        return 'compact';
49686      }
49687      return size;
49688    })();
49689    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, {
49690      children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(custom_select, {
49691        "aria-describedby": descriptionId,
49692        renderSelectedValue: showSelectedHint ? renderSelectedValueHint : undefined,
49693        size: translatedSize,
49694        store: store,
49695        className: dist_clsx(
49696        // Keeping the classname for legacy reasons
49697        'components-custom-select-control', classNameProp),
49698        isLegacy: true,
49699        ...restProps,
49700        children: children
49701      }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(visually_hidden_component, {
49702        children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", {
49703          id: descriptionId,
49704          children: getDescribedBy(currentValue, describedBy)
49705        })
49706      })]
49707    });
49708  }
49709  /* harmony default export */ const custom_select_control = (CustomSelectControl);
49710  
49711  ;// CONCATENATED MODULE: ./node_modules/date-fns/toDate.mjs
49712  /**
49713   * @name toDate
49714   * @category Common Helpers
49715   * @summary Convert the given argument to an instance of Date.
49716   *
49717   * @description
49718   * Convert the given argument to an instance of Date.
49719   *
49720   * If the argument is an instance of Date, the function returns its clone.
49721   *
49722   * If the argument is a number, it is treated as a timestamp.
49723   *
49724   * If the argument is none of the above, the function returns Invalid Date.
49725   *
49726   * **Note**: *all* Date arguments passed to any *date-fns* function is processed by `toDate`.
49727   *
49728   * @typeParam DateType - The `Date` type, the function operates on. Gets inferred from passed arguments. Allows to use extensions like [`UTCDate`](https://github.com/date-fns/utc).
49729   *
49730   * @param argument - The value to convert
49731   *
49732   * @returns The parsed date in the local time zone
49733   *
49734   * @example
49735   * // Clone the date:
49736   * const result = toDate(new Date(2014, 1, 11, 11, 30, 30))
49737   * //=> Tue Feb 11 2014 11:30:30
49738   *
49739   * @example
49740   * // Convert the timestamp to date:
49741   * const result = toDate(1392098430000)
49742   * //=> Tue Feb 11 2014 11:30:30
49743   */
49744  function toDate(argument) {
49745    const argStr = Object.prototype.toString.call(argument);
49746  
49747    // Clone the date
49748    if (
49749      argument instanceof Date ||
49750      (typeof argument === "object" && argStr === "[object Date]")
49751    ) {
49752      // Prevent the date to lose the milliseconds when passed to new Date() in IE10
49753      return new argument.constructor(+argument);
49754    } else if (
49755      typeof argument === "number" ||
49756      argStr === "[object Number]" ||
49757      typeof argument === "string" ||
49758      argStr === "[object String]"
49759    ) {
49760      // TODO: Can we get rid of as?
49761      return new Date(argument);
49762    } else {
49763      // TODO: Can we get rid of as?
49764      return new Date(NaN);
49765    }
49766  }
49767  
49768  // Fallback for modularized imports:
49769  /* harmony default export */ const date_fns_toDate = ((/* unused pure expression or super */ null && (toDate)));
49770  
49771  ;// CONCATENATED MODULE: ./node_modules/date-fns/startOfDay.mjs
49772  
49773  
49774  /**
49775   * @name startOfDay
49776   * @category Day Helpers
49777   * @summary Return the start of a day for the given date.
49778   *
49779   * @description
49780   * Return the start of a day for the given date.
49781   * The result will be in the local timezone.
49782   *
49783   * @typeParam DateType - The `Date` type, the function operates on. Gets inferred from passed arguments. Allows to use extensions like [`UTCDate`](https://github.com/date-fns/utc).
49784   *
49785   * @param date - The original date
49786   *
49787   * @returns The start of a day
49788   *
49789   * @example
49790   * // The start of a day for 2 September 2014 11:55:00:
49791   * const result = startOfDay(new Date(2014, 8, 2, 11, 55, 0))
49792   * //=> Tue Sep 02 2014 00:00:00
49793   */
49794  function startOfDay(date) {
49795    const _date = toDate(date);
49796    _date.setHours(0, 0, 0, 0);
49797    return _date;
49798  }
49799  
49800  // Fallback for modularized imports:
49801  /* harmony default export */ const date_fns_startOfDay = ((/* unused pure expression or super */ null && (startOfDay)));
49802  
49803  ;// CONCATENATED MODULE: ./node_modules/date-fns/constructFrom.mjs
49804  /**
49805   * @name constructFrom
49806   * @category Generic Helpers
49807   * @summary Constructs a date using the reference date and the value
49808   *
49809   * @description
49810   * The function constructs a new date using the constructor from the reference
49811   * date and the given value. It helps to build generic functions that accept
49812   * date extensions.
49813   *
49814   * It defaults to `Date` if the passed reference date is a number or a string.
49815   *
49816   * @typeParam DateType - The `Date` type, the function operates on. Gets inferred from passed arguments. Allows to use extensions like [`UTCDate`](https://github.com/date-fns/utc).
49817   *
49818   * @param date - The reference date to take constructor from
49819   * @param value - The value to create the date
49820   *
49821   * @returns Date initialized using the given date and value
49822   *
49823   * @example
49824   * import { constructFrom } from 'date-fns'
49825   *
49826   * // A function that clones a date preserving the original type
49827   * function cloneDate<DateType extends Date(date: DateType): DateType {
49828   *   return constructFrom(
49829   *     date, // Use contrustor from the given date
49830   *     date.getTime() // Use the date value to create a new date
49831   *   )
49832   * }
49833   */
49834  function constructFrom(date, value) {
49835    if (date instanceof Date) {
49836      return new date.constructor(value);
49837    } else {
49838      return new Date(value);
49839    }
49840  }
49841  
49842  // Fallback for modularized imports:
49843  /* harmony default export */ const date_fns_constructFrom = ((/* unused pure expression or super */ null && (constructFrom)));
49844  
49845  ;// CONCATENATED MODULE: ./node_modules/date-fns/addMonths.mjs
49846  
49847  
49848  
49849  /**
49850   * @name addMonths
49851   * @category Month Helpers
49852   * @summary Add the specified number of months to the given date.
49853   *
49854   * @description
49855   * Add the specified number of months to the given date.
49856   *
49857   * @typeParam DateType - The `Date` type, the function operates on. Gets inferred from passed arguments. Allows to use extensions like [`UTCDate`](https://github.com/date-fns/utc).
49858   *
49859   * @param date - The date to be changed
49860   * @param amount - The amount of months to be added.
49861   *
49862   * @returns The new date with the months added
49863   *
49864   * @example
49865   * // Add 5 months to 1 September 2014:
49866   * const result = addMonths(new Date(2014, 8, 1), 5)
49867   * //=> Sun Feb 01 2015 00:00:00
49868   *
49869   * // Add one month to 30 January 2023:
49870   * const result = addMonths(new Date(2023, 0, 30), 1)
49871   * //=> Tue Feb 28 2023 00:00:00
49872   */
49873  function addMonths(date, amount) {
49874    const _date = toDate(date);
49875    if (isNaN(amount)) return constructFrom(date, NaN);
49876    if (!amount) {
49877      // If 0 months, no-op to avoid changing times in the hour before end of DST
49878      return _date;
49879    }
49880    const dayOfMonth = _date.getDate();
49881  
49882    // The JS Date object supports date math by accepting out-of-bounds values for
49883    // month, day, etc. For example, new Date(2020, 0, 0) returns 31 Dec 2019 and
49884    // new Date(2020, 13, 1) returns 1 Feb 2021.  This is *almost* the behavior we
49885    // want except that dates will wrap around the end of a month, meaning that
49886    // new Date(2020, 13, 31) will return 3 Mar 2021 not 28 Feb 2021 as desired. So
49887    // we'll default to the end of the desired month by adding 1 to the desired
49888    // month and using a date of 0 to back up one day to the end of the desired
49889    // month.
49890    const endOfDesiredMonth = constructFrom(date, _date.getTime());
49891    endOfDesiredMonth.setMonth(_date.getMonth() + amount + 1, 0);
49892    const daysInMonth = endOfDesiredMonth.getDate();
49893    if (dayOfMonth >= daysInMonth) {
49894      // If we're already at the end of the month, then this is the correct date
49895      // and we're done.
49896      return endOfDesiredMonth;
49897    } else {
49898      // Otherwise, we now know that setting the original day-of-month value won't
49899      // cause an overflow, so set the desired day-of-month. Note that we can't
49900      // just set the date of `endOfDesiredMonth` because that object may have had
49901      // its time changed in the unusual case where where a DST transition was on
49902      // the last day of the month and its local time was in the hour skipped or
49903      // repeated next to a DST transition.  So we use `date` instead which is
49904      // guaranteed to still have the original time.
49905      _date.setFullYear(
49906        endOfDesiredMonth.getFullYear(),
49907        endOfDesiredMonth.getMonth(),
49908        dayOfMonth,
49909      );
49910      return _date;
49911    }
49912  }
49913  
49914  // Fallback for modularized imports:
49915  /* harmony default export */ const date_fns_addMonths = ((/* unused pure expression or super */ null && (addMonths)));
49916  
49917  ;// CONCATENATED MODULE: ./node_modules/date-fns/subMonths.mjs
49918  
49919  
49920  /**
49921   * @name subMonths
49922   * @category Month Helpers
49923   * @summary Subtract the specified number of months from the given date.
49924   *
49925   * @description
49926   * Subtract the specified number of months from the given date.
49927   *
49928   * @typeParam DateType - The `Date` type, the function operates on. Gets inferred from passed arguments. Allows to use extensions like [`UTCDate`](https://github.com/date-fns/utc).
49929   *
49930   * @param date - The date to be changed
49931   * @param amount - The amount of months to be subtracted.
49932   *
49933   * @returns The new date with the months subtracted
49934   *
49935   * @example
49936   * // Subtract 5 months from 1 February 2015:
49937   * const result = subMonths(new Date(2015, 1, 1), 5)
49938   * //=> Mon Sep 01 2014 00:00:00
49939   */
49940  function subMonths(date, amount) {
49941    return addMonths(date, -amount);
49942  }
49943  
49944  // Fallback for modularized imports:
49945  /* harmony default export */ const date_fns_subMonths = ((/* unused pure expression or super */ null && (subMonths)));
49946  
49947  ;// CONCATENATED MODULE: ./node_modules/date-fns/locale/en-US/_lib/formatDistance.mjs
49948  const formatDistanceLocale = {
49949    lessThanXSeconds: {
49950      one: "less than a second",
49951      other: "less than {{count}} seconds",
49952    },
49953  
49954    xSeconds: {
49955      one: "1 second",
49956      other: "{{count}} seconds",
49957    },
49958  
49959    halfAMinute: "half a minute",
49960  
49961    lessThanXMinutes: {
49962      one: "less than a minute",
49963      other: "less than {{count}} minutes",
49964    },
49965  
49966    xMinutes: {
49967      one: "1 minute",
49968      other: "{{count}} minutes",
49969    },
49970  
49971    aboutXHours: {
49972      one: "about 1 hour",
49973      other: "about {{count}} hours",
49974    },
49975  
49976    xHours: {
49977      one: "1 hour",
49978      other: "{{count}} hours",
49979    },
49980  
49981    xDays: {
49982      one: "1 day",
49983      other: "{{count}} days",
49984    },
49985  
49986    aboutXWeeks: {
49987      one: "about 1 week",
49988      other: "about {{count}} weeks",
49989    },
49990  
49991    xWeeks: {
49992      one: "1 week",
49993      other: "{{count}} weeks",
49994    },
49995  
49996    aboutXMonths: {
49997      one: "about 1 month",
49998      other: "about {{count}} months",
49999    },
50000  
50001    xMonths: {
50002      one: "1 month",
50003      other: "{{count}} months",
50004    },
50005  
50006    aboutXYears: {
50007      one: "about 1 year",
50008      other: "about {{count}} years",
50009    },
50010  
50011    xYears: {
50012      one: "1 year",
50013      other: "{{count}} years",
50014    },
50015  
50016    overXYears: {
50017      one: "over 1 year",
50018      other: "over {{count}} years",
50019    },
50020  
50021    almostXYears: {
50022      one: "almost 1 year",
50023      other: "almost {{count}} years",
50024    },
50025  };
50026  
50027  const formatDistance = (token, count, options) => {
50028    let result;
50029  
50030    const tokenValue = formatDistanceLocale[token];
50031    if (typeof tokenValue === "string") {
50032      result = tokenValue;
50033    } else if (count === 1) {
50034      result = tokenValue.one;
50035    } else {
50036      result = tokenValue.other.replace("{{count}}", count.toString());
50037    }
50038  
50039    if (options?.addSuffix) {
50040      if (options.comparison && options.comparison > 0) {
50041        return "in " + result;
50042      } else {
50043        return result + " ago";
50044      }
50045    }
50046  
50047    return result;
50048  };
50049  
50050  ;// CONCATENATED MODULE: ./node_modules/date-fns/locale/_lib/buildFormatLongFn.mjs
50051  function buildFormatLongFn(args) {
50052    return (options = {}) => {
50053      // TODO: Remove String()
50054      const width = options.width ? String(options.width) : args.defaultWidth;
50055      const format = args.formats[width] || args.formats[args.defaultWidth];
50056      return format;
50057    };
50058  }
50059  
50060  ;// CONCATENATED MODULE: ./node_modules/date-fns/locale/en-US/_lib/formatLong.mjs
50061  
50062  
50063  const dateFormats = {
50064    full: "EEEE, MMMM do, y",
50065    long: "MMMM do, y",
50066    medium: "MMM d, y",
50067    short: "MM/dd/yyyy",
50068  };
50069  
50070  const timeFormats = {
50071    full: "h:mm:ss a zzzz",
50072    long: "h:mm:ss a z",
50073    medium: "h:mm:ss a",
50074    short: "h:mm a",
50075  };
50076  
50077  const dateTimeFormats = {
50078    full: "{{date}} 'at' {{time}}",
50079    long: "{{date}} 'at' {{time}}",
50080    medium: "{{date}}, {{time}}",
50081    short: "{{date}}, {{time}}",
50082  };
50083  
50084  const formatLong = {
50085    date: buildFormatLongFn({
50086      formats: dateFormats,
50087      defaultWidth: "full",
50088    }),
50089  
50090    time: buildFormatLongFn({
50091      formats: timeFormats,
50092      defaultWidth: "full",
50093    }),
50094  
50095    dateTime: buildFormatLongFn({
50096      formats: dateTimeFormats,
50097      defaultWidth: "full",
50098    }),
50099  };
50100  
50101  ;// CONCATENATED MODULE: ./node_modules/date-fns/locale/en-US/_lib/formatRelative.mjs
50102  const formatRelativeLocale = {
50103    lastWeek: "'last' eeee 'at' p",
50104    yesterday: "'yesterday at' p",
50105    today: "'today at' p",
50106    tomorrow: "'tomorrow at' p",
50107    nextWeek: "eeee 'at' p",
50108    other: "P",
50109  };
50110  
50111  const formatRelative = (token, _date, _baseDate, _options) =>
50112    formatRelativeLocale[token];
50113  
50114  ;// CONCATENATED MODULE: ./node_modules/date-fns/locale/_lib/buildLocalizeFn.mjs
50115  /* eslint-disable no-unused-vars */
50116  
50117  /**
50118   * The localize function argument callback which allows to convert raw value to
50119   * the actual type.
50120   *
50121   * @param value - The value to convert
50122   *
50123   * @returns The converted value
50124   */
50125  
50126  /**
50127   * The map of localized values for each width.
50128   */
50129  
50130  /**
50131   * The index type of the locale unit value. It types conversion of units of
50132   * values that don't start at 0 (i.e. quarters).
50133   */
50134  
50135  /**
50136   * Converts the unit value to the tuple of values.
50137   */
50138  
50139  /**
50140   * The tuple of localized era values. The first element represents BC,
50141   * the second element represents AD.
50142   */
50143  
50144  /**
50145   * The tuple of localized quarter values. The first element represents Q1.
50146   */
50147  
50148  /**
50149   * The tuple of localized day values. The first element represents Sunday.
50150   */
50151  
50152  /**
50153   * The tuple of localized month values. The first element represents January.
50154   */
50155  
50156  function buildLocalizeFn(args) {
50157    return (value, options) => {
50158      const context = options?.context ? String(options.context) : "standalone";
50159  
50160      let valuesArray;
50161      if (context === "formatting" && args.formattingValues) {
50162        const defaultWidth = args.defaultFormattingWidth || args.defaultWidth;
50163        const width = options?.width ? String(options.width) : defaultWidth;
50164  
50165        valuesArray =
50166          args.formattingValues[width] || args.formattingValues[defaultWidth];
50167      } else {
50168        const defaultWidth = args.defaultWidth;
50169        const width = options?.width ? String(options.width) : args.defaultWidth;
50170  
50171        valuesArray = args.values[width] || args.values[defaultWidth];
50172      }
50173      const index = args.argumentCallback ? args.argumentCallback(value) : value;
50174  
50175      // @ts-expect-error - For some reason TypeScript just don't want to match it, no matter how hard we try. I challenge you to try to remove it!
50176      return valuesArray[index];
50177    };
50178  }
50179  
50180  ;// CONCATENATED MODULE: ./node_modules/date-fns/locale/en-US/_lib/localize.mjs
50181  
50182  
50183  const eraValues = {
50184    narrow: ["B", "A"],
50185    abbreviated: ["BC", "AD"],
50186    wide: ["Before Christ", "Anno Domini"],
50187  };
50188  
50189  const quarterValues = {
50190    narrow: ["1", "2", "3", "4"],
50191    abbreviated: ["Q1", "Q2", "Q3", "Q4"],
50192    wide: ["1st quarter", "2nd quarter", "3rd quarter", "4th quarter"],
50193  };
50194  
50195  // Note: in English, the names of days of the week and months are capitalized.
50196  // If you are making a new locale based on this one, check if the same is true for the language you're working on.
50197  // Generally, formatted dates should look like they are in the middle of a sentence,
50198  // e.g. in Spanish language the weekdays and months should be in the lowercase.
50199  const monthValues = {
50200    narrow: ["J", "F", "M", "A", "M", "J", "J", "A", "S", "O", "N", "D"],
50201    abbreviated: [
50202      "Jan",
50203      "Feb",
50204      "Mar",
50205      "Apr",
50206      "May",
50207      "Jun",
50208      "Jul",
50209      "Aug",
50210      "Sep",
50211      "Oct",
50212      "Nov",
50213      "Dec",
50214    ],
50215  
50216    wide: [
50217      "January",
50218      "February",
50219      "March",
50220      "April",
50221      "May",
50222      "June",
50223      "July",
50224      "August",
50225      "September",
50226      "October",
50227      "November",
50228      "December",
50229    ],
50230  };
50231  
50232  const dayValues = {
50233    narrow: ["S", "M", "T", "W", "T", "F", "S"],
50234    short: ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"],
50235    abbreviated: ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"],
50236    wide: [
50237      "Sunday",
50238      "Monday",
50239      "Tuesday",
50240      "Wednesday",
50241      "Thursday",
50242      "Friday",
50243      "Saturday",
50244    ],
50245  };
50246  
50247  const dayPeriodValues = {
50248    narrow: {
50249      am: "a",
50250      pm: "p",
50251      midnight: "mi",
50252      noon: "n",
50253      morning: "morning",
50254      afternoon: "afternoon",
50255      evening: "evening",
50256      night: "night",
50257    },
50258    abbreviated: {
50259      am: "AM",
50260      pm: "PM",
50261      midnight: "midnight",
50262      noon: "noon",
50263      morning: "morning",
50264      afternoon: "afternoon",
50265      evening: "evening",
50266      night: "night",
50267    },
50268    wide: {
50269      am: "a.m.",
50270      pm: "p.m.",
50271      midnight: "midnight",
50272      noon: "noon",
50273      morning: "morning",
50274      afternoon: "afternoon",
50275      evening: "evening",
50276      night: "night",
50277    },
50278  };
50279  
50280  const formattingDayPeriodValues = {
50281    narrow: {
50282      am: "a",
50283      pm: "p",
50284      midnight: "mi",
50285      noon: "n",
50286      morning: "in the morning",
50287      afternoon: "in the afternoon",
50288      evening: "in the evening",
50289      night: "at night",
50290    },
50291    abbreviated: {
50292      am: "AM",
50293      pm: "PM",
50294      midnight: "midnight",
50295      noon: "noon",
50296      morning: "in the morning",
50297      afternoon: "in the afternoon",
50298      evening: "in the evening",
50299      night: "at night",
50300    },
50301    wide: {
50302      am: "a.m.",
50303      pm: "p.m.",
50304      midnight: "midnight",
50305      noon: "noon",
50306      morning: "in the morning",
50307      afternoon: "in the afternoon",
50308      evening: "in the evening",
50309      night: "at night",
50310    },
50311  };
50312  
50313  const ordinalNumber = (dirtyNumber, _options) => {
50314    const number = Number(dirtyNumber);
50315  
50316    // If ordinal numbers depend on context, for example,
50317    // if they are different for different grammatical genders,
50318    // use `options.unit`.
50319    //
50320    // `unit` can be 'year', 'quarter', 'month', 'week', 'date', 'dayOfYear',
50321    // 'day', 'hour', 'minute', 'second'.
50322  
50323    const rem100 = number % 100;
50324    if (rem100 > 20 || rem100 < 10) {
50325      switch (rem100 % 10) {
50326        case 1:
50327          return number + "st";
50328        case 2:
50329          return number + "nd";
50330        case 3:
50331          return number + "rd";
50332      }
50333    }
50334    return number + "th";
50335  };
50336  
50337  const localize = {
50338    ordinalNumber,
50339  
50340    era: buildLocalizeFn({
50341      values: eraValues,
50342      defaultWidth: "wide",
50343    }),
50344  
50345    quarter: buildLocalizeFn({
50346      values: quarterValues,
50347      defaultWidth: "wide",
50348      argumentCallback: (quarter) => quarter - 1,
50349    }),
50350  
50351    month: buildLocalizeFn({
50352      values: monthValues,
50353      defaultWidth: "wide",
50354    }),
50355  
50356    day: buildLocalizeFn({
50357      values: dayValues,
50358      defaultWidth: "wide",
50359    }),
50360  
50361    dayPeriod: buildLocalizeFn({
50362      values: dayPeriodValues,
50363      defaultWidth: "wide",
50364      formattingValues: formattingDayPeriodValues,
50365      defaultFormattingWidth: "wide",
50366    }),
50367  };
50368  
50369  ;// CONCATENATED MODULE: ./node_modules/date-fns/locale/_lib/buildMatchFn.mjs
50370  function buildMatchFn(args) {
50371    return (string, options = {}) => {
50372      const width = options.width;
50373  
50374      const matchPattern =
50375        (width && args.matchPatterns[width]) ||
50376        args.matchPatterns[args.defaultMatchWidth];
50377      const matchResult = string.match(matchPattern);
50378  
50379      if (!matchResult) {
50380        return null;
50381      }
50382      const matchedString = matchResult[0];
50383  
50384      const parsePatterns =
50385        (width && args.parsePatterns[width]) ||
50386        args.parsePatterns[args.defaultParseWidth];
50387  
50388      const key = Array.isArray(parsePatterns)
50389        ? findIndex(parsePatterns, (pattern) => pattern.test(matchedString))
50390        : // eslint-disable-next-line @typescript-eslint/no-explicit-any -- I challange you to fix the type
50391          findKey(parsePatterns, (pattern) => pattern.test(matchedString));
50392  
50393      let value;
50394  
50395      value = args.valueCallback ? args.valueCallback(key) : key;
50396      value = options.valueCallback
50397        ? // eslint-disable-next-line @typescript-eslint/no-explicit-any -- I challange you to fix the type
50398          options.valueCallback(value)
50399        : value;
50400  
50401      const rest = string.slice(matchedString.length);
50402  
50403      return { value, rest };
50404    };
50405  }
50406  
50407  function findKey(object, predicate) {
50408    for (const key in object) {
50409      if (
50410        Object.prototype.hasOwnProperty.call(object, key) &&
50411        predicate(object[key])
50412      ) {
50413        return key;
50414      }
50415    }
50416    return undefined;
50417  }
50418  
50419  function findIndex(array, predicate) {
50420    for (let key = 0; key < array.length; key++) {
50421      if (predicate(array[key])) {
50422        return key;
50423      }
50424    }
50425    return undefined;
50426  }
50427  
50428  ;// CONCATENATED MODULE: ./node_modules/date-fns/locale/_lib/buildMatchPatternFn.mjs
50429  function buildMatchPatternFn(args) {
50430    return (string, options = {}) => {
50431      const matchResult = string.match(args.matchPattern);
50432      if (!matchResult) return null;
50433      const matchedString = matchResult[0];
50434  
50435      const parseResult = string.match(args.parsePattern);
50436      if (!parseResult) return null;
50437      let value = args.valueCallback
50438        ? args.valueCallback(parseResult[0])
50439        : parseResult[0];
50440  
50441      // eslint-disable-next-line @typescript-eslint/no-explicit-any -- I challange you to fix the type
50442      value = options.valueCallback ? options.valueCallback(value) : value;
50443  
50444      const rest = string.slice(matchedString.length);
50445  
50446      return { value, rest };
50447    };
50448  }
50449  
50450  ;// CONCATENATED MODULE: ./node_modules/date-fns/locale/en-US/_lib/match.mjs
50451  
50452  
50453  
50454  const matchOrdinalNumberPattern = /^(\d+)(th|st|nd|rd)?/i;
50455  const parseOrdinalNumberPattern = /\d+/i;
50456  
50457  const matchEraPatterns = {
50458    narrow: /^(b|a)/i,
50459    abbreviated: /^(b\.?\s?c\.?|b\.?\s?c\.?\s?e\.?|a\.?\s?d\.?|c\.?\s?e\.?)/i,
50460    wide: /^(before christ|before common era|anno domini|common era)/i,
50461  };
50462  const parseEraPatterns = {
50463    any: [/^b/i, /^(a|c)/i],
50464  };
50465  
50466  const matchQuarterPatterns = {
50467    narrow: /^[1234]/i,
50468    abbreviated: /^q[1234]/i,
50469    wide: /^[1234](th|st|nd|rd)? quarter/i,
50470  };
50471  const parseQuarterPatterns = {
50472    any: [/1/i, /2/i, /3/i, /4/i],
50473  };
50474  
50475  const matchMonthPatterns = {
50476    narrow: /^[jfmasond]/i,
50477    abbreviated: /^(jan|feb|mar|apr|may|jun|jul|aug|sep|oct|nov|dec)/i,
50478    wide: /^(january|february|march|april|may|june|july|august|september|october|november|december)/i,
50479  };
50480  const parseMonthPatterns = {
50481    narrow: [
50482      /^j/i,
50483      /^f/i,
50484      /^m/i,
50485      /^a/i,
50486      /^m/i,
50487      /^j/i,
50488      /^j/i,
50489      /^a/i,
50490      /^s/i,
50491      /^o/i,
50492      /^n/i,
50493      /^d/i,
50494    ],
50495  
50496    any: [
50497      /^ja/i,
50498      /^f/i,
50499      /^mar/i,
50500      /^ap/i,
50501      /^may/i,
50502      /^jun/i,
50503      /^jul/i,
50504      /^au/i,
50505      /^s/i,
50506      /^o/i,
50507      /^n/i,
50508      /^d/i,
50509    ],
50510  };
50511  
50512  const matchDayPatterns = {
50513    narrow: /^[smtwf]/i,
50514    short: /^(su|mo|tu|we|th|fr|sa)/i,
50515    abbreviated: /^(sun|mon|tue|wed|thu|fri|sat)/i,
50516    wide: /^(sunday|monday|tuesday|wednesday|thursday|friday|saturday)/i,
50517  };
50518  const parseDayPatterns = {
50519    narrow: [/^s/i, /^m/i, /^t/i, /^w/i, /^t/i, /^f/i, /^s/i],
50520    any: [/^su/i, /^m/i, /^tu/i, /^w/i, /^th/i, /^f/i, /^sa/i],
50521  };
50522  
50523  const matchDayPeriodPatterns = {
50524    narrow: /^(a|p|mi|n|(in the|at) (morning|afternoon|evening|night))/i,
50525    any: /^([ap]\.?\s?m\.?|midnight|noon|(in the|at) (morning|afternoon|evening|night))/i,
50526  };
50527  const parseDayPeriodPatterns = {
50528    any: {
50529      am: /^a/i,
50530      pm: /^p/i,
50531      midnight: /^mi/i,
50532      noon: /^no/i,
50533      morning: /morning/i,
50534      afternoon: /afternoon/i,
50535      evening: /evening/i,
50536      night: /night/i,
50537    },
50538  };
50539  
50540  const match_match = {
50541    ordinalNumber: buildMatchPatternFn({
50542      matchPattern: matchOrdinalNumberPattern,
50543      parsePattern: parseOrdinalNumberPattern,
50544      valueCallback: (value) => parseInt(value, 10),
50545    }),
50546  
50547    era: buildMatchFn({
50548      matchPatterns: matchEraPatterns,
50549      defaultMatchWidth: "wide",
50550      parsePatterns: parseEraPatterns,
50551      defaultParseWidth: "any",
50552    }),
50553  
50554    quarter: buildMatchFn({
50555      matchPatterns: matchQuarterPatterns,
50556      defaultMatchWidth: "wide",
50557      parsePatterns: parseQuarterPatterns,
50558      defaultParseWidth: "any",
50559      valueCallback: (index) => index + 1,
50560    }),
50561  
50562    month: buildMatchFn({
50563      matchPatterns: matchMonthPatterns,
50564      defaultMatchWidth: "wide",
50565      parsePatterns: parseMonthPatterns,
50566      defaultParseWidth: "any",
50567    }),
50568  
50569    day: buildMatchFn({
50570      matchPatterns: matchDayPatterns,
50571      defaultMatchWidth: "wide",
50572      parsePatterns: parseDayPatterns,
50573      defaultParseWidth: "any",
50574    }),
50575  
50576    dayPeriod: buildMatchFn({
50577      matchPatterns: matchDayPeriodPatterns,
50578      defaultMatchWidth: "any",
50579      parsePatterns: parseDayPeriodPatterns,
50580      defaultParseWidth: "any",
50581    }),
50582  };
50583  
50584  ;// CONCATENATED MODULE: ./node_modules/date-fns/locale/en-US.mjs
50585  
50586  
50587  
50588  
50589  
50590  
50591  /**
50592   * @category Locales
50593   * @summary English locale (United States).
50594   * @language English
50595   * @iso-639-2 eng
50596   * @author Sasha Koss [@kossnocorp](https://github.com/kossnocorp)
50597   * @author Lesha Koss [@leshakoss](https://github.com/leshakoss)
50598   */
50599  const enUS = {
50600    code: "en-US",
50601    formatDistance: formatDistance,
50602    formatLong: formatLong,
50603    formatRelative: formatRelative,
50604    localize: localize,
50605    match: match_match,
50606    options: {
50607      weekStartsOn: 0 /* Sunday */,
50608      firstWeekContainsDate: 1,
50609    },
50610  };
50611  
50612  // Fallback for modularized imports:
50613  /* harmony default export */ const en_US = ((/* unused pure expression or super */ null && (enUS)));
50614  
50615  ;// CONCATENATED MODULE: ./node_modules/date-fns/_lib/defaultOptions.mjs
50616  let defaultOptions_defaultOptions = {};
50617  
50618  function getDefaultOptions() {
50619    return defaultOptions_defaultOptions;
50620  }
50621  
50622  function setDefaultOptions(newOptions) {
50623    defaultOptions_defaultOptions = newOptions;
50624  }
50625  
50626  ;// CONCATENATED MODULE: ./node_modules/date-fns/constants.mjs
50627  /**
50628   * @module constants
50629   * @summary Useful constants
50630   * @description
50631   * Collection of useful date constants.
50632   *
50633   * The constants could be imported from `date-fns/constants`:
50634   *
50635   * ```ts
50636   * import { maxTime, minTime } from "./constants/date-fns/constants";
50637   *
50638   * function isAllowedTime(time) {
50639   *   return time <= maxTime && time >= minTime;
50640   * }
50641   * ```
50642   */
50643  
50644  /**
50645   * @constant
50646   * @name daysInWeek
50647   * @summary Days in 1 week.
50648   */
50649  const daysInWeek = 7;
50650  
50651  /**
50652   * @constant
50653   * @name daysInYear
50654   * @summary Days in 1 year.
50655   *
50656   * @description
50657   * How many days in a year.
50658   *
50659   * One years equals 365.2425 days according to the formula:
50660   *
50661   * > Leap year occures every 4 years, except for years that are divisable by 100 and not divisable by 400.
50662   * > 1 mean year = (365+1/4-1/100+1/400) days = 365.2425 days
50663   */
50664  const daysInYear = 365.2425;
50665  
50666  /**
50667   * @constant
50668   * @name maxTime
50669   * @summary Maximum allowed time.
50670   *
50671   * @example
50672   * import { maxTime } from "./constants/date-fns/constants";
50673   *
50674   * const isValid = 8640000000000001 <= maxTime;
50675   * //=> false
50676   *
50677   * new Date(8640000000000001);
50678   * //=> Invalid Date
50679   */
50680  const maxTime = Math.pow(10, 8) * 24 * 60 * 60 * 1000;
50681  
50682  /**
50683   * @constant
50684   * @name minTime
50685   * @summary Minimum allowed time.
50686   *
50687   * @example
50688   * import { minTime } from "./constants/date-fns/constants";
50689   *
50690   * const isValid = -8640000000000001 >= minTime;
50691   * //=> false
50692   *
50693   * new Date(-8640000000000001)
50694   * //=> Invalid Date
50695   */
50696  const minTime = -maxTime;
50697  
50698  /**
50699   * @constant
50700   * @name millisecondsInWeek
50701   * @summary Milliseconds in 1 week.
50702   */
50703  const millisecondsInWeek = 604800000;
50704  
50705  /**
50706   * @constant
50707   * @name millisecondsInDay
50708   * @summary Milliseconds in 1 day.
50709   */
50710  const millisecondsInDay = 86400000;
50711  
50712  /**
50713   * @constant
50714   * @name millisecondsInMinute
50715   * @summary Milliseconds in 1 minute
50716   */
50717  const millisecondsInMinute = 60000;
50718  
50719  /**
50720   * @constant
50721   * @name millisecondsInHour
50722   * @summary Milliseconds in 1 hour
50723   */
50724  const millisecondsInHour = 3600000;
50725  
50726  /**
50727   * @constant
50728   * @name millisecondsInSecond
50729   * @summary Milliseconds in 1 second
50730   */
50731  const millisecondsInSecond = 1000;
50732  
50733  /**
50734   * @constant
50735   * @name minutesInYear
50736   * @summary Minutes in 1 year.
50737   */
50738  const minutesInYear = 525600;
50739  
50740  /**
50741   * @constant
50742   * @name minutesInMonth
50743   * @summary Minutes in 1 month.
50744   */
50745  const minutesInMonth = 43200;
50746  
50747  /**
50748   * @constant
50749   * @name minutesInDay
50750   * @summary Minutes in 1 day.
50751   */
50752  const minutesInDay = 1440;
50753  
50754  /**
50755   * @constant
50756   * @name minutesInHour
50757   * @summary Minutes in 1 hour.
50758   */
50759  const minutesInHour = 60;
50760  
50761  /**
50762   * @constant
50763   * @name monthsInQuarter
50764   * @summary Months in 1 quarter.
50765   */
50766  const monthsInQuarter = 3;
50767  
50768  /**
50769   * @constant
50770   * @name monthsInYear
50771   * @summary Months in 1 year.
50772   */
50773  const monthsInYear = 12;
50774  
50775  /**
50776   * @constant
50777   * @name quartersInYear
50778   * @summary Quarters in 1 year
50779   */
50780  const quartersInYear = 4;
50781  
50782  /**
50783   * @constant
50784   * @name secondsInHour
50785   * @summary Seconds in 1 hour.
50786   */
50787  const secondsInHour = 3600;
50788  
50789  /**
50790   * @constant
50791   * @name secondsInMinute
50792   * @summary Seconds in 1 minute.
50793   */
50794  const secondsInMinute = 60;
50795  
50796  /**
50797   * @constant
50798   * @name secondsInDay
50799   * @summary Seconds in 1 day.
50800   */
50801  const secondsInDay = secondsInHour * 24;
50802  
50803  /**
50804   * @constant
50805   * @name secondsInWeek
50806   * @summary Seconds in 1 week.
50807   */
50808  const secondsInWeek = secondsInDay * 7;
50809  
50810  /**
50811   * @constant
50812   * @name secondsInYear
50813   * @summary Seconds in 1 year.
50814   */
50815  const secondsInYear = secondsInDay * daysInYear;
50816  
50817  /**
50818   * @constant
50819   * @name secondsInMonth
50820   * @summary Seconds in 1 month
50821   */
50822  const secondsInMonth = secondsInYear / 12;
50823  
50824  /**
50825   * @constant
50826   * @name secondsInQuarter
50827   * @summary Seconds in 1 quarter.
50828   */
50829  const secondsInQuarter = secondsInMonth * 3;
50830  
50831  ;// CONCATENATED MODULE: ./node_modules/date-fns/_lib/getTimezoneOffsetInMilliseconds.mjs
50832  
50833  
50834  /**
50835   * Google Chrome as of 67.0.3396.87 introduced timezones with offset that includes seconds.
50836   * They usually appear for dates that denote time before the timezones were introduced
50837   * (e.g. for 'Europe/Prague' timezone the offset is GMT+00:57:44 before 1 October 1891
50838   * and GMT+01:00:00 after that date)
50839   *
50840   * Date#getTimezoneOffset returns the offset in minutes and would return 57 for the example above,
50841   * which would lead to incorrect calculations.
50842   *
50843   * This function returns the timezone offset in milliseconds that takes seconds in account.
50844   */
50845  function getTimezoneOffsetInMilliseconds(date) {
50846    const _date = toDate(date);
50847    const utcDate = new Date(
50848      Date.UTC(
50849        _date.getFullYear(),
50850        _date.getMonth(),
50851        _date.getDate(),
50852        _date.getHours(),
50853        _date.getMinutes(),
50854        _date.getSeconds(),
50855        _date.getMilliseconds(),
50856      ),
50857    );
50858    utcDate.setUTCFullYear(_date.getFullYear());
50859    return +date - +utcDate;
50860  }
50861  
50862  ;// CONCATENATED MODULE: ./node_modules/date-fns/differenceInCalendarDays.mjs
50863  
50864  
50865  
50866  
50867  /**
50868   * @name differenceInCalendarDays
50869   * @category Day Helpers
50870   * @summary Get the number of calendar days between the given dates.
50871   *
50872   * @description
50873   * Get the number of calendar days between the given dates. This means that the times are removed
50874   * from the dates and then the difference in days is calculated.
50875   *
50876   * @typeParam DateType - The `Date` type, the function operates on. Gets inferred from passed arguments. Allows to use extensions like [`UTCDate`](https://github.com/date-fns/utc).
50877   *
50878   * @param dateLeft - The later date
50879   * @param dateRight - The earlier date
50880   *
50881   * @returns The number of calendar days
50882   *
50883   * @example
50884   * // How many calendar days are between
50885   * // 2 July 2011 23:00:00 and 2 July 2012 00:00:00?
50886   * const result = differenceInCalendarDays(
50887   *   new Date(2012, 6, 2, 0, 0),
50888   *   new Date(2011, 6, 2, 23, 0)
50889   * )
50890   * //=> 366
50891   * // How many calendar days are between
50892   * // 2 July 2011 23:59:00 and 3 July 2011 00:01:00?
50893   * const result = differenceInCalendarDays(
50894   *   new Date(2011, 6, 3, 0, 1),
50895   *   new Date(2011, 6, 2, 23, 59)
50896   * )
50897   * //=> 1
50898   */
50899  function differenceInCalendarDays(dateLeft, dateRight) {
50900    const startOfDayLeft = startOfDay(dateLeft);
50901    const startOfDayRight = startOfDay(dateRight);
50902  
50903    const timestampLeft =
50904      +startOfDayLeft - getTimezoneOffsetInMilliseconds(startOfDayLeft);
50905    const timestampRight =
50906      +startOfDayRight - getTimezoneOffsetInMilliseconds(startOfDayRight);
50907  
50908    // Round the number of days to the nearest integer because the number of
50909    // milliseconds in a day is not constant (e.g. it's different in the week of
50910    // the daylight saving time clock shift).
50911    return Math.round((timestampLeft - timestampRight) / millisecondsInDay);
50912  }
50913  
50914  // Fallback for modularized imports:
50915  /* harmony default export */ const date_fns_differenceInCalendarDays = ((/* unused pure expression or super */ null && (differenceInCalendarDays)));
50916  
50917  ;// CONCATENATED MODULE: ./node_modules/date-fns/startOfYear.mjs
50918  
50919  
50920  
50921  /**
50922   * @name startOfYear
50923   * @category Year Helpers
50924   * @summary Return the start of a year for the given date.
50925   *
50926   * @description
50927   * Return the start of a year for the given date.
50928   * The result will be in the local timezone.
50929   *
50930   * @typeParam DateType - The `Date` type, the function operates on. Gets inferred from passed arguments. Allows to use extensions like [`UTCDate`](https://github.com/date-fns/utc).
50931   *
50932   * @param date - The original date
50933   *
50934   * @returns The start of a year
50935   *
50936   * @example
50937   * // The start of a year for 2 September 2014 11:55:00:
50938   * const result = startOfYear(new Date(2014, 8, 2, 11, 55, 00))
50939   * //=> Wed Jan 01 2014 00:00:00
50940   */
50941  function startOfYear(date) {
50942    const cleanDate = toDate(date);
50943    const _date = constructFrom(date, 0);
50944    _date.setFullYear(cleanDate.getFullYear(), 0, 1);
50945    _date.setHours(0, 0, 0, 0);
50946    return _date;
50947  }
50948  
50949  // Fallback for modularized imports:
50950  /* harmony default export */ const date_fns_startOfYear = ((/* unused pure expression or super */ null && (startOfYear)));
50951  
50952  ;// CONCATENATED MODULE: ./node_modules/date-fns/getDayOfYear.mjs
50953  
50954  
50955  
50956  
50957  /**
50958   * @name getDayOfYear
50959   * @category Day Helpers
50960   * @summary Get the day of the year of the given date.
50961   *
50962   * @description
50963   * Get the day of the year of the given date.
50964   *
50965   * @typeParam DateType - The `Date` type, the function operates on. Gets inferred from passed arguments. Allows to use extensions like [`UTCDate`](https://github.com/date-fns/utc).
50966   *
50967   * @param date - The given date
50968   *
50969   * @returns The day of year
50970   *
50971   * @example
50972   * // Which day of the year is 2 July 2014?
50973   * const result = getDayOfYear(new Date(2014, 6, 2))
50974   * //=> 183
50975   */
50976  function getDayOfYear(date) {
50977    const _date = toDate(date);
50978    const diff = differenceInCalendarDays(_date, startOfYear(_date));
50979    const dayOfYear = diff + 1;
50980    return dayOfYear;
50981  }
50982  
50983  // Fallback for modularized imports:
50984  /* harmony default export */ const date_fns_getDayOfYear = ((/* unused pure expression or super */ null && (getDayOfYear)));
50985  
50986  ;// CONCATENATED MODULE: ./node_modules/date-fns/startOfWeek.mjs
50987  
50988  
50989  
50990  /**
50991   * The {@link startOfWeek} function options.
50992   */
50993  
50994  /**
50995   * @name startOfWeek
50996   * @category Week Helpers
50997   * @summary Return the start of a week for the given date.
50998   *
50999   * @description
51000   * Return the start of a week for the given date.
51001   * The result will be in the local timezone.
51002   *
51003   * @typeParam DateType - The `Date` type, the function operates on. Gets inferred from passed arguments. Allows to use extensions like [`UTCDate`](https://github.com/date-fns/utc).
51004   *
51005   * @param date - The original date
51006   * @param options - An object with options
51007   *
51008   * @returns The start of a week
51009   *
51010   * @example
51011   * // The start of a week for 2 September 2014 11:55:00:
51012   * const result = startOfWeek(new Date(2014, 8, 2, 11, 55, 0))
51013   * //=> Sun Aug 31 2014 00:00:00
51014   *
51015   * @example
51016   * // If the week starts on Monday, the start of the week for 2 September 2014 11:55:00:
51017   * const result = startOfWeek(new Date(2014, 8, 2, 11, 55, 0), { weekStartsOn: 1 })
51018   * //=> Mon Sep 01 2014 00:00:00
51019   */
51020  function startOfWeek(date, options) {
51021    const defaultOptions = getDefaultOptions();
51022    const weekStartsOn =
51023      options?.weekStartsOn ??
51024      options?.locale?.options?.weekStartsOn ??
51025      defaultOptions.weekStartsOn ??
51026      defaultOptions.locale?.options?.weekStartsOn ??
51027      0;
51028  
51029    const _date = toDate(date);
51030    const day = _date.getDay();
51031    const diff = (day < weekStartsOn ? 7 : 0) + day - weekStartsOn;
51032  
51033    _date.setDate(_date.getDate() - diff);
51034    _date.setHours(0, 0, 0, 0);
51035    return _date;
51036  }
51037  
51038  // Fallback for modularized imports:
51039  /* harmony default export */ const date_fns_startOfWeek = ((/* unused pure expression or super */ null && (startOfWeek)));
51040  
51041  ;// CONCATENATED MODULE: ./node_modules/date-fns/startOfISOWeek.mjs
51042  
51043  
51044  /**
51045   * @name startOfISOWeek
51046   * @category ISO Week Helpers
51047   * @summary Return the start of an ISO week for the given date.
51048   *
51049   * @description
51050   * Return the start of an ISO week for the given date.
51051   * The result will be in the local timezone.
51052   *
51053   * ISO week-numbering year: http://en.wikipedia.org/wiki/ISO_week_date
51054   *
51055   * @typeParam DateType - The `Date` type, the function operates on. Gets inferred from passed arguments. Allows to use extensions like [`UTCDate`](https://github.com/date-fns/utc).
51056   *
51057   * @param date - The original date
51058   *
51059   * @returns The start of an ISO week
51060   *
51061   * @example
51062   * // The start of an ISO week for 2 September 2014 11:55:00:
51063   * const result = startOfISOWeek(new Date(2014, 8, 2, 11, 55, 0))
51064   * //=> Mon Sep 01 2014 00:00:00
51065   */
51066  function startOfISOWeek(date) {
51067    return startOfWeek(date, { weekStartsOn: 1 });
51068  }
51069  
51070  // Fallback for modularized imports:
51071  /* harmony default export */ const date_fns_startOfISOWeek = ((/* unused pure expression or super */ null && (startOfISOWeek)));
51072  
51073  ;// CONCATENATED MODULE: ./node_modules/date-fns/getISOWeekYear.mjs
51074  
51075  
51076  
51077  
51078  /**
51079   * @name getISOWeekYear
51080   * @category ISO Week-Numbering Year Helpers
51081   * @summary Get the ISO week-numbering year of the given date.
51082   *
51083   * @description
51084   * Get the ISO week-numbering year of the given date,
51085   * which always starts 3 days before the year's first Thursday.
51086   *
51087   * ISO week-numbering year: http://en.wikipedia.org/wiki/ISO_week_date
51088   *
51089   * @typeParam DateType - The `Date` type, the function operates on. Gets inferred from passed arguments. Allows to use extensions like [`UTCDate`](https://github.com/date-fns/utc).
51090   *
51091   * @param date - The given date
51092   *
51093   * @returns The ISO week-numbering year
51094   *
51095   * @example
51096   * // Which ISO-week numbering year is 2 January 2005?
51097   * const result = getISOWeekYear(new Date(2005, 0, 2))
51098   * //=> 2004
51099   */
51100  function getISOWeekYear(date) {
51101    const _date = toDate(date);
51102    const year = _date.getFullYear();
51103  
51104    const fourthOfJanuaryOfNextYear = constructFrom(date, 0);
51105    fourthOfJanuaryOfNextYear.setFullYear(year + 1, 0, 4);
51106    fourthOfJanuaryOfNextYear.setHours(0, 0, 0, 0);
51107    const startOfNextYear = startOfISOWeek(fourthOfJanuaryOfNextYear);
51108  
51109    const fourthOfJanuaryOfThisYear = constructFrom(date, 0);
51110    fourthOfJanuaryOfThisYear.setFullYear(year, 0, 4);
51111    fourthOfJanuaryOfThisYear.setHours(0, 0, 0, 0);
51112    const startOfThisYear = startOfISOWeek(fourthOfJanuaryOfThisYear);
51113  
51114    if (_date.getTime() >= startOfNextYear.getTime()) {
51115      return year + 1;
51116    } else if (_date.getTime() >= startOfThisYear.getTime()) {
51117      return year;
51118    } else {
51119      return year - 1;
51120    }
51121  }
51122  
51123  // Fallback for modularized imports:
51124  /* harmony default export */ const date_fns_getISOWeekYear = ((/* unused pure expression or super */ null && (getISOWeekYear)));
51125  
51126  ;// CONCATENATED MODULE: ./node_modules/date-fns/startOfISOWeekYear.mjs
51127  
51128  
51129  
51130  
51131  /**
51132   * @name startOfISOWeekYear
51133   * @category ISO Week-Numbering Year Helpers
51134   * @summary Return the start of an ISO week-numbering year for the given date.
51135   *
51136   * @description
51137   * Return the start of an ISO week-numbering year,
51138   * which always starts 3 days before the year's first Thursday.
51139   * The result will be in the local timezone.
51140   *
51141   * ISO week-numbering year: http://en.wikipedia.org/wiki/ISO_week_date
51142   *
51143   * @typeParam DateType - The `Date` type, the function operates on. Gets inferred from passed arguments. Allows to use extensions like [`UTCDate`](https://github.com/date-fns/utc).
51144   *
51145   * @param date - The original date
51146   *
51147   * @returns The start of an ISO week-numbering year
51148   *
51149   * @example
51150   * // The start of an ISO week-numbering year for 2 July 2005:
51151   * const result = startOfISOWeekYear(new Date(2005, 6, 2))
51152   * //=> Mon Jan 03 2005 00:00:00
51153   */
51154  function startOfISOWeekYear(date) {
51155    const year = getISOWeekYear(date);
51156    const fourthOfJanuary = constructFrom(date, 0);
51157    fourthOfJanuary.setFullYear(year, 0, 4);
51158    fourthOfJanuary.setHours(0, 0, 0, 0);
51159    return startOfISOWeek(fourthOfJanuary);
51160  }
51161  
51162  // Fallback for modularized imports:
51163  /* harmony default export */ const date_fns_startOfISOWeekYear = ((/* unused pure expression or super */ null && (startOfISOWeekYear)));
51164  
51165  ;// CONCATENATED MODULE: ./node_modules/date-fns/getISOWeek.mjs
51166  
51167  
51168  
51169  
51170  
51171  /**
51172   * @name getISOWeek
51173   * @category ISO Week Helpers
51174   * @summary Get the ISO week of the given date.
51175   *
51176   * @description
51177   * Get the ISO week of the given date.
51178   *
51179   * ISO week-numbering year: http://en.wikipedia.org/wiki/ISO_week_date
51180   *
51181   * @typeParam DateType - The `Date` type, the function operates on. Gets inferred from passed arguments. Allows to use extensions like [`UTCDate`](https://github.com/date-fns/utc).
51182   *
51183   * @param date - The given date
51184   *
51185   * @returns The ISO week
51186   *
51187   * @example
51188   * // Which week of the ISO-week numbering year is 2 January 2005?
51189   * const result = getISOWeek(new Date(2005, 0, 2))
51190   * //=> 53
51191   */
51192  function getISOWeek(date) {
51193    const _date = toDate(date);
51194    const diff = +startOfISOWeek(_date) - +startOfISOWeekYear(_date);
51195  
51196    // Round the number of weeks to the nearest integer because the number of
51197    // milliseconds in a week is not constant (e.g. it's different in the week of
51198    // the daylight saving time clock shift).
51199    return Math.round(diff / millisecondsInWeek) + 1;
51200  }
51201  
51202  // Fallback for modularized imports:
51203  /* harmony default export */ const date_fns_getISOWeek = ((/* unused pure expression or super */ null && (getISOWeek)));
51204  
51205  ;// CONCATENATED MODULE: ./node_modules/date-fns/getWeekYear.mjs
51206  
51207  
51208  
51209  
51210  
51211  /**
51212   * The {@link getWeekYear} function options.
51213   */
51214  
51215  /**
51216   * @name getWeekYear
51217   * @category Week-Numbering Year Helpers
51218   * @summary Get the local week-numbering year of the given date.
51219   *
51220   * @description
51221   * Get the local week-numbering year of the given date.
51222   * The exact calculation depends on the values of
51223   * `options.weekStartsOn` (which is the index of the first day of the week)
51224   * and `options.firstWeekContainsDate` (which is the day of January, which is always in
51225   * the first week of the week-numbering year)
51226   *
51227   * Week numbering: https://en.wikipedia.org/wiki/Week#The_ISO_week_date_system
51228   *
51229   * @typeParam DateType - The `Date` type, the function operates on. Gets inferred from passed arguments. Allows to use extensions like [`UTCDate`](https://github.com/date-fns/utc).
51230   *
51231   * @param date - The given date
51232   * @param options - An object with options.
51233   *
51234   * @returns The local week-numbering year
51235   *
51236   * @example
51237   * // Which week numbering year is 26 December 2004 with the default settings?
51238   * const result = getWeekYear(new Date(2004, 11, 26))
51239   * //=> 2005
51240   *
51241   * @example
51242   * // Which week numbering year is 26 December 2004 if week starts on Saturday?
51243   * const result = getWeekYear(new Date(2004, 11, 26), { weekStartsOn: 6 })
51244   * //=> 2004
51245   *
51246   * @example
51247   * // Which week numbering year is 26 December 2004 if the first week contains 4 January?
51248   * const result = getWeekYear(new Date(2004, 11, 26), { firstWeekContainsDate: 4 })
51249   * //=> 2004
51250   */
51251  function getWeekYear(date, options) {
51252    const _date = toDate(date);
51253    const year = _date.getFullYear();
51254  
51255    const defaultOptions = getDefaultOptions();
51256    const firstWeekContainsDate =
51257      options?.firstWeekContainsDate ??
51258      options?.locale?.options?.firstWeekContainsDate ??
51259      defaultOptions.firstWeekContainsDate ??
51260      defaultOptions.locale?.options?.firstWeekContainsDate ??
51261      1;
51262  
51263    const firstWeekOfNextYear = constructFrom(date, 0);
51264    firstWeekOfNextYear.setFullYear(year + 1, 0, firstWeekContainsDate);
51265    firstWeekOfNextYear.setHours(0, 0, 0, 0);
51266    const startOfNextYear = startOfWeek(firstWeekOfNextYear, options);
51267  
51268    const firstWeekOfThisYear = constructFrom(date, 0);
51269    firstWeekOfThisYear.setFullYear(year, 0, firstWeekContainsDate);
51270    firstWeekOfThisYear.setHours(0, 0, 0, 0);
51271    const startOfThisYear = startOfWeek(firstWeekOfThisYear, options);
51272  
51273    if (_date.getTime() >= startOfNextYear.getTime()) {
51274      return year + 1;
51275    } else if (_date.getTime() >= startOfThisYear.getTime()) {
51276      return year;
51277    } else {
51278      return year - 1;
51279    }
51280  }
51281  
51282  // Fallback for modularized imports:
51283  /* harmony default export */ const date_fns_getWeekYear = ((/* unused pure expression or super */ null && (getWeekYear)));
51284  
51285  ;// CONCATENATED MODULE: ./node_modules/date-fns/startOfWeekYear.mjs
51286  
51287  
51288  
51289  
51290  
51291  /**
51292   * The {@link startOfWeekYear} function options.
51293   */
51294  
51295  /**
51296   * @name startOfWeekYear
51297   * @category Week-Numbering Year Helpers
51298   * @summary Return the start of a local week-numbering year for the given date.
51299   *
51300   * @description
51301   * Return the start of a local week-numbering year.
51302   * The exact calculation depends on the values of
51303   * `options.weekStartsOn` (which is the index of the first day of the week)
51304   * and `options.firstWeekContainsDate` (which is the day of January, which is always in
51305   * the first week of the week-numbering year)
51306   *
51307   * Week numbering: https://en.wikipedia.org/wiki/Week#The_ISO_week_date_system
51308   *
51309   * @typeParam DateType - The `Date` type, the function operates on. Gets inferred from passed arguments. Allows to use extensions like [`UTCDate`](https://github.com/date-fns/utc).
51310   *
51311   * @param date - The original date
51312   * @param options - An object with options
51313   *
51314   * @returns The start of a week-numbering year
51315   *
51316   * @example
51317   * // The start of an a week-numbering year for 2 July 2005 with default settings:
51318   * const result = startOfWeekYear(new Date(2005, 6, 2))
51319   * //=> Sun Dec 26 2004 00:00:00
51320   *
51321   * @example
51322   * // The start of a week-numbering year for 2 July 2005
51323   * // if Monday is the first day of week
51324   * // and 4 January is always in the first week of the year:
51325   * const result = startOfWeekYear(new Date(2005, 6, 2), {
51326   *   weekStartsOn: 1,
51327   *   firstWeekContainsDate: 4
51328   * })
51329   * //=> Mon Jan 03 2005 00:00:00
51330   */
51331  function startOfWeekYear(date, options) {
51332    const defaultOptions = getDefaultOptions();
51333    const firstWeekContainsDate =
51334      options?.firstWeekContainsDate ??
51335      options?.locale?.options?.firstWeekContainsDate ??
51336      defaultOptions.firstWeekContainsDate ??
51337      defaultOptions.locale?.options?.firstWeekContainsDate ??
51338      1;
51339  
51340    const year = getWeekYear(date, options);
51341    const firstWeek = constructFrom(date, 0);
51342    firstWeek.setFullYear(year, 0, firstWeekContainsDate);
51343    firstWeek.setHours(0, 0, 0, 0);
51344    const _date = startOfWeek(firstWeek, options);
51345    return _date;
51346  }
51347  
51348  // Fallback for modularized imports:
51349  /* harmony default export */ const date_fns_startOfWeekYear = ((/* unused pure expression or super */ null && (startOfWeekYear)));
51350  
51351  ;// CONCATENATED MODULE: ./node_modules/date-fns/getWeek.mjs
51352  
51353  
51354  
51355  
51356  
51357  /**
51358   * The {@link getWeek} function options.
51359   */
51360  
51361  /**
51362   * @name getWeek
51363   * @category Week Helpers
51364   * @summary Get the local week index of the given date.
51365   *
51366   * @description
51367   * Get the local week index of the given date.
51368   * The exact calculation depends on the values of
51369   * `options.weekStartsOn` (which is the index of the first day of the week)
51370   * and `options.firstWeekContainsDate` (which is the day of January, which is always in
51371   * the first week of the week-numbering year)
51372   *
51373   * Week numbering: https://en.wikipedia.org/wiki/Week#The_ISO_week_date_system
51374   *
51375   * @typeParam DateType - The `Date` type, the function operates on. Gets inferred from passed arguments. Allows to use extensions like [`UTCDate`](https://github.com/date-fns/utc).
51376   *
51377   * @param date - The given date
51378   * @param options - An object with options
51379   *
51380   * @returns The week
51381   *
51382   * @example
51383   * // Which week of the local week numbering year is 2 January 2005 with default options?
51384   * const result = getWeek(new Date(2005, 0, 2))
51385   * //=> 2
51386   *
51387   * @example
51388   * // Which week of the local week numbering year is 2 January 2005,
51389   * // if Monday is the first day of the week,
51390   * // and the first week of the year always contains 4 January?
51391   * const result = getWeek(new Date(2005, 0, 2), {
51392   *   weekStartsOn: 1,
51393   *   firstWeekContainsDate: 4
51394   * })
51395   * //=> 53
51396   */
51397  
51398  function getWeek(date, options) {
51399    const _date = toDate(date);
51400    const diff = +startOfWeek(_date, options) - +startOfWeekYear(_date, options);
51401  
51402    // Round the number of weeks to the nearest integer because the number of
51403    // milliseconds in a week is not constant (e.g. it's different in the week of
51404    // the daylight saving time clock shift).
51405    return Math.round(diff / millisecondsInWeek) + 1;
51406  }
51407  
51408  // Fallback for modularized imports:
51409  /* harmony default export */ const date_fns_getWeek = ((/* unused pure expression or super */ null && (getWeek)));
51410  
51411  ;// CONCATENATED MODULE: ./node_modules/date-fns/_lib/addLeadingZeros.mjs
51412  function addLeadingZeros(number, targetLength) {
51413    const sign = number < 0 ? "-" : "";
51414    const output = Math.abs(number).toString().padStart(targetLength, "0");
51415    return sign + output;
51416  }
51417  
51418  ;// CONCATENATED MODULE: ./node_modules/date-fns/_lib/format/lightFormatters.mjs
51419  
51420  
51421  /*
51422   * |     | Unit                           |     | Unit                           |
51423   * |-----|--------------------------------|-----|--------------------------------|
51424   * |  a  | AM, PM                         |  A* |                                |
51425   * |  d  | Day of month                   |  D  |                                |
51426   * |  h  | Hour [1-12]                    |  H  | Hour [0-23]                    |
51427   * |  m  | Minute                         |  M  | Month                          |
51428   * |  s  | Second                         |  S  | Fraction of second             |
51429   * |  y  | Year (abs)                     |  Y  |                                |
51430   *
51431   * Letters marked by * are not implemented but reserved by Unicode standard.
51432   */
51433  
51434  const lightFormatters = {
51435    // Year
51436    y(date, token) {
51437      // From http://www.unicode.org/reports/tr35/tr35-31/tr35-dates.html#Date_Format_tokens
51438      // | Year     |     y | yy |   yyy |  yyyy | yyyyy |
51439      // |----------|-------|----|-------|-------|-------|
51440      // | AD 1     |     1 | 01 |   001 |  0001 | 00001 |
51441      // | AD 12    |    12 | 12 |   012 |  0012 | 00012 |
51442      // | AD 123   |   123 | 23 |   123 |  0123 | 00123 |
51443      // | AD 1234  |  1234 | 34 |  1234 |  1234 | 01234 |
51444      // | AD 12345 | 12345 | 45 | 12345 | 12345 | 12345 |
51445  
51446      const signedYear = date.getFullYear();
51447      // Returns 1 for 1 BC (which is year 0 in JavaScript)
51448      const year = signedYear > 0 ? signedYear : 1 - signedYear;
51449      return addLeadingZeros(token === "yy" ? year % 100 : year, token.length);
51450    },
51451  
51452    // Month
51453    M(date, token) {
51454      const month = date.getMonth();
51455      return token === "M" ? String(month + 1) : addLeadingZeros(month + 1, 2);
51456    },
51457  
51458    // Day of the month
51459    d(date, token) {
51460      return addLeadingZeros(date.getDate(), token.length);
51461    },
51462  
51463    // AM or PM
51464    a(date, token) {
51465      const dayPeriodEnumValue = date.getHours() / 12 >= 1 ? "pm" : "am";
51466  
51467      switch (token) {
51468        case "a":
51469        case "aa":
51470          return dayPeriodEnumValue.toUpperCase();
51471        case "aaa":
51472          return dayPeriodEnumValue;
51473        case "aaaaa":
51474          return dayPeriodEnumValue[0];
51475        case "aaaa":
51476        default:
51477          return dayPeriodEnumValue === "am" ? "a.m." : "p.m.";
51478      }
51479    },
51480  
51481    // Hour [1-12]
51482    h(date, token) {
51483      return addLeadingZeros(date.getHours() % 12 || 12, token.length);
51484    },
51485  
51486    // Hour [0-23]
51487    H(date, token) {
51488      return addLeadingZeros(date.getHours(), token.length);
51489    },
51490  
51491    // Minute
51492    m(date, token) {
51493      return addLeadingZeros(date.getMinutes(), token.length);
51494    },
51495  
51496    // Second
51497    s(date, token) {
51498      return addLeadingZeros(date.getSeconds(), token.length);
51499    },
51500  
51501    // Fraction of second
51502    S(date, token) {
51503      const numberOfDigits = token.length;
51504      const milliseconds = date.getMilliseconds();
51505      const fractionalSeconds = Math.trunc(
51506        milliseconds * Math.pow(10, numberOfDigits - 3),
51507      );
51508      return addLeadingZeros(fractionalSeconds, token.length);
51509    },
51510  };
51511  
51512  ;// CONCATENATED MODULE: ./node_modules/date-fns/_lib/format/formatters.mjs
51513  
51514  
51515  
51516  
51517  
51518  
51519  
51520  
51521  const dayPeriodEnum = {
51522    am: "am",
51523    pm: "pm",
51524    midnight: "midnight",
51525    noon: "noon",
51526    morning: "morning",
51527    afternoon: "afternoon",
51528    evening: "evening",
51529    night: "night",
51530  };
51531  
51532  /*
51533   * |     | Unit                           |     | Unit                           |
51534   * |-----|--------------------------------|-----|--------------------------------|
51535   * |  a  | AM, PM                         |  A* | Milliseconds in day            |
51536   * |  b  | AM, PM, noon, midnight         |  B  | Flexible day period            |
51537   * |  c  | Stand-alone local day of week  |  C* | Localized hour w/ day period   |
51538   * |  d  | Day of month                   |  D  | Day of year                    |
51539   * |  e  | Local day of week              |  E  | Day of week                    |
51540   * |  f  |                                |  F* | Day of week in month           |
51541   * |  g* | Modified Julian day            |  G  | Era                            |
51542   * |  h  | Hour [1-12]                    |  H  | Hour [0-23]                    |
51543   * |  i! | ISO day of week                |  I! | ISO week of year               |
51544   * |  j* | Localized hour w/ day period   |  J* | Localized hour w/o day period  |
51545   * |  k  | Hour [1-24]                    |  K  | Hour [0-11]                    |
51546   * |  l* | (deprecated)                   |  L  | Stand-alone month              |
51547   * |  m  | Minute                         |  M  | Month                          |
51548   * |  n  |                                |  N  |                                |
51549   * |  o! | Ordinal number modifier        |  O  | Timezone (GMT)                 |
51550   * |  p! | Long localized time            |  P! | Long localized date            |
51551   * |  q  | Stand-alone quarter            |  Q  | Quarter                        |
51552   * |  r* | Related Gregorian year         |  R! | ISO week-numbering year        |
51553   * |  s  | Second                         |  S  | Fraction of second             |
51554   * |  t! | Seconds timestamp              |  T! | Milliseconds timestamp         |
51555   * |  u  | Extended year                  |  U* | Cyclic year                    |
51556   * |  v* | Timezone (generic non-locat.)  |  V* | Timezone (location)            |
51557   * |  w  | Local week of year             |  W* | Week of month                  |
51558   * |  x  | Timezone (ISO-8601 w/o Z)      |  X  | Timezone (ISO-8601)            |
51559   * |  y  | Year (abs)                     |  Y  | Local week-numbering year      |
51560   * |  z  | Timezone (specific non-locat.) |  Z* | Timezone (aliases)             |
51561   *
51562   * Letters marked by * are not implemented but reserved by Unicode standard.
51563   *
51564   * Letters marked by ! are non-standard, but implemented by date-fns:
51565   * - `o` modifies the previous token to turn it into an ordinal (see `format` docs)
51566   * - `i` is ISO day of week. For `i` and `ii` is returns numeric ISO week days,
51567   *   i.e. 7 for Sunday, 1 for Monday, etc.
51568   * - `I` is ISO week of year, as opposed to `w` which is local week of year.
51569   * - `R` is ISO week-numbering year, as opposed to `Y` which is local week-numbering year.
51570   *   `R` is supposed to be used in conjunction with `I` and `i`
51571   *   for universal ISO week-numbering date, whereas
51572   *   `Y` is supposed to be used in conjunction with `w` and `e`
51573   *   for week-numbering date specific to the locale.
51574   * - `P` is long localized date format
51575   * - `p` is long localized time format
51576   */
51577  
51578  const formatters = {
51579    // Era
51580    G: function (date, token, localize) {
51581      const era = date.getFullYear() > 0 ? 1 : 0;
51582      switch (token) {
51583        // AD, BC
51584        case "G":
51585        case "GG":
51586        case "GGG":
51587          return localize.era(era, { width: "abbreviated" });
51588        // A, B
51589        case "GGGGG":
51590          return localize.era(era, { width: "narrow" });
51591        // Anno Domini, Before Christ
51592        case "GGGG":
51593        default:
51594          return localize.era(era, { width: "wide" });
51595      }
51596    },
51597  
51598    // Year
51599    y: function (date, token, localize) {
51600      // Ordinal number
51601      if (token === "yo") {
51602        const signedYear = date.getFullYear();
51603        // Returns 1 for 1 BC (which is year 0 in JavaScript)
51604        const year = signedYear > 0 ? signedYear : 1 - signedYear;
51605        return localize.ordinalNumber(year, { unit: "year" });
51606      }
51607  
51608      return lightFormatters.y(date, token);
51609    },
51610  
51611    // Local week-numbering year
51612    Y: function (date, token, localize, options) {
51613      const signedWeekYear = getWeekYear(date, options);
51614      // Returns 1 for 1 BC (which is year 0 in JavaScript)
51615      const weekYear = signedWeekYear > 0 ? signedWeekYear : 1 - signedWeekYear;
51616  
51617      // Two digit year
51618      if (token === "YY") {
51619        const twoDigitYear = weekYear % 100;
51620        return addLeadingZeros(twoDigitYear, 2);
51621      }
51622  
51623      // Ordinal number
51624      if (token === "Yo") {
51625        return localize.ordinalNumber(weekYear, { unit: "year" });
51626      }
51627  
51628      // Padding
51629      return addLeadingZeros(weekYear, token.length);
51630    },
51631  
51632    // ISO week-numbering year
51633    R: function (date, token) {
51634      const isoWeekYear = getISOWeekYear(date);
51635  
51636      // Padding
51637      return addLeadingZeros(isoWeekYear, token.length);
51638    },
51639  
51640    // Extended year. This is a single number designating the year of this calendar system.
51641    // The main difference between `y` and `u` localizers are B.C. years:
51642    // | Year | `y` | `u` |
51643    // |------|-----|-----|
51644    // | AC 1 |   1 |   1 |
51645    // | BC 1 |   1 |   0 |
51646    // | BC 2 |   2 |  -1 |
51647    // Also `yy` always returns the last two digits of a year,
51648    // while `uu` pads single digit years to 2 characters and returns other years unchanged.
51649    u: function (date, token) {
51650      const year = date.getFullYear();
51651      return addLeadingZeros(year, token.length);
51652    },
51653  
51654    // Quarter
51655    Q: function (date, token, localize) {
51656      const quarter = Math.ceil((date.getMonth() + 1) / 3);
51657      switch (token) {
51658        // 1, 2, 3, 4
51659        case "Q":
51660          return String(quarter);
51661        // 01, 02, 03, 04
51662        case "QQ":
51663          return addLeadingZeros(quarter, 2);
51664        // 1st, 2nd, 3rd, 4th
51665        case "Qo":
51666          return localize.ordinalNumber(quarter, { unit: "quarter" });
51667        // Q1, Q2, Q3, Q4
51668        case "QQQ":
51669          return localize.quarter(quarter, {
51670            width: "abbreviated",
51671            context: "formatting",
51672          });
51673        // 1, 2, 3, 4 (narrow quarter; could be not numerical)
51674        case "QQQQQ":
51675          return localize.quarter(quarter, {
51676            width: "narrow",
51677            context: "formatting",
51678          });
51679        // 1st quarter, 2nd quarter, ...
51680        case "QQQQ":
51681        default:
51682          return localize.quarter(quarter, {
51683            width: "wide",
51684            context: "formatting",
51685          });
51686      }
51687    },
51688  
51689    // Stand-alone quarter
51690    q: function (date, token, localize) {
51691      const quarter = Math.ceil((date.getMonth() + 1) / 3);
51692      switch (token) {
51693        // 1, 2, 3, 4
51694        case "q":
51695          return String(quarter);
51696        // 01, 02, 03, 04
51697        case "qq":
51698          return addLeadingZeros(quarter, 2);
51699        // 1st, 2nd, 3rd, 4th
51700        case "qo":
51701          return localize.ordinalNumber(quarter, { unit: "quarter" });
51702        // Q1, Q2, Q3, Q4
51703        case "qqq":
51704          return localize.quarter(quarter, {
51705            width: "abbreviated",
51706            context: "standalone",
51707          });
51708        // 1, 2, 3, 4 (narrow quarter; could be not numerical)
51709        case "qqqqq":
51710          return localize.quarter(quarter, {
51711            width: "narrow",
51712            context: "standalone",
51713          });
51714        // 1st quarter, 2nd quarter, ...
51715        case "qqqq":
51716        default:
51717          return localize.quarter(quarter, {
51718            width: "wide",
51719            context: "standalone",
51720          });
51721      }
51722    },
51723  
51724    // Month
51725    M: function (date, token, localize) {
51726      const month = date.getMonth();
51727      switch (token) {
51728        case "M":
51729        case "MM":
51730          return lightFormatters.M(date, token);
51731        // 1st, 2nd, ..., 12th
51732        case "Mo":
51733          return localize.ordinalNumber(month + 1, { unit: "month" });
51734        // Jan, Feb, ..., Dec
51735        case "MMM":
51736          return localize.month(month, {
51737            width: "abbreviated",
51738            context: "formatting",
51739          });
51740        // J, F, ..., D
51741        case "MMMMM":
51742          return localize.month(month, {
51743            width: "narrow",
51744            context: "formatting",
51745          });
51746        // January, February, ..., December
51747        case "MMMM":
51748        default:
51749          return localize.month(month, { width: "wide", context: "formatting" });
51750      }
51751    },
51752  
51753    // Stand-alone month
51754    L: function (date, token, localize) {
51755      const month = date.getMonth();
51756      switch (token) {
51757        // 1, 2, ..., 12
51758        case "L":
51759          return String(month + 1);
51760        // 01, 02, ..., 12
51761        case "LL":
51762          return addLeadingZeros(month + 1, 2);
51763        // 1st, 2nd, ..., 12th
51764        case "Lo":
51765          return localize.ordinalNumber(month + 1, { unit: "month" });
51766        // Jan, Feb, ..., Dec
51767        case "LLL":
51768          return localize.month(month, {
51769            width: "abbreviated",
51770            context: "standalone",
51771          });
51772        // J, F, ..., D
51773        case "LLLLL":
51774          return localize.month(month, {
51775            width: "narrow",
51776            context: "standalone",
51777          });
51778        // January, February, ..., December
51779        case "LLLL":
51780        default:
51781          return localize.month(month, { width: "wide", context: "standalone" });
51782      }
51783    },
51784  
51785    // Local week of year
51786    w: function (date, token, localize, options) {
51787      const week = getWeek(date, options);
51788  
51789      if (token === "wo") {
51790        return localize.ordinalNumber(week, { unit: "week" });
51791      }
51792  
51793      return addLeadingZeros(week, token.length);
51794    },
51795  
51796    // ISO week of year
51797    I: function (date, token, localize) {
51798      const isoWeek = getISOWeek(date);
51799  
51800      if (token === "Io") {
51801        return localize.ordinalNumber(isoWeek, { unit: "week" });
51802      }
51803  
51804      return addLeadingZeros(isoWeek, token.length);
51805    },
51806  
51807    // Day of the month
51808    d: function (date, token, localize) {
51809      if (token === "do") {
51810        return localize.ordinalNumber(date.getDate(), { unit: "date" });
51811      }
51812  
51813      return lightFormatters.d(date, token);
51814    },
51815  
51816    // Day of year
51817    D: function (date, token, localize) {
51818      const dayOfYear = getDayOfYear(date);
51819  
51820      if (token === "Do") {
51821        return localize.ordinalNumber(dayOfYear, { unit: "dayOfYear" });
51822      }
51823  
51824      return addLeadingZeros(dayOfYear, token.length);
51825    },
51826  
51827    // Day of week
51828    E: function (date, token, localize) {
51829      const dayOfWeek = date.getDay();
51830      switch (token) {
51831        // Tue
51832        case "E":
51833        case "EE":
51834        case "EEE":
51835          return localize.day(dayOfWeek, {
51836            width: "abbreviated",
51837            context: "formatting",
51838          });
51839        // T
51840        case "EEEEE":
51841          return localize.day(dayOfWeek, {
51842            width: "narrow",
51843            context: "formatting",
51844          });
51845        // Tu
51846        case "EEEEEE":
51847          return localize.day(dayOfWeek, {
51848            width: "short",
51849            context: "formatting",
51850          });
51851        // Tuesday
51852        case "EEEE":
51853        default:
51854          return localize.day(dayOfWeek, {
51855            width: "wide",
51856            context: "formatting",
51857          });
51858      }
51859    },
51860  
51861    // Local day of week
51862    e: function (date, token, localize, options) {
51863      const dayOfWeek = date.getDay();
51864      const localDayOfWeek = (dayOfWeek - options.weekStartsOn + 8) % 7 || 7;
51865      switch (token) {
51866        // Numerical value (Nth day of week with current locale or weekStartsOn)
51867        case "e":
51868          return String(localDayOfWeek);
51869        // Padded numerical value
51870        case "ee":
51871          return addLeadingZeros(localDayOfWeek, 2);
51872        // 1st, 2nd, ..., 7th
51873        case "eo":
51874          return localize.ordinalNumber(localDayOfWeek, { unit: "day" });
51875        case "eee":
51876          return localize.day(dayOfWeek, {
51877            width: "abbreviated",
51878            context: "formatting",
51879          });
51880        // T
51881        case "eeeee":
51882          return localize.day(dayOfWeek, {
51883            width: "narrow",
51884            context: "formatting",
51885          });
51886        // Tu
51887        case "eeeeee":
51888          return localize.day(dayOfWeek, {
51889            width: "short",
51890            context: "formatting",
51891          });
51892        // Tuesday
51893        case "eeee":
51894        default:
51895          return localize.day(dayOfWeek, {
51896            width: "wide",
51897            context: "formatting",
51898          });
51899      }
51900    },
51901  
51902    // Stand-alone local day of week
51903    c: function (date, token, localize, options) {
51904      const dayOfWeek = date.getDay();
51905      const localDayOfWeek = (dayOfWeek - options.weekStartsOn + 8) % 7 || 7;
51906      switch (token) {
51907        // Numerical value (same as in `e`)
51908        case "c":
51909          return String(localDayOfWeek);
51910        // Padded numerical value
51911        case "cc":
51912          return addLeadingZeros(localDayOfWeek, token.length);
51913        // 1st, 2nd, ..., 7th
51914        case "co":
51915          return localize.ordinalNumber(localDayOfWeek, { unit: "day" });
51916        case "ccc":
51917          return localize.day(dayOfWeek, {
51918            width: "abbreviated",
51919            context: "standalone",
51920          });
51921        // T
51922        case "ccccc":
51923          return localize.day(dayOfWeek, {
51924            width: "narrow",
51925            context: "standalone",
51926          });
51927        // Tu
51928        case "cccccc":
51929          return localize.day(dayOfWeek, {
51930            width: "short",
51931            context: "standalone",
51932          });
51933        // Tuesday
51934        case "cccc":
51935        default:
51936          return localize.day(dayOfWeek, {
51937            width: "wide",
51938            context: "standalone",
51939          });
51940      }
51941    },
51942  
51943    // ISO day of week
51944    i: function (date, token, localize) {
51945      const dayOfWeek = date.getDay();
51946      const isoDayOfWeek = dayOfWeek === 0 ? 7 : dayOfWeek;
51947      switch (token) {
51948        // 2
51949        case "i":
51950          return String(isoDayOfWeek);
51951        // 02
51952        case "ii":
51953          return addLeadingZeros(isoDayOfWeek, token.length);
51954        // 2nd
51955        case "io":
51956          return localize.ordinalNumber(isoDayOfWeek, { unit: "day" });
51957        // Tue
51958        case "iii":
51959          return localize.day(dayOfWeek, {
51960            width: "abbreviated",
51961            context: "formatting",
51962          });
51963        // T
51964        case "iiiii":
51965          return localize.day(dayOfWeek, {
51966            width: "narrow",
51967            context: "formatting",
51968          });
51969        // Tu
51970        case "iiiiii":
51971          return localize.day(dayOfWeek, {
51972            width: "short",
51973            context: "formatting",
51974          });
51975        // Tuesday
51976        case "iiii":
51977        default:
51978          return localize.day(dayOfWeek, {
51979            width: "wide",
51980            context: "formatting",
51981          });
51982      }
51983    },
51984  
51985    // AM or PM
51986    a: function (date, token, localize) {
51987      const hours = date.getHours();
51988      const dayPeriodEnumValue = hours / 12 >= 1 ? "pm" : "am";
51989  
51990      switch (token) {
51991        case "a":
51992        case "aa":
51993          return localize.dayPeriod(dayPeriodEnumValue, {
51994            width: "abbreviated",
51995            context: "formatting",
51996          });
51997        case "aaa":
51998          return localize
51999            .dayPeriod(dayPeriodEnumValue, {
52000              width: "abbreviated",
52001              context: "formatting",
52002            })
52003            .toLowerCase();
52004        case "aaaaa":
52005          return localize.dayPeriod(dayPeriodEnumValue, {
52006            width: "narrow",
52007            context: "formatting",
52008          });
52009        case "aaaa":
52010        default:
52011          return localize.dayPeriod(dayPeriodEnumValue, {
52012            width: "wide",
52013            context: "formatting",
52014          });
52015      }
52016    },
52017  
52018    // AM, PM, midnight, noon
52019    b: function (date, token, localize) {
52020      const hours = date.getHours();
52021      let dayPeriodEnumValue;
52022      if (hours === 12) {
52023        dayPeriodEnumValue = dayPeriodEnum.noon;
52024      } else if (hours === 0) {
52025        dayPeriodEnumValue = dayPeriodEnum.midnight;
52026      } else {
52027        dayPeriodEnumValue = hours / 12 >= 1 ? "pm" : "am";
52028      }
52029  
52030      switch (token) {
52031        case "b":
52032        case "bb":
52033          return localize.dayPeriod(dayPeriodEnumValue, {
52034            width: "abbreviated",
52035            context: "formatting",
52036          });
52037        case "bbb":
52038          return localize
52039            .dayPeriod(dayPeriodEnumValue, {
52040              width: "abbreviated",
52041              context: "formatting",
52042            })
52043            .toLowerCase();
52044        case "bbbbb":
52045          return localize.dayPeriod(dayPeriodEnumValue, {
52046            width: "narrow",
52047            context: "formatting",
52048          });
52049        case "bbbb":
52050        default:
52051          return localize.dayPeriod(dayPeriodEnumValue, {
52052            width: "wide",
52053            context: "formatting",
52054          });
52055      }
52056    },
52057  
52058    // in the morning, in the afternoon, in the evening, at night
52059    B: function (date, token, localize) {
52060      const hours = date.getHours();
52061      let dayPeriodEnumValue;
52062      if (hours >= 17) {
52063        dayPeriodEnumValue = dayPeriodEnum.evening;
52064      } else if (hours >= 12) {
52065        dayPeriodEnumValue = dayPeriodEnum.afternoon;
52066      } else if (hours >= 4) {
52067        dayPeriodEnumValue = dayPeriodEnum.morning;
52068      } else {
52069        dayPeriodEnumValue = dayPeriodEnum.night;
52070      }
52071  
52072      switch (token) {
52073        case "B":
52074        case "BB":
52075        case "BBB":
52076          return localize.dayPeriod(dayPeriodEnumValue, {
52077            width: "abbreviated",
52078            context: "formatting",
52079          });
52080        case "BBBBB":
52081          return localize.dayPeriod(dayPeriodEnumValue, {
52082            width: "narrow",
52083            context: "formatting",
52084          });
52085        case "BBBB":
52086        default:
52087          return localize.dayPeriod(dayPeriodEnumValue, {
52088            width: "wide",
52089            context: "formatting",
52090          });
52091      }
52092    },
52093  
52094    // Hour [1-12]
52095    h: function (date, token, localize) {
52096      if (token === "ho") {
52097        let hours = date.getHours() % 12;
52098        if (hours === 0) hours = 12;
52099        return localize.ordinalNumber(hours, { unit: "hour" });
52100      }
52101  
52102      return lightFormatters.h(date, token);
52103    },
52104  
52105    // Hour [0-23]
52106    H: function (date, token, localize) {
52107      if (token === "Ho") {
52108        return localize.ordinalNumber(date.getHours(), { unit: "hour" });
52109      }
52110  
52111      return lightFormatters.H(date, token);
52112    },
52113  
52114    // Hour [0-11]
52115    K: function (date, token, localize) {
52116      const hours = date.getHours() % 12;
52117  
52118      if (token === "Ko") {
52119        return localize.ordinalNumber(hours, { unit: "hour" });
52120      }
52121  
52122      return addLeadingZeros(hours, token.length);
52123    },
52124  
52125    // Hour [1-24]
52126    k: function (date, token, localize) {
52127      let hours = date.getHours();
52128      if (hours === 0) hours = 24;
52129  
52130      if (token === "ko") {
52131        return localize.ordinalNumber(hours, { unit: "hour" });
52132      }
52133  
52134      return addLeadingZeros(hours, token.length);
52135    },
52136  
52137    // Minute
52138    m: function (date, token, localize) {
52139      if (token === "mo") {
52140        return localize.ordinalNumber(date.getMinutes(), { unit: "minute" });
52141      }
52142  
52143      return lightFormatters.m(date, token);
52144    },
52145  
52146    // Second
52147    s: function (date, token, localize) {
52148      if (token === "so") {
52149        return localize.ordinalNumber(date.getSeconds(), { unit: "second" });
52150      }
52151  
52152      return lightFormatters.s(date, token);
52153    },
52154  
52155    // Fraction of second
52156    S: function (date, token) {
52157      return lightFormatters.S(date, token);
52158    },
52159  
52160    // Timezone (ISO-8601. If offset is 0, output is always `'Z'`)
52161    X: function (date, token, _localize) {
52162      const timezoneOffset = date.getTimezoneOffset();
52163  
52164      if (timezoneOffset === 0) {
52165        return "Z";
52166      }
52167  
52168      switch (token) {
52169        // Hours and optional minutes
52170        case "X":
52171          return formatTimezoneWithOptionalMinutes(timezoneOffset);
52172  
52173        // Hours, minutes and optional seconds without `:` delimiter
52174        // Note: neither ISO-8601 nor JavaScript supports seconds in timezone offsets
52175        // so this token always has the same output as `XX`
52176        case "XXXX":
52177        case "XX": // Hours and minutes without `:` delimiter
52178          return formatTimezone(timezoneOffset);
52179  
52180        // Hours, minutes and optional seconds with `:` delimiter
52181        // Note: neither ISO-8601 nor JavaScript supports seconds in timezone offsets
52182        // so this token always has the same output as `XXX`
52183        case "XXXXX":
52184        case "XXX": // Hours and minutes with `:` delimiter
52185        default:
52186          return formatTimezone(timezoneOffset, ":");
52187      }
52188    },
52189  
52190    // Timezone (ISO-8601. If offset is 0, output is `'+00:00'` or equivalent)
52191    x: function (date, token, _localize) {
52192      const timezoneOffset = date.getTimezoneOffset();
52193  
52194      switch (token) {
52195        // Hours and optional minutes
52196        case "x":
52197          return formatTimezoneWithOptionalMinutes(timezoneOffset);
52198  
52199        // Hours, minutes and optional seconds without `:` delimiter
52200        // Note: neither ISO-8601 nor JavaScript supports seconds in timezone offsets
52201        // so this token always has the same output as `xx`
52202        case "xxxx":
52203        case "xx": // Hours and minutes without `:` delimiter
52204          return formatTimezone(timezoneOffset);
52205  
52206        // Hours, minutes and optional seconds with `:` delimiter
52207        // Note: neither ISO-8601 nor JavaScript supports seconds in timezone offsets
52208        // so this token always has the same output as `xxx`
52209        case "xxxxx":
52210        case "xxx": // Hours and minutes with `:` delimiter
52211        default:
52212          return formatTimezone(timezoneOffset, ":");
52213      }
52214    },
52215  
52216    // Timezone (GMT)
52217    O: function (date, token, _localize) {
52218      const timezoneOffset = date.getTimezoneOffset();
52219  
52220      switch (token) {
52221        // Short
52222        case "O":
52223        case "OO":
52224        case "OOO":
52225          return "GMT" + formatTimezoneShort(timezoneOffset, ":");
52226        // Long
52227        case "OOOO":
52228        default:
52229          return "GMT" + formatTimezone(timezoneOffset, ":");
52230      }
52231    },
52232  
52233    // Timezone (specific non-location)
52234    z: function (date, token, _localize) {
52235      const timezoneOffset = date.getTimezoneOffset();
52236  
52237      switch (token) {
52238        // Short
52239        case "z":
52240        case "zz":
52241        case "zzz":
52242          return "GMT" + formatTimezoneShort(timezoneOffset, ":");
52243        // Long
52244        case "zzzz":
52245        default:
52246          return "GMT" + formatTimezone(timezoneOffset, ":");
52247      }
52248    },
52249  
52250    // Seconds timestamp
52251    t: function (date, token, _localize) {
52252      const timestamp = Math.trunc(date.getTime() / 1000);
52253      return addLeadingZeros(timestamp, token.length);
52254    },
52255  
52256    // Milliseconds timestamp
52257    T: function (date, token, _localize) {
52258      const timestamp = date.getTime();
52259      return addLeadingZeros(timestamp, token.length);
52260    },
52261  };
52262  
52263  function formatTimezoneShort(offset, delimiter = "") {
52264    const sign = offset > 0 ? "-" : "+";
52265    const absOffset = Math.abs(offset);
52266    const hours = Math.trunc(absOffset / 60);
52267    const minutes = absOffset % 60;
52268    if (minutes === 0) {
52269      return sign + String(hours);
52270    }
52271    return sign + String(hours) + delimiter + addLeadingZeros(minutes, 2);
52272  }
52273  
52274  function formatTimezoneWithOptionalMinutes(offset, delimiter) {
52275    if (offset % 60 === 0) {
52276      const sign = offset > 0 ? "-" : "+";
52277      return sign + addLeadingZeros(Math.abs(offset) / 60, 2);
52278    }
52279    return formatTimezone(offset, delimiter);
52280  }
52281  
52282  function formatTimezone(offset, delimiter = "") {
52283    const sign = offset > 0 ? "-" : "+";
52284    const absOffset = Math.abs(offset);
52285    const hours = addLeadingZeros(Math.trunc(absOffset / 60), 2);
52286    const minutes = addLeadingZeros(absOffset % 60, 2);
52287    return sign + hours + delimiter + minutes;
52288  }
52289  
52290  ;// CONCATENATED MODULE: ./node_modules/date-fns/_lib/format/longFormatters.mjs
52291  const dateLongFormatter = (pattern, formatLong) => {
52292    switch (pattern) {
52293      case "P":
52294        return formatLong.date({ width: "short" });
52295      case "PP":
52296        return formatLong.date({ width: "medium" });
52297      case "PPP":
52298        return formatLong.date({ width: "long" });
52299      case "PPPP":
52300      default:
52301        return formatLong.date({ width: "full" });
52302    }
52303  };
52304  
52305  const timeLongFormatter = (pattern, formatLong) => {
52306    switch (pattern) {
52307      case "p":
52308        return formatLong.time({ width: "short" });
52309      case "pp":
52310        return formatLong.time({ width: "medium" });
52311      case "ppp":
52312        return formatLong.time({ width: "long" });
52313      case "pppp":
52314      default:
52315        return formatLong.time({ width: "full" });
52316    }
52317  };
52318  
52319  const dateTimeLongFormatter = (pattern, formatLong) => {
52320    const matchResult = pattern.match(/(P+)(p+)?/) || [];
52321    const datePattern = matchResult[1];
52322    const timePattern = matchResult[2];
52323  
52324    if (!timePattern) {
52325      return dateLongFormatter(pattern, formatLong);
52326    }
52327  
52328    let dateTimeFormat;
52329  
52330    switch (datePattern) {
52331      case "P":
52332        dateTimeFormat = formatLong.dateTime({ width: "short" });
52333        break;
52334      case "PP":
52335        dateTimeFormat = formatLong.dateTime({ width: "medium" });
52336        break;
52337      case "PPP":
52338        dateTimeFormat = formatLong.dateTime({ width: "long" });
52339        break;
52340      case "PPPP":
52341      default:
52342        dateTimeFormat = formatLong.dateTime({ width: "full" });
52343        break;
52344    }
52345  
52346    return dateTimeFormat
52347      .replace("{{date}}", dateLongFormatter(datePattern, formatLong))
52348      .replace("{{time}}", timeLongFormatter(timePattern, formatLong));
52349  };
52350  
52351  const longFormatters = {
52352    p: timeLongFormatter,
52353    P: dateTimeLongFormatter,
52354  };
52355  
52356  ;// CONCATENATED MODULE: ./node_modules/date-fns/_lib/protectedTokens.mjs
52357  const dayOfYearTokenRE = /^D+$/;
52358  const weekYearTokenRE = /^Y+$/;
52359  
52360  const throwTokens = ["D", "DD", "YY", "YYYY"];
52361  
52362  function isProtectedDayOfYearToken(token) {
52363    return dayOfYearTokenRE.test(token);
52364  }
52365  
52366  function isProtectedWeekYearToken(token) {
52367    return weekYearTokenRE.test(token);
52368  }
52369  
52370  function warnOrThrowProtectedError(token, format, input) {
52371    const _message = message(token, format, input);
52372    console.warn(_message);
52373    if (throwTokens.includes(token)) throw new RangeError(_message);
52374  }
52375  
52376  function message(token, format, input) {
52377    const subject = token[0] === "Y" ? "years" : "days of the month";
52378    return `Use \`$token.toLowerCase()}\` instead of \`$token}\` (in \`$format}\`) for formatting $subject} to the input \`$input}\`; see: https://github.com/date-fns/date-fns/blob/master/docs/unicodeTokens.md`;
52379  }
52380  
52381  ;// CONCATENATED MODULE: ./node_modules/date-fns/isDate.mjs
52382  /**
52383   * @name isDate
52384   * @category Common Helpers
52385   * @summary Is the given value a date?
52386   *
52387   * @description
52388   * Returns true if the given value is an instance of Date. The function works for dates transferred across iframes.
52389   *
52390   * @param value - The value to check
52391   *
52392   * @returns True if the given value is a date
52393   *
52394   * @example
52395   * // For a valid date:
52396   * const result = isDate(new Date())
52397   * //=> true
52398   *
52399   * @example
52400   * // For an invalid date:
52401   * const result = isDate(new Date(NaN))
52402   * //=> true
52403   *
52404   * @example
52405   * // For some value:
52406   * const result = isDate('2014-02-31')
52407   * //=> false
52408   *
52409   * @example
52410   * // For an object:
52411   * const result = isDate({})
52412   * //=> false
52413   */
52414  function isDate(value) {
52415    return (
52416      value instanceof Date ||
52417      (typeof value === "object" &&
52418        Object.prototype.toString.call(value) === "[object Date]")
52419    );
52420  }
52421  
52422  // Fallback for modularized imports:
52423  /* harmony default export */ const date_fns_isDate = ((/* unused pure expression or super */ null && (isDate)));
52424  
52425  ;// CONCATENATED MODULE: ./node_modules/date-fns/isValid.mjs
52426  
52427  
52428  
52429  /**
52430   * @name isValid
52431   * @category Common Helpers
52432   * @summary Is the given date valid?
52433   *
52434   * @description
52435   * Returns false if argument is Invalid Date and true otherwise.
52436   * Argument is converted to Date using `toDate`. See [toDate](https://date-fns.org/docs/toDate)
52437   * Invalid Date is a Date, whose time value is NaN.
52438   *
52439   * Time value of Date: http://es5.github.io/#x15.9.1.1
52440   *
52441   * @typeParam DateType - The `Date` type, the function operates on. Gets inferred from passed arguments. Allows to use extensions like [`UTCDate`](https://github.com/date-fns/utc).
52442   *
52443   * @param date - The date to check
52444   *
52445   * @returns The date is valid
52446   *
52447   * @example
52448   * // For the valid date:
52449   * const result = isValid(new Date(2014, 1, 31))
52450   * //=> true
52451   *
52452   * @example
52453   * // For the value, convertable into a date:
52454   * const result = isValid(1393804800000)
52455   * //=> true
52456   *
52457   * @example
52458   * // For the invalid date:
52459   * const result = isValid(new Date(''))
52460   * //=> false
52461   */
52462  function isValid(date) {
52463    if (!isDate(date) && typeof date !== "number") {
52464      return false;
52465    }
52466    const _date = toDate(date);
52467    return !isNaN(Number(_date));
52468  }
52469  
52470  // Fallback for modularized imports:
52471  /* harmony default export */ const date_fns_isValid = ((/* unused pure expression or super */ null && (isValid)));
52472  
52473  ;// CONCATENATED MODULE: ./node_modules/date-fns/format.mjs
52474  
52475  
52476  
52477  
52478  
52479  
52480  
52481  
52482  // Rexports of internal for libraries to use.
52483  // See: https://github.com/date-fns/date-fns/issues/3638#issuecomment-1877082874
52484  
52485  
52486  // This RegExp consists of three parts separated by `|`:
52487  // - [yYQqMLwIdDecihHKkms]o matches any available ordinal number token
52488  //   (one of the certain letters followed by `o`)
52489  // - (\w)\1* matches any sequences of the same letter
52490  // - '' matches two quote characters in a row
52491  // - '(''|[^'])+('|$) matches anything surrounded by two quote characters ('),
52492  //   except a single quote symbol, which ends the sequence.
52493  //   Two quote characters do not end the sequence.
52494  //   If there is no matching single quote
52495  //   then the sequence will continue until the end of the string.
52496  // - . matches any single character unmatched by previous parts of the RegExps
52497  const formattingTokensRegExp =
52498    /[yYQqMLwIdDecihHKkms]o|(\w)\1*|''|'(''|[^'])+('|$)|./g;
52499  
52500  // This RegExp catches symbols escaped by quotes, and also
52501  // sequences of symbols P, p, and the combinations like `PPPPPPPppppp`
52502  const longFormattingTokensRegExp = /P+p+|P+|p+|''|'(''|[^'])+('|$)|./g;
52503  
52504  const escapedStringRegExp = /^'([^]*?)'?$/;
52505  const doubleQuoteRegExp = /''/g;
52506  const unescapedLatinCharacterRegExp = /[a-zA-Z]/;
52507  
52508  
52509  
52510  /**
52511   * The {@link format} function options.
52512   */
52513  
52514  /**
52515   * @name format
52516   * @alias formatDate
52517   * @category Common Helpers
52518   * @summary Format the date.
52519   *
52520   * @description
52521   * Return the formatted date string in the given format. The result may vary by locale.
52522   *
52523   * > ⚠️ Please note that the `format` tokens differ from Moment.js and other libraries.
52524   * > See: https://github.com/date-fns/date-fns/blob/master/docs/unicodeTokens.md
52525   *
52526   * The characters wrapped between two single quotes characters (') are escaped.
52527   * Two single quotes in a row, whether inside or outside a quoted sequence, represent a 'real' single quote.
52528   * (see the last example)
52529   *
52530   * Format of the string is based on Unicode Technical Standard #35:
52531   * https://www.unicode.org/reports/tr35/tr35-dates.html#Date_Field_Symbol_Table
52532   * with a few additions (see note 7 below the table).
52533   *
52534   * Accepted patterns:
52535   * | Unit                            | Pattern | Result examples                   | Notes |
52536   * |---------------------------------|---------|-----------------------------------|-------|
52537   * | Era                             | G..GGG  | AD, BC                            |       |
52538   * |                                 | GGGG    | Anno Domini, Before Christ        | 2     |
52539   * |                                 | GGGGG   | A, B                              |       |
52540   * | Calendar year                   | y       | 44, 1, 1900, 2017                 | 5     |
52541   * |                                 | yo      | 44th, 1st, 0th, 17th              | 5,7   |
52542   * |                                 | yy      | 44, 01, 00, 17                    | 5     |
52543   * |                                 | yyy     | 044, 001, 1900, 2017              | 5     |
52544   * |                                 | yyyy    | 0044, 0001, 1900, 2017            | 5     |
52545   * |                                 | yyyyy   | ...                               | 3,5   |
52546   * | Local week-numbering year       | Y       | 44, 1, 1900, 2017                 | 5     |
52547   * |                                 | Yo      | 44th, 1st, 1900th, 2017th         | 5,7   |
52548   * |                                 | YY      | 44, 01, 00, 17                    | 5,8   |
52549   * |                                 | YYY     | 044, 001, 1900, 2017              | 5     |
52550   * |                                 | YYYY    | 0044, 0001, 1900, 2017            | 5,8   |
52551   * |                                 | YYYYY   | ...                               | 3,5   |
52552   * | ISO week-numbering year         | R       | -43, 0, 1, 1900, 2017             | 5,7   |
52553   * |                                 | RR      | -43, 00, 01, 1900, 2017           | 5,7   |
52554   * |                                 | RRR     | -043, 000, 001, 1900, 2017        | 5,7   |
52555   * |                                 | RRRR    | -0043, 0000, 0001, 1900, 2017     | 5,7   |
52556   * |                                 | RRRRR   | ...                               | 3,5,7 |
52557   * | Extended year                   | u       | -43, 0, 1, 1900, 2017             | 5     |
52558   * |                                 | uu      | -43, 01, 1900, 2017               | 5     |
52559   * |                                 | uuu     | -043, 001, 1900, 2017             | 5     |
52560   * |                                 | uuuu    | -0043, 0001, 1900, 2017           | 5     |
52561   * |                                 | uuuuu   | ...                               | 3,5   |
52562   * | Quarter (formatting)            | Q       | 1, 2, 3, 4                        |       |
52563   * |                                 | Qo      | 1st, 2nd, 3rd, 4th                | 7     |
52564   * |                                 | QQ      | 01, 02, 03, 04                    |       |
52565   * |                                 | QQQ     | Q1, Q2, Q3, Q4                    |       |
52566   * |                                 | QQQQ    | 1st quarter, 2nd quarter, ...     | 2     |
52567   * |                                 | QQQQQ   | 1, 2, 3, 4                        | 4     |
52568   * | Quarter (stand-alone)           | q       | 1, 2, 3, 4                        |       |
52569   * |                                 | qo      | 1st, 2nd, 3rd, 4th                | 7     |
52570   * |                                 | qq      | 01, 02, 03, 04                    |       |
52571   * |                                 | qqq     | Q1, Q2, Q3, Q4                    |       |
52572   * |                                 | qqqq    | 1st quarter, 2nd quarter, ...     | 2     |
52573   * |                                 | qqqqq   | 1, 2, 3, 4                        | 4     |
52574   * | Month (formatting)              | M       | 1, 2, ..., 12                     |       |
52575   * |                                 | Mo      | 1st, 2nd, ..., 12th               | 7     |
52576   * |                                 | MM      | 01, 02, ..., 12                   |       |
52577   * |                                 | MMM     | Jan, Feb, ..., Dec                |       |
52578   * |                                 | MMMM    | January, February, ..., December  | 2     |
52579   * |                                 | MMMMM   | J, F, ..., D                      |       |
52580   * | Month (stand-alone)             | L       | 1, 2, ..., 12                     |       |
52581   * |                                 | Lo      | 1st, 2nd, ..., 12th               | 7     |
52582   * |                                 | LL      | 01, 02, ..., 12                   |       |
52583   * |                                 | LLL     | Jan, Feb, ..., Dec                |       |
52584   * |                                 | LLLL    | January, February, ..., December  | 2     |
52585   * |                                 | LLLLL   | J, F, ..., D                      |       |
52586   * | Local week of year              | w       | 1, 2, ..., 53                     |       |
52587   * |                                 | wo      | 1st, 2nd, ..., 53th               | 7     |
52588   * |                                 | ww      | 01, 02, ..., 53                   |       |
52589   * | ISO week of year                | I       | 1, 2, ..., 53                     | 7     |
52590   * |                                 | Io      | 1st, 2nd, ..., 53th               | 7     |
52591   * |                                 | II      | 01, 02, ..., 53                   | 7     |
52592   * | Day of month                    | d       | 1, 2, ..., 31                     |       |
52593   * |                                 | do      | 1st, 2nd, ..., 31st               | 7     |
52594   * |                                 | dd      | 01, 02, ..., 31                   |       |
52595   * | Day of year                     | D       | 1, 2, ..., 365, 366               | 9     |
52596   * |                                 | Do      | 1st, 2nd, ..., 365th, 366th       | 7     |
52597   * |                                 | DD      | 01, 02, ..., 365, 366             | 9     |
52598   * |                                 | DDD     | 001, 002, ..., 365, 366           |       |
52599   * |                                 | DDDD    | ...                               | 3     |
52600   * | Day of week (formatting)        | E..EEE  | Mon, Tue, Wed, ..., Sun           |       |
52601   * |                                 | EEEE    | Monday, Tuesday, ..., Sunday      | 2     |
52602   * |                                 | EEEEE   | M, T, W, T, F, S, S               |       |
52603   * |                                 | EEEEEE  | Mo, Tu, We, Th, Fr, Sa, Su        |       |
52604   * | ISO day of week (formatting)    | i       | 1, 2, 3, ..., 7                   | 7     |
52605   * |                                 | io      | 1st, 2nd, ..., 7th                | 7     |
52606   * |                                 | ii      | 01, 02, ..., 07                   | 7     |
52607   * |                                 | iii     | Mon, Tue, Wed, ..., Sun           | 7     |
52608   * |                                 | iiii    | Monday, Tuesday, ..., Sunday      | 2,7   |
52609   * |                                 | iiiii   | M, T, W, T, F, S, S               | 7     |
52610   * |                                 | iiiiii  | Mo, Tu, We, Th, Fr, Sa, Su        | 7     |
52611   * | Local day of week (formatting)  | e       | 2, 3, 4, ..., 1                   |       |
52612   * |                                 | eo      | 2nd, 3rd, ..., 1st                | 7     |
52613   * |                                 | ee      | 02, 03, ..., 01                   |       |
52614   * |                                 | eee     | Mon, Tue, Wed, ..., Sun           |       |
52615   * |                                 | eeee    | Monday, Tuesday, ..., Sunday      | 2     |
52616   * |                                 | eeeee   | M, T, W, T, F, S, S               |       |
52617   * |                                 | eeeeee  | Mo, Tu, We, Th, Fr, Sa, Su        |       |
52618   * | Local day of week (stand-alone) | c       | 2, 3, 4, ..., 1                   |       |
52619   * |                                 | co      | 2nd, 3rd, ..., 1st                | 7     |
52620   * |                                 | cc      | 02, 03, ..., 01                   |       |
52621   * |                                 | ccc     | Mon, Tue, Wed, ..., Sun           |       |
52622   * |                                 | cccc    | Monday, Tuesday, ..., Sunday      | 2     |
52623   * |                                 | ccccc   | M, T, W, T, F, S, S               |       |
52624   * |                                 | cccccc  | Mo, Tu, We, Th, Fr, Sa, Su        |       |
52625   * | AM, PM                          | a..aa   | AM, PM                            |       |
52626   * |                                 | aaa     | am, pm                            |       |
52627   * |                                 | aaaa    | a.m., p.m.                        | 2     |
52628   * |                                 | aaaaa   | a, p                              |       |
52629   * | AM, PM, noon, midnight          | b..bb   | AM, PM, noon, midnight            |       |
52630   * |                                 | bbb     | am, pm, noon, midnight            |       |
52631   * |                                 | bbbb    | a.m., p.m., noon, midnight        | 2     |
52632   * |                                 | bbbbb   | a, p, n, mi                       |       |
52633   * | Flexible day period             | B..BBB  | at night, in the morning, ...     |       |
52634   * |                                 | BBBB    | at night, in the morning, ...     | 2     |
52635   * |                                 | BBBBB   | at night, in the morning, ...     |       |
52636   * | Hour [1-12]                     | h       | 1, 2, ..., 11, 12                 |       |
52637   * |                                 | ho      | 1st, 2nd, ..., 11th, 12th         | 7     |
52638   * |                                 | hh      | 01, 02, ..., 11, 12               |       |
52639   * | Hour [0-23]                     | H       | 0, 1, 2, ..., 23                  |       |
52640   * |                                 | Ho      | 0th, 1st, 2nd, ..., 23rd          | 7     |
52641   * |                                 | HH      | 00, 01, 02, ..., 23               |       |
52642   * | Hour [0-11]                     | K       | 1, 2, ..., 11, 0                  |       |
52643   * |                                 | Ko      | 1st, 2nd, ..., 11th, 0th          | 7     |
52644   * |                                 | KK      | 01, 02, ..., 11, 00               |       |
52645   * | Hour [1-24]                     | k       | 24, 1, 2, ..., 23                 |       |
52646   * |                                 | ko      | 24th, 1st, 2nd, ..., 23rd         | 7     |
52647   * |                                 | kk      | 24, 01, 02, ..., 23               |       |
52648   * | Minute                          | m       | 0, 1, ..., 59                     |       |
52649   * |                                 | mo      | 0th, 1st, ..., 59th               | 7     |
52650   * |                                 | mm      | 00, 01, ..., 59                   |       |
52651   * | Second                          | s       | 0, 1, ..., 59                     |       |
52652   * |                                 | so      | 0th, 1st, ..., 59th               | 7     |
52653   * |                                 | ss      | 00, 01, ..., 59                   |       |
52654   * | Fraction of second              | S       | 0, 1, ..., 9                      |       |
52655   * |                                 | SS      | 00, 01, ..., 99                   |       |
52656   * |                                 | SSS     | 000, 001, ..., 999                |       |
52657   * |                                 | SSSS    | ...                               | 3     |
52658   * | Timezone (ISO-8601 w/ Z)        | X       | -08, +0530, Z                     |       |
52659   * |                                 | XX      | -0800, +0530, Z                   |       |
52660   * |                                 | XXX     | -08:00, +05:30, Z                 |       |
52661   * |                                 | XXXX    | -0800, +0530, Z, +123456          | 2     |
52662   * |                                 | XXXXX   | -08:00, +05:30, Z, +12:34:56      |       |
52663   * | Timezone (ISO-8601 w/o Z)       | x       | -08, +0530, +00                   |       |
52664   * |                                 | xx      | -0800, +0530, +0000               |       |
52665   * |                                 | xxx     | -08:00, +05:30, +00:00            | 2     |
52666   * |                                 | xxxx    | -0800, +0530, +0000, +123456      |       |
52667   * |                                 | xxxxx   | -08:00, +05:30, +00:00, +12:34:56 |       |
52668   * | Timezone (GMT)                  | O...OOO | GMT-8, GMT+5:30, GMT+0            |       |
52669   * |                                 | OOOO    | GMT-08:00, GMT+05:30, GMT+00:00   | 2     |
52670   * | Timezone (specific non-locat.)  | z...zzz | GMT-8, GMT+5:30, GMT+0            | 6     |
52671   * |                                 | zzzz    | GMT-08:00, GMT+05:30, GMT+00:00   | 2,6   |
52672   * | Seconds timestamp               | t       | 512969520                         | 7     |
52673   * |                                 | tt      | ...                               | 3,7   |
52674   * | Milliseconds timestamp          | T       | 512969520900                      | 7     |
52675   * |                                 | TT      | ...                               | 3,7   |
52676   * | Long localized date             | P       | 04/29/1453                        | 7     |
52677   * |                                 | PP      | Apr 29, 1453                      | 7     |
52678   * |                                 | PPP     | April 29th, 1453                  | 7     |
52679   * |                                 | PPPP    | Friday, April 29th, 1453          | 2,7   |
52680   * | Long localized time             | p       | 12:00 AM                          | 7     |
52681   * |                                 | pp      | 12:00:00 AM                       | 7     |
52682   * |                                 | ppp     | 12:00:00 AM GMT+2                 | 7     |
52683   * |                                 | pppp    | 12:00:00 AM GMT+02:00             | 2,7   |
52684   * | Combination of date and time    | Pp      | 04/29/1453, 12:00 AM              | 7     |
52685   * |                                 | PPpp    | Apr 29, 1453, 12:00:00 AM         | 7     |
52686   * |                                 | PPPppp  | April 29th, 1453 at ...           | 7     |
52687   * |                                 | PPPPpppp| Friday, April 29th, 1453 at ...   | 2,7   |
52688   * Notes:
52689   * 1. "Formatting" units (e.g. formatting quarter) in the default en-US locale
52690   *    are the same as "stand-alone" units, but are different in some languages.
52691   *    "Formatting" units are declined according to the rules of the language
52692   *    in the context of a date. "Stand-alone" units are always nominative singular:
52693   *
52694   *    `format(new Date(2017, 10, 6), 'do LLLL', {locale: cs}) //=> '6. listopad'`
52695   *
52696   *    `format(new Date(2017, 10, 6), 'do MMMM', {locale: cs}) //=> '6. listopadu'`
52697   *
52698   * 2. Any sequence of the identical letters is a pattern, unless it is escaped by
52699   *    the single quote characters (see below).
52700   *    If the sequence is longer than listed in table (e.g. `EEEEEEEEEEE`)
52701   *    the output will be the same as default pattern for this unit, usually
52702   *    the longest one (in case of ISO weekdays, `EEEE`). Default patterns for units
52703   *    are marked with "2" in the last column of the table.
52704   *
52705   *    `format(new Date(2017, 10, 6), 'MMM') //=> 'Nov'`
52706   *
52707   *    `format(new Date(2017, 10, 6), 'MMMM') //=> 'November'`
52708   *
52709   *    `format(new Date(2017, 10, 6), 'MMMMM') //=> 'N'`
52710   *
52711   *    `format(new Date(2017, 10, 6), 'MMMMMM') //=> 'November'`
52712   *
52713   *    `format(new Date(2017, 10, 6), 'MMMMMMM') //=> 'November'`
52714   *
52715   * 3. Some patterns could be unlimited length (such as `yyyyyyyy`).
52716   *    The output will be padded with zeros to match the length of the pattern.
52717   *
52718   *    `format(new Date(2017, 10, 6), 'yyyyyyyy') //=> '00002017'`
52719   *
52720   * 4. `QQQQQ` and `qqqqq` could be not strictly numerical in some locales.
52721   *    These tokens represent the shortest form of the quarter.
52722   *
52723   * 5. The main difference between `y` and `u` patterns are B.C. years:
52724   *
52725   *    | Year | `y` | `u` |
52726   *    |------|-----|-----|
52727   *    | AC 1 |   1 |   1 |
52728   *    | BC 1 |   1 |   0 |
52729   *    | BC 2 |   2 |  -1 |
52730   *
52731   *    Also `yy` always returns the last two digits of a year,
52732   *    while `uu` pads single digit years to 2 characters and returns other years unchanged:
52733   *
52734   *    | Year | `yy` | `uu` |
52735   *    |------|------|------|
52736   *    | 1    |   01 |   01 |
52737   *    | 14   |   14 |   14 |
52738   *    | 376  |   76 |  376 |
52739   *    | 1453 |   53 | 1453 |
52740   *
52741   *    The same difference is true for local and ISO week-numbering years (`Y` and `R`),
52742   *    except local week-numbering years are dependent on `options.weekStartsOn`
52743   *    and `options.firstWeekContainsDate` (compare [getISOWeekYear](https://date-fns.org/docs/getISOWeekYear)
52744   *    and [getWeekYear](https://date-fns.org/docs/getWeekYear)).
52745   *
52746   * 6. Specific non-location timezones are currently unavailable in `date-fns`,
52747   *    so right now these tokens fall back to GMT timezones.
52748   *
52749   * 7. These patterns are not in the Unicode Technical Standard #35:
52750   *    - `i`: ISO day of week
52751   *    - `I`: ISO week of year
52752   *    - `R`: ISO week-numbering year
52753   *    - `t`: seconds timestamp
52754   *    - `T`: milliseconds timestamp
52755   *    - `o`: ordinal number modifier
52756   *    - `P`: long localized date
52757   *    - `p`: long localized time
52758   *
52759   * 8. `YY` and `YYYY` tokens represent week-numbering years but they are often confused with years.
52760   *    You should enable `options.useAdditionalWeekYearTokens` to use them. See: https://github.com/date-fns/date-fns/blob/master/docs/unicodeTokens.md
52761   *
52762   * 9. `D` and `DD` tokens represent days of the year but they are often confused with days of the month.
52763   *    You should enable `options.useAdditionalDayOfYearTokens` to use them. See: https://github.com/date-fns/date-fns/blob/master/docs/unicodeTokens.md
52764   *
52765   * @typeParam DateType - The `Date` type, the function operates on. Gets inferred from passed arguments. Allows to use extensions like [`UTCDate`](https://github.com/date-fns/utc).
52766   *
52767   * @param date - The original date
52768   * @param format - The string of tokens
52769   * @param options - An object with options
52770   *
52771   * @returns The formatted date string
52772   *
52773   * @throws `date` must not be Invalid Date
52774   * @throws `options.locale` must contain `localize` property
52775   * @throws `options.locale` must contain `formatLong` property
52776   * @throws use `yyyy` instead of `YYYY` for formatting years using [format provided] to the input [input provided]; see: https://github.com/date-fns/date-fns/blob/master/docs/unicodeTokens.md
52777   * @throws use `yy` instead of `YY` for formatting years using [format provided] to the input [input provided]; see: https://github.com/date-fns/date-fns/blob/master/docs/unicodeTokens.md
52778   * @throws use `d` instead of `D` for formatting days of the month using [format provided] to the input [input provided]; see: https://github.com/date-fns/date-fns/blob/master/docs/unicodeTokens.md
52779   * @throws use `dd` instead of `DD` for formatting days of the month using [format provided] to the input [input provided]; see: https://github.com/date-fns/date-fns/blob/master/docs/unicodeTokens.md
52780   * @throws format string contains an unescaped latin alphabet character
52781   *
52782   * @example
52783   * // Represent 11 February 2014 in middle-endian format:
52784   * const result = format(new Date(2014, 1, 11), 'MM/dd/yyyy')
52785   * //=> '02/11/2014'
52786   *
52787   * @example
52788   * // Represent 2 July 2014 in Esperanto:
52789   * import { eoLocale } from 'date-fns/locale/eo'
52790   * const result = format(new Date(2014, 6, 2), "do 'de' MMMM yyyy", {
52791   *   locale: eoLocale
52792   * })
52793   * //=> '2-a de julio 2014'
52794   *
52795   * @example
52796   * // Escape string by single quote characters:
52797   * const result = format(new Date(2014, 6, 2, 15), "h 'o''clock'")
52798   * //=> "3 o'clock"
52799   */
52800  function format(date, formatStr, options) {
52801    const defaultOptions = getDefaultOptions();
52802    const locale = options?.locale ?? defaultOptions.locale ?? enUS;
52803  
52804    const firstWeekContainsDate =
52805      options?.firstWeekContainsDate ??
52806      options?.locale?.options?.firstWeekContainsDate ??
52807      defaultOptions.firstWeekContainsDate ??
52808      defaultOptions.locale?.options?.firstWeekContainsDate ??
52809      1;
52810  
52811    const weekStartsOn =
52812      options?.weekStartsOn ??
52813      options?.locale?.options?.weekStartsOn ??
52814      defaultOptions.weekStartsOn ??
52815      defaultOptions.locale?.options?.weekStartsOn ??
52816      0;
52817  
52818    const originalDate = toDate(date);
52819  
52820    if (!isValid(originalDate)) {
52821      throw new RangeError("Invalid time value");
52822    }
52823  
52824    let parts = formatStr
52825      .match(longFormattingTokensRegExp)
52826      .map((substring) => {
52827        const firstCharacter = substring[0];
52828        if (firstCharacter === "p" || firstCharacter === "P") {
52829          const longFormatter = longFormatters[firstCharacter];
52830          return longFormatter(substring, locale.formatLong);
52831        }
52832        return substring;
52833      })
52834      .join("")
52835      .match(formattingTokensRegExp)
52836      .map((substring) => {
52837        // Replace two single quote characters with one single quote character
52838        if (substring === "''") {
52839          return { isToken: false, value: "'" };
52840        }
52841  
52842        const firstCharacter = substring[0];
52843        if (firstCharacter === "'") {
52844          return { isToken: false, value: cleanEscapedString(substring) };
52845        }
52846  
52847        if (formatters[firstCharacter]) {
52848          return { isToken: true, value: substring };
52849        }
52850  
52851        if (firstCharacter.match(unescapedLatinCharacterRegExp)) {
52852          throw new RangeError(
52853            "Format string contains an unescaped latin alphabet character `" +
52854              firstCharacter +
52855              "`",
52856          );
52857        }
52858  
52859        return { isToken: false, value: substring };
52860      });
52861  
52862    // invoke localize preprocessor (only for french locales at the moment)
52863    if (locale.localize.preprocessor) {
52864      parts = locale.localize.preprocessor(originalDate, parts);
52865    }
52866  
52867    const formatterOptions = {
52868      firstWeekContainsDate,
52869      weekStartsOn,
52870      locale,
52871    };
52872  
52873    return parts
52874      .map((part) => {
52875        if (!part.isToken) return part.value;
52876  
52877        const token = part.value;
52878  
52879        if (
52880          (!options?.useAdditionalWeekYearTokens &&
52881            isProtectedWeekYearToken(token)) ||
52882          (!options?.useAdditionalDayOfYearTokens &&
52883            isProtectedDayOfYearToken(token))
52884        ) {
52885          warnOrThrowProtectedError(token, formatStr, String(date));
52886        }
52887  
52888        const formatter = formatters[token[0]];
52889        return formatter(originalDate, token, locale.localize, formatterOptions);
52890      })
52891      .join("");
52892  }
52893  
52894  function cleanEscapedString(input) {
52895    const matched = input.match(escapedStringRegExp);
52896  
52897    if (!matched) {
52898      return input;
52899    }
52900  
52901    return matched[1].replace(doubleQuoteRegExp, "'");
52902  }
52903  
52904  // Fallback for modularized imports:
52905  /* harmony default export */ const date_fns_format = ((/* unused pure expression or super */ null && (format)));
52906  
52907  ;// CONCATENATED MODULE: ./node_modules/date-fns/isSameMonth.mjs
52908  
52909  
52910  /**
52911   * @name isSameMonth
52912   * @category Month Helpers
52913   * @summary Are the given dates in the same month (and year)?
52914   *
52915   * @description
52916   * Are the given dates in the same month (and year)?
52917   *
52918   * @typeParam DateType - The `Date` type, the function operates on. Gets inferred from passed arguments. Allows to use extensions like [`UTCDate`](https://github.com/date-fns/utc).
52919   *
52920   * @param dateLeft - The first date to check
52921   * @param dateRight - The second date to check
52922   *
52923   * @returns The dates are in the same month (and year)
52924   *
52925   * @example
52926   * // Are 2 September 2014 and 25 September 2014 in the same month?
52927   * const result = isSameMonth(new Date(2014, 8, 2), new Date(2014, 8, 25))
52928   * //=> true
52929   *
52930   * @example
52931   * // Are 2 September 2014 and 25 September 2015 in the same month?
52932   * const result = isSameMonth(new Date(2014, 8, 2), new Date(2015, 8, 25))
52933   * //=> false
52934   */
52935  function isSameMonth(dateLeft, dateRight) {
52936    const _dateLeft = toDate(dateLeft);
52937    const _dateRight = toDate(dateRight);
52938    return (
52939      _dateLeft.getFullYear() === _dateRight.getFullYear() &&
52940      _dateLeft.getMonth() === _dateRight.getMonth()
52941    );
52942  }
52943  
52944  // Fallback for modularized imports:
52945  /* harmony default export */ const date_fns_isSameMonth = ((/* unused pure expression or super */ null && (isSameMonth)));
52946  
52947  ;// CONCATENATED MODULE: ./node_modules/date-fns/isEqual.mjs
52948  
52949  
52950  /**
52951   * @name isEqual
52952   * @category Common Helpers
52953   * @summary Are the given dates equal?
52954   *
52955   * @description
52956   * Are the given dates equal?
52957   *
52958   * @typeParam DateType - The `Date` type, the function operates on. Gets inferred from passed arguments. Allows to use extensions like [`UTCDate`](https://github.com/date-fns/utc).
52959   *
52960   * @param dateLeft - The first date to compare
52961   * @param dateRight - The second date to compare
52962   *
52963   * @returns The dates are equal
52964   *
52965   * @example
52966   * // Are 2 July 2014 06:30:45.000 and 2 July 2014 06:30:45.500 equal?
52967   * const result = isEqual(
52968   *   new Date(2014, 6, 2, 6, 30, 45, 0),
52969   *   new Date(2014, 6, 2, 6, 30, 45, 500)
52970   * )
52971   * //=> false
52972   */
52973  function isEqual(leftDate, rightDate) {
52974    const _dateLeft = toDate(leftDate);
52975    const _dateRight = toDate(rightDate);
52976    return +_dateLeft === +_dateRight;
52977  }
52978  
52979  // Fallback for modularized imports:
52980  /* harmony default export */ const date_fns_isEqual = ((/* unused pure expression or super */ null && (isEqual)));
52981  
52982  ;// CONCATENATED MODULE: ./node_modules/date-fns/isSameDay.mjs
52983  
52984  
52985  /**
52986   * @name isSameDay
52987   * @category Day Helpers
52988   * @summary Are the given dates in the same day (and year and month)?
52989   *
52990   * @description
52991   * Are the given dates in the same day (and year and month)?
52992   *
52993   * @typeParam DateType - The `Date` type, the function operates on. Gets inferred from passed arguments. Allows to use extensions like [`UTCDate`](https://github.com/date-fns/utc).
52994   *
52995   * @param dateLeft - The first date to check
52996   * @param dateRight - The second date to check
52997  
52998   * @returns The dates are in the same day (and year and month)
52999   *
53000   * @example
53001   * // Are 4 September 06:00:00 and 4 September 18:00:00 in the same day?
53002   * const result = isSameDay(new Date(2014, 8, 4, 6, 0), new Date(2014, 8, 4, 18, 0))
53003   * //=> true
53004   *
53005   * @example
53006   * // Are 4 September and 4 October in the same day?
53007   * const result = isSameDay(new Date(2014, 8, 4), new Date(2014, 9, 4))
53008   * //=> false
53009   *
53010   * @example
53011   * // Are 4 September, 2014 and 4 September, 2015 in the same day?
53012   * const result = isSameDay(new Date(2014, 8, 4), new Date(2015, 8, 4))
53013   * //=> false
53014   */
53015  function isSameDay(dateLeft, dateRight) {
53016    const dateLeftStartOfDay = startOfDay(dateLeft);
53017    const dateRightStartOfDay = startOfDay(dateRight);
53018  
53019    return +dateLeftStartOfDay === +dateRightStartOfDay;
53020  }
53021  
53022  // Fallback for modularized imports:
53023  /* harmony default export */ const date_fns_isSameDay = ((/* unused pure expression or super */ null && (isSameDay)));
53024  
53025  ;// CONCATENATED MODULE: ./node_modules/date-fns/addDays.mjs
53026  
53027  
53028  
53029  /**
53030   * @name addDays
53031   * @category Day Helpers
53032   * @summary Add the specified number of days to the given date.
53033   *
53034   * @description
53035   * Add the specified number of days to the given date.
53036   *
53037   * @typeParam DateType - The `Date` type, the function operates on. Gets inferred from passed arguments. Allows to use extensions like [`UTCDate`](https://github.com/date-fns/utc).
53038   *
53039   * @param date - The date to be changed
53040   * @param amount - The amount of days to be added.
53041   *
53042   * @returns The new date with the days added
53043   *
53044   * @example
53045   * // Add 10 days to 1 September 2014:
53046   * const result = addDays(new Date(2014, 8, 1), 10)
53047   * //=> Thu Sep 11 2014 00:00:00
53048   */
53049  function addDays(date, amount) {
53050    const _date = toDate(date);
53051    if (isNaN(amount)) return constructFrom(date, NaN);
53052    if (!amount) {
53053      // If 0 days, no-op to avoid changing times in the hour before end of DST
53054      return _date;
53055    }
53056    _date.setDate(_date.getDate() + amount);
53057    return _date;
53058  }
53059  
53060  // Fallback for modularized imports:
53061  /* harmony default export */ const date_fns_addDays = ((/* unused pure expression or super */ null && (addDays)));
53062  
53063  ;// CONCATENATED MODULE: ./node_modules/date-fns/addWeeks.mjs
53064  
53065  
53066  /**
53067   * @name addWeeks
53068   * @category Week Helpers
53069   * @summary Add the specified number of weeks to the given date.
53070   *
53071   * @description
53072   * Add the specified number of week to the given date.
53073   *
53074   * @typeParam DateType - The `Date` type, the function operates on. Gets inferred from passed arguments. Allows to use extensions like [`UTCDate`](https://github.com/date-fns/utc).
53075   *
53076   * @param date - The date to be changed
53077   * @param amount - The amount of weeks to be added.
53078   *
53079   * @returns The new date with the weeks added
53080   *
53081   * @example
53082   * // Add 4 weeks to 1 September 2014:
53083   * const result = addWeeks(new Date(2014, 8, 1), 4)
53084   * //=> Mon Sep 29 2014 00:00:00
53085   */
53086  function addWeeks(date, amount) {
53087    const days = amount * 7;
53088    return addDays(date, days);
53089  }
53090  
53091  // Fallback for modularized imports:
53092  /* harmony default export */ const date_fns_addWeeks = ((/* unused pure expression or super */ null && (addWeeks)));
53093  
53094  ;// CONCATENATED MODULE: ./node_modules/date-fns/subWeeks.mjs
53095  
53096  
53097  /**
53098   * @name subWeeks
53099   * @category Week Helpers
53100   * @summary Subtract the specified number of weeks from the given date.
53101   *
53102   * @description
53103   * Subtract the specified number of weeks from the given date.
53104   *
53105   * @typeParam DateType - The `Date` type, the function operates on. Gets inferred from passed arguments. Allows to use extensions like [`UTCDate`](https://github.com/date-fns/utc).
53106   *
53107   * @param date - The date to be changed
53108   * @param amount - The amount of weeks to be subtracted.
53109   *
53110   * @returns The new date with the weeks subtracted
53111   *
53112   * @example
53113   * // Subtract 4 weeks from 1 September 2014:
53114   * const result = subWeeks(new Date(2014, 8, 1), 4)
53115   * //=> Mon Aug 04 2014 00:00:00
53116   */
53117  function subWeeks(date, amount) {
53118    return addWeeks(date, -amount);
53119  }
53120  
53121  // Fallback for modularized imports:
53122  /* harmony default export */ const date_fns_subWeeks = ((/* unused pure expression or super */ null && (subWeeks)));
53123  
53124  ;// CONCATENATED MODULE: ./node_modules/date-fns/endOfWeek.mjs
53125  
53126  
53127  
53128  /**
53129   * The {@link endOfWeek} function options.
53130   */
53131  
53132  /**
53133   * @name endOfWeek
53134   * @category Week Helpers
53135   * @summary Return the end of a week for the given date.
53136   *
53137   * @description
53138   * Return the end of a week for the given date.
53139   * The result will be in the local timezone.
53140   *
53141   * @typeParam DateType - The `Date` type, the function operates on. Gets inferred from passed arguments. Allows to use extensions like [`UTCDate`](https://github.com/date-fns/utc).
53142   *
53143   * @param date - The original date
53144   * @param options - An object with options
53145   *
53146   * @returns The end of a week
53147   *
53148   * @example
53149   * // The end of a week for 2 September 2014 11:55:00:
53150   * const result = endOfWeek(new Date(2014, 8, 2, 11, 55, 0))
53151   * //=> Sat Sep 06 2014 23:59:59.999
53152   *
53153   * @example
53154   * // If the week starts on Monday, the end of the week for 2 September 2014 11:55:00:
53155   * const result = endOfWeek(new Date(2014, 8, 2, 11, 55, 0), { weekStartsOn: 1 })
53156   * //=> Sun Sep 07 2014 23:59:59.999
53157   */
53158  function endOfWeek(date, options) {
53159    const defaultOptions = getDefaultOptions();
53160    const weekStartsOn =
53161      options?.weekStartsOn ??
53162      options?.locale?.options?.weekStartsOn ??
53163      defaultOptions.weekStartsOn ??
53164      defaultOptions.locale?.options?.weekStartsOn ??
53165      0;
53166  
53167    const _date = toDate(date);
53168    const day = _date.getDay();
53169    const diff = (day < weekStartsOn ? -7 : 0) + 6 - (day - weekStartsOn);
53170  
53171    _date.setDate(_date.getDate() + diff);
53172    _date.setHours(23, 59, 59, 999);
53173    return _date;
53174  }
53175  
53176  // Fallback for modularized imports:
53177  /* harmony default export */ const date_fns_endOfWeek = ((/* unused pure expression or super */ null && (endOfWeek)));
53178  
53179  ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/arrow-right.js
53180  /**
53181   * WordPress dependencies
53182   */
53183  
53184  
53185  const arrowRight = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, {
53186    xmlns: "http://www.w3.org/2000/svg",
53187    viewBox: "0 0 24 24",
53188    children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, {
53189      d: "m14.5 6.5-1 1 3.7 3.7H4v1.6h13.2l-3.7 3.7 1 1 5.6-5.5z"
53190    })
53191  });
53192  /* harmony default export */ const arrow_right = (arrowRight);
53193  
53194  ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/arrow-left.js
53195  /**
53196   * WordPress dependencies
53197   */
53198  
53199  
53200  const arrowLeft = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, {
53201    xmlns: "http://www.w3.org/2000/svg",
53202    viewBox: "0 0 24 24",
53203    children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, {
53204      d: "M20 11.2H6.8l3.7-3.7-1-1L3.9 12l5.6 5.5 1-1-3.7-3.7H20z"
53205    })
53206  });
53207  /* harmony default export */ const arrow_left = (arrowLeft);
53208  
53209  ;// CONCATENATED MODULE: external ["wp","date"]
53210  const external_wp_date_namespaceObject = window["wp"]["date"];
53211  ;// CONCATENATED MODULE: ./node_modules/date-fns/isAfter.mjs
53212  
53213  
53214  /**
53215   * @name isAfter
53216   * @category Common Helpers
53217   * @summary Is the first date after the second one?
53218   *
53219   * @description
53220   * Is the first date after the second one?
53221   *
53222   * @typeParam DateType - The `Date` type, the function operates on. Gets inferred from passed arguments. Allows to use extensions like [`UTCDate`](https://github.com/date-fns/utc).
53223   *
53224   * @param date - The date that should be after the other one to return true
53225   * @param dateToCompare - The date to compare with
53226   *
53227   * @returns The first date is after the second date
53228   *
53229   * @example
53230   * // Is 10 July 1989 after 11 February 1987?
53231   * const result = isAfter(new Date(1989, 6, 10), new Date(1987, 1, 11))
53232   * //=> true
53233   */
53234  function isAfter(date, dateToCompare) {
53235    const _date = toDate(date);
53236    const _dateToCompare = toDate(dateToCompare);
53237    return _date.getTime() > _dateToCompare.getTime();
53238  }
53239  
53240  // Fallback for modularized imports:
53241  /* harmony default export */ const date_fns_isAfter = ((/* unused pure expression or super */ null && (isAfter)));
53242  
53243  ;// CONCATENATED MODULE: ./node_modules/date-fns/isBefore.mjs
53244  
53245  
53246  /**
53247   * @name isBefore
53248   * @category Common Helpers
53249   * @summary Is the first date before the second one?
53250   *
53251   * @description
53252   * Is the first date before the second one?
53253   *
53254   * @typeParam DateType - The `Date` type, the function operates on. Gets inferred from passed arguments. Allows to use extensions like [`UTCDate`](https://github.com/date-fns/utc).
53255   *
53256   * @param date - The date that should be before the other one to return true
53257   * @param dateToCompare - The date to compare with
53258   *
53259   * @returns The first date is before the second date
53260   *
53261   * @example
53262   * // Is 10 July 1989 before 11 February 1987?
53263   * const result = isBefore(new Date(1989, 6, 10), new Date(1987, 1, 11))
53264   * //=> false
53265   */
53266  function isBefore(date, dateToCompare) {
53267    const _date = toDate(date);
53268    const _dateToCompare = toDate(dateToCompare);
53269    return +_date < +_dateToCompare;
53270  }
53271  
53272  // Fallback for modularized imports:
53273  /* harmony default export */ const date_fns_isBefore = ((/* unused pure expression or super */ null && (isBefore)));
53274  
53275  ;// CONCATENATED MODULE: ./node_modules/date-fns/getDaysInMonth.mjs
53276  
53277  
53278  
53279  /**
53280   * @name getDaysInMonth
53281   * @category Month Helpers
53282   * @summary Get the number of days in a month of the given date.
53283   *
53284   * @description
53285   * Get the number of days in a month of the given date.
53286   *
53287   * @typeParam DateType - The `Date` type, the function operates on. Gets inferred from passed arguments. Allows to use extensions like [`UTCDate`](https://github.com/date-fns/utc).
53288   *
53289   * @param date - The given date
53290   *
53291   * @returns The number of days in a month
53292   *
53293   * @example
53294   * // How many days are in February 2000?
53295   * const result = getDaysInMonth(new Date(2000, 1))
53296   * //=> 29
53297   */
53298  function getDaysInMonth(date) {
53299    const _date = toDate(date);
53300    const year = _date.getFullYear();
53301    const monthIndex = _date.getMonth();
53302    const lastDayOfMonth = constructFrom(date, 0);
53303    lastDayOfMonth.setFullYear(year, monthIndex + 1, 0);
53304    lastDayOfMonth.setHours(0, 0, 0, 0);
53305    return lastDayOfMonth.getDate();
53306  }
53307  
53308  // Fallback for modularized imports:
53309  /* harmony default export */ const date_fns_getDaysInMonth = ((/* unused pure expression or super */ null && (getDaysInMonth)));
53310  
53311  ;// CONCATENATED MODULE: ./node_modules/date-fns/setMonth.mjs
53312  
53313  
53314  
53315  
53316  /**
53317   * @name setMonth
53318   * @category Month Helpers
53319   * @summary Set the month to the given date.
53320   *
53321   * @description
53322   * Set the month to the given date.
53323   *
53324   * @typeParam DateType - The `Date` type, the function operates on. Gets inferred from passed arguments. Allows to use extensions like [`UTCDate`](https://github.com/date-fns/utc).
53325   *
53326   * @param date - The date to be changed
53327   * @param month - The month index to set (0-11)
53328   *
53329   * @returns The new date with the month set
53330   *
53331   * @example
53332   * // Set February to 1 September 2014:
53333   * const result = setMonth(new Date(2014, 8, 1), 1)
53334   * //=> Sat Feb 01 2014 00:00:00
53335   */
53336  function setMonth(date, month) {
53337    const _date = toDate(date);
53338    const year = _date.getFullYear();
53339    const day = _date.getDate();
53340  
53341    const dateWithDesiredMonth = constructFrom(date, 0);
53342    dateWithDesiredMonth.setFullYear(year, month, 15);
53343    dateWithDesiredMonth.setHours(0, 0, 0, 0);
53344    const daysInMonth = getDaysInMonth(dateWithDesiredMonth);
53345    // Set the last day of the new month
53346    // if the original date was the last day of the longer month
53347    _date.setMonth(month, Math.min(day, daysInMonth));
53348    return _date;
53349  }
53350  
53351  // Fallback for modularized imports:
53352  /* harmony default export */ const date_fns_setMonth = ((/* unused pure expression or super */ null && (setMonth)));
53353  
53354  ;// CONCATENATED MODULE: ./node_modules/date-fns/set.mjs
53355  
53356  
53357  
53358  
53359  /**
53360   * @name set
53361   * @category Common Helpers
53362   * @summary Set date values to a given date.
53363   *
53364   * @description
53365   * Set date values to a given date.
53366   *
53367   * Sets time values to date from object `values`.
53368   * A value is not set if it is undefined or null or doesn't exist in `values`.
53369   *
53370   * Note about bundle size: `set` does not internally use `setX` functions from date-fns but instead opts
53371   * to use native `Date#setX` methods. If you use this function, you may not want to include the
53372   * other `setX` functions that date-fns provides if you are concerned about the bundle size.
53373   *
53374   * @typeParam DateType - The `Date` type, the function operates on. Gets inferred from passed arguments. Allows to use extensions like [`UTCDate`](https://github.com/date-fns/utc).
53375   *
53376   * @param date - The date to be changed
53377   * @param values - The date values to be set
53378   *
53379   * @returns The new date with options set
53380   *
53381   * @example
53382   * // Transform 1 September 2014 into 20 October 2015 in a single line:
53383   * const result = set(new Date(2014, 8, 20), { year: 2015, month: 9, date: 20 })
53384   * //=> Tue Oct 20 2015 00:00:00
53385   *
53386   * @example
53387   * // Set 12 PM to 1 September 2014 01:23:45 to 1 September 2014 12:00:00:
53388   * const result = set(new Date(2014, 8, 1, 1, 23, 45), { hours: 12 })
53389   * //=> Mon Sep 01 2014 12:23:45
53390   */
53391  
53392  function set(date, values) {
53393    let _date = toDate(date);
53394  
53395    // Check if date is Invalid Date because Date.prototype.setFullYear ignores the value of Invalid Date
53396    if (isNaN(+_date)) {
53397      return constructFrom(date, NaN);
53398    }
53399  
53400    if (values.year != null) {
53401      _date.setFullYear(values.year);
53402    }
53403  
53404    if (values.month != null) {
53405      _date = setMonth(_date, values.month);
53406    }
53407  
53408    if (values.date != null) {
53409      _date.setDate(values.date);
53410    }
53411  
53412    if (values.hours != null) {
53413      _date.setHours(values.hours);
53414    }
53415  
53416    if (values.minutes != null) {
53417      _date.setMinutes(values.minutes);
53418    }
53419  
53420    if (values.seconds != null) {
53421      _date.setSeconds(values.seconds);
53422    }
53423  
53424    if (values.milliseconds != null) {
53425      _date.setMilliseconds(values.milliseconds);
53426    }
53427  
53428    return _date;
53429  }
53430  
53431  // Fallback for modularized imports:
53432  /* harmony default export */ const date_fns_set = ((/* unused pure expression or super */ null && (set)));
53433  
53434  ;// CONCATENATED MODULE: ./node_modules/date-fns/startOfToday.mjs
53435  
53436  
53437  /**
53438   * @name startOfToday
53439   * @category Day Helpers
53440   * @summary Return the start of today.
53441   * @pure false
53442   *
53443   * @description
53444   * Return the start of today.
53445   *
53446   * @returns The start of today
53447   *
53448   * @example
53449   * // If today is 6 October 2014:
53450   * const result = startOfToday()
53451   * //=> Mon Oct 6 2014 00:00:00
53452   */
53453  function startOfToday() {
53454    return startOfDay(Date.now());
53455  }
53456  
53457  // Fallback for modularized imports:
53458  /* harmony default export */ const date_fns_startOfToday = ((/* unused pure expression or super */ null && (startOfToday)));
53459  
53460  ;// CONCATENATED MODULE: ./node_modules/date-fns/setYear.mjs
53461  
53462  
53463  
53464  /**
53465   * @name setYear
53466   * @category Year Helpers
53467   * @summary Set the year to the given date.
53468   *
53469   * @description
53470   * Set the year to the given date.
53471   *
53472   * @typeParam DateType - The `Date` type, the function operates on. Gets inferred from passed arguments. Allows to use extensions like [`UTCDate`](https://github.com/date-fns/utc).
53473   *
53474   * @param date - The date to be changed
53475   * @param year - The year of the new date
53476   *
53477   * @returns The new date with the year set
53478   *
53479   * @example
53480   * // Set year 2013 to 1 September 2014:
53481   * const result = setYear(new Date(2014, 8, 1), 2013)
53482   * //=> Sun Sep 01 2013 00:00:00
53483   */
53484  function setYear(date, year) {
53485    const _date = toDate(date);
53486  
53487    // Check if date is Invalid Date because Date.prototype.setFullYear ignores the value of Invalid Date
53488    if (isNaN(+_date)) {
53489      return constructFrom(date, NaN);
53490    }
53491  
53492    _date.setFullYear(year);
53493    return _date;
53494  }
53495  
53496  // Fallback for modularized imports:
53497  /* harmony default export */ const date_fns_setYear = ((/* unused pure expression or super */ null && (setYear)));
53498  
53499  ;// CONCATENATED MODULE: ./node_modules/date-fns/addYears.mjs
53500  
53501  
53502  /**
53503   * @name addYears
53504   * @category Year Helpers
53505   * @summary Add the specified number of years to the given date.
53506   *
53507   * @description
53508   * Add the specified number of years to the given date.
53509   *
53510   * @typeParam DateType - The `Date` type, the function operates on. Gets inferred from passed arguments. Allows to use extensions like [`UTCDate`](https://github.com/date-fns/utc).
53511   *
53512   * @param date - The date to be changed
53513   * @param amount - The amount of years to be added.
53514   *
53515   * @returns The new date with the years added
53516   *
53517   * @example
53518   * // Add 5 years to 1 September 2014:
53519   * const result = addYears(new Date(2014, 8, 1), 5)
53520   * //=> Sun Sep 01 2019 00:00:00
53521   */
53522  function addYears(date, amount) {
53523    return addMonths(date, amount * 12);
53524  }
53525  
53526  // Fallback for modularized imports:
53527  /* harmony default export */ const date_fns_addYears = ((/* unused pure expression or super */ null && (addYears)));
53528  
53529  ;// CONCATENATED MODULE: ./node_modules/date-fns/subYears.mjs
53530  
53531  
53532  /**
53533   * @name subYears
53534   * @category Year Helpers
53535   * @summary Subtract the specified number of years from the given date.
53536   *
53537   * @description
53538   * Subtract the specified number of years from the given date.
53539   *
53540   * @typeParam DateType - The `Date` type, the function operates on. Gets inferred from passed arguments. Allows to use extensions like [`UTCDate`](https://github.com/date-fns/utc).
53541   *
53542   * @param date - The date to be changed
53543   * @param amount - The amount of years to be subtracted.
53544   *
53545   * @returns The new date with the years subtracted
53546   *
53547   * @example
53548   * // Subtract 5 years from 1 September 2014:
53549   * const result = subYears(new Date(2014, 8, 1), 5)
53550   * //=> Tue Sep 01 2009 00:00:00
53551   */
53552  function subYears(date, amount) {
53553    return addYears(date, -amount);
53554  }
53555  
53556  // Fallback for modularized imports:
53557  /* harmony default export */ const date_fns_subYears = ((/* unused pure expression or super */ null && (subYears)));
53558  
53559  ;// CONCATENATED MODULE: ./node_modules/date-fns/eachDayOfInterval.mjs
53560  
53561  
53562  /**
53563   * The {@link eachDayOfInterval} function options.
53564   */
53565  
53566  /**
53567   * @name eachDayOfInterval
53568   * @category Interval Helpers
53569   * @summary Return the array of dates within the specified time interval.
53570   *
53571   * @description
53572   * Return the array of dates within the specified time interval.
53573   *
53574   * @typeParam DateType - The `Date` type, the function operates on. Gets inferred from passed arguments. Allows to use extensions like [`UTCDate`](https://github.com/date-fns/utc).
53575   *
53576   * @param interval - The interval.
53577   * @param options - An object with options.
53578   *
53579   * @returns The array with starts of days from the day of the interval start to the day of the interval end
53580   *
53581   * @example
53582   * // Each day between 6 October 2014 and 10 October 2014:
53583   * const result = eachDayOfInterval({
53584   *   start: new Date(2014, 9, 6),
53585   *   end: new Date(2014, 9, 10)
53586   * })
53587   * //=> [
53588   * //   Mon Oct 06 2014 00:00:00,
53589   * //   Tue Oct 07 2014 00:00:00,
53590   * //   Wed Oct 08 2014 00:00:00,
53591   * //   Thu Oct 09 2014 00:00:00,
53592   * //   Fri Oct 10 2014 00:00:00
53593   * // ]
53594   */
53595  function eachDayOfInterval(interval, options) {
53596    const startDate = toDate(interval.start);
53597    const endDate = toDate(interval.end);
53598  
53599    let reversed = +startDate > +endDate;
53600    const endTime = reversed ? +startDate : +endDate;
53601    const currentDate = reversed ? endDate : startDate;
53602    currentDate.setHours(0, 0, 0, 0);
53603  
53604    let step = options?.step ?? 1;
53605    if (!step) return [];
53606    if (step < 0) {
53607      step = -step;
53608      reversed = !reversed;
53609    }
53610  
53611    const dates = [];
53612  
53613    while (+currentDate <= endTime) {
53614      dates.push(toDate(currentDate));
53615      currentDate.setDate(currentDate.getDate() + step);
53616      currentDate.setHours(0, 0, 0, 0);
53617    }
53618  
53619    return reversed ? dates.reverse() : dates;
53620  }
53621  
53622  // Fallback for modularized imports:
53623  /* harmony default export */ const date_fns_eachDayOfInterval = ((/* unused pure expression or super */ null && (eachDayOfInterval)));
53624  
53625  ;// CONCATENATED MODULE: ./node_modules/date-fns/eachMonthOfInterval.mjs
53626  
53627  
53628  /**
53629   * The {@link eachMonthOfInterval} function options.
53630   */
53631  
53632  /**
53633   * @name eachMonthOfInterval
53634   * @category Interval Helpers
53635   * @summary Return the array of months within the specified time interval.
53636   *
53637   * @description
53638   * Return the array of months within the specified time interval.
53639   *
53640   * @typeParam DateType - The `Date` type, the function operates on. Gets inferred from passed arguments. Allows to use extensions like [`UTCDate`](https://github.com/date-fns/utc).
53641   *
53642   * @param interval - The interval
53643   *
53644   * @returns The array with starts of months from the month of the interval start to the month of the interval end
53645   *
53646   * @example
53647   * // Each month between 6 February 2014 and 10 August 2014:
53648   * const result = eachMonthOfInterval({
53649   *   start: new Date(2014, 1, 6),
53650   *   end: new Date(2014, 7, 10)
53651   * })
53652   * //=> [
53653   * //   Sat Feb 01 2014 00:00:00,
53654   * //   Sat Mar 01 2014 00:00:00,
53655   * //   Tue Apr 01 2014 00:00:00,
53656   * //   Thu May 01 2014 00:00:00,
53657   * //   Sun Jun 01 2014 00:00:00,
53658   * //   Tue Jul 01 2014 00:00:00,
53659   * //   Fri Aug 01 2014 00:00:00
53660   * // ]
53661   */
53662  function eachMonthOfInterval(interval, options) {
53663    const startDate = toDate(interval.start);
53664    const endDate = toDate(interval.end);
53665  
53666    let reversed = +startDate > +endDate;
53667    const endTime = reversed ? +startDate : +endDate;
53668    const currentDate = reversed ? endDate : startDate;
53669    currentDate.setHours(0, 0, 0, 0);
53670    currentDate.setDate(1);
53671  
53672    let step = options?.step ?? 1;
53673    if (!step) return [];
53674    if (step < 0) {
53675      step = -step;
53676      reversed = !reversed;
53677    }
53678  
53679    const dates = [];
53680  
53681    while (+currentDate <= endTime) {
53682      dates.push(toDate(currentDate));
53683      currentDate.setMonth(currentDate.getMonth() + step);
53684    }
53685  
53686    return reversed ? dates.reverse() : dates;
53687  }
53688  
53689  // Fallback for modularized imports:
53690  /* harmony default export */ const date_fns_eachMonthOfInterval = ((/* unused pure expression or super */ null && (eachMonthOfInterval)));
53691  
53692  ;// CONCATENATED MODULE: ./node_modules/date-fns/startOfMonth.mjs
53693  
53694  
53695  /**
53696   * @name startOfMonth
53697   * @category Month Helpers
53698   * @summary Return the start of a month for the given date.
53699   *
53700   * @description
53701   * Return the start of a month for the given date.
53702   * The result will be in the local timezone.
53703   *
53704   * @typeParam DateType - The `Date` type, the function operates on. Gets inferred from passed arguments. Allows to use extensions like [`UTCDate`](https://github.com/date-fns/utc).
53705   *
53706   * @param date - The original date
53707   *
53708   * @returns The start of a month
53709   *
53710   * @example
53711   * // The start of a month for 2 September 2014 11:55:00:
53712   * const result = startOfMonth(new Date(2014, 8, 2, 11, 55, 0))
53713   * //=> Mon Sep 01 2014 00:00:00
53714   */
53715  function startOfMonth(date) {
53716    const _date = toDate(date);
53717    _date.setDate(1);
53718    _date.setHours(0, 0, 0, 0);
53719    return _date;
53720  }
53721  
53722  // Fallback for modularized imports:
53723  /* harmony default export */ const date_fns_startOfMonth = ((/* unused pure expression or super */ null && (startOfMonth)));
53724  
53725  ;// CONCATENATED MODULE: ./node_modules/date-fns/endOfMonth.mjs
53726  
53727  
53728  /**
53729   * @name endOfMonth
53730   * @category Month Helpers
53731   * @summary Return the end of a month for the given date.
53732   *
53733   * @description
53734   * Return the end of a month for the given date.
53735   * The result will be in the local timezone.
53736   *
53737   * @typeParam DateType - The `Date` type, the function operates on. Gets inferred from passed arguments. Allows to use extensions like [`UTCDate`](https://github.com/date-fns/utc).
53738   *
53739   * @param date - The original date
53740   *
53741   * @returns The end of a month
53742   *
53743   * @example
53744   * // The end of a month for 2 September 2014 11:55:00:
53745   * const result = endOfMonth(new Date(2014, 8, 2, 11, 55, 0))
53746   * //=> Tue Sep 30 2014 23:59:59.999
53747   */
53748  function endOfMonth(date) {
53749    const _date = toDate(date);
53750    const month = _date.getMonth();
53751    _date.setFullYear(_date.getFullYear(), month + 1, 0);
53752    _date.setHours(23, 59, 59, 999);
53753    return _date;
53754  }
53755  
53756  // Fallback for modularized imports:
53757  /* harmony default export */ const date_fns_endOfMonth = ((/* unused pure expression or super */ null && (endOfMonth)));
53758  
53759  ;// CONCATENATED MODULE: ./node_modules/date-fns/eachWeekOfInterval.mjs
53760  
53761  
53762  
53763  
53764  /**
53765   * The {@link eachWeekOfInterval} function options.
53766   */
53767  
53768  /**
53769   * @name eachWeekOfInterval
53770   * @category Interval Helpers
53771   * @summary Return the array of weeks within the specified time interval.
53772   *
53773   * @description
53774   * Return the array of weeks within the specified time interval.
53775   *
53776   * @typeParam DateType - The `Date` type, the function operates on. Gets inferred from passed arguments. Allows to use extensions like [`UTCDate`](https://github.com/date-fns/utc).
53777   *
53778   * @param interval - The interval.
53779   * @param options - An object with options.
53780   *
53781   * @returns The array with starts of weeks from the week of the interval start to the week of the interval end
53782   *
53783   * @example
53784   * // Each week within interval 6 October 2014 - 23 November 2014:
53785   * const result = eachWeekOfInterval({
53786   *   start: new Date(2014, 9, 6),
53787   *   end: new Date(2014, 10, 23)
53788   * })
53789   * //=> [
53790   * //   Sun Oct 05 2014 00:00:00,
53791   * //   Sun Oct 12 2014 00:00:00,
53792   * //   Sun Oct 19 2014 00:00:00,
53793   * //   Sun Oct 26 2014 00:00:00,
53794   * //   Sun Nov 02 2014 00:00:00,
53795   * //   Sun Nov 09 2014 00:00:00,
53796   * //   Sun Nov 16 2014 00:00:00,
53797   * //   Sun Nov 23 2014 00:00:00
53798   * // ]
53799   */
53800  function eachWeekOfInterval(interval, options) {
53801    const startDate = toDate(interval.start);
53802    const endDate = toDate(interval.end);
53803  
53804    let reversed = +startDate > +endDate;
53805    const startDateWeek = reversed
53806      ? startOfWeek(endDate, options)
53807      : startOfWeek(startDate, options);
53808    const endDateWeek = reversed
53809      ? startOfWeek(startDate, options)
53810      : startOfWeek(endDate, options);
53811  
53812    // Some timezones switch DST at midnight, making start of day unreliable in these timezones, 3pm is a safe bet
53813    startDateWeek.setHours(15);
53814    endDateWeek.setHours(15);
53815  
53816    const endTime = +endDateWeek.getTime();
53817    let currentDate = startDateWeek;
53818  
53819    let step = options?.step ?? 1;
53820    if (!step) return [];
53821    if (step < 0) {
53822      step = -step;
53823      reversed = !reversed;
53824    }
53825  
53826    const dates = [];
53827  
53828    while (+currentDate <= endTime) {
53829      currentDate.setHours(0);
53830      dates.push(toDate(currentDate));
53831      currentDate = addWeeks(currentDate, step);
53832      currentDate.setHours(15);
53833    }
53834  
53835    return reversed ? dates.reverse() : dates;
53836  }
53837  
53838  // Fallback for modularized imports:
53839  /* harmony default export */ const date_fns_eachWeekOfInterval = ((/* unused pure expression or super */ null && (eachWeekOfInterval)));
53840  
53841  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/date-time/date/use-lilius/index.js
53842  /**
53843   * This source is a local copy of the use-lilius library, since the original
53844   * library is not actively maintained.
53845   * @see https://github.com/WordPress/gutenberg/discussions/64968
53846   *
53847   * use-lilius@2.0.5
53848   * https://github.com/Avarios/use-lilius
53849   *
53850   * The MIT License (MIT)
53851   *
53852   * Copyright (c) 2021-Present Danny Tatom
53853   *
53854   * Permission is hereby granted, free of charge, to any person obtaining a copy
53855   * of this software and associated documentation files (the "Software"), to deal
53856   * in the Software without restriction, including without limitation the rights
53857   * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
53858   * copies of the Software, and to permit persons to whom the Software is
53859   * furnished to do so, subject to the following conditions:
53860   *
53861   * The above copyright notice and this permission notice shall be included in all
53862   * copies or substantial portions of the Software.
53863   *
53864   * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
53865   * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
53866   * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
53867   * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
53868   * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
53869   * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
53870   * SOFTWARE.
53871   */
53872  
53873  /**
53874   * External dependencies
53875   */
53876  
53877  
53878  /**
53879   * WordPress dependencies
53880   */
53881  
53882  let Month = /*#__PURE__*/function (Month) {
53883    Month[Month["JANUARY"] = 0] = "JANUARY";
53884    Month[Month["FEBRUARY"] = 1] = "FEBRUARY";
53885    Month[Month["MARCH"] = 2] = "MARCH";
53886    Month[Month["APRIL"] = 3] = "APRIL";
53887    Month[Month["MAY"] = 4] = "MAY";
53888    Month[Month["JUNE"] = 5] = "JUNE";
53889    Month[Month["JULY"] = 6] = "JULY";
53890    Month[Month["AUGUST"] = 7] = "AUGUST";
53891    Month[Month["SEPTEMBER"] = 8] = "SEPTEMBER";
53892    Month[Month["OCTOBER"] = 9] = "OCTOBER";
53893    Month[Month["NOVEMBER"] = 10] = "NOVEMBER";
53894    Month[Month["DECEMBER"] = 11] = "DECEMBER";
53895    return Month;
53896  }({});
53897  let Day = /*#__PURE__*/function (Day) {
53898    Day[Day["SUNDAY"] = 0] = "SUNDAY";
53899    Day[Day["MONDAY"] = 1] = "MONDAY";
53900    Day[Day["TUESDAY"] = 2] = "TUESDAY";
53901    Day[Day["WEDNESDAY"] = 3] = "WEDNESDAY";
53902    Day[Day["THURSDAY"] = 4] = "THURSDAY";
53903    Day[Day["FRIDAY"] = 5] = "FRIDAY";
53904    Day[Day["SATURDAY"] = 6] = "SATURDAY";
53905    return Day;
53906  }({});
53907  const inRange = (date, min, max) => (isEqual(date, min) || isAfter(date, min)) && (isEqual(date, max) || isBefore(date, max));
53908  const use_lilius_clearTime = date => set(date, {
53909    hours: 0,
53910    minutes: 0,
53911    seconds: 0,
53912    milliseconds: 0
53913  });
53914  const useLilius = ({
53915    weekStartsOn = Day.SUNDAY,
53916    viewing: initialViewing = new Date(),
53917    selected: initialSelected = [],
53918    numberOfMonths = 1
53919  } = {}) => {
53920    const [viewing, setViewing] = (0,external_wp_element_namespaceObject.useState)(initialViewing);
53921    const viewToday = (0,external_wp_element_namespaceObject.useCallback)(() => setViewing(startOfToday()), [setViewing]);
53922    const viewMonth = (0,external_wp_element_namespaceObject.useCallback)(month => setViewing(v => setMonth(v, month)), []);
53923    const viewPreviousMonth = (0,external_wp_element_namespaceObject.useCallback)(() => setViewing(v => subMonths(v, 1)), []);
53924    const viewNextMonth = (0,external_wp_element_namespaceObject.useCallback)(() => setViewing(v => addMonths(v, 1)), []);
53925    const viewYear = (0,external_wp_element_namespaceObject.useCallback)(year => setViewing(v => setYear(v, year)), []);
53926    const viewPreviousYear = (0,external_wp_element_namespaceObject.useCallback)(() => setViewing(v => subYears(v, 1)), []);
53927    const viewNextYear = (0,external_wp_element_namespaceObject.useCallback)(() => setViewing(v => addYears(v, 1)), []);
53928    const [selected, setSelected] = (0,external_wp_element_namespaceObject.useState)(initialSelected.map(use_lilius_clearTime));
53929    const clearSelected = () => setSelected([]);
53930    const isSelected = (0,external_wp_element_namespaceObject.useCallback)(date => selected.findIndex(s => isEqual(s, date)) > -1, [selected]);
53931    const select = (0,external_wp_element_namespaceObject.useCallback)((date, replaceExisting) => {
53932      if (replaceExisting) {
53933        setSelected(Array.isArray(date) ? date : [date]);
53934      } else {
53935        setSelected(selectedItems => selectedItems.concat(Array.isArray(date) ? date : [date]));
53936      }
53937    }, []);
53938    const deselect = (0,external_wp_element_namespaceObject.useCallback)(date => setSelected(selectedItems => Array.isArray(date) ? selectedItems.filter(s => !date.map(d => d.getTime()).includes(s.getTime())) : selectedItems.filter(s => !isEqual(s, date))), []);
53939    const toggle = (0,external_wp_element_namespaceObject.useCallback)((date, replaceExisting) => isSelected(date) ? deselect(date) : select(date, replaceExisting), [deselect, isSelected, select]);
53940    const selectRange = (0,external_wp_element_namespaceObject.useCallback)((start, end, replaceExisting) => {
53941      if (replaceExisting) {
53942        setSelected(eachDayOfInterval({
53943          start,
53944          end
53945        }));
53946      } else {
53947        setSelected(selectedItems => selectedItems.concat(eachDayOfInterval({
53948          start,
53949          end
53950        })));
53951      }
53952    }, []);
53953    const deselectRange = (0,external_wp_element_namespaceObject.useCallback)((start, end) => {
53954      setSelected(selectedItems => selectedItems.filter(s => !eachDayOfInterval({
53955        start,
53956        end
53957      }).map(d => d.getTime()).includes(s.getTime())));
53958    }, []);
53959    const calendar = (0,external_wp_element_namespaceObject.useMemo)(() => eachMonthOfInterval({
53960      start: startOfMonth(viewing),
53961      end: endOfMonth(addMonths(viewing, numberOfMonths - 1))
53962    }).map(month => eachWeekOfInterval({
53963      start: startOfMonth(month),
53964      end: endOfMonth(month)
53965    }, {
53966      weekStartsOn
53967    }).map(week => eachDayOfInterval({
53968      start: startOfWeek(week, {
53969        weekStartsOn
53970      }),
53971      end: endOfWeek(week, {
53972        weekStartsOn
53973      })
53974    }))), [viewing, weekStartsOn, numberOfMonths]);
53975    return {
53976      clearTime: use_lilius_clearTime,
53977      inRange,
53978      viewing,
53979      setViewing,
53980      viewToday,
53981      viewMonth,
53982      viewPreviousMonth,
53983      viewNextMonth,
53984      viewYear,
53985      viewPreviousYear,
53986      viewNextYear,
53987      selected,
53988      setSelected,
53989      clearSelected,
53990      isSelected,
53991      select,
53992      deselect,
53993      toggle,
53994      selectRange,
53995      deselectRange,
53996      calendar
53997    };
53998  };
53999  
54000  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/date-time/date/styles.js
54001  
54002  /**
54003   * External dependencies
54004   */
54005  
54006  /**
54007   * Internal dependencies
54008   */
54009  
54010  
54011  
54012  
54013  
54014  const styles_Wrapper = /*#__PURE__*/emotion_styled_base_browser_esm("div",  true ? {
54015    target: "e105ri6r5"
54016  } : 0)(boxSizingReset, ";" + ( true ? "" : 0));
54017  const Navigator = /*#__PURE__*/emotion_styled_base_browser_esm(h_stack_component,  true ? {
54018    target: "e105ri6r4"
54019  } : 0)("margin-bottom:", space(4), ";" + ( true ? "" : 0));
54020  const NavigatorHeading = /*#__PURE__*/emotion_styled_base_browser_esm(heading_component,  true ? {
54021    target: "e105ri6r3"
54022  } : 0)("font-size:", config_values.fontSize, ";font-weight:", config_values.fontWeight, ";strong{font-weight:", config_values.fontWeightHeading, ";}" + ( true ? "" : 0));
54023  const Calendar = /*#__PURE__*/emotion_styled_base_browser_esm("div",  true ? {
54024    target: "e105ri6r2"
54025  } : 0)("column-gap:", space(2), ";display:grid;grid-template-columns:0.5fr repeat( 5, 1fr ) 0.5fr;justify-items:center;row-gap:", space(2), ";" + ( true ? "" : 0));
54026  const DayOfWeek = /*#__PURE__*/emotion_styled_base_browser_esm("div",  true ? {
54027    target: "e105ri6r1"
54028  } : 0)("color:", COLORS.theme.gray[700], ";font-size:", config_values.fontSize, ";line-height:", config_values.fontLineHeightBase, ";&:nth-of-type( 1 ){justify-self:start;}&:nth-of-type( 7 ){justify-self:end;}" + ( true ? "" : 0));
54029  const DayButton = /*#__PURE__*/emotion_styled_base_browser_esm(build_module_button,  true ? {
54030    shouldForwardProp: prop => !['column', 'isSelected', 'isToday', 'hasEvents'].includes(prop),
54031    target: "e105ri6r0"
54032  } : 0)("grid-column:", props => props.column, ";position:relative;justify-content:center;", props => props.column === 1 && `
54033          justify-self: start;
54034          `, " ", props => props.column === 7 && `
54035          justify-self: end;
54036          `, " ", props => props.disabled && `
54037          pointer-events: none;
54038          `, " &&&{border-radius:", config_values.radiusRound, ";height:", space(7), ";width:", space(7), ";", props => props.isSelected && `
54039                  background: $COLORS.theme.accent};
54040  
54041                  &,
54042                  &:hover:not(:disabled, [aria-disabled=true]) {
54043                      color: $COLORS.theme.accentInverted};
54044                  }
54045  
54046                  &:focus:not(:disabled),
54047                  &:focus:not(:disabled) {
54048                      border: $config_values.borderWidthFocus} solid currentColor;
54049                  }
54050  
54051                  /* Highlight the selected day for high-contrast mode */
54052                  &::after {
54053                      content: '';
54054                      position: absolute;
54055                      pointer-events: none;
54056                      inset: 0;
54057                      border-radius: inherit;
54058                      border: 1px solid transparent;
54059                  }
54060              `, " ", props => !props.isSelected && props.isToday && `
54061              background: $COLORS.theme.gray[200]};
54062              `, ";}", props => props.hasEvents && `
54063          ::before {
54064              border: 2px solid $props.isSelected ? COLORS.theme.accentInverted : COLORS.theme.accent};
54065              border-radius: $config_values.radiusRound};
54066              content: " ";
54067              left: 50%;
54068              position: absolute;
54069              transform: translate(-50%, 9px);
54070          }
54071          `, ";" + ( true ? "" : 0));
54072  
54073  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/date-time/utils.js
54074  /**
54075   * External dependencies
54076   */
54077  
54078  
54079  /**
54080   * Internal dependencies
54081   */
54082  
54083  
54084  
54085  /**
54086   * Like date-fn's toDate, but tries to guess the format when a string is
54087   * given.
54088   *
54089   * @param input Value to turn into a date.
54090   */
54091  function inputToDate(input) {
54092    if (typeof input === 'string') {
54093      return new Date(input);
54094    }
54095    return toDate(input);
54096  }
54097  
54098  /**
54099   * Converts a 12-hour time to a 24-hour time.
54100   * @param hours
54101   * @param isPm
54102   */
54103  function from12hTo24h(hours, isPm) {
54104    return isPm ? (hours % 12 + 12) % 24 : hours % 12;
54105  }
54106  
54107  /**
54108   * Converts a 24-hour time to a 12-hour time.
54109   * @param hours
54110   */
54111  function from24hTo12h(hours) {
54112    return hours % 12 || 12;
54113  }
54114  
54115  /**
54116   * Creates an InputControl reducer used to pad an input so that it is always a
54117   * given width. For example, the hours and minutes inputs are padded to 2 so
54118   * that '4' appears as '04'.
54119   *
54120   * @param pad How many digits the value should be.
54121   */
54122  function buildPadInputStateReducer(pad) {
54123    return (state, action) => {
54124      const nextState = {
54125        ...state
54126      };
54127      if (action.type === COMMIT || action.type === PRESS_UP || action.type === PRESS_DOWN) {
54128        if (nextState.value !== undefined) {
54129          nextState.value = nextState.value.toString().padStart(pad, '0');
54130        }
54131      }
54132      return nextState;
54133    };
54134  }
54135  
54136  /**
54137   * Validates the target of a React event to ensure it is an input element and
54138   * that the input is valid.
54139   * @param event
54140   */
54141  function validateInputElementTarget(event) {
54142    var _ownerDocument$defaul;
54143    // `instanceof` checks need to get the instance definition from the
54144    // corresponding window object — therefore, the following logic makes
54145    // the component work correctly even when rendered inside an iframe.
54146    const HTMLInputElementInstance = (_ownerDocument$defaul = event.target?.ownerDocument.defaultView?.HTMLInputElement) !== null && _ownerDocument$defaul !== void 0 ? _ownerDocument$defaul : HTMLInputElement;
54147    if (!(event.target instanceof HTMLInputElementInstance)) {
54148      return false;
54149    }
54150    return event.target.validity.valid;
54151  }
54152  
54153  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/date-time/constants.js
54154  const TIMEZONELESS_FORMAT = "yyyy-MM-dd'T'HH:mm:ss";
54155  
54156  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/date-time/date/index.js
54157  /**
54158   * External dependencies
54159   */
54160  
54161  /**
54162   * WordPress dependencies
54163   */
54164  
54165  
54166  
54167  
54168  
54169  /**
54170   * Internal dependencies
54171   */
54172  
54173  
54174  
54175  
54176  
54177  
54178  /**
54179   * DatePicker is a React component that renders a calendar for date selection.
54180   *
54181   * ```jsx
54182   * import { DatePicker } from '@wordpress/components';
54183   * import { useState } from '@wordpress/element';
54184   *
54185   * const MyDatePicker = () => {
54186   *   const [ date, setDate ] = useState( new Date() );
54187   *
54188   *   return (
54189   *     <DatePicker
54190   *       currentDate={ date }
54191   *       onChange={ ( newDate ) => setDate( newDate ) }
54192   *     />
54193   *   );
54194   * };
54195   * ```
54196   */
54197  
54198  
54199  function DatePicker({
54200    currentDate,
54201    onChange,
54202    events = [],
54203    isInvalidDate,
54204    onMonthPreviewed,
54205    startOfWeek: weekStartsOn = 0
54206  }) {
54207    const date = currentDate ? inputToDate(currentDate) : new Date();
54208    const {
54209      calendar,
54210      viewing,
54211      setSelected,
54212      setViewing,
54213      isSelected,
54214      viewPreviousMonth,
54215      viewNextMonth
54216    } = useLilius({
54217      selected: [startOfDay(date)],
54218      viewing: startOfDay(date),
54219      weekStartsOn
54220    });
54221  
54222    // Used to implement a roving tab index. Tracks the day that receives focus
54223    // when the user tabs into the calendar.
54224    const [focusable, setFocusable] = (0,external_wp_element_namespaceObject.useState)(startOfDay(date));
54225  
54226    // Allows us to only programmatically focus() a day when focus was already
54227    // within the calendar. This stops us stealing focus from e.g. a TimePicker
54228    // input.
54229    const [isFocusWithinCalendar, setIsFocusWithinCalendar] = (0,external_wp_element_namespaceObject.useState)(false);
54230  
54231    // Update internal state when currentDate prop changes.
54232    const [prevCurrentDate, setPrevCurrentDate] = (0,external_wp_element_namespaceObject.useState)(currentDate);
54233    if (currentDate !== prevCurrentDate) {
54234      setPrevCurrentDate(currentDate);
54235      setSelected([startOfDay(date)]);
54236      setViewing(startOfDay(date));
54237      setFocusable(startOfDay(date));
54238    }
54239    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(styles_Wrapper, {
54240      className: "components-datetime__date",
54241      role: "application",
54242      "aria-label": (0,external_wp_i18n_namespaceObject.__)('Calendar'),
54243      children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(Navigator, {
54244        children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, {
54245          icon: (0,external_wp_i18n_namespaceObject.isRTL)() ? arrow_right : arrow_left,
54246          variant: "tertiary",
54247          "aria-label": (0,external_wp_i18n_namespaceObject.__)('View previous month'),
54248          onClick: () => {
54249            viewPreviousMonth();
54250            setFocusable(subMonths(focusable, 1));
54251            onMonthPreviewed?.(format(subMonths(viewing, 1), TIMEZONELESS_FORMAT));
54252          },
54253          size: "compact"
54254        }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(NavigatorHeading, {
54255          level: 3,
54256          children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("strong", {
54257            children: (0,external_wp_date_namespaceObject.dateI18n)('F', viewing, -viewing.getTimezoneOffset())
54258          }), ' ', (0,external_wp_date_namespaceObject.dateI18n)('Y', viewing, -viewing.getTimezoneOffset())]
54259        }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, {
54260          icon: (0,external_wp_i18n_namespaceObject.isRTL)() ? arrow_left : arrow_right,
54261          variant: "tertiary",
54262          "aria-label": (0,external_wp_i18n_namespaceObject.__)('View next month'),
54263          onClick: () => {
54264            viewNextMonth();
54265            setFocusable(addMonths(focusable, 1));
54266            onMonthPreviewed?.(format(addMonths(viewing, 1), TIMEZONELESS_FORMAT));
54267          },
54268          size: "compact"
54269        })]
54270      }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(Calendar, {
54271        onFocus: () => setIsFocusWithinCalendar(true),
54272        onBlur: () => setIsFocusWithinCalendar(false),
54273        children: [calendar[0][0].map(day => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(DayOfWeek, {
54274          children: (0,external_wp_date_namespaceObject.dateI18n)('D', day, -day.getTimezoneOffset())
54275        }, day.toString())), calendar[0].map(week => week.map((day, index) => {
54276          if (!isSameMonth(day, viewing)) {
54277            return null;
54278          }
54279          return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(date_Day, {
54280            day: day,
54281            column: index + 1,
54282            isSelected: isSelected(day),
54283            isFocusable: isEqual(day, focusable),
54284            isFocusAllowed: isFocusWithinCalendar,
54285            isToday: isSameDay(day, new Date()),
54286            isInvalid: isInvalidDate ? isInvalidDate(day) : false,
54287            numEvents: events.filter(event => isSameDay(event.date, day)).length,
54288            onClick: () => {
54289              setSelected([day]);
54290              setFocusable(day);
54291              onChange?.(format(
54292              // Don't change the selected date's time fields.
54293              new Date(day.getFullYear(), day.getMonth(), day.getDate(), date.getHours(), date.getMinutes(), date.getSeconds(), date.getMilliseconds()), TIMEZONELESS_FORMAT));
54294            },
54295            onKeyDown: event => {
54296              let nextFocusable;
54297              if (event.key === 'ArrowLeft') {
54298                nextFocusable = addDays(day, (0,external_wp_i18n_namespaceObject.isRTL)() ? 1 : -1);
54299              }
54300              if (event.key === 'ArrowRight') {
54301                nextFocusable = addDays(day, (0,external_wp_i18n_namespaceObject.isRTL)() ? -1 : 1);
54302              }
54303              if (event.key === 'ArrowUp') {
54304                nextFocusable = subWeeks(day, 1);
54305              }
54306              if (event.key === 'ArrowDown') {
54307                nextFocusable = addWeeks(day, 1);
54308              }
54309              if (event.key === 'PageUp') {
54310                nextFocusable = subMonths(day, 1);
54311              }
54312              if (event.key === 'PageDown') {
54313                nextFocusable = addMonths(day, 1);
54314              }
54315              if (event.key === 'Home') {
54316                nextFocusable = startOfWeek(day);
54317              }
54318              if (event.key === 'End') {
54319                nextFocusable = startOfDay(endOfWeek(day));
54320              }
54321              if (nextFocusable) {
54322                event.preventDefault();
54323                setFocusable(nextFocusable);
54324                if (!isSameMonth(nextFocusable, viewing)) {
54325                  setViewing(nextFocusable);
54326                  onMonthPreviewed?.(format(nextFocusable, TIMEZONELESS_FORMAT));
54327                }
54328              }
54329            }
54330          }, day.toString());
54331        }))]
54332      })]
54333    });
54334  }
54335  function date_Day({
54336    day,
54337    column,
54338    isSelected,
54339    isFocusable,
54340    isFocusAllowed,
54341    isToday,
54342    isInvalid,
54343    numEvents,
54344    onClick,
54345    onKeyDown
54346  }) {
54347    const ref = (0,external_wp_element_namespaceObject.useRef)();
54348  
54349    // Focus the day when it becomes focusable, e.g. because an arrow key is
54350    // pressed. Only do this if focus is allowed - this stops us stealing focus
54351    // from e.g. a TimePicker input.
54352    (0,external_wp_element_namespaceObject.useEffect)(() => {
54353      if (ref.current && isFocusable && isFocusAllowed) {
54354        ref.current.focus();
54355      }
54356      // isFocusAllowed is not a dep as there is no point calling focus() on
54357      // an already focused element.
54358      // eslint-disable-next-line react-hooks/exhaustive-deps
54359    }, [isFocusable]);
54360    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(DayButton, {
54361      ref: ref,
54362      className: "components-datetime__date__day" // Unused, for backwards compatibility.
54363      ,
54364      disabled: isInvalid,
54365      tabIndex: isFocusable ? 0 : -1,
54366      "aria-label": getDayLabel(day, isSelected, numEvents),
54367      column: column,
54368      isSelected: isSelected,
54369      isToday: isToday,
54370      hasEvents: numEvents > 0,
54371      onClick: onClick,
54372      onKeyDown: onKeyDown,
54373      children: (0,external_wp_date_namespaceObject.dateI18n)('j', day, -day.getTimezoneOffset())
54374    });
54375  }
54376  function getDayLabel(date, isSelected, numEvents) {
54377    const {
54378      formats
54379    } = (0,external_wp_date_namespaceObject.getSettings)();
54380    const localizedDate = (0,external_wp_date_namespaceObject.dateI18n)(formats.date, date, -date.getTimezoneOffset());
54381    if (isSelected && numEvents > 0) {
54382      return (0,external_wp_i18n_namespaceObject.sprintf)(
54383      // translators: 1: The calendar date. 2: Number of events on the calendar date.
54384      (0,external_wp_i18n_namespaceObject._n)('%1$s. Selected. There is %2$d event', '%1$s. Selected. There are %2$d events', numEvents), localizedDate, numEvents);
54385    } else if (isSelected) {
54386      return (0,external_wp_i18n_namespaceObject.sprintf)(
54387      // translators: %s: The calendar date.
54388      (0,external_wp_i18n_namespaceObject.__)('%1$s. Selected'), localizedDate);
54389    } else if (numEvents > 0) {
54390      return (0,external_wp_i18n_namespaceObject.sprintf)(
54391      // translators: 1: The calendar date. 2: Number of events on the calendar date.
54392      (0,external_wp_i18n_namespaceObject._n)('%1$s. There is %2$d event', '%1$s. There are %2$d events', numEvents), localizedDate, numEvents);
54393    }
54394    return localizedDate;
54395  }
54396  /* harmony default export */ const date = (DatePicker);
54397  
54398  ;// CONCATENATED MODULE: ./node_modules/date-fns/startOfMinute.mjs
54399  
54400  
54401  /**
54402   * @name startOfMinute
54403   * @category Minute Helpers
54404   * @summary Return the start of a minute for the given date.
54405   *
54406   * @description
54407   * Return the start of a minute for the given date.
54408   * The result will be in the local timezone.
54409   *
54410   * @typeParam DateType - The `Date` type, the function operates on. Gets inferred from passed arguments. Allows to use extensions like [`UTCDate`](https://github.com/date-fns/utc).
54411   *
54412   * @param date - The original date
54413   *
54414   * @returns The start of a minute
54415   *
54416   * @example
54417   * // The start of a minute for 1 December 2014 22:15:45.400:
54418   * const result = startOfMinute(new Date(2014, 11, 1, 22, 15, 45, 400))
54419   * //=> Mon Dec 01 2014 22:15:00
54420   */
54421  function startOfMinute(date) {
54422    const _date = toDate(date);
54423    _date.setSeconds(0, 0);
54424    return _date;
54425  }
54426  
54427  // Fallback for modularized imports:
54428  /* harmony default export */ const date_fns_startOfMinute = ((/* unused pure expression or super */ null && (startOfMinute)));
54429  
54430  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/date-time/time/styles.js
54431  
54432  function time_styles_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)."; }
54433  /**
54434   * External dependencies
54435   */
54436  
54437  
54438  
54439  /**
54440   * Internal dependencies
54441   */
54442  
54443  
54444  
54445  
54446  const time_styles_Wrapper = /*#__PURE__*/emotion_styled_base_browser_esm("div",  true ? {
54447    target: "evcr2319"
54448  } : 0)("box-sizing:border-box;font-size:", config_values.fontSize, ";" + ( true ? "" : 0));
54449  const Fieldset = /*#__PURE__*/emotion_styled_base_browser_esm("fieldset",  true ? {
54450    target: "evcr2318"
54451  } : 0)("border:0;margin:0 0 ", space(2 * 2), " 0;padding:0;&:last-child{margin-bottom:0;}" + ( true ? "" : 0));
54452  const TimeWrapper = /*#__PURE__*/emotion_styled_base_browser_esm("div",  true ? {
54453    target: "evcr2317"
54454  } : 0)( true ? {
54455    name: "pd0mhc",
54456    styles: "direction:ltr;display:flex"
54457  } : 0);
54458  const baseInput = /*#__PURE__*/emotion_react_browser_esm_css("&&& ", Input, "{padding-left:", space(2), ";padding-right:", space(2), ";text-align:center;}" + ( true ? "" : 0),  true ? "" : 0);
54459  const HoursInput = /*#__PURE__*/emotion_styled_base_browser_esm(number_control,  true ? {
54460    target: "evcr2316"
54461  } : 0)(baseInput, " width:", space(9), ";&&& ", Input, "{padding-right:0;}&&& ", BackdropUI, "{border-right:0;border-top-right-radius:0;border-bottom-right-radius:0;}" + ( true ? "" : 0));
54462  const TimeSeparator = /*#__PURE__*/emotion_styled_base_browser_esm("span",  true ? {
54463    target: "evcr2315"
54464  } : 0)("border-top:", config_values.borderWidth, " solid ", COLORS.gray[700], ";border-bottom:", config_values.borderWidth, " solid ", COLORS.gray[700], ";font-size:", config_values.fontSize, ";line-height:calc(\n\t\t", config_values.controlHeight, " - ", config_values.borderWidth, " * 2\n\t);display:inline-block;" + ( true ? "" : 0));
54465  const MinutesInput = /*#__PURE__*/emotion_styled_base_browser_esm(number_control,  true ? {
54466    target: "evcr2314"
54467  } : 0)(baseInput, " width:", space(9), ";&&& ", Input, "{padding-left:0;}&&& ", BackdropUI, "{border-left:0;border-top-left-radius:0;border-bottom-left-radius:0;}" + ( true ? "" : 0));
54468  
54469  // Ideally we wouldn't need a wrapper, but can't otherwise target the
54470  // <BaseControl> in <SelectControl>
54471  const MonthSelectWrapper = /*#__PURE__*/emotion_styled_base_browser_esm("div",  true ? {
54472    target: "evcr2313"
54473  } : 0)( true ? {
54474    name: "1ff36h2",
54475    styles: "flex-grow:1"
54476  } : 0);
54477  const DayInput = /*#__PURE__*/emotion_styled_base_browser_esm(number_control,  true ? {
54478    target: "evcr2312"
54479  } : 0)(baseInput, " width:", space(9), ";" + ( true ? "" : 0));
54480  const YearInput = /*#__PURE__*/emotion_styled_base_browser_esm(number_control,  true ? {
54481    target: "evcr2311"
54482  } : 0)(baseInput, " width:", space(14), ";" + ( true ? "" : 0));
54483  const TimeZone = /*#__PURE__*/emotion_styled_base_browser_esm("div",  true ? {
54484    target: "evcr2310"
54485  } : 0)( true ? {
54486    name: "ebu3jh",
54487    styles: "text-decoration:underline dotted"
54488  } : 0);
54489  
54490  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/date-time/time/timezone.js
54491  /**
54492   * WordPress dependencies
54493   */
54494  
54495  
54496  
54497  /**
54498   * Internal dependencies
54499   */
54500  
54501  
54502  
54503  /**
54504   * Displays timezone information when user timezone is different from site
54505   * timezone.
54506   */
54507  
54508  const timezone_TimeZone = () => {
54509    const {
54510      timezone
54511    } = (0,external_wp_date_namespaceObject.getSettings)();
54512  
54513    // Convert timezone offset to hours.
54514    const userTimezoneOffset = -1 * (new Date().getTimezoneOffset() / 60);
54515  
54516    // System timezone and user timezone match, nothing needed.
54517    // Compare as numbers because it comes over as string.
54518    if (Number(timezone.offset) === userTimezoneOffset) {
54519      return null;
54520    }
54521    const offsetSymbol = Number(timezone.offset) >= 0 ? '+' : '';
54522    const zoneAbbr = '' !== timezone.abbr && isNaN(Number(timezone.abbr)) ? timezone.abbr : `UTC$offsetSymbol}$timezone.offsetFormatted}`;
54523  
54524    // Replace underscore with space in strings like `America/Costa_Rica`.
54525    const prettyTimezoneString = timezone.string.replace('_', ' ');
54526    const timezoneDetail = 'UTC' === timezone.string ? (0,external_wp_i18n_namespaceObject.__)('Coordinated Universal Time') : `($zoneAbbr}) $prettyTimezoneString}`;
54527  
54528    // When the prettyTimezoneString is empty, there is no additional timezone
54529    // detail information to show in a Tooltip.
54530    const hasNoAdditionalTimezoneDetail = prettyTimezoneString.trim().length === 0;
54531    return hasNoAdditionalTimezoneDetail ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(TimeZone, {
54532      className: "components-datetime__timezone",
54533      children: zoneAbbr
54534    }) : /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(tooltip, {
54535      placement: "top",
54536      text: timezoneDetail,
54537      children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(TimeZone, {
54538        className: "components-datetime__timezone",
54539        children: zoneAbbr
54540      })
54541    });
54542  };
54543  /* harmony default export */ const timezone = (timezone_TimeZone);
54544  
54545  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/toggle-group-control/toggle-group-control-option/component.js
54546  /**
54547   * External dependencies
54548   */
54549  
54550  /**
54551   * WordPress dependencies
54552   */
54553  
54554  
54555  /**
54556   * Internal dependencies
54557   */
54558  
54559  
54560  
54561  function UnforwardedToggleGroupControlOption(props, ref) {
54562    const {
54563      label,
54564      ...restProps
54565    } = props;
54566    const optionLabel = restProps['aria-label'] || label;
54567    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(toggle_group_control_option_base_component, {
54568      ...restProps,
54569      "aria-label": optionLabel,
54570      ref: ref,
54571      children: label
54572    });
54573  }
54574  
54575  /**
54576   * `ToggleGroupControlOption` is a form component and is meant to be used as a
54577   * child of `ToggleGroupControl`.
54578   *
54579   * ```jsx
54580   * import {
54581   *   __experimentalToggleGroupControl as ToggleGroupControl,
54582   *   __experimentalToggleGroupControlOption as ToggleGroupControlOption,
54583   * } from '@wordpress/components';
54584   *
54585   * function Example() {
54586   *   return (
54587   *     <ToggleGroupControl
54588   *       label="my label"
54589   *       value="vertical"
54590   *       isBlock
54591   *       __nextHasNoMarginBottom
54592   *     >
54593   *       <ToggleGroupControlOption value="horizontal" label="Horizontal" />
54594   *       <ToggleGroupControlOption value="vertical" label="Vertical" />
54595   *     </ToggleGroupControl>
54596   *   );
54597   * }
54598   * ```
54599   */
54600  const ToggleGroupControlOption = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedToggleGroupControlOption);
54601  /* harmony default export */ const toggle_group_control_option_component = (ToggleGroupControlOption);
54602  
54603  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/date-time/time/time-input/index.js
54604  /**
54605   * External dependencies
54606   */
54607  
54608  
54609  /**
54610   * WordPress dependencies
54611   */
54612  
54613  
54614  
54615  /**
54616   * Internal dependencies
54617   */
54618  
54619  
54620  
54621  
54622  
54623  
54624  
54625  
54626  function TimeInput({
54627    value: valueProp,
54628    defaultValue,
54629    is12Hour,
54630    label,
54631    minutesProps,
54632    onChange
54633  }) {
54634    const [value = {
54635      hours: new Date().getHours(),
54636      minutes: new Date().getMinutes()
54637    }, setValue] = useControlledValue({
54638      value: valueProp,
54639      onChange,
54640      defaultValue
54641    });
54642    const dayPeriod = parseDayPeriod(value.hours);
54643    const hours12Format = from24hTo12h(value.hours);
54644    const buildNumberControlChangeCallback = method => {
54645      return (_value, {
54646        event
54647      }) => {
54648        if (!validateInputElementTarget(event)) {
54649          return;
54650        }
54651  
54652        // We can safely assume value is a number if target is valid.
54653        const numberValue = Number(_value);
54654        setValue({
54655          ...value,
54656          [method]: method === 'hours' && is12Hour ? from12hTo24h(numberValue, dayPeriod === 'PM') : numberValue
54657        });
54658      };
54659    };
54660    const buildAmPmChangeCallback = _value => {
54661      return () => {
54662        if (dayPeriod === _value) {
54663          return;
54664        }
54665        setValue({
54666          ...value,
54667          hours: from12hTo24h(hours12Format, _value === 'PM')
54668        });
54669      };
54670    };
54671    function parseDayPeriod(_hours) {
54672      return _hours < 12 ? 'AM' : 'PM';
54673    }
54674    const Wrapper = label ? Fieldset : external_wp_element_namespaceObject.Fragment;
54675    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(Wrapper, {
54676      children: [label && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(base_control.VisualLabel, {
54677        as: "legend",
54678        children: label
54679      }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(h_stack_component, {
54680        alignment: "left",
54681        expanded: false,
54682        children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(TimeWrapper, {
54683          className: "components-datetime__time-field components-datetime__time-field-time" // Unused, for backwards compatibility.
54684          ,
54685          children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(HoursInput, {
54686            className: "components-datetime__time-field-hours-input" // Unused, for backwards compatibility.
54687            ,
54688            label: (0,external_wp_i18n_namespaceObject.__)('Hours'),
54689            hideLabelFromVision: true,
54690            __next40pxDefaultSize: true,
54691            value: String(is12Hour ? hours12Format : value.hours).padStart(2, '0'),
54692            step: 1,
54693            min: is12Hour ? 1 : 0,
54694            max: is12Hour ? 12 : 23,
54695            required: true,
54696            spinControls: "none",
54697            isPressEnterToChange: true,
54698            isDragEnabled: false,
54699            isShiftStepEnabled: false,
54700            onChange: buildNumberControlChangeCallback('hours'),
54701            __unstableStateReducer: buildPadInputStateReducer(2)
54702          }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(TimeSeparator, {
54703            className: "components-datetime__time-separator" // Unused, for backwards compatibility.
54704            ,
54705            "aria-hidden": "true",
54706            children: ":"
54707          }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(MinutesInput, {
54708            className: dist_clsx('components-datetime__time-field-minutes-input',
54709            // Unused, for backwards compatibility.
54710            minutesProps?.className),
54711            label: (0,external_wp_i18n_namespaceObject.__)('Minutes'),
54712            hideLabelFromVision: true,
54713            __next40pxDefaultSize: true,
54714            value: String(value.minutes).padStart(2, '0'),
54715            step: 1,
54716            min: 0,
54717            max: 59,
54718            required: true,
54719            spinControls: "none",
54720            isPressEnterToChange: true,
54721            isDragEnabled: false,
54722            isShiftStepEnabled: false,
54723            onChange: (...args) => {
54724              buildNumberControlChangeCallback('minutes')(...args);
54725              minutesProps?.onChange?.(...args);
54726            },
54727            __unstableStateReducer: buildPadInputStateReducer(2),
54728            ...minutesProps
54729          })]
54730        }), is12Hour && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(toggle_group_control_component, {
54731          __next40pxDefaultSize: true,
54732          __nextHasNoMarginBottom: true,
54733          isBlock: true,
54734          label: (0,external_wp_i18n_namespaceObject.__)('Select AM or PM'),
54735          hideLabelFromVision: true,
54736          value: dayPeriod,
54737          onChange: newValue => {
54738            buildAmPmChangeCallback(newValue)();
54739          },
54740          children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(toggle_group_control_option_component, {
54741            value: "AM",
54742            label: (0,external_wp_i18n_namespaceObject.__)('AM')
54743          }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(toggle_group_control_option_component, {
54744            value: "PM",
54745            label: (0,external_wp_i18n_namespaceObject.__)('PM')
54746          })]
54747        })]
54748      })]
54749    });
54750  }
54751  /* harmony default export */ const time_input = ((/* unused pure expression or super */ null && (TimeInput)));
54752  
54753  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/date-time/time/index.js
54754  /**
54755   * External dependencies
54756   */
54757  
54758  
54759  /**
54760   * WordPress dependencies
54761   */
54762  
54763  
54764  
54765  /**
54766   * Internal dependencies
54767   */
54768  
54769  
54770  
54771  
54772  
54773  
54774  
54775  
54776  
54777  
54778  
54779  
54780  const VALID_DATE_ORDERS = ['dmy', 'mdy', 'ymd'];
54781  
54782  /**
54783   * TimePicker is a React component that renders a clock for time selection.
54784   *
54785   * ```jsx
54786   * import { TimePicker } from '@wordpress/components';
54787   * import { useState } from '@wordpress/element';
54788   *
54789   * const MyTimePicker = () => {
54790   *   const [ time, setTime ] = useState( new Date() );
54791   *
54792   *   return (
54793   *     <TimePicker
54794   *       currentTime={ date }
54795   *       onChange={ ( newTime ) => setTime( newTime ) }
54796   *       is12Hour
54797   *     />
54798   *   );
54799   * };
54800   * ```
54801   */
54802  function TimePicker({
54803    is12Hour,
54804    currentTime,
54805    onChange,
54806    dateOrder: dateOrderProp,
54807    hideLabelFromVision = false
54808  }) {
54809    const [date, setDate] = (0,external_wp_element_namespaceObject.useState)(() =>
54810    // Truncate the date at the minutes, see: #15495.
54811    currentTime ? startOfMinute(inputToDate(currentTime)) : new Date());
54812  
54813    // Reset the state when currentTime changed.
54814    // TODO: useEffect() shouldn't be used like this, causes an unnecessary render
54815    (0,external_wp_element_namespaceObject.useEffect)(() => {
54816      setDate(currentTime ? startOfMinute(inputToDate(currentTime)) : new Date());
54817    }, [currentTime]);
54818    const monthOptions = [{
54819      value: '01',
54820      label: (0,external_wp_i18n_namespaceObject.__)('January')
54821    }, {
54822      value: '02',
54823      label: (0,external_wp_i18n_namespaceObject.__)('February')
54824    }, {
54825      value: '03',
54826      label: (0,external_wp_i18n_namespaceObject.__)('March')
54827    }, {
54828      value: '04',
54829      label: (0,external_wp_i18n_namespaceObject.__)('April')
54830    }, {
54831      value: '05',
54832      label: (0,external_wp_i18n_namespaceObject.__)('May')
54833    }, {
54834      value: '06',
54835      label: (0,external_wp_i18n_namespaceObject.__)('June')
54836    }, {
54837      value: '07',
54838      label: (0,external_wp_i18n_namespaceObject.__)('July')
54839    }, {
54840      value: '08',
54841      label: (0,external_wp_i18n_namespaceObject.__)('August')
54842    }, {
54843      value: '09',
54844      label: (0,external_wp_i18n_namespaceObject.__)('September')
54845    }, {
54846      value: '10',
54847      label: (0,external_wp_i18n_namespaceObject.__)('October')
54848    }, {
54849      value: '11',
54850      label: (0,external_wp_i18n_namespaceObject.__)('November')
54851    }, {
54852      value: '12',
54853      label: (0,external_wp_i18n_namespaceObject.__)('December')
54854    }];
54855    const {
54856      day,
54857      month,
54858      year,
54859      minutes,
54860      hours
54861    } = (0,external_wp_element_namespaceObject.useMemo)(() => ({
54862      day: format(date, 'dd'),
54863      month: format(date, 'MM'),
54864      year: format(date, 'yyyy'),
54865      minutes: format(date, 'mm'),
54866      hours: format(date, 'HH'),
54867      am: format(date, 'a')
54868    }), [date]);
54869    const buildNumberControlChangeCallback = method => {
54870      const callback = (value, {
54871        event
54872      }) => {
54873        if (!validateInputElementTarget(event)) {
54874          return;
54875        }
54876  
54877        // We can safely assume value is a number if target is valid.
54878        const numberValue = Number(value);
54879        const newDate = set(date, {
54880          [method]: numberValue
54881        });
54882        setDate(newDate);
54883        onChange?.(format(newDate, TIMEZONELESS_FORMAT));
54884      };
54885      return callback;
54886    };
54887    const onTimeInputChangeCallback = ({
54888      hours: newHours,
54889      minutes: newMinutes
54890    }) => {
54891      const newDate = set(date, {
54892        hours: newHours,
54893        minutes: newMinutes
54894      });
54895      setDate(newDate);
54896      onChange?.(format(newDate, TIMEZONELESS_FORMAT));
54897    };
54898    const dayField = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(DayInput, {
54899      className: "components-datetime__time-field components-datetime__time-field-day" // Unused, for backwards compatibility.
54900      ,
54901      label: (0,external_wp_i18n_namespaceObject.__)('Day'),
54902      hideLabelFromVision: true,
54903      __next40pxDefaultSize: true,
54904      value: day,
54905      step: 1,
54906      min: 1,
54907      max: 31,
54908      required: true,
54909      spinControls: "none",
54910      isPressEnterToChange: true,
54911      isDragEnabled: false,
54912      isShiftStepEnabled: false,
54913      onChange: buildNumberControlChangeCallback('date')
54914    }, "day");
54915    const monthField = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(MonthSelectWrapper, {
54916      children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(select_control, {
54917        className: "components-datetime__time-field components-datetime__time-field-month" // Unused, for backwards compatibility.
54918        ,
54919        label: (0,external_wp_i18n_namespaceObject.__)('Month'),
54920        hideLabelFromVision: true,
54921        __next40pxDefaultSize: true,
54922        __nextHasNoMarginBottom: true,
54923        value: month,
54924        options: monthOptions,
54925        onChange: value => {
54926          const newDate = setMonth(date, Number(value) - 1);
54927          setDate(newDate);
54928          onChange?.(format(newDate, TIMEZONELESS_FORMAT));
54929        }
54930      })
54931    }, "month");
54932    const yearField = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(YearInput, {
54933      className: "components-datetime__time-field components-datetime__time-field-year" // Unused, for backwards compatibility.
54934      ,
54935      label: (0,external_wp_i18n_namespaceObject.__)('Year'),
54936      hideLabelFromVision: true,
54937      __next40pxDefaultSize: true,
54938      value: year,
54939      step: 1,
54940      min: 1,
54941      max: 9999,
54942      required: true,
54943      spinControls: "none",
54944      isPressEnterToChange: true,
54945      isDragEnabled: false,
54946      isShiftStepEnabled: false,
54947      onChange: buildNumberControlChangeCallback('year'),
54948      __unstableStateReducer: buildPadInputStateReducer(4)
54949    }, "year");
54950    const defaultDateOrder = is12Hour ? 'mdy' : 'dmy';
54951    const dateOrder = dateOrderProp && VALID_DATE_ORDERS.includes(dateOrderProp) ? dateOrderProp : defaultDateOrder;
54952    const fields = dateOrder.split('').map(field => {
54953      switch (field) {
54954        case 'd':
54955          return dayField;
54956        case 'm':
54957          return monthField;
54958        case 'y':
54959          return yearField;
54960        default:
54961          return null;
54962      }
54963    });
54964    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(time_styles_Wrapper, {
54965      className: "components-datetime__time" // Unused, for backwards compatibility.
54966      ,
54967      children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(Fieldset, {
54968        children: [hideLabelFromVision ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(visually_hidden_component, {
54969          as: "legend",
54970          children: (0,external_wp_i18n_namespaceObject.__)('Time')
54971        }) : /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(base_control.VisualLabel, {
54972          as: "legend",
54973          className: "components-datetime__time-legend" // Unused, for backwards compatibility.
54974          ,
54975          children: (0,external_wp_i18n_namespaceObject.__)('Time')
54976        }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(h_stack_component, {
54977          className: "components-datetime__time-wrapper" // Unused, for backwards compatibility.
54978          ,
54979          children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(TimeInput, {
54980            value: {
54981              hours: Number(hours),
54982              minutes: Number(minutes)
54983            },
54984            is12Hour: is12Hour,
54985            onChange: onTimeInputChangeCallback
54986          }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(spacer_component, {}), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(timezone, {})]
54987        })]
54988      }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(Fieldset, {
54989        children: [hideLabelFromVision ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(visually_hidden_component, {
54990          as: "legend",
54991          children: (0,external_wp_i18n_namespaceObject.__)('Date')
54992        }) : /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(base_control.VisualLabel, {
54993          as: "legend",
54994          className: "components-datetime__time-legend" // Unused, for backwards compatibility.
54995          ,
54996          children: (0,external_wp_i18n_namespaceObject.__)('Date')
54997        }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(h_stack_component, {
54998          className: "components-datetime__time-wrapper" // Unused, for backwards compatibility.
54999          ,
55000          children: fields
55001        })]
55002      })]
55003    });
55004  }
55005  
55006  /**
55007   * A component to input a time.
55008   *
55009   * Values are passed as an object in 24-hour format (`{ hours: number, minutes: number }`).
55010   *
55011   * ```jsx
55012   * import { TimePicker } from '@wordpress/components';
55013   * import { useState } from '@wordpress/element';
55014   *
55015   * const MyTimeInput = () => {
55016   *     const [ time, setTime ] = useState( { hours: 13, minutes: 30 } );
55017   *
55018   *     return (
55019   *         <TimePicker.TimeInput
55020   *             value={ time }
55021   *             onChange={ setTime }
55022   *             label="Time"
55023   *         />
55024   *     );
55025   * };
55026   * ```
55027   */
55028  TimePicker.TimeInput = TimeInput;
55029  Object.assign(TimePicker.TimeInput, {
55030    displayName: 'TimePicker.TimeInput'
55031  });
55032  /* harmony default export */ const date_time_time = (TimePicker);
55033  
55034  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/date-time/date-time/styles.js
55035  
55036  function date_time_styles_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)."; }
55037  /**
55038   * External dependencies
55039   */
55040  
55041  /**
55042   * Internal dependencies
55043   */
55044  
55045  const date_time_styles_Wrapper = /*#__PURE__*/emotion_styled_base_browser_esm(v_stack_component,  true ? {
55046    target: "e1p5onf00"
55047  } : 0)( true ? {
55048    name: "1khn195",
55049    styles: "box-sizing:border-box"
55050  } : 0);
55051  
55052  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/date-time/date-time/index.js
55053  /**
55054   * External dependencies
55055   */
55056  
55057  /**
55058   * WordPress dependencies
55059   */
55060  
55061  
55062  /**
55063   * Internal dependencies
55064   */
55065  
55066  
55067  
55068  
55069  
55070  
55071  
55072  const date_time_noop = () => {};
55073  function UnforwardedDateTimePicker({
55074    currentDate,
55075    is12Hour,
55076    dateOrder,
55077    isInvalidDate,
55078    onMonthPreviewed = date_time_noop,
55079    onChange,
55080    events,
55081    startOfWeek
55082  }, ref) {
55083    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(date_time_styles_Wrapper, {
55084      ref: ref,
55085      className: "components-datetime",
55086      spacing: 4,
55087      children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, {
55088        children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(date_time_time, {
55089          currentTime: currentDate,
55090          onChange: onChange,
55091          is12Hour: is12Hour,
55092          dateOrder: dateOrder
55093        }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(date, {
55094          currentDate: currentDate,
55095          onChange: onChange,
55096          isInvalidDate: isInvalidDate,
55097          events: events,
55098          onMonthPreviewed: onMonthPreviewed,
55099          startOfWeek: startOfWeek
55100        })]
55101      })
55102    });
55103  }
55104  
55105  /**
55106   * DateTimePicker is a React component that renders a calendar and clock for
55107   * date and time selection. The calendar and clock components can be accessed
55108   * individually using the `DatePicker` and `TimePicker` components respectively.
55109   *
55110   * ```jsx
55111   * import { DateTimePicker } from '@wordpress/components';
55112   * import { useState } from '@wordpress/element';
55113   *
55114   * const MyDateTimePicker = () => {
55115   *   const [ date, setDate ] = useState( new Date() );
55116   *
55117   *   return (
55118   *     <DateTimePicker
55119   *       currentDate={ date }
55120   *       onChange={ ( newDate ) => setDate( newDate ) }
55121   *       is12Hour
55122   *     />
55123   *   );
55124   * };
55125   * ```
55126   */
55127  const DateTimePicker = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedDateTimePicker);
55128  /* harmony default export */ const date_time = (DateTimePicker);
55129  
55130  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/date-time/index.js
55131  /**
55132   * Internal dependencies
55133   */
55134  
55135  
55136  
55137  
55138  /* harmony default export */ const build_module_date_time = (date_time);
55139  
55140  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/dimension-control/sizes.js
55141  /**
55142   * Sizes
55143   *
55144   * defines the sizes used in dimension controls
55145   * all hardcoded `size` values are based on the value of
55146   * the Sass variable `$block-padding` from
55147   * `packages/block-editor/src/components/dimension-control/sizes.js`.
55148   */
55149  
55150  /**
55151   * WordPress dependencies
55152   */
55153  
55154  
55155  /**
55156   * Internal dependencies
55157   */
55158  
55159  /**
55160   * Finds the correct size object from the provided sizes
55161   * table by size slug (eg: `medium`)
55162   *
55163   * @param sizes containing objects for each size definition.
55164   * @param slug  a string representation of the size (eg: `medium`).
55165   */
55166  const findSizeBySlug = (sizes, slug) => sizes.find(size => slug === size.slug);
55167  /* harmony default export */ const dimension_control_sizes = ([{
55168    name: (0,external_wp_i18n_namespaceObject._x)('None', 'Size of a UI element'),
55169    slug: 'none'
55170  }, {
55171    name: (0,external_wp_i18n_namespaceObject._x)('Small', 'Size of a UI element'),
55172    slug: 'small'
55173  }, {
55174    name: (0,external_wp_i18n_namespaceObject._x)('Medium', 'Size of a UI element'),
55175    slug: 'medium'
55176  }, {
55177    name: (0,external_wp_i18n_namespaceObject._x)('Large', 'Size of a UI element'),
55178    slug: 'large'
55179  }, {
55180    name: (0,external_wp_i18n_namespaceObject._x)('Extra Large', 'Size of a UI element'),
55181    slug: 'xlarge'
55182  }]);
55183  
55184  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/dimension-control/index.js
55185  /**
55186   * External dependencies
55187   */
55188  
55189  
55190  /**
55191   * WordPress dependencies
55192   */
55193  
55194  
55195  /**
55196   * Internal dependencies
55197   */
55198  
55199  
55200  
55201  
55202  
55203  
55204  
55205  
55206  const dimension_control_CONTEXT_VALUE = {
55207    BaseControl: {
55208      // Temporary during deprecation grace period: Overrides the underlying `__associatedWPComponentName`
55209      // via the context system to override the value set by SelectControl.
55210      _overrides: {
55211        __associatedWPComponentName: 'DimensionControl'
55212      }
55213    }
55214  };
55215  
55216  /**
55217   * `DimensionControl` is a component designed to provide a UI to control spacing and/or dimensions.
55218   *
55219   * @deprecated
55220   *
55221   * ```jsx
55222   * import { __experimentalDimensionControl as DimensionControl } from '@wordpress/components';
55223   * import { useState } from '@wordpress/element';
55224   *
55225   * export default function MyCustomDimensionControl() {
55226   *     const [ paddingSize, setPaddingSize ] = useState( '' );
55227   *
55228   *     return (
55229   *         <DimensionControl
55230   *             __nextHasNoMarginBottom
55231   *             label={ 'Padding' }
55232   *             icon={ 'desktop' }
55233   *             onChange={ ( value ) => setPaddingSize( value ) }
55234   *             value={ paddingSize }
55235   *         />
55236   *     );
55237   * }
55238   * ```
55239   */
55240  function DimensionControl(props) {
55241    const {
55242      __next40pxDefaultSize = false,
55243      __nextHasNoMarginBottom = false,
55244      label,
55245      value,
55246      sizes = dimension_control_sizes,
55247      icon,
55248      onChange,
55249      className = ''
55250    } = props;
55251    external_wp_deprecated_default()('wp.components.DimensionControl', {
55252      since: '6.7',
55253      version: '7.0'
55254    });
55255    const onChangeSpacingSize = val => {
55256      const theSize = findSizeBySlug(sizes, val);
55257      if (!theSize || value === theSize.slug) {
55258        onChange?.(undefined);
55259      } else if (typeof onChange === 'function') {
55260        onChange(theSize.slug);
55261      }
55262    };
55263    const formatSizesAsOptions = theSizes => {
55264      const options = theSizes.map(({
55265        name,
55266        slug
55267      }) => ({
55268        label: name,
55269        value: slug
55270      }));
55271      return [{
55272        label: (0,external_wp_i18n_namespaceObject.__)('Default'),
55273        value: ''
55274      }, ...options];
55275    };
55276    const selectLabel = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, {
55277      children: [icon && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_icon, {
55278        icon: icon
55279      }), label]
55280    });
55281    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ContextSystemProvider, {
55282      value: dimension_control_CONTEXT_VALUE,
55283      children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(select_control, {
55284        __next40pxDefaultSize: __next40pxDefaultSize,
55285        __nextHasNoMarginBottom: __nextHasNoMarginBottom,
55286        className: dist_clsx(className, 'block-editor-dimension-control'),
55287        label: selectLabel,
55288        hideLabelFromVision: false,
55289        value: value,
55290        onChange: onChangeSpacingSize,
55291        options: formatSizesAsOptions(sizes)
55292      })
55293    });
55294  }
55295  /* harmony default export */ const dimension_control = (DimensionControl);
55296  
55297  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/disabled/styles/disabled-styles.js
55298  function disabled_styles_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)."; }
55299  /**
55300   * External dependencies
55301   */
55302  
55303  const disabled_styles_disabledStyles =  true ? {
55304    name: "u2jump",
55305    styles: "position:relative;pointer-events:none;&::after{content:'';position:absolute;top:0;right:0;bottom:0;left:0;}*{pointer-events:none;}"
55306  } : 0;
55307  
55308  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/disabled/index.js
55309  /**
55310   * WordPress dependencies
55311   */
55312  
55313  
55314  /**
55315   * Internal dependencies
55316   */
55317  
55318  
55319  
55320  const Context = (0,external_wp_element_namespaceObject.createContext)(false);
55321  const {
55322    Consumer,
55323    Provider: disabled_Provider
55324  } = Context;
55325  
55326  /**
55327   * `Disabled` is a component which disables descendant tabbable elements and
55328   * prevents pointer interaction.
55329   *
55330   * _Note: this component may not behave as expected in browsers that don't
55331   * support the `inert` HTML attribute. We recommend adding the official WICG
55332   * polyfill when using this component in your project._
55333   *
55334   * @see https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/inert
55335   *
55336   * ```jsx
55337   * import { Button, Disabled, TextControl } from '@wordpress/components';
55338   * import { useState } from '@wordpress/element';
55339   *
55340   * const MyDisabled = () => {
55341   *     const [ isDisabled, setIsDisabled ] = useState( true );
55342   *
55343   *     let input = <TextControl label="Input" onChange={ () => {} } />;
55344   *     if ( isDisabled ) {
55345   *         input = <Disabled>{ input }</Disabled>;
55346   *     }
55347   *
55348   *     const toggleDisabled = () => {
55349   *         setIsDisabled( ( state ) => ! state );
55350   *     };
55351   *
55352   *     return (
55353   *         <div>
55354   *             { input }
55355   *             <Button variant="primary" onClick={ toggleDisabled }>
55356   *                 Toggle Disabled
55357   *             </Button>
55358   *         </div>
55359   *     );
55360   * };
55361   * ```
55362   */
55363  function Disabled({
55364    className,
55365    children,
55366    isDisabled = true,
55367    ...props
55368  }) {
55369    const cx = useCx();
55370    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(disabled_Provider, {
55371      value: isDisabled,
55372      children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", {
55373        // @ts-ignore Reason: inert is a recent HTML attribute
55374        inert: isDisabled ? 'true' : undefined,
55375        className: isDisabled ? cx(disabled_styles_disabledStyles, className, 'components-disabled') : undefined,
55376        ...props,
55377        children: children
55378      })
55379    });
55380  }
55381  Disabled.Context = Context;
55382  Disabled.Consumer = Consumer;
55383  /* harmony default export */ const disabled = (Disabled);
55384  
55385  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/disclosure/index.js
55386  /**
55387   * External dependencies
55388   */
55389  
55390  
55391  /**
55392   * WordPress dependencies
55393   */
55394  
55395  
55396  /**
55397   * Internal dependencies
55398   */
55399  
55400  /**
55401   * Accessible Disclosure component that controls visibility of a section of
55402   * content. It follows the WAI-ARIA Disclosure Pattern.
55403   */
55404  const UnforwardedDisclosureContent = ({
55405    visible,
55406    children,
55407    ...props
55408  }, ref) => {
55409    const disclosure = useDisclosureStore({
55410      open: visible
55411    });
55412    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(DisclosureContent, {
55413      store: disclosure,
55414      ref: ref,
55415      ...props,
55416      children: children
55417    });
55418  };
55419  const disclosure_DisclosureContent = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedDisclosureContent);
55420  /* harmony default export */ const disclosure = ((/* unused pure expression or super */ null && (disclosure_DisclosureContent)));
55421  
55422  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/draggable/index.js
55423  /**
55424   * External dependencies
55425   */
55426  
55427  /**
55428   * WordPress dependencies
55429   */
55430  
55431  
55432  
55433  /**
55434   * Internal dependencies
55435   */
55436  
55437  
55438  
55439  const dragImageClass = 'components-draggable__invisible-drag-image';
55440  const cloneWrapperClass = 'components-draggable__clone';
55441  const clonePadding = 0;
55442  const bodyClass = 'is-dragging-components-draggable';
55443  
55444  /**
55445   * `Draggable` is a Component that provides a way to set up a cross-browser
55446   * (including IE) customizable drag image and the transfer data for the drag
55447   * event. It decouples the drag handle and the element to drag: use it by
55448   * wrapping the component that will become the drag handle and providing the DOM
55449   * ID of the element to drag.
55450   *
55451   * Note that the drag handle needs to declare the `draggable="true"` property
55452   * and bind the `Draggable`s `onDraggableStart` and `onDraggableEnd` event
55453   * handlers to its own `onDragStart` and `onDragEnd` respectively. `Draggable`
55454   * takes care of the logic to setup the drag image and the transfer data, but is
55455   * not concerned with creating an actual DOM element that is draggable.
55456   *
55457   * ```jsx
55458   * import { Draggable, Panel, PanelBody } from '@wordpress/components';
55459   * import { Icon, more } from '@wordpress/icons';
55460   *
55461   * const MyDraggable = () => (
55462   *   <div id="draggable-panel">
55463   *     <Panel header="Draggable panel">
55464   *       <PanelBody>
55465   *         <Draggable elementId="draggable-panel" transferData={ {} }>
55466   *           { ( { onDraggableStart, onDraggableEnd } ) => (
55467   *             <div
55468   *               className="example-drag-handle"
55469   *               draggable
55470   *               onDragStart={ onDraggableStart }
55471   *               onDragEnd={ onDraggableEnd }
55472   *             >
55473   *               <Icon icon={ more } />
55474   *             </div>
55475   *           ) }
55476   *         </Draggable>
55477   *       </PanelBody>
55478   *     </Panel>
55479   *   </div>
55480   * );
55481   * ```
55482   */
55483  function Draggable({
55484    children,
55485    onDragStart,
55486    onDragOver,
55487    onDragEnd,
55488    appendToOwnerDocument = false,
55489    cloneClassname,
55490    elementId,
55491    transferData,
55492    __experimentalTransferDataType: transferDataType = 'text',
55493    __experimentalDragComponent: dragComponent
55494  }) {
55495    const dragComponentRef = (0,external_wp_element_namespaceObject.useRef)(null);
55496    const cleanupRef = (0,external_wp_element_namespaceObject.useRef)(() => {});
55497  
55498    /**
55499     * Removes the element clone, resets cursor, and removes drag listener.
55500     *
55501     * @param event The non-custom DragEvent.
55502     */
55503    function end(event) {
55504      event.preventDefault();
55505      cleanupRef.current();
55506      if (onDragEnd) {
55507        onDragEnd(event);
55508      }
55509    }
55510  
55511    /**
55512     * This method does a couple of things:
55513     *
55514     * - Clones the current element and spawns clone over original element.
55515     * - Adds a fake temporary drag image to avoid browser defaults.
55516     * - Sets transfer data.
55517     * - Adds dragover listener.
55518     *
55519     * @param event The non-custom DragEvent.
55520     */
55521    function start(event) {
55522      const {
55523        ownerDocument
55524      } = event.target;
55525      event.dataTransfer.setData(transferDataType, JSON.stringify(transferData));
55526      const cloneWrapper = ownerDocument.createElement('div');
55527      // Reset position to 0,0. Natural stacking order will position this lower, even with a transform otherwise.
55528      cloneWrapper.style.top = '0';
55529      cloneWrapper.style.left = '0';
55530      const dragImage = ownerDocument.createElement('div');
55531  
55532      // Set a fake drag image to avoid browser defaults. Remove from DOM
55533      // right after. event.dataTransfer.setDragImage is not supported yet in
55534      // IE, we need to check for its existence first.
55535      if ('function' === typeof event.dataTransfer.setDragImage) {
55536        dragImage.classList.add(dragImageClass);
55537        ownerDocument.body.appendChild(dragImage);
55538        event.dataTransfer.setDragImage(dragImage, 0, 0);
55539      }
55540      cloneWrapper.classList.add(cloneWrapperClass);
55541      if (cloneClassname) {
55542        cloneWrapper.classList.add(cloneClassname);
55543      }
55544      let x = 0;
55545      let y = 0;
55546      // If a dragComponent is defined, the following logic will clone the
55547      // HTML node and inject it into the cloneWrapper.
55548      if (dragComponentRef.current) {
55549        // Position dragComponent at the same position as the cursor.
55550        x = event.clientX;
55551        y = event.clientY;
55552        cloneWrapper.style.transform = `translate( $x}px, $y}px )`;
55553        const clonedDragComponent = ownerDocument.createElement('div');
55554        clonedDragComponent.innerHTML = dragComponentRef.current.innerHTML;
55555        cloneWrapper.appendChild(clonedDragComponent);
55556  
55557        // Inject the cloneWrapper into the DOM.
55558        ownerDocument.body.appendChild(cloneWrapper);
55559      } else {
55560        const element = ownerDocument.getElementById(elementId);
55561  
55562        // Prepare element clone and append to element wrapper.
55563        const elementRect = element.getBoundingClientRect();
55564        const elementWrapper = element.parentNode;
55565        const elementTopOffset = elementRect.top;
55566        const elementLeftOffset = elementRect.left;
55567        cloneWrapper.style.width = `$elementRect.width + clonePadding * 2}px`;
55568        const clone = element.cloneNode(true);
55569        clone.id = `clone-$elementId}`;
55570  
55571        // Position clone right over the original element (20px padding).
55572        x = elementLeftOffset - clonePadding;
55573        y = elementTopOffset - clonePadding;
55574        cloneWrapper.style.transform = `translate( $x}px, $y}px )`;
55575  
55576        // Hack: Remove iFrames as it's causing the embeds drag clone to freeze.
55577        Array.from(clone.querySelectorAll('iframe')).forEach(child => child.parentNode?.removeChild(child));
55578        cloneWrapper.appendChild(clone);
55579  
55580        // Inject the cloneWrapper into the DOM.
55581        if (appendToOwnerDocument) {
55582          ownerDocument.body.appendChild(cloneWrapper);
55583        } else {
55584          elementWrapper?.appendChild(cloneWrapper);
55585        }
55586      }
55587  
55588      // Mark the current cursor coordinates.
55589      let cursorLeft = event.clientX;
55590      let cursorTop = event.clientY;
55591      function over(e) {
55592        // Skip doing any work if mouse has not moved.
55593        if (cursorLeft === e.clientX && cursorTop === e.clientY) {
55594          return;
55595        }
55596        const nextX = x + e.clientX - cursorLeft;
55597        const nextY = y + e.clientY - cursorTop;
55598        cloneWrapper.style.transform = `translate( $nextX}px, $nextY}px )`;
55599        cursorLeft = e.clientX;
55600        cursorTop = e.clientY;
55601        x = nextX;
55602        y = nextY;
55603        if (onDragOver) {
55604          onDragOver(e);
55605        }
55606      }
55607  
55608      // Aim for 60fps (16 ms per frame) for now. We can potentially use requestAnimationFrame (raf) instead,
55609      // note that browsers may throttle raf below 60fps in certain conditions.
55610      // @ts-ignore
55611      const throttledDragOver = (0,external_wp_compose_namespaceObject.throttle)(over, 16);
55612      ownerDocument.addEventListener('dragover', throttledDragOver);
55613  
55614      // Update cursor to 'grabbing', document wide.
55615      ownerDocument.body.classList.add(bodyClass);
55616      if (onDragStart) {
55617        onDragStart(event);
55618      }
55619      cleanupRef.current = () => {
55620        // Remove drag clone.
55621        if (cloneWrapper && cloneWrapper.parentNode) {
55622          cloneWrapper.parentNode.removeChild(cloneWrapper);
55623        }
55624        if (dragImage && dragImage.parentNode) {
55625          dragImage.parentNode.removeChild(dragImage);
55626        }
55627  
55628        // Reset cursor.
55629        ownerDocument.body.classList.remove(bodyClass);
55630        ownerDocument.removeEventListener('dragover', throttledDragOver);
55631      };
55632    }
55633    (0,external_wp_element_namespaceObject.useEffect)(() => () => {
55634      cleanupRef.current();
55635    }, []);
55636    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, {
55637      children: [children({
55638        onDraggableStart: start,
55639        onDraggableEnd: end
55640      }), dragComponent && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", {
55641        className: "components-draggable-drag-component-root",
55642        style: {
55643          display: 'none'
55644        },
55645        ref: dragComponentRef,
55646        children: dragComponent
55647      })]
55648    });
55649  }
55650  /* harmony default export */ const draggable = (Draggable);
55651  
55652  ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/upload.js
55653  /**
55654   * WordPress dependencies
55655   */
55656  
55657  
55658  const upload = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, {
55659    xmlns: "http://www.w3.org/2000/svg",
55660    viewBox: "0 0 24 24",
55661    children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, {
55662      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"
55663    })
55664  });
55665  /* harmony default export */ const library_upload = (upload);
55666  
55667  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/drop-zone/index.js
55668  /**
55669   * External dependencies
55670   */
55671  
55672  
55673  /**
55674   * WordPress dependencies
55675   */
55676  
55677  
55678  
55679  
55680  
55681  
55682  /**
55683   * Internal dependencies
55684   */
55685  
55686  
55687  /**
55688   * `DropZone` is a component creating a drop zone area taking the full size of its parent element. It supports dropping files, HTML content or any other HTML drop event.
55689   *
55690   * ```jsx
55691   * import { DropZone } from '@wordpress/components';
55692   * import { useState } from '@wordpress/element';
55693   *
55694   * const MyDropZone = () => {
55695   *   const [ hasDropped, setHasDropped ] = useState( false );
55696   *
55697   *   return (
55698   *     <div>
55699   *       { hasDropped ? 'Dropped!' : 'Drop something here' }
55700   *       <DropZone
55701   *         onFilesDrop={ () => setHasDropped( true ) }
55702   *         onHTMLDrop={ () => setHasDropped( true ) }
55703   *         onDrop={ () => setHasDropped( true ) }
55704   *       />
55705   *     </div>
55706   *   );
55707   * }
55708   * ```
55709   */
55710  function DropZoneComponent({
55711    className,
55712    label,
55713    onFilesDrop,
55714    onHTMLDrop,
55715    onDrop,
55716    ...restProps
55717  }) {
55718    const [isDraggingOverDocument, setIsDraggingOverDocument] = (0,external_wp_element_namespaceObject.useState)();
55719    const [isDraggingOverElement, setIsDraggingOverElement] = (0,external_wp_element_namespaceObject.useState)();
55720    const [type, setType] = (0,external_wp_element_namespaceObject.useState)();
55721    const ref = (0,external_wp_compose_namespaceObject.__experimentalUseDropZone)({
55722      onDrop(event) {
55723        const files = event.dataTransfer ? (0,external_wp_dom_namespaceObject.getFilesFromDataTransfer)(event.dataTransfer) : [];
55724        const html = event.dataTransfer?.getData('text/html');
55725  
55726        /**
55727         * From Windows Chrome 96, the `event.dataTransfer` returns both file object and HTML.
55728         * The order of the checks is important to recognize the HTML drop.
55729         */
55730        if (html && onHTMLDrop) {
55731          onHTMLDrop(html);
55732        } else if (files.length && onFilesDrop) {
55733          onFilesDrop(files);
55734        } else if (onDrop) {
55735          onDrop(event);
55736        }
55737      },
55738      onDragStart(event) {
55739        setIsDraggingOverDocument(true);
55740        let _type = 'default';
55741  
55742        /**
55743         * From Windows Chrome 96, the `event.dataTransfer` returns both file object and HTML.
55744         * The order of the checks is important to recognize the HTML drop.
55745         */
55746        if (event.dataTransfer?.types.includes('text/html')) {
55747          _type = 'html';
55748        } else if (
55749        // Check for the types because sometimes the files themselves
55750        // are only available on drop.
55751        event.dataTransfer?.types.includes('Files') || (event.dataTransfer ? (0,external_wp_dom_namespaceObject.getFilesFromDataTransfer)(event.dataTransfer) : []).length > 0) {
55752          _type = 'file';
55753        }
55754        setType(_type);
55755      },
55756      onDragEnd() {
55757        setIsDraggingOverElement(false);
55758        setIsDraggingOverDocument(false);
55759        setType(undefined);
55760      },
55761      onDragEnter() {
55762        setIsDraggingOverElement(true);
55763      },
55764      onDragLeave() {
55765        setIsDraggingOverElement(false);
55766      }
55767    });
55768    const classes = dist_clsx('components-drop-zone', className, {
55769      'is-active': (isDraggingOverDocument || isDraggingOverElement) && (type === 'file' && onFilesDrop || type === 'html' && onHTMLDrop || type === 'default' && onDrop),
55770      'is-dragging-over-document': isDraggingOverDocument,
55771      'is-dragging-over-element': isDraggingOverElement,
55772      [`is-dragging-$type}`]: !!type
55773    });
55774    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", {
55775      ...restProps,
55776      ref: ref,
55777      className: classes,
55778      children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", {
55779        className: "components-drop-zone__content",
55780        children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", {
55781          className: "components-drop-zone__content-inner",
55782          children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(icons_build_module_icon, {
55783            icon: library_upload,
55784            className: "components-drop-zone__content-icon"
55785          }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", {
55786            className: "components-drop-zone__content-text",
55787            children: label ? label : (0,external_wp_i18n_namespaceObject.__)('Drop files to upload')
55788          })]
55789        })
55790      })
55791    });
55792  }
55793  /* harmony default export */ const drop_zone = (DropZoneComponent);
55794  
55795  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/drop-zone/provider.js
55796  /**
55797   * WordPress dependencies
55798   */
55799  
55800  function DropZoneProvider({
55801    children
55802  }) {
55803    external_wp_deprecated_default()('wp.components.DropZoneProvider', {
55804      since: '5.8',
55805      hint: 'wp.component.DropZone no longer needs a provider. wp.components.DropZoneProvider is safe to remove from your code.'
55806    });
55807    return children;
55808  }
55809  
55810  ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/swatch.js
55811  /**
55812   * WordPress dependencies
55813   */
55814  
55815  
55816  const swatch = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, {
55817    xmlns: "http://www.w3.org/2000/svg",
55818    viewBox: "0 0 24 24",
55819    children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, {
55820      d: "M5 17.7c.4.5.8.9 1.2 1.2l1.1-1.4c-.4-.3-.7-.6-1-1L5 17.7zM5 6.3l1.4 1.1c.3-.4.6-.7 1-1L6.3 5c-.5.4-.9.8-1.3 1.3zm.1 7.8l-1.7.5c.2.6.4 1.1.7 1.6l1.5-.8c-.2-.4-.4-.8-.5-1.3zM4.8 12v-.7L3 11.1v1.8l1.7-.2c.1-.2.1-.5.1-.7zm3 7.9c.5.3 1.1.5 1.6.7l.5-1.7c-.5-.1-.9-.3-1.3-.5l-.8 1.5zM19 6.3c-.4-.5-.8-.9-1.2-1.2l-1.1 1.4c.4.3.7.6 1 1L19 6.3zm-.1 3.6l1.7-.5c-.2-.6-.4-1.1-.7-1.6l-1.5.8c.2.4.4.8.5 1.3zM5.6 8.6l-1.5-.8c-.3.5-.5 1-.7 1.6l1.7.5c.1-.5.3-.9.5-1.3zm2.2-4.5l.8 1.5c.4-.2.8-.4 1.3-.5l-.5-1.7c-.6.2-1.1.4-1.6.7zm8.8 13.5l1.1 1.4c.5-.4.9-.8 1.2-1.2l-1.4-1.1c-.2.3-.5.6-.9.9zm1.8-2.2l1.5.8c.3-.5.5-1.1.7-1.6l-1.7-.5c-.1.5-.3.9-.5 1.3zm2.6-4.3l-1.7.2v1.4l1.7.2V12v-.9zM11.1 3l.2 1.7h1.4l.2-1.7h-1.8zm3 2.1c.5.1.9.3 1.3.5l.8-1.5c-.5-.3-1.1-.5-1.6-.7l-.5 1.7zM12 19.2h-.7l-.2 1.8h1.8l-.2-1.7c-.2-.1-.5-.1-.7-.1zm2.1-.3l.5 1.7c.6-.2 1.1-.4 1.6-.7l-.8-1.5c-.4.2-.8.4-1.3.5z"
55821    })
55822  });
55823  /* harmony default export */ const library_swatch = (swatch);
55824  
55825  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/duotone-picker/utils.js
55826  /**
55827   * External dependencies
55828   */
55829  
55830  
55831  
55832  /**
55833   * Internal dependencies
55834   */
55835  
55836  k([names]);
55837  
55838  /**
55839   * Object representation for a color.
55840   *
55841   * @typedef {Object} RGBColor
55842   * @property {number} r Red component of the color in the range [0,1].
55843   * @property {number} g Green component of the color in the range [0,1].
55844   * @property {number} b Blue component of the color in the range [0,1].
55845   */
55846  
55847  /**
55848   * Calculate the brightest and darkest values from a color palette.
55849   *
55850   * @param palette Color palette for the theme.
55851   *
55852   * @return Tuple of the darkest color and brightest color.
55853   */
55854  function getDefaultColors(palette) {
55855    // A default dark and light color are required.
55856    if (!palette || palette.length < 2) {
55857      return ['#000', '#fff'];
55858    }
55859    return palette.map(({
55860      color
55861    }) => ({
55862      color,
55863      brightness: w(color).brightness()
55864    })).reduce(([min, max], current) => {
55865      return [current.brightness <= min.brightness ? current : min, current.brightness >= max.brightness ? current : max];
55866    }, [{
55867      brightness: 1,
55868      color: ''
55869    }, {
55870      brightness: 0,
55871      color: ''
55872    }]).map(({
55873      color
55874    }) => color);
55875  }
55876  
55877  /**
55878   * Generate a duotone gradient from a list of colors.
55879   *
55880   * @param colors CSS color strings.
55881   * @param angle  CSS gradient angle.
55882   *
55883   * @return  CSS gradient string for the duotone swatch.
55884   */
55885  function getGradientFromCSSColors(colors = [], angle = '90deg') {
55886    const l = 100 / colors.length;
55887    const stops = colors.map((c, i) => `$c} $i * l}%, $c} ${(i + 1) * l}%`).join(', ');
55888    return `linear-gradient( $angle}, $stops} )`;
55889  }
55890  
55891  /**
55892   * Convert a color array to an array of color stops.
55893   *
55894   * @param colors CSS colors array
55895   *
55896   * @return Color stop information.
55897   */
55898  function getColorStopsFromColors(colors) {
55899    return colors.map((color, i) => ({
55900      position: i * 100 / (colors.length - 1),
55901      color
55902    }));
55903  }
55904  
55905  /**
55906   * Convert a color stop array to an array colors.
55907   *
55908   * @param colorStops Color stop information.
55909   *
55910   * @return CSS colors array.
55911   */
55912  function getColorsFromColorStops(colorStops = []) {
55913    return colorStops.map(({
55914      color
55915    }) => color);
55916  }
55917  
55918  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/duotone-picker/duotone-swatch.js
55919  /**
55920   * WordPress dependencies
55921   */
55922  
55923  
55924  /**
55925   * Internal dependencies
55926   */
55927  
55928  
55929  
55930  
55931  function DuotoneSwatch({
55932    values
55933  }) {
55934    return values ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(color_indicator, {
55935      colorValue: getGradientFromCSSColors(values, '135deg')
55936    }) : /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_icon, {
55937      icon: library_swatch
55938    });
55939  }
55940  /* harmony default export */ const duotone_swatch = (DuotoneSwatch);
55941  
55942  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/duotone-picker/color-list-picker/index.js
55943  /**
55944   * WordPress dependencies
55945   */
55946  
55947  
55948  
55949  
55950  /**
55951   * Internal dependencies
55952   */
55953  
55954  
55955  
55956  
55957  
55958  
55959  
55960  
55961  
55962  function ColorOption({
55963    label,
55964    value,
55965    colors,
55966    disableCustomColors,
55967    enableAlpha,
55968    onChange
55969  }) {
55970    const [isOpen, setIsOpen] = (0,external_wp_element_namespaceObject.useState)(false);
55971    const idRoot = (0,external_wp_compose_namespaceObject.useInstanceId)(ColorOption, 'color-list-picker-option');
55972    const labelId = `$idRoot}__label`;
55973    const contentId = `$idRoot}__content`;
55974    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, {
55975      children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, {
55976        className: "components-color-list-picker__swatch-button",
55977        onClick: () => setIsOpen(prev => !prev),
55978        "aria-expanded": isOpen,
55979        "aria-controls": contentId,
55980        children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(h_stack_component, {
55981          justify: "flex-start",
55982          spacing: 2,
55983          children: [value ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(color_indicator, {
55984            colorValue: value,
55985            className: "components-color-list-picker__swatch-color"
55986          }) : /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_icon, {
55987            icon: library_swatch
55988          }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", {
55989            id: labelId,
55990            children: label
55991          })]
55992        })
55993      }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", {
55994        role: "group",
55995        id: contentId,
55996        "aria-labelledby": labelId,
55997        "aria-hidden": !isOpen,
55998        children: isOpen && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(color_palette, {
55999          "aria-label": (0,external_wp_i18n_namespaceObject.__)('Color options'),
56000          className: "components-color-list-picker__color-picker",
56001          colors: colors,
56002          value: value,
56003          clearable: false,
56004          onChange: onChange,
56005          disableCustomColors: disableCustomColors,
56006          enableAlpha: enableAlpha
56007        })
56008      })]
56009    });
56010  }
56011  function ColorListPicker({
56012    colors,
56013    labels,
56014    value = [],
56015    disableCustomColors,
56016    enableAlpha,
56017    onChange
56018  }) {
56019    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", {
56020      className: "components-color-list-picker",
56021      children: labels.map((label, index) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ColorOption, {
56022        label: label,
56023        value: value[index],
56024        colors: colors,
56025        disableCustomColors: disableCustomColors,
56026        enableAlpha: enableAlpha,
56027        onChange: newColor => {
56028          const newColors = value.slice();
56029          newColors[index] = newColor;
56030          onChange(newColors);
56031        }
56032      }, index))
56033    });
56034  }
56035  /* harmony default export */ const color_list_picker = (ColorListPicker);
56036  
56037  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/duotone-picker/custom-duotone-bar.js
56038  /**
56039   * Internal dependencies
56040   */
56041  
56042  
56043  
56044  const PLACEHOLDER_VALUES = ['#333', '#CCC'];
56045  function CustomDuotoneBar({
56046    value,
56047    onChange
56048  }) {
56049    const hasGradient = !!value;
56050    const values = hasGradient ? value : PLACEHOLDER_VALUES;
56051    const background = getGradientFromCSSColors(values);
56052    const controlPoints = getColorStopsFromColors(values);
56053    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(CustomGradientBar, {
56054      disableInserter: true,
56055      background: background,
56056      hasGradient: hasGradient,
56057      value: controlPoints,
56058      onChange: newColorStops => {
56059        const newValue = getColorsFromColorStops(newColorStops);
56060        onChange(newValue);
56061      }
56062    });
56063  }
56064  
56065  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/duotone-picker/duotone-picker.js
56066  /**
56067   * External dependencies
56068   */
56069  
56070  
56071  /**
56072   * WordPress dependencies
56073   */
56074  
56075  
56076  
56077  /**
56078   * Internal dependencies
56079   */
56080  
56081  
56082  
56083  
56084  
56085  
56086  
56087  
56088  /**
56089   * ```jsx
56090   * import { DuotonePicker, DuotoneSwatch } from '@wordpress/components';
56091   * import { useState } from '@wordpress/element';
56092   *
56093   * const DUOTONE_PALETTE = [
56094   *     { colors: [ '#8c00b7', '#fcff41' ], name: 'Purple and yellow', slug: 'purple-yellow' },
56095   *     { colors: [ '#000097', '#ff4747' ], name: 'Blue and red', slug: 'blue-red' },
56096   * ];
56097   *
56098   * const COLOR_PALETTE = [
56099   *     { color: '#ff4747', name: 'Red', slug: 'red' },
56100   *     { color: '#fcff41', name: 'Yellow', slug: 'yellow' },
56101   *     { color: '#000097', name: 'Blue', slug: 'blue' },
56102   *     { color: '#8c00b7', name: 'Purple', slug: 'purple' },
56103   * ];
56104   *
56105   * const Example = () => {
56106   *     const [ duotone, setDuotone ] = useState( [ '#000000', '#ffffff' ] );
56107   *     return (
56108   *         <>
56109   *             <DuotonePicker
56110   *                 duotonePalette={ DUOTONE_PALETTE }
56111   *                 colorPalette={ COLOR_PALETTE }
56112   *                 value={ duotone }
56113   *                 onChange={ setDuotone }
56114   *             />
56115   *             <DuotoneSwatch values={ duotone } />
56116   *         </>
56117   *     );
56118   * };
56119   * ```
56120   */
56121  function DuotonePicker({
56122    asButtons,
56123    loop,
56124    clearable = true,
56125    unsetable = true,
56126    colorPalette,
56127    duotonePalette,
56128    disableCustomColors,
56129    disableCustomDuotone,
56130    value,
56131    onChange,
56132    'aria-label': ariaLabel,
56133    'aria-labelledby': ariaLabelledby,
56134    ...otherProps
56135  }) {
56136    const [defaultDark, defaultLight] = (0,external_wp_element_namespaceObject.useMemo)(() => getDefaultColors(colorPalette), [colorPalette]);
56137    const isUnset = value === 'unset';
56138    const unsetOptionLabel = (0,external_wp_i18n_namespaceObject.__)('Unset');
56139    const unsetOption = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_circular_option_picker.Option, {
56140      value: "unset",
56141      isSelected: isUnset,
56142      tooltipText: unsetOptionLabel,
56143      "aria-label": unsetOptionLabel,
56144      className: "components-duotone-picker__color-indicator",
56145      onClick: () => {
56146        onChange(isUnset ? undefined : 'unset');
56147      }
56148    }, "unset");
56149    const duotoneOptions = duotonePalette.map(({
56150      colors,
56151      slug,
56152      name
56153    }) => {
56154      const style = {
56155        background: getGradientFromCSSColors(colors, '135deg'),
56156        color: 'transparent'
56157      };
56158      const tooltipText = name !== null && name !== void 0 ? name : (0,external_wp_i18n_namespaceObject.sprintf)(
56159      // translators: %s: duotone code e.g: "dark-grayscale" or "7f7f7f-ffffff".
56160      (0,external_wp_i18n_namespaceObject.__)('Duotone code: %s'), slug);
56161      const label = name ? (0,external_wp_i18n_namespaceObject.sprintf)(
56162      // translators: %s: The name of the option e.g: "Dark grayscale".
56163      (0,external_wp_i18n_namespaceObject.__)('Duotone: %s'), name) : tooltipText;
56164      const isSelected = es6_default()(colors, value);
56165      return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_circular_option_picker.Option, {
56166        value: colors,
56167        isSelected: isSelected,
56168        "aria-label": label,
56169        tooltipText: tooltipText,
56170        style: style,
56171        onClick: () => {
56172          onChange(isSelected ? undefined : colors);
56173        }
56174      }, slug);
56175    });
56176    let metaProps;
56177    if (asButtons) {
56178      metaProps = {
56179        asButtons: true
56180      };
56181    } else {
56182      const _metaProps = {
56183        asButtons: false,
56184        loop
56185      };
56186      if (ariaLabel) {
56187        metaProps = {
56188          ..._metaProps,
56189          'aria-label': ariaLabel
56190        };
56191      } else if (ariaLabelledby) {
56192        metaProps = {
56193          ..._metaProps,
56194          'aria-labelledby': ariaLabelledby
56195        };
56196      } else {
56197        metaProps = {
56198          ..._metaProps,
56199          'aria-label': (0,external_wp_i18n_namespaceObject.__)('Custom color picker.')
56200        };
56201      }
56202    }
56203    const options = unsetable ? [unsetOption, ...duotoneOptions] : duotoneOptions;
56204    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_circular_option_picker, {
56205      ...otherProps,
56206      ...metaProps,
56207      options: options,
56208      actions: !!clearable && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_circular_option_picker.ButtonAction, {
56209        onClick: () => onChange(undefined),
56210        children: (0,external_wp_i18n_namespaceObject.__)('Clear')
56211      }),
56212      children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(spacer_component, {
56213        paddingTop: options.length === 0 ? 0 : 4,
56214        children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(v_stack_component, {
56215          spacing: 3,
56216          children: [!disableCustomColors && !disableCustomDuotone && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(CustomDuotoneBar, {
56217            value: isUnset ? undefined : value,
56218            onChange: onChange
56219          }), !disableCustomDuotone && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(color_list_picker, {
56220            labels: [(0,external_wp_i18n_namespaceObject.__)('Shadows'), (0,external_wp_i18n_namespaceObject.__)('Highlights')],
56221            colors: colorPalette,
56222            value: isUnset ? undefined : value,
56223            disableCustomColors: disableCustomColors,
56224            enableAlpha: true,
56225            onChange: newColors => {
56226              if (!newColors[0]) {
56227                newColors[0] = defaultDark;
56228              }
56229              if (!newColors[1]) {
56230                newColors[1] = defaultLight;
56231              }
56232              const newValue = newColors.length >= 2 ? newColors : undefined;
56233              // @ts-expect-error TODO: The color arrays for a DuotonePicker should be a tuple of two colors,
56234              // but it's currently typed as a string[].
56235              // See also https://github.com/WordPress/gutenberg/pull/49060#discussion_r1136951035
56236              onChange(newValue);
56237            }
56238          })]
56239        })
56240      })
56241    });
56242  }
56243  /* harmony default export */ const duotone_picker = (DuotonePicker);
56244  
56245  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/external-link/index.js
56246  /**
56247   * External dependencies
56248   */
56249  
56250  /**
56251   * WordPress dependencies
56252   */
56253  
56254  
56255  
56256  /**
56257   * Internal dependencies
56258   */
56259  
56260  
56261  function UnforwardedExternalLink(props, ref) {
56262    const {
56263      href,
56264      children,
56265      className,
56266      rel = '',
56267      ...additionalProps
56268    } = props;
56269    const optimizedRel = [...new Set([...rel.split(' '), 'external', 'noreferrer', 'noopener'].filter(Boolean))].join(' ');
56270    const classes = dist_clsx('components-external-link', className);
56271    /* Anchor links are perceived as external links.
56272    This constant helps check for on page anchor links,
56273    to prevent them from being opened in the editor. */
56274    const isInternalAnchor = !!href?.startsWith('#');
56275    const onClickHandler = event => {
56276      if (isInternalAnchor) {
56277        event.preventDefault();
56278      }
56279      if (props.onClick) {
56280        props.onClick(event);
56281      }
56282    };
56283    return (
56284      /*#__PURE__*/
56285      /* eslint-disable react/jsx-no-target-blank */
56286      (0,external_ReactJSXRuntime_namespaceObject.jsxs)("a", {
56287        ...additionalProps,
56288        className: classes,
56289        href: href,
56290        onClick: onClickHandler,
56291        target: "_blank",
56292        rel: optimizedRel,
56293        ref: ref,
56294        children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", {
56295          className: "components-external-link__contents",
56296          children: children
56297        }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", {
56298          className: "components-external-link__icon",
56299          "aria-label": /* translators: accessibility text */
56300          (0,external_wp_i18n_namespaceObject.__)('(opens in a new tab)'),
56301          children: "\u2197"
56302        })]
56303      })
56304      /* eslint-enable react/jsx-no-target-blank */
56305    );
56306  }
56307  
56308  /**
56309   * Link to an external resource.
56310   *
56311   * ```jsx
56312   * import { ExternalLink } from '@wordpress/components';
56313   *
56314   * const MyExternalLink = () => (
56315   *   <ExternalLink href="https://wordpress.org">WordPress.org</ExternalLink>
56316   * );
56317   * ```
56318   */
56319  const ExternalLink = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedExternalLink);
56320  /* harmony default export */ const external_link = (ExternalLink);
56321  
56322  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/focal-point-picker/utils.js
56323  const INITIAL_BOUNDS = {
56324    width: 200,
56325    height: 170
56326  };
56327  const VIDEO_EXTENSIONS = ['avi', 'mpg', 'mpeg', 'mov', 'mp4', 'm4v', 'ogg', 'ogv', 'webm', 'wmv'];
56328  
56329  /**
56330   * Gets the extension of a file name.
56331   *
56332   * @param filename The file name.
56333   * @return  The extension of the file name.
56334   */
56335  function getExtension(filename = '') {
56336    const parts = filename.split('.');
56337    return parts[parts.length - 1];
56338  }
56339  
56340  /**
56341   * Checks if a file is a video.
56342   *
56343   * @param filename The file name.
56344   * @return Whether the file is a video.
56345   */
56346  function isVideoType(filename = '') {
56347    if (!filename) {
56348      return false;
56349    }
56350    return filename.startsWith('data:video/') || VIDEO_EXTENSIONS.includes(getExtension(filename));
56351  }
56352  
56353  /**
56354   * Transforms a fraction value to a percentage value.
56355   *
56356   * @param fraction The fraction value.
56357   * @return A percentage value.
56358   */
56359  function fractionToPercentage(fraction) {
56360    return Math.round(fraction * 100);
56361  }
56362  
56363  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/focal-point-picker/styles/focal-point-picker-style.js
56364  
56365  function focal_point_picker_style_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)."; }
56366  /**
56367   * External dependencies
56368   */
56369  
56370  /**
56371   * Internal dependencies
56372   */
56373  
56374  
56375  
56376  
56377  const MediaWrapper = /*#__PURE__*/emotion_styled_base_browser_esm("div",  true ? {
56378    target: "eeew7dm8"
56379  } : 0)( true ? {
56380    name: "jqnsxy",
56381    styles: "background-color:transparent;display:flex;text-align:center;width:100%"
56382  } : 0);
56383  const MediaContainer = /*#__PURE__*/emotion_styled_base_browser_esm("div",  true ? {
56384    target: "eeew7dm7"
56385  } : 0)("align-items:center;border-radius:", config_values.radiusSmall, ";cursor:pointer;display:inline-flex;justify-content:center;margin:auto;position:relative;height:100%;&:after{border-radius:inherit;bottom:0;box-shadow:inset 0 0 0 1px rgba( 0, 0, 0, 0.1 );content:'';left:0;pointer-events:none;position:absolute;right:0;top:0;}img,video{border-radius:inherit;box-sizing:border-box;display:block;height:auto;margin:0;max-height:100%;max-width:100%;pointer-events:none;user-select:none;width:auto;}" + ( true ? "" : 0));
56386  const MediaPlaceholder = /*#__PURE__*/emotion_styled_base_browser_esm("div",  true ? {
56387    target: "eeew7dm6"
56388  } : 0)("background:", COLORS.gray[100], ";border-radius:inherit;box-sizing:border-box;height:", INITIAL_BOUNDS.height, "px;max-width:280px;min-width:", INITIAL_BOUNDS.width, "px;width:100%;" + ( true ? "" : 0));
56389  const focal_point_picker_style_StyledUnitControl = /*#__PURE__*/emotion_styled_base_browser_esm(unit_control,  true ? {
56390    target: "eeew7dm5"
56391  } : 0)( true ? {
56392    name: "1d3w5wq",
56393    styles: "width:100%"
56394  } : 0);
56395  var focal_point_picker_style_ref2 =  true ? {
56396    name: "1mn7kwb",
56397    styles: "padding-bottom:1em"
56398  } : 0;
56399  const deprecatedBottomMargin = ({
56400    __nextHasNoMarginBottom
56401  }) => {
56402    return !__nextHasNoMarginBottom ? focal_point_picker_style_ref2 : undefined;
56403  };
56404  var focal_point_picker_style_ref =  true ? {
56405    name: "1mn7kwb",
56406    styles: "padding-bottom:1em"
56407  } : 0;
56408  const extraHelpTextMargin = ({
56409    hasHelpText = false
56410  }) => {
56411    return hasHelpText ? focal_point_picker_style_ref : undefined;
56412  };
56413  const ControlWrapper = /*#__PURE__*/emotion_styled_base_browser_esm(flex_component,  true ? {
56414    target: "eeew7dm4"
56415  } : 0)("max-width:320px;padding-top:1em;", extraHelpTextMargin, " ", deprecatedBottomMargin, ";" + ( true ? "" : 0));
56416  const GridView = /*#__PURE__*/emotion_styled_base_browser_esm("div",  true ? {
56417    target: "eeew7dm3"
56418  } : 0)("left:50%;overflow:hidden;pointer-events:none;position:absolute;top:50%;transform:translate3d( -50%, -50%, 0 );z-index:1;@media not ( prefers-reduced-motion ){transition:opacity 100ms linear;}opacity:", ({
56419    showOverlay
56420  }) => showOverlay ? 1 : 0, ";" + ( true ? "" : 0));
56421  const GridLine = /*#__PURE__*/emotion_styled_base_browser_esm("div",  true ? {
56422    target: "eeew7dm2"
56423  } : 0)( true ? {
56424    name: "1yzbo24",
56425    styles: "background:rgba( 255, 255, 255, 0.4 );backdrop-filter:blur( 16px ) saturate( 180% );position:absolute;transform:translateZ( 0 )"
56426  } : 0);
56427  const GridLineX = /*#__PURE__*/emotion_styled_base_browser_esm(GridLine,  true ? {
56428    target: "eeew7dm1"
56429  } : 0)( true ? {
56430    name: "1sw8ur",
56431    styles: "height:1px;left:1px;right:1px"
56432  } : 0);
56433  const GridLineY = /*#__PURE__*/emotion_styled_base_browser_esm(GridLine,  true ? {
56434    target: "eeew7dm0"
56435  } : 0)( true ? {
56436    name: "188vg4t",
56437    styles: "width:1px;top:1px;bottom:1px"
56438  } : 0);
56439  
56440  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/focal-point-picker/controls.js
56441  /**
56442   * WordPress dependencies
56443   */
56444  
56445  
56446  /**
56447   * Internal dependencies
56448   */
56449  
56450  
56451  
56452  
56453  const TEXTCONTROL_MIN = 0;
56454  const TEXTCONTROL_MAX = 100;
56455  const controls_noop = () => {};
56456  function FocalPointPickerControls({
56457    __nextHasNoMarginBottom,
56458    hasHelpText,
56459    onChange = controls_noop,
56460    point = {
56461      x: 0.5,
56462      y: 0.5
56463    }
56464  }) {
56465    const valueX = fractionToPercentage(point.x);
56466    const valueY = fractionToPercentage(point.y);
56467    const handleChange = (value, axis) => {
56468      if (value === undefined) {
56469        return;
56470      }
56471      const num = parseInt(value, 10);
56472      if (!isNaN(num)) {
56473        onChange({
56474          ...point,
56475          [axis]: num / 100
56476        });
56477      }
56478    };
56479    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(ControlWrapper, {
56480      className: "focal-point-picker__controls",
56481      __nextHasNoMarginBottom: __nextHasNoMarginBottom,
56482      hasHelpText: hasHelpText,
56483      gap: 4,
56484      children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(FocalPointUnitControl, {
56485        label: (0,external_wp_i18n_namespaceObject.__)('Left'),
56486        "aria-label": (0,external_wp_i18n_namespaceObject.__)('Focal point left position'),
56487        value: [valueX, '%'].join(''),
56488        onChange: next => handleChange(next, 'x'),
56489        dragDirection: "e"
56490      }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(FocalPointUnitControl, {
56491        label: (0,external_wp_i18n_namespaceObject.__)('Top'),
56492        "aria-label": (0,external_wp_i18n_namespaceObject.__)('Focal point top position'),
56493        value: [valueY, '%'].join(''),
56494        onChange: next => handleChange(next, 'y'),
56495        dragDirection: "s"
56496      })]
56497    });
56498  }
56499  function FocalPointUnitControl(props) {
56500    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(focal_point_picker_style_StyledUnitControl, {
56501      __next40pxDefaultSize: true,
56502      className: "focal-point-picker__controls-position-unit-control",
56503      labelPosition: "top",
56504      max: TEXTCONTROL_MAX,
56505      min: TEXTCONTROL_MIN,
56506      units: [{
56507        value: '%',
56508        label: '%'
56509      }],
56510      ...props
56511    });
56512  }
56513  
56514  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/focal-point-picker/styles/focal-point-style.js
56515  
56516  /**
56517   * External dependencies
56518   */
56519  
56520  /**
56521   * Internal dependencies
56522   */
56523  
56524  const PointerCircle = /*#__PURE__*/emotion_styled_base_browser_esm("div",  true ? {
56525    target: "e19snlhg0"
56526  } : 0)("background-color:transparent;cursor:grab;height:40px;margin:-20px 0 0 -20px;position:absolute;user-select:none;width:40px;will-change:transform;z-index:10000;background:rgba( 255, 255, 255, 0.4 );border:1px solid rgba( 255, 255, 255, 0.4 );border-radius:", config_values.radiusRound, ";backdrop-filter:blur( 16px ) saturate( 180% );box-shadow:rgb( 0 0 0 / 10% ) 0px 0px 8px;@media not ( prefers-reduced-motion ){transition:transform 100ms linear;}", ({
56527    isDragging
56528  }) => isDragging && `
56529              box-shadow: rgb( 0 0 0 / 12% ) 0px 0px 10px;
56530              transform: scale( 1.1 );
56531              cursor: grabbing;
56532              `, ";" + ( true ? "" : 0));
56533  
56534  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/focal-point-picker/focal-point.js
56535  /**
56536   * Internal dependencies
56537   */
56538  
56539  
56540  /**
56541   * External dependencies
56542   */
56543  
56544  function FocalPoint({
56545    left = '50%',
56546    top = '50%',
56547    ...props
56548  }) {
56549    const style = {
56550      left,
56551      top
56552    };
56553    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(PointerCircle, {
56554      ...props,
56555      className: "components-focal-point-picker__icon_container",
56556      style: style
56557    });
56558  }
56559  
56560  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/focal-point-picker/grid.js
56561  /**
56562   * Internal dependencies
56563   */
56564  
56565  
56566  
56567  function FocalPointPickerGrid({
56568    bounds,
56569    ...props
56570  }) {
56571    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(GridView, {
56572      ...props,
56573      className: "components-focal-point-picker__grid",
56574      style: {
56575        width: bounds.width,
56576        height: bounds.height
56577      },
56578      children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(GridLineX, {
56579        style: {
56580          top: '33%'
56581        }
56582      }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(GridLineX, {
56583        style: {
56584          top: '66%'
56585        }
56586      }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(GridLineY, {
56587        style: {
56588          left: '33%'
56589        }
56590      }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(GridLineY, {
56591        style: {
56592          left: '66%'
56593        }
56594      })]
56595    });
56596  }
56597  
56598  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/focal-point-picker/media.js
56599  /**
56600   * External dependencies
56601   */
56602  
56603  /**
56604   * Internal dependencies
56605   */
56606  
56607  
56608  
56609  function media_Media({
56610    alt,
56611    autoPlay,
56612    src,
56613    onLoad,
56614    mediaRef,
56615    // Exposing muted prop for test rendering purposes
56616    // https://github.com/testing-library/react-testing-library/issues/470
56617    muted = true,
56618    ...props
56619  }) {
56620    if (!src) {
56621      return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(MediaPlaceholder, {
56622        className: "components-focal-point-picker__media components-focal-point-picker__media--placeholder",
56623        ref: mediaRef,
56624        ...props
56625      });
56626    }
56627    const isVideo = isVideoType(src);
56628    return isVideo ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("video", {
56629      ...props,
56630      autoPlay: autoPlay,
56631      className: "components-focal-point-picker__media components-focal-point-picker__media--video",
56632      loop: true,
56633      muted: muted,
56634      onLoadedData: onLoad,
56635      ref: mediaRef,
56636      src: src
56637    }) : /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("img", {
56638      ...props,
56639      alt: alt,
56640      className: "components-focal-point-picker__media components-focal-point-picker__media--image",
56641      onLoad: onLoad,
56642      ref: mediaRef,
56643      src: src
56644    });
56645  }
56646  
56647  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/focal-point-picker/index.js
56648  /**
56649   * External dependencies
56650   */
56651  
56652  
56653  /**
56654   * WordPress dependencies
56655   */
56656  
56657  
56658  
56659  
56660  /**
56661   * Internal dependencies
56662   */
56663  
56664  
56665  
56666  
56667  
56668  
56669  
56670  
56671  
56672  
56673  const GRID_OVERLAY_TIMEOUT = 600;
56674  
56675  /**
56676   * Focal Point Picker is a component which creates a UI for identifying the most important visual point of an image.
56677   *
56678   * This component addresses a specific problem: with large background images it is common to see undesirable crops,
56679   * especially when viewing on smaller viewports such as mobile phones. This component allows the selection of
56680   * the point with the most important visual information and returns it as a pair of numbers between 0 and 1.
56681   * This value can be easily converted into the CSS `background-position` attribute, and will ensure that the
56682   * focal point is never cropped out, regardless of viewport.
56683   *
56684   * - Example focal point picker value: `{ x: 0.5, y: 0.1 }`
56685   * - Corresponding CSS: `background-position: 50% 10%;`
56686   *
56687   * ```jsx
56688   * import { FocalPointPicker } from '@wordpress/components';
56689   * import { useState } from '@wordpress/element';
56690   *
56691   * const Example = () => {
56692   *     const [ focalPoint, setFocalPoint ] = useState( {
56693   *         x: 0.5,
56694   *         y: 0.5,
56695   *     } );
56696   *
56697   *     const url = '/path/to/image';
56698   *
56699   *     // Example function to render the CSS styles based on Focal Point Picker value
56700   *     const style = {
56701   *         backgroundImage: `url(${ url })`,
56702   *         backgroundPosition: `${ focalPoint.x * 100 }% ${ focalPoint.y * 100 }%`,
56703   *     };
56704   *
56705   *     return (
56706   *         <>
56707   *             <FocalPointPicker
56708   *        __nextHasNoMarginBottom
56709   *                 url={ url }
56710   *                 value={ focalPoint }
56711   *                 onDragStart={ setFocalPoint }
56712   *                 onDrag={ setFocalPoint }
56713   *                 onChange={ setFocalPoint }
56714   *             />
56715   *             <div style={ style } />
56716   *         </>
56717   *     );
56718   * };
56719   * ```
56720   */
56721  function FocalPointPicker({
56722    __nextHasNoMarginBottom,
56723    autoPlay = true,
56724    className,
56725    help,
56726    label,
56727    onChange,
56728    onDrag,
56729    onDragEnd,
56730    onDragStart,
56731    resolvePoint,
56732    url,
56733    value: valueProp = {
56734      x: 0.5,
56735      y: 0.5
56736    },
56737    ...restProps
56738  }) {
56739    const [point, setPoint] = (0,external_wp_element_namespaceObject.useState)(valueProp);
56740    const [showGridOverlay, setShowGridOverlay] = (0,external_wp_element_namespaceObject.useState)(false);
56741    const {
56742      startDrag,
56743      endDrag,
56744      isDragging
56745    } = (0,external_wp_compose_namespaceObject.__experimentalUseDragging)({
56746      onDragStart: event => {
56747        dragAreaRef.current?.focus();
56748        const value = getValueWithinDragArea(event);
56749  
56750        // `value` can technically be undefined if getValueWithinDragArea() is
56751        // called before dragAreaRef is set, but this shouldn't happen in reality.
56752        if (!value) {
56753          return;
56754        }
56755        onDragStart?.(value, event);
56756        setPoint(value);
56757      },
56758      onDragMove: event => {
56759        // Prevents text-selection when dragging.
56760        event.preventDefault();
56761        const value = getValueWithinDragArea(event);
56762        if (!value) {
56763          return;
56764        }
56765        onDrag?.(value, event);
56766        setPoint(value);
56767      },
56768      onDragEnd: () => {
56769        onDragEnd?.();
56770        onChange?.(point);
56771      }
56772    });
56773  
56774    // Uses the internal point while dragging or else the value from props.
56775    const {
56776      x,
56777      y
56778    } = isDragging ? point : valueProp;
56779    const dragAreaRef = (0,external_wp_element_namespaceObject.useRef)(null);
56780    const [bounds, setBounds] = (0,external_wp_element_namespaceObject.useState)(INITIAL_BOUNDS);
56781    const refUpdateBounds = (0,external_wp_element_namespaceObject.useRef)(() => {
56782      if (!dragAreaRef.current) {
56783        return;
56784      }
56785      const {
56786        clientWidth: width,
56787        clientHeight: height
56788      } = dragAreaRef.current;
56789      // Falls back to initial bounds if the ref has no size. Since styles
56790      // give the drag area dimensions even when the media has not loaded
56791      // this should only happen in unit tests (jsdom).
56792      setBounds(width > 0 && height > 0 ? {
56793        width,
56794        height
56795      } : {
56796        ...INITIAL_BOUNDS
56797      });
56798    });
56799    (0,external_wp_element_namespaceObject.useEffect)(() => {
56800      const updateBounds = refUpdateBounds.current;
56801      if (!dragAreaRef.current) {
56802        return;
56803      }
56804      const {
56805        defaultView
56806      } = dragAreaRef.current.ownerDocument;
56807      defaultView?.addEventListener('resize', updateBounds);
56808      return () => defaultView?.removeEventListener('resize', updateBounds);
56809    }, []);
56810  
56811    // Updates the bounds to cover cases of unspecified media or load failures.
56812    (0,external_wp_compose_namespaceObject.useIsomorphicLayoutEffect)(() => void refUpdateBounds.current(), []);
56813  
56814    // TODO: Consider refactoring getValueWithinDragArea() into a pure function.
56815    // https://github.com/WordPress/gutenberg/pull/43872#discussion_r963455173
56816    const getValueWithinDragArea = ({
56817      clientX,
56818      clientY,
56819      shiftKey
56820    }) => {
56821      if (!dragAreaRef.current) {
56822        return;
56823      }
56824      const {
56825        top,
56826        left
56827      } = dragAreaRef.current.getBoundingClientRect();
56828      let nextX = (clientX - left) / bounds.width;
56829      let nextY = (clientY - top) / bounds.height;
56830      // Enables holding shift to jump values by 10%.
56831      if (shiftKey) {
56832        nextX = Math.round(nextX / 0.1) * 0.1;
56833        nextY = Math.round(nextY / 0.1) * 0.1;
56834      }
56835      return getFinalValue({
56836        x: nextX,
56837        y: nextY
56838      });
56839    };
56840    const getFinalValue = value => {
56841      var _resolvePoint;
56842      const resolvedValue = (_resolvePoint = resolvePoint?.(value)) !== null && _resolvePoint !== void 0 ? _resolvePoint : value;
56843      resolvedValue.x = Math.max(0, Math.min(resolvedValue.x, 1));
56844      resolvedValue.y = Math.max(0, Math.min(resolvedValue.y, 1));
56845      const roundToTwoDecimalPlaces = n => Math.round(n * 1e2) / 1e2;
56846      return {
56847        x: roundToTwoDecimalPlaces(resolvedValue.x),
56848        y: roundToTwoDecimalPlaces(resolvedValue.y)
56849      };
56850    };
56851    const arrowKeyStep = event => {
56852      const {
56853        code,
56854        shiftKey
56855      } = event;
56856      if (!['ArrowUp', 'ArrowDown', 'ArrowLeft', 'ArrowRight'].includes(code)) {
56857        return;
56858      }
56859      event.preventDefault();
56860      const value = {
56861        x,
56862        y
56863      };
56864      const step = shiftKey ? 0.1 : 0.01;
56865      const delta = code === 'ArrowUp' || code === 'ArrowLeft' ? -1 * step : step;
56866      const axis = code === 'ArrowUp' || code === 'ArrowDown' ? 'y' : 'x';
56867      value[axis] = value[axis] + delta;
56868      onChange?.(getFinalValue(value));
56869    };
56870    const focalPointPosition = {
56871      left: x !== undefined ? x * bounds.width : 0.5 * bounds.width,
56872      top: y !== undefined ? y * bounds.height : 0.5 * bounds.height
56873    };
56874    const classes = dist_clsx('components-focal-point-picker-control', className);
56875    const instanceId = (0,external_wp_compose_namespaceObject.useInstanceId)(FocalPointPicker);
56876    const id = `inspector-focal-point-picker-control-$instanceId}`;
56877    use_update_effect(() => {
56878      setShowGridOverlay(true);
56879      const timeout = window.setTimeout(() => {
56880        setShowGridOverlay(false);
56881      }, GRID_OVERLAY_TIMEOUT);
56882      return () => window.clearTimeout(timeout);
56883    }, [x, y]);
56884    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(base_control, {
56885      ...restProps,
56886      __nextHasNoMarginBottom: __nextHasNoMarginBottom,
56887      __associatedWPComponentName: "FocalPointPicker",
56888      label: label,
56889      id: id,
56890      help: help,
56891      className: classes,
56892      children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(MediaWrapper, {
56893        className: "components-focal-point-picker-wrapper",
56894        children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(MediaContainer, {
56895          className: "components-focal-point-picker",
56896          onKeyDown: arrowKeyStep,
56897          onMouseDown: startDrag,
56898          onBlur: () => {
56899            if (isDragging) {
56900              endDrag();
56901            }
56902          },
56903          ref: dragAreaRef,
56904          role: "button",
56905          tabIndex: -1,
56906          children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(FocalPointPickerGrid, {
56907            bounds: bounds,
56908            showOverlay: showGridOverlay
56909          }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(media_Media, {
56910            alt: (0,external_wp_i18n_namespaceObject.__)('Media preview'),
56911            autoPlay: autoPlay,
56912            onLoad: refUpdateBounds.current,
56913            src: url
56914          }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(FocalPoint, {
56915            ...focalPointPosition,
56916            isDragging: isDragging
56917          })]
56918        })
56919      }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(FocalPointPickerControls, {
56920        __nextHasNoMarginBottom: __nextHasNoMarginBottom,
56921        hasHelpText: !!help,
56922        point: {
56923          x,
56924          y
56925        },
56926        onChange: value => {
56927          onChange?.(getFinalValue(value));
56928        }
56929      })]
56930    });
56931  }
56932  /* harmony default export */ const focal_point_picker = (FocalPointPicker);
56933  
56934  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/focusable-iframe/index.js
56935  /**
56936   * WordPress dependencies
56937   */
56938  
56939  
56940  /**
56941   * Internal dependencies
56942   */
56943  
56944  function FocusableIframe({
56945    iframeRef,
56946    ...props
56947  }) {
56948    const ref = (0,external_wp_compose_namespaceObject.useMergeRefs)([iframeRef, (0,external_wp_compose_namespaceObject.useFocusableIframe)()]);
56949    external_wp_deprecated_default()('wp.components.FocusableIframe', {
56950      since: '5.9',
56951      alternative: 'wp.compose.useFocusableIframe'
56952    });
56953    // Disable reason: The rendered iframe is a pass-through component,
56954    // assigning props inherited from the rendering parent. It's the
56955    // responsibility of the parent to assign a title.
56956    // eslint-disable-next-line jsx-a11y/iframe-has-title
56957    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("iframe", {
56958      ref: ref,
56959      ...props
56960    });
56961  }
56962  
56963  ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/settings.js
56964  /**
56965   * WordPress dependencies
56966   */
56967  
56968  
56969  
56970  const settings = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_primitives_namespaceObject.SVG, {
56971    xmlns: "http://www.w3.org/2000/svg",
56972    viewBox: "0 0 24 24",
56973    children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, {
56974      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"
56975    }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, {
56976      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"
56977    })]
56978  });
56979  /* harmony default export */ const library_settings = (settings);
56980  
56981  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/font-size-picker/utils.js
56982  /**
56983   * Internal dependencies
56984   */
56985  
56986  
56987  
56988  /**
56989   * Some themes use css vars for their font sizes, so until we
56990   * have the way of calculating them don't display them.
56991   *
56992   * @param value The value that is checked.
56993   * @return Whether the value is a simple css value.
56994   */
56995  function isSimpleCssValue(value) {
56996    const sizeRegex = /^[\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;
56997    return sizeRegex.test(String(value));
56998  }
56999  
57000  /**
57001   * If all of the given font sizes have the same unit (e.g. 'px'), return that
57002   * unit. Otherwise return null.
57003   *
57004   * @param fontSizes List of font sizes.
57005   * @return The common unit, or null.
57006   */
57007  function getCommonSizeUnit(fontSizes) {
57008    const [firstFontSize, ...otherFontSizes] = fontSizes;
57009    if (!firstFontSize) {
57010      return null;
57011    }
57012    const [, firstUnit] = parseQuantityAndUnitFromRawValue(firstFontSize.size);
57013    const areAllSizesSameUnit = otherFontSizes.every(fontSize => {
57014      const [, unit] = parseQuantityAndUnitFromRawValue(fontSize.size);
57015      return unit === firstUnit;
57016    });
57017    return areAllSizesSameUnit ? firstUnit : null;
57018  }
57019  
57020  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/font-size-picker/styles.js
57021  
57022  function font_size_picker_styles_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)."; }
57023  /**
57024   * External dependencies
57025   */
57026  
57027  /**
57028   * Internal dependencies
57029   */
57030  
57031  
57032  
57033  
57034  
57035  const styles_Container = /*#__PURE__*/emotion_styled_base_browser_esm("fieldset",  true ? {
57036    target: "e8tqeku4"
57037  } : 0)( true ? {
57038    name: "1t1ytme",
57039    styles: "border:0;margin:0;padding:0"
57040  } : 0);
57041  const styles_Header = /*#__PURE__*/emotion_styled_base_browser_esm(h_stack_component,  true ? {
57042    target: "e8tqeku3"
57043  } : 0)("height:", space(4), ";" + ( true ? "" : 0));
57044  const HeaderToggle = /*#__PURE__*/emotion_styled_base_browser_esm(build_module_button,  true ? {
57045    target: "e8tqeku2"
57046  } : 0)("margin-top:", space(-1), ";" + ( true ? "" : 0));
57047  const HeaderLabel = /*#__PURE__*/emotion_styled_base_browser_esm(base_control.VisualLabel,  true ? {
57048    target: "e8tqeku1"
57049  } : 0)("display:flex;gap:", space(1), ";justify-content:flex-start;margin-bottom:0;" + ( true ? "" : 0));
57050  const HeaderHint = /*#__PURE__*/emotion_styled_base_browser_esm("span",  true ? {
57051    target: "e8tqeku0"
57052  } : 0)("color:", COLORS.gray[700], ";" + ( true ? "" : 0));
57053  
57054  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/font-size-picker/font-size-picker-select.js
57055  /**
57056   * WordPress dependencies
57057   */
57058  
57059  
57060  /**
57061   * Internal dependencies
57062   */
57063  
57064  
57065  
57066  
57067  const DEFAULT_OPTION = {
57068    key: 'default',
57069    name: (0,external_wp_i18n_namespaceObject.__)('Default'),
57070    value: undefined
57071  };
57072  const CUSTOM_OPTION = {
57073    key: 'custom',
57074    name: (0,external_wp_i18n_namespaceObject.__)('Custom')
57075  };
57076  const FontSizePickerSelect = props => {
57077    var _options$find;
57078    const {
57079      __next40pxDefaultSize,
57080      fontSizes,
57081      value,
57082      disableCustomFontSizes,
57083      size,
57084      onChange,
57085      onSelectCustom
57086    } = props;
57087    const areAllSizesSameUnit = !!getCommonSizeUnit(fontSizes);
57088    const options = [DEFAULT_OPTION, ...fontSizes.map(fontSize => {
57089      let hint;
57090      if (areAllSizesSameUnit) {
57091        const [quantity] = parseQuantityAndUnitFromRawValue(fontSize.size);
57092        if (quantity !== undefined) {
57093          hint = String(quantity);
57094        }
57095      } else if (isSimpleCssValue(fontSize.size)) {
57096        hint = String(fontSize.size);
57097      }
57098      return {
57099        key: fontSize.slug,
57100        name: fontSize.name || fontSize.slug,
57101        value: fontSize.size,
57102        hint
57103      };
57104    }), ...(disableCustomFontSizes ? [] : [CUSTOM_OPTION])];
57105    const selectedOption = value ? (_options$find = options.find(option => option.value === value)) !== null && _options$find !== void 0 ? _options$find : CUSTOM_OPTION : DEFAULT_OPTION;
57106    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(custom_select_control, {
57107      __next40pxDefaultSize: __next40pxDefaultSize,
57108      className: "components-font-size-picker__select",
57109      label: (0,external_wp_i18n_namespaceObject.__)('Font size'),
57110      hideLabelFromVision: true,
57111      describedBy: (0,external_wp_i18n_namespaceObject.sprintf)(
57112      // translators: %s: Currently selected font size.
57113      (0,external_wp_i18n_namespaceObject.__)('Currently selected font size: %s'), selectedOption.name),
57114      options: options,
57115      value: selectedOption,
57116      showSelectedHint: true,
57117      onChange: ({
57118        selectedItem
57119      }) => {
57120        if (selectedItem === CUSTOM_OPTION) {
57121          onSelectCustom();
57122        } else {
57123          onChange(selectedItem.value);
57124        }
57125      },
57126      size: size
57127    });
57128  };
57129  /* harmony default export */ const font_size_picker_select = (FontSizePickerSelect);
57130  
57131  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/font-size-picker/constants.js
57132  /**
57133   * WordPress dependencies
57134   */
57135  
57136  
57137  /**
57138   * List of T-shirt abbreviations.
57139   *
57140   * When there are 5 font sizes or fewer, we assume that the font sizes are
57141   * ordered by size and show T-shirt labels.
57142   */
57143  const T_SHIRT_ABBREVIATIONS = [/* translators: S stands for 'small' and is a size label. */
57144  (0,external_wp_i18n_namespaceObject.__)('S'), /* translators: M stands for 'medium' and is a size label. */
57145  (0,external_wp_i18n_namespaceObject.__)('M'), /* translators: L stands for 'large' and is a size label. */
57146  (0,external_wp_i18n_namespaceObject.__)('L'), /* translators: XL stands for 'extra large' and is a size label. */
57147  (0,external_wp_i18n_namespaceObject.__)('XL'), /* translators: XXL stands for 'extra extra large' and is a size label. */
57148  (0,external_wp_i18n_namespaceObject.__)('XXL')];
57149  
57150  /**
57151   * List of T-shirt names.
57152   *
57153   * When there are 5 font sizes or fewer, we assume that the font sizes are
57154   * ordered by size and show T-shirt labels.
57155   */
57156  const T_SHIRT_NAMES = [(0,external_wp_i18n_namespaceObject.__)('Small'), (0,external_wp_i18n_namespaceObject.__)('Medium'), (0,external_wp_i18n_namespaceObject.__)('Large'), (0,external_wp_i18n_namespaceObject.__)('Extra Large'), (0,external_wp_i18n_namespaceObject.__)('Extra Extra Large')];
57157  
57158  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/font-size-picker/font-size-picker-toggle-group.js
57159  /**
57160   * WordPress dependencies
57161   */
57162  
57163  
57164  /**
57165   * Internal dependencies
57166   */
57167  
57168  
57169  
57170  const FontSizePickerToggleGroup = props => {
57171    const {
57172      fontSizes,
57173      value,
57174      __next40pxDefaultSize,
57175      size,
57176      onChange
57177    } = props;
57178    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(toggle_group_control_component, {
57179      __nextHasNoMarginBottom: true,
57180      __next40pxDefaultSize: __next40pxDefaultSize,
57181      label: (0,external_wp_i18n_namespaceObject.__)('Font size'),
57182      hideLabelFromVision: true,
57183      value: value,
57184      onChange: onChange,
57185      isBlock: true,
57186      size: size,
57187      children: fontSizes.map((fontSize, index) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(toggle_group_control_option_component, {
57188        value: fontSize.size,
57189        label: T_SHIRT_ABBREVIATIONS[index],
57190        "aria-label": fontSize.name || T_SHIRT_NAMES[index],
57191        showTooltip: true
57192      }, fontSize.slug))
57193    });
57194  };
57195  /* harmony default export */ const font_size_picker_toggle_group = (FontSizePickerToggleGroup);
57196  
57197  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/font-size-picker/index.js
57198  /**
57199   * External dependencies
57200   */
57201  
57202  /**
57203   * WordPress dependencies
57204   */
57205  
57206  
57207  
57208  
57209  /**
57210   * Internal dependencies
57211   */
57212  
57213  
57214  
57215  
57216  
57217  
57218  
57219  
57220  
57221  
57222  
57223  
57224  
57225  const DEFAULT_UNITS = ['px', 'em', 'rem', 'vw', 'vh'];
57226  const MAX_TOGGLE_GROUP_SIZES = 5;
57227  const UnforwardedFontSizePicker = (props, ref) => {
57228    const {
57229      __next40pxDefaultSize = false,
57230      fallbackFontSize,
57231      fontSizes = [],
57232      disableCustomFontSizes = false,
57233      onChange,
57234      size = 'default',
57235      units: unitsProp = DEFAULT_UNITS,
57236      value,
57237      withSlider = false,
57238      withReset = true
57239    } = props;
57240    const units = useCustomUnits({
57241      availableUnits: unitsProp
57242    });
57243    const selectedFontSize = fontSizes.find(fontSize => fontSize.size === value);
57244    const isCustomValue = !!value && !selectedFontSize;
57245  
57246    // Initially request a custom picker if the value is not from the predef list.
57247    const [userRequestedCustom, setUserRequestedCustom] = (0,external_wp_element_namespaceObject.useState)(isCustomValue);
57248    let currentPickerType;
57249    if (!disableCustomFontSizes && userRequestedCustom) {
57250      // While showing the custom value picker, switch back to predef only if
57251      // `disableCustomFontSizes` is set to `true`.
57252      currentPickerType = 'custom';
57253    } else {
57254      currentPickerType = fontSizes.length > MAX_TOGGLE_GROUP_SIZES ? 'select' : 'togglegroup';
57255    }
57256    const headerHint = (0,external_wp_element_namespaceObject.useMemo)(() => {
57257      switch (currentPickerType) {
57258        case 'custom':
57259          return (0,external_wp_i18n_namespaceObject.__)('Custom');
57260        case 'togglegroup':
57261          if (selectedFontSize) {
57262            return selectedFontSize.name || T_SHIRT_NAMES[fontSizes.indexOf(selectedFontSize)];
57263          }
57264          break;
57265        case 'select':
57266          const commonUnit = getCommonSizeUnit(fontSizes);
57267          if (commonUnit) {
57268            return `($commonUnit})`;
57269          }
57270          break;
57271      }
57272      return '';
57273    }, [currentPickerType, selectedFontSize, fontSizes]);
57274    if (fontSizes.length === 0 && disableCustomFontSizes) {
57275      return null;
57276    }
57277  
57278    // If neither the value or first font size is a string, then FontSizePicker
57279    // operates in a legacy "unitless" mode where UnitControl can only be used
57280    // to select px values and onChange() is always called with number values.
57281    const hasUnits = typeof value === 'string' || typeof fontSizes[0]?.size === 'string';
57282    const [valueQuantity, valueUnit] = parseQuantityAndUnitFromRawValue(value, units);
57283    const isValueUnitRelative = !!valueUnit && ['em', 'rem', 'vw', 'vh'].includes(valueUnit);
57284    const isDisabled = value === undefined;
57285    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(styles_Container, {
57286      ref: ref,
57287      className: "components-font-size-picker",
57288      children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(visually_hidden_component, {
57289        as: "legend",
57290        children: (0,external_wp_i18n_namespaceObject.__)('Font size')
57291      }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(spacer_component, {
57292        children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(styles_Header, {
57293          className: "components-font-size-picker__header",
57294          children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(HeaderLabel, {
57295            "aria-label": `${(0,external_wp_i18n_namespaceObject.__)('Size')} $headerHint || ''}`,
57296            children: [(0,external_wp_i18n_namespaceObject.__)('Size'), headerHint && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(HeaderHint, {
57297              className: "components-font-size-picker__header__hint",
57298              children: headerHint
57299            })]
57300          }), !disableCustomFontSizes && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(HeaderToggle, {
57301            label: currentPickerType === 'custom' ? (0,external_wp_i18n_namespaceObject.__)('Use size preset') : (0,external_wp_i18n_namespaceObject.__)('Set custom size'),
57302            icon: library_settings,
57303            onClick: () => setUserRequestedCustom(!userRequestedCustom),
57304            isPressed: currentPickerType === 'custom',
57305            size: "small"
57306          })]
57307        })
57308      }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", {
57309        children: [currentPickerType === 'select' && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(font_size_picker_select, {
57310          __next40pxDefaultSize: __next40pxDefaultSize,
57311          fontSizes: fontSizes,
57312          value: value,
57313          disableCustomFontSizes: disableCustomFontSizes,
57314          size: size,
57315          onChange: newValue => {
57316            if (newValue === undefined) {
57317              onChange?.(undefined);
57318            } else {
57319              onChange?.(hasUnits ? newValue : Number(newValue), fontSizes.find(fontSize => fontSize.size === newValue));
57320            }
57321          },
57322          onSelectCustom: () => setUserRequestedCustom(true)
57323        }), currentPickerType === 'togglegroup' && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(font_size_picker_toggle_group, {
57324          fontSizes: fontSizes,
57325          value: value,
57326          __next40pxDefaultSize: __next40pxDefaultSize,
57327          size: size,
57328          onChange: newValue => {
57329            if (newValue === undefined) {
57330              onChange?.(undefined);
57331            } else {
57332              onChange?.(hasUnits ? newValue : Number(newValue), fontSizes.find(fontSize => fontSize.size === newValue));
57333            }
57334          }
57335        }), currentPickerType === 'custom' && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(flex_component, {
57336          className: "components-font-size-picker__custom-size-control",
57337          children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(flex_item_component, {
57338            isBlock: true,
57339            children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(unit_control, {
57340              __next40pxDefaultSize: __next40pxDefaultSize,
57341              label: (0,external_wp_i18n_namespaceObject.__)('Custom'),
57342              labelPosition: "top",
57343              hideLabelFromVision: true,
57344              value: value,
57345              onChange: newValue => {
57346                setUserRequestedCustom(true);
57347                if (newValue === undefined) {
57348                  onChange?.(undefined);
57349                } else {
57350                  onChange?.(hasUnits ? newValue : parseInt(newValue, 10));
57351                }
57352              },
57353              size: size,
57354              units: hasUnits ? units : [],
57355              min: 0
57356            })
57357          }), withSlider && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(flex_item_component, {
57358            isBlock: true,
57359            children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(spacer_component, {
57360              marginX: 2,
57361              marginBottom: 0,
57362              children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(range_control, {
57363                __nextHasNoMarginBottom: true,
57364                __next40pxDefaultSize: __next40pxDefaultSize,
57365                className: "components-font-size-picker__custom-input",
57366                label: (0,external_wp_i18n_namespaceObject.__)('Custom Size'),
57367                hideLabelFromVision: true,
57368                value: valueQuantity,
57369                initialPosition: fallbackFontSize,
57370                withInputField: false,
57371                onChange: newValue => {
57372                  setUserRequestedCustom(true);
57373                  if (newValue === undefined) {
57374                    onChange?.(undefined);
57375                  } else if (hasUnits) {
57376                    onChange?.(newValue + (valueUnit !== null && valueUnit !== void 0 ? valueUnit : 'px'));
57377                  } else {
57378                    onChange?.(newValue);
57379                  }
57380                },
57381                min: 0,
57382                max: isValueUnitRelative ? 10 : 100,
57383                step: isValueUnitRelative ? 0.1 : 1
57384              })
57385            })
57386          }), withReset && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(flex_item_component, {
57387            children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Button, {
57388              disabled: isDisabled,
57389              accessibleWhenDisabled: true,
57390              onClick: () => {
57391                onChange?.(undefined);
57392              },
57393              variant: "secondary",
57394              __next40pxDefaultSize: true,
57395              size: size === '__unstable-large' || props.__next40pxDefaultSize ? 'default' : 'small',
57396              children: (0,external_wp_i18n_namespaceObject.__)('Reset')
57397            })
57398          })]
57399        })]
57400      })]
57401    });
57402  };
57403  const FontSizePicker = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedFontSizePicker);
57404  /* harmony default export */ const font_size_picker = (FontSizePicker);
57405  
57406  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/form-file-upload/index.js
57407  /**
57408   * WordPress dependencies
57409   */
57410  
57411  
57412  /**
57413   * Internal dependencies
57414   */
57415  
57416  
57417  
57418  /**
57419   * FormFileUpload is a component that allows users to select files from their local device.
57420   *
57421   * ```jsx
57422   * import { FormFileUpload } from '@wordpress/components';
57423   *
57424   * const MyFormFileUpload = () => (
57425   *   <FormFileUpload
57426   *     accept="image/*"
57427   *     onChange={ ( event ) => console.log( event.currentTarget.files ) }
57428   *   >
57429   *     Upload
57430   *   </FormFileUpload>
57431   * );
57432   * ```
57433   */
57434  function FormFileUpload({
57435    accept,
57436    children,
57437    multiple = false,
57438    onChange,
57439    onClick,
57440    render,
57441    ...props
57442  }) {
57443    const ref = (0,external_wp_element_namespaceObject.useRef)(null);
57444    const openFileDialog = () => {
57445      ref.current?.click();
57446    };
57447    const ui = render ? render({
57448      openFileDialog
57449    }) : /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, {
57450      onClick: openFileDialog,
57451      ...props,
57452      children: children
57453    });
57454    // @todo: Temporary fix a bug that prevents Chromium browsers from selecting ".heic" files
57455    // from the file upload. See https://core.trac.wordpress.org/ticket/62268#comment:4.
57456    // This can be removed once the Chromium fix is in the stable channel.
57457    // Prevent Safari from adding "image/heic" and "image/heif" to the accept attribute.
57458    const isSafari = globalThis.window?.navigator.userAgent.includes('Safari') && !globalThis.window?.navigator.userAgent.includes('Chrome') && !globalThis.window?.navigator.userAgent.includes('Chromium');
57459    const compatAccept = !isSafari && !!accept?.includes('image/*') ? `${accept}, image/heic, image/heif` : accept;
57460    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", {
57461      className: "components-form-file-upload",
57462      children: [ui, /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("input", {
57463        type: "file",
57464        ref: ref,
57465        multiple: multiple,
57466        style: {
57467          display: 'none'
57468        },
57469        accept: compatAccept,
57470        onChange: onChange,
57471        onClick: onClick,
57472        "data-testid": "form-file-upload-input"
57473      })]
57474    });
57475  }
57476  /* harmony default export */ const form_file_upload = (FormFileUpload);
57477  
57478  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/form-toggle/index.js
57479  /**
57480   * External dependencies
57481   */
57482  
57483  /**
57484   * WordPress dependencies
57485   */
57486  
57487  
57488  /**
57489   * Internal dependencies
57490   */
57491  
57492  
57493  const form_toggle_noop = () => {};
57494  function UnforwardedFormToggle(props, ref) {
57495    const {
57496      className,
57497      checked,
57498      id,
57499      disabled,
57500      onChange = form_toggle_noop,
57501      ...additionalProps
57502    } = props;
57503    const wrapperClasses = dist_clsx('components-form-toggle', className, {
57504      'is-checked': checked,
57505      'is-disabled': disabled
57506    });
57507    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("span", {
57508      className: wrapperClasses,
57509      children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("input", {
57510        className: "components-form-toggle__input",
57511        id: id,
57512        type: "checkbox",
57513        checked: checked,
57514        onChange: onChange,
57515        disabled: disabled,
57516        ...additionalProps,
57517        ref: ref
57518      }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", {
57519        className: "components-form-toggle__track"
57520      }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", {
57521        className: "components-form-toggle__thumb"
57522      })]
57523    });
57524  }
57525  
57526  /**
57527   * FormToggle switches a single setting on or off.
57528   *
57529   * ```jsx
57530   * import { FormToggle } from '@wordpress/components';
57531   * import { useState } from '@wordpress/element';
57532   *
57533   * const MyFormToggle = () => {
57534   *   const [ isChecked, setChecked ] = useState( true );
57535   *
57536   *   return (
57537   *     <FormToggle
57538   *       checked={ isChecked }
57539   *       onChange={ () => setChecked( ( state ) => ! state ) }
57540   *     />
57541   *   );
57542   * };
57543   * ```
57544   */
57545  const FormToggle = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedFormToggle);
57546  /* harmony default export */ const form_toggle = (FormToggle);
57547  
57548  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/form-token-field/token.js
57549  /**
57550   * External dependencies
57551   */
57552  
57553  
57554  /**
57555   * WordPress dependencies
57556   */
57557  
57558  
57559  
57560  
57561  /**
57562   * Internal dependencies
57563   */
57564  
57565  
57566  
57567  
57568  const token_noop = () => {};
57569  function Token({
57570    value,
57571    status,
57572    title,
57573    displayTransform,
57574    isBorderless = false,
57575    disabled = false,
57576    onClickRemove = token_noop,
57577    onMouseEnter,
57578    onMouseLeave,
57579    messages,
57580    termPosition,
57581    termsCount
57582  }) {
57583    const instanceId = (0,external_wp_compose_namespaceObject.useInstanceId)(Token);
57584    const tokenClasses = dist_clsx('components-form-token-field__token', {
57585      'is-error': 'error' === status,
57586      'is-success': 'success' === status,
57587      'is-validating': 'validating' === status,
57588      'is-borderless': isBorderless,
57589      'is-disabled': disabled
57590    });
57591    const onClick = () => onClickRemove({
57592      value
57593    });
57594    const transformedValue = displayTransform(value);
57595    const termPositionAndCount = (0,external_wp_i18n_namespaceObject.sprintf)( /* translators: 1: term name, 2: term position in a set of terms, 3: total term set count. */
57596    (0,external_wp_i18n_namespaceObject.__)('%1$s (%2$s of %3$s)'), transformedValue, termPosition, termsCount);
57597    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("span", {
57598      className: tokenClasses,
57599      onMouseEnter: onMouseEnter,
57600      onMouseLeave: onMouseLeave,
57601      title: title,
57602      children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("span", {
57603        className: "components-form-token-field__token-text",
57604        id: `components-form-token-field__token-text-$instanceId}`,
57605        children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(visually_hidden_component, {
57606          as: "span",
57607          children: termPositionAndCount
57608        }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", {
57609          "aria-hidden": "true",
57610          children: transformedValue
57611        })]
57612      }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, {
57613        className: "components-form-token-field__remove-token",
57614        icon: close_small,
57615        onClick: !disabled ? onClick : undefined
57616        // Disable reason: Even when FormTokenField itself is accessibly disabled, token reset buttons shouldn't be in the tab sequence.
57617        // eslint-disable-next-line no-restricted-syntax
57618        ,
57619        disabled: disabled,
57620        label: messages.remove,
57621        "aria-describedby": `components-form-token-field__token-text-$instanceId}`
57622      })]
57623    });
57624  }
57625  
57626  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/form-token-field/styles.js
57627  
57628  /**
57629   * External dependencies
57630   */
57631  
57632  
57633  
57634  /**
57635   * Internal dependencies
57636   */
57637  
57638  
57639  
57640  const deprecatedPaddings = ({
57641    __next40pxDefaultSize,
57642    hasTokens
57643  }) => !__next40pxDefaultSize && /*#__PURE__*/emotion_react_browser_esm_css("padding-top:", space(hasTokens ? 1 : 0.5), ";padding-bottom:", space(hasTokens ? 1 : 0.5), ";" + ( true ? "" : 0),  true ? "" : 0);
57644  const TokensAndInputWrapperFlex = /*#__PURE__*/emotion_styled_base_browser_esm(flex_component,  true ? {
57645    target: "ehq8nmi0"
57646  } : 0)("padding:7px;", boxSizingReset, " ", deprecatedPaddings, ";" + ( true ? "" : 0));
57647  
57648  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/form-token-field/index.js
57649  /**
57650   * External dependencies
57651   */
57652  
57653  /**
57654   * WordPress dependencies
57655   */
57656  
57657  
57658  
57659  
57660  
57661  
57662  
57663  /**
57664   * Internal dependencies
57665   */
57666  
57667  
57668  
57669  
57670  
57671  
57672  
57673  
57674  
57675  
57676  
57677  const form_token_field_identity = value => value;
57678  
57679  /**
57680   * A `FormTokenField` is a field similar to the tags and categories fields in the interim editor chrome,
57681   * or the "to" field in Mail on OS X. Tokens can be entered by typing them or selecting them from a list of suggested tokens.
57682   *
57683   * Up to one hundred suggestions that match what the user has typed so far will be shown from which the user can pick from (auto-complete).
57684   * Tokens are separated by the "," character. Suggestions can be selected with the up or down arrows and added with the tab or enter key.
57685   *
57686   * The `value` property is handled in a manner similar to controlled form components.
57687   * See [Forms](https://react.dev/reference/react-dom/components#form-components) in the React Documentation for more information.
57688   */
57689  function FormTokenField(props) {
57690    const {
57691      autoCapitalize,
57692      autoComplete,
57693      maxLength,
57694      placeholder,
57695      label = (0,external_wp_i18n_namespaceObject.__)('Add item'),
57696      className,
57697      suggestions = [],
57698      maxSuggestions = 100,
57699      value = [],
57700      displayTransform = form_token_field_identity,
57701      saveTransform = token => token.trim(),
57702      onChange = () => {},
57703      onInputChange = () => {},
57704      onFocus = undefined,
57705      isBorderless = false,
57706      disabled = false,
57707      tokenizeOnSpace = false,
57708      messages = {
57709        added: (0,external_wp_i18n_namespaceObject.__)('Item added.'),
57710        removed: (0,external_wp_i18n_namespaceObject.__)('Item removed.'),
57711        remove: (0,external_wp_i18n_namespaceObject.__)('Remove item'),
57712        __experimentalInvalid: (0,external_wp_i18n_namespaceObject.__)('Invalid item')
57713      },
57714      __experimentalRenderItem,
57715      __experimentalExpandOnFocus = false,
57716      __experimentalValidateInput = () => true,
57717      __experimentalShowHowTo = true,
57718      __next40pxDefaultSize = false,
57719      __experimentalAutoSelectFirstMatch = false,
57720      __nextHasNoMarginBottom = false,
57721      tokenizeOnBlur = false
57722    } = useDeprecated36pxDefaultSizeProp(props);
57723    if (!__nextHasNoMarginBottom) {
57724      external_wp_deprecated_default()('Bottom margin styles for wp.components.FormTokenField', {
57725        since: '6.7',
57726        version: '7.0',
57727        hint: 'Set the `__nextHasNoMarginBottom` prop to true to start opting into the new styles, which will become the default in a future version.'
57728      });
57729    }
57730    const instanceId = (0,external_wp_compose_namespaceObject.useInstanceId)(FormTokenField);
57731  
57732    // We reset to these initial values again in the onBlur
57733    const [incompleteTokenValue, setIncompleteTokenValue] = (0,external_wp_element_namespaceObject.useState)('');
57734    const [inputOffsetFromEnd, setInputOffsetFromEnd] = (0,external_wp_element_namespaceObject.useState)(0);
57735    const [isActive, setIsActive] = (0,external_wp_element_namespaceObject.useState)(false);
57736    const [isExpanded, setIsExpanded] = (0,external_wp_element_namespaceObject.useState)(false);
57737    const [selectedSuggestionIndex, setSelectedSuggestionIndex] = (0,external_wp_element_namespaceObject.useState)(-1);
57738    const [selectedSuggestionScroll, setSelectedSuggestionScroll] = (0,external_wp_element_namespaceObject.useState)(false);
57739    const prevSuggestions = (0,external_wp_compose_namespaceObject.usePrevious)(suggestions);
57740    const prevValue = (0,external_wp_compose_namespaceObject.usePrevious)(value);
57741    const input = (0,external_wp_element_namespaceObject.useRef)(null);
57742    const tokensAndInput = (0,external_wp_element_namespaceObject.useRef)(null);
57743    const debouncedSpeak = (0,external_wp_compose_namespaceObject.useDebounce)(external_wp_a11y_namespaceObject.speak, 500);
57744    (0,external_wp_element_namespaceObject.useEffect)(() => {
57745      // Make sure to focus the input when the isActive state is true.
57746      if (isActive && !hasFocus()) {
57747        focus();
57748      }
57749    }, [isActive]);
57750    (0,external_wp_element_namespaceObject.useEffect)(() => {
57751      const suggestionsDidUpdate = !external_wp_isShallowEqual_default()(suggestions, prevSuggestions || []);
57752      if (suggestionsDidUpdate || value !== prevValue) {
57753        updateSuggestions(suggestionsDidUpdate);
57754      }
57755  
57756      // TODO: updateSuggestions() should first be refactored so its actual deps are clearer.
57757      // eslint-disable-next-line react-hooks/exhaustive-deps
57758    }, [suggestions, prevSuggestions, value, prevValue]);
57759    (0,external_wp_element_namespaceObject.useEffect)(() => {
57760      updateSuggestions();
57761      // eslint-disable-next-line react-hooks/exhaustive-deps
57762    }, [incompleteTokenValue]);
57763    (0,external_wp_element_namespaceObject.useEffect)(() => {
57764      updateSuggestions();
57765      // eslint-disable-next-line react-hooks/exhaustive-deps
57766    }, [__experimentalAutoSelectFirstMatch]);
57767    if (disabled && isActive) {
57768      setIsActive(false);
57769      setIncompleteTokenValue('');
57770    }
57771    function focus() {
57772      input.current?.focus();
57773    }
57774    function hasFocus() {
57775      return input.current === input.current?.ownerDocument.activeElement;
57776    }
57777    function onFocusHandler(event) {
57778      // If focus is on the input or on the container, set the isActive state to true.
57779      if (hasFocus() || event.target === tokensAndInput.current) {
57780        setIsActive(true);
57781        setIsExpanded(__experimentalExpandOnFocus || isExpanded);
57782      } else {
57783        /*
57784         * Otherwise, focus is on one of the token "remove" buttons and we
57785         * set the isActive state to false to prevent the input to be
57786         * re-focused, see componentDidUpdate().
57787         */
57788        setIsActive(false);
57789      }
57790      if ('function' === typeof onFocus) {
57791        onFocus(event);
57792      }
57793    }
57794    function onBlur(event) {
57795      if (inputHasValidValue() && __experimentalValidateInput(incompleteTokenValue)) {
57796        setIsActive(false);
57797        if (tokenizeOnBlur && inputHasValidValue()) {
57798          addNewToken(incompleteTokenValue);
57799        }
57800      } else {
57801        // Reset to initial state
57802        setIncompleteTokenValue('');
57803        setInputOffsetFromEnd(0);
57804        setIsActive(false);
57805        if (__experimentalExpandOnFocus) {
57806          // If `__experimentalExpandOnFocus` is true, don't close the suggestions list when
57807          // the user clicks on it (`tokensAndInput` will be the element that caused the blur).
57808          const hasFocusWithin = event.relatedTarget === tokensAndInput.current;
57809          setIsExpanded(hasFocusWithin);
57810        } else {
57811          // Else collapse the suggestion list. This will result in the suggestion list closing
57812          // after a suggestion has been submitted since that causes a blur.
57813          setIsExpanded(false);
57814        }
57815        setSelectedSuggestionIndex(-1);
57816        setSelectedSuggestionScroll(false);
57817      }
57818    }
57819    function onKeyDown(event) {
57820      let preventDefault = false;
57821      if (event.defaultPrevented) {
57822        return;
57823      }
57824      switch (event.key) {
57825        case 'Backspace':
57826          preventDefault = handleDeleteKey(deleteTokenBeforeInput);
57827          break;
57828        case 'Enter':
57829          preventDefault = addCurrentToken();
57830          break;
57831        case 'ArrowLeft':
57832          preventDefault = handleLeftArrowKey();
57833          break;
57834        case 'ArrowUp':
57835          preventDefault = handleUpArrowKey();
57836          break;
57837        case 'ArrowRight':
57838          preventDefault = handleRightArrowKey();
57839          break;
57840        case 'ArrowDown':
57841          preventDefault = handleDownArrowKey();
57842          break;
57843        case 'Delete':
57844          preventDefault = handleDeleteKey(deleteTokenAfterInput);
57845          break;
57846        case 'Space':
57847          if (tokenizeOnSpace) {
57848            preventDefault = addCurrentToken();
57849          }
57850          break;
57851        case 'Escape':
57852          preventDefault = handleEscapeKey(event);
57853          break;
57854        default:
57855          break;
57856      }
57857      if (preventDefault) {
57858        event.preventDefault();
57859      }
57860    }
57861    function onKeyPress(event) {
57862      let preventDefault = false;
57863      switch (event.key) {
57864        case ',':
57865          preventDefault = handleCommaKey();
57866          break;
57867        default:
57868          break;
57869      }
57870      if (preventDefault) {
57871        event.preventDefault();
57872      }
57873    }
57874    function onContainerTouched(event) {
57875      // Prevent clicking/touching the tokensAndInput container from blurring
57876      // the input and adding the current token.
57877      if (event.target === tokensAndInput.current && isActive) {
57878        event.preventDefault();
57879      }
57880    }
57881    function onTokenClickRemove(event) {
57882      deleteToken(event.value);
57883      focus();
57884    }
57885    function onSuggestionHovered(suggestion) {
57886      const index = getMatchingSuggestions().indexOf(suggestion);
57887      if (index >= 0) {
57888        setSelectedSuggestionIndex(index);
57889        setSelectedSuggestionScroll(false);
57890      }
57891    }
57892    function onSuggestionSelected(suggestion) {
57893      addNewToken(suggestion);
57894    }
57895    function onInputChangeHandler(event) {
57896      const text = event.value;
57897      const separator = tokenizeOnSpace ? /[ ,\t]+/ : /[,\t]+/;
57898      const items = text.split(separator);
57899      const tokenValue = items[items.length - 1] || '';
57900      if (items.length > 1) {
57901        addNewTokens(items.slice(0, -1));
57902      }
57903      setIncompleteTokenValue(tokenValue);
57904      onInputChange(tokenValue);
57905    }
57906    function handleDeleteKey(_deleteToken) {
57907      let preventDefault = false;
57908      if (hasFocus() && isInputEmpty()) {
57909        _deleteToken();
57910        preventDefault = true;
57911      }
57912      return preventDefault;
57913    }
57914    function handleLeftArrowKey() {
57915      let preventDefault = false;
57916      if (isInputEmpty()) {
57917        moveInputBeforePreviousToken();
57918        preventDefault = true;
57919      }
57920      return preventDefault;
57921    }
57922    function handleRightArrowKey() {
57923      let preventDefault = false;
57924      if (isInputEmpty()) {
57925        moveInputAfterNextToken();
57926        preventDefault = true;
57927      }
57928      return preventDefault;
57929    }
57930    function handleUpArrowKey() {
57931      setSelectedSuggestionIndex(index => {
57932        return (index === 0 ? getMatchingSuggestions(incompleteTokenValue, suggestions, value, maxSuggestions, saveTransform).length : index) - 1;
57933      });
57934      setSelectedSuggestionScroll(true);
57935      return true; // PreventDefault.
57936    }
57937    function handleDownArrowKey() {
57938      setSelectedSuggestionIndex(index => {
57939        return (index + 1) % getMatchingSuggestions(incompleteTokenValue, suggestions, value, maxSuggestions, saveTransform).length;
57940      });
57941      setSelectedSuggestionScroll(true);
57942      return true; // PreventDefault.
57943    }
57944    function handleEscapeKey(event) {
57945      if (event.target instanceof HTMLInputElement) {
57946        setIncompleteTokenValue(event.target.value);
57947        setIsExpanded(false);
57948        setSelectedSuggestionIndex(-1);
57949        setSelectedSuggestionScroll(false);
57950      }
57951      return true; // PreventDefault.
57952    }
57953    function handleCommaKey() {
57954      if (inputHasValidValue()) {
57955        addNewToken(incompleteTokenValue);
57956      }
57957      return true; // PreventDefault.
57958    }
57959    function moveInputToIndex(index) {
57960      setInputOffsetFromEnd(value.length - Math.max(index, -1) - 1);
57961    }
57962    function moveInputBeforePreviousToken() {
57963      setInputOffsetFromEnd(prevInputOffsetFromEnd => {
57964        return Math.min(prevInputOffsetFromEnd + 1, value.length);
57965      });
57966    }
57967    function moveInputAfterNextToken() {
57968      setInputOffsetFromEnd(prevInputOffsetFromEnd => {
57969        return Math.max(prevInputOffsetFromEnd - 1, 0);
57970      });
57971    }
57972    function deleteTokenBeforeInput() {
57973      const index = getIndexOfInput() - 1;
57974      if (index > -1) {
57975        deleteToken(value[index]);
57976      }
57977    }
57978    function deleteTokenAfterInput() {
57979      const index = getIndexOfInput();
57980      if (index < value.length) {
57981        deleteToken(value[index]);
57982        // Update input offset since it's the offset from the last token.
57983        moveInputToIndex(index);
57984      }
57985    }
57986    function addCurrentToken() {
57987      let preventDefault = false;
57988      const selectedSuggestion = getSelectedSuggestion();
57989      if (selectedSuggestion) {
57990        addNewToken(selectedSuggestion);
57991        preventDefault = true;
57992      } else if (inputHasValidValue()) {
57993        addNewToken(incompleteTokenValue);
57994        preventDefault = true;
57995      }
57996      return preventDefault;
57997    }
57998    function addNewTokens(tokens) {
57999      const tokensToAdd = [...new Set(tokens.map(saveTransform).filter(Boolean).filter(token => !valueContainsToken(token)))];
58000      if (tokensToAdd.length > 0) {
58001        const newValue = [...value];
58002        newValue.splice(getIndexOfInput(), 0, ...tokensToAdd);
58003        onChange(newValue);
58004      }
58005    }
58006    function addNewToken(token) {
58007      if (!__experimentalValidateInput(token)) {
58008        (0,external_wp_a11y_namespaceObject.speak)(messages.__experimentalInvalid, 'assertive');
58009        return;
58010      }
58011      addNewTokens([token]);
58012      (0,external_wp_a11y_namespaceObject.speak)(messages.added, 'assertive');
58013      setIncompleteTokenValue('');
58014      setSelectedSuggestionIndex(-1);
58015      setSelectedSuggestionScroll(false);
58016      setIsExpanded(!__experimentalExpandOnFocus);
58017      if (isActive && !tokenizeOnBlur) {
58018        focus();
58019      }
58020    }
58021    function deleteToken(token) {
58022      const newTokens = value.filter(item => {
58023        return getTokenValue(item) !== getTokenValue(token);
58024      });
58025      onChange(newTokens);
58026      (0,external_wp_a11y_namespaceObject.speak)(messages.removed, 'assertive');
58027    }
58028    function getTokenValue(token) {
58029      if ('object' === typeof token) {
58030        return token.value;
58031      }
58032      return token;
58033    }
58034    function getMatchingSuggestions(searchValue = incompleteTokenValue, _suggestions = suggestions, _value = value, _maxSuggestions = maxSuggestions, _saveTransform = saveTransform) {
58035      let match = _saveTransform(searchValue);
58036      const startsWithMatch = [];
58037      const containsMatch = [];
58038      const normalizedValue = _value.map(item => {
58039        if (typeof item === 'string') {
58040          return item;
58041        }
58042        return item.value;
58043      });
58044      if (match.length === 0) {
58045        _suggestions = _suggestions.filter(suggestion => !normalizedValue.includes(suggestion));
58046      } else {
58047        match = match.toLocaleLowerCase();
58048        _suggestions.forEach(suggestion => {
58049          const index = suggestion.toLocaleLowerCase().indexOf(match);
58050          if (normalizedValue.indexOf(suggestion) === -1) {
58051            if (index === 0) {
58052              startsWithMatch.push(suggestion);
58053            } else if (index > 0) {
58054              containsMatch.push(suggestion);
58055            }
58056          }
58057        });
58058        _suggestions = startsWithMatch.concat(containsMatch);
58059      }
58060      return _suggestions.slice(0, _maxSuggestions);
58061    }
58062    function getSelectedSuggestion() {
58063      if (selectedSuggestionIndex !== -1) {
58064        return getMatchingSuggestions()[selectedSuggestionIndex];
58065      }
58066      return undefined;
58067    }
58068    function valueContainsToken(token) {
58069      return value.some(item => {
58070        return getTokenValue(token) === getTokenValue(item);
58071      });
58072    }
58073    function getIndexOfInput() {
58074      return value.length - inputOffsetFromEnd;
58075    }
58076    function isInputEmpty() {
58077      return incompleteTokenValue.length === 0;
58078    }
58079    function inputHasValidValue() {
58080      return saveTransform(incompleteTokenValue).length > 0;
58081    }
58082    function updateSuggestions(resetSelectedSuggestion = true) {
58083      const inputHasMinimumChars = incompleteTokenValue.trim().length > 1;
58084      const matchingSuggestions = getMatchingSuggestions(incompleteTokenValue);
58085      const hasMatchingSuggestions = matchingSuggestions.length > 0;
58086      const shouldExpandIfFocuses = hasFocus() && __experimentalExpandOnFocus;
58087      setIsExpanded(shouldExpandIfFocuses || inputHasMinimumChars && hasMatchingSuggestions);
58088      if (resetSelectedSuggestion) {
58089        if (__experimentalAutoSelectFirstMatch && inputHasMinimumChars && hasMatchingSuggestions) {
58090          setSelectedSuggestionIndex(0);
58091          setSelectedSuggestionScroll(true);
58092        } else {
58093          setSelectedSuggestionIndex(-1);
58094          setSelectedSuggestionScroll(false);
58095        }
58096      }
58097      if (inputHasMinimumChars) {
58098        const message = hasMatchingSuggestions ? (0,external_wp_i18n_namespaceObject.sprintf)( /* translators: %d: number of results. */
58099        (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.', matchingSuggestions.length), matchingSuggestions.length) : (0,external_wp_i18n_namespaceObject.__)('No results.');
58100        debouncedSpeak(message, 'assertive');
58101      }
58102    }
58103    function renderTokensAndInput() {
58104      const components = value.map(renderToken);
58105      components.splice(getIndexOfInput(), 0, renderInput());
58106      return components;
58107    }
58108    function renderToken(token, index, tokens) {
58109      const _value = getTokenValue(token);
58110      const status = typeof token !== 'string' ? token.status : undefined;
58111      const termPosition = index + 1;
58112      const termsCount = tokens.length;
58113      return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(flex_item_component, {
58114        children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Token, {
58115          value: _value,
58116          status: status,
58117          title: typeof token !== 'string' ? token.title : undefined,
58118          displayTransform: displayTransform,
58119          onClickRemove: onTokenClickRemove,
58120          isBorderless: typeof token !== 'string' && token.isBorderless || isBorderless,
58121          onMouseEnter: typeof token !== 'string' ? token.onMouseEnter : undefined,
58122          onMouseLeave: typeof token !== 'string' ? token.onMouseLeave : undefined,
58123          disabled: 'error' !== status && disabled,
58124          messages: messages,
58125          termsCount: termsCount,
58126          termPosition: termPosition
58127        })
58128      }, 'token-' + _value);
58129    }
58130    function renderInput() {
58131      const inputProps = {
58132        instanceId,
58133        autoCapitalize,
58134        autoComplete,
58135        placeholder: value.length === 0 ? placeholder : '',
58136        disabled,
58137        value: incompleteTokenValue,
58138        onBlur,
58139        isExpanded,
58140        selectedSuggestionIndex
58141      };
58142      return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(token_input, {
58143        ...inputProps,
58144        onChange: !(maxLength && value.length >= maxLength) ? onInputChangeHandler : undefined,
58145        ref: input
58146      }, "input");
58147    }
58148    const classes = dist_clsx(className, 'components-form-token-field__input-container', {
58149      'is-active': isActive,
58150      'is-disabled': disabled
58151    });
58152    let tokenFieldProps = {
58153      className: 'components-form-token-field',
58154      tabIndex: -1
58155    };
58156    const matchingSuggestions = getMatchingSuggestions();
58157    if (!disabled) {
58158      tokenFieldProps = Object.assign({}, tokenFieldProps, {
58159        onKeyDown: withIgnoreIMEEvents(onKeyDown),
58160        onKeyPress,
58161        onFocus: onFocusHandler
58162      });
58163    }
58164  
58165    // Disable reason: There is no appropriate role which describes the
58166    // input container intended accessible usability.
58167    // TODO: Refactor click detection to use blur to stop propagation.
58168    /* eslint-disable jsx-a11y/no-static-element-interactions */
58169    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", {
58170      ...tokenFieldProps,
58171      children: [label && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(StyledLabel, {
58172        htmlFor: `components-form-token-input-$instanceId}`,
58173        className: "components-form-token-field__label",
58174        children: label
58175      }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", {
58176        ref: tokensAndInput,
58177        className: classes,
58178        tabIndex: -1,
58179        onMouseDown: onContainerTouched,
58180        onTouchStart: onContainerTouched,
58181        children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(TokensAndInputWrapperFlex, {
58182          justify: "flex-start",
58183          align: "center",
58184          gap: 1,
58185          wrap: true,
58186          __next40pxDefaultSize: __next40pxDefaultSize,
58187          hasTokens: !!value.length,
58188          children: renderTokensAndInput()
58189        }), isExpanded && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(suggestions_list, {
58190          instanceId: instanceId,
58191          match: saveTransform(incompleteTokenValue),
58192          displayTransform: displayTransform,
58193          suggestions: matchingSuggestions,
58194          selectedIndex: selectedSuggestionIndex,
58195          scrollIntoView: selectedSuggestionScroll,
58196          onHover: onSuggestionHovered,
58197          onSelect: onSuggestionSelected,
58198          __experimentalRenderItem: __experimentalRenderItem
58199        })]
58200      }), !__nextHasNoMarginBottom && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(spacer_component, {
58201        marginBottom: 2
58202      }), __experimentalShowHowTo && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(StyledHelp, {
58203        id: `components-form-token-suggestions-howto-$instanceId}`,
58204        className: "components-form-token-field__help",
58205        __nextHasNoMarginBottom: __nextHasNoMarginBottom,
58206        children: tokenizeOnSpace ? (0,external_wp_i18n_namespaceObject.__)('Separate with commas, spaces, or the Enter key.') : (0,external_wp_i18n_namespaceObject.__)('Separate with commas or the Enter key.')
58207      })]
58208    });
58209    /* eslint-enable jsx-a11y/no-static-element-interactions */
58210  }
58211  /* harmony default export */ const form_token_field = (FormTokenField);
58212  
58213  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/guide/icons.js
58214  /**
58215   * WordPress dependencies
58216   */
58217  
58218  
58219  const PageControlIcon = () => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, {
58220    width: "8",
58221    height: "8",
58222    fill: "none",
58223    xmlns: "http://www.w3.org/2000/svg",
58224    children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Circle, {
58225      cx: "4",
58226      cy: "4",
58227      r: "4"
58228    })
58229  });
58230  
58231  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/guide/page-control.js
58232  /**
58233   * WordPress dependencies
58234   */
58235  
58236  
58237  /**
58238   * Internal dependencies
58239   */
58240  
58241  
58242  
58243  function PageControl({
58244    currentPage,
58245    numberOfPages,
58246    setCurrentPage
58247  }) {
58248    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("ul", {
58249      className: "components-guide__page-control",
58250      "aria-label": (0,external_wp_i18n_namespaceObject.__)('Guide controls'),
58251      children: Array.from({
58252        length: numberOfPages
58253      }).map((_, page) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("li", {
58254        // Set aria-current="step" on the active page, see https://www.w3.org/TR/wai-aria-1.1/#aria-current
58255        "aria-current": page === currentPage ? 'step' : undefined,
58256        children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, {
58257          icon: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(PageControlIcon, {}),
58258          "aria-label": (0,external_wp_i18n_namespaceObject.sprintf)( /* translators: 1: current page number 2: total number of pages */
58259          (0,external_wp_i18n_namespaceObject.__)('Page %1$d of %2$d'), page + 1, numberOfPages),
58260          onClick: () => setCurrentPage(page)
58261        }, page)
58262      }, page))
58263    });
58264  }
58265  
58266  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/guide/index.js
58267  /**
58268   * External dependencies
58269   */
58270  
58271  
58272  /**
58273   * WordPress dependencies
58274   */
58275  
58276  
58277  
58278  
58279  /**
58280   * Internal dependencies
58281   */
58282  
58283  
58284  
58285  
58286  
58287  /**
58288   * `Guide` is a React component that renders a _user guide_ in a modal. The guide consists of several pages which the user can step through one by one. The guide is finished when the modal is closed or when the user clicks _Finish_ on the last page of the guide.
58289   *
58290   * ```jsx
58291   * function MyTutorial() {
58292   *     const [ isOpen, setIsOpen ] = useState( true );
58293   *
58294   *     if ( ! isOpen ) {
58295   *         return null;
58296   *     }
58297   *
58298   *     return (
58299   *         <Guide
58300   *             onFinish={ () => setIsOpen( false ) }
58301   *             pages={ [
58302   *                 {
58303   *                     content: <p>Welcome to the ACME Store!</p>,
58304   *                 },
58305   *                 {
58306   *                     image: <img src="https://acmestore.com/add-to-cart.png" />,
58307   *                     content: (
58308   *                         <p>
58309   *                             Click <i>Add to Cart</i> to buy a product.
58310   *                         </p>
58311   *                     ),
58312   *                 },
58313   *             ] }
58314   *         />
58315   *     );
58316   * }
58317   * ```
58318   */
58319  function Guide({
58320    children,
58321    className,
58322    contentLabel,
58323    finishButtonText = (0,external_wp_i18n_namespaceObject.__)('Finish'),
58324    onFinish,
58325    pages = []
58326  }) {
58327    const ref = (0,external_wp_element_namespaceObject.useRef)(null);
58328    const [currentPage, setCurrentPage] = (0,external_wp_element_namespaceObject.useState)(0);
58329    (0,external_wp_element_namespaceObject.useEffect)(() => {
58330      // Place focus at the top of the guide on mount and when the page changes.
58331      const frame = ref.current?.querySelector('.components-guide');
58332      if (frame instanceof HTMLElement) {
58333        frame.focus();
58334      }
58335    }, [currentPage]);
58336    (0,external_wp_element_namespaceObject.useEffect)(() => {
58337      if (external_wp_element_namespaceObject.Children.count(children)) {
58338        external_wp_deprecated_default()('Passing children to <Guide>', {
58339          since: '5.5',
58340          alternative: 'the `pages` prop'
58341        });
58342      }
58343    }, [children]);
58344    if (external_wp_element_namespaceObject.Children.count(children)) {
58345      var _Children$map;
58346      pages = (_Children$map = external_wp_element_namespaceObject.Children.map(children, child => ({
58347        content: child
58348      }))) !== null && _Children$map !== void 0 ? _Children$map : [];
58349    }
58350    const canGoBack = currentPage > 0;
58351    const canGoForward = currentPage < pages.length - 1;
58352    const goBack = () => {
58353      if (canGoBack) {
58354        setCurrentPage(currentPage - 1);
58355      }
58356    };
58357    const goForward = () => {
58358      if (canGoForward) {
58359        setCurrentPage(currentPage + 1);
58360      }
58361    };
58362    if (pages.length === 0) {
58363      return null;
58364    }
58365    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(modal, {
58366      className: dist_clsx('components-guide', className),
58367      contentLabel: contentLabel,
58368      isDismissible: pages.length > 1,
58369      onRequestClose: onFinish,
58370      onKeyDown: event => {
58371        if (event.code === 'ArrowLeft') {
58372          goBack();
58373          // Do not scroll the modal's contents.
58374          event.preventDefault();
58375        } else if (event.code === 'ArrowRight') {
58376          goForward();
58377          // Do not scroll the modal's contents.
58378          event.preventDefault();
58379        }
58380      },
58381      ref: ref,
58382      children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", {
58383        className: "components-guide__container",
58384        children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", {
58385          className: "components-guide__page",
58386          children: [pages[currentPage].image, pages.length > 1 && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(PageControl, {
58387            currentPage: currentPage,
58388            numberOfPages: pages.length,
58389            setCurrentPage: setCurrentPage
58390          }), pages[currentPage].content]
58391        }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", {
58392          className: "components-guide__footer",
58393          children: [canGoBack && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, {
58394            className: "components-guide__back-button",
58395            variant: "tertiary",
58396            onClick: goBack,
58397            __next40pxDefaultSize: true,
58398            children: (0,external_wp_i18n_namespaceObject.__)('Previous')
58399          }), canGoForward && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, {
58400            className: "components-guide__forward-button",
58401            variant: "primary",
58402            onClick: goForward,
58403            __next40pxDefaultSize: true,
58404            children: (0,external_wp_i18n_namespaceObject.__)('Next')
58405          }), !canGoForward && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, {
58406            className: "components-guide__finish-button",
58407            variant: "primary",
58408            onClick: onFinish,
58409            __next40pxDefaultSize: true,
58410            children: finishButtonText
58411          })]
58412        })]
58413      })
58414    });
58415  }
58416  /* harmony default export */ const guide = (Guide);
58417  
58418  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/guide/page.js
58419  /**
58420   * WordPress dependencies
58421   */
58422  
58423  
58424  
58425  /**
58426   * Internal dependencies
58427   */
58428  
58429  function GuidePage(props) {
58430    (0,external_wp_element_namespaceObject.useEffect)(() => {
58431      external_wp_deprecated_default()('<GuidePage>', {
58432        since: '5.5',
58433        alternative: 'the `pages` prop in <Guide>'
58434      });
58435    }, []);
58436    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", {
58437      ...props
58438    });
58439  }
58440  
58441  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/button/deprecated.js
58442  /**
58443   * External dependencies
58444   */
58445  
58446  /**
58447   * WordPress dependencies
58448   */
58449  
58450  
58451  
58452  /**
58453   * Internal dependencies
58454   */
58455  
58456  
58457  function UnforwardedIconButton({
58458    label,
58459    labelPosition,
58460    size,
58461    tooltip,
58462    ...props
58463  }, ref) {
58464    external_wp_deprecated_default()('wp.components.IconButton', {
58465      since: '5.4',
58466      alternative: 'wp.components.Button',
58467      version: '6.2'
58468    });
58469    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, {
58470      ...props,
58471      ref: ref,
58472      tooltipPosition: labelPosition,
58473      iconSize: size,
58474      showTooltip: tooltip !== undefined ? !!tooltip : undefined,
58475      label: tooltip || label
58476    });
58477  }
58478  /* harmony default export */ const deprecated = ((0,external_wp_element_namespaceObject.forwardRef)(UnforwardedIconButton));
58479  
58480  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/item-group/item/hook.js
58481  /**
58482   * WordPress dependencies
58483   */
58484  
58485  
58486  /**
58487   * Internal dependencies
58488   */
58489  
58490  
58491  
58492  
58493  
58494  function useItem(props) {
58495    const {
58496      as: asProp,
58497      className,
58498      onClick,
58499      role = 'listitem',
58500      size: sizeProp,
58501      ...otherProps
58502    } = useContextSystem(props, 'Item');
58503    const {
58504      spacedAround,
58505      size: contextSize
58506    } = useItemGroupContext();
58507    const size = sizeProp || contextSize;
58508    const as = asProp || (typeof onClick !== 'undefined' ? 'button' : 'div');
58509    const cx = useCx();
58510    const classes = (0,external_wp_element_namespaceObject.useMemo)(() => cx((as === 'button' || as === 'a') && unstyledButton(as), itemSizes[size] || itemSizes.medium, item, spacedAround && styles_spacedAround, className), [as, className, cx, size, spacedAround]);
58511    const wrapperClassName = cx(itemWrapper);
58512    return {
58513      as,
58514      className: classes,
58515      onClick,
58516      wrapperClassName,
58517      role,
58518      ...otherProps
58519    };
58520  }
58521  
58522  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/item-group/item/component.js
58523  /**
58524   * External dependencies
58525   */
58526  
58527  /**
58528   * Internal dependencies
58529   */
58530  
58531  
58532  
58533  
58534  
58535  function UnconnectedItem(props, forwardedRef) {
58536    const {
58537      role,
58538      wrapperClassName,
58539      ...otherProps
58540    } = useItem(props);
58541    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", {
58542      role: role,
58543      className: wrapperClassName,
58544      children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(component, {
58545        ...otherProps,
58546        ref: forwardedRef
58547      })
58548    });
58549  }
58550  
58551  /**
58552   * `Item` is used in combination with `ItemGroup` to display a list of items
58553   * grouped and styled together.
58554   *
58555   * ```jsx
58556   * import {
58557   *   __experimentalItemGroup as ItemGroup,
58558   *   __experimentalItem as Item,
58559   * } from '@wordpress/components';
58560   *
58561   * function Example() {
58562   *   return (
58563   *     <ItemGroup>
58564   *       <Item>Code</Item>
58565   *       <Item>is</Item>
58566   *       <Item>Poetry</Item>
58567   *     </ItemGroup>
58568   *   );
58569   * }
58570   * ```
58571   */
58572  const component_Item = contextConnect(UnconnectedItem, 'Item');
58573  /* harmony default export */ const item_component = (component_Item);
58574  
58575  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/keyboard-shortcuts/index.js
58576  /**
58577   * WordPress dependencies
58578   */
58579  
58580  
58581  
58582  /**
58583   * Internal dependencies
58584   */
58585  
58586  
58587  
58588  function KeyboardShortcut({
58589    target,
58590    callback,
58591    shortcut,
58592    bindGlobal,
58593    eventName
58594  }) {
58595    (0,external_wp_compose_namespaceObject.useKeyboardShortcut)(shortcut, callback, {
58596      bindGlobal,
58597      target,
58598      eventName
58599    });
58600    return null;
58601  }
58602  
58603  /**
58604   * `KeyboardShortcuts` is a component which handles keyboard sequences during the lifetime of the rendering element.
58605   *
58606   * When passed children, it will capture key events which occur on or within the children. If no children are passed, events are captured on the document.
58607   *
58608   * It uses the [Mousetrap](https://craig.is/killing/mice) library to implement keyboard sequence bindings.
58609   *
58610   * ```jsx
58611   * import { KeyboardShortcuts } from '@wordpress/components';
58612   * import { useState } from '@wordpress/element';
58613   *
58614   * const MyKeyboardShortcuts = () => {
58615   *     const [ isAllSelected, setIsAllSelected ] = useState( false );
58616   *     const selectAll = () => {
58617   *         setIsAllSelected( true );
58618   *     };
58619   *
58620   *     return (
58621   *         <div>
58622   *             <KeyboardShortcuts
58623   *                 shortcuts={ {
58624   *                     'mod+a': selectAll,
58625   *                 } }
58626   *             />
58627   *             [cmd/ctrl + A] Combination pressed? { isAllSelected ? 'Yes' : 'No' }
58628   *         </div>
58629   *     );
58630   * };
58631   * ```
58632   */
58633  function KeyboardShortcuts({
58634    children,
58635    shortcuts,
58636    bindGlobal,
58637    eventName
58638  }) {
58639    const target = (0,external_wp_element_namespaceObject.useRef)(null);
58640    const element = Object.entries(shortcuts !== null && shortcuts !== void 0 ? shortcuts : {}).map(([shortcut, callback]) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(KeyboardShortcut, {
58641      shortcut: shortcut,
58642      callback: callback,
58643      bindGlobal: bindGlobal,
58644      eventName: eventName,
58645      target: target
58646    }, shortcut));
58647  
58648    // Render as non-visual if there are no children pressed. Keyboard
58649    // events will be bound to the document instead.
58650    if (!external_wp_element_namespaceObject.Children.count(children)) {
58651      return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_ReactJSXRuntime_namespaceObject.Fragment, {
58652        children: element
58653      });
58654    }
58655    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", {
58656      ref: target,
58657      children: [element, children]
58658    });
58659  }
58660  /* harmony default export */ const keyboard_shortcuts = (KeyboardShortcuts);
58661  
58662  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/menu-group/index.js
58663  /**
58664   * External dependencies
58665   */
58666  
58667  
58668  /**
58669   * WordPress dependencies
58670   */
58671  
58672  
58673  
58674  /**
58675   * Internal dependencies
58676   */
58677  
58678  
58679  /**
58680   * `MenuGroup` wraps a series of related `MenuItem` components into a common
58681   * section.
58682   *
58683   * ```jsx
58684   * import { MenuGroup, MenuItem } from '@wordpress/components';
58685   *
58686   * const MyMenuGroup = () => (
58687   *   <MenuGroup label="Settings">
58688   *     <MenuItem>Setting 1</MenuItem>
58689   *     <MenuItem>Setting 2</MenuItem>
58690   *   </MenuGroup>
58691   * );
58692   * ```
58693   */
58694  function MenuGroup(props) {
58695    const {
58696      children,
58697      className = '',
58698      label,
58699      hideSeparator
58700    } = props;
58701    const instanceId = (0,external_wp_compose_namespaceObject.useInstanceId)(MenuGroup);
58702    if (!external_wp_element_namespaceObject.Children.count(children)) {
58703      return null;
58704    }
58705    const labelId = `components-menu-group-label-$instanceId}`;
58706    const classNames = dist_clsx(className, 'components-menu-group', {
58707      'has-hidden-separator': hideSeparator
58708    });
58709    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", {
58710      className: classNames,
58711      children: [label && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", {
58712        className: "components-menu-group__label",
58713        id: labelId,
58714        "aria-hidden": "true",
58715        children: label
58716      }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", {
58717        role: "group",
58718        "aria-labelledby": label ? labelId : undefined,
58719        children: children
58720      })]
58721    });
58722  }
58723  /* harmony default export */ const menu_group = (MenuGroup);
58724  
58725  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/menu-item/index.js
58726  /**
58727   * External dependencies
58728   */
58729  
58730  
58731  
58732  /**
58733   * WordPress dependencies
58734   */
58735  
58736  
58737  /**
58738   * Internal dependencies
58739   */
58740  
58741  
58742  
58743  
58744  
58745  function UnforwardedMenuItem(props, ref) {
58746    let {
58747      children,
58748      info,
58749      className,
58750      icon,
58751      iconPosition = 'right',
58752      shortcut,
58753      isSelected,
58754      role = 'menuitem',
58755      suffix,
58756      ...buttonProps
58757    } = props;
58758    className = dist_clsx('components-menu-item__button', className);
58759    if (info) {
58760      children = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("span", {
58761        className: "components-menu-item__info-wrapper",
58762        children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", {
58763          className: "components-menu-item__item",
58764          children: children
58765        }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", {
58766          className: "components-menu-item__info",
58767          children: info
58768        })]
58769      });
58770    }
58771    if (icon && typeof icon !== 'string') {
58772      icon = (0,external_wp_element_namespaceObject.cloneElement)(icon, {
58773        className: dist_clsx('components-menu-items__item-icon', {
58774          'has-icon-right': iconPosition === 'right'
58775        })
58776      });
58777    }
58778    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(build_module_button, {
58779      ref: ref
58780      // Make sure aria-checked matches spec https://www.w3.org/TR/wai-aria-1.1/#aria-checked
58781      ,
58782      "aria-checked": role === 'menuitemcheckbox' || role === 'menuitemradio' ? isSelected : undefined,
58783      role: role,
58784      icon: iconPosition === 'left' ? icon : undefined,
58785      className: className,
58786      ...buttonProps,
58787      children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", {
58788        className: "components-menu-item__item",
58789        children: children
58790      }), !suffix && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_shortcut, {
58791        className: "components-menu-item__shortcut",
58792        shortcut: shortcut
58793      }), !suffix && icon && iconPosition === 'right' && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_icon, {
58794        icon: icon
58795      }), suffix]
58796    });
58797  }
58798  
58799  /**
58800   * MenuItem is a component which renders a button intended to be used in combination with the `DropdownMenu` component.
58801   *
58802   * ```jsx
58803   * import { MenuItem } from '@wordpress/components';
58804   * import { useState } from '@wordpress/element';
58805   *
58806   * const MyMenuItem = () => {
58807   *     const [ isActive, setIsActive ] = useState( true );
58808   *
58809   *     return (
58810   *         <MenuItem
58811   *             icon={ isActive ? 'yes' : 'no' }
58812   *             isSelected={ isActive }
58813   *             role="menuitemcheckbox"
58814   *             onClick={ () => setIsActive( ( state ) => ! state ) }
58815   *         >
58816   *             Toggle
58817   *         </MenuItem>
58818   *     );
58819   * };
58820   * ```
58821   */
58822  const MenuItem = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedMenuItem);
58823  /* harmony default export */ const menu_item = (MenuItem);
58824  
58825  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/menu-items-choice/index.js
58826  /**
58827   * WordPress dependencies
58828   */
58829  
58830  
58831  /**
58832   * Internal dependencies
58833   */
58834  
58835  
58836  
58837  const menu_items_choice_noop = () => {};
58838  
58839  /**
58840   * `MenuItemsChoice` functions similarly to a set of `MenuItem`s, but allows the user to select one option from a set of multiple choices.
58841   *
58842   *
58843   * ```jsx
58844   * import { MenuGroup, MenuItemsChoice } from '@wordpress/components';
58845   * import { useState } from '@wordpress/element';
58846   *
58847   * const MyMenuItemsChoice = () => {
58848   *     const [ mode, setMode ] = useState( 'visual' );
58849   *     const choices = [
58850   *         {
58851   *             value: 'visual',
58852   *             label: 'Visual editor',
58853   *         },
58854   *         {
58855   *             value: 'text',
58856   *             label: 'Code editor',
58857   *         },
58858   *     ];
58859   *
58860   *     return (
58861   *         <MenuGroup label="Editor">
58862   *             <MenuItemsChoice
58863   *                 choices={ choices }
58864   *                 value={ mode }
58865   *                 onSelect={ ( newMode ) => setMode( newMode ) }
58866   *             />
58867   *         </MenuGroup>
58868   *     );
58869   * };
58870   * ```
58871   */
58872  function MenuItemsChoice({
58873    choices = [],
58874    onHover = menu_items_choice_noop,
58875    onSelect,
58876    value
58877  }) {
58878    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_ReactJSXRuntime_namespaceObject.Fragment, {
58879      children: choices.map(item => {
58880        const isSelected = value === item.value;
58881        return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(menu_item, {
58882          role: "menuitemradio",
58883          disabled: item.disabled,
58884          icon: isSelected ? library_check : null,
58885          info: item.info,
58886          isSelected: isSelected,
58887          shortcut: item.shortcut,
58888          className: "components-menu-items-choice",
58889          onClick: () => {
58890            if (!isSelected) {
58891              onSelect(item.value);
58892            }
58893          },
58894          onMouseEnter: () => onHover(item.value),
58895          onMouseLeave: () => onHover(null),
58896          "aria-label": item['aria-label'],
58897          children: item.label
58898        }, item.value);
58899      })
58900    });
58901  }
58902  /* harmony default export */ const menu_items_choice = (MenuItemsChoice);
58903  
58904  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/navigable-container/tabbable.js
58905  /**
58906   * External dependencies
58907   */
58908  
58909  /**
58910   * WordPress dependencies
58911   */
58912  
58913  
58914  /**
58915   * Internal dependencies
58916   */
58917  
58918  
58919  function UnforwardedTabbableContainer({
58920    eventToOffset,
58921    ...props
58922  }, ref) {
58923    const innerEventToOffset = evt => {
58924      const {
58925        code,
58926        shiftKey
58927      } = evt;
58928      if ('Tab' === code) {
58929        return shiftKey ? -1 : 1;
58930      }
58931  
58932      // Allow custom handling of keys besides Tab.
58933      //
58934      // By default, TabbableContainer will move focus forward on Tab and
58935      // backward on Shift+Tab. The handler below will be used for all other
58936      // events. The semantics for `eventToOffset`'s return
58937      // values are the following:
58938      //
58939      // - +1: move focus forward
58940      // - -1: move focus backward
58941      // -  0: don't move focus, but acknowledge event and thus stop it
58942      // - undefined: do nothing, let the event propagate.
58943      if (eventToOffset) {
58944        return eventToOffset(evt);
58945      }
58946      return undefined;
58947    };
58948    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(container, {
58949      ref: ref,
58950      stopNavigationEvents: true,
58951      onlyBrowserTabstops: true,
58952      eventToOffset: innerEventToOffset,
58953      ...props
58954    });
58955  }
58956  
58957  /**
58958   * A container for tabbable elements.
58959   *
58960   *  ```jsx
58961   *  import {
58962   *    TabbableContainer,
58963   *    Button,
58964   *  } from '@wordpress/components';
58965   *
58966   *  function onNavigate( index, target ) {
58967   *    console.log( `Navigates to ${ index }`, target );
58968   *  }
58969   *
58970   *  const MyTabbableContainer = () => (
58971   *    <div>
58972   *      <span>Tabbable Container:</span>
58973   *      <TabbableContainer onNavigate={ onNavigate }>
58974   *        <Button variant="secondary" tabIndex="0">
58975   *          Section 1
58976   *        </Button>
58977   *        <Button variant="secondary" tabIndex="0">
58978   *          Section 2
58979   *        </Button>
58980   *        <Button variant="secondary" tabIndex="0">
58981   *          Section 3
58982   *        </Button>
58983   *        <Button variant="secondary" tabIndex="0">
58984   *          Section 4
58985   *        </Button>
58986   *      </TabbableContainer>
58987   *    </div>
58988   *  );
58989   *  ```
58990   */
58991  const TabbableContainer = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedTabbableContainer);
58992  /* harmony default export */ const tabbable = (TabbableContainer);
58993  
58994  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/navigation/constants.js
58995  const ROOT_MENU = 'root';
58996  const SEARCH_FOCUS_DELAY = 100;
58997  
58998  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/navigation/context.js
58999  /**
59000   * WordPress dependencies
59001   */
59002  
59003  
59004  /**
59005   * Internal dependencies
59006   */
59007  
59008  const context_noop = () => {};
59009  const defaultIsEmpty = () => false;
59010  const defaultGetter = () => undefined;
59011  const NavigationContext = (0,external_wp_element_namespaceObject.createContext)({
59012    activeItem: undefined,
59013    activeMenu: ROOT_MENU,
59014    setActiveMenu: context_noop,
59015    navigationTree: {
59016      items: {},
59017      getItem: defaultGetter,
59018      addItem: context_noop,
59019      removeItem: context_noop,
59020      menus: {},
59021      getMenu: defaultGetter,
59022      addMenu: context_noop,
59023      removeMenu: context_noop,
59024      childMenu: {},
59025      traverseMenu: context_noop,
59026      isMenuEmpty: defaultIsEmpty
59027    }
59028  });
59029  const useNavigationContext = () => (0,external_wp_element_namespaceObject.useContext)(NavigationContext);
59030  
59031  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/navigation/styles/navigation-styles.js
59032  
59033  function navigation_styles_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)."; }
59034  /**
59035   * External dependencies
59036   */
59037  
59038  /**
59039   * WordPress dependencies
59040   */
59041  
59042  
59043  /**
59044   * Internal dependencies
59045   */
59046  
59047  
59048  
59049  
59050  
59051  
59052  const NavigationUI = /*#__PURE__*/emotion_styled_base_browser_esm("div",  true ? {
59053    target: "eeiismy11"
59054  } : 0)("width:100%;box-sizing:border-box;padding:0 ", space(4), ";overflow:hidden;" + ( true ? "" : 0));
59055  const MenuUI = /*#__PURE__*/emotion_styled_base_browser_esm("div",  true ? {
59056    target: "eeiismy10"
59057  } : 0)("margin-top:", space(6), ";margin-bottom:", space(6), ";display:flex;flex-direction:column;ul{padding:0;margin:0;list-style:none;}.components-navigation__back-button{margin-bottom:", space(6), ";}.components-navigation__group+.components-navigation__group{margin-top:", space(6), ";}" + ( true ? "" : 0));
59058  const MenuBackButtonUI = /*#__PURE__*/emotion_styled_base_browser_esm(build_module_button,  true ? {
59059    target: "eeiismy9"
59060  } : 0)( true ? {
59061    name: "26l0q2",
59062    styles: "&.is-tertiary{color:inherit;opacity:0.7;&:hover:not( :disabled ){opacity:1;box-shadow:none;color:inherit;}&:active:not( :disabled ){background:transparent;opacity:1;color:inherit;}}"
59063  } : 0);
59064  const MenuTitleUI = /*#__PURE__*/emotion_styled_base_browser_esm("div",  true ? {
59065    target: "eeiismy8"
59066  } : 0)( true ? {
59067    name: "1aubja5",
59068    styles: "overflow:hidden;width:100%"
59069  } : 0);
59070  const MenuTitleSearchControlWrapper = /*#__PURE__*/emotion_styled_base_browser_esm("div",  true ? {
59071    target: "eeiismy7"
59072  } : 0)( true ? {
59073    name: "rgorny",
59074    styles: "margin:11px 0;padding:1px"
59075  } : 0);
59076  const MenuTitleActionsUI = /*#__PURE__*/emotion_styled_base_browser_esm("span",  true ? {
59077    target: "eeiismy6"
59078  } : 0)("height:", space(6), ";.components-button.is-small{color:inherit;opacity:0.7;margin-right:", space(1), ";padding:0;&:active:not( :disabled ){background:none;opacity:1;color:inherit;}&:hover:not( :disabled ){box-shadow:none;opacity:1;color:inherit;}}" + ( true ? "" : 0));
59079  const GroupTitleUI = /*#__PURE__*/emotion_styled_base_browser_esm(heading_component,  true ? {
59080    target: "eeiismy5"
59081  } : 0)("min-height:", space(12), ";align-items:center;color:inherit;display:flex;justify-content:space-between;margin-bottom:", space(2), ";padding:", () => (0,external_wp_i18n_namespaceObject.isRTL)() ? `$space(1)} $space(4)} $space(1)} $space(2)}` : `$space(1)} $space(2)} $space(1)} $space(4)}`, ";" + ( true ? "" : 0));
59082  const ItemBaseUI = /*#__PURE__*/emotion_styled_base_browser_esm("li",  true ? {
59083    target: "eeiismy4"
59084  } : 0)("border-radius:", config_values.radiusSmall, ";color:inherit;margin-bottom:0;>button,>a.components-button,>a{width:100%;color:inherit;opacity:0.7;padding:", space(2), " ", space(4), ";", rtl({
59085    textAlign: 'left'
59086  }, {
59087    textAlign: 'right'
59088  }), " &:hover,&:focus:not( [aria-disabled='true'] ):active,&:active:not( [aria-disabled='true'] ):active{color:inherit;opacity:1;}}&.is-active{background-color:", COLORS.theme.accent, ";color:", COLORS.white, ";>button,>a{color:", COLORS.white, ";opacity:1;}}>svg path{color:", COLORS.gray[600], ";}" + ( true ? "" : 0));
59089  const ItemUI = /*#__PURE__*/emotion_styled_base_browser_esm("div",  true ? {
59090    target: "eeiismy3"
59091  } : 0)("display:flex;align-items:center;height:auto;min-height:40px;margin:0;padding:", space(1.5), " ", space(4), ";font-weight:400;line-height:20px;width:100%;color:inherit;opacity:0.7;" + ( true ? "" : 0));
59092  const ItemIconUI = /*#__PURE__*/emotion_styled_base_browser_esm("span",  true ? {
59093    target: "eeiismy2"
59094  } : 0)("display:flex;margin-right:", space(2), ";" + ( true ? "" : 0));
59095  const ItemBadgeUI = /*#__PURE__*/emotion_styled_base_browser_esm("span",  true ? {
59096    target: "eeiismy1"
59097  } : 0)("margin-left:", () => (0,external_wp_i18n_namespaceObject.isRTL)() ? '0' : space(2), ";margin-right:", () => (0,external_wp_i18n_namespaceObject.isRTL)() ? space(2) : '0', ";display:inline-flex;padding:", space(1), " ", space(3), ";border-radius:", config_values.radiusSmall, ";@keyframes fade-in{from{opacity:0;}to{opacity:1;}}@media not ( prefers-reduced-motion ){animation:fade-in 250ms ease-out;}" + ( true ? "" : 0));
59098  const ItemTitleUI = /*#__PURE__*/emotion_styled_base_browser_esm(text_component,  true ? {
59099    target: "eeiismy0"
59100  } : 0)(() => (0,external_wp_i18n_namespaceObject.isRTL)() ? 'margin-left: auto;' : 'margin-right: auto;', " font-size:14px;line-height:20px;color:inherit;" + ( true ? "" : 0));
59101  
59102  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/navigation/use-navigation-tree-nodes.js
59103  /**
59104   * WordPress dependencies
59105   */
59106  
59107  function useNavigationTreeNodes() {
59108    const [nodes, setNodes] = (0,external_wp_element_namespaceObject.useState)({});
59109    const getNode = key => nodes[key];
59110    const addNode = (key, value) => {
59111      const {
59112        children,
59113        ...newNode
59114      } = value;
59115      return setNodes(original => ({
59116        ...original,
59117        [key]: newNode
59118      }));
59119    };
59120    const removeNode = key => {
59121      return setNodes(original => {
59122        const {
59123          [key]: removedNode,
59124          ...remainingNodes
59125        } = original;
59126        return remainingNodes;
59127      });
59128    };
59129    return {
59130      nodes,
59131      getNode,
59132      addNode,
59133      removeNode
59134    };
59135  }
59136  
59137  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/navigation/use-create-navigation-tree.js
59138  /**
59139   * WordPress dependencies
59140   */
59141  
59142  
59143  /**
59144   * Internal dependencies
59145   */
59146  
59147  const useCreateNavigationTree = () => {
59148    const {
59149      nodes: items,
59150      getNode: getItem,
59151      addNode: addItem,
59152      removeNode: removeItem
59153    } = useNavigationTreeNodes();
59154    const {
59155      nodes: menus,
59156      getNode: getMenu,
59157      addNode: addMenu,
59158      removeNode: removeMenu
59159    } = useNavigationTreeNodes();
59160  
59161    /**
59162     * Stores direct nested menus of menus
59163     * This makes it easy to traverse menu tree
59164     *
59165     * Key is the menu prop of the menu
59166     * Value is an array of menu keys
59167     */
59168    const [childMenu, setChildMenu] = (0,external_wp_element_namespaceObject.useState)({});
59169    const getChildMenu = menu => childMenu[menu] || [];
59170    const traverseMenu = (startMenu, callback) => {
59171      const visited = [];
59172      let queue = [startMenu];
59173      let current;
59174      while (queue.length > 0) {
59175        // Type cast to string is safe because of the `length > 0` check above.
59176        current = getMenu(queue.shift());
59177        if (!current || visited.includes(current.menu)) {
59178          continue;
59179        }
59180        visited.push(current.menu);
59181        queue = [...queue, ...getChildMenu(current.menu)];
59182        if (callback(current) === false) {
59183          break;
59184        }
59185      }
59186    };
59187    const isMenuEmpty = menuToCheck => {
59188      let isEmpty = true;
59189      traverseMenu(menuToCheck, current => {
59190        if (!current.isEmpty) {
59191          isEmpty = false;
59192          return false;
59193        }
59194        return undefined;
59195      });
59196      return isEmpty;
59197    };
59198    return {
59199      items,
59200      getItem,
59201      addItem,
59202      removeItem,
59203      menus,
59204      getMenu,
59205      addMenu: (key, value) => {
59206        setChildMenu(state => {
59207          const newState = {
59208            ...state
59209          };
59210          if (!value.parentMenu) {
59211            return newState;
59212          }
59213          if (!newState[value.parentMenu]) {
59214            newState[value.parentMenu] = [];
59215          }
59216          newState[value.parentMenu].push(key);
59217          return newState;
59218        });
59219        addMenu(key, value);
59220      },
59221      removeMenu,
59222      childMenu,
59223      traverseMenu,
59224      isMenuEmpty
59225    };
59226  };
59227  
59228  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/navigation/index.js
59229  /**
59230   * External dependencies
59231   */
59232  
59233  
59234  /**
59235   * WordPress dependencies
59236   */
59237  
59238  
59239  
59240  /**
59241   * Internal dependencies
59242   */
59243  
59244  
59245  
59246  
59247  
59248  
59249  const navigation_noop = () => {};
59250  
59251  /**
59252   * Render a navigation list with optional groupings and hierarchy.
59253   *
59254   * @deprecated Use `Navigator` instead.
59255   *
59256   * ```jsx
59257   * import {
59258   *   __experimentalNavigation as Navigation,
59259   *   __experimentalNavigationGroup as NavigationGroup,
59260   *   __experimentalNavigationItem as NavigationItem,
59261   *   __experimentalNavigationMenu as NavigationMenu,
59262   * } from '@wordpress/components';
59263   *
59264   * const MyNavigation = () => (
59265   *   <Navigation>
59266   *     <NavigationMenu title="Home">
59267   *       <NavigationGroup title="Group 1">
59268   *         <NavigationItem item="item-1" title="Item 1" />
59269   *         <NavigationItem item="item-2" title="Item 2" />
59270   *       </NavigationGroup>
59271   *       <NavigationGroup title="Group 2">
59272   *         <NavigationItem
59273   *           item="item-3"
59274   *           navigateToMenu="category"
59275   *           title="Category"
59276   *         />
59277   *       </NavigationGroup>
59278   *     </NavigationMenu>
59279   *
59280   *     <NavigationMenu
59281   *       backButtonLabel="Home"
59282   *       menu="category"
59283   *       parentMenu="root"
59284   *       title="Category"
59285   *     >
59286   *       <NavigationItem badge="1" item="child-1" title="Child 1" />
59287   *       <NavigationItem item="child-2" title="Child 2" />
59288   *     </NavigationMenu>
59289   *   </Navigation>
59290   * );
59291   * ```
59292   */
59293  function Navigation({
59294    activeItem,
59295    activeMenu = ROOT_MENU,
59296    children,
59297    className,
59298    onActivateMenu = navigation_noop
59299  }) {
59300    const [menu, setMenu] = (0,external_wp_element_namespaceObject.useState)(activeMenu);
59301    const [slideOrigin, setSlideOrigin] = (0,external_wp_element_namespaceObject.useState)();
59302    const navigationTree = useCreateNavigationTree();
59303    const defaultSlideOrigin = (0,external_wp_i18n_namespaceObject.isRTL)() ? 'right' : 'left';
59304    const setActiveMenu = (menuId, slideInOrigin = defaultSlideOrigin) => {
59305      if (!navigationTree.getMenu(menuId)) {
59306        return;
59307      }
59308      setSlideOrigin(slideInOrigin);
59309      setMenu(menuId);
59310      onActivateMenu(menuId);
59311    };
59312  
59313    // Used to prevent the sliding animation on mount
59314    const isMountedRef = (0,external_wp_element_namespaceObject.useRef)(false);
59315    (0,external_wp_element_namespaceObject.useEffect)(() => {
59316      if (!isMountedRef.current) {
59317        isMountedRef.current = true;
59318      }
59319    }, []);
59320    (0,external_wp_element_namespaceObject.useEffect)(() => {
59321      if (activeMenu !== menu) {
59322        setActiveMenu(activeMenu);
59323      }
59324      // Ignore exhaustive-deps here, as it would require either a larger refactor or some questionable workarounds.
59325      // See https://github.com/WordPress/gutenberg/pull/41612 for context.
59326      // eslint-disable-next-line react-hooks/exhaustive-deps
59327    }, [activeMenu]);
59328    const context = {
59329      activeItem,
59330      activeMenu: menu,
59331      setActiveMenu,
59332      navigationTree
59333    };
59334    const classes = dist_clsx('components-navigation', className);
59335    const animateClassName = getAnimateClassName({
59336      type: 'slide-in',
59337      origin: slideOrigin
59338    });
59339    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(NavigationUI, {
59340      className: classes,
59341      children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", {
59342        className: animateClassName ? dist_clsx({
59343          [animateClassName]: isMountedRef.current && slideOrigin
59344        }) : undefined,
59345        children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(NavigationContext.Provider, {
59346          value: context,
59347          children: children
59348        })
59349      }, menu)
59350    });
59351  }
59352  /* harmony default export */ const navigation = (Navigation);
59353  
59354  ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/chevron-right.js
59355  /**
59356   * WordPress dependencies
59357   */
59358  
59359  
59360  const chevronRight = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, {
59361    xmlns: "http://www.w3.org/2000/svg",
59362    viewBox: "0 0 24 24",
59363    children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, {
59364      d: "M10.6 6L9.4 7l4.6 5-4.6 5 1.2 1 5.4-6z"
59365    })
59366  });
59367  /* harmony default export */ const chevron_right = (chevronRight);
59368  
59369  ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/chevron-left.js
59370  /**
59371   * WordPress dependencies
59372   */
59373  
59374  
59375  const chevronLeft = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, {
59376    xmlns: "http://www.w3.org/2000/svg",
59377    viewBox: "0 0 24 24",
59378    children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, {
59379      d: "M14.6 7l-1.2-1L8 12l5.4 6 1.2-1-4.6-5z"
59380    })
59381  });
59382  /* harmony default export */ const chevron_left = (chevronLeft);
59383  
59384  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/navigation/back-button/index.js
59385  /**
59386   * External dependencies
59387   */
59388  
59389  /**
59390   * WordPress dependencies
59391   */
59392  
59393  
59394  
59395  
59396  /**
59397   * Internal dependencies
59398   */
59399  
59400  
59401  
59402  
59403  function UnforwardedNavigationBackButton({
59404    backButtonLabel,
59405    className,
59406    href,
59407    onClick,
59408    parentMenu
59409  }, ref) {
59410    const {
59411      setActiveMenu,
59412      navigationTree
59413    } = useNavigationContext();
59414    const classes = dist_clsx('components-navigation__back-button', className);
59415    const parentMenuTitle = parentMenu !== undefined ? navigationTree.getMenu(parentMenu)?.title : undefined;
59416    const handleOnClick = event => {
59417      if (typeof onClick === 'function') {
59418        onClick(event);
59419      }
59420      const animationDirection = (0,external_wp_i18n_namespaceObject.isRTL)() ? 'left' : 'right';
59421      if (parentMenu && !event.defaultPrevented) {
59422        setActiveMenu(parentMenu, animationDirection);
59423      }
59424    };
59425    const icon = (0,external_wp_i18n_namespaceObject.isRTL)() ? chevron_right : chevron_left;
59426    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(MenuBackButtonUI, {
59427      className: classes,
59428      href: href,
59429      variant: "tertiary",
59430      ref: ref,
59431      onClick: handleOnClick,
59432      children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(icons_build_module_icon, {
59433        icon: icon
59434      }), backButtonLabel || parentMenuTitle || (0,external_wp_i18n_namespaceObject.__)('Back')]
59435    });
59436  }
59437  
59438  /**
59439   * @deprecated Use `Navigator` instead.
59440   */
59441  const NavigationBackButton = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedNavigationBackButton);
59442  /* harmony default export */ const back_button = (NavigationBackButton);
59443  
59444  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/navigation/group/context.js
59445  /**
59446   * WordPress dependencies
59447   */
59448  
59449  
59450  /**
59451   * Internal dependencies
59452   */
59453  
59454  const NavigationGroupContext = (0,external_wp_element_namespaceObject.createContext)({
59455    group: undefined
59456  });
59457  const useNavigationGroupContext = () => (0,external_wp_element_namespaceObject.useContext)(NavigationGroupContext);
59458  
59459  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/navigation/group/index.js
59460  /**
59461   * External dependencies
59462   */
59463  
59464  
59465  /**
59466   * WordPress dependencies
59467   */
59468  
59469  
59470  /**
59471   * Internal dependencies
59472   */
59473  
59474  
59475  
59476  
59477  
59478  let uniqueId = 0;
59479  
59480  /**
59481   * @deprecated Use `Navigator` instead.
59482   */
59483  function NavigationGroup({
59484    children,
59485    className,
59486    title
59487  }) {
59488    const [groupId] = (0,external_wp_element_namespaceObject.useState)(`group-${++uniqueId}`);
59489    const {
59490      navigationTree: {
59491        items
59492      }
59493    } = useNavigationContext();
59494    const context = {
59495      group: groupId
59496    };
59497  
59498    // Keep the children rendered to make sure invisible items are included in the navigation tree.
59499    if (!Object.values(items).some(item => item.group === groupId && item._isVisible)) {
59500      return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(NavigationGroupContext.Provider, {
59501        value: context,
59502        children: children
59503      });
59504    }
59505    const groupTitleId = `components-navigation__group-title-$groupId}`;
59506    const classes = dist_clsx('components-navigation__group', className);
59507    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(NavigationGroupContext.Provider, {
59508      value: context,
59509      children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("li", {
59510        className: classes,
59511        children: [title && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(GroupTitleUI, {
59512          className: "components-navigation__group-title",
59513          id: groupTitleId,
59514          level: 3,
59515          children: title
59516        }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("ul", {
59517          "aria-labelledby": groupTitleId,
59518          role: "group",
59519          children: children
59520        })]
59521      })
59522    });
59523  }
59524  /* harmony default export */ const group = (NavigationGroup);
59525  
59526  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/navigation/item/base-content.js
59527  /**
59528   * Internal dependencies
59529   */
59530  
59531  
59532  
59533  
59534  function NavigationItemBaseContent(props) {
59535    const {
59536      badge,
59537      title
59538    } = props;
59539    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, {
59540      children: [title && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ItemTitleUI, {
59541        className: "components-navigation__item-title",
59542        as: "span",
59543        children: title
59544      }), badge && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ItemBadgeUI, {
59545        className: "components-navigation__item-badge",
59546        children: badge
59547      })]
59548    });
59549  }
59550  
59551  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/navigation/menu/context.js
59552  /**
59553   * WordPress dependencies
59554   */
59555  
59556  
59557  /**
59558   * Internal dependencies
59559   */
59560  
59561  const NavigationMenuContext = (0,external_wp_element_namespaceObject.createContext)({
59562    menu: undefined,
59563    search: ''
59564  });
59565  const useNavigationMenuContext = () => (0,external_wp_element_namespaceObject.useContext)(NavigationMenuContext);
59566  
59567  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/navigation/utils.js
59568  /**
59569   * External dependencies
59570   */
59571  
59572  
59573  // @see packages/block-editor/src/components/inserter/search-items.js
59574  const normalizeInput = input => remove_accents_default()(input).replace(/^\//, '').toLowerCase();
59575  const normalizedSearch = (title, search) => -1 !== normalizeInput(title).indexOf(normalizeInput(search));
59576  
59577  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/navigation/item/use-navigation-tree-item.js
59578  /**
59579   * WordPress dependencies
59580   */
59581  
59582  
59583  /**
59584   * Internal dependencies
59585   */
59586  
59587  
59588  
59589  
59590  const useNavigationTreeItem = (itemId, props) => {
59591    const {
59592      activeMenu,
59593      navigationTree: {
59594        addItem,
59595        removeItem
59596      }
59597    } = useNavigationContext();
59598    const {
59599      group
59600    } = useNavigationGroupContext();
59601    const {
59602      menu,
59603      search
59604    } = useNavigationMenuContext();
59605    (0,external_wp_element_namespaceObject.useEffect)(() => {
59606      const isMenuActive = activeMenu === menu;
59607      const isItemVisible = !search || props.title !== undefined && normalizedSearch(props.title, search);
59608      addItem(itemId, {
59609        ...props,
59610        group,
59611        menu,
59612        _isVisible: isMenuActive && isItemVisible
59613      });
59614      return () => {
59615        removeItem(itemId);
59616      };
59617      // Ignore exhaustive-deps rule for now. See https://github.com/WordPress/gutenberg/pull/41639
59618      // eslint-disable-next-line react-hooks/exhaustive-deps
59619    }, [activeMenu, search]);
59620  };
59621  
59622  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/navigation/item/base.js
59623  /**
59624   * External dependencies
59625   */
59626  
59627  
59628  /**
59629   * WordPress dependencies
59630   */
59631  
59632  
59633  /**
59634   * Internal dependencies
59635   */
59636  
59637  
59638  
59639  
59640  let base_uniqueId = 0;
59641  function NavigationItemBase(props) {
59642    // Also avoid to pass the `title` and `href` props to the ItemBaseUI styled component.
59643    const {
59644      children,
59645      className,
59646      title,
59647      href,
59648      ...restProps
59649    } = props;
59650    const [itemId] = (0,external_wp_element_namespaceObject.useState)(`item-${++base_uniqueId}`);
59651    useNavigationTreeItem(itemId, props);
59652    const {
59653      navigationTree
59654    } = useNavigationContext();
59655    if (!navigationTree.getItem(itemId)?._isVisible) {
59656      return null;
59657    }
59658    const classes = dist_clsx('components-navigation__item', className);
59659    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ItemBaseUI, {
59660      className: classes,
59661      ...restProps,
59662      children: children
59663    });
59664  }
59665  
59666  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/navigation/item/index.js
59667  /**
59668   * External dependencies
59669   */
59670  
59671  
59672  /**
59673   * WordPress dependencies
59674   */
59675  
59676  
59677  
59678  /**
59679   * Internal dependencies
59680   */
59681  
59682  
59683  
59684  
59685  
59686  
59687  
59688  const item_noop = () => {};
59689  
59690  /**
59691   * @deprecated Use `Navigator` instead.
59692   */
59693  function NavigationItem(props) {
59694    const {
59695      badge,
59696      children,
59697      className,
59698      href,
59699      item,
59700      navigateToMenu,
59701      onClick = item_noop,
59702      title,
59703      icon,
59704      hideIfTargetMenuEmpty,
59705      isText,
59706      ...restProps
59707    } = props;
59708    const {
59709      activeItem,
59710      setActiveMenu,
59711      navigationTree: {
59712        isMenuEmpty
59713      }
59714    } = useNavigationContext();
59715  
59716    // If hideIfTargetMenuEmpty prop is true
59717    // And the menu we are supposed to navigate to
59718    // Is marked as empty, then we skip rendering the item.
59719    if (hideIfTargetMenuEmpty && navigateToMenu && isMenuEmpty(navigateToMenu)) {
59720      return null;
59721    }
59722    const isActive = item && activeItem === item;
59723    const classes = dist_clsx(className, {
59724      'is-active': isActive
59725    });
59726    const onItemClick = event => {
59727      if (navigateToMenu) {
59728        setActiveMenu(navigateToMenu);
59729      }
59730      onClick(event);
59731    };
59732    const navigationIcon = (0,external_wp_i18n_namespaceObject.isRTL)() ? chevron_left : chevron_right;
59733    const baseProps = children ? props : {
59734      ...props,
59735      onClick: undefined
59736    };
59737    const itemProps = isText ? restProps : {
59738      as: build_module_button,
59739      href,
59740      onClick: onItemClick,
59741      'aria-current': isActive ? 'page' : undefined,
59742      ...restProps
59743    };
59744    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(NavigationItemBase, {
59745      ...baseProps,
59746      className: classes,
59747      children: children || /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(ItemUI, {
59748        ...itemProps,
59749        children: [icon && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ItemIconUI, {
59750          children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(icons_build_module_icon, {
59751            icon: icon
59752          })
59753        }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(NavigationItemBaseContent, {
59754          title: title,
59755          badge: badge
59756        }), navigateToMenu && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(icons_build_module_icon, {
59757          icon: navigationIcon
59758        })]
59759      })
59760    });
59761  }
59762  /* harmony default export */ const navigation_item = (NavigationItem);
59763  
59764  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/navigation/menu/use-navigation-tree-menu.js
59765  /**
59766   * WordPress dependencies
59767   */
59768  
59769  
59770  /**
59771   * Internal dependencies
59772   */
59773  
59774  
59775  const useNavigationTreeMenu = props => {
59776    const {
59777      navigationTree: {
59778        addMenu,
59779        removeMenu
59780      }
59781    } = useNavigationContext();
59782    const key = props.menu || ROOT_MENU;
59783    (0,external_wp_element_namespaceObject.useEffect)(() => {
59784      addMenu(key, {
59785        ...props,
59786        menu: key
59787      });
59788      return () => {
59789        removeMenu(key);
59790      };
59791      // Ignore exhaustive-deps rule for now. See https://github.com/WordPress/gutenberg/pull/44090
59792      // eslint-disable-next-line react-hooks/exhaustive-deps
59793    }, []);
59794  };
59795  
59796  ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/search.js
59797  /**
59798   * WordPress dependencies
59799   */
59800  
59801  
59802  const search = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, {
59803    xmlns: "http://www.w3.org/2000/svg",
59804    viewBox: "0 0 24 24",
59805    children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, {
59806      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"
59807    })
59808  });
59809  /* harmony default export */ const library_search = (search);
59810  
59811  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/higher-order/with-spoken-messages/index.js
59812  /**
59813   * WordPress dependencies
59814   */
59815  
59816  
59817  
59818  /** @typedef {import('react').ComponentType} ComponentType */
59819  
59820  /**
59821   * A Higher Order Component used to provide speak and debounced speak functions.
59822   *
59823   * @see https://developer.wordpress.org/block-editor/packages/packages-a11y/#speak
59824   *
59825   * @param {ComponentType} Component The component to be wrapped.
59826   *
59827   * @return {ComponentType} The wrapped component.
59828   */
59829  
59830  /* harmony default export */ const with_spoken_messages = ((0,external_wp_compose_namespaceObject.createHigherOrderComponent)(Component => props => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Component, {
59831    ...props,
59832    speak: external_wp_a11y_namespaceObject.speak,
59833    debouncedSpeak: (0,external_wp_compose_namespaceObject.useDebounce)(external_wp_a11y_namespaceObject.speak, 500)
59834  }), 'withSpokenMessages'));
59835  
59836  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/search-control/styles.js
59837  
59838  /**
59839   * External dependencies
59840   */
59841  
59842  /**
59843   * Internal dependencies
59844   */
59845  
59846  
59847  
59848  const inlinePadding = ({
59849    size
59850  }) => {
59851    return space(size === 'compact' ? 1 : 2);
59852  };
59853  const SuffixItemWrapper = /*#__PURE__*/emotion_styled_base_browser_esm("div",  true ? {
59854    target: "effl84m1"
59855  } : 0)("display:flex;padding-inline-end:", inlinePadding, ";svg{fill:currentColor;}" + ( true ? "" : 0));
59856  const StyledInputControl = /*#__PURE__*/emotion_styled_base_browser_esm(input_control,  true ? {
59857    target: "effl84m0"
59858  } : 0)("input[type='search']{&::-webkit-search-decoration,&::-webkit-search-cancel-button,&::-webkit-search-results-button,&::-webkit-search-results-decoration{-webkit-appearance:none;}}&:not( :focus-within ){--wp-components-color-background:", COLORS.theme.gray[100], ";}" + ( true ? "" : 0));
59859  
59860  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/search-control/index.js
59861  /**
59862   * External dependencies
59863   */
59864  
59865  
59866  /**
59867   * WordPress dependencies
59868   */
59869  
59870  
59871  
59872  
59873  
59874  /**
59875   * Internal dependencies
59876   */
59877  
59878  
59879  
59880  
59881  function SuffixItem({
59882    searchRef,
59883    value,
59884    onChange,
59885    onClose
59886  }) {
59887    if (!onClose && !value) {
59888      return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(icons_build_module_icon, {
59889        icon: library_search
59890      });
59891    }
59892    const onReset = () => {
59893      onChange('');
59894      searchRef.current?.focus();
59895    };
59896    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, {
59897      size: "small",
59898      icon: close_small,
59899      label: onClose ? (0,external_wp_i18n_namespaceObject.__)('Close search') : (0,external_wp_i18n_namespaceObject.__)('Reset search'),
59900      onClick: onClose !== null && onClose !== void 0 ? onClose : onReset
59901    });
59902  }
59903  function UnforwardedSearchControl({
59904    __nextHasNoMarginBottom = false,
59905    className,
59906    onChange,
59907    value,
59908    label = (0,external_wp_i18n_namespaceObject.__)('Search'),
59909    placeholder = (0,external_wp_i18n_namespaceObject.__)('Search'),
59910    hideLabelFromVision = true,
59911    onClose,
59912    size = 'default',
59913    ...restProps
59914  }, forwardedRef) {
59915    // @ts-expect-error The `disabled` prop is not yet supported in the SearchControl component.
59916    // Work with the design team (@WordPress/gutenberg-design) if you need this feature.
59917    delete restProps.disabled;
59918    const searchRef = (0,external_wp_element_namespaceObject.useRef)(null);
59919    const instanceId = (0,external_wp_compose_namespaceObject.useInstanceId)(SearchControl, 'components-search-control');
59920    const contextValue = (0,external_wp_element_namespaceObject.useMemo)(() => ({
59921      BaseControl: {
59922        // Overrides the underlying BaseControl `__nextHasNoMarginBottom` via the context system
59923        // to provide backwards compatibile margin for SearchControl.
59924        // (In a standard InputControl, the BaseControl `__nextHasNoMarginBottom` is always set to true.)
59925        _overrides: {
59926          __nextHasNoMarginBottom
59927        },
59928        __associatedWPComponentName: 'SearchControl'
59929      },
59930      // `isBorderless` is still experimental and not a public prop for InputControl yet.
59931      InputBase: {
59932        isBorderless: true
59933      }
59934    }), [__nextHasNoMarginBottom]);
59935    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ContextSystemProvider, {
59936      value: contextValue,
59937      children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(StyledInputControl, {
59938        __next40pxDefaultSize: true,
59939        id: instanceId,
59940        hideLabelFromVision: hideLabelFromVision,
59941        label: label,
59942        ref: (0,external_wp_compose_namespaceObject.useMergeRefs)([searchRef, forwardedRef]),
59943        type: "search",
59944        size: size,
59945        className: dist_clsx('components-search-control', className),
59946        onChange: nextValue => onChange(nextValue !== null && nextValue !== void 0 ? nextValue : ''),
59947        autoComplete: "off",
59948        placeholder: placeholder,
59949        value: value !== null && value !== void 0 ? value : '',
59950        suffix: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(SuffixItemWrapper, {
59951          size: size,
59952          children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(SuffixItem, {
59953            searchRef: searchRef,
59954            value: value,
59955            onChange: onChange,
59956            onClose: onClose
59957          })
59958        }),
59959        ...restProps
59960      })
59961    });
59962  }
59963  
59964  /**
59965   * SearchControl components let users display a search control.
59966   *
59967   * ```jsx
59968   * import { SearchControl } from '@wordpress/components';
59969   * import { useState } from '@wordpress/element';
59970   *
59971   * function MySearchControl( { className, setState } ) {
59972   *   const [ searchInput, setSearchInput ] = useState( '' );
59973   *
59974   *   return (
59975   *     <SearchControl
59976   *       __nextHasNoMarginBottom
59977   *       value={ searchInput }
59978   *       onChange={ setSearchInput }
59979   *     />
59980   *   );
59981   * }
59982   * ```
59983   */
59984  const SearchControl = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedSearchControl);
59985  /* harmony default export */ const search_control = (SearchControl);
59986  
59987  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/navigation/menu/menu-title-search.js
59988  /**
59989   * WordPress dependencies
59990   */
59991  
59992  
59993  
59994  /**
59995   * Internal dependencies
59996   */
59997  
59998  
59999  
60000  
60001  
60002  
60003  
60004  function MenuTitleSearch({
60005    debouncedSpeak,
60006    onCloseSearch,
60007    onSearch,
60008    search,
60009    title
60010  }) {
60011    const {
60012      navigationTree: {
60013        items
60014      }
60015    } = useNavigationContext();
60016    const {
60017      menu
60018    } = useNavigationMenuContext();
60019    const inputRef = (0,external_wp_element_namespaceObject.useRef)(null);
60020  
60021    // Wait for the slide-in animation to complete before autofocusing the input.
60022    // This prevents scrolling to the input during the animation.
60023    (0,external_wp_element_namespaceObject.useEffect)(() => {
60024      const delayedFocus = setTimeout(() => {
60025        inputRef.current?.focus();
60026      }, SEARCH_FOCUS_DELAY);
60027      return () => {
60028        clearTimeout(delayedFocus);
60029      };
60030    }, []);
60031    (0,external_wp_element_namespaceObject.useEffect)(() => {
60032      if (!search) {
60033        return;
60034      }
60035      const count = Object.values(items).filter(item => item._isVisible).length;
60036      const resultsFoundMessage = (0,external_wp_i18n_namespaceObject.sprintf)( /* translators: %d: number of results. */
60037      (0,external_wp_i18n_namespaceObject._n)('%d result found.', '%d results found.', count), count);
60038      debouncedSpeak(resultsFoundMessage);
60039      // Ignore exhaustive-deps rule for now. See https://github.com/WordPress/gutenberg/pull/44090
60040      // eslint-disable-next-line react-hooks/exhaustive-deps
60041    }, [items, search]);
60042    const onClose = () => {
60043      onSearch?.('');
60044      onCloseSearch();
60045    };
60046    const onKeyDown = event => {
60047      if (event.code === 'Escape' && !event.defaultPrevented) {
60048        event.preventDefault();
60049        onClose();
60050      }
60051    };
60052    const inputId = `components-navigation__menu-title-search-$menu}`;
60053    const placeholder = (0,external_wp_i18n_namespaceObject.sprintf)( /* translators: placeholder for menu search box. %s: menu title */
60054    (0,external_wp_i18n_namespaceObject.__)('Search %s'), title?.toLowerCase()).trim();
60055    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(MenuTitleSearchControlWrapper, {
60056      children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(search_control, {
60057        __nextHasNoMarginBottom: true,
60058        className: "components-navigation__menu-search-input",
60059        id: inputId,
60060        onChange: value => onSearch?.(value),
60061        onKeyDown: onKeyDown,
60062        placeholder: placeholder,
60063        onClose: onClose,
60064        ref: inputRef,
60065        value: search
60066      })
60067    });
60068  }
60069  /* harmony default export */ const menu_title_search = (with_spoken_messages(MenuTitleSearch));
60070  
60071  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/navigation/menu/menu-title.js
60072  /**
60073   * WordPress dependencies
60074   */
60075  
60076  
60077  
60078  
60079  /**
60080   * Internal dependencies
60081   */
60082  
60083  
60084  
60085  
60086  
60087  
60088  
60089  
60090  function NavigationMenuTitle({
60091    hasSearch,
60092    onSearch,
60093    search,
60094    title,
60095    titleAction
60096  }) {
60097    const [isSearching, setIsSearching] = (0,external_wp_element_namespaceObject.useState)(false);
60098    const {
60099      menu
60100    } = useNavigationMenuContext();
60101    const searchButtonRef = (0,external_wp_element_namespaceObject.useRef)(null);
60102    if (!title) {
60103      return null;
60104    }
60105    const onCloseSearch = () => {
60106      setIsSearching(false);
60107  
60108      // Wait for the slide-in animation to complete before focusing the search button.
60109      // eslint-disable-next-line @wordpress/react-no-unsafe-timeout
60110      setTimeout(() => {
60111        searchButtonRef.current?.focus();
60112      }, SEARCH_FOCUS_DELAY);
60113    };
60114    const menuTitleId = `components-navigation__menu-title-$menu}`;
60115    /* translators: search button label for menu search box. %s: menu title */
60116    const searchButtonLabel = (0,external_wp_i18n_namespaceObject.sprintf)((0,external_wp_i18n_namespaceObject.__)('Search in %s'), title);
60117    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(MenuTitleUI, {
60118      className: "components-navigation__menu-title",
60119      children: [!isSearching && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(GroupTitleUI, {
60120        as: "h2",
60121        className: "components-navigation__menu-title-heading",
60122        level: 3,
60123        children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", {
60124          id: menuTitleId,
60125          children: title
60126        }), (hasSearch || titleAction) && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(MenuTitleActionsUI, {
60127          children: [titleAction, hasSearch && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, {
60128            size: "small",
60129            variant: "tertiary",
60130            label: searchButtonLabel,
60131            onClick: () => setIsSearching(true),
60132            ref: searchButtonRef,
60133            children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(icons_build_module_icon, {
60134              icon: library_search
60135            })
60136          })]
60137        })]
60138      }), isSearching && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", {
60139        className: getAnimateClassName({
60140          type: 'slide-in',
60141          origin: 'left'
60142        }),
60143        children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(menu_title_search, {
60144          onCloseSearch: onCloseSearch,
60145          onSearch: onSearch,
60146          search: search,
60147          title: title
60148        })
60149      })]
60150    });
60151  }
60152  
60153  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/navigation/menu/search-no-results-found.js
60154  /**
60155   * WordPress dependencies
60156   */
60157  
60158  
60159  /**
60160   * Internal dependencies
60161   */
60162  
60163  
60164  
60165  
60166  function NavigationSearchNoResultsFound({
60167    search
60168  }) {
60169    const {
60170      navigationTree: {
60171        items
60172      }
60173    } = useNavigationContext();
60174    const resultsCount = Object.values(items).filter(item => item._isVisible).length;
60175    if (!search || !!resultsCount) {
60176      return null;
60177    }
60178    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ItemBaseUI, {
60179      children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(ItemUI, {
60180        children: [(0,external_wp_i18n_namespaceObject.__)('No results found.'), " "]
60181      })
60182    });
60183  }
60184  
60185  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/navigation/menu/index.js
60186  /**
60187   * External dependencies
60188   */
60189  
60190  
60191  /**
60192   * WordPress dependencies
60193   */
60194  
60195  
60196  /**
60197   * Internal dependencies
60198   */
60199  
60200  
60201  
60202  
60203  
60204  
60205  
60206  
60207  
60208  
60209  
60210  /**
60211   * @deprecated Use `Navigator` instead.
60212   */
60213  function NavigationMenu(props) {
60214    const {
60215      backButtonLabel,
60216      children,
60217      className,
60218      hasSearch,
60219      menu = ROOT_MENU,
60220      onBackButtonClick,
60221      onSearch: setControlledSearch,
60222      parentMenu,
60223      search: controlledSearch,
60224      isSearchDebouncing,
60225      title,
60226      titleAction
60227    } = props;
60228    const [uncontrolledSearch, setUncontrolledSearch] = (0,external_wp_element_namespaceObject.useState)('');
60229    useNavigationTreeMenu(props);
60230    const {
60231      activeMenu
60232    } = useNavigationContext();
60233    const context = {
60234      menu,
60235      search: uncontrolledSearch
60236    };
60237  
60238    // Keep the children rendered to make sure invisible items are included in the navigation tree.
60239    if (activeMenu !== menu) {
60240      return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(NavigationMenuContext.Provider, {
60241        value: context,
60242        children: children
60243      });
60244    }
60245    const isControlledSearch = !!setControlledSearch;
60246    const search = isControlledSearch ? controlledSearch : uncontrolledSearch;
60247    const onSearch = isControlledSearch ? setControlledSearch : setUncontrolledSearch;
60248    const menuTitleId = `components-navigation__menu-title-$menu}`;
60249    const classes = dist_clsx('components-navigation__menu', className);
60250    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(NavigationMenuContext.Provider, {
60251      value: context,
60252      children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(MenuUI, {
60253        className: classes,
60254        children: [(parentMenu || onBackButtonClick) && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(back_button, {
60255          backButtonLabel: backButtonLabel,
60256          parentMenu: parentMenu,
60257          onClick: onBackButtonClick
60258        }), title && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(NavigationMenuTitle, {
60259          hasSearch: hasSearch,
60260          onSearch: onSearch,
60261          search: search,
60262          title: title,
60263          titleAction: titleAction
60264        }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(navigable_container_menu, {
60265          children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("ul", {
60266            "aria-labelledby": menuTitleId,
60267            children: [children, search && !isSearchDebouncing && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(NavigationSearchNoResultsFound, {
60268              search: search
60269            })]
60270          })
60271        })]
60272      })
60273    });
60274  }
60275  /* harmony default export */ const navigation_menu = (NavigationMenu);
60276  
60277  ;// CONCATENATED MODULE: ./node_modules/path-to-regexp/dist.es2015/index.js
60278  /**
60279   * Tokenize input string.
60280   */
60281  function lexer(str) {
60282      var tokens = [];
60283      var i = 0;
60284      while (i < str.length) {
60285          var char = str[i];
60286          if (char === "*" || char === "+" || char === "?") {
60287              tokens.push({ type: "MODIFIER", index: i, value: str[i++] });
60288              continue;
60289          }
60290          if (char === "\\") {
60291              tokens.push({ type: "ESCAPED_CHAR", index: i++, value: str[i++] });
60292              continue;
60293          }
60294          if (char === "{") {
60295              tokens.push({ type: "OPEN", index: i, value: str[i++] });
60296              continue;
60297          }
60298          if (char === "}") {
60299              tokens.push({ type: "CLOSE", index: i, value: str[i++] });
60300              continue;
60301          }
60302          if (char === ":") {
60303              var name = "";
60304              var j = i + 1;
60305              while (j < str.length) {
60306                  var code = str.charCodeAt(j);
60307                  if (
60308                  // `0-9`
60309                  (code >= 48 && code <= 57) ||
60310                      // `A-Z`
60311                      (code >= 65 && code <= 90) ||
60312                      // `a-z`
60313                      (code >= 97 && code <= 122) ||
60314                      // `_`
60315                      code === 95) {
60316                      name += str[j++];
60317                      continue;
60318                  }
60319                  break;
60320              }
60321              if (!name)
60322                  throw new TypeError("Missing parameter name at ".concat(i));
60323              tokens.push({ type: "NAME", index: i, value: name });
60324              i = j;
60325              continue;
60326          }
60327          if (char === "(") {
60328              var count = 1;
60329              var pattern = "";
60330              var j = i + 1;
60331              if (str[j] === "?") {
60332                  throw new TypeError("Pattern cannot start with \"?\" at ".concat(j));
60333              }
60334              while (j < str.length) {
60335                  if (str[j] === "\\") {
60336                      pattern += str[j++] + str[j++];
60337                      continue;
60338                  }
60339                  if (str[j] === ")") {
60340                      count--;
60341                      if (count === 0) {
60342                          j++;
60343                          break;
60344                      }
60345                  }
60346                  else if (str[j] === "(") {
60347                      count++;
60348                      if (str[j + 1] !== "?") {
60349                          throw new TypeError("Capturing groups are not allowed at ".concat(j));
60350                      }
60351                  }
60352                  pattern += str[j++];
60353              }
60354              if (count)
60355                  throw new TypeError("Unbalanced pattern at ".concat(i));
60356              if (!pattern)
60357                  throw new TypeError("Missing pattern at ".concat(i));
60358              tokens.push({ type: "PATTERN", index: i, value: pattern });
60359              i = j;
60360              continue;
60361          }
60362          tokens.push({ type: "CHAR", index: i, value: str[i++] });
60363      }
60364      tokens.push({ type: "END", index: i, value: "" });
60365      return tokens;
60366  }
60367  /**
60368   * Parse a string for the raw tokens.
60369   */
60370  function dist_es2015_parse(str, options) {
60371      if (options === void 0) { options = {}; }
60372      var tokens = lexer(str);
60373      var _a = options.prefixes, prefixes = _a === void 0 ? "./" : _a, _b = options.delimiter, delimiter = _b === void 0 ? "/#?" : _b;
60374      var result = [];
60375      var key = 0;
60376      var i = 0;
60377      var path = "";
60378      var tryConsume = function (type) {
60379          if (i < tokens.length && tokens[i].type === type)
60380              return tokens[i++].value;
60381      };
60382      var mustConsume = function (type) {
60383          var value = tryConsume(type);
60384          if (value !== undefined)
60385              return value;
60386          var _a = tokens[i], nextType = _a.type, index = _a.index;
60387          throw new TypeError("Unexpected ".concat(nextType, " at ").concat(index, ", expected ").concat(type));
60388      };
60389      var consumeText = function () {
60390          var result = "";
60391          var value;
60392          while ((value = tryConsume("CHAR") || tryConsume("ESCAPED_CHAR"))) {
60393              result += value;
60394          }
60395          return result;
60396      };
60397      var isSafe = function (value) {
60398          for (var _i = 0, delimiter_1 = delimiter; _i < delimiter_1.length; _i++) {
60399              var char = delimiter_1[_i];
60400              if (value.indexOf(char) > -1)
60401                  return true;
60402          }
60403          return false;
60404      };
60405      var safePattern = function (prefix) {
60406          var prev = result[result.length - 1];
60407          var prevText = prefix || (prev && typeof prev === "string" ? prev : "");
60408          if (prev && !prevText) {
60409              throw new TypeError("Must have text between two parameters, missing text after \"".concat(prev.name, "\""));
60410          }
60411          if (!prevText || isSafe(prevText))
60412              return "[^".concat(escapeString(delimiter), "]+?");
60413          return "(?:(?!".concat(escapeString(prevText), ")[^").concat(escapeString(delimiter), "])+?");
60414      };
60415      while (i < tokens.length) {
60416          var char = tryConsume("CHAR");
60417          var name = tryConsume("NAME");
60418          var pattern = tryConsume("PATTERN");
60419          if (name || pattern) {
60420              var prefix = char || "";
60421              if (prefixes.indexOf(prefix) === -1) {
60422                  path += prefix;
60423                  prefix = "";
60424              }
60425              if (path) {
60426                  result.push(path);
60427                  path = "";
60428              }
60429              result.push({
60430                  name: name || key++,
60431                  prefix: prefix,
60432                  suffix: "",
60433                  pattern: pattern || safePattern(prefix),
60434                  modifier: tryConsume("MODIFIER") || "",
60435              });
60436              continue;
60437          }
60438          var value = char || tryConsume("ESCAPED_CHAR");
60439          if (value) {
60440              path += value;
60441              continue;
60442          }
60443          if (path) {
60444              result.push(path);
60445              path = "";
60446          }
60447          var open = tryConsume("OPEN");
60448          if (open) {
60449              var prefix = consumeText();
60450              var name_1 = tryConsume("NAME") || "";
60451              var pattern_1 = tryConsume("PATTERN") || "";
60452              var suffix = consumeText();
60453              mustConsume("CLOSE");
60454              result.push({
60455                  name: name_1 || (pattern_1 ? key++ : ""),
60456                  pattern: name_1 && !pattern_1 ? safePattern(prefix) : pattern_1,
60457                  prefix: prefix,
60458                  suffix: suffix,
60459                  modifier: tryConsume("MODIFIER") || "",
60460              });
60461              continue;
60462          }
60463          mustConsume("END");
60464      }
60465      return result;
60466  }
60467  /**
60468   * Compile a string to a template function for the path.
60469   */
60470  function dist_es2015_compile(str, options) {
60471      return tokensToFunction(dist_es2015_parse(str, options), options);
60472  }
60473  /**
60474   * Expose a method for transforming tokens into the path function.
60475   */
60476  function tokensToFunction(tokens, options) {
60477      if (options === void 0) { options = {}; }
60478      var reFlags = flags(options);
60479      var _a = options.encode, encode = _a === void 0 ? function (x) { return x; } : _a, _b = options.validate, validate = _b === void 0 ? true : _b;
60480      // Compile all the tokens into regexps.
60481      var matches = tokens.map(function (token) {
60482          if (typeof token === "object") {
60483              return new RegExp("^(?:".concat(token.pattern, ")$"), reFlags);
60484          }
60485      });
60486      return function (data) {
60487          var path = "";
60488          for (var i = 0; i < tokens.length; i++) {
60489              var token = tokens[i];
60490              if (typeof token === "string") {
60491                  path += token;
60492                  continue;
60493              }
60494              var value = data ? data[token.name] : undefined;
60495              var optional = token.modifier === "?" || token.modifier === "*";
60496              var repeat = token.modifier === "*" || token.modifier === "+";
60497              if (Array.isArray(value)) {
60498                  if (!repeat) {
60499                      throw new TypeError("Expected \"".concat(token.name, "\" to not repeat, but got an array"));
60500                  }
60501                  if (value.length === 0) {
60502                      if (optional)
60503                          continue;
60504                      throw new TypeError("Expected \"".concat(token.name, "\" to not be empty"));
60505                  }
60506                  for (var j = 0; j < value.length; j++) {
60507                      var segment = encode(value[j], token);
60508                      if (validate && !matches[i].test(segment)) {
60509                          throw new TypeError("Expected all \"".concat(token.name, "\" to match \"").concat(token.pattern, "\", but got \"").concat(segment, "\""));
60510                      }
60511                      path += token.prefix + segment + token.suffix;
60512                  }
60513                  continue;
60514              }
60515              if (typeof value === "string" || typeof value === "number") {
60516                  var segment = encode(String(value), token);
60517                  if (validate && !matches[i].test(segment)) {
60518                      throw new TypeError("Expected \"".concat(token.name, "\" to match \"").concat(token.pattern, "\", but got \"").concat(segment, "\""));
60519                  }
60520                  path += token.prefix + segment + token.suffix;
60521                  continue;
60522              }
60523              if (optional)
60524                  continue;
60525              var typeOfMessage = repeat ? "an array" : "a string";
60526              throw new TypeError("Expected \"".concat(token.name, "\" to be ").concat(typeOfMessage));
60527          }
60528          return path;
60529      };
60530  }
60531  /**
60532   * Create path match function from `path-to-regexp` spec.
60533   */
60534  function dist_es2015_match(str, options) {
60535      var keys = [];
60536      var re = pathToRegexp(str, keys, options);
60537      return regexpToFunction(re, keys, options);
60538  }
60539  /**
60540   * Create a path match function from `path-to-regexp` output.
60541   */
60542  function regexpToFunction(re, keys, options) {
60543      if (options === void 0) { options = {}; }
60544      var _a = options.decode, decode = _a === void 0 ? function (x) { return x; } : _a;
60545      return function (pathname) {
60546          var m = re.exec(pathname);
60547          if (!m)
60548              return false;
60549          var path = m[0], index = m.index;
60550          var params = Object.create(null);
60551          var _loop_1 = function (i) {
60552              if (m[i] === undefined)
60553                  return "continue";
60554              var key = keys[i - 1];
60555              if (key.modifier === "*" || key.modifier === "+") {
60556                  params[key.name] = m[i].split(key.prefix + key.suffix).map(function (value) {
60557                      return decode(value, key);
60558                  });
60559              }
60560              else {
60561                  params[key.name] = decode(m[i], key);
60562              }
60563          };
60564          for (var i = 1; i < m.length; i++) {
60565              _loop_1(i);
60566          }
60567          return { path: path, index: index, params: params };
60568      };
60569  }
60570  /**
60571   * Escape a regular expression string.
60572   */
60573  function escapeString(str) {
60574      return str.replace(/([.+*?=^!:${}()[\]|/\\])/g, "\\$1");
60575  }
60576  /**
60577   * Get the flags for a regexp from the options.
60578   */
60579  function flags(options) {
60580      return options && options.sensitive ? "" : "i";
60581  }
60582  /**
60583   * Pull out keys from a regexp.
60584   */
60585  function regexpToRegexp(path, keys) {
60586      if (!keys)
60587          return path;
60588      var groupsRegex = /\((?:\?<(.*?)>)?(?!\?)/g;
60589      var index = 0;
60590      var execResult = groupsRegex.exec(path.source);
60591      while (execResult) {
60592          keys.push({
60593              // Use parenthesized substring match if available, index otherwise
60594              name: execResult[1] || index++,
60595              prefix: "",
60596              suffix: "",
60597              modifier: "",
60598              pattern: "",
60599          });
60600          execResult = groupsRegex.exec(path.source);
60601      }
60602      return path;
60603  }
60604  /**
60605   * Transform an array into a regexp.
60606   */
60607  function arrayToRegexp(paths, keys, options) {
60608      var parts = paths.map(function (path) { return pathToRegexp(path, keys, options).source; });
60609      return new RegExp("(?:".concat(parts.join("|"), ")"), flags(options));
60610  }
60611  /**
60612   * Create a path regexp from string input.
60613   */
60614  function stringToRegexp(path, keys, options) {
60615      return tokensToRegexp(dist_es2015_parse(path, options), keys, options);
60616  }
60617  /**
60618   * Expose a function for taking tokens and returning a RegExp.
60619   */
60620  function tokensToRegexp(tokens, keys, options) {
60621      if (options === void 0) { options = {}; }
60622      var _a = options.strict, strict = _a === void 0 ? false : _a, _b = options.start, start = _b === void 0 ? true : _b, _c = options.end, end = _c === void 0 ? true : _c, _d = options.encode, encode = _d === void 0 ? function (x) { return x; } : _d, _e = options.delimiter, delimiter = _e === void 0 ? "/#?" : _e, _f = options.endsWith, endsWith = _f === void 0 ? "" : _f;
60623      var endsWithRe = "[".concat(escapeString(endsWith), "]|$");
60624      var delimiterRe = "[".concat(escapeString(delimiter), "]");
60625      var route = start ? "^" : "";
60626      // Iterate over the tokens and create our regexp string.
60627      for (var _i = 0, tokens_1 = tokens; _i < tokens_1.length; _i++) {
60628          var token = tokens_1[_i];
60629          if (typeof token === "string") {
60630              route += escapeString(encode(token));
60631          }
60632          else {
60633              var prefix = escapeString(encode(token.prefix));
60634              var suffix = escapeString(encode(token.suffix));
60635              if (token.pattern) {
60636                  if (keys)
60637                      keys.push(token);
60638                  if (prefix || suffix) {
60639                      if (token.modifier === "+" || token.modifier === "*") {
60640                          var mod = token.modifier === "*" ? "?" : "";
60641                          route += "(?:".concat(prefix, "((?:").concat(token.pattern, ")(?:").concat(suffix).concat(prefix, "(?:").concat(token.pattern, "))*)").concat(suffix, ")").concat(mod);
60642                      }
60643                      else {
60644                          route += "(?:".concat(prefix, "(").concat(token.pattern, ")").concat(suffix, ")").concat(token.modifier);
60645                      }
60646                  }
60647                  else {
60648                      if (token.modifier === "+" || token.modifier === "*") {
60649                          throw new TypeError("Can not repeat \"".concat(token.name, "\" without a prefix and suffix"));
60650                      }
60651                      route += "(".concat(token.pattern, ")").concat(token.modifier);
60652                  }
60653              }
60654              else {
60655                  route += "(?:".concat(prefix).concat(suffix, ")").concat(token.modifier);
60656              }
60657          }
60658      }
60659      if (end) {
60660          if (!strict)
60661              route += "".concat(delimiterRe, "?");
60662          route += !options.endsWith ? "$" : "(?=".concat(endsWithRe, ")");
60663      }
60664      else {
60665          var endToken = tokens[tokens.length - 1];
60666          var isEndDelimited = typeof endToken === "string"
60667              ? delimiterRe.indexOf(endToken[endToken.length - 1]) > -1
60668              : endToken === undefined;
60669          if (!strict) {
60670              route += "(?:".concat(delimiterRe, "(?=").concat(endsWithRe, "))?");
60671          }
60672          if (!isEndDelimited) {
60673              route += "(?=".concat(delimiterRe, "|").concat(endsWithRe, ")");
60674          }
60675      }
60676      return new RegExp(route, flags(options));
60677  }
60678  /**
60679   * Normalize the given path string, returning a regular expression.
60680   *
60681   * An empty array can be passed in for the keys, which will hold the
60682   * placeholder key descriptions. For example, using `/user/:id`, `keys` will
60683   * contain `[{ name: 'id', delimiter: '/', optional: false, repeat: false }]`.
60684   */
60685  function pathToRegexp(path, keys, options) {
60686      if (path instanceof RegExp)
60687          return regexpToRegexp(path, keys);
60688      if (Array.isArray(path))
60689          return arrayToRegexp(path, keys, options);
60690      return stringToRegexp(path, keys, options);
60691  }
60692  
60693  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/navigator/utils/router.js
60694  /**
60695   * External dependencies
60696   */
60697  
60698  
60699  /**
60700   * Internal dependencies
60701   */
60702  
60703  function matchPath(path, pattern) {
60704    const matchingFunction = dist_es2015_match(pattern, {
60705      decode: decodeURIComponent
60706    });
60707    return matchingFunction(path);
60708  }
60709  function patternMatch(path, screens) {
60710    for (const screen of screens) {
60711      const matched = matchPath(path, screen.path);
60712      if (matched) {
60713        return {
60714          params: matched.params,
60715          id: screen.id
60716        };
60717      }
60718    }
60719    return undefined;
60720  }
60721  function findParent(path, screens) {
60722    if (!path.startsWith('/')) {
60723      return undefined;
60724    }
60725    const pathParts = path.split('/');
60726    let parentPath;
60727    while (pathParts.length > 1 && parentPath === undefined) {
60728      pathParts.pop();
60729      const potentialParentPath = pathParts.join('/') === '' ? '/' : pathParts.join('/');
60730      if (screens.find(screen => {
60731        return matchPath(potentialParentPath, screen.path) !== false;
60732      })) {
60733        parentPath = potentialParentPath;
60734      }
60735    }
60736    return parentPath;
60737  }
60738  
60739  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/navigator/context.js
60740  /**
60741   * WordPress dependencies
60742   */
60743  
60744  
60745  /**
60746   * Internal dependencies
60747   */
60748  
60749  const context_initialContextValue = {
60750    location: {},
60751    goTo: () => {},
60752    goBack: () => {},
60753    goToParent: () => {},
60754    addScreen: () => {},
60755    removeScreen: () => {},
60756    params: {}
60757  };
60758  const NavigatorContext = (0,external_wp_element_namespaceObject.createContext)(context_initialContextValue);
60759  
60760  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/navigator/styles.js
60761  function navigator_styles_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)."; }
60762  /**
60763   * External dependencies
60764   */
60765  
60766  const navigatorProviderWrapper =  true ? {
60767    name: "xpkswc",
60768    styles: "overflow-x:hidden;contain:content"
60769  } : 0;
60770  const fadeInFromRight = emotion_react_browser_esm_keyframes({
60771    '0%': {
60772      opacity: 0,
60773      transform: `translateX( 50px )`
60774    },
60775    '100%': {
60776      opacity: 1,
60777      transform: 'none'
60778    }
60779  });
60780  const fadeInFromLeft = emotion_react_browser_esm_keyframes({
60781    '0%': {
60782      opacity: 0,
60783      transform: `translateX( -50px )`
60784    },
60785    '100%': {
60786      opacity: 1,
60787      transform: 'none'
60788    }
60789  });
60790  const navigatorScreenAnimation = ({
60791    isInitial,
60792    isBack,
60793    isRTL
60794  }) => {
60795    if (isInitial && !isBack) {
60796      return;
60797    }
60798    const animationName = isRTL && isBack || !isRTL && !isBack ? fadeInFromRight : fadeInFromLeft;
60799    return /*#__PURE__*/emotion_react_browser_esm_css("animation-duration:0.14s;animation-timing-function:ease-in-out;will-change:transform,opacity;animation-name:", animationName, ";@media ( prefers-reduced-motion ){animation-duration:0s;}" + ( true ? "" : 0),  true ? "" : 0);
60800  };
60801  const navigatorScreen = props => /*#__PURE__*/emotion_react_browser_esm_css("overflow-x:auto;max-height:100%;", navigatorScreenAnimation(props), ";" + ( true ? "" : 0),  true ? "" : 0);
60802  
60803  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/navigator/navigator-provider/component.js
60804  /**
60805   * External dependencies
60806   */
60807  
60808  /**
60809   * WordPress dependencies
60810   */
60811  
60812  
60813  
60814  
60815  /**
60816   * Internal dependencies
60817   */
60818  
60819  
60820  
60821  
60822  
60823  
60824  
60825  
60826  
60827  function addScreen({
60828    screens
60829  }, screen) {
60830    if (screens.some(s => s.path === screen.path)) {
60831       true ? external_wp_warning_default()(`Navigator: a screen with path $screen.path} already exists.
60832  The screen with id $screen.id} will not be added.`) : 0;
60833      return screens;
60834    }
60835    return [...screens, screen];
60836  }
60837  function removeScreen({
60838    screens
60839  }, screen) {
60840    return screens.filter(s => s.id !== screen.id);
60841  }
60842  function goTo(state, path, options = {}) {
60843    var _focusSelectorsCopy2;
60844    const {
60845      focusSelectors
60846    } = state;
60847    const currentLocation = {
60848      ...state.currentLocation
60849    };
60850    const {
60851      // Default assignments
60852      isBack = false,
60853      skipFocus = false,
60854      // Extract to avoid forwarding
60855      replace,
60856      focusTargetSelector,
60857      // Rest
60858      ...restOptions
60859    } = options;
60860    if (currentLocation.path === path) {
60861      return {
60862        currentLocation,
60863        focusSelectors
60864      };
60865    }
60866    let focusSelectorsCopy;
60867    function getFocusSelectorsCopy() {
60868      var _focusSelectorsCopy;
60869      focusSelectorsCopy = (_focusSelectorsCopy = focusSelectorsCopy) !== null && _focusSelectorsCopy !== void 0 ? _focusSelectorsCopy : new Map(state.focusSelectors);
60870      return focusSelectorsCopy;
60871    }
60872  
60873    // Set a focus selector that will be used when navigating
60874    // back to the current location.
60875    if (focusTargetSelector && currentLocation.path) {
60876      getFocusSelectorsCopy().set(currentLocation.path, focusTargetSelector);
60877    }
60878  
60879    // Get the focus selector for the new location.
60880    let currentFocusSelector;
60881    if (focusSelectors.get(path)) {
60882      if (isBack) {
60883        // Use the found focus selector only when navigating back.
60884        currentFocusSelector = focusSelectors.get(path);
60885      }
60886      // Make a copy of the focusSelectors map to remove the focus selector
60887      // only if necessary (ie. a focus selector was found).
60888      getFocusSelectorsCopy().delete(path);
60889    }
60890    return {
60891      currentLocation: {
60892        ...restOptions,
60893        isInitial: false,
60894        path,
60895        isBack,
60896        hasRestoredFocus: false,
60897        focusTargetSelector: currentFocusSelector,
60898        skipFocus
60899      },
60900      focusSelectors: (_focusSelectorsCopy2 = focusSelectorsCopy) !== null && _focusSelectorsCopy2 !== void 0 ? _focusSelectorsCopy2 : focusSelectors
60901    };
60902  }
60903  function goToParent(state, options = {}) {
60904    const {
60905      screens,
60906      focusSelectors
60907    } = state;
60908    const currentLocation = {
60909      ...state.currentLocation
60910    };
60911    const currentPath = currentLocation.path;
60912    if (currentPath === undefined) {
60913      return {
60914        currentLocation,
60915        focusSelectors
60916      };
60917    }
60918    const parentPath = findParent(currentPath, screens);
60919    if (parentPath === undefined) {
60920      return {
60921        currentLocation,
60922        focusSelectors
60923      };
60924    }
60925    return goTo(state, parentPath, {
60926      ...options,
60927      isBack: true
60928    });
60929  }
60930  function routerReducer(state, action) {
60931    let {
60932      screens,
60933      currentLocation,
60934      matchedPath,
60935      focusSelectors,
60936      ...restState
60937    } = state;
60938    switch (action.type) {
60939      case 'add':
60940        screens = addScreen(state, action.screen);
60941        break;
60942      case 'remove':
60943        screens = removeScreen(state, action.screen);
60944        break;
60945      case 'goto':
60946        ({
60947          currentLocation,
60948          focusSelectors
60949        } = goTo(state, action.path, action.options));
60950        break;
60951      case 'gotoparent':
60952        ({
60953          currentLocation,
60954          focusSelectors
60955        } = goToParent(state, action.options));
60956        break;
60957    }
60958  
60959    // Return early in case there is no change
60960    if (screens === state.screens && currentLocation === state.currentLocation) {
60961      return state;
60962    }
60963  
60964    // Compute the matchedPath
60965    const currentPath = currentLocation.path;
60966    matchedPath = currentPath !== undefined ? patternMatch(currentPath, screens) : undefined;
60967  
60968    // If the new match is the same as the previous match,
60969    // return the previous one to keep immutability.
60970    if (matchedPath && state.matchedPath && matchedPath.id === state.matchedPath.id && external_wp_isShallowEqual_default()(matchedPath.params, state.matchedPath.params)) {
60971      matchedPath = state.matchedPath;
60972    }
60973    return {
60974      ...restState,
60975      screens,
60976      currentLocation,
60977      matchedPath,
60978      focusSelectors
60979    };
60980  }
60981  function UnconnectedNavigatorProvider(props, forwardedRef) {
60982    const {
60983      initialPath: initialPathProp,
60984      children,
60985      className,
60986      ...otherProps
60987    } = useContextSystem(props, 'NavigatorProvider');
60988    const [routerState, dispatch] = (0,external_wp_element_namespaceObject.useReducer)(routerReducer, initialPathProp, path => ({
60989      screens: [],
60990      currentLocation: {
60991        path,
60992        isInitial: true
60993      },
60994      matchedPath: undefined,
60995      focusSelectors: new Map(),
60996      initialPath: initialPathProp
60997    }));
60998  
60999    // The methods are constant forever, create stable references to them.
61000    const methods = (0,external_wp_element_namespaceObject.useMemo)(() => ({
61001      // Note: calling goBack calls `goToParent` internally, as it was established
61002      // that `goBack` should behave like `goToParent`, and `goToParent` should
61003      // be marked as deprecated.
61004      goBack: options => dispatch({
61005        type: 'gotoparent',
61006        options
61007      }),
61008      goTo: (path, options) => dispatch({
61009        type: 'goto',
61010        path,
61011        options
61012      }),
61013      goToParent: options => {
61014        external_wp_deprecated_default()(`wp.components.useNavigator().goToParent`, {
61015          since: '6.7',
61016          alternative: 'wp.components.useNavigator().goBack'
61017        });
61018        dispatch({
61019          type: 'gotoparent',
61020          options
61021        });
61022      },
61023      addScreen: screen => dispatch({
61024        type: 'add',
61025        screen
61026      }),
61027      removeScreen: screen => dispatch({
61028        type: 'remove',
61029        screen
61030      })
61031    }), []);
61032    const {
61033      currentLocation,
61034      matchedPath
61035    } = routerState;
61036    const navigatorContextValue = (0,external_wp_element_namespaceObject.useMemo)(() => {
61037      var _matchedPath$params;
61038      return {
61039        location: currentLocation,
61040        params: (_matchedPath$params = matchedPath?.params) !== null && _matchedPath$params !== void 0 ? _matchedPath$params : {},
61041        match: matchedPath?.id,
61042        ...methods
61043      };
61044    }, [currentLocation, matchedPath, methods]);
61045    const cx = useCx();
61046    const classes = (0,external_wp_element_namespaceObject.useMemo)(() => cx(navigatorProviderWrapper, className), [className, cx]);
61047    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(component, {
61048      ref: forwardedRef,
61049      className: classes,
61050      ...otherProps,
61051      children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(NavigatorContext.Provider, {
61052        value: navigatorContextValue,
61053        children: children
61054      })
61055    });
61056  }
61057  
61058  /**
61059   * The `NavigatorProvider` component allows rendering nested views/panels/menus
61060   * (via the `NavigatorScreen` component and navigate between these different
61061   * view (via the `NavigatorButton` and `NavigatorBackButton` components or the
61062   * `useNavigator` hook).
61063   *
61064   * ```jsx
61065   * import {
61066   *   __experimentalNavigatorProvider as NavigatorProvider,
61067   *   __experimentalNavigatorScreen as NavigatorScreen,
61068   *   __experimentalNavigatorButton as NavigatorButton,
61069   *   __experimentalNavigatorBackButton as NavigatorBackButton,
61070   * } from '@wordpress/components';
61071   *
61072   * const MyNavigation = () => (
61073   *   <NavigatorProvider initialPath="/">
61074   *     <NavigatorScreen path="/">
61075   *       <p>This is the home screen.</p>
61076   *        <NavigatorButton path="/child">
61077   *          Navigate to child screen.
61078   *       </NavigatorButton>
61079   *     </NavigatorScreen>
61080   *
61081   *     <NavigatorScreen path="/child">
61082   *       <p>This is the child screen.</p>
61083   *       <NavigatorBackButton>
61084   *         Go back
61085   *       </NavigatorBackButton>
61086   *     </NavigatorScreen>
61087   *   </NavigatorProvider>
61088   * );
61089   * ```
61090   */
61091  const NavigatorProvider = contextConnect(UnconnectedNavigatorProvider, 'NavigatorProvider');
61092  /* harmony default export */ const navigator_provider_component = ((/* unused pure expression or super */ null && (NavigatorProvider)));
61093  
61094  ;// CONCATENATED MODULE: external ["wp","escapeHtml"]
61095  const external_wp_escapeHtml_namespaceObject = window["wp"]["escapeHtml"];
61096  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/navigator/navigator-screen/component.js
61097  /**
61098   * External dependencies
61099   */
61100  
61101  /**
61102   * WordPress dependencies
61103   */
61104  
61105  
61106  
61107  
61108  
61109  
61110  
61111  /**
61112   * Internal dependencies
61113   */
61114  
61115  
61116  
61117  
61118  
61119  
61120  
61121  function UnconnectedNavigatorScreen(props, forwardedRef) {
61122    if (!/^\//.test(props.path)) {
61123       true ? external_wp_warning_default()('wp.components.NavigatorScreen: the `path` should follow a URL-like scheme; it should start with and be separated by the `/` character.') : 0;
61124    }
61125    const screenId = (0,external_wp_element_namespaceObject.useId)();
61126    const {
61127      children,
61128      className,
61129      path,
61130      ...otherProps
61131    } = useContextSystem(props, 'NavigatorScreen');
61132    const {
61133      location,
61134      match,
61135      addScreen,
61136      removeScreen
61137    } = (0,external_wp_element_namespaceObject.useContext)(NavigatorContext);
61138    const isMatch = match === screenId;
61139    const wrapperRef = (0,external_wp_element_namespaceObject.useRef)(null);
61140    (0,external_wp_element_namespaceObject.useEffect)(() => {
61141      const screen = {
61142        id: screenId,
61143        path: (0,external_wp_escapeHtml_namespaceObject.escapeAttribute)(path)
61144      };
61145      addScreen(screen);
61146      return () => removeScreen(screen);
61147    }, [screenId, path, addScreen, removeScreen]);
61148    const isRTL = (0,external_wp_i18n_namespaceObject.isRTL)();
61149    const {
61150      isInitial,
61151      isBack
61152    } = location;
61153    const cx = useCx();
61154    const classes = (0,external_wp_element_namespaceObject.useMemo)(() => cx(navigatorScreen({
61155      isInitial,
61156      isBack,
61157      isRTL
61158    }), className), [className, cx, isInitial, isBack, isRTL]);
61159    const locationRef = (0,external_wp_element_namespaceObject.useRef)(location);
61160    (0,external_wp_element_namespaceObject.useEffect)(() => {
61161      locationRef.current = location;
61162    }, [location]);
61163  
61164    // Focus restoration
61165    const isInitialLocation = location.isInitial && !location.isBack;
61166    (0,external_wp_element_namespaceObject.useEffect)(() => {
61167      // Only attempt to restore focus:
61168      // - if the current location is not the initial one (to avoid moving focus on page load)
61169      // - when the screen becomes visible
61170      // - if the wrapper ref has been assigned
61171      // - if focus hasn't already been restored for the current location
61172      // - if the `skipFocus` option is not set to `true`. This is useful when we trigger the navigation outside of NavigatorScreen.
61173      if (isInitialLocation || !isMatch || !wrapperRef.current || locationRef.current.hasRestoredFocus || location.skipFocus) {
61174        return;
61175      }
61176      const activeElement = wrapperRef.current.ownerDocument.activeElement;
61177  
61178      // If an element is already focused within the wrapper do not focus the
61179      // element. This prevents inputs or buttons from losing focus unnecessarily.
61180      if (wrapperRef.current.contains(activeElement)) {
61181        return;
61182      }
61183      let elementToFocus = null;
61184  
61185      // When navigating back, if a selector is provided, use it to look for the
61186      // target element (assumed to be a node inside the current NavigatorScreen)
61187      if (location.isBack && location.focusTargetSelector) {
61188        elementToFocus = wrapperRef.current.querySelector(location.focusTargetSelector);
61189      }
61190  
61191      // If the previous query didn't run or find any element to focus, fallback
61192      // to the first tabbable element in the screen (or the screen itself).
61193      if (!elementToFocus) {
61194        const [firstTabbable] = external_wp_dom_namespaceObject.focus.tabbable.find(wrapperRef.current);
61195        elementToFocus = firstTabbable !== null && firstTabbable !== void 0 ? firstTabbable : wrapperRef.current;
61196      }
61197      locationRef.current.hasRestoredFocus = true;
61198      elementToFocus.focus();
61199    }, [isInitialLocation, isMatch, location.isBack, location.focusTargetSelector, location.skipFocus]);
61200    const mergedWrapperRef = (0,external_wp_compose_namespaceObject.useMergeRefs)([forwardedRef, wrapperRef]);
61201    return isMatch ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(component, {
61202      ref: mergedWrapperRef,
61203      className: classes,
61204      ...otherProps,
61205      children: children
61206    }) : null;
61207  }
61208  
61209  /**
61210   * The `NavigatorScreen` component represents a single view/screen/panel and
61211   * should be used in combination with the `NavigatorProvider`, the
61212   * `NavigatorButton` and the `NavigatorBackButton` components (or the `useNavigator`
61213   * hook).
61214   *
61215   * @example
61216   * ```jsx
61217   * import {
61218   *   __experimentalNavigatorProvider as NavigatorProvider,
61219   *   __experimentalNavigatorScreen as NavigatorScreen,
61220   *   __experimentalNavigatorButton as NavigatorButton,
61221   *   __experimentalNavigatorBackButton as NavigatorBackButton,
61222   * } from '@wordpress/components';
61223   *
61224   * const MyNavigation = () => (
61225   *   <NavigatorProvider initialPath="/">
61226   *     <NavigatorScreen path="/">
61227   *       <p>This is the home screen.</p>
61228   *        <NavigatorButton path="/child">
61229   *          Navigate to child screen.
61230   *       </NavigatorButton>
61231   *     </NavigatorScreen>
61232   *
61233   *     <NavigatorScreen path="/child">
61234   *       <p>This is the child screen.</p>
61235   *       <NavigatorBackButton>
61236   *         Go back
61237   *       </NavigatorBackButton>
61238   *     </NavigatorScreen>
61239   *   </NavigatorProvider>
61240   * );
61241   * ```
61242   */
61243  const NavigatorScreen = contextConnect(UnconnectedNavigatorScreen, 'NavigatorScreen');
61244  /* harmony default export */ const navigator_screen_component = ((/* unused pure expression or super */ null && (NavigatorScreen)));
61245  
61246  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/navigator/use-navigator.js
61247  /**
61248   * WordPress dependencies
61249   */
61250  
61251  
61252  /**
61253   * Internal dependencies
61254   */
61255  
61256  /**
61257   * Retrieves a `navigator` instance.
61258   */
61259  function useNavigator() {
61260    const {
61261      location,
61262      params,
61263      goTo,
61264      goBack,
61265      goToParent
61266    } = (0,external_wp_element_namespaceObject.useContext)(NavigatorContext);
61267    return {
61268      location,
61269      goTo,
61270      goBack,
61271      goToParent,
61272      params
61273    };
61274  }
61275  
61276  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/navigator/navigator-button/hook.js
61277  /**
61278   * WordPress dependencies
61279   */
61280  
61281  
61282  
61283  /**
61284   * Internal dependencies
61285   */
61286  
61287  
61288  
61289  
61290  const cssSelectorForAttribute = (attrName, attrValue) => `[$attrName}="$attrValue}"]`;
61291  function useNavigatorButton(props) {
61292    const {
61293      path,
61294      onClick,
61295      as = build_module_button,
61296      attributeName = 'id',
61297      ...otherProps
61298    } = useContextSystem(props, 'NavigatorButton');
61299    const escapedPath = (0,external_wp_escapeHtml_namespaceObject.escapeAttribute)(path);
61300    const {
61301      goTo
61302    } = useNavigator();
61303    const handleClick = (0,external_wp_element_namespaceObject.useCallback)(e => {
61304      e.preventDefault();
61305      goTo(escapedPath, {
61306        focusTargetSelector: cssSelectorForAttribute(attributeName, escapedPath)
61307      });
61308      onClick?.(e);
61309    }, [goTo, onClick, attributeName, escapedPath]);
61310    return {
61311      as,
61312      onClick: handleClick,
61313      ...otherProps,
61314      [attributeName]: escapedPath
61315    };
61316  }
61317  
61318  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/navigator/navigator-button/component.js
61319  /**
61320   * External dependencies
61321   */
61322  
61323  /**
61324   * Internal dependencies
61325   */
61326  
61327  
61328  
61329  
61330  
61331  function UnconnectedNavigatorButton(props, forwardedRef) {
61332    const navigatorButtonProps = useNavigatorButton(props);
61333    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(component, {
61334      ref: forwardedRef,
61335      ...navigatorButtonProps
61336    });
61337  }
61338  
61339  /**
61340   * The `NavigatorButton` component can be used to navigate to a screen and should
61341   * be used in combination with the `NavigatorProvider`, the `NavigatorScreen`
61342   * and the `NavigatorBackButton` components (or the `useNavigator` hook).
61343   *
61344   * @example
61345   * ```jsx
61346   * import {
61347   *   __experimentalNavigatorProvider as NavigatorProvider,
61348   *   __experimentalNavigatorScreen as NavigatorScreen,
61349   *   __experimentalNavigatorButton as NavigatorButton,
61350   *   __experimentalNavigatorBackButton as NavigatorBackButton,
61351   * } from '@wordpress/components';
61352   *
61353   * const MyNavigation = () => (
61354   *   <NavigatorProvider initialPath="/">
61355   *     <NavigatorScreen path="/">
61356   *       <p>This is the home screen.</p>
61357   *        <NavigatorButton path="/child">
61358   *          Navigate to child screen.
61359   *       </NavigatorButton>
61360   *     </NavigatorScreen>
61361   *
61362   *     <NavigatorScreen path="/child">
61363   *       <p>This is the child screen.</p>
61364   *       <NavigatorBackButton>
61365   *         Go back
61366   *       </NavigatorBackButton>
61367   *     </NavigatorScreen>
61368   *   </NavigatorProvider>
61369   * );
61370   * ```
61371   */
61372  const NavigatorButton = contextConnect(UnconnectedNavigatorButton, 'NavigatorButton');
61373  /* harmony default export */ const navigator_button_component = ((/* unused pure expression or super */ null && (NavigatorButton)));
61374  
61375  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/navigator/navigator-back-button/hook.js
61376  /**
61377   * WordPress dependencies
61378   */
61379  
61380  
61381  /**
61382   * Internal dependencies
61383   */
61384  
61385  
61386  
61387  
61388  function useNavigatorBackButton(props) {
61389    const {
61390      onClick,
61391      as = build_module_button,
61392      ...otherProps
61393    } = useContextSystem(props, 'NavigatorBackButton');
61394    const {
61395      goBack
61396    } = useNavigator();
61397    const handleClick = (0,external_wp_element_namespaceObject.useCallback)(e => {
61398      e.preventDefault();
61399      goBack();
61400      onClick?.(e);
61401    }, [goBack, onClick]);
61402    return {
61403      as,
61404      onClick: handleClick,
61405      ...otherProps
61406    };
61407  }
61408  
61409  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/navigator/navigator-back-button/component.js
61410  /**
61411   * External dependencies
61412   */
61413  
61414  /**
61415   * Internal dependencies
61416   */
61417  
61418  
61419  
61420  
61421  
61422  function UnconnectedNavigatorBackButton(props, forwardedRef) {
61423    const navigatorBackButtonProps = useNavigatorBackButton(props);
61424    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(component, {
61425      ref: forwardedRef,
61426      ...navigatorBackButtonProps
61427    });
61428  }
61429  
61430  /**
61431   * The `NavigatorBackButton` component can be used to navigate to a screen and
61432   * should be used in combination with the `NavigatorProvider`, the
61433   * `NavigatorScreen` and the `NavigatorButton` components (or the `useNavigator`
61434   * hook).
61435   *
61436   * @example
61437   * ```jsx
61438   * import {
61439   *   __experimentalNavigatorProvider as NavigatorProvider,
61440   *   __experimentalNavigatorScreen as NavigatorScreen,
61441   *   __experimentalNavigatorButton as NavigatorButton,
61442   *   __experimentalNavigatorBackButton as NavigatorBackButton,
61443   * } from '@wordpress/components';
61444   *
61445   * const MyNavigation = () => (
61446   *   <NavigatorProvider initialPath="/">
61447   *     <NavigatorScreen path="/">
61448   *       <p>This is the home screen.</p>
61449   *        <NavigatorButton path="/child">
61450   *          Navigate to child screen.
61451   *       </NavigatorButton>
61452   *     </NavigatorScreen>
61453   *
61454   *     <NavigatorScreen path="/child">
61455   *       <p>This is the child screen.</p>
61456   *       <NavigatorBackButton>
61457   *         Go back (to parent)
61458   *       </NavigatorBackButton>
61459   *     </NavigatorScreen>
61460   *   </NavigatorProvider>
61461   * );
61462   * ```
61463   */
61464  const NavigatorBackButton = contextConnect(UnconnectedNavigatorBackButton, 'NavigatorBackButton');
61465  /* harmony default export */ const navigator_back_button_component = ((/* unused pure expression or super */ null && (NavigatorBackButton)));
61466  
61467  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/navigator/navigator-to-parent-button/component.js
61468  /**
61469   * WordPress dependencies
61470   */
61471  
61472  
61473  /**
61474   * Internal dependencies
61475   */
61476  
61477  
61478  
61479  function UnconnectedNavigatorToParentButton(props, forwardedRef) {
61480    external_wp_deprecated_default()('wp.components.NavigatorToParentButton', {
61481      since: '6.7',
61482      alternative: 'wp.components.NavigatorBackButton'
61483    });
61484    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(NavigatorBackButton, {
61485      ref: forwardedRef,
61486      ...props
61487    });
61488  }
61489  
61490  /**
61491   * _Note: this component is deprecated. Please use the `NavigatorBackButton`
61492   * component instead._
61493   *
61494   * @deprecated
61495   */
61496  const NavigatorToParentButton = contextConnect(UnconnectedNavigatorToParentButton, 'NavigatorToParentButton');
61497  /* harmony default export */ const navigator_to_parent_button_component = ((/* unused pure expression or super */ null && (NavigatorToParentButton)));
61498  
61499  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/notice/index.js
61500  /**
61501   * External dependencies
61502   */
61503  
61504  
61505  /**
61506   * WordPress dependencies
61507   */
61508  
61509  
61510  
61511  
61512  
61513  /**
61514   * Internal dependencies
61515   */
61516  
61517  
61518  
61519  
61520  const notice_noop = () => {};
61521  
61522  /**
61523   * Custom hook which announces the message with the given politeness, if a
61524   * valid message is provided.
61525   */
61526  function useSpokenMessage(message, politeness) {
61527    const spokenMessage = typeof message === 'string' ? message : (0,external_wp_element_namespaceObject.renderToString)(message);
61528    (0,external_wp_element_namespaceObject.useEffect)(() => {
61529      if (spokenMessage) {
61530        (0,external_wp_a11y_namespaceObject.speak)(spokenMessage, politeness);
61531      }
61532    }, [spokenMessage, politeness]);
61533  }
61534  function getDefaultPoliteness(status) {
61535    switch (status) {
61536      case 'success':
61537      case 'warning':
61538      case 'info':
61539        return 'polite';
61540      // The default will also catch the 'error' status.
61541      default:
61542        return 'assertive';
61543    }
61544  }
61545  function getStatusLabel(status) {
61546    switch (status) {
61547      case 'warning':
61548        return (0,external_wp_i18n_namespaceObject.__)('Warning notice');
61549      case 'info':
61550        return (0,external_wp_i18n_namespaceObject.__)('Information notice');
61551      case 'error':
61552        return (0,external_wp_i18n_namespaceObject.__)('Error notice');
61553      // The default will also catch the 'success' status.
61554      default:
61555        return (0,external_wp_i18n_namespaceObject.__)('Notice');
61556    }
61557  }
61558  
61559  /**
61560   * `Notice` is a component used to communicate feedback to the user.
61561   *
61562   *```jsx
61563   * import { Notice } from `@wordpress/components`;
61564   *
61565   * const MyNotice = () => (
61566   *   <Notice status="error">An unknown error occurred.</Notice>
61567   * );
61568   * ```
61569   */
61570  function Notice({
61571    className,
61572    status = 'info',
61573    children,
61574    spokenMessage = children,
61575    onRemove = notice_noop,
61576    isDismissible = true,
61577    actions = [],
61578    politeness = getDefaultPoliteness(status),
61579    __unstableHTML,
61580    // onDismiss is a callback executed when the notice is dismissed.
61581    // It is distinct from onRemove, which _looks_ like a callback but is
61582    // actually the function to call to remove the notice from the UI.
61583    onDismiss = notice_noop
61584  }) {
61585    useSpokenMessage(spokenMessage, politeness);
61586    const classes = dist_clsx(className, 'components-notice', 'is-' + status, {
61587      'is-dismissible': isDismissible
61588    });
61589    if (__unstableHTML && typeof children === 'string') {
61590      children = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_element_namespaceObject.RawHTML, {
61591        children: children
61592      });
61593    }
61594    const onDismissNotice = () => {
61595      onDismiss();
61596      onRemove();
61597    };
61598    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", {
61599      className: classes,
61600      children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(visually_hidden_component, {
61601        children: getStatusLabel(status)
61602      }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", {
61603        className: "components-notice__content",
61604        children: [children, /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", {
61605          className: "components-notice__actions",
61606          children: actions.map(({
61607            className: buttonCustomClasses,
61608            label,
61609            isPrimary,
61610            variant,
61611            noDefaultClasses = false,
61612            onClick,
61613            url
61614          }, index) => {
61615            let computedVariant = variant;
61616            if (variant !== 'primary' && !noDefaultClasses) {
61617              computedVariant = !url ? 'secondary' : 'link';
61618            }
61619            if (typeof computedVariant === 'undefined' && isPrimary) {
61620              computedVariant = 'primary';
61621            }
61622            return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, {
61623              href: url,
61624              variant: computedVariant,
61625              onClick: url ? undefined : onClick,
61626              className: dist_clsx('components-notice__action', buttonCustomClasses),
61627              children: label
61628            }, index);
61629          })
61630        })]
61631      }), isDismissible && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, {
61632        className: "components-notice__dismiss",
61633        icon: library_close,
61634        label: (0,external_wp_i18n_namespaceObject.__)('Close'),
61635        onClick: onDismissNotice
61636      })]
61637    });
61638  }
61639  /* harmony default export */ const build_module_notice = (Notice);
61640  
61641  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/notice/list.js
61642  /**
61643   * External dependencies
61644   */
61645  
61646  
61647  /**
61648   * Internal dependencies
61649   */
61650  
61651  
61652  
61653  const list_noop = () => {};
61654  
61655  /**
61656   * `NoticeList` is a component used to render a collection of notices.
61657   *
61658   *```jsx
61659   * import { Notice, NoticeList } from `@wordpress/components`;
61660   *
61661   * const MyNoticeList = () => {
61662   *    const [ notices, setNotices ] = useState( [
61663   *        {
61664   *            id: 'second-notice',
61665   *            content: 'second notice content',
61666   *        },
61667   *        {
61668   *            id: 'fist-notice',
61669   *            content: 'first notice content',
61670   *        },
61671   *    ] );
61672   *
61673   *    const removeNotice = ( id ) => {
61674   *        setNotices( notices.filter( ( notice ) => notice.id !== id ) );
61675   *    };
61676   *
61677   *    return <NoticeList notices={ notices } onRemove={ removeNotice } />;
61678   *};
61679   *```
61680   */
61681  function NoticeList({
61682    notices,
61683    onRemove = list_noop,
61684    className,
61685    children
61686  }) {
61687    const removeNotice = id => () => onRemove(id);
61688    className = dist_clsx('components-notice-list', className);
61689    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", {
61690      className: className,
61691      children: [children, [...notices].reverse().map(notice => {
61692        const {
61693          content,
61694          ...restNotice
61695        } = notice;
61696        return /*#__PURE__*/(0,external_React_.createElement)(build_module_notice, {
61697          ...restNotice,
61698          key: notice.id,
61699          onRemove: removeNotice(notice.id)
61700        }, notice.content);
61701      })]
61702    });
61703  }
61704  /* harmony default export */ const list = (NoticeList);
61705  
61706  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/panel/header.js
61707  
61708  
61709  /**
61710   * Internal dependencies
61711   */
61712  
61713  /**
61714   * `PanelHeader` renders the header for the `Panel`.
61715   * This is used by the `Panel` component under the hood,
61716   * so it does not typically need to be used.
61717   */
61718  function PanelHeader({
61719    label,
61720    children
61721  }) {
61722    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", {
61723      className: "components-panel__header",
61724      children: [label && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("h2", {
61725        children: label
61726      }), children]
61727    });
61728  }
61729  /* harmony default export */ const panel_header = (PanelHeader);
61730  
61731  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/panel/index.js
61732  /**
61733   * External dependencies
61734   */
61735  
61736  
61737  /**
61738   * WordPress dependencies
61739   */
61740  
61741  
61742  /**
61743   * Internal dependencies
61744   */
61745  
61746  
61747  
61748  function UnforwardedPanel({
61749    header,
61750    className,
61751    children
61752  }, ref) {
61753    const classNames = dist_clsx(className, 'components-panel');
61754    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", {
61755      className: classNames,
61756      ref: ref,
61757      children: [header && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(panel_header, {
61758        label: header
61759      }), children]
61760    });
61761  }
61762  
61763  /**
61764   * `Panel` expands and collapses multiple sections of content.
61765   *
61766   * ```jsx
61767   * import { Panel, PanelBody, PanelRow } from '@wordpress/components';
61768   * import { more } from '@wordpress/icons';
61769   *
61770   * const MyPanel = () => (
61771   *     <Panel header="My Panel">
61772   *         <PanelBody title="My Block Settings" icon={ more } initialOpen={ true }>
61773   *             <PanelRow>My Panel Inputs and Labels</PanelRow>
61774   *         </PanelBody>
61775   *     </Panel>
61776   * );
61777   * ```
61778   */
61779  const Panel = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedPanel);
61780  /* harmony default export */ const panel = (Panel);
61781  
61782  ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/chevron-up.js
61783  /**
61784   * WordPress dependencies
61785   */
61786  
61787  
61788  const chevronUp = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, {
61789    viewBox: "0 0 24 24",
61790    xmlns: "http://www.w3.org/2000/svg",
61791    children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, {
61792      d: "M6.5 12.4L12 8l5.5 4.4-.9 1.2L12 10l-4.5 3.6-1-1.2z"
61793    })
61794  });
61795  /* harmony default export */ const chevron_up = (chevronUp);
61796  
61797  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/panel/body.js
61798  /**
61799   * External dependencies
61800   */
61801  
61802  
61803  /**
61804   * WordPress dependencies
61805   */
61806  
61807  
61808  
61809  
61810  /**
61811   * Internal dependencies
61812   */
61813  
61814  
61815  
61816  
61817  
61818  
61819  const body_noop = () => {};
61820  function UnforwardedPanelBody(props, ref) {
61821    const {
61822      buttonProps = {},
61823      children,
61824      className,
61825      icon,
61826      initialOpen,
61827      onToggle = body_noop,
61828      opened,
61829      title,
61830      scrollAfterOpen = true
61831    } = props;
61832    const [isOpened, setIsOpened] = use_controlled_state(opened, {
61833      initial: initialOpen === undefined ? true : initialOpen,
61834      fallback: false
61835    });
61836    const nodeRef = (0,external_wp_element_namespaceObject.useRef)(null);
61837  
61838    // Defaults to 'smooth' scrolling
61839    // https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollIntoView
61840    const scrollBehavior = (0,external_wp_compose_namespaceObject.useReducedMotion)() ? 'auto' : 'smooth';
61841    const handleOnToggle = event => {
61842      event.preventDefault();
61843      const next = !isOpened;
61844      setIsOpened(next);
61845      onToggle(next);
61846    };
61847  
61848    // Ref is used so that the effect does not re-run upon scrollAfterOpen changing value.
61849    const scrollAfterOpenRef = (0,external_wp_element_namespaceObject.useRef)();
61850    scrollAfterOpenRef.current = scrollAfterOpen;
61851    // Runs after initial render.
61852    use_update_effect(() => {
61853      if (isOpened && scrollAfterOpenRef.current && nodeRef.current?.scrollIntoView) {
61854        /*
61855         * Scrolls the content into view when visible.
61856         * This improves the UX when there are multiple stacking <PanelBody />
61857         * components in a scrollable container.
61858         */
61859        nodeRef.current.scrollIntoView({
61860          inline: 'nearest',
61861          block: 'nearest',
61862          behavior: scrollBehavior
61863        });
61864      }
61865    }, [isOpened, scrollBehavior]);
61866    const classes = dist_clsx('components-panel__body', className, {
61867      'is-opened': isOpened
61868    });
61869    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", {
61870      className: classes,
61871      ref: (0,external_wp_compose_namespaceObject.useMergeRefs)([nodeRef, ref]),
61872      children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(PanelBodyTitle, {
61873        icon: icon,
61874        isOpened: Boolean(isOpened),
61875        onClick: handleOnToggle,
61876        title: title,
61877        ...buttonProps
61878      }), typeof children === 'function' ? children({
61879        opened: Boolean(isOpened)
61880      }) : isOpened && children]
61881    });
61882  }
61883  const PanelBodyTitle = (0,external_wp_element_namespaceObject.forwardRef)(({
61884    isOpened,
61885    icon,
61886    title,
61887    ...props
61888  }, ref) => {
61889    if (!title) {
61890      return null;
61891    }
61892    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("h2", {
61893      className: "components-panel__body-title",
61894      children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(build_module_button, {
61895        className: "components-panel__body-toggle",
61896        "aria-expanded": isOpened,
61897        ref: ref,
61898        ...props,
61899        children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", {
61900          "aria-hidden": "true",
61901          children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_icon, {
61902            className: "components-panel__arrow",
61903            icon: isOpened ? chevron_up : chevron_down
61904          })
61905        }), title, icon && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_icon, {
61906          icon: icon,
61907          className: "components-panel__icon",
61908          size: 20
61909        })]
61910      })
61911    });
61912  });
61913  const PanelBody = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedPanelBody);
61914  /* harmony default export */ const body = (PanelBody);
61915  
61916  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/panel/row.js
61917  /**
61918   * External dependencies
61919   */
61920  
61921  
61922  /**
61923   * WordPress dependencies
61924   */
61925  
61926  
61927  /**
61928   * Internal dependencies
61929   */
61930  
61931  function UnforwardedPanelRow({
61932    className,
61933    children
61934  }, ref) {
61935    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", {
61936      className: dist_clsx('components-panel__row', className),
61937      ref: ref,
61938      children: children
61939    });
61940  }
61941  
61942  /**
61943   * `PanelRow` is a generic container for rows within a `PanelBody`.
61944   * It is a flex container with a top margin for spacing.
61945   */
61946  const PanelRow = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedPanelRow);
61947  /* harmony default export */ const row = (PanelRow);
61948  
61949  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/placeholder/index.js
61950  /**
61951   * External dependencies
61952   */
61953  
61954  
61955  /**
61956   * WordPress dependencies
61957   */
61958  
61959  
61960  
61961  
61962  
61963  /**
61964   * Internal dependencies
61965   */
61966  
61967  
61968  
61969  const PlaceholderIllustration = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, {
61970    className: "components-placeholder__illustration",
61971    fill: "none",
61972    xmlns: "http://www.w3.org/2000/svg",
61973    viewBox: "0 0 60 60",
61974    preserveAspectRatio: "none",
61975    children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, {
61976      vectorEffect: "non-scaling-stroke",
61977      d: "M60 60 0 0"
61978    })
61979  });
61980  
61981  /**
61982   * Renders a placeholder. Normally used by blocks to render their empty state.
61983   *
61984   * ```jsx
61985   * import { Placeholder } from '@wordpress/components';
61986   * import { more } from '@wordpress/icons';
61987   *
61988   * const MyPlaceholder = () => <Placeholder icon={ more } label="Placeholder" />;
61989   * ```
61990   */
61991  function Placeholder(props) {
61992    const {
61993      icon,
61994      children,
61995      label,
61996      instructions,
61997      className,
61998      notices,
61999      preview,
62000      isColumnLayout,
62001      withIllustration,
62002      ...additionalProps
62003    } = props;
62004    const [resizeListener, {
62005      width
62006    }] = (0,external_wp_compose_namespaceObject.useResizeObserver)();
62007  
62008    // Since `useResizeObserver` will report a width of `null` until after the
62009    // first render, avoid applying any modifier classes until width is known.
62010    let modifierClassNames;
62011    if (typeof width === 'number') {
62012      modifierClassNames = {
62013        'is-large': width >= 480,
62014        'is-medium': width >= 160 && width < 480,
62015        'is-small': width < 160
62016      };
62017    }
62018    const classes = dist_clsx('components-placeholder', className, modifierClassNames, withIllustration ? 'has-illustration' : null);
62019    const fieldsetClasses = dist_clsx('components-placeholder__fieldset', {
62020      'is-column-layout': isColumnLayout
62021    });
62022    (0,external_wp_element_namespaceObject.useEffect)(() => {
62023      if (instructions) {
62024        (0,external_wp_a11y_namespaceObject.speak)(instructions);
62025      }
62026    }, [instructions]);
62027    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", {
62028      ...additionalProps,
62029      className: classes,
62030      children: [withIllustration ? PlaceholderIllustration : null, resizeListener, notices, preview && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", {
62031        className: "components-placeholder__preview",
62032        children: preview
62033      }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", {
62034        className: "components-placeholder__label",
62035        children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_icon, {
62036          icon: icon
62037        }), label]
62038      }), !!instructions && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", {
62039        className: "components-placeholder__instructions",
62040        children: instructions
62041      }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", {
62042        className: fieldsetClasses,
62043        children: children
62044      })]
62045    });
62046  }
62047  /* harmony default export */ const placeholder = (Placeholder);
62048  
62049  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/progress-bar/styles.js
62050  
62051  function progress_bar_styles_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)."; }
62052  /**
62053   * External dependencies
62054   */
62055  
62056  
62057  
62058  /**
62059   * WordPress dependencies
62060   */
62061  
62062  
62063  /**
62064   * Internal dependencies
62065   */
62066  
62067  function animateProgressBar(isRtl = false) {
62068    const animationDirection = isRtl ? 'right' : 'left';
62069    return emotion_react_browser_esm_keyframes({
62070      '0%': {
62071        [animationDirection]: '-50%'
62072      },
62073      '100%': {
62074        [animationDirection]: '100%'
62075      }
62076    });
62077  }
62078  
62079  // Width of the indicator for the indeterminate progress bar
62080  const INDETERMINATE_TRACK_WIDTH = 50;
62081  const styles_Track = /*#__PURE__*/emotion_styled_base_browser_esm("div",  true ? {
62082    target: "e15u147w2"
62083  } : 0)("position:relative;overflow:hidden;height:", config_values.borderWidthFocus, ";background-color:color-mix(\n\t\tin srgb,\n\t\t", COLORS.theme.foreground, ",\n\t\ttransparent 90%\n\t);border-radius:", config_values.radiusFull, ";outline:2px solid transparent;outline-offset:2px;:where( & ){width:160px;}" + ( true ? "" : 0));
62084  var progress_bar_styles_ref =  true ? {
62085    name: "152sa26",
62086    styles: "width:var(--indicator-width);transition:width 0.4s ease-in-out"
62087  } : 0;
62088  const Indicator = /*#__PURE__*/emotion_styled_base_browser_esm("div",  true ? {
62089    target: "e15u147w1"
62090  } : 0)("display:inline-block;position:absolute;top:0;height:100%;border-radius:", config_values.radiusFull, ";background-color:color-mix(\n\t\tin srgb,\n\t\t", COLORS.theme.foreground, ",\n\t\ttransparent 10%\n\t);outline:2px solid transparent;outline-offset:-2px;", ({
62091    isIndeterminate
62092  }) => isIndeterminate ? /*#__PURE__*/emotion_react_browser_esm_css({
62093    animationDuration: '1.5s',
62094    animationTimingFunction: 'ease-in-out',
62095    animationIterationCount: 'infinite',
62096    animationName: animateProgressBar((0,external_wp_i18n_namespaceObject.isRTL)()),
62097    width: `$INDETERMINATE_TRACK_WIDTH}%`
62098  },  true ? "" : 0,  true ? "" : 0) : progress_bar_styles_ref, ";" + ( true ? "" : 0));
62099  const ProgressElement = /*#__PURE__*/emotion_styled_base_browser_esm("progress",  true ? {
62100    target: "e15u147w0"
62101  } : 0)( true ? {
62102    name: "11fb690",
62103    styles: "position:absolute;top:0;left:0;opacity:0;width:100%;height:100%"
62104  } : 0);
62105  
62106  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/progress-bar/index.js
62107  /**
62108   * External dependencies
62109   */
62110  
62111  /**
62112   * WordPress dependencies
62113   */
62114  
62115  
62116  
62117  /**
62118   * Internal dependencies
62119   */
62120  
62121  
62122  
62123  function UnforwardedProgressBar(props, ref) {
62124    const {
62125      className,
62126      value,
62127      ...progressProps
62128    } = props;
62129    const isIndeterminate = !Number.isFinite(value);
62130    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(styles_Track, {
62131      className: className,
62132      children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Indicator, {
62133        style: {
62134          '--indicator-width': !isIndeterminate ? `$value}%` : undefined
62135        },
62136        isIndeterminate: isIndeterminate
62137      }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ProgressElement, {
62138        max: 100,
62139        value: value,
62140        "aria-label": (0,external_wp_i18n_namespaceObject.__)('Loading …'),
62141        ref: ref,
62142        ...progressProps
62143      })]
62144    });
62145  }
62146  
62147  /**
62148   * A simple horizontal progress bar component.
62149   *
62150   * Supports two modes: determinate and indeterminate. A progress bar is determinate
62151   * when a specific progress value has been specified (from 0 to 100), and indeterminate
62152   * when a value hasn't been specified.
62153   *
62154   * ```jsx
62155   * import { ProgressBar } from '@wordpress/components';
62156   *
62157   * const MyLoadingComponent = () => {
62158   *     return <ProgressBar />;
62159   * };
62160   * ```
62161   */
62162  const ProgressBar = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedProgressBar);
62163  /* harmony default export */ const progress_bar = (ProgressBar);
62164  
62165  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/query-controls/terms.js
62166  /**
62167   * Internal dependencies
62168   */
62169  
62170  const ensureParentsAreDefined = terms => {
62171    return terms.every(term => term.parent !== null);
62172  };
62173  /**
62174   * Returns terms in a tree form.
62175   *
62176   * @param flatTerms Array of terms in flat format.
62177   *
62178   * @return Terms in tree format.
62179   */
62180  function buildTermsTree(flatTerms) {
62181    const flatTermsWithParentAndChildren = flatTerms.map(term => ({
62182      children: [],
62183      parent: null,
62184      ...term,
62185      id: String(term.id)
62186    }));
62187  
62188    // We use a custom type guard here to ensure that the parent property is
62189    // defined on all terms. The type of the `parent` property is `number | null`
62190    // and we need to ensure that it is `number`. This is because we use the
62191    // `parent` property as a key in the `termsByParent` object.
62192    if (!ensureParentsAreDefined(flatTermsWithParentAndChildren)) {
62193      return flatTermsWithParentAndChildren;
62194    }
62195    const termsByParent = flatTermsWithParentAndChildren.reduce((acc, term) => {
62196      const {
62197        parent
62198      } = term;
62199      if (!acc[parent]) {
62200        acc[parent] = [];
62201      }
62202      acc[parent].push(term);
62203      return acc;
62204    }, {});
62205    const fillWithChildren = terms => {
62206      return terms.map(term => {
62207        const children = termsByParent[term.id];
62208        return {
62209          ...term,
62210          children: children && children.length ? fillWithChildren(children) : []
62211        };
62212      });
62213    };
62214    return fillWithChildren(termsByParent['0'] || []);
62215  }
62216  
62217  ;// CONCATENATED MODULE: external ["wp","htmlEntities"]
62218  const external_wp_htmlEntities_namespaceObject = window["wp"]["htmlEntities"];
62219  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/tree-select/index.js
62220  /**
62221   * WordPress dependencies
62222   */
62223  
62224  
62225  
62226  /**
62227   * Internal dependencies
62228   */
62229  
62230  
62231  
62232  
62233  const tree_select_CONTEXT_VALUE = {
62234    BaseControl: {
62235      // Temporary during deprecation grace period: Overrides the underlying `__associatedWPComponentName`
62236      // via the context system to override the value set by SelectControl.
62237      _overrides: {
62238        __associatedWPComponentName: 'TreeSelect'
62239      }
62240    }
62241  };
62242  function getSelectOptions(tree, level = 0) {
62243    return tree.flatMap(treeNode => [{
62244      value: treeNode.id,
62245      label: '\u00A0'.repeat(level * 3) + (0,external_wp_htmlEntities_namespaceObject.decodeEntities)(treeNode.name)
62246    }, ...getSelectOptions(treeNode.children || [], level + 1)]);
62247  }
62248  
62249  /**
62250   * TreeSelect component is used to generate select input fields.
62251   *
62252   * ```jsx
62253   * import { TreeSelect } from '@wordpress/components';
62254   * import { useState } from '@wordpress/element';
62255   *
62256   * const MyTreeSelect = () => {
62257   *     const [ page, setPage ] = useState( 'p21' );
62258   *
62259   *     return (
62260   *         <TreeSelect
62261   *             __nextHasNoMarginBottom
62262   *             label="Parent page"
62263   *             noOptionLabel="No parent page"
62264   *             onChange={ ( newPage ) => setPage( newPage ) }
62265   *             selectedId={ page }
62266   *             tree={ [
62267   *                 {
62268   *                     name: 'Page 1',
62269   *                     id: 'p1',
62270   *                     children: [
62271   *                         { name: 'Descend 1 of page 1', id: 'p11' },
62272   *                         { name: 'Descend 2 of page 1', id: 'p12' },
62273   *                     ],
62274   *                 },
62275   *                 {
62276   *                     name: 'Page 2',
62277   *                     id: 'p2',
62278   *                     children: [
62279   *                         {
62280   *                             name: 'Descend 1 of page 2',
62281   *                             id: 'p21',
62282   *                             children: [
62283   *                                 {
62284   *                                     name: 'Descend 1 of Descend 1 of page 2',
62285   *                                     id: 'p211',
62286   *                                 },
62287   *                             ],
62288   *                         },
62289   *                     ],
62290   *                 },
62291   *             ] }
62292   *         />
62293   *     );
62294   * }
62295   * ```
62296   */
62297  function TreeSelect(props) {
62298    const {
62299      label,
62300      noOptionLabel,
62301      onChange,
62302      selectedId,
62303      tree = [],
62304      ...restProps
62305    } = useDeprecated36pxDefaultSizeProp(props);
62306    const options = (0,external_wp_element_namespaceObject.useMemo)(() => {
62307      return [noOptionLabel && {
62308        value: '',
62309        label: noOptionLabel
62310      }, ...getSelectOptions(tree)].filter(option => !!option);
62311    }, [noOptionLabel, tree]);
62312    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ContextSystemProvider, {
62313      value: tree_select_CONTEXT_VALUE,
62314      children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(SelectControl, {
62315        label,
62316        options,
62317        onChange,
62318        value: selectedId,
62319        ...restProps
62320      })
62321    });
62322  }
62323  /* harmony default export */ const tree_select = (TreeSelect);
62324  
62325  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/query-controls/author-select.js
62326  /**
62327   * Internal dependencies
62328   */
62329  
62330  
62331  
62332  function AuthorSelect({
62333    __next40pxDefaultSize,
62334    label,
62335    noOptionLabel,
62336    authorList,
62337    selectedAuthorId,
62338    onChange: onChangeProp
62339  }) {
62340    if (!authorList) {
62341      return null;
62342    }
62343    const termsTree = buildTermsTree(authorList);
62344    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(tree_select, {
62345      label,
62346      noOptionLabel,
62347      onChange: onChangeProp,
62348      tree: termsTree,
62349      selectedId: selectedAuthorId !== undefined ? String(selectedAuthorId) : undefined,
62350      __nextHasNoMarginBottom: true,
62351      __next40pxDefaultSize: __next40pxDefaultSize
62352    });
62353  }
62354  
62355  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/query-controls/category-select.js
62356  /**
62357   * Internal dependencies
62358   */
62359  
62360  
62361  
62362  /**
62363   * WordPress dependencies
62364   */
62365  
62366  
62367  function CategorySelect({
62368    __next40pxDefaultSize,
62369    label,
62370    noOptionLabel,
62371    categoriesList,
62372    selectedCategoryId,
62373    onChange: onChangeProp,
62374    ...props
62375  }) {
62376    const termsTree = (0,external_wp_element_namespaceObject.useMemo)(() => {
62377      return buildTermsTree(categoriesList);
62378    }, [categoriesList]);
62379    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(tree_select, {
62380      label,
62381      noOptionLabel,
62382      onChange: onChangeProp,
62383      tree: termsTree,
62384      selectedId: selectedCategoryId !== undefined ? String(selectedCategoryId) : undefined,
62385      ...props,
62386      __nextHasNoMarginBottom: true,
62387      __next40pxDefaultSize: __next40pxDefaultSize
62388    });
62389  }
62390  
62391  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/query-controls/index.js
62392  /**
62393   * WordPress dependencies
62394   */
62395  
62396  
62397  /**
62398   * Internal dependencies
62399   */
62400  
62401  
62402  
62403  
62404  
62405  
62406  
62407  const DEFAULT_MIN_ITEMS = 1;
62408  const DEFAULT_MAX_ITEMS = 100;
62409  const MAX_CATEGORIES_SUGGESTIONS = 20;
62410  function isSingleCategorySelection(props) {
62411    return 'categoriesList' in props;
62412  }
62413  function isMultipleCategorySelection(props) {
62414    return 'categorySuggestions' in props;
62415  }
62416  
62417  /**
62418   * Controls to query for posts.
62419   *
62420   * ```jsx
62421   * const MyQueryControls = () => (
62422   *   <QueryControls
62423   *     { ...{ maxItems, minItems, numberOfItems, order, orderBy } }
62424   *     onOrderByChange={ ( newOrderBy ) => {
62425   *       updateQuery( { orderBy: newOrderBy } )
62426   *     }
62427   *     onOrderChange={ ( newOrder ) => {
62428   *       updateQuery( { order: newOrder } )
62429   *     }
62430   *     categoriesList={ categories }
62431   *     selectedCategoryId={ category }
62432   *     onCategoryChange={ ( newCategory ) => {
62433   *       updateQuery( { category: newCategory } )
62434   *     }
62435   *     onNumberOfItemsChange={ ( newNumberOfItems ) => {
62436   *       updateQuery( { numberOfItems: newNumberOfItems } )
62437   *     } }
62438   *   />
62439   * );
62440   * ```
62441   */
62442  function QueryControls({
62443    authorList,
62444    selectedAuthorId,
62445    numberOfItems,
62446    order,
62447    orderBy,
62448    maxItems = DEFAULT_MAX_ITEMS,
62449    minItems = DEFAULT_MIN_ITEMS,
62450    onAuthorChange,
62451    onNumberOfItemsChange,
62452    onOrderChange,
62453    onOrderByChange,
62454    // Props for single OR multiple category selection are not destructured here,
62455    // but instead are destructured inline where necessary.
62456    ...props
62457  }) {
62458    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(v_stack_component, {
62459      spacing: "4",
62460      className: "components-query-controls",
62461      children: [onOrderChange && onOrderByChange && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(select_control, {
62462        __nextHasNoMarginBottom: true,
62463        __next40pxDefaultSize: true,
62464        label: (0,external_wp_i18n_namespaceObject.__)('Order by'),
62465        value: orderBy === undefined || order === undefined ? undefined : `$orderBy}/$order}`,
62466        options: [{
62467          label: (0,external_wp_i18n_namespaceObject.__)('Newest to oldest'),
62468          value: 'date/desc'
62469        }, {
62470          label: (0,external_wp_i18n_namespaceObject.__)('Oldest to newest'),
62471          value: 'date/asc'
62472        }, {
62473          /* translators: Label for ordering posts by title in ascending order. */
62474          label: (0,external_wp_i18n_namespaceObject.__)('A → Z'),
62475          value: 'title/asc'
62476        }, {
62477          /* translators: Label for ordering posts by title in descending order. */
62478          label: (0,external_wp_i18n_namespaceObject.__)('Z → A'),
62479          value: 'title/desc'
62480        }],
62481        onChange: value => {
62482          if (typeof value !== 'string') {
62483            return;
62484          }
62485          const [newOrderBy, newOrder] = value.split('/');
62486          if (newOrder !== order) {
62487            onOrderChange(newOrder);
62488          }
62489          if (newOrderBy !== orderBy) {
62490            onOrderByChange(newOrderBy);
62491          }
62492        }
62493      }, "query-controls-order-select"), isSingleCategorySelection(props) && props.categoriesList && props.onCategoryChange && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(CategorySelect, {
62494        __next40pxDefaultSize: true,
62495        categoriesList: props.categoriesList,
62496        label: (0,external_wp_i18n_namespaceObject.__)('Category'),
62497        noOptionLabel: (0,external_wp_i18n_namespaceObject._x)('All', 'categories'),
62498        selectedCategoryId: props.selectedCategoryId,
62499        onChange: props.onCategoryChange
62500      }, "query-controls-category-select"), isMultipleCategorySelection(props) && props.categorySuggestions && props.onCategoryChange && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(form_token_field, {
62501        __next40pxDefaultSize: true,
62502        __nextHasNoMarginBottom: true,
62503        label: (0,external_wp_i18n_namespaceObject.__)('Categories'),
62504        value: props.selectedCategories && props.selectedCategories.map(item => ({
62505          id: item.id,
62506          // Keeping the fallback to `item.value` for legacy reasons,
62507          // even if items of `selectedCategories` should not have a
62508          // `value` property.
62509          // @ts-expect-error
62510          value: item.name || item.value
62511        })),
62512        suggestions: Object.keys(props.categorySuggestions),
62513        onChange: props.onCategoryChange,
62514        maxSuggestions: MAX_CATEGORIES_SUGGESTIONS
62515      }, "query-controls-categories-select"), onAuthorChange && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(AuthorSelect, {
62516        __next40pxDefaultSize: true,
62517        authorList: authorList,
62518        label: (0,external_wp_i18n_namespaceObject.__)('Author'),
62519        noOptionLabel: (0,external_wp_i18n_namespaceObject._x)('All', 'authors'),
62520        selectedAuthorId: selectedAuthorId,
62521        onChange: onAuthorChange
62522      }, "query-controls-author-select"), onNumberOfItemsChange && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(range_control, {
62523        __nextHasNoMarginBottom: true,
62524        __next40pxDefaultSize: true,
62525        label: (0,external_wp_i18n_namespaceObject.__)('Number of items'),
62526        value: numberOfItems,
62527        onChange: onNumberOfItemsChange,
62528        min: minItems,
62529        max: maxItems,
62530        required: true
62531      }, "query-controls-range-control")]
62532    });
62533  }
62534  /* harmony default export */ const query_controls = (QueryControls);
62535  
62536  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/radio-group/context.js
62537  /**
62538   * External dependencies
62539   */
62540  
62541  /**
62542   * WordPress dependencies
62543   */
62544  
62545  const RadioGroupContext = (0,external_wp_element_namespaceObject.createContext)({
62546    store: undefined,
62547    disabled: undefined
62548  });
62549  
62550  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/radio-group/radio.js
62551  /**
62552   * WordPress dependencies
62553   */
62554  
62555  
62556  /**
62557   * External dependencies
62558   */
62559  
62560  
62561  
62562  /**
62563   * Internal dependencies
62564   */
62565  
62566  
62567  
62568  function UnforwardedRadio({
62569    value,
62570    children,
62571    ...props
62572  }, ref) {
62573    const {
62574      store,
62575      disabled
62576    } = (0,external_wp_element_namespaceObject.useContext)(RadioGroupContext);
62577    const selectedValue = useStoreState(store, 'value');
62578    const isChecked = selectedValue !== undefined && selectedValue === value;
62579    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Radio, {
62580      disabled: disabled,
62581      store: store,
62582      ref: ref,
62583      value: value,
62584      render: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, {
62585        variant: isChecked ? 'primary' : 'secondary',
62586        ...props
62587      }),
62588      children: children || value
62589    });
62590  }
62591  
62592  /**
62593   * @deprecated Use `RadioControl` or `ToggleGroupControl` instead.
62594   */
62595  const radio_Radio = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedRadio);
62596  /* harmony default export */ const radio_group_radio = (radio_Radio);
62597  
62598  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/radio-group/index.js
62599  /**
62600   * External dependencies
62601   */
62602  
62603  
62604  /**
62605   * WordPress dependencies
62606   */
62607  
62608  
62609  /**
62610   * Internal dependencies
62611   */
62612  
62613  
62614  
62615  function UnforwardedRadioGroup({
62616    label,
62617    checked,
62618    defaultChecked,
62619    disabled,
62620    onChange,
62621    children,
62622    ...props
62623  }, ref) {
62624    const radioStore = useRadioStore({
62625      value: checked,
62626      defaultValue: defaultChecked,
62627      setValue: newValue => {
62628        onChange?.(newValue !== null && newValue !== void 0 ? newValue : undefined);
62629      }
62630    });
62631    const contextValue = (0,external_wp_element_namespaceObject.useMemo)(() => ({
62632      store: radioStore,
62633      disabled
62634    }), [radioStore, disabled]);
62635    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(RadioGroupContext.Provider, {
62636      value: contextValue,
62637      children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(RadioGroup, {
62638        store: radioStore,
62639        render: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(button_group, {
62640          children: children
62641        }),
62642        "aria-label": label,
62643        ref: ref,
62644        ...props
62645      })
62646    });
62647  }
62648  
62649  /**
62650   * @deprecated Use `RadioControl` or `ToggleGroupControl` instead.
62651   */
62652  const radio_group_RadioGroup = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedRadioGroup);
62653  /* harmony default export */ const radio_group = (radio_group_RadioGroup);
62654  
62655  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/radio-control/index.js
62656  /**
62657   * External dependencies
62658   */
62659  
62660  /**
62661   * WordPress dependencies
62662   */
62663  
62664  
62665  /**
62666   * Internal dependencies
62667   */
62668  
62669  
62670  
62671  
62672  
62673  
62674  function generateOptionDescriptionId(radioGroupId, index) {
62675    return `$radioGroupId}-$index}-option-description`;
62676  }
62677  function generateOptionId(radioGroupId, index) {
62678    return `$radioGroupId}-$index}`;
62679  }
62680  function generateHelpId(radioGroupId) {
62681    return `$radioGroupId}__help`;
62682  }
62683  
62684  /**
62685   * Render a user interface to select the user type using radio inputs.
62686   *
62687   * ```jsx
62688   * import { RadioControl } from '@wordpress/components';
62689   * import { useState } from '@wordpress/element';
62690   *
62691   * const MyRadioControl = () => {
62692   *   const [ option, setOption ] = useState( 'a' );
62693   *
62694   *   return (
62695   *     <RadioControl
62696   *       label="User type"
62697   *       help="The type of the current user"
62698   *       selected={ option }
62699   *       options={ [
62700   *         { label: 'Author', value: 'a' },
62701   *         { label: 'Editor', value: 'e' },
62702   *       ] }
62703   *       onChange={ ( value ) => setOption( value ) }
62704   *     />
62705   *   );
62706   * };
62707   * ```
62708   */
62709  function RadioControl(props) {
62710    const {
62711      label,
62712      className,
62713      selected,
62714      help,
62715      onChange,
62716      hideLabelFromVision,
62717      options = [],
62718      id: preferredId,
62719      ...additionalProps
62720    } = props;
62721    const id = (0,external_wp_compose_namespaceObject.useInstanceId)(RadioControl, 'inspector-radio-control', preferredId);
62722    const onChangeValue = event => onChange(event.target.value);
62723    if (!options?.length) {
62724      return null;
62725    }
62726    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("fieldset", {
62727      id: id,
62728      className: dist_clsx(className, 'components-radio-control'),
62729      "aria-describedby": !!help ? generateHelpId(id) : undefined,
62730      children: [hideLabelFromVision ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(visually_hidden_component, {
62731        as: "legend",
62732        children: label
62733      }) : /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(base_control.VisualLabel, {
62734        as: "legend",
62735        children: label
62736      }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(v_stack_component, {
62737        spacing: 3,
62738        className: dist_clsx('components-radio-control__group-wrapper', {
62739          'has-help': !!help
62740        }),
62741        children: options.map((option, index) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", {
62742          className: "components-radio-control__option",
62743          children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("input", {
62744            id: generateOptionId(id, index),
62745            className: "components-radio-control__input",
62746            type: "radio",
62747            name: id,
62748            value: option.value,
62749            onChange: onChangeValue,
62750            checked: option.value === selected,
62751            "aria-describedby": !!option.description ? generateOptionDescriptionId(id, index) : undefined,
62752            ...additionalProps
62753          }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("label", {
62754            className: "components-radio-control__label",
62755            htmlFor: generateOptionId(id, index),
62756            children: option.label
62757          }), !!option.description ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(StyledHelp, {
62758            __nextHasNoMarginBottom: true,
62759            id: generateOptionDescriptionId(id, index),
62760            className: "components-radio-control__option-description",
62761            children: option.description
62762          }) : null]
62763        }, generateOptionId(id, index)))
62764      }), !!help && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(StyledHelp, {
62765        __nextHasNoMarginBottom: true,
62766        id: generateHelpId(id),
62767        className: "components-base-control__help",
62768        children: help
62769      })]
62770    });
62771  }
62772  /* harmony default export */ const radio_control = (RadioControl);
62773  
62774  ;// CONCATENATED MODULE: ./node_modules/re-resizable/lib/resizer.js
62775  var resizer_extends = (undefined && undefined.__extends) || (function () {
62776      var extendStatics = function (d, b) {
62777          extendStatics = Object.setPrototypeOf ||
62778              ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
62779              function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
62780          return extendStatics(d, b);
62781      };
62782      return function (d, b) {
62783          extendStatics(d, b);
62784          function __() { this.constructor = d; }
62785          d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
62786      };
62787  })();
62788  var resizer_assign = (undefined && undefined.__assign) || function () {
62789      resizer_assign = Object.assign || function(t) {
62790          for (var s, i = 1, n = arguments.length; i < n; i++) {
62791              s = arguments[i];
62792              for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
62793                  t[p] = s[p];
62794          }
62795          return t;
62796      };
62797      return resizer_assign.apply(this, arguments);
62798  };
62799  
62800  var rowSizeBase = {
62801      width: '100%',
62802      height: '10px',
62803      top: '0px',
62804      left: '0px',
62805      cursor: 'row-resize',
62806  };
62807  var colSizeBase = {
62808      width: '10px',
62809      height: '100%',
62810      top: '0px',
62811      left: '0px',
62812      cursor: 'col-resize',
62813  };
62814  var edgeBase = {
62815      width: '20px',
62816      height: '20px',
62817      position: 'absolute',
62818  };
62819  var resizer_styles = {
62820      top: resizer_assign(resizer_assign({}, rowSizeBase), { top: '-5px' }),
62821      right: resizer_assign(resizer_assign({}, colSizeBase), { left: undefined, right: '-5px' }),
62822      bottom: resizer_assign(resizer_assign({}, rowSizeBase), { top: undefined, bottom: '-5px' }),
62823      left: resizer_assign(resizer_assign({}, colSizeBase), { left: '-5px' }),
62824      topRight: resizer_assign(resizer_assign({}, edgeBase), { right: '-10px', top: '-10px', cursor: 'ne-resize' }),
62825      bottomRight: resizer_assign(resizer_assign({}, edgeBase), { right: '-10px', bottom: '-10px', cursor: 'se-resize' }),
62826      bottomLeft: resizer_assign(resizer_assign({}, edgeBase), { left: '-10px', bottom: '-10px', cursor: 'sw-resize' }),
62827      topLeft: resizer_assign(resizer_assign({}, edgeBase), { left: '-10px', top: '-10px', cursor: 'nw-resize' }),
62828  };
62829  var Resizer = /** @class */ (function (_super) {
62830      resizer_extends(Resizer, _super);
62831      function Resizer() {
62832          var _this = _super !== null && _super.apply(this, arguments) || this;
62833          _this.onMouseDown = function (e) {
62834              _this.props.onResizeStart(e, _this.props.direction);
62835          };
62836          _this.onTouchStart = function (e) {
62837              _this.props.onResizeStart(e, _this.props.direction);
62838          };
62839          return _this;
62840      }
62841      Resizer.prototype.render = function () {
62842          return (external_React_.createElement("div", { className: this.props.className || '', style: resizer_assign(resizer_assign({ position: 'absolute', userSelect: 'none' }, resizer_styles[this.props.direction]), (this.props.replaceStyles || {})), onMouseDown: this.onMouseDown, onTouchStart: this.onTouchStart }, this.props.children));
62843      };
62844      return Resizer;
62845  }(external_React_.PureComponent));
62846  
62847  
62848  ;// CONCATENATED MODULE: ./node_modules/re-resizable/lib/index.js
62849  var lib_extends = (undefined && undefined.__extends) || (function () {
62850      var extendStatics = function (d, b) {
62851          extendStatics = Object.setPrototypeOf ||
62852              ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
62853              function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
62854          return extendStatics(d, b);
62855      };
62856      return function (d, b) {
62857          extendStatics(d, b);
62858          function __() { this.constructor = d; }
62859          d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
62860      };
62861  })();
62862  var lib_assign = (undefined && undefined.__assign) || function () {
62863      lib_assign = Object.assign || function(t) {
62864          for (var s, i = 1, n = arguments.length; i < n; i++) {
62865              s = arguments[i];
62866              for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
62867                  t[p] = s[p];
62868          }
62869          return t;
62870      };
62871      return lib_assign.apply(this, arguments);
62872  };
62873  
62874  
62875  
62876  var DEFAULT_SIZE = {
62877      width: 'auto',
62878      height: 'auto',
62879  };
62880  var lib_clamp = function (n, min, max) { return Math.max(Math.min(n, max), min); };
62881  var snap = function (n, size) { return Math.round(n / size) * size; };
62882  var hasDirection = function (dir, target) {
62883      return new RegExp(dir, 'i').test(target);
62884  };
62885  // INFO: In case of window is a Proxy and does not porxy Events correctly, use isTouchEvent & isMouseEvent to distinguish event type instead of `instanceof`.
62886  var isTouchEvent = function (event) {
62887      return Boolean(event.touches && event.touches.length);
62888  };
62889  var isMouseEvent = function (event) {
62890      return Boolean((event.clientX || event.clientX === 0) &&
62891          (event.clientY || event.clientY === 0));
62892  };
62893  var findClosestSnap = function (n, snapArray, snapGap) {
62894      if (snapGap === void 0) { snapGap = 0; }
62895      var closestGapIndex = snapArray.reduce(function (prev, curr, index) { return (Math.abs(curr - n) < Math.abs(snapArray[prev] - n) ? index : prev); }, 0);
62896      var gap = Math.abs(snapArray[closestGapIndex] - n);
62897      return snapGap === 0 || gap < snapGap ? snapArray[closestGapIndex] : n;
62898  };
62899  var getStringSize = function (n) {
62900      n = n.toString();
62901      if (n === 'auto') {
62902          return n;
62903      }
62904      if (n.endsWith('px')) {
62905          return n;
62906      }
62907      if (n.endsWith('%')) {
62908          return n;
62909      }
62910      if (n.endsWith('vh')) {
62911          return n;
62912      }
62913      if (n.endsWith('vw')) {
62914          return n;
62915      }
62916      if (n.endsWith('vmax')) {
62917          return n;
62918      }
62919      if (n.endsWith('vmin')) {
62920          return n;
62921      }
62922      return n + "px";
62923  };
62924  var getPixelSize = function (size, parentSize, innerWidth, innerHeight) {
62925      if (size && typeof size === 'string') {
62926          if (size.endsWith('px')) {
62927              return Number(size.replace('px', ''));
62928          }
62929          if (size.endsWith('%')) {
62930              var ratio = Number(size.replace('%', '')) / 100;
62931              return parentSize * ratio;
62932          }
62933          if (size.endsWith('vw')) {
62934              var ratio = Number(size.replace('vw', '')) / 100;
62935              return innerWidth * ratio;
62936          }
62937          if (size.endsWith('vh')) {
62938              var ratio = Number(size.replace('vh', '')) / 100;
62939              return innerHeight * ratio;
62940          }
62941      }
62942      return size;
62943  };
62944  var calculateNewMax = function (parentSize, innerWidth, innerHeight, maxWidth, maxHeight, minWidth, minHeight) {
62945      maxWidth = getPixelSize(maxWidth, parentSize.width, innerWidth, innerHeight);
62946      maxHeight = getPixelSize(maxHeight, parentSize.height, innerWidth, innerHeight);
62947      minWidth = getPixelSize(minWidth, parentSize.width, innerWidth, innerHeight);
62948      minHeight = getPixelSize(minHeight, parentSize.height, innerWidth, innerHeight);
62949      return {
62950          maxWidth: typeof maxWidth === 'undefined' ? undefined : Number(maxWidth),
62951          maxHeight: typeof maxHeight === 'undefined' ? undefined : Number(maxHeight),
62952          minWidth: typeof minWidth === 'undefined' ? undefined : Number(minWidth),
62953          minHeight: typeof minHeight === 'undefined' ? undefined : Number(minHeight),
62954      };
62955  };
62956  var definedProps = [
62957      'as',
62958      'style',
62959      'className',
62960      'grid',
62961      'snap',
62962      'bounds',
62963      'boundsByDirection',
62964      'size',
62965      'defaultSize',
62966      'minWidth',
62967      'minHeight',
62968      'maxWidth',
62969      'maxHeight',
62970      'lockAspectRatio',
62971      'lockAspectRatioExtraWidth',
62972      'lockAspectRatioExtraHeight',
62973      'enable',
62974      'handleStyles',
62975      'handleClasses',
62976      'handleWrapperStyle',
62977      'handleWrapperClass',
62978      'children',
62979      'onResizeStart',
62980      'onResize',
62981      'onResizeStop',
62982      'handleComponent',
62983      'scale',
62984      'resizeRatio',
62985      'snapGap',
62986  ];
62987  // HACK: This class is used to calculate % size.
62988  var baseClassName = '__resizable_base__';
62989  var Resizable = /** @class */ (function (_super) {
62990      lib_extends(Resizable, _super);
62991      function Resizable(props) {
62992          var _this = _super.call(this, props) || this;
62993          _this.ratio = 1;
62994          _this.resizable = null;
62995          // For parent boundary
62996          _this.parentLeft = 0;
62997          _this.parentTop = 0;
62998          // For boundary
62999          _this.resizableLeft = 0;
63000          _this.resizableRight = 0;
63001          _this.resizableTop = 0;
63002          _this.resizableBottom = 0;
63003          // For target boundary
63004          _this.targetLeft = 0;
63005          _this.targetTop = 0;
63006          _this.appendBase = function () {
63007              if (!_this.resizable || !_this.window) {
63008                  return null;
63009              }
63010              var parent = _this.parentNode;
63011              if (!parent) {
63012                  return null;
63013              }
63014              var element = _this.window.document.createElement('div');
63015              element.style.width = '100%';
63016              element.style.height = '100%';
63017              element.style.position = 'absolute';
63018              element.style.transform = 'scale(0, 0)';
63019              element.style.left = '0';
63020              element.style.flex = '0 0 100%';
63021              if (element.classList) {
63022                  element.classList.add(baseClassName);
63023              }
63024              else {
63025                  element.className += baseClassName;
63026              }
63027              parent.appendChild(element);
63028              return element;
63029          };
63030          _this.removeBase = function (base) {
63031              var parent = _this.parentNode;
63032              if (!parent) {
63033                  return;
63034              }
63035              parent.removeChild(base);
63036          };
63037          _this.ref = function (c) {
63038              if (c) {
63039                  _this.resizable = c;
63040              }
63041          };
63042          _this.state = {
63043              isResizing: false,
63044              width: typeof (_this.propsSize && _this.propsSize.width) === 'undefined'
63045                  ? 'auto'
63046                  : _this.propsSize && _this.propsSize.width,
63047              height: typeof (_this.propsSize && _this.propsSize.height) === 'undefined'
63048                  ? 'auto'
63049                  : _this.propsSize && _this.propsSize.height,
63050              direction: 'right',
63051              original: {
63052                  x: 0,
63053                  y: 0,
63054                  width: 0,
63055                  height: 0,
63056              },
63057              backgroundStyle: {
63058                  height: '100%',
63059                  width: '100%',
63060                  backgroundColor: 'rgba(0,0,0,0)',
63061                  cursor: 'auto',
63062                  opacity: 0,
63063                  position: 'fixed',
63064                  zIndex: 9999,
63065                  top: '0',
63066                  left: '0',
63067                  bottom: '0',
63068                  right: '0',
63069              },
63070              flexBasis: undefined,
63071          };
63072          _this.onResizeStart = _this.onResizeStart.bind(_this);
63073          _this.onMouseMove = _this.onMouseMove.bind(_this);
63074          _this.onMouseUp = _this.onMouseUp.bind(_this);
63075          return _this;
63076      }
63077      Object.defineProperty(Resizable.prototype, "parentNode", {
63078          get: function () {
63079              if (!this.resizable) {
63080                  return null;
63081              }
63082              return this.resizable.parentNode;
63083          },
63084          enumerable: false,
63085          configurable: true
63086      });
63087      Object.defineProperty(Resizable.prototype, "window", {
63088          get: function () {
63089              if (!this.resizable) {
63090                  return null;
63091              }
63092              if (!this.resizable.ownerDocument) {
63093                  return null;
63094              }
63095              return this.resizable.ownerDocument.defaultView;
63096          },
63097          enumerable: false,
63098          configurable: true
63099      });
63100      Object.defineProperty(Resizable.prototype, "propsSize", {
63101          get: function () {
63102              return this.props.size || this.props.defaultSize || DEFAULT_SIZE;
63103          },
63104          enumerable: false,
63105          configurable: true
63106      });
63107      Object.defineProperty(Resizable.prototype, "size", {
63108          get: function () {
63109              var width = 0;
63110              var height = 0;
63111              if (this.resizable && this.window) {
63112                  var orgWidth = this.resizable.offsetWidth;
63113                  var orgHeight = this.resizable.offsetHeight;
63114                  // HACK: Set position `relative` to get parent size.
63115                  //       This is because when re-resizable set `absolute`, I can not get base width correctly.
63116                  var orgPosition = this.resizable.style.position;
63117                  if (orgPosition !== 'relative') {
63118                      this.resizable.style.position = 'relative';
63119                  }
63120                  // INFO: Use original width or height if set auto.
63121                  width = this.resizable.style.width !== 'auto' ? this.resizable.offsetWidth : orgWidth;
63122                  height = this.resizable.style.height !== 'auto' ? this.resizable.offsetHeight : orgHeight;
63123                  // Restore original position
63124                  this.resizable.style.position = orgPosition;
63125              }
63126              return { width: width, height: height };
63127          },
63128          enumerable: false,
63129          configurable: true
63130      });
63131      Object.defineProperty(Resizable.prototype, "sizeStyle", {
63132          get: function () {
63133              var _this = this;
63134              var size = this.props.size;
63135              var getSize = function (key) {
63136                  if (typeof _this.state[key] === 'undefined' || _this.state[key] === 'auto') {
63137                      return 'auto';
63138                  }
63139                  if (_this.propsSize && _this.propsSize[key] && _this.propsSize[key].toString().endsWith('%')) {
63140                      if (_this.state[key].toString().endsWith('%')) {
63141                          return _this.state[key].toString();
63142                      }
63143                      var parentSize = _this.getParentSize();
63144                      var value = Number(_this.state[key].toString().replace('px', ''));
63145                      var percent = (value / parentSize[key]) * 100;
63146                      return percent + "%";
63147                  }
63148                  return getStringSize(_this.state[key]);
63149              };
63150              var width = size && typeof size.width !== 'undefined' && !this.state.isResizing
63151                  ? getStringSize(size.width)
63152                  : getSize('width');
63153              var height = size && typeof size.height !== 'undefined' && !this.state.isResizing
63154                  ? getStringSize(size.height)
63155                  : getSize('height');
63156              return { width: width, height: height };
63157          },
63158          enumerable: false,
63159          configurable: true
63160      });
63161      Resizable.prototype.getParentSize = function () {
63162          if (!this.parentNode) {
63163              if (!this.window) {
63164                  return { width: 0, height: 0 };
63165              }
63166              return { width: this.window.innerWidth, height: this.window.innerHeight };
63167          }
63168          var base = this.appendBase();
63169          if (!base) {
63170              return { width: 0, height: 0 };
63171          }
63172          // INFO: To calculate parent width with flex layout
63173          var wrapChanged = false;
63174          var wrap = this.parentNode.style.flexWrap;
63175          if (wrap !== 'wrap') {
63176              wrapChanged = true;
63177              this.parentNode.style.flexWrap = 'wrap';
63178              // HACK: Use relative to get parent padding size
63179          }
63180          base.style.position = 'relative';
63181          base.style.minWidth = '100%';
63182          base.style.minHeight = '100%';
63183          var size = {
63184              width: base.offsetWidth,
63185              height: base.offsetHeight,
63186          };
63187          if (wrapChanged) {
63188              this.parentNode.style.flexWrap = wrap;
63189          }
63190          this.removeBase(base);
63191          return size;
63192      };
63193      Resizable.prototype.bindEvents = function () {
63194          if (this.window) {
63195              this.window.addEventListener('mouseup', this.onMouseUp);
63196              this.window.addEventListener('mousemove', this.onMouseMove);
63197              this.window.addEventListener('mouseleave', this.onMouseUp);
63198              this.window.addEventListener('touchmove', this.onMouseMove, {
63199                  capture: true,
63200                  passive: false,
63201              });
63202              this.window.addEventListener('touchend', this.onMouseUp);
63203          }
63204      };
63205      Resizable.prototype.unbindEvents = function () {
63206          if (this.window) {
63207              this.window.removeEventListener('mouseup', this.onMouseUp);
63208              this.window.removeEventListener('mousemove', this.onMouseMove);
63209              this.window.removeEventListener('mouseleave', this.onMouseUp);
63210              this.window.removeEventListener('touchmove', this.onMouseMove, true);
63211              this.window.removeEventListener('touchend', this.onMouseUp);
63212          }
63213      };
63214      Resizable.prototype.componentDidMount = function () {
63215          if (!this.resizable || !this.window) {
63216              return;
63217          }
63218          var computedStyle = this.window.getComputedStyle(this.resizable);
63219          this.setState({
63220              width: this.state.width || this.size.width,
63221              height: this.state.height || this.size.height,
63222              flexBasis: computedStyle.flexBasis !== 'auto' ? computedStyle.flexBasis : undefined,
63223          });
63224      };
63225      Resizable.prototype.componentWillUnmount = function () {
63226          if (this.window) {
63227              this.unbindEvents();
63228          }
63229      };
63230      Resizable.prototype.createSizeForCssProperty = function (newSize, kind) {
63231          var propsSize = this.propsSize && this.propsSize[kind];
63232          return this.state[kind] === 'auto' &&
63233              this.state.original[kind] === newSize &&
63234              (typeof propsSize === 'undefined' || propsSize === 'auto')
63235              ? 'auto'
63236              : newSize;
63237      };
63238      Resizable.prototype.calculateNewMaxFromBoundary = function (maxWidth, maxHeight) {
63239          var boundsByDirection = this.props.boundsByDirection;
63240          var direction = this.state.direction;
63241          var widthByDirection = boundsByDirection && hasDirection('left', direction);
63242          var heightByDirection = boundsByDirection && hasDirection('top', direction);
63243          var boundWidth;
63244          var boundHeight;
63245          if (this.props.bounds === 'parent') {
63246              var parent_1 = this.parentNode;
63247              if (parent_1) {
63248                  boundWidth = widthByDirection
63249                      ? this.resizableRight - this.parentLeft
63250                      : parent_1.offsetWidth + (this.parentLeft - this.resizableLeft);
63251                  boundHeight = heightByDirection
63252                      ? this.resizableBottom - this.parentTop
63253                      : parent_1.offsetHeight + (this.parentTop - this.resizableTop);
63254              }
63255          }
63256          else if (this.props.bounds === 'window') {
63257              if (this.window) {
63258                  boundWidth = widthByDirection ? this.resizableRight : this.window.innerWidth - this.resizableLeft;
63259                  boundHeight = heightByDirection ? this.resizableBottom : this.window.innerHeight - this.resizableTop;
63260              }
63261          }
63262          else if (this.props.bounds) {
63263              boundWidth = widthByDirection
63264                  ? this.resizableRight - this.targetLeft
63265                  : this.props.bounds.offsetWidth + (this.targetLeft - this.resizableLeft);
63266              boundHeight = heightByDirection
63267                  ? this.resizableBottom - this.targetTop
63268                  : this.props.bounds.offsetHeight + (this.targetTop - this.resizableTop);
63269          }
63270          if (boundWidth && Number.isFinite(boundWidth)) {
63271              maxWidth = maxWidth && maxWidth < boundWidth ? maxWidth : boundWidth;
63272          }
63273          if (boundHeight && Number.isFinite(boundHeight)) {
63274              maxHeight = maxHeight && maxHeight < boundHeight ? maxHeight : boundHeight;
63275          }
63276          return { maxWidth: maxWidth, maxHeight: maxHeight };
63277      };
63278      Resizable.prototype.calculateNewSizeFromDirection = function (clientX, clientY) {
63279          var scale = this.props.scale || 1;
63280          var resizeRatio = this.props.resizeRatio || 1;
63281          var _a = this.state, direction = _a.direction, original = _a.original;
63282          var _b = this.props, lockAspectRatio = _b.lockAspectRatio, lockAspectRatioExtraHeight = _b.lockAspectRatioExtraHeight, lockAspectRatioExtraWidth = _b.lockAspectRatioExtraWidth;
63283          var newWidth = original.width;
63284          var newHeight = original.height;
63285          var extraHeight = lockAspectRatioExtraHeight || 0;
63286          var extraWidth = lockAspectRatioExtraWidth || 0;
63287          if (hasDirection('right', direction)) {
63288              newWidth = original.width + ((clientX - original.x) * resizeRatio) / scale;
63289              if (lockAspectRatio) {
63290                  newHeight = (newWidth - extraWidth) / this.ratio + extraHeight;
63291              }
63292          }
63293          if (hasDirection('left', direction)) {
63294              newWidth = original.width - ((clientX - original.x) * resizeRatio) / scale;
63295              if (lockAspectRatio) {
63296                  newHeight = (newWidth - extraWidth) / this.ratio + extraHeight;
63297              }
63298          }
63299          if (hasDirection('bottom', direction)) {
63300              newHeight = original.height + ((clientY - original.y) * resizeRatio) / scale;
63301              if (lockAspectRatio) {
63302                  newWidth = (newHeight - extraHeight) * this.ratio + extraWidth;
63303              }
63304          }
63305          if (hasDirection('top', direction)) {
63306              newHeight = original.height - ((clientY - original.y) * resizeRatio) / scale;
63307              if (lockAspectRatio) {
63308                  newWidth = (newHeight - extraHeight) * this.ratio + extraWidth;
63309              }
63310          }
63311          return { newWidth: newWidth, newHeight: newHeight };
63312      };
63313      Resizable.prototype.calculateNewSizeFromAspectRatio = function (newWidth, newHeight, max, min) {
63314          var _a = this.props, lockAspectRatio = _a.lockAspectRatio, lockAspectRatioExtraHeight = _a.lockAspectRatioExtraHeight, lockAspectRatioExtraWidth = _a.lockAspectRatioExtraWidth;
63315          var computedMinWidth = typeof min.width === 'undefined' ? 10 : min.width;
63316          var computedMaxWidth = typeof max.width === 'undefined' || max.width < 0 ? newWidth : max.width;
63317          var computedMinHeight = typeof min.height === 'undefined' ? 10 : min.height;
63318          var computedMaxHeight = typeof max.height === 'undefined' || max.height < 0 ? newHeight : max.height;
63319          var extraHeight = lockAspectRatioExtraHeight || 0;
63320          var extraWidth = lockAspectRatioExtraWidth || 0;
63321          if (lockAspectRatio) {
63322              var extraMinWidth = (computedMinHeight - extraHeight) * this.ratio + extraWidth;
63323              var extraMaxWidth = (computedMaxHeight - extraHeight) * this.ratio + extraWidth;
63324              var extraMinHeight = (computedMinWidth - extraWidth) / this.ratio + extraHeight;
63325              var extraMaxHeight = (computedMaxWidth - extraWidth) / this.ratio + extraHeight;
63326              var lockedMinWidth = Math.max(computedMinWidth, extraMinWidth);
63327              var lockedMaxWidth = Math.min(computedMaxWidth, extraMaxWidth);
63328              var lockedMinHeight = Math.max(computedMinHeight, extraMinHeight);
63329              var lockedMaxHeight = Math.min(computedMaxHeight, extraMaxHeight);
63330              newWidth = lib_clamp(newWidth, lockedMinWidth, lockedMaxWidth);
63331              newHeight = lib_clamp(newHeight, lockedMinHeight, lockedMaxHeight);
63332          }
63333          else {
63334              newWidth = lib_clamp(newWidth, computedMinWidth, computedMaxWidth);
63335              newHeight = lib_clamp(newHeight, computedMinHeight, computedMaxHeight);
63336          }
63337          return { newWidth: newWidth, newHeight: newHeight };
63338      };
63339      Resizable.prototype.setBoundingClientRect = function () {
63340          // For parent boundary
63341          if (this.props.bounds === 'parent') {
63342              var parent_2 = this.parentNode;
63343              if (parent_2) {
63344                  var parentRect = parent_2.getBoundingClientRect();
63345                  this.parentLeft = parentRect.left;
63346                  this.parentTop = parentRect.top;
63347              }
63348          }
63349          // For target(html element) boundary
63350          if (this.props.bounds && typeof this.props.bounds !== 'string') {
63351              var targetRect = this.props.bounds.getBoundingClientRect();
63352              this.targetLeft = targetRect.left;
63353              this.targetTop = targetRect.top;
63354          }
63355          // For boundary
63356          if (this.resizable) {
63357              var _a = this.resizable.getBoundingClientRect(), left = _a.left, top_1 = _a.top, right = _a.right, bottom = _a.bottom;
63358              this.resizableLeft = left;
63359              this.resizableRight = right;
63360              this.resizableTop = top_1;
63361              this.resizableBottom = bottom;
63362          }
63363      };
63364      Resizable.prototype.onResizeStart = function (event, direction) {
63365          if (!this.resizable || !this.window) {
63366              return;
63367          }
63368          var clientX = 0;
63369          var clientY = 0;
63370          if (event.nativeEvent && isMouseEvent(event.nativeEvent)) {
63371              clientX = event.nativeEvent.clientX;
63372              clientY = event.nativeEvent.clientY;
63373          }
63374          else if (event.nativeEvent && isTouchEvent(event.nativeEvent)) {
63375              clientX = event.nativeEvent.touches[0].clientX;
63376              clientY = event.nativeEvent.touches[0].clientY;
63377          }
63378          if (this.props.onResizeStart) {
63379              if (this.resizable) {
63380                  var startResize = this.props.onResizeStart(event, direction, this.resizable);
63381                  if (startResize === false) {
63382                      return;
63383                  }
63384              }
63385          }
63386          // Fix #168
63387          if (this.props.size) {
63388              if (typeof this.props.size.height !== 'undefined' && this.props.size.height !== this.state.height) {
63389                  this.setState({ height: this.props.size.height });
63390              }
63391              if (typeof this.props.size.width !== 'undefined' && this.props.size.width !== this.state.width) {
63392                  this.setState({ width: this.props.size.width });
63393              }
63394          }
63395          // For lockAspectRatio case
63396          this.ratio =
63397              typeof this.props.lockAspectRatio === 'number' ? this.props.lockAspectRatio : this.size.width / this.size.height;
63398          var flexBasis;
63399          var computedStyle = this.window.getComputedStyle(this.resizable);
63400          if (computedStyle.flexBasis !== 'auto') {
63401              var parent_3 = this.parentNode;
63402              if (parent_3) {
63403                  var dir = this.window.getComputedStyle(parent_3).flexDirection;
63404                  this.flexDir = dir.startsWith('row') ? 'row' : 'column';
63405                  flexBasis = computedStyle.flexBasis;
63406              }
63407          }
63408          // For boundary
63409          this.setBoundingClientRect();
63410          this.bindEvents();
63411          var state = {
63412              original: {
63413                  x: clientX,
63414                  y: clientY,
63415                  width: this.size.width,
63416                  height: this.size.height,
63417              },
63418              isResizing: true,
63419              backgroundStyle: lib_assign(lib_assign({}, this.state.backgroundStyle), { cursor: this.window.getComputedStyle(event.target).cursor || 'auto' }),
63420              direction: direction,
63421              flexBasis: flexBasis,
63422          };
63423          this.setState(state);
63424      };
63425      Resizable.prototype.onMouseMove = function (event) {
63426          var _this = this;
63427          if (!this.state.isResizing || !this.resizable || !this.window) {
63428              return;
63429          }
63430          if (this.window.TouchEvent && isTouchEvent(event)) {
63431              try {
63432                  event.preventDefault();
63433                  event.stopPropagation();
63434              }
63435              catch (e) {
63436                  // Ignore on fail
63437              }
63438          }
63439          var _a = this.props, maxWidth = _a.maxWidth, maxHeight = _a.maxHeight, minWidth = _a.minWidth, minHeight = _a.minHeight;
63440          var clientX = isTouchEvent(event) ? event.touches[0].clientX : event.clientX;
63441          var clientY = isTouchEvent(event) ? event.touches[0].clientY : event.clientY;
63442          var _b = this.state, direction = _b.direction, original = _b.original, width = _b.width, height = _b.height;
63443          var parentSize = this.getParentSize();
63444          var max = calculateNewMax(parentSize, this.window.innerWidth, this.window.innerHeight, maxWidth, maxHeight, minWidth, minHeight);
63445          maxWidth = max.maxWidth;
63446          maxHeight = max.maxHeight;
63447          minWidth = max.minWidth;
63448          minHeight = max.minHeight;
63449          // Calculate new size
63450          var _c = this.calculateNewSizeFromDirection(clientX, clientY), newHeight = _c.newHeight, newWidth = _c.newWidth;
63451          // Calculate max size from boundary settings
63452          var boundaryMax = this.calculateNewMaxFromBoundary(maxWidth, maxHeight);
63453          if (this.props.snap && this.props.snap.x) {
63454              newWidth = findClosestSnap(newWidth, this.props.snap.x, this.props.snapGap);
63455          }
63456          if (this.props.snap && this.props.snap.y) {
63457              newHeight = findClosestSnap(newHeight, this.props.snap.y, this.props.snapGap);
63458          }
63459          // Calculate new size from aspect ratio
63460          var newSize = this.calculateNewSizeFromAspectRatio(newWidth, newHeight, { width: boundaryMax.maxWidth, height: boundaryMax.maxHeight }, { width: minWidth, height: minHeight });
63461          newWidth = newSize.newWidth;
63462          newHeight = newSize.newHeight;
63463          if (this.props.grid) {
63464              var newGridWidth = snap(newWidth, this.props.grid[0]);
63465              var newGridHeight = snap(newHeight, this.props.grid[1]);
63466              var gap = this.props.snapGap || 0;
63467              newWidth = gap === 0 || Math.abs(newGridWidth - newWidth) <= gap ? newGridWidth : newWidth;
63468              newHeight = gap === 0 || Math.abs(newGridHeight - newHeight) <= gap ? newGridHeight : newHeight;
63469          }
63470          var delta = {
63471              width: newWidth - original.width,
63472              height: newHeight - original.height,
63473          };
63474          if (width && typeof width === 'string') {
63475              if (width.endsWith('%')) {
63476                  var percent = (newWidth / parentSize.width) * 100;
63477                  newWidth = percent + "%";
63478              }
63479              else if (width.endsWith('vw')) {
63480                  var vw = (newWidth / this.window.innerWidth) * 100;
63481                  newWidth = vw + "vw";
63482              }
63483              else if (width.endsWith('vh')) {
63484                  var vh = (newWidth / this.window.innerHeight) * 100;
63485                  newWidth = vh + "vh";
63486              }
63487          }
63488          if (height && typeof height === 'string') {
63489              if (height.endsWith('%')) {
63490                  var percent = (newHeight / parentSize.height) * 100;
63491                  newHeight = percent + "%";
63492              }
63493              else if (height.endsWith('vw')) {
63494                  var vw = (newHeight / this.window.innerWidth) * 100;
63495                  newHeight = vw + "vw";
63496              }
63497              else if (height.endsWith('vh')) {
63498                  var vh = (newHeight / this.window.innerHeight) * 100;
63499                  newHeight = vh + "vh";
63500              }
63501          }
63502          var newState = {
63503              width: this.createSizeForCssProperty(newWidth, 'width'),
63504              height: this.createSizeForCssProperty(newHeight, 'height'),
63505          };
63506          if (this.flexDir === 'row') {
63507              newState.flexBasis = newState.width;
63508          }
63509          else if (this.flexDir === 'column') {
63510              newState.flexBasis = newState.height;
63511          }
63512          // For v18, update state sync
63513          (0,external_ReactDOM_namespaceObject.flushSync)(function () {
63514              _this.setState(newState);
63515          });
63516          if (this.props.onResize) {
63517              this.props.onResize(event, direction, this.resizable, delta);
63518          }
63519      };
63520      Resizable.prototype.onMouseUp = function (event) {
63521          var _a = this.state, isResizing = _a.isResizing, direction = _a.direction, original = _a.original;
63522          if (!isResizing || !this.resizable) {
63523              return;
63524          }
63525          var delta = {
63526              width: this.size.width - original.width,
63527              height: this.size.height - original.height,
63528          };
63529          if (this.props.onResizeStop) {
63530              this.props.onResizeStop(event, direction, this.resizable, delta);
63531          }
63532          if (this.props.size) {
63533              this.setState(this.props.size);
63534          }
63535          this.unbindEvents();
63536          this.setState({
63537              isResizing: false,
63538              backgroundStyle: lib_assign(lib_assign({}, this.state.backgroundStyle), { cursor: 'auto' }),
63539          });
63540      };
63541      Resizable.prototype.updateSize = function (size) {
63542          this.setState({ width: size.width, height: size.height });
63543      };
63544      Resizable.prototype.renderResizer = function () {
63545          var _this = this;
63546          var _a = this.props, enable = _a.enable, handleStyles = _a.handleStyles, handleClasses = _a.handleClasses, handleWrapperStyle = _a.handleWrapperStyle, handleWrapperClass = _a.handleWrapperClass, handleComponent = _a.handleComponent;
63547          if (!enable) {
63548              return null;
63549          }
63550          var resizers = Object.keys(enable).map(function (dir) {
63551              if (enable[dir] !== false) {
63552                  return (external_React_.createElement(Resizer, { key: dir, direction: dir, onResizeStart: _this.onResizeStart, replaceStyles: handleStyles && handleStyles[dir], className: handleClasses && handleClasses[dir] }, handleComponent && handleComponent[dir] ? handleComponent[dir] : null));
63553              }
63554              return null;
63555          });
63556          // #93 Wrap the resize box in span (will not break 100% width/height)
63557          return (external_React_.createElement("div", { className: handleWrapperClass, style: handleWrapperStyle }, resizers));
63558      };
63559      Resizable.prototype.render = function () {
63560          var _this = this;
63561          var extendsProps = Object.keys(this.props).reduce(function (acc, key) {
63562              if (definedProps.indexOf(key) !== -1) {
63563                  return acc;
63564              }
63565              acc[key] = _this.props[key];
63566              return acc;
63567          }, {});
63568          var style = lib_assign(lib_assign(lib_assign({ position: 'relative', userSelect: this.state.isResizing ? 'none' : 'auto' }, this.props.style), this.sizeStyle), { maxWidth: this.props.maxWidth, maxHeight: this.props.maxHeight, minWidth: this.props.minWidth, minHeight: this.props.minHeight, boxSizing: 'border-box', flexShrink: 0 });
63569          if (this.state.flexBasis) {
63570              style.flexBasis = this.state.flexBasis;
63571          }
63572          var Wrapper = this.props.as || 'div';
63573          return (external_React_.createElement(Wrapper, lib_assign({ ref: this.ref, style: style, className: this.props.className }, extendsProps),
63574              this.state.isResizing && external_React_.createElement("div", { style: this.state.backgroundStyle }),
63575              this.props.children,
63576              this.renderResizer()));
63577      };
63578      Resizable.defaultProps = {
63579          as: 'div',
63580          onResizeStart: function () { },
63581          onResize: function () { },
63582          onResizeStop: function () { },
63583          enable: {
63584              top: true,
63585              right: true,
63586              bottom: true,
63587              left: true,
63588              topRight: true,
63589              bottomRight: true,
63590              bottomLeft: true,
63591              topLeft: true,
63592          },
63593          style: {},
63594          grid: [1, 1],
63595          lockAspectRatio: false,
63596          lockAspectRatioExtraWidth: 0,
63597          lockAspectRatioExtraHeight: 0,
63598          scale: 1,
63599          resizeRatio: 1,
63600          snapGap: 0,
63601      };
63602      return Resizable;
63603  }(external_React_.PureComponent));
63604  
63605  
63606  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/resizable-box/resize-tooltip/utils.js
63607  /**
63608   * WordPress dependencies
63609   */
63610  
63611  
63612  const utils_noop = () => {};
63613  const POSITIONS = {
63614    bottom: 'bottom',
63615    corner: 'corner'
63616  };
63617  /**
63618   * Custom hook that manages resize listener events. It also provides a label
63619   * based on current resize width x height values.
63620   *
63621   * @param props
63622   * @param props.axis        Only shows the label corresponding to the axis.
63623   * @param props.fadeTimeout Duration (ms) before deactivating the resize label.
63624   * @param props.onResize    Callback when a resize occurs. Provides { width, height } callback.
63625   * @param props.position    Adjusts label value.
63626   * @param props.showPx      Whether to add `PX` to the label.
63627   *
63628   * @return Properties for hook.
63629   */
63630  function useResizeLabel({
63631    axis,
63632    fadeTimeout = 180,
63633    onResize = utils_noop,
63634    position = POSITIONS.bottom,
63635    showPx = false
63636  }) {
63637    /*
63638     * The width/height values derive from this special useResizeObserver hook.
63639     * This custom hook uses the ResizeObserver API to listen for resize events.
63640     */
63641    const [resizeListener, sizes] = (0,external_wp_compose_namespaceObject.useResizeObserver)();
63642  
63643    /*
63644     * Indicates if the x/y axis is preferred.
63645     * If set, we will avoid resetting the moveX and moveY values.
63646     * This will allow for the preferred axis values to persist in the label.
63647     */
63648    const isAxisControlled = !!axis;
63649  
63650    /*
63651     * The moveX and moveY values are used to track whether the label should
63652     * display width, height, or width x height.
63653     */
63654    const [moveX, setMoveX] = (0,external_wp_element_namespaceObject.useState)(false);
63655    const [moveY, setMoveY] = (0,external_wp_element_namespaceObject.useState)(false);
63656  
63657    /*
63658     * Cached dimension values to check for width/height updates from the
63659     * sizes property from useResizeAware()
63660     */
63661    const {
63662      width,
63663      height
63664    } = sizes;
63665    const heightRef = (0,external_wp_element_namespaceObject.useRef)(height);
63666    const widthRef = (0,external_wp_element_namespaceObject.useRef)(width);
63667  
63668    /*
63669     * This timeout is used with setMoveX and setMoveY to determine of
63670     * both width and height values have changed at (roughly) the same time.
63671     */
63672    const moveTimeoutRef = (0,external_wp_element_namespaceObject.useRef)();
63673    const debounceUnsetMoveXY = (0,external_wp_element_namespaceObject.useCallback)(() => {
63674      const unsetMoveXY = () => {
63675        /*
63676         * If axis is controlled, we will avoid resetting the moveX and moveY values.
63677         * This will allow for the preferred axis values to persist in the label.
63678         */
63679        if (isAxisControlled) {
63680          return;
63681        }
63682        setMoveX(false);
63683        setMoveY(false);
63684      };
63685      if (moveTimeoutRef.current) {
63686        window.clearTimeout(moveTimeoutRef.current);
63687      }
63688      moveTimeoutRef.current = window.setTimeout(unsetMoveXY, fadeTimeout);
63689    }, [fadeTimeout, isAxisControlled]);
63690    (0,external_wp_element_namespaceObject.useEffect)(() => {
63691      /*
63692       * On the initial render of useResizeAware, the height and width values are
63693       * null. They are calculated then set using via an internal useEffect hook.
63694       */
63695      const isRendered = width !== null || height !== null;
63696      if (!isRendered) {
63697        return;
63698      }
63699      const didWidthChange = width !== widthRef.current;
63700      const didHeightChange = height !== heightRef.current;
63701      if (!didWidthChange && !didHeightChange) {
63702        return;
63703      }
63704  
63705      /*
63706       * After the initial render, the useResizeAware will set the first
63707       * width and height values. We'll sync those values with our
63708       * width and height refs. However, we shouldn't render our Tooltip
63709       * label on this first cycle.
63710       */
63711      if (width && !widthRef.current && height && !heightRef.current) {
63712        widthRef.current = width;
63713        heightRef.current = height;
63714        return;
63715      }
63716  
63717      /*
63718       * After the first cycle, we can track width and height changes.
63719       */
63720      if (didWidthChange) {
63721        setMoveX(true);
63722        widthRef.current = width;
63723      }
63724      if (didHeightChange) {
63725        setMoveY(true);
63726        heightRef.current = height;
63727      }
63728      onResize({
63729        width,
63730        height
63731      });
63732      debounceUnsetMoveXY();
63733    }, [width, height, onResize, debounceUnsetMoveXY]);
63734    const label = getSizeLabel({
63735      axis,
63736      height,
63737      moveX,
63738      moveY,
63739      position,
63740      showPx,
63741      width
63742    });
63743    return {
63744      label,
63745      resizeListener
63746    };
63747  }
63748  /**
63749   * Gets the resize label based on width and height values (as well as recent changes).
63750   *
63751   * @param props
63752   * @param props.axis     Only shows the label corresponding to the axis.
63753   * @param props.height   Height value.
63754   * @param props.moveX    Recent width (x axis) changes.
63755   * @param props.moveY    Recent width (y axis) changes.
63756   * @param props.position Adjusts label value.
63757   * @param props.showPx   Whether to add `PX` to the label.
63758   * @param props.width    Width value.
63759   *
63760   * @return The rendered label.
63761   */
63762  function getSizeLabel({
63763    axis,
63764    height,
63765    moveX = false,
63766    moveY = false,
63767    position = POSITIONS.bottom,
63768    showPx = false,
63769    width
63770  }) {
63771    if (!moveX && !moveY) {
63772      return undefined;
63773    }
63774  
63775    /*
63776     * Corner position...
63777     * We want the label to appear like width x height.
63778     */
63779    if (position === POSITIONS.corner) {
63780      return `$width} x $height}`;
63781    }
63782  
63783    /*
63784     * Other POSITIONS...
63785     * The label will combine both width x height values if both
63786     * values have recently been changed.
63787     *
63788     * Otherwise, only width or height will be displayed.
63789     * The `PX` unit will be added, if specified by the `showPx` prop.
63790     */
63791    const labelUnit = showPx ? ' px' : '';
63792    if (axis) {
63793      if (axis === 'x' && moveX) {
63794        return `$width}$labelUnit}`;
63795      }
63796      if (axis === 'y' && moveY) {
63797        return `$height}$labelUnit}`;
63798      }
63799    }
63800    if (moveX && moveY) {
63801      return `$width} x $height}`;
63802    }
63803    if (moveX) {
63804      return `$width}$labelUnit}`;
63805    }
63806    if (moveY) {
63807      return `$height}$labelUnit}`;
63808    }
63809    return undefined;
63810  }
63811  
63812  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/resizable-box/resize-tooltip/styles/resize-tooltip.styles.js
63813  
63814  function resize_tooltip_styles_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)."; }
63815  /**
63816   * External dependencies
63817   */
63818  
63819  /**
63820   * Internal dependencies
63821   */
63822  
63823  
63824  const resize_tooltip_styles_Root = /*#__PURE__*/emotion_styled_base_browser_esm("div",  true ? {
63825    target: "e1wq7y4k3"
63826  } : 0)( true ? {
63827    name: "1cd7zoc",
63828    styles: "bottom:0;box-sizing:border-box;left:0;pointer-events:none;position:absolute;right:0;top:0"
63829  } : 0);
63830  const TooltipWrapper = /*#__PURE__*/emotion_styled_base_browser_esm("div",  true ? {
63831    target: "e1wq7y4k2"
63832  } : 0)( true ? {
63833    name: "ajymcs",
63834    styles: "align-items:center;box-sizing:border-box;display:inline-flex;justify-content:center;opacity:0;pointer-events:none;transition:opacity 120ms linear"
63835  } : 0);
63836  const resize_tooltip_styles_Tooltip = /*#__PURE__*/emotion_styled_base_browser_esm("div",  true ? {
63837    target: "e1wq7y4k1"
63838  } : 0)("background:", COLORS.theme.foreground, ";border-radius:", config_values.radiusSmall, ";box-sizing:border-box;font-family:", font('default.fontFamily'), ";font-size:12px;color:", COLORS.theme.foregroundInverted, ";padding:4px 8px;position:relative;" + ( true ? "" : 0));
63839  
63840  // TODO: Resolve need to use &&& to increase specificity
63841  // https://github.com/WordPress/gutenberg/issues/18483
63842  
63843  const LabelText = /*#__PURE__*/emotion_styled_base_browser_esm(text_component,  true ? {
63844    target: "e1wq7y4k0"
63845  } : 0)("&&&{color:", COLORS.theme.foregroundInverted, ";display:block;font-size:13px;line-height:1.4;white-space:nowrap;}" + ( true ? "" : 0));
63846  
63847  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/resizable-box/resize-tooltip/label.js
63848  /**
63849   * External dependencies
63850   */
63851  
63852  /**
63853   * WordPress dependencies
63854   */
63855  
63856  
63857  
63858  /**
63859   * Internal dependencies
63860   */
63861  
63862  
63863  
63864  
63865  const CORNER_OFFSET = 4;
63866  const CURSOR_OFFSET_TOP = CORNER_OFFSET * 2.5;
63867  function resize_tooltip_label_Label({
63868    label,
63869    position = POSITIONS.corner,
63870    zIndex = 1000,
63871    ...props
63872  }, ref) {
63873    const showLabel = !!label;
63874    const isBottom = position === POSITIONS.bottom;
63875    const isCorner = position === POSITIONS.corner;
63876    if (!showLabel) {
63877      return null;
63878    }
63879    let style = {
63880      opacity: showLabel ? 1 : undefined,
63881      zIndex
63882    };
63883    let labelStyle = {};
63884    if (isBottom) {
63885      style = {
63886        ...style,
63887        position: 'absolute',
63888        bottom: CURSOR_OFFSET_TOP * -1,
63889        left: '50%',
63890        transform: 'translate(-50%, 0)'
63891      };
63892      labelStyle = {
63893        transform: `translate(0, 100%)`
63894      };
63895    }
63896    if (isCorner) {
63897      style = {
63898        ...style,
63899        position: 'absolute',
63900        top: CORNER_OFFSET,
63901        right: (0,external_wp_i18n_namespaceObject.isRTL)() ? undefined : CORNER_OFFSET,
63902        left: (0,external_wp_i18n_namespaceObject.isRTL)() ? CORNER_OFFSET : undefined
63903      };
63904    }
63905    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(TooltipWrapper, {
63906      "aria-hidden": "true",
63907      className: "components-resizable-tooltip__tooltip-wrapper",
63908      ref: ref,
63909      style: style,
63910      ...props,
63911      children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(resize_tooltip_styles_Tooltip, {
63912        className: "components-resizable-tooltip__tooltip",
63913        style: labelStyle,
63914        children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(LabelText, {
63915          as: "span",
63916          children: label
63917        })
63918      })
63919    });
63920  }
63921  const label_ForwardedComponent = (0,external_wp_element_namespaceObject.forwardRef)(resize_tooltip_label_Label);
63922  /* harmony default export */ const resize_tooltip_label = (label_ForwardedComponent);
63923  
63924  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/resizable-box/resize-tooltip/index.js
63925  /**
63926   * External dependencies
63927   */
63928  
63929  /**
63930   * WordPress dependencies
63931   */
63932  
63933  
63934  /**
63935   * Internal dependencies
63936   */
63937  
63938  
63939  
63940  
63941  
63942  const resize_tooltip_noop = () => {};
63943  function ResizeTooltip({
63944    axis,
63945    className,
63946    fadeTimeout = 180,
63947    isVisible = true,
63948    labelRef,
63949    onResize = resize_tooltip_noop,
63950    position = POSITIONS.bottom,
63951    showPx = true,
63952    zIndex = 1000,
63953    ...props
63954  }, ref) {
63955    const {
63956      label,
63957      resizeListener
63958    } = useResizeLabel({
63959      axis,
63960      fadeTimeout,
63961      onResize,
63962      showPx,
63963      position
63964    });
63965    if (!isVisible) {
63966      return null;
63967    }
63968    const classes = dist_clsx('components-resize-tooltip', className);
63969    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(resize_tooltip_styles_Root, {
63970      "aria-hidden": "true",
63971      className: classes,
63972      ref: ref,
63973      ...props,
63974      children: [resizeListener, /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(resize_tooltip_label, {
63975        "aria-hidden": props['aria-hidden'],
63976        label: label,
63977        position: position,
63978        ref: labelRef,
63979        zIndex: zIndex
63980      })]
63981    });
63982  }
63983  const resize_tooltip_ForwardedComponent = (0,external_wp_element_namespaceObject.forwardRef)(ResizeTooltip);
63984  /* harmony default export */ const resize_tooltip = (resize_tooltip_ForwardedComponent);
63985  
63986  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/resizable-box/index.js
63987  /**
63988   * WordPress dependencies
63989   */
63990  
63991  
63992  /**
63993   * External dependencies
63994   */
63995  
63996  
63997  /**
63998   * Internal dependencies
63999   */
64000  
64001  
64002  
64003  const HANDLE_CLASS_NAME = 'components-resizable-box__handle';
64004  const SIDE_HANDLE_CLASS_NAME = 'components-resizable-box__side-handle';
64005  const CORNER_HANDLE_CLASS_NAME = 'components-resizable-box__corner-handle';
64006  const HANDLE_CLASSES = {
64007    top: dist_clsx(HANDLE_CLASS_NAME, SIDE_HANDLE_CLASS_NAME, 'components-resizable-box__handle-top'),
64008    right: dist_clsx(HANDLE_CLASS_NAME, SIDE_HANDLE_CLASS_NAME, 'components-resizable-box__handle-right'),
64009    bottom: dist_clsx(HANDLE_CLASS_NAME, SIDE_HANDLE_CLASS_NAME, 'components-resizable-box__handle-bottom'),
64010    left: dist_clsx(HANDLE_CLASS_NAME, SIDE_HANDLE_CLASS_NAME, 'components-resizable-box__handle-left'),
64011    topLeft: dist_clsx(HANDLE_CLASS_NAME, CORNER_HANDLE_CLASS_NAME, 'components-resizable-box__handle-top', 'components-resizable-box__handle-left'),
64012    topRight: dist_clsx(HANDLE_CLASS_NAME, CORNER_HANDLE_CLASS_NAME, 'components-resizable-box__handle-top', 'components-resizable-box__handle-right'),
64013    bottomRight: dist_clsx(HANDLE_CLASS_NAME, CORNER_HANDLE_CLASS_NAME, 'components-resizable-box__handle-bottom', 'components-resizable-box__handle-right'),
64014    bottomLeft: dist_clsx(HANDLE_CLASS_NAME, CORNER_HANDLE_CLASS_NAME, 'components-resizable-box__handle-bottom', 'components-resizable-box__handle-left')
64015  };
64016  
64017  // Removes the inline styles in the drag handles.
64018  const HANDLE_STYLES_OVERRIDES = {
64019    width: undefined,
64020    height: undefined,
64021    top: undefined,
64022    right: undefined,
64023    bottom: undefined,
64024    left: undefined
64025  };
64026  const HANDLE_STYLES = {
64027    top: HANDLE_STYLES_OVERRIDES,
64028    right: HANDLE_STYLES_OVERRIDES,
64029    bottom: HANDLE_STYLES_OVERRIDES,
64030    left: HANDLE_STYLES_OVERRIDES,
64031    topLeft: HANDLE_STYLES_OVERRIDES,
64032    topRight: HANDLE_STYLES_OVERRIDES,
64033    bottomRight: HANDLE_STYLES_OVERRIDES,
64034    bottomLeft: HANDLE_STYLES_OVERRIDES
64035  };
64036  function UnforwardedResizableBox({
64037    className,
64038    children,
64039    showHandle = true,
64040    __experimentalShowTooltip: showTooltip = false,
64041    __experimentalTooltipProps: tooltipProps = {},
64042    ...props
64043  }, ref) {
64044    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(Resizable, {
64045      className: dist_clsx('components-resizable-box__container', showHandle && 'has-show-handle', className),
64046      handleClasses: HANDLE_CLASSES,
64047      handleStyles: HANDLE_STYLES,
64048      ref: ref,
64049      ...props,
64050      children: [children, showTooltip && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(resize_tooltip, {
64051        ...tooltipProps
64052      })]
64053    });
64054  }
64055  const ResizableBox = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedResizableBox);
64056  /* harmony default export */ const resizable_box = (ResizableBox);
64057  
64058  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/responsive-wrapper/index.js
64059  /**
64060   * External dependencies
64061   */
64062  
64063  
64064  /**
64065   * WordPress dependencies
64066   */
64067  
64068  
64069  /**
64070   * Internal dependencies
64071   */
64072  
64073  /**
64074   * A wrapper component that maintains its aspect ratio when resized.
64075   *
64076   * ```jsx
64077   * import { ResponsiveWrapper } from '@wordpress/components';
64078   *
64079   * const MyResponsiveWrapper = () => (
64080   *     <ResponsiveWrapper naturalWidth={ 2000 } naturalHeight={ 680 }>
64081   *         <img
64082   *             src="https://s.w.org/style/images/about/WordPress-logotype-standard.png"
64083   *             alt="WordPress"
64084   *         />
64085   *     </ResponsiveWrapper>
64086   * );
64087   * ```
64088   */
64089  function ResponsiveWrapper({
64090    naturalWidth,
64091    naturalHeight,
64092    children,
64093    isInline = false
64094  }) {
64095    if (external_wp_element_namespaceObject.Children.count(children) !== 1) {
64096      return null;
64097    }
64098    const TagName = isInline ? 'span' : 'div';
64099    let aspectRatio;
64100    if (naturalWidth && naturalHeight) {
64101      aspectRatio = `$naturalWidth} / $naturalHeight}`;
64102    }
64103    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(TagName, {
64104      className: "components-responsive-wrapper",
64105      children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", {
64106        children: (0,external_wp_element_namespaceObject.cloneElement)(children, {
64107          className: dist_clsx('components-responsive-wrapper__content', children.props.className),
64108          style: {
64109            ...children.props.style,
64110            aspectRatio
64111          }
64112        })
64113      })
64114    });
64115  }
64116  /* harmony default export */ const responsive_wrapper = (ResponsiveWrapper);
64117  
64118  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/sandbox/index.js
64119  /**
64120   * WordPress dependencies
64121   */
64122  
64123  
64124  
64125  /**
64126   * Internal dependencies
64127   */
64128  
64129  
64130  const observeAndResizeJS = function () {
64131    const {
64132      MutationObserver
64133    } = window;
64134    if (!MutationObserver || !document.body || !window.parent) {
64135      return;
64136    }
64137    function sendResize() {
64138      const clientBoundingRect = document.body.getBoundingClientRect();
64139      window.parent.postMessage({
64140        action: 'resize',
64141        width: clientBoundingRect.width,
64142        height: clientBoundingRect.height
64143      }, '*');
64144    }
64145    const observer = new MutationObserver(sendResize);
64146    observer.observe(document.body, {
64147      attributes: true,
64148      attributeOldValue: false,
64149      characterData: true,
64150      characterDataOldValue: false,
64151      childList: true,
64152      subtree: true
64153    });
64154    window.addEventListener('load', sendResize, true);
64155  
64156    // Hack: Remove viewport unit styles, as these are relative
64157    // the iframe root and interfere with our mechanism for
64158    // determining the unconstrained page bounds.
64159    function removeViewportStyles(ruleOrNode) {
64160      if (ruleOrNode.style) {
64161        ['width', 'height', 'minHeight', 'maxHeight'].forEach(function (style) {
64162          if (/^\\d+(vw|vh|svw|lvw|dvw|svh|lvh|dvh|vi|svi|lvi|dvi|vb|svb|lvb|dvb|vmin|svmin|lvmin|dvmin|vmax|svmax|lvmax|dvmax)$/.test(ruleOrNode.style[style])) {
64163            ruleOrNode.style[style] = '';
64164          }
64165        });
64166      }
64167    }
64168    Array.prototype.forEach.call(document.querySelectorAll('[style]'), removeViewportStyles);
64169    Array.prototype.forEach.call(document.styleSheets, function (stylesheet) {
64170      Array.prototype.forEach.call(stylesheet.cssRules || stylesheet.rules, removeViewportStyles);
64171    });
64172    document.body.style.position = 'absolute';
64173    document.body.style.width = '100%';
64174    document.body.setAttribute('data-resizable-iframe-connected', '');
64175    sendResize();
64176  
64177    // Resize events can change the width of elements with 100% width, but we don't
64178    // get an DOM mutations for that, so do the resize when the window is resized, too.
64179    window.addEventListener('resize', sendResize, true);
64180  };
64181  
64182  // TODO: These styles shouldn't be coupled with WordPress.
64183  const style = `
64184      body {
64185          margin: 0;
64186      }
64187      html,
64188      body,
64189      body > div {
64190          width: 100%;
64191      }
64192      html.wp-has-aspect-ratio,
64193      body.wp-has-aspect-ratio,
64194      body.wp-has-aspect-ratio > div,
64195      body.wp-has-aspect-ratio > div iframe {
64196          width: 100%;
64197          height: 100%;
64198          overflow: hidden; /* If it has an aspect ratio, it shouldn't scroll. */
64199      }
64200      body > div > * {
64201          margin-top: 0 !important; /* Has to have !important to override inline styles. */
64202          margin-bottom: 0 !important;
64203      }
64204  `;
64205  
64206  /**
64207   * This component provides an isolated environment for arbitrary HTML via iframes.
64208   *
64209   * ```jsx
64210   * import { SandBox } from '@wordpress/components';
64211   *
64212   * const MySandBox = () => (
64213   *     <SandBox html="<p>Content</p>" title="SandBox" type="embed" />
64214   * );
64215   * ```
64216   */
64217  function SandBox({
64218    html = '',
64219    title = '',
64220    type,
64221    styles = [],
64222    scripts = [],
64223    onFocus,
64224    tabIndex
64225  }) {
64226    const ref = (0,external_wp_element_namespaceObject.useRef)();
64227    const [width, setWidth] = (0,external_wp_element_namespaceObject.useState)(0);
64228    const [height, setHeight] = (0,external_wp_element_namespaceObject.useState)(0);
64229    function isFrameAccessible() {
64230      try {
64231        return !!ref.current?.contentDocument?.body;
64232      } catch (e) {
64233        return false;
64234      }
64235    }
64236    function trySandBox(forceRerender = false) {
64237      if (!isFrameAccessible()) {
64238        return;
64239      }
64240      const {
64241        contentDocument,
64242        ownerDocument
64243      } = ref.current;
64244      if (!forceRerender && null !== contentDocument?.body.getAttribute('data-resizable-iframe-connected')) {
64245        return;
64246      }
64247  
64248      // Put the html snippet into a html document, and then write it to the iframe's document
64249      // we can use this in the future to inject custom styles or scripts.
64250      // Scripts go into the body rather than the head, to support embedded content such as Instagram
64251      // that expect the scripts to be part of the body.
64252      const htmlDoc = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("html", {
64253        lang: ownerDocument.documentElement.lang,
64254        className: type,
64255        children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("head", {
64256          children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("title", {
64257            children: title
64258          }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("style", {
64259            dangerouslySetInnerHTML: {
64260              __html: style
64261            }
64262          }), styles.map((rules, i) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("style", {
64263            dangerouslySetInnerHTML: {
64264              __html: rules
64265            }
64266          }, i))]
64267        }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("body", {
64268          "data-resizable-iframe-connected": "data-resizable-iframe-connected",
64269          className: type,
64270          children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", {
64271            dangerouslySetInnerHTML: {
64272              __html: html
64273            }
64274          }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("script", {
64275            type: "text/javascript",
64276            dangerouslySetInnerHTML: {
64277              __html: `($observeAndResizeJS.toString()})();`
64278            }
64279          }), scripts.map(src => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("script", {
64280            src: src
64281          }, src))]
64282        })]
64283      });
64284  
64285      // Writing the document like this makes it act in the same way as if it was
64286      // loaded over the network, so DOM creation and mutation, script execution, etc.
64287      // all work as expected.
64288      contentDocument.open();
64289      contentDocument.write('<!DOCTYPE html>' + (0,external_wp_element_namespaceObject.renderToString)(htmlDoc));
64290      contentDocument.close();
64291    }
64292    (0,external_wp_element_namespaceObject.useEffect)(() => {
64293      trySandBox();
64294      function tryNoForceSandBox() {
64295        trySandBox(false);
64296      }
64297      function checkMessageForResize(event) {
64298        const iframe = ref.current;
64299  
64300        // Verify that the mounted element is the source of the message.
64301        if (!iframe || iframe.contentWindow !== event.source) {
64302          return;
64303        }
64304  
64305        // Attempt to parse the message data as JSON if passed as string.
64306        let data = event.data || {};
64307        if ('string' === typeof data) {
64308          try {
64309            data = JSON.parse(data);
64310          } catch (e) {}
64311        }
64312  
64313        // Update the state only if the message is formatted as we expect,
64314        // i.e. as an object with a 'resize' action.
64315        if ('resize' !== data.action) {
64316          return;
64317        }
64318        setWidth(data.width);
64319        setHeight(data.height);
64320      }
64321      const iframe = ref.current;
64322      const defaultView = iframe?.ownerDocument?.defaultView;
64323  
64324      // This used to be registered using <iframe onLoad={} />, but it made the iframe blank
64325      // after reordering the containing block. See these two issues for more details:
64326      // https://github.com/WordPress/gutenberg/issues/6146
64327      // https://github.com/facebook/react/issues/18752
64328      iframe?.addEventListener('load', tryNoForceSandBox, false);
64329      defaultView?.addEventListener('message', checkMessageForResize);
64330      return () => {
64331        iframe?.removeEventListener('load', tryNoForceSandBox, false);
64332        defaultView?.removeEventListener('message', checkMessageForResize);
64333      };
64334      // Ignore reason: passing `exhaustive-deps` will likely involve a more detailed refactor.
64335      // See https://github.com/WordPress/gutenberg/pull/44378
64336      // eslint-disable-next-line react-hooks/exhaustive-deps
64337    }, []);
64338    (0,external_wp_element_namespaceObject.useEffect)(() => {
64339      trySandBox();
64340      // Ignore reason: passing `exhaustive-deps` will likely involve a more detailed refactor.
64341      // See https://github.com/WordPress/gutenberg/pull/44378
64342      // eslint-disable-next-line react-hooks/exhaustive-deps
64343    }, [title, styles, scripts]);
64344    (0,external_wp_element_namespaceObject.useEffect)(() => {
64345      trySandBox(true);
64346      // Ignore reason: passing `exhaustive-deps` will likely involve a more detailed refactor.
64347      // See https://github.com/WordPress/gutenberg/pull/44378
64348      // eslint-disable-next-line react-hooks/exhaustive-deps
64349    }, [html, type]);
64350    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("iframe", {
64351      ref: (0,external_wp_compose_namespaceObject.useMergeRefs)([ref, (0,external_wp_compose_namespaceObject.useFocusableIframe)()]),
64352      title: title,
64353      tabIndex: tabIndex,
64354      className: "components-sandbox",
64355      sandbox: "allow-scripts allow-same-origin allow-presentation",
64356      onFocus: onFocus,
64357      width: Math.ceil(width),
64358      height: Math.ceil(height)
64359    });
64360  }
64361  /* harmony default export */ const sandbox = (SandBox);
64362  
64363  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/snackbar/index.js
64364  /**
64365   * External dependencies
64366   */
64367  
64368  
64369  
64370  /**
64371   * WordPress dependencies
64372   */
64373  
64374  
64375  
64376  
64377  
64378  /**
64379   * Internal dependencies
64380   */
64381  
64382  
64383  
64384  const NOTICE_TIMEOUT = 10000;
64385  
64386  /**
64387   * Custom hook which announces the message with the given politeness, if a
64388   * valid message is provided.
64389   *
64390   * @param message    Message to announce.
64391   * @param politeness Politeness to announce.
64392   */
64393  function snackbar_useSpokenMessage(message, politeness) {
64394    const spokenMessage = typeof message === 'string' ? message : (0,external_wp_element_namespaceObject.renderToString)(message);
64395    (0,external_wp_element_namespaceObject.useEffect)(() => {
64396      if (spokenMessage) {
64397        (0,external_wp_a11y_namespaceObject.speak)(spokenMessage, politeness);
64398      }
64399    }, [spokenMessage, politeness]);
64400  }
64401  function UnforwardedSnackbar({
64402    className,
64403    children,
64404    spokenMessage = children,
64405    politeness = 'polite',
64406    actions = [],
64407    onRemove,
64408    icon = null,
64409    explicitDismiss = false,
64410    // onDismiss is a callback executed when the snackbar is dismissed.
64411    // It is distinct from onRemove, which _looks_ like a callback but is
64412    // actually the function to call to remove the snackbar from the UI.
64413    onDismiss,
64414    listRef
64415  }, ref) {
64416    function dismissMe(event) {
64417      if (event && event.preventDefault) {
64418        event.preventDefault();
64419      }
64420  
64421      // Prevent focus loss by moving it to the list element.
64422      listRef?.current?.focus();
64423      onDismiss?.();
64424      onRemove?.();
64425    }
64426    function onActionClick(event, onClick) {
64427      event.stopPropagation();
64428      onRemove?.();
64429      if (onClick) {
64430        onClick(event);
64431      }
64432    }
64433    snackbar_useSpokenMessage(spokenMessage, politeness);
64434  
64435    // The `onDismiss/onRemove` can have unstable references,
64436    // trigger side-effect cleanup, and reset timers.
64437    const callbacksRef = (0,external_wp_element_namespaceObject.useRef)({
64438      onDismiss,
64439      onRemove
64440    });
64441    (0,external_wp_element_namespaceObject.useLayoutEffect)(() => {
64442      callbacksRef.current = {
64443        onDismiss,
64444        onRemove
64445      };
64446    });
64447    (0,external_wp_element_namespaceObject.useEffect)(() => {
64448      // Only set up the timeout dismiss if we're not explicitly dismissing.
64449      const timeoutHandle = setTimeout(() => {
64450        if (!explicitDismiss) {
64451          callbacksRef.current.onDismiss?.();
64452          callbacksRef.current.onRemove?.();
64453        }
64454      }, NOTICE_TIMEOUT);
64455      return () => clearTimeout(timeoutHandle);
64456    }, [explicitDismiss]);
64457    const classes = dist_clsx(className, 'components-snackbar', {
64458      'components-snackbar-explicit-dismiss': !!explicitDismiss
64459    });
64460    if (actions && actions.length > 1) {
64461      // We need to inform developers that snackbar only accepts 1 action.
64462       true ? external_wp_warning_default()('Snackbar can only have one action. Use Notice if your message requires many actions.') : 0;
64463      // return first element only while keeping it inside an array
64464      actions = [actions[0]];
64465    }
64466    const snackbarContentClassnames = dist_clsx('components-snackbar__content', {
64467      'components-snackbar__content-with-icon': !!icon
64468    });
64469    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", {
64470      ref: ref,
64471      className: classes,
64472      onClick: !explicitDismiss ? dismissMe : undefined,
64473      tabIndex: 0,
64474      role: !explicitDismiss ? 'button' : undefined,
64475      onKeyPress: !explicitDismiss ? dismissMe : undefined,
64476      "aria-label": !explicitDismiss ? (0,external_wp_i18n_namespaceObject.__)('Dismiss this notice') : undefined,
64477      "data-testid": "snackbar",
64478      children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", {
64479        className: snackbarContentClassnames,
64480        children: [icon && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", {
64481          className: "components-snackbar__icon",
64482          children: icon
64483        }), children, actions.map(({
64484          label,
64485          onClick,
64486          url
64487        }, index) => {
64488          return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, {
64489            href: url,
64490            variant: "tertiary",
64491            onClick: event => onActionClick(event, onClick),
64492            className: "components-snackbar__action",
64493            children: label
64494          }, index);
64495        }), explicitDismiss && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", {
64496          role: "button",
64497          "aria-label": (0,external_wp_i18n_namespaceObject.__)('Dismiss this notice'),
64498          tabIndex: 0,
64499          className: "components-snackbar__dismiss-button",
64500          onClick: dismissMe,
64501          onKeyPress: dismissMe,
64502          children: "\u2715"
64503        })]
64504      })
64505    });
64506  }
64507  
64508  /**
64509   * A Snackbar displays a succinct message that is cleared out after a small delay.
64510   *
64511   * It can also offer the user options, like viewing a published post.
64512   * But these options should also be available elsewhere in the UI.
64513   *
64514   * ```jsx
64515   * const MySnackbarNotice = () => (
64516   *   <Snackbar>Post published successfully.</Snackbar>
64517   * );
64518   * ```
64519   */
64520  const Snackbar = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedSnackbar);
64521  /* harmony default export */ const snackbar = (Snackbar);
64522  
64523  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/snackbar/list.js
64524  /**
64525   * External dependencies
64526   */
64527  
64528  
64529  /**
64530   * WordPress dependencies
64531   */
64532  
64533  
64534  
64535  /**
64536   * Internal dependencies
64537   */
64538  
64539  
64540  
64541  
64542  const SNACKBAR_VARIANTS = {
64543    init: {
64544      height: 0,
64545      opacity: 0
64546    },
64547    open: {
64548      height: 'auto',
64549      opacity: 1,
64550      transition: {
64551        height: {
64552          type: 'tween',
64553          duration: 0.3,
64554          ease: [0, 0, 0.2, 1]
64555        },
64556        opacity: {
64557          type: 'tween',
64558          duration: 0.25,
64559          delay: 0.05,
64560          ease: [0, 0, 0.2, 1]
64561        }
64562      }
64563    },
64564    exit: {
64565      opacity: 0,
64566      transition: {
64567        type: 'tween',
64568        duration: 0.1,
64569        ease: [0, 0, 0.2, 1]
64570      }
64571    }
64572  };
64573  
64574  /**
64575   * Renders a list of notices.
64576   *
64577   * ```jsx
64578   * const MySnackbarListNotice = () => (
64579   *   <SnackbarList
64580   *     notices={ notices }
64581   *     onRemove={ removeNotice }
64582   *   />
64583   * );
64584   * ```
64585   */
64586  function SnackbarList({
64587    notices,
64588    className,
64589    children,
64590    onRemove
64591  }) {
64592    const listRef = (0,external_wp_element_namespaceObject.useRef)(null);
64593    const isReducedMotion = (0,external_wp_compose_namespaceObject.useReducedMotion)();
64594    className = dist_clsx('components-snackbar-list', className);
64595    const removeNotice = notice => () => onRemove?.(notice.id);
64596    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", {
64597      className: className,
64598      tabIndex: -1,
64599      ref: listRef,
64600      "data-testid": "snackbar-list",
64601      children: [children, /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(AnimatePresence, {
64602        children: notices.map(notice => {
64603          const {
64604            content,
64605            ...restNotice
64606          } = notice;
64607          return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(motion.div, {
64608            layout: !isReducedMotion // See https://www.framer.com/docs/animation/#layout-animations
64609            ,
64610            initial: "init",
64611            animate: "open",
64612            exit: "exit",
64613            variants: isReducedMotion ? undefined : SNACKBAR_VARIANTS,
64614            children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", {
64615              className: "components-snackbar-list__notice-container",
64616              children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(snackbar, {
64617                ...restNotice,
64618                onRemove: removeNotice(notice),
64619                listRef: listRef,
64620                children: notice.content
64621              })
64622            })
64623          }, notice.id);
64624        })
64625      })]
64626    });
64627  }
64628  /* harmony default export */ const snackbar_list = (SnackbarList);
64629  
64630  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/spinner/styles.js
64631  
64632  function spinner_styles_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)."; }
64633  /**
64634   * External dependencies
64635   */
64636  
64637  
64638  
64639  /**
64640   * Internal dependencies
64641   */
64642  
64643  const spinAnimation = emotion_react_browser_esm_keyframes`
64644      from {
64645          transform: rotate(0deg);
64646      }
64647      to {
64648          transform: rotate(360deg);
64649      }
64650   `;
64651  const StyledSpinner = /*#__PURE__*/emotion_styled_base_browser_esm("svg",  true ? {
64652    target: "ea4tfvq2"
64653  } : 0)("width:", config_values.spinnerSize, "px;height:", config_values.spinnerSize, "px;display:inline-block;margin:5px 11px 0;position:relative;color:", COLORS.theme.accent, ";overflow:visible;opacity:1;background-color:transparent;" + ( true ? "" : 0));
64654  const commonPathProps =  true ? {
64655    name: "9s4963",
64656    styles: "fill:transparent;stroke-width:1.5px"
64657  } : 0;
64658  const SpinnerTrack = /*#__PURE__*/emotion_styled_base_browser_esm("circle",  true ? {
64659    target: "ea4tfvq1"
64660  } : 0)(commonPathProps, ";stroke:", COLORS.gray[300], ";" + ( true ? "" : 0));
64661  const SpinnerIndicator = /*#__PURE__*/emotion_styled_base_browser_esm("path",  true ? {
64662    target: "ea4tfvq0"
64663  } : 0)(commonPathProps, ";stroke:currentColor;stroke-linecap:round;transform-origin:50% 50%;animation:1.4s linear infinite both ", spinAnimation, ";" + ( true ? "" : 0));
64664  
64665  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/spinner/index.js
64666  /**
64667   * External dependencies
64668   */
64669  
64670  /**
64671   * Internal dependencies
64672   */
64673  
64674  /**
64675   * WordPress dependencies
64676   */
64677  
64678  
64679  
64680  function UnforwardedSpinner({
64681    className,
64682    ...props
64683  }, forwardedRef) {
64684    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(StyledSpinner, {
64685      className: dist_clsx('components-spinner', className),
64686      viewBox: "0 0 100 100",
64687      width: "16",
64688      height: "16",
64689      xmlns: "http://www.w3.org/2000/svg",
64690      role: "presentation",
64691      focusable: "false",
64692      ...props,
64693      ref: forwardedRef,
64694      children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(SpinnerTrack, {
64695        cx: "50",
64696        cy: "50",
64697        r: "50",
64698        vectorEffect: "non-scaling-stroke"
64699      }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(SpinnerIndicator, {
64700        d: "m 50 0 a 50 50 0 0 1 50 50",
64701        vectorEffect: "non-scaling-stroke"
64702      })]
64703    });
64704  }
64705  /**
64706   * `Spinner` is a component used to notify users that their action is being processed.
64707   *
64708   * ```js
64709   *   import { Spinner } from '@wordpress/components';
64710   *
64711   *   function Example() {
64712   *     return <Spinner />;
64713   *   }
64714   * ```
64715   */
64716  const Spinner = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedSpinner);
64717  /* harmony default export */ const spinner = (Spinner);
64718  
64719  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/surface/component.js
64720  /**
64721   * External dependencies
64722   */
64723  
64724  /**
64725   * Internal dependencies
64726   */
64727  
64728  
64729  
64730  
64731  function UnconnectedSurface(props, forwardedRef) {
64732    const surfaceProps = useSurface(props);
64733    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(component, {
64734      ...surfaceProps,
64735      ref: forwardedRef
64736    });
64737  }
64738  
64739  /**
64740   * `Surface` is a core component that renders a primary background color.
64741   *
64742   * In the example below, notice how the `Surface` renders in white (or dark gray if in dark mode).
64743   *
64744   * ```jsx
64745   * import {
64746   *    __experimentalSurface as Surface,
64747   *    __experimentalText as Text,
64748   * } from '@wordpress/components';
64749   *
64750   * function Example() {
64751   *     return (
64752   *         <Surface>
64753   *             <Text>Code is Poetry</Text>
64754   *         </Surface>
64755   *     );
64756   * }
64757   * ```
64758   */
64759  const component_Surface = contextConnect(UnconnectedSurface, 'Surface');
64760  /* harmony default export */ const surface_component = (component_Surface);
64761  
64762  ;// CONCATENATED MODULE: ./node_modules/@ariakit/core/esm/tab/tab-store.js
64763  "use client";
64764  
64765  
64766  
64767  
64768  
64769  
64770  
64771  
64772  // src/tab/tab-store.ts
64773  function createTabStore(_a = {}) {
64774    var _b = _a, {
64775      composite: parentComposite,
64776      combobox
64777    } = _b, props = _3YLGPPWQ_objRest(_b, [
64778      "composite",
64779      "combobox"
64780    ]);
64781    const independentKeys = [
64782      "items",
64783      "renderedItems",
64784      "moves",
64785      "orientation",
64786      "virtualFocus",
64787      "includesBaseElement",
64788      "baseElement",
64789      "focusLoop",
64790      "focusShift",
64791      "focusWrap"
64792    ];
64793    const store = mergeStore(
64794      props.store,
64795      omit2(parentComposite, independentKeys),
64796      omit2(combobox, independentKeys)
64797    );
64798    const syncState = store == null ? void 0 : store.getState();
64799    const composite = createCompositeStore(_chunks_3YLGPPWQ_spreadProps(_chunks_3YLGPPWQ_spreadValues({}, props), {
64800      store,
64801      // We need to explicitly set the default value of `includesBaseElement` to
64802      // `false` since we don't want the composite store to default it to `true`
64803      // when the activeId state is null, which could be the case when rendering
64804      // combobox with tab.
64805      includesBaseElement: defaultValue(
64806        props.includesBaseElement,
64807        syncState == null ? void 0 : syncState.includesBaseElement,
64808        false
64809      ),
64810      orientation: defaultValue(
64811        props.orientation,
64812        syncState == null ? void 0 : syncState.orientation,
64813        "horizontal"
64814      ),
64815      focusLoop: defaultValue(props.focusLoop, syncState == null ? void 0 : syncState.focusLoop, true)
64816    }));
64817    const panels = createCollectionStore();
64818    const initialState = _chunks_3YLGPPWQ_spreadProps(_chunks_3YLGPPWQ_spreadValues({}, composite.getState()), {
64819      selectedId: defaultValue(
64820        props.selectedId,
64821        syncState == null ? void 0 : syncState.selectedId,
64822        props.defaultSelectedId
64823      ),
64824      selectOnMove: defaultValue(
64825        props.selectOnMove,
64826        syncState == null ? void 0 : syncState.selectOnMove,
64827        true
64828      )
64829    });
64830    const tab = createStore(initialState, composite, store);
64831    setup(
64832      tab,
64833      () => sync(tab, ["moves"], () => {
64834        const { activeId, selectOnMove } = tab.getState();
64835        if (!selectOnMove) return;
64836        if (!activeId) return;
64837        const tabItem = composite.item(activeId);
64838        if (!tabItem) return;
64839        if (tabItem.dimmed) return;
64840        if (tabItem.disabled) return;
64841        tab.setState("selectedId", tabItem.id);
64842      })
64843    );
64844    let syncActiveId = true;
64845    setup(
64846      tab,
64847      () => batch(tab, ["selectedId"], (state, prev) => {
64848        if (!syncActiveId) {
64849          syncActiveId = true;
64850          return;
64851        }
64852        if (parentComposite && state.selectedId === prev.selectedId) return;
64853        tab.setState("activeId", state.selectedId);
64854      })
64855    );
64856    setup(
64857      tab,
64858      () => sync(tab, ["selectedId", "renderedItems"], (state) => {
64859        if (state.selectedId !== void 0) return;
64860        const { activeId, renderedItems } = tab.getState();
64861        const tabItem = composite.item(activeId);
64862        if (tabItem && !tabItem.disabled && !tabItem.dimmed) {
64863          tab.setState("selectedId", tabItem.id);
64864        } else {
64865          const tabItem2 = renderedItems.find(
64866            (item) => !item.disabled && !item.dimmed
64867          );
64868          tab.setState("selectedId", tabItem2 == null ? void 0 : tabItem2.id);
64869        }
64870      })
64871    );
64872    setup(
64873      tab,
64874      () => sync(tab, ["renderedItems"], (state) => {
64875        const tabs = state.renderedItems;
64876        if (!tabs.length) return;
64877        return sync(panels, ["renderedItems"], (state2) => {
64878          const items = state2.renderedItems;
64879          const hasOrphanPanels = items.some((panel) => !panel.tabId);
64880          if (!hasOrphanPanels) return;
64881          items.forEach((panel, i) => {
64882            if (panel.tabId) return;
64883            const tabItem = tabs[i];
64884            if (!tabItem) return;
64885            panels.renderItem(_chunks_3YLGPPWQ_spreadProps(_chunks_3YLGPPWQ_spreadValues({}, panel), { tabId: tabItem.id }));
64886          });
64887        });
64888      })
64889    );
64890    let selectedIdFromSelectedValue = null;
64891    setup(tab, () => {
64892      const backupSelectedId = () => {
64893        selectedIdFromSelectedValue = tab.getState().selectedId;
64894      };
64895      const restoreSelectedId = () => {
64896        syncActiveId = false;
64897        tab.setState("selectedId", selectedIdFromSelectedValue);
64898      };
64899      if (parentComposite && "setSelectElement" in parentComposite) {
64900        return chain(
64901          sync(parentComposite, ["value"], backupSelectedId),
64902          sync(parentComposite, ["mounted"], restoreSelectedId)
64903        );
64904      }
64905      if (!combobox) return;
64906      return chain(
64907        sync(combobox, ["selectedValue"], backupSelectedId),
64908        sync(combobox, ["mounted"], restoreSelectedId)
64909      );
64910    });
64911    return _chunks_3YLGPPWQ_spreadProps(_chunks_3YLGPPWQ_spreadValues(_chunks_3YLGPPWQ_spreadValues({}, composite), tab), {
64912      panels,
64913      setSelectedId: (id) => tab.setState("selectedId", id),
64914      select: (id) => {
64915        tab.setState("selectedId", id);
64916        composite.move(id);
64917      }
64918    });
64919  }
64920  
64921  
64922  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/JZUY7XL6.js
64923  "use client";
64924  
64925  
64926  
64927  
64928  
64929  
64930  
64931  // src/tab/tab-store.ts
64932  
64933  
64934  function useTabStoreProps(store, update, props) {
64935    useUpdateEffect(update, [props.composite, props.combobox]);
64936    store = useCompositeStoreProps(store, update, props);
64937    useStoreProps(store, props, "selectedId", "setSelectedId");
64938    useStoreProps(store, props, "selectOnMove");
64939    const [panels, updatePanels] = _2GXGCHW6_useStore(() => store.panels, {});
64940    useUpdateEffect(updatePanels, [store, updatePanels]);
64941    return Object.assign(
64942      (0,external_React_.useMemo)(() => _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, store), { panels }), [store, panels]),
64943      { composite: props.composite, combobox: props.combobox }
64944    );
64945  }
64946  function useTabStore(props = {}) {
64947    const combobox = useComboboxContext();
64948    const composite = useSelectContext() || combobox;
64949    props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, props), {
64950      composite: props.composite !== void 0 ? props.composite : composite,
64951      combobox: props.combobox !== void 0 ? props.combobox : combobox
64952    });
64953    const [store, update] = _2GXGCHW6_useStore(createTabStore, props);
64954    return useTabStoreProps(store, update, props);
64955  }
64956  
64957  
64958  
64959  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/TNITL632.js
64960  "use client";
64961  
64962  
64963  
64964  // src/tab/tab-context.tsx
64965  var TNITL632_ctx = createStoreContext(
64966    [CompositeContextProvider],
64967    [CompositeScopedContextProvider]
64968  );
64969  var useTabContext = TNITL632_ctx.useContext;
64970  var useTabScopedContext = TNITL632_ctx.useScopedContext;
64971  var useTabProviderContext = TNITL632_ctx.useProviderContext;
64972  var TabContextProvider = TNITL632_ctx.ContextProvider;
64973  var TabScopedContextProvider = TNITL632_ctx.ScopedContextProvider;
64974  
64975  
64976  
64977  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/tab/tab-list.js
64978  "use client";
64979  
64980  
64981  
64982  
64983  
64984  
64985  
64986  
64987  
64988  
64989  
64990  
64991  // src/tab/tab-list.tsx
64992  
64993  
64994  var tab_list_TagName = "div";
64995  var useTabList = createHook(
64996    function useTabList2(_a) {
64997      var _b = _a, { store } = _b, props = __objRest(_b, ["store"]);
64998      const context = useTabProviderContext();
64999      store = store || context;
65000      invariant(
65001        store,
65002         false && 0
65003      );
65004      const orientation = store.useState(
65005        (state) => state.orientation === "both" ? void 0 : state.orientation
65006      );
65007      props = useWrapElement(
65008        props,
65009        (element) => /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(TabScopedContextProvider, { value: store, children: element }),
65010        [store]
65011      );
65012      if (store.composite) {
65013        props = _3YLGPPWQ_spreadValues({
65014          focusable: false
65015        }, props);
65016      }
65017      props = _3YLGPPWQ_spreadValues({
65018        role: "tablist",
65019        "aria-orientation": orientation
65020      }, props);
65021      props = useComposite(_3YLGPPWQ_spreadValues({ store }, props));
65022      return props;
65023    }
65024  );
65025  var tab_list_TabList = forwardRef2(function TabList2(props) {
65026    const htmlProps = useTabList(props);
65027    return HKOOKEDE_createElement(tab_list_TagName, htmlProps);
65028  });
65029  
65030  
65031  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/tab/tab.js
65032  "use client";
65033  
65034  
65035  
65036  
65037  
65038  
65039  
65040  
65041  
65042  
65043  
65044  
65045  
65046  
65047  
65048  // src/tab/tab.tsx
65049  
65050  
65051  
65052  var tab_TagName = "button";
65053  var useTab = createHook(function useTab2(_a) {
65054    var _b = _a, {
65055      store,
65056      getItem: getItemProp
65057    } = _b, props = __objRest(_b, [
65058      "store",
65059      "getItem"
65060    ]);
65061    var _a2;
65062    const context = useTabScopedContext();
65063    store = store || context;
65064    invariant(
65065      store,
65066       false && 0
65067    );
65068    const defaultId = useId();
65069    const id = props.id || defaultId;
65070    const dimmed = disabledFromProps(props);
65071    const getItem = (0,external_React_.useCallback)(
65072      (item) => {
65073        const nextItem = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, item), { dimmed });
65074        if (getItemProp) {
65075          return getItemProp(nextItem);
65076        }
65077        return nextItem;
65078      },
65079      [dimmed, getItemProp]
65080    );
65081    const onClickProp = props.onClick;
65082    const onClick = useEvent((event) => {
65083      onClickProp == null ? void 0 : onClickProp(event);
65084      if (event.defaultPrevented) return;
65085      store == null ? void 0 : store.setSelectedId(id);
65086    });
65087    const panelId = store.panels.useState(
65088      (state) => {
65089        var _a3;
65090        return (_a3 = state.items.find((item) => item.tabId === id)) == null ? void 0 : _a3.id;
65091      }
65092    );
65093    const shouldRegisterItem = defaultId ? props.shouldRegisterItem : false;
65094    const isActive = store.useState((state) => !!id && state.activeId === id);
65095    const selected = store.useState((state) => !!id && state.selectedId === id);
65096    const hasActiveItem = store.useState((state) => !!store.item(state.activeId));
65097    const canRegisterComposedItem = isActive || selected && !hasActiveItem;
65098    const accessibleWhenDisabled = selected || ((_a2 = props.accessibleWhenDisabled) != null ? _a2 : true);
65099    const isWithinVirtualFocusComposite = useStoreState(
65100      store.combobox || store.composite,
65101      "virtualFocus"
65102    );
65103    if (isWithinVirtualFocusComposite) {
65104      props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, props), {
65105        tabIndex: -1
65106      });
65107    }
65108    props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({
65109      id,
65110      role: "tab",
65111      "aria-selected": selected,
65112      "aria-controls": panelId || void 0
65113    }, props), {
65114      onClick
65115    });
65116    if (store.composite) {
65117      const defaultProps = {
65118        id,
65119        accessibleWhenDisabled,
65120        store: store.composite,
65121        shouldRegisterItem: canRegisterComposedItem && shouldRegisterItem,
65122        render: props.render
65123      };
65124      props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, props), {
65125        render: /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(
65126          _7QKWW6TW_CompositeItem,
65127          _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, defaultProps), {
65128            render: store.combobox && store.composite !== store.combobox ? /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(_7QKWW6TW_CompositeItem, _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, defaultProps), { store: store.combobox })) : defaultProps.render
65129          })
65130        )
65131      });
65132    }
65133    props = useCompositeItem(_3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({
65134      store
65135    }, props), {
65136      accessibleWhenDisabled,
65137      getItem,
65138      shouldRegisterItem
65139    }));
65140    return props;
65141  });
65142  var Tab = memo2(
65143    forwardRef2(function Tab2(props) {
65144      const htmlProps = useTab(props);
65145      return HKOOKEDE_createElement(tab_TagName, htmlProps);
65146    })
65147  );
65148  
65149  
65150  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/tab/tab-panel.js
65151  "use client";
65152  
65153  
65154  
65155  
65156  
65157  
65158  
65159  
65160  
65161  
65162  
65163  
65164  
65165  
65166  
65167  
65168  // src/tab/tab-panel.tsx
65169  
65170  
65171  
65172  
65173  
65174  var tab_panel_TagName = "div";
65175  var useTabPanel = createHook(
65176    function useTabPanel2(_a) {
65177      var _b = _a, {
65178        store,
65179        unmountOnHide,
65180        tabId: tabIdProp,
65181        getItem: getItemProp
65182      } = _b, props = __objRest(_b, [
65183        "store",
65184        "unmountOnHide",
65185        "tabId",
65186        "getItem"
65187      ]);
65188      const context = useTabProviderContext();
65189      store = store || context;
65190      invariant(
65191        store,
65192         false && 0
65193      );
65194      const ref = (0,external_React_.useRef)(null);
65195      const id = useId(props.id);
65196      const [hasTabbableChildren, setHasTabbableChildren] = (0,external_React_.useState)(false);
65197      (0,external_React_.useEffect)(() => {
65198        const element = ref.current;
65199        if (!element) return;
65200        const tabbable = getAllTabbableIn(element);
65201        setHasTabbableChildren(!!tabbable.length);
65202      }, []);
65203      const getItem = (0,external_React_.useCallback)(
65204        (item) => {
65205          const nextItem = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, item), { id: id || item.id, tabId: tabIdProp });
65206          if (getItemProp) {
65207            return getItemProp(nextItem);
65208          }
65209          return nextItem;
65210        },
65211        [id, tabIdProp, getItemProp]
65212      );
65213      const onKeyDownProp = props.onKeyDown;
65214      const onKeyDown = useEvent((event) => {
65215        onKeyDownProp == null ? void 0 : onKeyDownProp(event);
65216        if (event.defaultPrevented) return;
65217        if (!(store == null ? void 0 : store.composite)) return;
65218        const state = store.getState();
65219        const tab = createTabStore(_3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, state), { activeId: state.selectedId }));
65220        tab.setState("renderedItems", state.renderedItems);
65221        const keyMap = {
65222          ArrowLeft: tab.previous,
65223          ArrowRight: tab.next,
65224          Home: tab.first,
65225          End: tab.last
65226        };
65227        const action = keyMap[event.key];
65228        if (!action) return;
65229        const nextId = action();
65230        if (!nextId) return;
65231        event.preventDefault();
65232        store.move(nextId);
65233      });
65234      props = useWrapElement(
65235        props,
65236        (element) => /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(TabScopedContextProvider, { value: store, children: element }),
65237        [store]
65238      );
65239      const tabId = store.panels.useState(
65240        () => {
65241          var _a2;
65242          return tabIdProp || ((_a2 = store == null ? void 0 : store.panels.item(id)) == null ? void 0 : _a2.tabId);
65243        }
65244      );
65245      const open = store.useState(
65246        (state) => !!tabId && state.selectedId === tabId
65247      );
65248      const disclosure = useDisclosureStore({ open });
65249      const mounted = disclosure.useState("mounted");
65250      props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({
65251        id,
65252        role: "tabpanel",
65253        "aria-labelledby": tabId || void 0
65254      }, props), {
65255        children: unmountOnHide && !mounted ? null : props.children,
65256        ref: useMergeRefs(ref, props.ref),
65257        onKeyDown
65258      });
65259      props = useFocusable(_3YLGPPWQ_spreadValues({
65260        // If the tab panel is rendered as part of another composite widget such
65261        // as combobox, it should not be focusable.
65262        focusable: !store.composite && !hasTabbableChildren
65263      }, props));
65264      props = useDisclosureContent(_3YLGPPWQ_spreadValues({ store: disclosure }, props));
65265      props = useCollectionItem(_3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({ store: store.panels }, props), { getItem }));
65266      return props;
65267    }
65268  );
65269  var TabPanel = forwardRef2(function TabPanel2(props) {
65270    const htmlProps = useTabPanel(props);
65271    return HKOOKEDE_createElement(tab_panel_TagName, htmlProps);
65272  });
65273  
65274  
65275  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/tab-panel/index.js
65276  /**
65277   * External dependencies
65278   */
65279  
65280  
65281  
65282  /**
65283   * WordPress dependencies
65284   */
65285  
65286  
65287  
65288  /**
65289   * Internal dependencies
65290   */
65291  
65292  
65293  
65294  
65295  // Separate the actual tab name from the instance ID. This is
65296  // necessary because Ariakit internally uses the element ID when
65297  // a new tab is selected, but our implementation looks specifically
65298  // for the tab name to be passed to the `onSelect` callback.
65299  const extractTabName = id => {
65300    if (typeof id === 'undefined' || id === null) {
65301      return;
65302    }
65303    return id.match(/^tab-panel-[0-9]*-(.*)/)?.[1];
65304  };
65305  
65306  /**
65307   * TabPanel is an ARIA-compliant tabpanel.
65308   *
65309   * TabPanels organize content across different screens, data sets, and interactions.
65310   * It has two sections: a list of tabs, and the view to show when tabs are chosen.
65311   *
65312   * ```jsx
65313   * import { TabPanel } from '@wordpress/components';
65314   *
65315   * const onSelect = ( tabName ) => {
65316   *   console.log( 'Selecting tab', tabName );
65317   * };
65318   *
65319   * const MyTabPanel = () => (
65320   *   <TabPanel
65321   *     className="my-tab-panel"
65322   *     activeClass="active-tab"
65323   *     onSelect={ onSelect }
65324   *     tabs={ [
65325   *       {
65326   *         name: 'tab1',
65327   *         title: 'Tab 1',
65328   *         className: 'tab-one',
65329   *       },
65330   *       {
65331   *         name: 'tab2',
65332   *         title: 'Tab 2',
65333   *         className: 'tab-two',
65334   *       },
65335   *     ] }
65336   *   >
65337   *     { ( tab ) => <p>{ tab.title }</p> }
65338   *   </TabPanel>
65339   * );
65340   * ```
65341   */
65342  const UnforwardedTabPanel = ({
65343    className,
65344    children,
65345    tabs,
65346    selectOnMove = true,
65347    initialTabName,
65348    orientation = 'horizontal',
65349    activeClass = 'is-active',
65350    onSelect
65351  }, ref) => {
65352    const instanceId = (0,external_wp_compose_namespaceObject.useInstanceId)(tab_panel_TabPanel, 'tab-panel');
65353    const prependInstanceId = (0,external_wp_element_namespaceObject.useCallback)(tabName => {
65354      if (typeof tabName === 'undefined') {
65355        return;
65356      }
65357      return `$instanceId}-$tabName}`;
65358    }, [instanceId]);
65359    const tabStore = useTabStore({
65360      setSelectedId: newTabValue => {
65361        if (typeof newTabValue === 'undefined' || newTabValue === null) {
65362          return;
65363        }
65364        const newTab = tabs.find(t => prependInstanceId(t.name) === newTabValue);
65365        if (newTab?.disabled || newTab === selectedTab) {
65366          return;
65367        }
65368        const simplifiedTabName = extractTabName(newTabValue);
65369        if (typeof simplifiedTabName === 'undefined') {
65370          return;
65371        }
65372        onSelect?.(simplifiedTabName);
65373      },
65374      orientation,
65375      selectOnMove,
65376      defaultSelectedId: prependInstanceId(initialTabName)
65377    });
65378    const selectedTabName = extractTabName(useStoreState(tabStore, 'selectedId'));
65379    const setTabStoreSelectedId = (0,external_wp_element_namespaceObject.useCallback)(tabName => {
65380      tabStore.setState('selectedId', prependInstanceId(tabName));
65381    }, [prependInstanceId, tabStore]);
65382    const selectedTab = tabs.find(({
65383      name
65384    }) => name === selectedTabName);
65385    const previousSelectedTabName = (0,external_wp_compose_namespaceObject.usePrevious)(selectedTabName);
65386  
65387    // Ensure `onSelect` is called when the initial tab is selected.
65388    (0,external_wp_element_namespaceObject.useEffect)(() => {
65389      if (previousSelectedTabName !== selectedTabName && selectedTabName === initialTabName && !!selectedTabName) {
65390        onSelect?.(selectedTabName);
65391      }
65392    }, [selectedTabName, initialTabName, onSelect, previousSelectedTabName]);
65393  
65394    // Handle selecting the initial tab.
65395    (0,external_wp_element_namespaceObject.useLayoutEffect)(() => {
65396      // If there's a selected tab, don't override it.
65397      if (selectedTab) {
65398        return;
65399      }
65400      const initialTab = tabs.find(tab => tab.name === initialTabName);
65401      // Wait for the denoted initial tab to be declared before making a
65402      // selection. This ensures that if a tab is declared lazily it can
65403      // still receive initial selection.
65404      if (initialTabName && !initialTab) {
65405        return;
65406      }
65407      if (initialTab && !initialTab.disabled) {
65408        // Select the initial tab if it's not disabled.
65409        setTabStoreSelectedId(initialTab.name);
65410      } else {
65411        // Fallback to the first enabled tab when the initial tab is
65412        // disabled or it can't be found.
65413        const firstEnabledTab = tabs.find(tab => !tab.disabled);
65414        if (firstEnabledTab) {
65415          setTabStoreSelectedId(firstEnabledTab.name);
65416        }
65417      }
65418    }, [tabs, selectedTab, initialTabName, instanceId, setTabStoreSelectedId]);
65419  
65420    // Handle the currently selected tab becoming disabled.
65421    (0,external_wp_element_namespaceObject.useEffect)(() => {
65422      // This effect only runs when the selected tab is defined and becomes disabled.
65423      if (!selectedTab?.disabled) {
65424        return;
65425      }
65426      const firstEnabledTab = tabs.find(tab => !tab.disabled);
65427      // If the currently selected tab becomes disabled, select the first enabled tab.
65428      // (if there is one).
65429      if (firstEnabledTab) {
65430        setTabStoreSelectedId(firstEnabledTab.name);
65431      }
65432    }, [tabs, selectedTab?.disabled, setTabStoreSelectedId, instanceId]);
65433    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", {
65434      className: className,
65435      ref: ref,
65436      children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(tab_list_TabList, {
65437        store: tabStore,
65438        className: "components-tab-panel__tabs",
65439        children: tabs.map(tab => {
65440          return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Tab, {
65441            id: prependInstanceId(tab.name),
65442            className: dist_clsx('components-tab-panel__tabs-item', tab.className, {
65443              [activeClass]: tab.name === selectedTabName
65444            }),
65445            disabled: tab.disabled,
65446            "aria-controls": `$prependInstanceId(tab.name)}-view`,
65447            render: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, {
65448              icon: tab.icon,
65449              label: tab.icon && tab.title,
65450              showTooltip: !!tab.icon
65451            }),
65452            children: !tab.icon && tab.title
65453          }, tab.name);
65454        })
65455      }), selectedTab && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(TabPanel, {
65456        id: `$prependInstanceId(selectedTab.name)}-view`,
65457        store: tabStore,
65458        tabId: prependInstanceId(selectedTab.name),
65459        className: "components-tab-panel__tab-content",
65460        children: children(selectedTab)
65461      })]
65462    });
65463  };
65464  const tab_panel_TabPanel = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedTabPanel);
65465  /* harmony default export */ const tab_panel = (tab_panel_TabPanel);
65466  
65467  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/text-control/index.js
65468  /**
65469   * External dependencies
65470   */
65471  
65472  
65473  
65474  /**
65475   * WordPress dependencies
65476   */
65477  
65478  
65479  
65480  /**
65481   * Internal dependencies
65482   */
65483  
65484  
65485  function UnforwardedTextControl(props, ref) {
65486    const {
65487      __nextHasNoMarginBottom,
65488      __next40pxDefaultSize = false,
65489      label,
65490      hideLabelFromVision,
65491      value,
65492      help,
65493      id: idProp,
65494      className,
65495      onChange,
65496      type = 'text',
65497      ...additionalProps
65498    } = props;
65499    const id = (0,external_wp_compose_namespaceObject.useInstanceId)(TextControl, 'inspector-text-control', idProp);
65500    const onChangeValue = event => onChange(event.target.value);
65501    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(base_control, {
65502      __nextHasNoMarginBottom: __nextHasNoMarginBottom,
65503      __associatedWPComponentName: "TextControl",
65504      label: label,
65505      hideLabelFromVision: hideLabelFromVision,
65506      id: id,
65507      help: help,
65508      className: className,
65509      children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("input", {
65510        className: dist_clsx('components-text-control__input', {
65511          'is-next-40px-default-size': __next40pxDefaultSize
65512        }),
65513        type: type,
65514        id: id,
65515        value: value,
65516        onChange: onChangeValue,
65517        "aria-describedby": !!help ? id + '__help' : undefined,
65518        ref: ref,
65519        ...additionalProps
65520      })
65521    });
65522  }
65523  
65524  /**
65525   * TextControl components let users enter and edit text.
65526   *
65527   * ```jsx
65528   * import { TextControl } from '@wordpress/components';
65529   * import { useState } from '@wordpress/element';
65530   *
65531   * const MyTextControl = () => {
65532   *   const [ className, setClassName ] = useState( '' );
65533   *
65534   *   return (
65535   *     <TextControl
65536   *       __nextHasNoMarginBottom
65537   *       label="Additional CSS Class"
65538   *       value={ className }
65539   *       onChange={ ( value ) => setClassName( value ) }
65540   *     />
65541   *   );
65542   * };
65543   * ```
65544   */
65545  const TextControl = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedTextControl);
65546  /* harmony default export */ const text_control = (TextControl);
65547  
65548  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/utils/breakpoint-values.js
65549  /* harmony default export */ const breakpoint_values = ({
65550    huge: '1440px',
65551    wide: '1280px',
65552    'x-large': '1080px',
65553    large: '960px',
65554    // admin sidebar auto folds
65555    medium: '782px',
65556    // Adminbar goes big.
65557    small: '600px',
65558    mobile: '480px',
65559    'zoomed-in': '280px'
65560  });
65561  
65562  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/utils/breakpoint.js
65563  /**
65564   * Internal dependencies
65565   */
65566  
65567  
65568  /**
65569   * @param {keyof breakpoints} point
65570   * @return {string} Media query declaration.
65571   */
65572  const breakpoint = point => `@media (min-width: $breakpoint_values[point]})`;
65573  
65574  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/textarea-control/styles/textarea-control-styles.js
65575  
65576  /**
65577   * External dependencies
65578   */
65579  
65580  
65581  
65582  /**
65583   * Internal dependencies
65584   */
65585  
65586  
65587  
65588  
65589  const inputStyleNeutral = /*#__PURE__*/emotion_react_browser_esm_css("box-shadow:0 0 0 transparent;border-radius:", config_values.radiusSmall, ";border:", config_values.borderWidth, " solid ", COLORS.ui.border, ";@media not ( prefers-reduced-motion ){transition:box-shadow 0.1s linear;}" + ( true ? "" : 0),  true ? "" : 0);
65590  const inputStyleFocus = /*#__PURE__*/emotion_react_browser_esm_css("border-color:", COLORS.theme.accent, ";box-shadow:0 0 0 calc( ", config_values.borderWidthFocus, " - ", config_values.borderWidth, " ) ", COLORS.theme.accent, ";outline:2px solid transparent;" + ( true ? "" : 0),  true ? "" : 0);
65591  const StyledTextarea = /*#__PURE__*/emotion_styled_base_browser_esm("textarea",  true ? {
65592    target: "e1w5nnrk0"
65593  } : 0)("width:100%;display:block;font-family:", font('default.fontFamily'), ";line-height:20px;padding:9px 11px;", inputStyleNeutral, ";font-size:", font('mobileTextMinFontSize'), ";", breakpoint('small'), "{font-size:", font('default.fontSize'), ";}&:focus{", inputStyleFocus, ";}&::-webkit-input-placeholder{color:", COLORS.ui.darkGrayPlaceholder, ";}&::-moz-placeholder{opacity:1;color:", COLORS.ui.darkGrayPlaceholder, ";}&:-ms-input-placeholder{color:", COLORS.ui.darkGrayPlaceholder, ";}.is-dark-theme &{&::-webkit-input-placeholder{color:", COLORS.ui.lightGrayPlaceholder, ";}&::-moz-placeholder{opacity:1;color:", COLORS.ui.lightGrayPlaceholder, ";}&:-ms-input-placeholder{color:", COLORS.ui.lightGrayPlaceholder, ";}}" + ( true ? "" : 0));
65594  
65595  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/textarea-control/index.js
65596  /**
65597   * WordPress dependencies
65598   */
65599  
65600  
65601  
65602  /**
65603   * Internal dependencies
65604   */
65605  
65606  
65607  
65608  function UnforwardedTextareaControl(props, ref) {
65609    const {
65610      __nextHasNoMarginBottom,
65611      label,
65612      hideLabelFromVision,
65613      value,
65614      help,
65615      onChange,
65616      rows = 4,
65617      className,
65618      ...additionalProps
65619    } = props;
65620    const instanceId = (0,external_wp_compose_namespaceObject.useInstanceId)(TextareaControl);
65621    const id = `inspector-textarea-control-$instanceId}`;
65622    const onChangeValue = event => onChange(event.target.value);
65623    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(base_control, {
65624      __nextHasNoMarginBottom: __nextHasNoMarginBottom,
65625      __associatedWPComponentName: "TextareaControl",
65626      label: label,
65627      hideLabelFromVision: hideLabelFromVision,
65628      id: id,
65629      help: help,
65630      className: className,
65631      children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(StyledTextarea, {
65632        className: "components-textarea-control__input",
65633        id: id,
65634        rows: rows,
65635        onChange: onChangeValue,
65636        "aria-describedby": !!help ? id + '__help' : undefined,
65637        value: value,
65638        ref: ref,
65639        ...additionalProps
65640      })
65641    });
65642  }
65643  
65644  /**
65645   * TextareaControls are TextControls that allow for multiple lines of text, and
65646   * wrap overflow text onto a new line. They are a fixed height and scroll
65647   * vertically when the cursor reaches the bottom of the field.
65648   *
65649   * ```jsx
65650   * import { TextareaControl } from '@wordpress/components';
65651   * import { useState } from '@wordpress/element';
65652   *
65653   * const MyTextareaControl = () => {
65654   *   const [ text, setText ] = useState( '' );
65655   *
65656   *   return (
65657   *     <TextareaControl
65658   *       __nextHasNoMarginBottom
65659   *       label="Text"
65660   *       help="Enter some text"
65661   *       value={ text }
65662   *       onChange={ ( value ) => setText( value ) }
65663   *     />
65664   *   );
65665   * };
65666   * ```
65667   */
65668  const TextareaControl = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedTextareaControl);
65669  /* harmony default export */ const textarea_control = (TextareaControl);
65670  
65671  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/text-highlight/index.js
65672  /**
65673   * WordPress dependencies
65674   */
65675  
65676  
65677  /**
65678   * Internal dependencies
65679   */
65680  
65681  
65682  
65683  /**
65684   * Highlights occurrences of a given string within another string of text. Wraps
65685   * each match with a `<mark>` tag which provides browser default styling.
65686   *
65687   * ```jsx
65688   * import { TextHighlight } from '@wordpress/components';
65689   *
65690   * const MyTextHighlight = () => (
65691   *   <TextHighlight
65692   *     text="Why do we like Gutenberg? Because Gutenberg is the best!"
65693   *     highlight="Gutenberg"
65694   *   />
65695   * );
65696   * ```
65697   */
65698  const TextHighlight = props => {
65699    const {
65700      text = '',
65701      highlight = ''
65702    } = props;
65703    const trimmedHighlightText = highlight.trim();
65704    if (!trimmedHighlightText) {
65705      return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_ReactJSXRuntime_namespaceObject.Fragment, {
65706        children: text
65707      });
65708    }
65709    const regex = new RegExp(`($escapeRegExp(trimmedHighlightText)})`, 'gi');
65710    return (0,external_wp_element_namespaceObject.createInterpolateElement)(text.replace(regex, '<mark>$&</mark>'), {
65711      mark: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("mark", {})
65712    });
65713  };
65714  /* harmony default export */ const text_highlight = (TextHighlight);
65715  
65716  ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/tip.js
65717  /**
65718   * WordPress dependencies
65719   */
65720  
65721  
65722  const tip = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, {
65723    xmlns: "http://www.w3.org/2000/svg",
65724    viewBox: "0 0 24 24",
65725    children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, {
65726      d: "M12 15.8c-3.7 0-6.8-3-6.8-6.8s3-6.8 6.8-6.8c3.7 0 6.8 3 6.8 6.8s-3.1 6.8-6.8 6.8zm0-12C9.1 3.8 6.8 6.1 6.8 9s2.4 5.2 5.2 5.2c2.9 0 5.2-2.4 5.2-5.2S14.9 3.8 12 3.8zM8 17.5h8V19H8zM10 20.5h4V22h-4z"
65727    })
65728  });
65729  /* harmony default export */ const library_tip = (tip);
65730  
65731  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/tip/index.js
65732  /**
65733   * WordPress dependencies
65734   */
65735  
65736  
65737  /**
65738   * Internal dependencies
65739   */
65740  
65741  
65742  function Tip(props) {
65743    const {
65744      children
65745    } = props;
65746    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", {
65747      className: "components-tip",
65748      children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(icons_build_module_icon, {
65749        icon: library_tip
65750      }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("p", {
65751        children: children
65752      })]
65753    });
65754  }
65755  /* harmony default export */ const build_module_tip = (Tip);
65756  
65757  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/toggle-control/index.js
65758  /**
65759   * External dependencies
65760   */
65761  
65762  
65763  
65764  
65765  /**
65766   * WordPress dependencies
65767   */
65768  
65769  
65770  
65771  
65772  /**
65773   * Internal dependencies
65774   */
65775  
65776  
65777  
65778  
65779  
65780  
65781  
65782  
65783  function UnforwardedToggleControl({
65784    __nextHasNoMarginBottom,
65785    label,
65786    checked,
65787    help,
65788    className,
65789    onChange,
65790    disabled
65791  }, ref) {
65792    function onChangeToggle(event) {
65793      onChange(event.target.checked);
65794    }
65795    const instanceId = (0,external_wp_compose_namespaceObject.useInstanceId)(ToggleControl);
65796    const id = `inspector-toggle-control-$instanceId}`;
65797    const cx = useCx();
65798    const classes = cx('components-toggle-control', className, !__nextHasNoMarginBottom && /*#__PURE__*/emotion_react_browser_esm_css({
65799      marginBottom: space(3)
65800    },  true ? "" : 0,  true ? "" : 0));
65801    if (!__nextHasNoMarginBottom) {
65802      external_wp_deprecated_default()('Bottom margin styles for wp.components.ToggleControl', {
65803        since: '6.7',
65804        version: '7.0',
65805        hint: 'Set the `__nextHasNoMarginBottom` prop to true to start opting into the new styles, which will become the default in a future version.'
65806      });
65807    }
65808    let describedBy, helpLabel;
65809    if (help) {
65810      if (typeof help === 'function') {
65811        // `help` as a function works only for controlled components where
65812        // `checked` is passed down from parent component. Uncontrolled
65813        // component can show only a static help label.
65814        if (checked !== undefined) {
65815          helpLabel = help(checked);
65816        }
65817      } else {
65818        helpLabel = help;
65819      }
65820      if (helpLabel) {
65821        describedBy = id + '__help';
65822      }
65823    }
65824    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(base_control, {
65825      id: id,
65826      help: helpLabel && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", {
65827        className: "components-toggle-control__help",
65828        children: helpLabel
65829      }),
65830      className: classes,
65831      __nextHasNoMarginBottom: true,
65832      children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(h_stack_component, {
65833        justify: "flex-start",
65834        spacing: 2,
65835        children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(form_toggle, {
65836          id: id,
65837          checked: checked,
65838          onChange: onChangeToggle,
65839          "aria-describedby": describedBy,
65840          disabled: disabled,
65841          ref: ref
65842        }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(flex_block_component, {
65843          as: "label",
65844          htmlFor: id,
65845          className: dist_clsx('components-toggle-control__label', {
65846            'is-disabled': disabled
65847          }),
65848          children: label
65849        })]
65850      })
65851    });
65852  }
65853  
65854  /**
65855   * ToggleControl is used to generate a toggle user interface.
65856   *
65857   * ```jsx
65858   * import { ToggleControl } from '@wordpress/components';
65859   * import { useState } from '@wordpress/element';
65860   *
65861   * const MyToggleControl = () => {
65862   *   const [ value, setValue ] = useState( false );
65863   *
65864   *   return (
65865   *     <ToggleControl
65866   *       __nextHasNoMarginBottom
65867   *       label="Fixed Background"
65868   *       checked={ value }
65869   *       onChange={ () => setValue( ( state ) => ! state ) }
65870   *     />
65871   *   );
65872   * };
65873   * ```
65874   */
65875  const ToggleControl = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedToggleControl);
65876  /* harmony default export */ const toggle_control = (ToggleControl);
65877  
65878  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/IIER4YBF.js
65879  "use client";
65880  
65881  
65882  
65883  // src/toolbar/toolbar-context.tsx
65884  var IIER4YBF_ctx = createStoreContext(
65885    [CompositeContextProvider],
65886    [CompositeScopedContextProvider]
65887  );
65888  var useToolbarContext = IIER4YBF_ctx.useContext;
65889  var useToolbarScopedContext = IIER4YBF_ctx.useScopedContext;
65890  var useToolbarProviderContext = IIER4YBF_ctx.useProviderContext;
65891  var ToolbarContextProvider = IIER4YBF_ctx.ContextProvider;
65892  var ToolbarScopedContextProvider = IIER4YBF_ctx.ScopedContextProvider;
65893  
65894  
65895  
65896  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/IE4UOD3X.js
65897  "use client";
65898  
65899  
65900  
65901  
65902  
65903  // src/toolbar/toolbar-item.tsx
65904  var IE4UOD3X_TagName = "button";
65905  var useToolbarItem = createHook(
65906    function useToolbarItem2(_a) {
65907      var _b = _a, { store } = _b, props = __objRest(_b, ["store"]);
65908      const context = useToolbarContext();
65909      store = store || context;
65910      props = useCompositeItem(_3YLGPPWQ_spreadValues({ store }, props));
65911      return props;
65912    }
65913  );
65914  var ToolbarItem = memo2(
65915    forwardRef2(function ToolbarItem2(props) {
65916      const htmlProps = useToolbarItem(props);
65917      return HKOOKEDE_createElement(IE4UOD3X_TagName, htmlProps);
65918    })
65919  );
65920  
65921  
65922  
65923  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/toolbar/toolbar-context/index.js
65924  /**
65925   * External dependencies
65926   */
65927  
65928  /**
65929   * WordPress dependencies
65930   */
65931  
65932  const ToolbarContext = (0,external_wp_element_namespaceObject.createContext)(undefined);
65933  /* harmony default export */ const toolbar_context = (ToolbarContext);
65934  
65935  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/toolbar/toolbar-item/index.js
65936  /**
65937   * External dependencies
65938   */
65939  
65940  /**
65941   * WordPress dependencies
65942   */
65943  
65944  
65945  
65946  /**
65947   * Internal dependencies
65948   */
65949  
65950  
65951  function toolbar_item_ToolbarItem({
65952    children,
65953    as: Component,
65954    ...props
65955  }, ref) {
65956    const accessibleToolbarStore = (0,external_wp_element_namespaceObject.useContext)(toolbar_context);
65957    const isRenderProp = typeof children === 'function';
65958    if (!isRenderProp && !Component) {
65959       true ? external_wp_warning_default()('`ToolbarItem` is a generic headless component. You must pass either a `children` prop as a function or an `as` prop as a component. ' + 'See https://developer.wordpress.org/block-editor/components/toolbar-item/') : 0;
65960      return null;
65961    }
65962    const allProps = {
65963      ...props,
65964      ref,
65965      'data-toolbar-item': true
65966    };
65967    if (!accessibleToolbarStore) {
65968      if (Component) {
65969        return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Component, {
65970          ...allProps,
65971          children: children
65972        });
65973      }
65974      if (!isRenderProp) {
65975        return null;
65976      }
65977      return children(allProps);
65978    }
65979    const render = isRenderProp ? children : Component && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Component, {
65980      children: children
65981    });
65982    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ToolbarItem, {
65983      accessibleWhenDisabled: true,
65984      ...allProps,
65985      store: accessibleToolbarStore,
65986      render: render
65987    });
65988  }
65989  /* harmony default export */ const toolbar_item = ((0,external_wp_element_namespaceObject.forwardRef)(toolbar_item_ToolbarItem));
65990  
65991  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/toolbar/toolbar-button/toolbar-button-container.js
65992  
65993  /**
65994   * Internal dependencies
65995   */
65996  
65997  const ToolbarButtonContainer = ({
65998    children,
65999    className
66000  }) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", {
66001    className: className,
66002    children: children
66003  });
66004  /* harmony default export */ const toolbar_button_container = (ToolbarButtonContainer);
66005  
66006  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/toolbar/toolbar-button/index.js
66007  /**
66008   * External dependencies
66009   */
66010  
66011  /**
66012   * WordPress dependencies
66013   */
66014  
66015  
66016  /**
66017   * Internal dependencies
66018   */
66019  
66020  
66021  
66022  
66023  
66024  function toolbar_button_useDeprecatedProps({
66025    isDisabled,
66026    ...otherProps
66027  }) {
66028    return {
66029      disabled: isDisabled,
66030      ...otherProps
66031    };
66032  }
66033  function UnforwardedToolbarButton(props, ref) {
66034    const {
66035      children,
66036      className,
66037      containerClassName,
66038      extraProps,
66039      isActive,
66040      title,
66041      ...restProps
66042    } = toolbar_button_useDeprecatedProps(props);
66043    const accessibleToolbarState = (0,external_wp_element_namespaceObject.useContext)(toolbar_context);
66044    if (!accessibleToolbarState) {
66045      return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(toolbar_button_container, {
66046        className: containerClassName,
66047        children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, {
66048          ref: ref,
66049          icon: restProps.icon,
66050          label: title,
66051          shortcut: restProps.shortcut,
66052          "data-subscript": restProps.subscript,
66053          onClick: event => {
66054            event.stopPropagation();
66055            // TODO: Possible bug; maybe use onClick instead of restProps.onClick.
66056            if (restProps.onClick) {
66057              restProps.onClick(event);
66058            }
66059          },
66060          className: dist_clsx('components-toolbar__control', className),
66061          isPressed: isActive,
66062          accessibleWhenDisabled: true,
66063          "data-toolbar-item": true,
66064          ...extraProps,
66065          ...restProps,
66066          children: children
66067        })
66068      });
66069    }
66070  
66071    // ToobarItem will pass all props to the render prop child, which will pass
66072    // all props to Button. This means that ToolbarButton has the same API as
66073    // Button.
66074    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(toolbar_item, {
66075      className: dist_clsx('components-toolbar-button', className),
66076      ...extraProps,
66077      ...restProps,
66078      ref: ref,
66079      children: toolbarItemProps => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, {
66080        label: title,
66081        isPressed: isActive,
66082        ...toolbarItemProps,
66083        children: children
66084      })
66085    });
66086  }
66087  
66088  /**
66089   * ToolbarButton can be used to add actions to a toolbar, usually inside a Toolbar
66090   * or ToolbarGroup when used to create general interfaces.
66091   *
66092   * ```jsx
66093   * import { Toolbar, ToolbarButton } from '@wordpress/components';
66094   * import { edit } from '@wordpress/icons';
66095   *
66096   * function MyToolbar() {
66097   *   return (
66098   *        <Toolbar label="Options">
66099   *            <ToolbarButton
66100   *                icon={ edit }
66101   *                label="Edit"
66102   *                onClick={ () => alert( 'Editing' ) }
66103   *            />
66104   *        </Toolbar>
66105   *   );
66106   * }
66107   * ```
66108   */
66109  const ToolbarButton = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedToolbarButton);
66110  /* harmony default export */ const toolbar_button = (ToolbarButton);
66111  
66112  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/toolbar/toolbar-group/toolbar-group-container.js
66113  
66114  /**
66115   * Internal dependencies
66116   */
66117  
66118  const ToolbarGroupContainer = ({
66119    className,
66120    children,
66121    ...props
66122  }) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", {
66123    className: className,
66124    ...props,
66125    children: children
66126  });
66127  /* harmony default export */ const toolbar_group_container = (ToolbarGroupContainer);
66128  
66129  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/toolbar/toolbar-group/toolbar-group-collapsed.js
66130  /**
66131   * WordPress dependencies
66132   */
66133  
66134  
66135  /**
66136   * Internal dependencies
66137   */
66138  
66139  
66140  
66141  
66142  function ToolbarGroupCollapsed({
66143    controls = [],
66144    toggleProps,
66145    ...props
66146  }) {
66147    // It'll contain state if `ToolbarGroup` is being used within
66148    // `<Toolbar label="label" />`
66149    const accessibleToolbarState = (0,external_wp_element_namespaceObject.useContext)(toolbar_context);
66150    const renderDropdownMenu = internalToggleProps => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(dropdown_menu, {
66151      controls: controls,
66152      toggleProps: {
66153        ...internalToggleProps,
66154        'data-toolbar-item': true
66155      },
66156      ...props
66157    });
66158    if (accessibleToolbarState) {
66159      return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(toolbar_item, {
66160        ...toggleProps,
66161        children: renderDropdownMenu
66162      });
66163    }
66164    return renderDropdownMenu(toggleProps);
66165  }
66166  /* harmony default export */ const toolbar_group_collapsed = (ToolbarGroupCollapsed);
66167  
66168  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/toolbar/toolbar-group/index.js
66169  /**
66170   * External dependencies
66171   */
66172  
66173  
66174  /**
66175   * WordPress dependencies
66176   */
66177  
66178  
66179  /**
66180   * Internal dependencies
66181   */
66182  
66183  
66184  
66185  
66186  
66187  
66188  function isNestedArray(arr) {
66189    return Array.isArray(arr) && Array.isArray(arr[0]);
66190  }
66191  
66192  /**
66193   * Renders a collapsible group of controls
66194   *
66195   * The `controls` prop accepts an array of sets. A set is an array of controls.
66196   * Controls have the following shape:
66197   *
66198   * ```
66199   * {
66200   *   icon: string,
66201   *   title: string,
66202   *   subscript: string,
66203   *   onClick: Function,
66204   *   isActive: boolean,
66205   *   isDisabled: boolean
66206   * }
66207   * ```
66208   *
66209   * For convenience it is also possible to pass only an array of controls. It is
66210   * then assumed this is the only set.
66211   *
66212   * Either `controls` or `children` is required, otherwise this components
66213   * renders nothing.
66214   *
66215   * @param props               Component props.
66216   * @param [props.controls]    The controls to render in this toolbar.
66217   * @param [props.children]    Any other things to render inside the toolbar besides the controls.
66218   * @param [props.className]   Class to set on the container div.
66219   * @param [props.isCollapsed] Turns ToolbarGroup into a dropdown menu.
66220   * @param [props.title]       ARIA label for dropdown menu if is collapsed.
66221   */
66222  function ToolbarGroup({
66223    controls = [],
66224    children,
66225    className,
66226    isCollapsed,
66227    title,
66228    ...props
66229  }) {
66230    // It'll contain state if `ToolbarGroup` is being used within
66231    // `<Toolbar label="label" />`
66232    const accessibleToolbarState = (0,external_wp_element_namespaceObject.useContext)(toolbar_context);
66233    if ((!controls || !controls.length) && !children) {
66234      return null;
66235    }
66236    const finalClassName = dist_clsx(
66237    // Unfortunately, there's legacy code referencing to `.components-toolbar`
66238    // So we can't get rid of it
66239    accessibleToolbarState ? 'components-toolbar-group' : 'components-toolbar', className);
66240  
66241    // Normalize controls to nested array of objects (sets of controls)
66242    let controlSets;
66243    if (isNestedArray(controls)) {
66244      controlSets = controls;
66245    } else {
66246      controlSets = [controls];
66247    }
66248    if (isCollapsed) {
66249      return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(toolbar_group_collapsed, {
66250        label: title,
66251        controls: controlSets,
66252        className: finalClassName,
66253        children: children,
66254        ...props
66255      });
66256    }
66257    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(toolbar_group_container, {
66258      className: finalClassName,
66259      ...props,
66260      children: [controlSets?.flatMap((controlSet, indexOfSet) => controlSet.map((control, indexOfControl) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(toolbar_button, {
66261        containerClassName: indexOfSet > 0 && indexOfControl === 0 ? 'has-left-divider' : undefined,
66262        ...control
66263      }, [indexOfSet, indexOfControl].join()))), children]
66264    });
66265  }
66266  /* harmony default export */ const toolbar_group = (ToolbarGroup);
66267  
66268  ;// CONCATENATED MODULE: ./node_modules/@ariakit/core/esm/toolbar/toolbar-store.js
66269  "use client";
66270  
66271  
66272  
66273  
66274  
66275  
66276  
66277  
66278  // src/toolbar/toolbar-store.ts
66279  function createToolbarStore(props = {}) {
66280    var _a;
66281    const syncState = (_a = props.store) == null ? void 0 : _a.getState();
66282    return createCompositeStore(_chunks_3YLGPPWQ_spreadProps(_chunks_3YLGPPWQ_spreadValues({}, props), {
66283      orientation: defaultValue(
66284        props.orientation,
66285        syncState == null ? void 0 : syncState.orientation,
66286        "horizontal"
66287      ),
66288      focusLoop: defaultValue(props.focusLoop, syncState == null ? void 0 : syncState.focusLoop, true)
66289    }));
66290  }
66291  
66292  
66293  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/GO2SPXQX.js
66294  "use client";
66295  
66296  
66297  
66298  // src/toolbar/toolbar-store.ts
66299  
66300  function useToolbarStoreProps(store, update, props) {
66301    return useCompositeStoreProps(store, update, props);
66302  }
66303  function useToolbarStore(props = {}) {
66304    const [store, update] = _2GXGCHW6_useStore(createToolbarStore, props);
66305    return useToolbarStoreProps(store, update, props);
66306  }
66307  
66308  
66309  
66310  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/toolbar/toolbar.js
66311  "use client";
66312  
66313  
66314  
66315  
66316  
66317  
66318  
66319  
66320  
66321  
66322  
66323  
66324  
66325  
66326  
66327  
66328  // src/toolbar/toolbar.tsx
66329  
66330  var toolbar_TagName = "div";
66331  var useToolbar = createHook(
66332    function useToolbar2(_a) {
66333      var _b = _a, {
66334        store: storeProp,
66335        orientation: orientationProp,
66336        virtualFocus,
66337        focusLoop,
66338        rtl
66339      } = _b, props = __objRest(_b, [
66340        "store",
66341        "orientation",
66342        "virtualFocus",
66343        "focusLoop",
66344        "rtl"
66345      ]);
66346      const context = useToolbarProviderContext();
66347      storeProp = storeProp || context;
66348      const store = useToolbarStore({
66349        store: storeProp,
66350        orientation: orientationProp,
66351        virtualFocus,
66352        focusLoop,
66353        rtl
66354      });
66355      const orientation = store.useState(
66356        (state) => state.orientation === "both" ? void 0 : state.orientation
66357      );
66358      props = useWrapElement(
66359        props,
66360        (element) => /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(ToolbarScopedContextProvider, { value: store, children: element }),
66361        [store]
66362      );
66363      props = _3YLGPPWQ_spreadValues({
66364        role: "toolbar",
66365        "aria-orientation": orientation
66366      }, props);
66367      props = useComposite(_3YLGPPWQ_spreadValues({ store }, props));
66368      return props;
66369    }
66370  );
66371  var Toolbar = forwardRef2(function Toolbar2(props) {
66372    const htmlProps = useToolbar(props);
66373    return HKOOKEDE_createElement(toolbar_TagName, htmlProps);
66374  });
66375  
66376  
66377  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/toolbar/toolbar/toolbar-container.js
66378  /**
66379   * External dependencies
66380   */
66381  
66382  /**
66383   * WordPress dependencies
66384   */
66385  
66386  
66387  
66388  /**
66389   * Internal dependencies
66390   */
66391  
66392  
66393  function UnforwardedToolbarContainer({
66394    label,
66395    ...props
66396  }, ref) {
66397    const toolbarStore = useToolbarStore({
66398      focusLoop: true,
66399      rtl: (0,external_wp_i18n_namespaceObject.isRTL)()
66400    });
66401    return (
66402      /*#__PURE__*/
66403      // This will provide state for `ToolbarButton`'s
66404      (0,external_ReactJSXRuntime_namespaceObject.jsx)(toolbar_context.Provider, {
66405        value: toolbarStore,
66406        children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Toolbar, {
66407          ref: ref,
66408          "aria-label": label,
66409          store: toolbarStore,
66410          ...props
66411        })
66412      })
66413    );
66414  }
66415  const ToolbarContainer = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedToolbarContainer);
66416  /* harmony default export */ const toolbar_container = (ToolbarContainer);
66417  
66418  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/toolbar/toolbar/index.js
66419  /**
66420   * External dependencies
66421   */
66422  
66423  /**
66424   * WordPress dependencies
66425   */
66426  
66427  
66428  
66429  /**
66430   * Internal dependencies
66431   */
66432  
66433  
66434  
66435  
66436  function UnforwardedToolbar({
66437    className,
66438    label,
66439    variant,
66440    ...props
66441  }, ref) {
66442    const isVariantDefined = variant !== undefined;
66443    const contextSystemValue = (0,external_wp_element_namespaceObject.useMemo)(() => {
66444      if (isVariantDefined) {
66445        return {};
66446      }
66447      return {
66448        DropdownMenu: {
66449          variant: 'toolbar'
66450        },
66451        Dropdown: {
66452          variant: 'toolbar'
66453        }
66454      };
66455    }, [isVariantDefined]);
66456    if (!label) {
66457      external_wp_deprecated_default()('Using Toolbar without label prop', {
66458        since: '5.6',
66459        alternative: 'ToolbarGroup component',
66460        link: 'https://developer.wordpress.org/block-editor/components/toolbar/'
66461      });
66462      // Extracting title from `props` because `ToolbarGroup` doesn't accept it.
66463      const {
66464        title: _title,
66465        ...restProps
66466      } = props;
66467      return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(toolbar_group, {
66468        isCollapsed: false,
66469        ...restProps,
66470        className: className
66471      });
66472    }
66473    // `ToolbarGroup` already uses components-toolbar for compatibility reasons.
66474    const finalClassName = dist_clsx('components-accessible-toolbar', className, variant && `is-$variant}`);
66475    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ContextSystemProvider, {
66476      value: contextSystemValue,
66477      children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(toolbar_container, {
66478        className: finalClassName,
66479        label: label,
66480        ref: ref,
66481        ...props
66482      })
66483    });
66484  }
66485  
66486  /**
66487   * Renders a toolbar.
66488   *
66489   * To add controls, simply pass `ToolbarButton` components as children.
66490   *
66491   * ```jsx
66492   * import { Toolbar, ToolbarButton } from '@wordpress/components';
66493   * import { formatBold, formatItalic, link } from '@wordpress/icons';
66494   *
66495   * function MyToolbar() {
66496   *   return (
66497   *     <Toolbar label="Options">
66498   *       <ToolbarButton icon={ formatBold } label="Bold" />
66499   *       <ToolbarButton icon={ formatItalic } label="Italic" />
66500   *       <ToolbarButton icon={ link } label="Link" />
66501   *     </Toolbar>
66502   *   );
66503   * }
66504   * ```
66505   */
66506  const toolbar_Toolbar = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedToolbar);
66507  /* harmony default export */ const toolbar = (toolbar_Toolbar);
66508  
66509  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/toolbar/toolbar-dropdown-menu/index.js
66510  /**
66511   * WordPress dependencies
66512   */
66513  
66514  
66515  /**
66516   * External dependencies
66517   */
66518  
66519  /**
66520   * Internal dependencies
66521   */
66522  
66523  
66524  
66525  
66526  function ToolbarDropdownMenu(props, ref) {
66527    const accessibleToolbarState = (0,external_wp_element_namespaceObject.useContext)(toolbar_context);
66528    if (!accessibleToolbarState) {
66529      return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(dropdown_menu, {
66530        ...props
66531      });
66532    }
66533  
66534    // ToolbarItem will pass all props to the render prop child, which will pass
66535    // all props to the toggle of DropdownMenu. This means that ToolbarDropdownMenu
66536    // has the same API as DropdownMenu.
66537    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(toolbar_item, {
66538      ref: ref,
66539      ...props.toggleProps,
66540      children: toolbarItemProps => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(dropdown_menu, {
66541        ...props,
66542        popoverProps: {
66543          ...props.popoverProps
66544        },
66545        toggleProps: toolbarItemProps
66546      })
66547    });
66548  }
66549  /* harmony default export */ const toolbar_dropdown_menu = ((0,external_wp_element_namespaceObject.forwardRef)(ToolbarDropdownMenu));
66550  
66551  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/tools-panel/styles.js
66552  
66553  function tools_panel_styles_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)."; }
66554  /**
66555   * External dependencies
66556   */
66557  
66558  
66559  
66560  /**
66561   * Internal dependencies
66562   */
66563  
66564  
66565  
66566  
66567  const toolsPanelGrid = {
66568    columns: columns => /*#__PURE__*/emotion_react_browser_esm_css("grid-template-columns:", `repeat( $columns}, minmax(0, 1fr) )`, ";" + ( true ? "" : 0),  true ? "" : 0),
66569    spacing: /*#__PURE__*/emotion_react_browser_esm_css("column-gap:", space(4), ";row-gap:", space(4), ";" + ( true ? "" : 0),  true ? "" : 0),
66570    item: {
66571      fullWidth:  true ? {
66572        name: "18iuzk9",
66573        styles: "grid-column:1/-1"
66574      } : 0
66575    }
66576  };
66577  const ToolsPanel = columns => /*#__PURE__*/emotion_react_browser_esm_css(toolsPanelGrid.columns(columns), " ", toolsPanelGrid.spacing, " border-top:", config_values.borderWidth, " solid ", COLORS.gray[300], ";margin-top:-1px;padding:", space(4), ";" + ( true ? "" : 0),  true ? "" : 0);
66578  
66579  /**
66580   * Items injected into a ToolsPanel via a virtual bubbling slot will require
66581   * an inner dom element to be injected. The following rule allows for the
66582   * CSS grid display to be re-established.
66583   */
66584  
66585  const ToolsPanelWithInnerWrapper = columns => {
66586    return /*#__PURE__*/emotion_react_browser_esm_css(">div:not( :first-of-type ){display:grid;", toolsPanelGrid.columns(columns), " ", toolsPanelGrid.spacing, " ", toolsPanelGrid.item.fullWidth, ";}" + ( true ? "" : 0),  true ? "" : 0);
66587  };
66588  const ToolsPanelHiddenInnerWrapper =  true ? {
66589    name: "huufmu",
66590    styles: ">div:not( :first-of-type ){display:none;}"
66591  } : 0;
66592  const ToolsPanelHeader = /*#__PURE__*/emotion_react_browser_esm_css(toolsPanelGrid.item.fullWidth, " gap:", space(2), ";.components-dropdown-menu{margin:", space(-1), " 0;line-height:0;}&&&& .components-dropdown-menu__toggle{padding:0;min-width:", space(6), ";}" + ( true ? "" : 0),  true ? "" : 0);
66593  const ToolsPanelHeading =  true ? {
66594    name: "1pmxm02",
66595    styles: "font-size:inherit;font-weight:500;line-height:normal;&&{margin:0;}"
66596  } : 0;
66597  const ToolsPanelItem = /*#__PURE__*/emotion_react_browser_esm_css(toolsPanelGrid.item.fullWidth, "&>div,&>fieldset{padding-bottom:0;margin-bottom:0;max-width:100%;}&& ", Wrapper, "{margin-bottom:0;", StyledField, ":last-child{margin-bottom:0;}}", StyledHelp, "{margin-bottom:0;}&& ", LabelWrapper, "{label{line-height:1.4em;}}" + ( true ? "" : 0),  true ? "" : 0);
66598  const ToolsPanelItemPlaceholder =  true ? {
66599    name: "eivff4",
66600    styles: "display:none"
66601  } : 0;
66602  const styles_DropdownMenu =  true ? {
66603    name: "16gsvie",
66604    styles: "min-width:200px"
66605  } : 0;
66606  const ResetLabel = /*#__PURE__*/emotion_styled_base_browser_esm("span",  true ? {
66607    target: "ews648u0"
66608  } : 0)("color:", COLORS.theme.accentDarker10, ";font-size:11px;font-weight:500;line-height:1.4;", rtl({
66609    marginLeft: space(3)
66610  }), " text-transform:uppercase;" + ( true ? "" : 0));
66611  const DefaultControlsItem = /*#__PURE__*/emotion_react_browser_esm_css("color:", COLORS.gray[900], ";&&[aria-disabled='true']{color:", COLORS.gray[700], ";opacity:1;&:hover{color:", COLORS.gray[700], ";}", ResetLabel, "{opacity:0.3;}}" + ( true ? "" : 0),  true ? "" : 0);
66612  
66613  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/tools-panel/context.js
66614  /**
66615   * WordPress dependencies
66616   */
66617  
66618  
66619  /**
66620   * Internal dependencies
66621   */
66622  
66623  const tools_panel_context_noop = () => undefined;
66624  const ToolsPanelContext = (0,external_wp_element_namespaceObject.createContext)({
66625    menuItems: {
66626      default: {},
66627      optional: {}
66628    },
66629    hasMenuItems: false,
66630    isResetting: false,
66631    shouldRenderPlaceholderItems: false,
66632    registerPanelItem: tools_panel_context_noop,
66633    deregisterPanelItem: tools_panel_context_noop,
66634    flagItemCustomization: tools_panel_context_noop,
66635    registerResetAllFilter: tools_panel_context_noop,
66636    deregisterResetAllFilter: tools_panel_context_noop,
66637    areAllOptionalControlsHidden: true
66638  });
66639  const useToolsPanelContext = () => (0,external_wp_element_namespaceObject.useContext)(ToolsPanelContext);
66640  
66641  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/tools-panel/tools-panel-header/hook.js
66642  /**
66643   * WordPress dependencies
66644   */
66645  
66646  
66647  /**
66648   * Internal dependencies
66649   */
66650  
66651  
66652  
66653  
66654  function useToolsPanelHeader(props) {
66655    const {
66656      className,
66657      headingLevel = 2,
66658      ...otherProps
66659    } = useContextSystem(props, 'ToolsPanelHeader');
66660    const cx = useCx();
66661    const classes = (0,external_wp_element_namespaceObject.useMemo)(() => {
66662      return cx(ToolsPanelHeader, className);
66663    }, [className, cx]);
66664    const dropdownMenuClassName = (0,external_wp_element_namespaceObject.useMemo)(() => {
66665      return cx(styles_DropdownMenu);
66666    }, [cx]);
66667    const headingClassName = (0,external_wp_element_namespaceObject.useMemo)(() => {
66668      return cx(ToolsPanelHeading);
66669    }, [cx]);
66670    const defaultControlsItemClassName = (0,external_wp_element_namespaceObject.useMemo)(() => {
66671      return cx(DefaultControlsItem);
66672    }, [cx]);
66673    const {
66674      menuItems,
66675      hasMenuItems,
66676      areAllOptionalControlsHidden
66677    } = useToolsPanelContext();
66678    return {
66679      ...otherProps,
66680      areAllOptionalControlsHidden,
66681      defaultControlsItemClassName,
66682      dropdownMenuClassName,
66683      hasMenuItems,
66684      headingClassName,
66685      headingLevel,
66686      menuItems,
66687      className: classes
66688    };
66689  }
66690  
66691  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/tools-panel/tools-panel-header/component.js
66692  /**
66693   * External dependencies
66694   */
66695  
66696  /**
66697   * WordPress dependencies
66698   */
66699  
66700  
66701  
66702  
66703  /**
66704   * Internal dependencies
66705   */
66706  
66707  
66708  
66709  
66710  
66711  
66712  
66713  
66714  
66715  
66716  
66717  const DefaultControlsGroup = ({
66718    itemClassName,
66719    items,
66720    toggleItem
66721  }) => {
66722    if (!items.length) {
66723      return null;
66724    }
66725    const resetSuffix = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ResetLabel, {
66726      "aria-hidden": true,
66727      children: (0,external_wp_i18n_namespaceObject.__)('Reset')
66728    });
66729    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_ReactJSXRuntime_namespaceObject.Fragment, {
66730      children: items.map(([label, hasValue]) => {
66731        if (hasValue) {
66732          return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(menu_item, {
66733            className: itemClassName,
66734            role: "menuitem",
66735            label: (0,external_wp_i18n_namespaceObject.sprintf)(
66736            // translators: %s: The name of the control being reset e.g. "Padding".
66737            (0,external_wp_i18n_namespaceObject.__)('Reset %s'), label),
66738            onClick: () => {
66739              toggleItem(label);
66740              (0,external_wp_a11y_namespaceObject.speak)((0,external_wp_i18n_namespaceObject.sprintf)(
66741              // translators: %s: The name of the control being reset e.g. "Padding".
66742              (0,external_wp_i18n_namespaceObject.__)('%s reset to default'), label), 'assertive');
66743            },
66744            suffix: resetSuffix,
66745            children: label
66746          }, label);
66747        }
66748        return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(menu_item, {
66749          icon: library_check,
66750          className: itemClassName,
66751          role: "menuitemcheckbox",
66752          isSelected: true,
66753          "aria-disabled": true,
66754          children: label
66755        }, label);
66756      })
66757    });
66758  };
66759  const OptionalControlsGroup = ({
66760    items,
66761    toggleItem
66762  }) => {
66763    if (!items.length) {
66764      return null;
66765    }
66766    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_ReactJSXRuntime_namespaceObject.Fragment, {
66767      children: items.map(([label, isSelected]) => {
66768        const itemLabel = isSelected ? (0,external_wp_i18n_namespaceObject.sprintf)(
66769        // translators: %s: The name of the control being hidden and reset e.g. "Padding".
66770        (0,external_wp_i18n_namespaceObject.__)('Hide and reset %s'), label) : (0,external_wp_i18n_namespaceObject.sprintf)(
66771        // translators: %s: The name of the control to display e.g. "Padding".
66772        (0,external_wp_i18n_namespaceObject._x)('Show %s', 'input control'), label);
66773        return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(menu_item, {
66774          icon: isSelected ? library_check : null,
66775          isSelected: isSelected,
66776          label: itemLabel,
66777          onClick: () => {
66778            if (isSelected) {
66779              (0,external_wp_a11y_namespaceObject.speak)((0,external_wp_i18n_namespaceObject.sprintf)(
66780              // translators: %s: The name of the control being reset e.g. "Padding".
66781              (0,external_wp_i18n_namespaceObject.__)('%s hidden and reset to default'), label), 'assertive');
66782            } else {
66783              (0,external_wp_a11y_namespaceObject.speak)((0,external_wp_i18n_namespaceObject.sprintf)(
66784              // translators: %s: The name of the control being reset e.g. "Padding".
66785              (0,external_wp_i18n_namespaceObject.__)('%s is now visible'), label), 'assertive');
66786            }
66787            toggleItem(label);
66788          },
66789          role: "menuitemcheckbox",
66790          children: label
66791        }, label);
66792      })
66793    });
66794  };
66795  const component_ToolsPanelHeader = (props, forwardedRef) => {
66796    const {
66797      areAllOptionalControlsHidden,
66798      defaultControlsItemClassName,
66799      dropdownMenuClassName,
66800      hasMenuItems,
66801      headingClassName,
66802      headingLevel = 2,
66803      label: labelText,
66804      menuItems,
66805      resetAll,
66806      toggleItem,
66807      dropdownMenuProps,
66808      ...headerProps
66809    } = useToolsPanelHeader(props);
66810    if (!labelText) {
66811      return null;
66812    }
66813    const defaultItems = Object.entries(menuItems?.default || {});
66814    const optionalItems = Object.entries(menuItems?.optional || {});
66815    const dropDownMenuIcon = areAllOptionalControlsHidden ? library_plus : more_vertical;
66816    const dropDownMenuLabelText = (0,external_wp_i18n_namespaceObject.sprintf)(
66817    // translators: %s: The name of the tool e.g. "Color" or "Typography".
66818    (0,external_wp_i18n_namespaceObject._x)('%s options', 'Button label to reveal tool panel options'), labelText);
66819    const dropdownMenuDescriptionText = areAllOptionalControlsHidden ? (0,external_wp_i18n_namespaceObject.__)('All options are currently hidden') : undefined;
66820    const canResetAll = [...defaultItems, ...optionalItems].some(([, isSelected]) => isSelected);
66821    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(h_stack_component, {
66822      ...headerProps,
66823      ref: forwardedRef,
66824      children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(heading_component, {
66825        level: headingLevel,
66826        className: headingClassName,
66827        children: labelText
66828      }), hasMenuItems && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(dropdown_menu, {
66829        ...dropdownMenuProps,
66830        icon: dropDownMenuIcon,
66831        label: dropDownMenuLabelText,
66832        menuProps: {
66833          className: dropdownMenuClassName
66834        },
66835        toggleProps: {
66836          size: 'small',
66837          description: dropdownMenuDescriptionText
66838        },
66839        children: () => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, {
66840          children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(menu_group, {
66841            label: labelText,
66842            children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(DefaultControlsGroup, {
66843              items: defaultItems,
66844              toggleItem: toggleItem,
66845              itemClassName: defaultControlsItemClassName
66846            }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(OptionalControlsGroup, {
66847              items: optionalItems,
66848              toggleItem: toggleItem
66849            })]
66850          }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(menu_group, {
66851            children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(menu_item, {
66852              "aria-disabled": !canResetAll
66853              // @ts-expect-error - TODO: If this "tertiary" style is something we really want to allow on MenuItem,
66854              // we should rename it and explicitly allow it as an official API. All the other Button variants
66855              // don't make sense in a MenuItem context, and should be disallowed.
66856              ,
66857              variant: "tertiary",
66858              onClick: () => {
66859                if (canResetAll) {
66860                  resetAll();
66861                  (0,external_wp_a11y_namespaceObject.speak)((0,external_wp_i18n_namespaceObject.__)('All options reset'), 'assertive');
66862                }
66863              },
66864              children: (0,external_wp_i18n_namespaceObject.__)('Reset all')
66865            })
66866          })]
66867        })
66868      })]
66869    });
66870  };
66871  const ConnectedToolsPanelHeader = contextConnect(component_ToolsPanelHeader, 'ToolsPanelHeader');
66872  /* harmony default export */ const tools_panel_header_component = (ConnectedToolsPanelHeader);
66873  
66874  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/tools-panel/tools-panel/hook.js
66875  /**
66876   * WordPress dependencies
66877   */
66878  
66879  
66880  /**
66881   * Internal dependencies
66882   */
66883  
66884  
66885  
66886  const DEFAULT_COLUMNS = 2;
66887  function emptyMenuItems() {
66888    return {
66889      default: {},
66890      optional: {}
66891    };
66892  }
66893  function emptyState() {
66894    return {
66895      panelItems: [],
66896      menuItemOrder: [],
66897      menuItems: emptyMenuItems()
66898    };
66899  }
66900  const generateMenuItems = ({
66901    panelItems,
66902    shouldReset,
66903    currentMenuItems,
66904    menuItemOrder
66905  }) => {
66906    const newMenuItems = emptyMenuItems();
66907    const menuItems = emptyMenuItems();
66908    panelItems.forEach(({
66909      hasValue,
66910      isShownByDefault,
66911      label
66912    }) => {
66913      const group = isShownByDefault ? 'default' : 'optional';
66914  
66915      // If a menu item for this label has already been flagged as customized
66916      // (for default controls), or toggled on (for optional controls), do not
66917      // overwrite its value as those controls would lose that state.
66918      const existingItemValue = currentMenuItems?.[group]?.[label];
66919      const value = existingItemValue ? existingItemValue : hasValue();
66920      newMenuItems[group][label] = shouldReset ? false : value;
66921    });
66922  
66923    // Loop the known, previously registered items first to maintain menu order.
66924    menuItemOrder.forEach(key => {
66925      if (newMenuItems.default.hasOwnProperty(key)) {
66926        menuItems.default[key] = newMenuItems.default[key];
66927      }
66928      if (newMenuItems.optional.hasOwnProperty(key)) {
66929        menuItems.optional[key] = newMenuItems.optional[key];
66930      }
66931    });
66932  
66933    // Loop newMenuItems object adding any that aren't in the known items order.
66934    Object.keys(newMenuItems.default).forEach(key => {
66935      if (!menuItems.default.hasOwnProperty(key)) {
66936        menuItems.default[key] = newMenuItems.default[key];
66937      }
66938    });
66939    Object.keys(newMenuItems.optional).forEach(key => {
66940      if (!menuItems.optional.hasOwnProperty(key)) {
66941        menuItems.optional[key] = newMenuItems.optional[key];
66942      }
66943    });
66944    return menuItems;
66945  };
66946  function panelItemsReducer(panelItems, action) {
66947    switch (action.type) {
66948      case 'REGISTER_PANEL':
66949        {
66950          const newItems = [...panelItems];
66951          // If an item with this label has already been registered, remove it
66952          // first. This can happen when an item is moved between the default
66953          // and optional groups.
66954          const existingIndex = newItems.findIndex(oldItem => oldItem.label === action.item.label);
66955          if (existingIndex !== -1) {
66956            newItems.splice(existingIndex, 1);
66957          }
66958          newItems.push(action.item);
66959          return newItems;
66960        }
66961      case 'UNREGISTER_PANEL':
66962        {
66963          const index = panelItems.findIndex(item => item.label === action.label);
66964          if (index !== -1) {
66965            const newItems = [...panelItems];
66966            newItems.splice(index, 1);
66967            return newItems;
66968          }
66969          return panelItems;
66970        }
66971      default:
66972        return panelItems;
66973    }
66974  }
66975  function menuItemOrderReducer(menuItemOrder, action) {
66976    switch (action.type) {
66977      case 'REGISTER_PANEL':
66978        {
66979          // Track the initial order of item registration. This is used for
66980          // maintaining menu item order later.
66981          if (menuItemOrder.includes(action.item.label)) {
66982            return menuItemOrder;
66983          }
66984          return [...menuItemOrder, action.item.label];
66985        }
66986      default:
66987        return menuItemOrder;
66988    }
66989  }
66990  function menuItemsReducer(state, action) {
66991    switch (action.type) {
66992      case 'REGISTER_PANEL':
66993      case 'UNREGISTER_PANEL':
66994        // generate new menu items from original `menuItems` and updated `panelItems` and `menuItemOrder`
66995        return generateMenuItems({
66996          currentMenuItems: state.menuItems,
66997          panelItems: state.panelItems,
66998          menuItemOrder: state.menuItemOrder,
66999          shouldReset: false
67000        });
67001      case 'RESET_ALL':
67002        return generateMenuItems({
67003          panelItems: state.panelItems,
67004          menuItemOrder: state.menuItemOrder,
67005          shouldReset: true
67006        });
67007      case 'UPDATE_VALUE':
67008        {
67009          const oldValue = state.menuItems[action.group][action.label];
67010          if (action.value === oldValue) {
67011            return state.menuItems;
67012          }
67013          return {
67014            ...state.menuItems,
67015            [action.group]: {
67016              ...state.menuItems[action.group],
67017              [action.label]: action.value
67018            }
67019          };
67020        }
67021      case 'TOGGLE_VALUE':
67022        {
67023          const currentItem = state.panelItems.find(item => item.label === action.label);
67024          if (!currentItem) {
67025            return state.menuItems;
67026          }
67027          const menuGroup = currentItem.isShownByDefault ? 'default' : 'optional';
67028          const newMenuItems = {
67029            ...state.menuItems,
67030            [menuGroup]: {
67031              ...state.menuItems[menuGroup],
67032              [action.label]: !state.menuItems[menuGroup][action.label]
67033            }
67034          };
67035          return newMenuItems;
67036        }
67037      default:
67038        return state.menuItems;
67039    }
67040  }
67041  function panelReducer(state, action) {
67042    const panelItems = panelItemsReducer(state.panelItems, action);
67043    const menuItemOrder = menuItemOrderReducer(state.menuItemOrder, action);
67044    // `menuItemsReducer` is a bit unusual because it generates new state from original `menuItems`
67045    // and the updated `panelItems` and `menuItemOrder`.
67046    const menuItems = menuItemsReducer({
67047      panelItems,
67048      menuItemOrder,
67049      menuItems: state.menuItems
67050    }, action);
67051    return {
67052      panelItems,
67053      menuItemOrder,
67054      menuItems
67055    };
67056  }
67057  function resetAllFiltersReducer(filters, action) {
67058    switch (action.type) {
67059      case 'REGISTER':
67060        return [...filters, action.filter];
67061      case 'UNREGISTER':
67062        return filters.filter(f => f !== action.filter);
67063      default:
67064        return filters;
67065    }
67066  }
67067  const isMenuItemTypeEmpty = obj => Object.keys(obj).length === 0;
67068  function useToolsPanel(props) {
67069    const {
67070      className,
67071      headingLevel = 2,
67072      resetAll,
67073      panelId,
67074      hasInnerWrapper = false,
67075      shouldRenderPlaceholderItems = false,
67076      __experimentalFirstVisibleItemClass,
67077      __experimentalLastVisibleItemClass,
67078      ...otherProps
67079    } = useContextSystem(props, 'ToolsPanel');
67080    const isResettingRef = (0,external_wp_element_namespaceObject.useRef)(false);
67081    const wasResetting = isResettingRef.current;
67082  
67083    // `isResettingRef` is cleared via this hook to effectively batch together
67084    // the resetAll task. Without this, the flag is cleared after the first
67085    // control updates and forces a rerender with subsequent controls then
67086    // believing they need to reset, unfortunately using stale data.
67087    (0,external_wp_element_namespaceObject.useEffect)(() => {
67088      if (wasResetting) {
67089        isResettingRef.current = false;
67090      }
67091    }, [wasResetting]);
67092  
67093    // Allow panel items to register themselves.
67094    const [{
67095      panelItems,
67096      menuItems
67097    }, panelDispatch] = (0,external_wp_element_namespaceObject.useReducer)(panelReducer, undefined, emptyState);
67098    const [resetAllFilters, dispatchResetAllFilters] = (0,external_wp_element_namespaceObject.useReducer)(resetAllFiltersReducer, []);
67099    const registerPanelItem = (0,external_wp_element_namespaceObject.useCallback)(item => {
67100      // Add item to panel items.
67101      panelDispatch({
67102        type: 'REGISTER_PANEL',
67103        item
67104      });
67105    }, []);
67106  
67107    // Panels need to deregister on unmount to avoid orphans in menu state.
67108    // This is an issue when panel items are being injected via SlotFills.
67109    const deregisterPanelItem = (0,external_wp_element_namespaceObject.useCallback)(label => {
67110      // When switching selections between components injecting matching
67111      // controls, e.g. both panels have a "padding" control, the
67112      // deregistration of the first panel doesn't occur until after the
67113      // registration of the next.
67114      panelDispatch({
67115        type: 'UNREGISTER_PANEL',
67116        label
67117      });
67118    }, []);
67119    const registerResetAllFilter = (0,external_wp_element_namespaceObject.useCallback)(filter => {
67120      dispatchResetAllFilters({
67121        type: 'REGISTER',
67122        filter
67123      });
67124    }, []);
67125    const deregisterResetAllFilter = (0,external_wp_element_namespaceObject.useCallback)(filter => {
67126      dispatchResetAllFilters({
67127        type: 'UNREGISTER',
67128        filter
67129      });
67130    }, []);
67131  
67132    // Updates the status of the panel’s menu items. For default items the
67133    // value represents whether it differs from the default and for optional
67134    // items whether the item is shown.
67135    const flagItemCustomization = (0,external_wp_element_namespaceObject.useCallback)((value, label, group = 'default') => {
67136      panelDispatch({
67137        type: 'UPDATE_VALUE',
67138        group,
67139        label,
67140        value
67141      });
67142    }, []);
67143  
67144    // Whether all optional menu items are hidden or not must be tracked
67145    // in order to later determine if the panel display is empty and handle
67146    // conditional display of a plus icon to indicate the presence of further
67147    // menu items.
67148    const areAllOptionalControlsHidden = (0,external_wp_element_namespaceObject.useMemo)(() => {
67149      return isMenuItemTypeEmpty(menuItems.default) && !isMenuItemTypeEmpty(menuItems.optional) && Object.values(menuItems.optional).every(isSelected => !isSelected);
67150    }, [menuItems]);
67151    const cx = useCx();
67152    const classes = (0,external_wp_element_namespaceObject.useMemo)(() => {
67153      const wrapperStyle = hasInnerWrapper && ToolsPanelWithInnerWrapper(DEFAULT_COLUMNS);
67154      const emptyStyle = areAllOptionalControlsHidden && ToolsPanelHiddenInnerWrapper;
67155      return cx(ToolsPanel(DEFAULT_COLUMNS), wrapperStyle, emptyStyle, className);
67156    }, [areAllOptionalControlsHidden, className, cx, hasInnerWrapper]);
67157  
67158    // Toggle the checked state of a menu item which is then used to determine
67159    // display of the item within the panel.
67160    const toggleItem = (0,external_wp_element_namespaceObject.useCallback)(label => {
67161      panelDispatch({
67162        type: 'TOGGLE_VALUE',
67163        label
67164      });
67165    }, []);
67166  
67167    // Resets display of children and executes resetAll callback if available.
67168    const resetAllItems = (0,external_wp_element_namespaceObject.useCallback)(() => {
67169      if (typeof resetAll === 'function') {
67170        isResettingRef.current = true;
67171        resetAll(resetAllFilters);
67172      }
67173  
67174      // Turn off display of all non-default items.
67175      panelDispatch({
67176        type: 'RESET_ALL'
67177      });
67178    }, [resetAllFilters, resetAll]);
67179  
67180    // Assist ItemGroup styling when there are potentially hidden placeholder
67181    // items by identifying first & last items that are toggled on for display.
67182    const getFirstVisibleItemLabel = items => {
67183      const optionalItems = menuItems.optional || {};
67184      const firstItem = items.find(item => item.isShownByDefault || optionalItems[item.label]);
67185      return firstItem?.label;
67186    };
67187    const firstDisplayedItem = getFirstVisibleItemLabel(panelItems);
67188    const lastDisplayedItem = getFirstVisibleItemLabel([...panelItems].reverse());
67189    const hasMenuItems = panelItems.length > 0;
67190    const panelContext = (0,external_wp_element_namespaceObject.useMemo)(() => ({
67191      areAllOptionalControlsHidden,
67192      deregisterPanelItem,
67193      deregisterResetAllFilter,
67194      firstDisplayedItem,
67195      flagItemCustomization,
67196      hasMenuItems,
67197      isResetting: isResettingRef.current,
67198      lastDisplayedItem,
67199      menuItems,
67200      panelId,
67201      registerPanelItem,
67202      registerResetAllFilter,
67203      shouldRenderPlaceholderItems,
67204      __experimentalFirstVisibleItemClass,
67205      __experimentalLastVisibleItemClass
67206    }), [areAllOptionalControlsHidden, deregisterPanelItem, deregisterResetAllFilter, firstDisplayedItem, flagItemCustomization, lastDisplayedItem, menuItems, panelId, hasMenuItems, registerResetAllFilter, registerPanelItem, shouldRenderPlaceholderItems, __experimentalFirstVisibleItemClass, __experimentalLastVisibleItemClass]);
67207    return {
67208      ...otherProps,
67209      headingLevel,
67210      panelContext,
67211      resetAllItems,
67212      toggleItem,
67213      className: classes
67214    };
67215  }
67216  
67217  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/tools-panel/tools-panel/component.js
67218  /**
67219   * External dependencies
67220   */
67221  
67222  /**
67223   * Internal dependencies
67224   */
67225  
67226  
67227  
67228  
67229  
67230  
67231  
67232  const UnconnectedToolsPanel = (props, forwardedRef) => {
67233    const {
67234      children,
67235      label,
67236      panelContext,
67237      resetAllItems,
67238      toggleItem,
67239      headingLevel,
67240      dropdownMenuProps,
67241      ...toolsPanelProps
67242    } = useToolsPanel(props);
67243    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(grid_component, {
67244      ...toolsPanelProps,
67245      columns: 2,
67246      ref: forwardedRef,
67247      children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(ToolsPanelContext.Provider, {
67248        value: panelContext,
67249        children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(tools_panel_header_component, {
67250          label: label,
67251          resetAll: resetAllItems,
67252          toggleItem: toggleItem,
67253          headingLevel: headingLevel,
67254          dropdownMenuProps: dropdownMenuProps
67255        }), children]
67256      })
67257    });
67258  };
67259  
67260  /**
67261   * The `ToolsPanel` is a container component that displays its children preceded
67262   * by a header. The header includes a dropdown menu which is automatically
67263   * generated from the panel's inner `ToolsPanelItems`.
67264   *
67265   * ```jsx
67266   * import { __ } from '@wordpress/i18n';
67267   * import {
67268   *   __experimentalToolsPanel as ToolsPanel,
67269   *   __experimentalToolsPanelItem as ToolsPanelItem,
67270   *   __experimentalUnitControl as UnitControl
67271   * } from '@wordpress/components';
67272   *
67273   * function Example() {
67274   *   const [ height, setHeight ] = useState();
67275   *   const [ width, setWidth ] = useState();
67276   *
67277   *   const resetAll = () => {
67278   *     setHeight();
67279   *     setWidth();
67280   *   }
67281   *
67282   *   return (
67283   *     <ToolsPanel label={ __( 'Dimensions' ) } resetAll={ resetAll }>
67284   *       <ToolsPanelItem
67285   *         hasValue={ () => !! height }
67286   *         label={ __( 'Height' ) }
67287   *         onDeselect={ () => setHeight() }
67288   *       >
67289   *         <UnitControl
67290   *           label={ __( 'Height' ) }
67291   *           onChange={ setHeight }
67292   *           value={ height }
67293   *         />
67294   *       </ToolsPanelItem>
67295   *       <ToolsPanelItem
67296   *         hasValue={ () => !! width }
67297   *         label={ __( 'Width' ) }
67298   *         onDeselect={ () => setWidth() }
67299   *       >
67300   *         <UnitControl
67301   *           label={ __( 'Width' ) }
67302   *           onChange={ setWidth }
67303   *           value={ width }
67304   *         />
67305   *       </ToolsPanelItem>
67306   *     </ToolsPanel>
67307   *   );
67308   * }
67309   * ```
67310   */
67311  const component_ToolsPanel = contextConnect(UnconnectedToolsPanel, 'ToolsPanel');
67312  /* harmony default export */ const tools_panel_component = (component_ToolsPanel);
67313  
67314  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/tools-panel/tools-panel-item/hook.js
67315  /**
67316   * WordPress dependencies
67317   */
67318  
67319  
67320  
67321  /**
67322   * Internal dependencies
67323   */
67324  
67325  
67326  
67327  
67328  const hook_noop = () => {};
67329  function useToolsPanelItem(props) {
67330    const {
67331      className,
67332      hasValue,
67333      isShownByDefault = false,
67334      label,
67335      panelId,
67336      resetAllFilter = hook_noop,
67337      onDeselect,
67338      onSelect,
67339      ...otherProps
67340    } = useContextSystem(props, 'ToolsPanelItem');
67341    const {
67342      panelId: currentPanelId,
67343      menuItems,
67344      registerResetAllFilter,
67345      deregisterResetAllFilter,
67346      registerPanelItem,
67347      deregisterPanelItem,
67348      flagItemCustomization,
67349      isResetting,
67350      shouldRenderPlaceholderItems: shouldRenderPlaceholder,
67351      firstDisplayedItem,
67352      lastDisplayedItem,
67353      __experimentalFirstVisibleItemClass,
67354      __experimentalLastVisibleItemClass
67355    } = useToolsPanelContext();
67356  
67357    // hasValue is a new function on every render, so do not add it as a
67358    // dependency to the useCallback hook! If needed, we should use a ref.
67359    // eslint-disable-next-line react-hooks/exhaustive-deps
67360    const hasValueCallback = (0,external_wp_element_namespaceObject.useCallback)(hasValue, [panelId]);
67361    // resetAllFilter is a new function on every render, so do not add it as a
67362    // dependency to the useCallback hook! If needed, we should use a ref.
67363    // eslint-disable-next-line react-hooks/exhaustive-deps
67364    const resetAllFilterCallback = (0,external_wp_element_namespaceObject.useCallback)(resetAllFilter, [panelId]);
67365    const previousPanelId = (0,external_wp_compose_namespaceObject.usePrevious)(currentPanelId);
67366    const hasMatchingPanel = currentPanelId === panelId || currentPanelId === null;
67367  
67368    // Registering the panel item allows the panel to include it in its
67369    // automatically generated menu and determine its initial checked status.
67370    //
67371    // This is performed in a layout effect to ensure that the panel item
67372    // is registered before it is rendered preventing a rendering glitch.
67373    // See: https://github.com/WordPress/gutenberg/issues/56470
67374    (0,external_wp_element_namespaceObject.useLayoutEffect)(() => {
67375      if (hasMatchingPanel && previousPanelId !== null) {
67376        registerPanelItem({
67377          hasValue: hasValueCallback,
67378          isShownByDefault,
67379          label,
67380          panelId
67381        });
67382      }
67383      return () => {
67384        if (previousPanelId === null && !!currentPanelId || currentPanelId === panelId) {
67385          deregisterPanelItem(label);
67386        }
67387      };
67388    }, [currentPanelId, hasMatchingPanel, isShownByDefault, label, hasValueCallback, panelId, previousPanelId, registerPanelItem, deregisterPanelItem]);
67389    (0,external_wp_element_namespaceObject.useEffect)(() => {
67390      if (hasMatchingPanel) {
67391        registerResetAllFilter(resetAllFilterCallback);
67392      }
67393      return () => {
67394        if (hasMatchingPanel) {
67395          deregisterResetAllFilter(resetAllFilterCallback);
67396        }
67397      };
67398    }, [registerResetAllFilter, deregisterResetAllFilter, resetAllFilterCallback, hasMatchingPanel]);
67399  
67400    // Note: `label` is used as a key when building menu item state in
67401    // `ToolsPanel`.
67402    const menuGroup = isShownByDefault ? 'default' : 'optional';
67403    const isMenuItemChecked = menuItems?.[menuGroup]?.[label];
67404    const wasMenuItemChecked = (0,external_wp_compose_namespaceObject.usePrevious)(isMenuItemChecked);
67405    const isRegistered = menuItems?.[menuGroup]?.[label] !== undefined;
67406    const isValueSet = hasValue();
67407    // Notify the panel when an item's value has changed except for optional
67408    // items without value because the item should not cause itself to hide.
67409    (0,external_wp_element_namespaceObject.useEffect)(() => {
67410      if (!isShownByDefault && !isValueSet) {
67411        return;
67412      }
67413      flagItemCustomization(isValueSet, label, menuGroup);
67414    }, [isValueSet, menuGroup, label, flagItemCustomization, isShownByDefault]);
67415  
67416    // Determine if the panel item's corresponding menu is being toggled and
67417    // trigger appropriate callback if it is.
67418    (0,external_wp_element_namespaceObject.useEffect)(() => {
67419      // We check whether this item is currently registered as items rendered
67420      // via fills can persist through the parent panel being remounted.
67421      // See: https://github.com/WordPress/gutenberg/pull/45673
67422      if (!isRegistered || isResetting || !hasMatchingPanel) {
67423        return;
67424      }
67425      if (isMenuItemChecked && !isValueSet && !wasMenuItemChecked) {
67426        onSelect?.();
67427      }
67428      if (!isMenuItemChecked && isValueSet && wasMenuItemChecked) {
67429        onDeselect?.();
67430      }
67431    }, [hasMatchingPanel, isMenuItemChecked, isRegistered, isResetting, isValueSet, wasMenuItemChecked, onSelect, onDeselect]);
67432  
67433    // The item is shown if it is a default control regardless of whether it
67434    // has a value. Optional items are shown when they are checked or have
67435    // a value.
67436    const isShown = isShownByDefault ? menuItems?.[menuGroup]?.[label] !== undefined : isMenuItemChecked;
67437    const cx = useCx();
67438    const classes = (0,external_wp_element_namespaceObject.useMemo)(() => {
67439      const shouldApplyPlaceholderStyles = shouldRenderPlaceholder && !isShown;
67440      const firstItemStyle = firstDisplayedItem === label && __experimentalFirstVisibleItemClass;
67441      const lastItemStyle = lastDisplayedItem === label && __experimentalLastVisibleItemClass;
67442      return cx(ToolsPanelItem, shouldApplyPlaceholderStyles && ToolsPanelItemPlaceholder, !shouldApplyPlaceholderStyles && className, firstItemStyle, lastItemStyle);
67443    }, [isShown, shouldRenderPlaceholder, className, cx, firstDisplayedItem, lastDisplayedItem, __experimentalFirstVisibleItemClass, __experimentalLastVisibleItemClass, label]);
67444    return {
67445      ...otherProps,
67446      isShown,
67447      shouldRenderPlaceholder,
67448      className: classes
67449    };
67450  }
67451  
67452  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/tools-panel/tools-panel-item/component.js
67453  /**
67454   * External dependencies
67455   */
67456  
67457  /**
67458   * Internal dependencies
67459   */
67460  
67461  
67462  
67463  
67464  // This wraps controls to be conditionally displayed within a tools panel. It
67465  // prevents props being applied to HTML elements that would make them invalid.
67466  const UnconnectedToolsPanelItem = (props, forwardedRef) => {
67467    const {
67468      children,
67469      isShown,
67470      shouldRenderPlaceholder,
67471      ...toolsPanelItemProps
67472    } = useToolsPanelItem(props);
67473    if (!isShown) {
67474      return shouldRenderPlaceholder ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(component, {
67475        ...toolsPanelItemProps,
67476        ref: forwardedRef
67477      }) : null;
67478    }
67479    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(component, {
67480      ...toolsPanelItemProps,
67481      ref: forwardedRef,
67482      children: children
67483    });
67484  };
67485  const component_ToolsPanelItem = contextConnect(UnconnectedToolsPanelItem, 'ToolsPanelItem');
67486  /* harmony default export */ const tools_panel_item_component = (component_ToolsPanelItem);
67487  
67488  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/tree-grid/roving-tab-index-context.js
67489  /**
67490   * WordPress dependencies
67491   */
67492  
67493  const RovingTabIndexContext = (0,external_wp_element_namespaceObject.createContext)(undefined);
67494  const useRovingTabIndexContext = () => (0,external_wp_element_namespaceObject.useContext)(RovingTabIndexContext);
67495  const RovingTabIndexProvider = RovingTabIndexContext.Provider;
67496  
67497  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/tree-grid/roving-tab-index.js
67498  /**
67499   * WordPress dependencies
67500   */
67501  
67502  
67503  /**
67504   * Internal dependencies
67505   */
67506  
67507  
67508  /**
67509   * Provider for adding roving tab index behaviors to tree grid structures.
67510   *
67511   * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/components/src/tree-grid/README.md
67512   */
67513  
67514  function RovingTabIndex({
67515    children
67516  }) {
67517    const [lastFocusedElement, setLastFocusedElement] = (0,external_wp_element_namespaceObject.useState)();
67518  
67519    // Use `useMemo` to avoid creation of a new object for the providerValue
67520    // on every render. Only create a new object when the `lastFocusedElement`
67521    // value changes.
67522    const providerValue = (0,external_wp_element_namespaceObject.useMemo)(() => ({
67523      lastFocusedElement,
67524      setLastFocusedElement
67525    }), [lastFocusedElement]);
67526    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(RovingTabIndexProvider, {
67527      value: providerValue,
67528      children: children
67529    });
67530  }
67531  
67532  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/tree-grid/index.js
67533  /**
67534   * WordPress dependencies
67535   */
67536  
67537  
67538  
67539  
67540  /**
67541   * Internal dependencies
67542   */
67543  
67544  
67545  /**
67546   * Return focusables in a row element, excluding those from other branches
67547   * nested within the row.
67548   *
67549   * @param rowElement The DOM element representing the row.
67550   *
67551   * @return The array of focusables in the row.
67552   */
67553  function getRowFocusables(rowElement) {
67554    const focusablesInRow = external_wp_dom_namespaceObject.focus.focusable.find(rowElement, {
67555      sequential: true
67556    });
67557    return focusablesInRow.filter(focusable => {
67558      return focusable.closest('[role="row"]') === rowElement;
67559    });
67560  }
67561  
67562  /**
67563   * Renders both a table and tbody element, used to create a tree hierarchy.
67564   *
67565   */
67566  function UnforwardedTreeGrid({
67567    children,
67568    onExpandRow = () => {},
67569    onCollapseRow = () => {},
67570    onFocusRow = () => {},
67571    applicationAriaLabel,
67572    ...props
67573  }, /** A ref to the underlying DOM table element. */
67574  ref) {
67575    const onKeyDown = (0,external_wp_element_namespaceObject.useCallback)(event => {
67576      const {
67577        keyCode,
67578        metaKey,
67579        ctrlKey,
67580        altKey
67581      } = event;
67582  
67583      // The shift key is intentionally absent from the following list,
67584      // to enable shift + up/down to select items from the list.
67585      const hasModifierKeyPressed = metaKey || ctrlKey || altKey;
67586      if (hasModifierKeyPressed || ![external_wp_keycodes_namespaceObject.UP, external_wp_keycodes_namespaceObject.DOWN, external_wp_keycodes_namespaceObject.LEFT, external_wp_keycodes_namespaceObject.RIGHT, external_wp_keycodes_namespaceObject.HOME, external_wp_keycodes_namespaceObject.END].includes(keyCode)) {
67587        return;
67588      }
67589  
67590      // The event will be handled, stop propagation.
67591      event.stopPropagation();
67592      const {
67593        activeElement
67594      } = document;
67595      const {
67596        currentTarget: treeGridElement
67597      } = event;
67598      if (!activeElement || !treeGridElement.contains(activeElement)) {
67599        return;
67600      }
67601  
67602      // Calculate the columnIndex of the active element.
67603      const activeRow = activeElement.closest('[role="row"]');
67604      if (!activeRow) {
67605        return;
67606      }
67607      const focusablesInRow = getRowFocusables(activeRow);
67608      const currentColumnIndex = focusablesInRow.indexOf(activeElement);
67609      const canExpandCollapse = 0 === currentColumnIndex;
67610      const cannotFocusNextColumn = canExpandCollapse && (activeRow.getAttribute('data-expanded') === 'false' || activeRow.getAttribute('aria-expanded') === 'false') && keyCode === external_wp_keycodes_namespaceObject.RIGHT;
67611      if ([external_wp_keycodes_namespaceObject.LEFT, external_wp_keycodes_namespaceObject.RIGHT].includes(keyCode)) {
67612        // Calculate to the next element.
67613        let nextIndex;
67614        if (keyCode === external_wp_keycodes_namespaceObject.LEFT) {
67615          nextIndex = Math.max(0, currentColumnIndex - 1);
67616        } else {
67617          nextIndex = Math.min(currentColumnIndex + 1, focusablesInRow.length - 1);
67618        }
67619  
67620        // Focus is at the left most column.
67621        if (canExpandCollapse) {
67622          if (keyCode === external_wp_keycodes_namespaceObject.LEFT) {
67623            var _activeRow$getAttribu;
67624            // Left:
67625            // If a row is focused, and it is expanded, collapses the current row.
67626            if (activeRow.getAttribute('data-expanded') === 'true' || activeRow.getAttribute('aria-expanded') === 'true') {
67627              onCollapseRow(activeRow);
67628              event.preventDefault();
67629              return;
67630            }
67631            // If a row is focused, and it is collapsed, moves to the parent row (if there is one).
67632            const level = Math.max(parseInt((_activeRow$getAttribu = activeRow?.getAttribute('aria-level')) !== null && _activeRow$getAttribu !== void 0 ? _activeRow$getAttribu : '1', 10) - 1, 1);
67633            const rows = Array.from(treeGridElement.querySelectorAll('[role="row"]'));
67634            let parentRow = activeRow;
67635            const currentRowIndex = rows.indexOf(activeRow);
67636            for (let i = currentRowIndex; i >= 0; i--) {
67637              const ariaLevel = rows[i].getAttribute('aria-level');
67638              if (ariaLevel !== null && parseInt(ariaLevel, 10) === level) {
67639                parentRow = rows[i];
67640                break;
67641              }
67642            }
67643            getRowFocusables(parentRow)?.[0]?.focus();
67644          }
67645          if (keyCode === external_wp_keycodes_namespaceObject.RIGHT) {
67646            // Right:
67647            // If a row is focused, and it is collapsed, expands the current row.
67648            if (activeRow.getAttribute('data-expanded') === 'false' || activeRow.getAttribute('aria-expanded') === 'false') {
67649              onExpandRow(activeRow);
67650              event.preventDefault();
67651              return;
67652            }
67653            // If a row is focused, and it is expanded, focuses the next cell in the row.
67654            const focusableItems = getRowFocusables(activeRow);
67655            if (focusableItems.length > 0) {
67656              focusableItems[nextIndex]?.focus();
67657            }
67658          }
67659          // Prevent key use for anything else. For example, Voiceover
67660          // will start reading text on continued use of left/right arrow
67661          // keys.
67662          event.preventDefault();
67663          return;
67664        }
67665  
67666        // Focus the next element. If at most left column and row is collapsed, moving right is not allowed as this will expand. However, if row is collapsed, moving left is allowed.
67667        if (cannotFocusNextColumn) {
67668          return;
67669        }
67670        focusablesInRow[nextIndex].focus();
67671  
67672        // Prevent key use for anything else. This ensures Voiceover
67673        // doesn't try to handle key navigation.
67674        event.preventDefault();
67675      } else if ([external_wp_keycodes_namespaceObject.UP, external_wp_keycodes_namespaceObject.DOWN].includes(keyCode)) {
67676        // Calculate the rowIndex of the next row.
67677        const rows = Array.from(treeGridElement.querySelectorAll('[role="row"]'));
67678        const currentRowIndex = rows.indexOf(activeRow);
67679        let nextRowIndex;
67680        if (keyCode === external_wp_keycodes_namespaceObject.UP) {
67681          nextRowIndex = Math.max(0, currentRowIndex - 1);
67682        } else {
67683          nextRowIndex = Math.min(currentRowIndex + 1, rows.length - 1);
67684        }
67685  
67686        // Focus is either at the top or bottom edge of the grid. Do nothing.
67687        if (nextRowIndex === currentRowIndex) {
67688          // Prevent key use for anything else. For example, Voiceover
67689          // will start navigating horizontally when reaching the vertical
67690          // bounds of a table.
67691          event.preventDefault();
67692          return;
67693        }
67694  
67695        // Get the focusables in the next row.
67696        const focusablesInNextRow = getRowFocusables(rows[nextRowIndex]);
67697  
67698        // If for some reason there are no focusables in the next row, do nothing.
67699        if (!focusablesInNextRow || !focusablesInNextRow.length) {
67700          // Prevent key use for anything else. For example, Voiceover
67701          // will still focus text when using arrow keys, while this
67702          // component should limit navigation to focusables.
67703          event.preventDefault();
67704          return;
67705        }
67706  
67707        // Try to focus the element in the next row that's at a similar column to the activeElement.
67708        const nextIndex = Math.min(currentColumnIndex, focusablesInNextRow.length - 1);
67709        focusablesInNextRow[nextIndex].focus();
67710  
67711        // Let consumers know the row that was originally focused,
67712        // and the row that is now in focus.
67713        onFocusRow(event, activeRow, rows[nextRowIndex]);
67714  
67715        // Prevent key use for anything else. This ensures Voiceover
67716        // doesn't try to handle key navigation.
67717        event.preventDefault();
67718      } else if ([external_wp_keycodes_namespaceObject.HOME, external_wp_keycodes_namespaceObject.END].includes(keyCode)) {
67719        // Calculate the rowIndex of the next row.
67720        const rows = Array.from(treeGridElement.querySelectorAll('[role="row"]'));
67721        const currentRowIndex = rows.indexOf(activeRow);
67722        let nextRowIndex;
67723        if (keyCode === external_wp_keycodes_namespaceObject.HOME) {
67724          nextRowIndex = 0;
67725        } else {
67726          nextRowIndex = rows.length - 1;
67727        }
67728  
67729        // Focus is either at the top or bottom edge of the grid. Do nothing.
67730        if (nextRowIndex === currentRowIndex) {
67731          // Prevent key use for anything else. For example, Voiceover
67732          // will start navigating horizontally when reaching the vertical
67733          // bounds of a table.
67734          event.preventDefault();
67735          return;
67736        }
67737  
67738        // Get the focusables in the next row.
67739        const focusablesInNextRow = getRowFocusables(rows[nextRowIndex]);
67740  
67741        // If for some reason there are no focusables in the next row, do nothing.
67742        if (!focusablesInNextRow || !focusablesInNextRow.length) {
67743          // Prevent key use for anything else. For example, Voiceover
67744          // will still focus text when using arrow keys, while this
67745          // component should limit navigation to focusables.
67746          event.preventDefault();
67747          return;
67748        }
67749  
67750        // Try to focus the element in the next row that's at a similar column to the activeElement.
67751        const nextIndex = Math.min(currentColumnIndex, focusablesInNextRow.length - 1);
67752        focusablesInNextRow[nextIndex].focus();
67753  
67754        // Let consumers know the row that was originally focused,
67755        // and the row that is now in focus.
67756        onFocusRow(event, activeRow, rows[nextRowIndex]);
67757  
67758        // Prevent key use for anything else. This ensures Voiceover
67759        // doesn't try to handle key navigation.
67760        event.preventDefault();
67761      }
67762    }, [onExpandRow, onCollapseRow, onFocusRow]);
67763  
67764    /* Disable reason: A treegrid is implemented using a table element. */
67765    /* eslint-disable jsx-a11y/no-noninteractive-element-to-interactive-role */
67766    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(RovingTabIndex, {
67767      children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", {
67768        role: "application",
67769        "aria-label": applicationAriaLabel,
67770        children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("table", {
67771          ...props,
67772          role: "treegrid",
67773          onKeyDown: onKeyDown,
67774          ref: ref,
67775          children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("tbody", {
67776            children: children
67777          })
67778        })
67779      })
67780    });
67781    /* eslint-enable jsx-a11y/no-noninteractive-element-to-interactive-role */
67782  }
67783  
67784  /**
67785   * `TreeGrid` is used to create a tree hierarchy.
67786   * It is not a visually styled component, but instead helps with adding
67787   * keyboard navigation and roving tab index behaviors to tree grid structures.
67788   *
67789   * A tree grid is a hierarchical 2 dimensional UI component, for example it could be
67790   * used to implement a file system browser.
67791   *
67792   * A tree grid allows the user to navigate using arrow keys.
67793   * Up/down to navigate vertically across rows, and left/right to navigate horizontally
67794   * between focusables in a row.
67795   *
67796   * The `TreeGrid` renders both a `table` and `tbody` element, and is intended to be used
67797   * with `TreeGridRow` (`tr`) and `TreeGridCell` (`td`) to build out a grid.
67798   *
67799   * ```jsx
67800   * function TreeMenu() {
67801   *     return (
67802   *         <TreeGrid>
67803   *             <TreeGridRow level={ 1 } positionInSet={ 1 } setSize={ 2 }>
67804   *                 <TreeGridCell>
67805   *                     { ( props ) => (
67806   *                         <Button onClick={ onSelect } { ...props }>Select</Button>
67807   *                     ) }
67808   *                 </TreeGridCell>
67809   *                 <TreeGridCell>
67810   *                     { ( props ) => (
67811   *                         <Button onClick={ onMove } { ...props }>Move</Button>
67812   *                     ) }
67813   *                 </TreeGridCell>
67814   *             </TreeGridRow>
67815   *             <TreeGridRow level={ 1 } positionInSet={ 2 } setSize={ 2 }>
67816   *                 <TreeGridCell>
67817   *                     { ( props ) => (
67818   *                         <Button onClick={ onSelect } { ...props }>Select</Button>
67819   *                     ) }
67820   *                 </TreeGridCell>
67821   *                 <TreeGridCell>
67822   *                     { ( props ) => (
67823   *                         <Button onClick={ onMove } { ...props }>Move</Button>
67824   *                     ) }
67825   *                 </TreeGridCell>
67826   *             </TreeGridRow>
67827   *             <TreeGridRow level={ 2 } positionInSet={ 1 } setSize={ 1 }>
67828   *                 <TreeGridCell>
67829   *                     { ( props ) => (
67830   *                         <Button onClick={ onSelect } { ...props }>Select</Button>
67831   *                     ) }
67832   *                 </TreeGridCell>
67833   *                 <TreeGridCell>
67834   *                     { ( props ) => (
67835   *                         <Button onClick={ onMove } { ...props }>Move</Button>
67836   *                     ) }
67837   *                 </TreeGridCell>
67838   *             </TreeGridRow>
67839   *         </TreeGrid>
67840   *     );
67841   * }
67842   * ```
67843   *
67844   * @see {@link https://www.w3.org/TR/wai-aria-practices/examples/treegrid/treegrid-1.html}
67845   */
67846  const TreeGrid = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedTreeGrid);
67847  /* harmony default export */ const tree_grid = (TreeGrid);
67848  
67849  
67850  
67851  
67852  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/tree-grid/row.js
67853  /**
67854   * WordPress dependencies
67855   */
67856  
67857  
67858  /**
67859   * Internal dependencies
67860   */
67861  
67862  function UnforwardedTreeGridRow({
67863    children,
67864    level,
67865    positionInSet,
67866    setSize,
67867    isExpanded,
67868    ...props
67869  }, ref) {
67870    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("tr", {
67871      ...props,
67872      ref: ref,
67873      role: "row",
67874      "aria-level": level,
67875      "aria-posinset": positionInSet,
67876      "aria-setsize": setSize,
67877      "aria-expanded": isExpanded,
67878      children: children
67879    });
67880  }
67881  
67882  /**
67883   * `TreeGridRow` is used to create a tree hierarchy.
67884   * It is not a visually styled component, but instead helps with adding
67885   * keyboard navigation and roving tab index behaviors to tree grid structures.
67886   *
67887   * @see {@link https://www.w3.org/TR/wai-aria-practices/examples/treegrid/treegrid-1.html}
67888   */
67889  const TreeGridRow = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedTreeGridRow);
67890  /* harmony default export */ const tree_grid_row = (TreeGridRow);
67891  
67892  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/tree-grid/roving-tab-index-item.js
67893  /**
67894   * WordPress dependencies
67895   */
67896  
67897  
67898  /**
67899   * Internal dependencies
67900   */
67901  
67902  
67903  const RovingTabIndexItem = (0,external_wp_element_namespaceObject.forwardRef)(function UnforwardedRovingTabIndexItem({
67904    children,
67905    as: Component,
67906    ...props
67907  }, forwardedRef) {
67908    const localRef = (0,external_wp_element_namespaceObject.useRef)();
67909    const ref = forwardedRef || localRef;
67910    // @ts-expect-error - We actually want to throw an error if this is undefined.
67911    const {
67912      lastFocusedElement,
67913      setLastFocusedElement
67914    } = useRovingTabIndexContext();
67915    let tabIndex;
67916    if (lastFocusedElement) {
67917      tabIndex = lastFocusedElement === (
67918      // TODO: The original implementation simply used `ref.current` here, assuming
67919      // that a forwarded ref would always be an object, which is not necessarily true.
67920      // This workaround maintains the original runtime behavior in a type-safe way,
67921      // but should be revisited.
67922      'current' in ref ? ref.current : undefined) ? 0 : -1;
67923    }
67924    const onFocus = event => setLastFocusedElement?.(event.target);
67925    const allProps = {
67926      ref,
67927      tabIndex,
67928      onFocus,
67929      ...props
67930    };
67931    if (typeof children === 'function') {
67932      return children(allProps);
67933    }
67934    if (!Component) {
67935      return null;
67936    }
67937    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Component, {
67938      ...allProps,
67939      children: children
67940    });
67941  });
67942  /* harmony default export */ const roving_tab_index_item = (RovingTabIndexItem);
67943  
67944  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/tree-grid/item.js
67945  /**
67946   * WordPress dependencies
67947   */
67948  
67949  
67950  /**
67951   * Internal dependencies
67952   */
67953  
67954  
67955  function UnforwardedTreeGridItem({
67956    children,
67957    ...props
67958  }, ref) {
67959    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(roving_tab_index_item, {
67960      ref: ref,
67961      ...props,
67962      children: children
67963    });
67964  }
67965  
67966  /**
67967   * `TreeGridItem` is used to create a tree hierarchy.
67968   * It is not a visually styled component, but instead helps with adding
67969   * keyboard navigation and roving tab index behaviors to tree grid structures.
67970   *
67971   * @see {@link https://www.w3.org/TR/wai-aria-practices/examples/treegrid/treegrid-1.html}
67972   */
67973  const TreeGridItem = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedTreeGridItem);
67974  /* harmony default export */ const tree_grid_item = (TreeGridItem);
67975  
67976  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/tree-grid/cell.js
67977  /**
67978   * WordPress dependencies
67979   */
67980  
67981  
67982  /**
67983   * Internal dependencies
67984   */
67985  
67986  
67987  
67988  function UnforwardedTreeGridCell({
67989    children,
67990    withoutGridItem = false,
67991    ...props
67992  }, ref) {
67993    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("td", {
67994      ...props,
67995      role: "gridcell",
67996      children: withoutGridItem ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_ReactJSXRuntime_namespaceObject.Fragment, {
67997        children: children
67998      }) : /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(tree_grid_item, {
67999        ref: ref,
68000        children: children
68001      })
68002    });
68003  }
68004  
68005  /**
68006   * `TreeGridCell` is used to create a tree hierarchy.
68007   * It is not a visually styled component, but instead helps with adding
68008   * keyboard navigation and roving tab index behaviors to tree grid structures.
68009   *
68010   * @see {@link https://www.w3.org/TR/wai-aria-practices/examples/treegrid/treegrid-1.html}
68011   */
68012  const TreeGridCell = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedTreeGridCell);
68013  /* harmony default export */ const cell = (TreeGridCell);
68014  
68015  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/isolated-event-container/index.js
68016  /**
68017   * External dependencies
68018   */
68019  
68020  /**
68021   * WordPress dependencies
68022   */
68023  
68024  
68025  
68026  function stopPropagation(event) {
68027    event.stopPropagation();
68028  }
68029  const IsolatedEventContainer = (0,external_wp_element_namespaceObject.forwardRef)((props, ref) => {
68030    external_wp_deprecated_default()('wp.components.IsolatedEventContainer', {
68031      since: '5.7'
68032    });
68033  
68034    // Disable reason: this stops certain events from propagating outside of the component.
68035    // - onMouseDown is disabled as this can cause interactions with other DOM elements.
68036    /* eslint-disable jsx-a11y/no-static-element-interactions */
68037    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", {
68038      ...props,
68039      ref: ref,
68040      onMouseDown: stopPropagation
68041    });
68042    /* eslint-enable jsx-a11y/no-static-element-interactions */
68043  });
68044  /* harmony default export */ const isolated_event_container = (IsolatedEventContainer);
68045  
68046  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/slot-fill/bubbles-virtually/use-slot-fills.js
68047  /**
68048   * WordPress dependencies
68049   */
68050  
68051  
68052  
68053  /**
68054   * Internal dependencies
68055   */
68056  
68057  function useSlotFills(name) {
68058    const registry = (0,external_wp_element_namespaceObject.useContext)(slot_fill_context);
68059    return (0,external_wp_compose_namespaceObject.useObservableValue)(registry.fills, name);
68060  }
68061  
68062  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/z-stack/styles.js
68063  
68064  function z_stack_styles_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)."; }
68065  /**
68066   * External dependencies
68067   */
68068  
68069  const ZStackChildView = /*#__PURE__*/emotion_styled_base_browser_esm("div",  true ? {
68070    target: "ebn2ljm1"
68071  } : 0)("&:not( :first-of-type ){", ({
68072    offsetAmount
68073  }) => /*#__PURE__*/emotion_react_browser_esm_css({
68074    marginInlineStart: offsetAmount
68075  },  true ? "" : 0,  true ? "" : 0), ";}", ({
68076    zIndex
68077  }) => /*#__PURE__*/emotion_react_browser_esm_css({
68078    zIndex
68079  },  true ? "" : 0,  true ? "" : 0), ";" + ( true ? "" : 0));
68080  var z_stack_styles_ref =  true ? {
68081    name: "rs0gp6",
68082    styles: "grid-row-start:1;grid-column-start:1"
68083  } : 0;
68084  const ZStackView = /*#__PURE__*/emotion_styled_base_browser_esm("div",  true ? {
68085    target: "ebn2ljm0"
68086  } : 0)("display:inline-grid;grid-auto-flow:column;position:relative;&>", ZStackChildView, "{position:relative;justify-self:start;", ({
68087    isLayered
68088  }) => isLayered ? // When `isLayered` is true, all items overlap in the same grid cell
68089  z_stack_styles_ref : undefined, ";}" + ( true ? "" : 0));
68090  
68091  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/z-stack/component.js
68092  /**
68093   * External dependencies
68094   */
68095  
68096  /**
68097   * WordPress dependencies
68098   */
68099  
68100  
68101  /**
68102   * Internal dependencies
68103   */
68104  
68105  
68106  
68107  
68108  function UnconnectedZStack(props, forwardedRef) {
68109    const {
68110      children,
68111      className,
68112      isLayered = true,
68113      isReversed = false,
68114      offset = 0,
68115      ...otherProps
68116    } = useContextSystem(props, 'ZStack');
68117    const validChildren = getValidChildren(children);
68118    const childrenLastIndex = validChildren.length - 1;
68119    const clonedChildren = validChildren.map((child, index) => {
68120      const zIndex = isReversed ? childrenLastIndex - index : index;
68121      // Only when the component is layered, the offset needs to be multiplied by
68122      // the item's index, so that items can correctly stack at the right distance
68123      const offsetAmount = isLayered ? offset * index : offset;
68124      const key = (0,external_wp_element_namespaceObject.isValidElement)(child) ? child.key : index;
68125      return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ZStackChildView, {
68126        offsetAmount: offsetAmount,
68127        zIndex: zIndex,
68128        children: child
68129      }, key);
68130    });
68131    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ZStackView, {
68132      ...otherProps,
68133      className: className,
68134      isLayered: isLayered,
68135      ref: forwardedRef,
68136      children: clonedChildren
68137    });
68138  }
68139  
68140  /**
68141   * `ZStack` allows you to stack things along the Z-axis.
68142   *
68143   * ```jsx
68144   * import { __experimentalZStack as ZStack } from '@wordpress/components';
68145   *
68146   * function Example() {
68147   *   return (
68148   *     <ZStack offset={ 20 } isLayered>
68149   *       <ExampleImage />
68150   *       <ExampleImage />
68151   *       <ExampleImage />
68152   *     </ZStack>
68153   *   );
68154   * }
68155   * ```
68156   */
68157  const ZStack = contextConnect(UnconnectedZStack, 'ZStack');
68158  /* harmony default export */ const z_stack_component = (ZStack);
68159  
68160  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/higher-order/navigate-regions/index.js
68161  /**
68162   * WordPress dependencies
68163   */
68164  
68165  
68166  
68167  
68168  const defaultShortcuts = {
68169    previous: [{
68170      modifier: 'ctrlShift',
68171      character: '`'
68172    }, {
68173      modifier: 'ctrlShift',
68174      character: '~'
68175    }, {
68176      modifier: 'access',
68177      character: 'p'
68178    }],
68179    next: [{
68180      modifier: 'ctrl',
68181      character: '`'
68182    }, {
68183      modifier: 'access',
68184      character: 'n'
68185    }]
68186  };
68187  function useNavigateRegions(shortcuts = defaultShortcuts) {
68188    const ref = (0,external_wp_element_namespaceObject.useRef)(null);
68189    const [isFocusingRegions, setIsFocusingRegions] = (0,external_wp_element_namespaceObject.useState)(false);
68190    function focusRegion(offset) {
68191      var _ref$current$querySel;
68192      const regions = Array.from((_ref$current$querySel = ref.current?.querySelectorAll('[role="region"][tabindex="-1"]')) !== null && _ref$current$querySel !== void 0 ? _ref$current$querySel : []);
68193      if (!regions.length) {
68194        return;
68195      }
68196      let nextRegion = regions[0];
68197      // Based off the current element, use closest to determine the wrapping region since this operates up the DOM. Also, match tabindex to avoid edge cases with regions we do not want.
68198      const wrappingRegion = ref.current?.ownerDocument?.activeElement?.closest('[role="region"][tabindex="-1"]');
68199      const selectedIndex = wrappingRegion ? regions.indexOf(wrappingRegion) : -1;
68200      if (selectedIndex !== -1) {
68201        let nextIndex = selectedIndex + offset;
68202        nextIndex = nextIndex === -1 ? regions.length - 1 : nextIndex;
68203        nextIndex = nextIndex === regions.length ? 0 : nextIndex;
68204        nextRegion = regions[nextIndex];
68205      }
68206      nextRegion.focus();
68207      setIsFocusingRegions(true);
68208    }
68209    const clickRef = (0,external_wp_compose_namespaceObject.useRefEffect)(element => {
68210      function onClick() {
68211        setIsFocusingRegions(false);
68212      }
68213      element.addEventListener('click', onClick);
68214      return () => {
68215        element.removeEventListener('click', onClick);
68216      };
68217    }, [setIsFocusingRegions]);
68218    return {
68219      ref: (0,external_wp_compose_namespaceObject.useMergeRefs)([ref, clickRef]),
68220      className: isFocusingRegions ? 'is-focusing-regions' : '',
68221      onKeyDown(event) {
68222        if (shortcuts.previous.some(({
68223          modifier,
68224          character
68225        }) => {
68226          return external_wp_keycodes_namespaceObject.isKeyboardEvent[modifier](event, character);
68227        })) {
68228          focusRegion(-1);
68229        } else if (shortcuts.next.some(({
68230          modifier,
68231          character
68232        }) => {
68233          return external_wp_keycodes_namespaceObject.isKeyboardEvent[modifier](event, character);
68234        })) {
68235          focusRegion(1);
68236        }
68237      }
68238    };
68239  }
68240  
68241  /**
68242   * `navigateRegions` is a React [higher-order component](https://facebook.github.io/react/docs/higher-order-components.html)
68243   * adding keyboard navigation to switch between the different DOM elements marked as "regions" (role="region").
68244   * These regions should be focusable (By adding a tabIndex attribute for example). For better accessibility,
68245   * these elements must be properly labelled to briefly describe the purpose of the content in the region.
68246   * For more details, see "Landmark Roles" in the [WAI-ARIA specification](https://www.w3.org/TR/wai-aria/)
68247   * and "Landmark Regions" in the [ARIA Authoring Practices Guide](https://www.w3.org/WAI/ARIA/apg/practices/landmark-regions/).
68248   *
68249   * ```jsx
68250   * import { navigateRegions } from '@wordpress/components';
68251   *
68252   * const MyComponentWithNavigateRegions = navigateRegions( () => (
68253   *     <div>
68254   *         <div role="region" tabIndex="-1" aria-label="Header">
68255   *             Header
68256   *         </div>
68257   *         <div role="region" tabIndex="-1" aria-label="Content">
68258   *             Content
68259   *         </div>
68260   *         <div role="region" tabIndex="-1" aria-label="Sidebar">
68261   *             Sidebar
68262   *         </div>
68263   *     </div>
68264   * ) );
68265   * ```
68266   */
68267  /* harmony default export */ const navigate_regions = ((0,external_wp_compose_namespaceObject.createHigherOrderComponent)(Component => ({
68268    shortcuts,
68269    ...props
68270  }) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", {
68271    ...useNavigateRegions(shortcuts),
68272    children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Component, {
68273      ...props
68274    })
68275  }), 'navigateRegions'));
68276  
68277  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/higher-order/with-constrained-tabbing/index.js
68278  /**
68279   * WordPress dependencies
68280   */
68281  
68282  
68283  /**
68284   * `withConstrainedTabbing` is a React [higher-order component](https://facebook.github.io/react/docs/higher-order-components.html)
68285   * adding the ability to constrain keyboard navigation with the Tab key within a component.
68286   * For accessibility reasons, some UI components need to constrain Tab navigation, for example
68287   * modal dialogs or similar UI. Use of this component is recommended only in cases where a way to
68288   * navigate away from the wrapped component is implemented by other means, usually by pressing
68289   * the Escape key or using a specific UI control, e.g. a "Close" button.
68290   */
68291  
68292  const withConstrainedTabbing = (0,external_wp_compose_namespaceObject.createHigherOrderComponent)(WrappedComponent => function ComponentWithConstrainedTabbing(props) {
68293    const ref = (0,external_wp_compose_namespaceObject.useConstrainedTabbing)();
68294    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", {
68295      ref: ref,
68296      tabIndex: -1,
68297      children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(WrappedComponent, {
68298        ...props
68299      })
68300    });
68301  }, 'withConstrainedTabbing');
68302  /* harmony default export */ const with_constrained_tabbing = (withConstrainedTabbing);
68303  
68304  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/higher-order/with-fallback-styles/index.js
68305  /**
68306   * External dependencies
68307   */
68308  
68309  
68310  /**
68311   * WordPress dependencies
68312   */
68313  
68314  
68315  
68316  
68317  /* harmony default export */ const with_fallback_styles = (mapNodeToProps => (0,external_wp_compose_namespaceObject.createHigherOrderComponent)(WrappedComponent => {
68318    return class extends external_wp_element_namespaceObject.Component {
68319      constructor(props) {
68320        super(props);
68321        this.nodeRef = this.props.node;
68322        this.state = {
68323          fallbackStyles: undefined,
68324          grabStylesCompleted: false
68325        };
68326        this.bindRef = this.bindRef.bind(this);
68327      }
68328      bindRef(node) {
68329        if (!node) {
68330          return;
68331        }
68332        this.nodeRef = node;
68333      }
68334      componentDidMount() {
68335        this.grabFallbackStyles();
68336      }
68337      componentDidUpdate() {
68338        this.grabFallbackStyles();
68339      }
68340      grabFallbackStyles() {
68341        const {
68342          grabStylesCompleted,
68343          fallbackStyles
68344        } = this.state;
68345        if (this.nodeRef && !grabStylesCompleted) {
68346          const newFallbackStyles = mapNodeToProps(this.nodeRef, this.props);
68347          if (!es6_default()(newFallbackStyles, fallbackStyles)) {
68348            this.setState({
68349              fallbackStyles: newFallbackStyles,
68350              grabStylesCompleted: Object.values(newFallbackStyles).every(Boolean)
68351            });
68352          }
68353        }
68354      }
68355      render() {
68356        const wrappedComponent = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(WrappedComponent, {
68357          ...this.props,
68358          ...this.state.fallbackStyles
68359        });
68360        return this.props.node ? wrappedComponent : /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", {
68361          ref: this.bindRef,
68362          children: [" ", wrappedComponent, " "]
68363        });
68364      }
68365    };
68366  }, 'withFallbackStyles'));
68367  
68368  ;// CONCATENATED MODULE: external ["wp","hooks"]
68369  const external_wp_hooks_namespaceObject = window["wp"]["hooks"];
68370  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/higher-order/with-filters/index.js
68371  /**
68372   * WordPress dependencies
68373   */
68374  
68375  
68376  
68377  
68378  const ANIMATION_FRAME_PERIOD = 16;
68379  
68380  /**
68381   * Creates a higher-order component which adds filtering capability to the
68382   * wrapped component. Filters get applied when the original component is about
68383   * to be mounted. When a filter is added or removed that matches the hook name,
68384   * the wrapped component re-renders.
68385   *
68386   * @param hookName Hook name exposed to be used by filters.
68387   *
68388   * @return Higher-order component factory.
68389   *
68390   * ```jsx
68391   * import { withFilters } from '@wordpress/components';
68392   * import { addFilter } from '@wordpress/hooks';
68393   *
68394   * const MyComponent = ( { title } ) => <h1>{ title }</h1>;
68395   *
68396   * const ComponentToAppend = () => <div>Appended component</div>;
68397   *
68398   * function withComponentAppended( FilteredComponent ) {
68399   *     return ( props ) => (
68400   *         <>
68401   *             <FilteredComponent { ...props } />
68402   *             <ComponentToAppend />
68403   *         </>
68404   *     );
68405   * }
68406   *
68407   * addFilter(
68408   *     'MyHookName',
68409   *     'my-plugin/with-component-appended',
68410   *     withComponentAppended
68411   * );
68412   *
68413   * const MyComponentWithFilters = withFilters( 'MyHookName' )( MyComponent );
68414   * ```
68415   */
68416  function withFilters(hookName) {
68417    return (0,external_wp_compose_namespaceObject.createHigherOrderComponent)(OriginalComponent => {
68418      const namespace = 'core/with-filters/' + hookName;
68419  
68420      /**
68421       * The component definition with current filters applied. Each instance
68422       * reuse this shared reference as an optimization to avoid excessive
68423       * calls to `applyFilters` when many instances exist.
68424       */
68425      let FilteredComponent;
68426  
68427      /**
68428       * Initializes the FilteredComponent variable once, if not already
68429       * assigned. Subsequent calls are effectively a noop.
68430       */
68431      function ensureFilteredComponent() {
68432        if (FilteredComponent === undefined) {
68433          FilteredComponent = (0,external_wp_hooks_namespaceObject.applyFilters)(hookName, OriginalComponent);
68434        }
68435      }
68436      class FilteredComponentRenderer extends external_wp_element_namespaceObject.Component {
68437        constructor(props) {
68438          super(props);
68439          ensureFilteredComponent();
68440        }
68441        componentDidMount() {
68442          FilteredComponentRenderer.instances.push(this);
68443  
68444          // If there were previously no mounted instances for components
68445          // filtered on this hook, add the hook handler.
68446          if (FilteredComponentRenderer.instances.length === 1) {
68447            (0,external_wp_hooks_namespaceObject.addAction)('hookRemoved', namespace, onHooksUpdated);
68448            (0,external_wp_hooks_namespaceObject.addAction)('hookAdded', namespace, onHooksUpdated);
68449          }
68450        }
68451        componentWillUnmount() {
68452          FilteredComponentRenderer.instances = FilteredComponentRenderer.instances.filter(instance => instance !== this);
68453  
68454          // If this was the last of the mounted components filtered on
68455          // this hook, remove the hook handler.
68456          if (FilteredComponentRenderer.instances.length === 0) {
68457            (0,external_wp_hooks_namespaceObject.removeAction)('hookRemoved', namespace);
68458            (0,external_wp_hooks_namespaceObject.removeAction)('hookAdded', namespace);
68459          }
68460        }
68461        render() {
68462          return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(FilteredComponent, {
68463            ...this.props
68464          });
68465        }
68466      }
68467      FilteredComponentRenderer.instances = [];
68468  
68469      /**
68470       * Updates the FilteredComponent definition, forcing a render for each
68471       * mounted instance. This occurs a maximum of once per animation frame.
68472       */
68473      const throttledForceUpdate = (0,external_wp_compose_namespaceObject.debounce)(() => {
68474        // Recreate the filtered component, only after delay so that it's
68475        // computed once, even if many filters added.
68476        FilteredComponent = (0,external_wp_hooks_namespaceObject.applyFilters)(hookName, OriginalComponent);
68477  
68478        // Force each instance to render.
68479        FilteredComponentRenderer.instances.forEach(instance => {
68480          instance.forceUpdate();
68481        });
68482      }, ANIMATION_FRAME_PERIOD);
68483  
68484      /**
68485       * When a filter is added or removed for the matching hook name, each
68486       * mounted instance should re-render with the new filters having been
68487       * applied to the original component.
68488       *
68489       * @param updatedHookName Name of the hook that was updated.
68490       */
68491      function onHooksUpdated(updatedHookName) {
68492        if (updatedHookName === hookName) {
68493          throttledForceUpdate();
68494        }
68495      }
68496      return FilteredComponentRenderer;
68497    }, 'withFilters');
68498  }
68499  
68500  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/higher-order/with-focus-return/index.js
68501  /**
68502   * WordPress dependencies
68503   */
68504  
68505  
68506  
68507  
68508  /**
68509   * Returns true if the given object is component-like. An object is component-
68510   * like if it is an instance of wp.element.Component, or is a function.
68511   *
68512   * @param object Object to test.
68513   *
68514   * @return Whether object is component-like.
68515   */
68516  
68517  function isComponentLike(object) {
68518    return object instanceof external_wp_element_namespaceObject.Component || typeof object === 'function';
68519  }
68520  /**
68521   * Higher Order Component used to be used to wrap disposable elements like
68522   * sidebars, modals, dropdowns. When mounting the wrapped component, we track a
68523   * reference to the current active element so we know where to restore focus
68524   * when the component is unmounted.
68525   *
68526   * @param options The component to be enhanced with
68527   *                focus return behavior, or an object
68528   *                describing the component and the
68529   *                focus return characteristics.
68530   *
68531   * @return Higher Order Component with the focus restauration behaviour.
68532   */
68533  /* harmony default export */ const with_focus_return = ((0,external_wp_compose_namespaceObject.createHigherOrderComponent)(
68534  // @ts-expect-error TODO: Reconcile with intended `createHigherOrderComponent` types
68535  options => {
68536    const HoC = ({
68537      onFocusReturn
68538    } = {}) => WrappedComponent => {
68539      const WithFocusReturn = props => {
68540        const ref = (0,external_wp_compose_namespaceObject.useFocusReturn)(onFocusReturn);
68541        return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", {
68542          ref: ref,
68543          children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(WrappedComponent, {
68544            ...props
68545          })
68546        });
68547      };
68548      return WithFocusReturn;
68549    };
68550    if (isComponentLike(options)) {
68551      const WrappedComponent = options;
68552      return HoC()(WrappedComponent);
68553    }
68554    return HoC(options);
68555  }, 'withFocusReturn'));
68556  const with_focus_return_Provider = ({
68557    children
68558  }) => {
68559    external_wp_deprecated_default()('wp.components.FocusReturnProvider component', {
68560      since: '5.7',
68561      hint: 'This provider is not used anymore. You can just remove it from your codebase'
68562    });
68563    return children;
68564  };
68565  
68566  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/higher-order/with-notices/index.js
68567  /**
68568   * External dependencies
68569   */
68570  
68571  
68572  /**
68573   * WordPress dependencies
68574   */
68575  
68576  
68577  
68578  /**
68579   * Internal dependencies
68580   */
68581  
68582  
68583  /**
68584   * Override the default edit UI to include notices if supported.
68585   *
68586   * Wrapping the original component with `withNotices` encapsulates the component
68587   * with the additional props `noticeOperations` and `noticeUI`.
68588   *
68589   * ```jsx
68590   * import { withNotices, Button } from '@wordpress/components';
68591   *
68592   * const MyComponentWithNotices = withNotices(
68593   *     ( { noticeOperations, noticeUI } ) => {
68594   *         const addError = () =>
68595   *             noticeOperations.createErrorNotice( 'Error message' );
68596   *         return (
68597   *             <div>
68598   *                 { noticeUI }
68599   *                 <Button variant="secondary" onClick={ addError }>
68600   *                     Add error
68601   *                 </Button>
68602   *             </div>
68603   *         );
68604   *     }
68605   * );
68606   * ```
68607   *
68608   * @param OriginalComponent Original component.
68609   *
68610   * @return Wrapped component.
68611   */
68612  /* harmony default export */ const with_notices = ((0,external_wp_compose_namespaceObject.createHigherOrderComponent)(OriginalComponent => {
68613    function Component(props, ref) {
68614      const [noticeList, setNoticeList] = (0,external_wp_element_namespaceObject.useState)([]);
68615      const noticeOperations = (0,external_wp_element_namespaceObject.useMemo)(() => {
68616        const createNotice = notice => {
68617          const noticeToAdd = notice.id ? notice : {
68618            ...notice,
68619            id: esm_browser_v4()
68620          };
68621          setNoticeList(current => [...current, noticeToAdd]);
68622        };
68623        return {
68624          createNotice,
68625          createErrorNotice: msg => {
68626            // @ts-expect-error TODO: Missing `id`, potentially a bug
68627            createNotice({
68628              status: 'error',
68629              content: msg
68630            });
68631          },
68632          removeNotice: id => {
68633            setNoticeList(current => current.filter(notice => notice.id !== id));
68634          },
68635          removeAllNotices: () => {
68636            setNoticeList([]);
68637          }
68638        };
68639      }, []);
68640      const propsOut = {
68641        ...props,
68642        noticeList,
68643        noticeOperations,
68644        noticeUI: noticeList.length > 0 && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(list, {
68645          className: "components-with-notices-ui",
68646          notices: noticeList,
68647          onRemove: noticeOperations.removeNotice
68648        })
68649      };
68650      return isForwardRef ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(OriginalComponent, {
68651        ...propsOut,
68652        ref: ref
68653      }) : /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(OriginalComponent, {
68654        ...propsOut
68655      });
68656    }
68657    let isForwardRef;
68658    // @ts-expect-error - `render` will only be present when OriginalComponent was wrapped with forwardRef().
68659    const {
68660      render
68661    } = OriginalComponent;
68662    // Returns a forwardRef if OriginalComponent appears to be a forwardRef.
68663    if (typeof render === 'function') {
68664      isForwardRef = true;
68665      return (0,external_wp_element_namespaceObject.forwardRef)(Component);
68666    }
68667    return Component;
68668  }, 'withNotices'));
68669  
68670  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/LG4RFBHV.js
68671  "use client";
68672  
68673  
68674  
68675  
68676  
68677  // src/menu/menu-context.tsx
68678  
68679  var LG4RFBHV_menu = createStoreContext(
68680    [CompositeContextProvider, HovercardContextProvider],
68681    [CompositeScopedContextProvider, HovercardScopedContextProvider]
68682  );
68683  var useMenuContext = LG4RFBHV_menu.useContext;
68684  var useMenuScopedContext = LG4RFBHV_menu.useScopedContext;
68685  var useMenuProviderContext = LG4RFBHV_menu.useProviderContext;
68686  var MenuContextProvider = LG4RFBHV_menu.ContextProvider;
68687  var MenuScopedContextProvider = LG4RFBHV_menu.ScopedContextProvider;
68688  var useMenuBarContext = (/* unused pure expression or super */ null && (useMenubarContext));
68689  var useMenuBarScopedContext = (/* unused pure expression or super */ null && (useMenubarScopedContext));
68690  var useMenuBarProviderContext = (/* unused pure expression or super */ null && (useMenubarProviderContext));
68691  var MenuBarContextProvider = (/* unused pure expression or super */ null && (MenubarContextProvider));
68692  var MenuBarScopedContextProvider = (/* unused pure expression or super */ null && (MenubarScopedContextProvider));
68693  var MenuItemCheckedContext = (0,external_React_.createContext)(
68694    void 0
68695  );
68696  
68697  
68698  
68699  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/WSQNIDGC.js
68700  "use client";
68701  
68702  
68703  
68704  // src/menubar/menubar-context.tsx
68705  
68706  var menubar = createStoreContext(
68707    [CompositeContextProvider],
68708    [CompositeScopedContextProvider]
68709  );
68710  var WSQNIDGC_useMenubarContext = menubar.useContext;
68711  var WSQNIDGC_useMenubarScopedContext = menubar.useScopedContext;
68712  var WSQNIDGC_useMenubarProviderContext = menubar.useProviderContext;
68713  var WSQNIDGC_MenubarContextProvider = menubar.ContextProvider;
68714  var WSQNIDGC_MenubarScopedContextProvider = menubar.ScopedContextProvider;
68715  var WSQNIDGC_MenuItemCheckedContext = (0,external_React_.createContext)(
68716    void 0
68717  );
68718  
68719  
68720  
68721  ;// CONCATENATED MODULE: ./node_modules/@ariakit/core/esm/menu/menu-store.js
68722  "use client";
68723  
68724  
68725  
68726  
68727  
68728  
68729  
68730  
68731  
68732  
68733  
68734  
68735  // src/menu/menu-store.ts
68736  function createMenuStore(_a = {}) {
68737    var _b = _a, {
68738      combobox,
68739      parent,
68740      menubar
68741    } = _b, props = _3YLGPPWQ_objRest(_b, [
68742      "combobox",
68743      "parent",
68744      "menubar"
68745    ]);
68746    const parentIsMenubar = !!menubar && !parent;
68747    const store = mergeStore(
68748      props.store,
68749      pick2(parent, ["values"]),
68750      omit2(combobox, [
68751        "arrowElement",
68752        "anchorElement",
68753        "contentElement",
68754        "popoverElement",
68755        "disclosureElement"
68756      ])
68757    );
68758    throwOnConflictingProps(props, store);
68759    const syncState = store.getState();
68760    const composite = createCompositeStore(_chunks_3YLGPPWQ_spreadProps(_chunks_3YLGPPWQ_spreadValues({}, props), {
68761      store,
68762      orientation: defaultValue(
68763        props.orientation,
68764        syncState.orientation,
68765        "vertical"
68766      )
68767    }));
68768    const hovercard = createHovercardStore(_chunks_3YLGPPWQ_spreadProps(_chunks_3YLGPPWQ_spreadValues({}, props), {
68769      store,
68770      placement: defaultValue(
68771        props.placement,
68772        syncState.placement,
68773        "bottom-start"
68774      ),
68775      timeout: defaultValue(
68776        props.timeout,
68777        syncState.timeout,
68778        parentIsMenubar ? 0 : 150
68779      ),
68780      hideTimeout: defaultValue(props.hideTimeout, syncState.hideTimeout, 0)
68781    }));
68782    const initialState = _chunks_3YLGPPWQ_spreadProps(_chunks_3YLGPPWQ_spreadValues(_chunks_3YLGPPWQ_spreadValues({}, composite.getState()), hovercard.getState()), {
68783      initialFocus: defaultValue(syncState.initialFocus, "container"),
68784      values: defaultValue(
68785        props.values,
68786        syncState.values,
68787        props.defaultValues,
68788        {}
68789      )
68790    });
68791    const menu = createStore(initialState, composite, hovercard, store);
68792    setup(
68793      menu,
68794      () => sync(menu, ["mounted"], (state) => {
68795        if (state.mounted) return;
68796        menu.setState("activeId", null);
68797      })
68798    );
68799    setup(
68800      menu,
68801      () => sync(parent, ["orientation"], (state) => {
68802        menu.setState(
68803          "placement",
68804          state.orientation === "vertical" ? "right-start" : "bottom-start"
68805        );
68806      })
68807    );
68808    return _chunks_3YLGPPWQ_spreadProps(_chunks_3YLGPPWQ_spreadValues(_chunks_3YLGPPWQ_spreadValues(_chunks_3YLGPPWQ_spreadValues({}, composite), hovercard), menu), {
68809      combobox,
68810      parent,
68811      menubar,
68812      hideAll: () => {
68813        hovercard.hide();
68814        parent == null ? void 0 : parent.hideAll();
68815      },
68816      setInitialFocus: (value) => menu.setState("initialFocus", value),
68817      setValues: (values) => menu.setState("values", values),
68818      setValue: (name, value) => {
68819        if (name === "__proto__") return;
68820        if (name === "constructor") return;
68821        if (Array.isArray(name)) return;
68822        menu.setState("values", (values) => {
68823          const prevValue = values[name];
68824          const nextValue = applyState(value, prevValue);
68825          if (nextValue === prevValue) return values;
68826          return _chunks_3YLGPPWQ_spreadProps(_chunks_3YLGPPWQ_spreadValues({}, values), {
68827            [name]: nextValue !== void 0 && nextValue
68828          });
68829        });
68830      }
68831    });
68832  }
68833  
68834  
68835  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/MS4VD4RJ.js
68836  "use client";
68837  
68838  
68839  
68840  
68841  
68842  
68843  
68844  
68845  
68846  // src/menu/menu-store.ts
68847  
68848  function useMenuStoreProps(store, update, props) {
68849    useUpdateEffect(update, [props.combobox, props.parent, props.menubar]);
68850    useStoreProps(store, props, "values", "setValues");
68851    return Object.assign(
68852      useHovercardStoreProps(
68853        useCompositeStoreProps(store, update, props),
68854        update,
68855        props
68856      ),
68857      {
68858        combobox: props.combobox,
68859        parent: props.parent,
68860        menubar: props.menubar
68861      }
68862    );
68863  }
68864  function useMenuStore(props = {}) {
68865    const parent = useMenuContext();
68866    const menubar = WSQNIDGC_useMenubarContext();
68867    const combobox = useComboboxProviderContext();
68868    props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, props), {
68869      parent: props.parent !== void 0 ? props.parent : parent,
68870      menubar: props.menubar !== void 0 ? props.menubar : menubar,
68871      combobox: props.combobox !== void 0 ? props.combobox : combobox
68872    });
68873    const [store, update] = _2GXGCHW6_useStore(createMenuStore, props);
68874    return useMenuStoreProps(store, update, props);
68875  }
68876  
68877  
68878  
68879  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/menu/menu-button.js
68880  "use client";
68881  
68882  
68883  
68884  
68885  
68886  
68887  
68888  
68889  
68890  
68891  
68892  
68893  
68894  
68895  
68896  
68897  
68898  
68899  
68900  
68901  
68902  
68903  
68904  
68905  
68906  
68907  // src/menu/menu-button.tsx
68908  
68909  
68910  
68911  
68912  var menu_button_TagName = "button";
68913  function getInitialFocus(event, dir) {
68914    const keyMap = {
68915      ArrowDown: dir === "bottom" || dir === "top" ? "first" : false,
68916      ArrowUp: dir === "bottom" || dir === "top" ? "last" : false,
68917      ArrowRight: dir === "right" ? "first" : false,
68918      ArrowLeft: dir === "left" ? "first" : false
68919    };
68920    return keyMap[event.key];
68921  }
68922  function hasActiveItem(items, excludeElement) {
68923    return !!(items == null ? void 0 : items.some((item) => {
68924      if (!item.element) return false;
68925      if (item.element === excludeElement) return false;
68926      return item.element.getAttribute("aria-expanded") === "true";
68927    }));
68928  }
68929  var useMenuButton = createHook(
68930    function useMenuButton2(_a) {
68931      var _b = _a, {
68932        store,
68933        focusable,
68934        accessibleWhenDisabled,
68935        showOnHover
68936      } = _b, props = __objRest(_b, [
68937        "store",
68938        "focusable",
68939        "accessibleWhenDisabled",
68940        "showOnHover"
68941      ]);
68942      const context = useMenuProviderContext();
68943      store = store || context;
68944      invariant(
68945        store,
68946         false && 0
68947      );
68948      const ref = (0,external_React_.useRef)(null);
68949      const parentMenu = store.parent;
68950      const parentMenubar = store.menubar;
68951      const hasParentMenu = !!parentMenu;
68952      const parentIsMenubar = !!parentMenubar && !hasParentMenu;
68953      const disabled = disabledFromProps(props);
68954      const showMenu = () => {
68955        const trigger = ref.current;
68956        if (!trigger) return;
68957        store == null ? void 0 : store.setDisclosureElement(trigger);
68958        store == null ? void 0 : store.setAnchorElement(trigger);
68959        store == null ? void 0 : store.show();
68960      };
68961      const onFocusProp = props.onFocus;
68962      const onFocus = useEvent((event) => {
68963        onFocusProp == null ? void 0 : onFocusProp(event);
68964        if (disabled) return;
68965        if (event.defaultPrevented) return;
68966        store == null ? void 0 : store.setAutoFocusOnShow(false);
68967        store == null ? void 0 : store.setActiveId(null);
68968        if (!parentMenubar) return;
68969        if (!parentIsMenubar) return;
68970        const { items } = parentMenubar.getState();
68971        if (hasActiveItem(items, event.currentTarget)) {
68972          showMenu();
68973        }
68974      });
68975      const dir = store.useState(
68976        (state) => state.placement.split("-")[0]
68977      );
68978      const onKeyDownProp = props.onKeyDown;
68979      const onKeyDown = useEvent((event) => {
68980        onKeyDownProp == null ? void 0 : onKeyDownProp(event);
68981        if (disabled) return;
68982        if (event.defaultPrevented) return;
68983        const initialFocus = getInitialFocus(event, dir);
68984        if (initialFocus) {
68985          event.preventDefault();
68986          showMenu();
68987          store == null ? void 0 : store.setAutoFocusOnShow(true);
68988          store == null ? void 0 : store.setInitialFocus(initialFocus);
68989        }
68990      });
68991      const onClickProp = props.onClick;
68992      const onClick = useEvent((event) => {
68993        onClickProp == null ? void 0 : onClickProp(event);
68994        if (event.defaultPrevented) return;
68995        if (!store) return;
68996        const isKeyboardClick = !event.detail;
68997        const { open } = store.getState();
68998        if (!open || isKeyboardClick) {
68999          if (!hasParentMenu || isKeyboardClick) {
69000            store.setAutoFocusOnShow(true);
69001          }
69002          store.setInitialFocus(isKeyboardClick ? "first" : "container");
69003        }
69004        if (hasParentMenu) {
69005          showMenu();
69006        }
69007      });
69008      props = useWrapElement(
69009        props,
69010        (element) => /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(MenuContextProvider, { value: store, children: element }),
69011        [store]
69012      );
69013      if (hasParentMenu) {
69014        props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, props), {
69015          render: /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(Role.div, { render: props.render })
69016        });
69017      }
69018      const id = useId(props.id);
69019      const parentContentElement = useStoreState(
69020        (parentMenu == null ? void 0 : parentMenu.combobox) || parentMenu,
69021        "contentElement"
69022      );
69023      const role = hasParentMenu || parentIsMenubar ? getPopupItemRole(parentContentElement, "menuitem") : void 0;
69024      const contentElement = store.useState("contentElement");
69025      props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({
69026        id,
69027        role,
69028        "aria-haspopup": getPopupRole(contentElement, "menu")
69029      }, props), {
69030        ref: useMergeRefs(ref, props.ref),
69031        onFocus,
69032        onKeyDown,
69033        onClick
69034      });
69035      props = useHovercardAnchor(_3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({
69036        store,
69037        focusable,
69038        accessibleWhenDisabled
69039      }, props), {
69040        showOnHover: (event) => {
69041          const getShowOnHover = () => {
69042            if (typeof showOnHover === "function") return showOnHover(event);
69043            if (showOnHover != null) return showOnHover;
69044            if (hasParentMenu) return true;
69045            if (!parentMenubar) return false;
69046            const { items } = parentMenubar.getState();
69047            return parentIsMenubar && hasActiveItem(items);
69048          };
69049          const canShowOnHover = getShowOnHover();
69050          if (!canShowOnHover) return false;
69051          const parent = parentIsMenubar ? parentMenubar : parentMenu;
69052          if (!parent) return true;
69053          parent.setActiveId(event.currentTarget.id);
69054          return true;
69055        }
69056      }));
69057      props = usePopoverDisclosure(_3YLGPPWQ_spreadValues({
69058        store,
69059        toggleOnClick: !hasParentMenu,
69060        focusable,
69061        accessibleWhenDisabled
69062      }, props));
69063      props = useCompositeTypeahead(_3YLGPPWQ_spreadValues({
69064        store,
69065        typeahead: parentIsMenubar
69066      }, props));
69067      return props;
69068    }
69069  );
69070  var MenuButton = forwardRef2(function MenuButton2(props) {
69071    const htmlProps = useMenuButton(props);
69072    return HKOOKEDE_createElement(menu_button_TagName, htmlProps);
69073  });
69074  
69075  
69076  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/GFJK2WVK.js
69077  "use client";
69078  
69079  
69080  
69081  
69082  
69083  
69084  
69085  
69086  
69087  // src/menu/menu-list.tsx
69088  
69089  
69090  
69091  var GFJK2WVK_TagName = "div";
69092  function useAriaLabelledBy(_a) {
69093    var _b = _a, { store } = _b, props = __objRest(_b, ["store"]);
69094    const [id, setId] = (0,external_React_.useState)(void 0);
69095    const label = props["aria-label"];
69096    const disclosureElement = useStoreState(store, "disclosureElement");
69097    const contentElement = useStoreState(store, "contentElement");
69098    (0,external_React_.useEffect)(() => {
69099      const disclosure = disclosureElement;
69100      if (!disclosure) return;
69101      const menu = contentElement;
69102      if (!menu) return;
69103      const menuLabel = label || menu.hasAttribute("aria-label");
69104      if (menuLabel) {
69105        setId(void 0);
69106      } else if (disclosure.id) {
69107        setId(disclosure.id);
69108      }
69109    }, [label, disclosureElement, contentElement]);
69110    return id;
69111  }
69112  var useMenuList = createHook(
69113    function useMenuList2(_a) {
69114      var _b = _a, { store, alwaysVisible, composite } = _b, props = __objRest(_b, ["store", "alwaysVisible", "composite"]);
69115      const context = useMenuProviderContext();
69116      store = store || context;
69117      invariant(
69118        store,
69119         false && 0
69120      );
69121      const parentMenu = store.parent;
69122      const parentMenubar = store.menubar;
69123      const hasParentMenu = !!parentMenu;
69124      const id = useId(props.id);
69125      const onKeyDownProp = props.onKeyDown;
69126      const dir = store.useState(
69127        (state) => state.placement.split("-")[0]
69128      );
69129      const orientation = store.useState(
69130        (state) => state.orientation === "both" ? void 0 : state.orientation
69131      );
69132      const isHorizontal = orientation !== "vertical";
69133      const isMenubarHorizontal = useStoreState(
69134        parentMenubar,
69135        (state) => !!state && state.orientation !== "vertical"
69136      );
69137      const onKeyDown = useEvent((event) => {
69138        onKeyDownProp == null ? void 0 : onKeyDownProp(event);
69139        if (event.defaultPrevented) return;
69140        if (hasParentMenu || parentMenubar && !isHorizontal) {
69141          const hideMap = {
69142            ArrowRight: () => dir === "left" && !isHorizontal,
69143            ArrowLeft: () => dir === "right" && !isHorizontal,
69144            ArrowUp: () => dir === "bottom" && isHorizontal,
69145            ArrowDown: () => dir === "top" && isHorizontal
69146          };
69147          const action = hideMap[event.key];
69148          if (action == null ? void 0 : action()) {
69149            event.stopPropagation();
69150            event.preventDefault();
69151            return store == null ? void 0 : store.hide();
69152          }
69153        }
69154        if (parentMenubar) {
69155          const keyMap = {
69156            ArrowRight: () => {
69157              if (!isMenubarHorizontal) return;
69158              return parentMenubar.next();
69159            },
69160            ArrowLeft: () => {
69161              if (!isMenubarHorizontal) return;
69162              return parentMenubar.previous();
69163            },
69164            ArrowDown: () => {
69165              if (isMenubarHorizontal) return;
69166              return parentMenubar.next();
69167            },
69168            ArrowUp: () => {
69169              if (isMenubarHorizontal) return;
69170              return parentMenubar.previous();
69171            }
69172          };
69173          const action = keyMap[event.key];
69174          const id2 = action == null ? void 0 : action();
69175          if (id2 !== void 0) {
69176            event.stopPropagation();
69177            event.preventDefault();
69178            parentMenubar.move(id2);
69179          }
69180        }
69181      });
69182      props = useWrapElement(
69183        props,
69184        (element) => /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(MenuScopedContextProvider, { value: store, children: element }),
69185        [store]
69186      );
69187      const ariaLabelledBy = useAriaLabelledBy(_3YLGPPWQ_spreadValues({ store }, props));
69188      const mounted = store.useState("mounted");
69189      const hidden = isHidden(mounted, props.hidden, alwaysVisible);
69190      const style = hidden ? _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, props.style), { display: "none" }) : props.style;
69191      props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({
69192        id,
69193        "aria-labelledby": ariaLabelledBy,
69194        hidden
69195      }, props), {
69196        ref: useMergeRefs(id ? store.setContentElement : null, props.ref),
69197        style,
69198        onKeyDown
69199      });
69200      const hasCombobox = !!store.combobox;
69201      composite = composite != null ? composite : !hasCombobox;
69202      if (composite) {
69203        props = _3YLGPPWQ_spreadValues({
69204          role: "menu",
69205          "aria-orientation": orientation
69206        }, props);
69207      }
69208      props = useComposite(_3YLGPPWQ_spreadValues({ store, composite }, props));
69209      props = useCompositeTypeahead(_3YLGPPWQ_spreadValues({ store, typeahead: !hasCombobox }, props));
69210      return props;
69211    }
69212  );
69213  var MenuList = forwardRef2(function MenuList2(props) {
69214    const htmlProps = useMenuList(props);
69215    return HKOOKEDE_createElement(GFJK2WVK_TagName, htmlProps);
69216  });
69217  
69218  
69219  
69220  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/menu/menu.js
69221  "use client";
69222  
69223  
69224  
69225  
69226  
69227  
69228  
69229  
69230  
69231  
69232  
69233  
69234  
69235  
69236  
69237  
69238  
69239  
69240  
69241  
69242  
69243  
69244  
69245  
69246  
69247  
69248  
69249  
69250  
69251  
69252  
69253  
69254  
69255  
69256  
69257  
69258  
69259  
69260  
69261  
69262  
69263  
69264  
69265  
69266  
69267  
69268  
69269  
69270  
69271  // src/menu/menu.tsx
69272  
69273  
69274  
69275  
69276  var menu_TagName = "div";
69277  var useMenu = createHook(function useMenu2(_a) {
69278    var _b = _a, {
69279      store,
69280      modal: modalProp = false,
69281      portal = !!modalProp,
69282      hideOnEscape = true,
69283      autoFocusOnShow = true,
69284      hideOnHoverOutside,
69285      alwaysVisible
69286    } = _b, props = __objRest(_b, [
69287      "store",
69288      "modal",
69289      "portal",
69290      "hideOnEscape",
69291      "autoFocusOnShow",
69292      "hideOnHoverOutside",
69293      "alwaysVisible"
69294    ]);
69295    const context = useMenuProviderContext();
69296    store = store || context;
69297    invariant(
69298      store,
69299       false && 0
69300    );
69301    const ref = (0,external_React_.useRef)(null);
69302    const parentMenu = store.parent;
69303    const parentMenubar = store.menubar;
69304    const hasParentMenu = !!parentMenu;
69305    const parentIsMenubar = !!parentMenubar && !hasParentMenu;
69306    props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, props), {
69307      ref: useMergeRefs(ref, props.ref)
69308    });
69309    const _a2 = useMenuList(_3YLGPPWQ_spreadValues({
69310      store,
69311      alwaysVisible
69312    }, props)), { "aria-labelledby": ariaLabelledBy } = _a2, menuListProps = __objRest(_a2, ["aria-labelledby"]);
69313    props = menuListProps;
69314    const [initialFocusRef, setInitialFocusRef] = (0,external_React_.useState)();
69315    const autoFocusOnShowState = store.useState("autoFocusOnShow");
69316    const initialFocus = store.useState("initialFocus");
69317    const baseElement = store.useState("baseElement");
69318    const items = store.useState("renderedItems");
69319    (0,external_React_.useEffect)(() => {
69320      let cleaning = false;
69321      setInitialFocusRef((prevInitialFocusRef) => {
69322        var _a3, _b2, _c;
69323        if (cleaning) return;
69324        if (!autoFocusOnShowState) return;
69325        if ((_a3 = prevInitialFocusRef == null ? void 0 : prevInitialFocusRef.current) == null ? void 0 : _a3.isConnected) return prevInitialFocusRef;
69326        const ref2 = (0,external_React_.createRef)();
69327        switch (initialFocus) {
69328          case "first":
69329            ref2.current = ((_b2 = items.find((item) => !item.disabled && item.element)) == null ? void 0 : _b2.element) || null;
69330            break;
69331          case "last":
69332            ref2.current = ((_c = [...items].reverse().find((item) => !item.disabled && item.element)) == null ? void 0 : _c.element) || null;
69333            break;
69334          default:
69335            ref2.current = baseElement;
69336        }
69337        return ref2;
69338      });
69339      return () => {
69340        cleaning = true;
69341      };
69342    }, [store, autoFocusOnShowState, initialFocus, items, baseElement]);
69343    const modal = hasParentMenu ? false : modalProp;
69344    const mayAutoFocusOnShow = !!autoFocusOnShow;
69345    const canAutoFocusOnShow = !!initialFocusRef || !!props.initialFocus || !!modal;
69346    const contentElement = useStoreState(
69347      store.combobox || store,
69348      "contentElement"
69349    );
69350    const parentContentElement = useStoreState(
69351      (parentMenu == null ? void 0 : parentMenu.combobox) || parentMenu,
69352      "contentElement"
69353    );
69354    const preserveTabOrderAnchor = (0,external_React_.useMemo)(() => {
69355      if (!parentContentElement) return;
69356      if (!contentElement) return;
69357      const role = contentElement.getAttribute("role");
69358      const parentRole = parentContentElement.getAttribute("role");
69359      const parentIsMenuOrMenubar = parentRole === "menu" || parentRole === "menubar";
69360      if (parentIsMenuOrMenubar && role === "menu") return;
69361      return parentContentElement;
69362    }, [contentElement, parentContentElement]);
69363    if (preserveTabOrderAnchor !== void 0) {
69364      props = _3YLGPPWQ_spreadValues({
69365        preserveTabOrderAnchor
69366      }, props);
69367    }
69368    props = useHovercard(_3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({
69369      store,
69370      alwaysVisible,
69371      initialFocus: initialFocusRef,
69372      autoFocusOnShow: mayAutoFocusOnShow ? canAutoFocusOnShow && autoFocusOnShow : autoFocusOnShowState || !!modal
69373    }, props), {
69374      hideOnEscape(event) {
69375        if (isFalsyBooleanCallback(hideOnEscape, event)) return false;
69376        store == null ? void 0 : store.hideAll();
69377        return true;
69378      },
69379      hideOnHoverOutside(event) {
69380        const disclosureElement = store == null ? void 0 : store.getState().disclosureElement;
69381        const getHideOnHoverOutside = () => {
69382          if (typeof hideOnHoverOutside === "function") {
69383            return hideOnHoverOutside(event);
69384          }
69385          if (hideOnHoverOutside != null) return hideOnHoverOutside;
69386          if (hasParentMenu) return true;
69387          if (!parentIsMenubar) return false;
69388          if (!disclosureElement) return true;
69389          if (hasFocusWithin(disclosureElement)) return false;
69390          return true;
69391        };
69392        if (!getHideOnHoverOutside()) return false;
69393        if (event.defaultPrevented) return true;
69394        if (!hasParentMenu) return true;
69395        if (!disclosureElement) return true;
69396        fireEvent(disclosureElement, "mouseout", event);
69397        if (!hasFocusWithin(disclosureElement)) return true;
69398        requestAnimationFrame(() => {
69399          if (hasFocusWithin(disclosureElement)) return;
69400          store == null ? void 0 : store.hide();
69401        });
69402        return false;
69403      },
69404      modal,
69405      portal,
69406      backdrop: hasParentMenu ? false : props.backdrop
69407    }));
69408    props = _3YLGPPWQ_spreadValues({
69409      "aria-labelledby": ariaLabelledBy
69410    }, props);
69411    return props;
69412  });
69413  var Menu = createDialogComponent(
69414    forwardRef2(function Menu2(props) {
69415      const htmlProps = useMenu(props);
69416      return HKOOKEDE_createElement(menu_TagName, htmlProps);
69417    }),
69418    useMenuProviderContext
69419  );
69420  
69421  
69422  ;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/chevron-right-small.js
69423  /**
69424   * WordPress dependencies
69425   */
69426  
69427  
69428  const chevronRightSmall = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, {
69429    xmlns: "http://www.w3.org/2000/svg",
69430    viewBox: "0 0 24 24",
69431    children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, {
69432      d: "M10.8622 8.04053L14.2805 12.0286L10.8622 16.0167L9.72327 15.0405L12.3049 12.0286L9.72327 9.01672L10.8622 8.04053Z"
69433    })
69434  });
69435  /* harmony default export */ const chevron_right_small = (chevronRightSmall);
69436  
69437  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/UQC4RYOT.js
69438  "use client";
69439  
69440  
69441  
69442  
69443  
69444  
69445  
69446  
69447  
69448  // src/menu/menu-item.tsx
69449  
69450  
69451  
69452  
69453  var UQC4RYOT_TagName = "div";
69454  function menuHasFocus(baseElement, items, currentTarget) {
69455    var _a;
69456    if (!baseElement) return false;
69457    if (hasFocusWithin(baseElement)) return true;
69458    const expandedItem = items == null ? void 0 : items.find((item) => {
69459      var _a2;
69460      if (item.element === currentTarget) return false;
69461      return ((_a2 = item.element) == null ? void 0 : _a2.getAttribute("aria-expanded")) === "true";
69462    });
69463    const expandedMenuId = (_a = expandedItem == null ? void 0 : expandedItem.element) == null ? void 0 : _a.getAttribute("aria-controls");
69464    if (!expandedMenuId) return false;
69465    const doc = getDocument(baseElement);
69466    const expandedMenu = doc.getElementById(expandedMenuId);
69467    if (!expandedMenu) return false;
69468    if (hasFocusWithin(expandedMenu)) return true;
69469    return !!expandedMenu.querySelector("[role=menuitem][aria-expanded=true]");
69470  }
69471  var useMenuItem = createHook(
69472    function useMenuItem2(_a) {
69473      var _b = _a, {
69474        store,
69475        hideOnClick = true,
69476        preventScrollOnKeyDown = true,
69477        focusOnHover,
69478        blurOnHoverEnd
69479      } = _b, props = __objRest(_b, [
69480        "store",
69481        "hideOnClick",
69482        "preventScrollOnKeyDown",
69483        "focusOnHover",
69484        "blurOnHoverEnd"
69485      ]);
69486      const menuContext = useMenuScopedContext(true);
69487      const menubarContext = WSQNIDGC_useMenubarScopedContext();
69488      store = store || menuContext || menubarContext;
69489      invariant(
69490        store,
69491         false && 0
69492      );
69493      const onClickProp = props.onClick;
69494      const hideOnClickProp = useBooleanEvent(hideOnClick);
69495      const hideMenu = "hideAll" in store ? store.hideAll : void 0;
69496      const isWithinMenu = !!hideMenu;
69497      const onClick = useEvent((event) => {
69498        onClickProp == null ? void 0 : onClickProp(event);
69499        if (event.defaultPrevented) return;
69500        if (isDownloading(event)) return;
69501        if (isOpeningInNewTab(event)) return;
69502        if (!hideMenu) return;
69503        const popupType = event.currentTarget.getAttribute("aria-haspopup");
69504        if (popupType === "menu") return;
69505        if (!hideOnClickProp(event)) return;
69506        hideMenu();
69507      });
69508      const contentElement = useStoreState(
69509        store,
69510        (state) => "contentElement" in state ? state.contentElement : null
69511      );
69512      const role = getPopupItemRole(contentElement, "menuitem");
69513      props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({
69514        role
69515      }, props), {
69516        onClick
69517      });
69518      props = useCompositeItem(_3YLGPPWQ_spreadValues({
69519        store,
69520        preventScrollOnKeyDown
69521      }, props));
69522      props = useCompositeHover(_3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({
69523        store
69524      }, props), {
69525        focusOnHover(event) {
69526          const getFocusOnHover = () => {
69527            if (typeof focusOnHover === "function") return focusOnHover(event);
69528            if (focusOnHover != null) return focusOnHover;
69529            return true;
69530          };
69531          if (!store) return false;
69532          if (!getFocusOnHover()) return false;
69533          const { baseElement, items } = store.getState();
69534          if (isWithinMenu) {
69535            if (event.currentTarget.hasAttribute("aria-expanded")) {
69536              event.currentTarget.focus();
69537            }
69538            return true;
69539          }
69540          if (menuHasFocus(baseElement, items, event.currentTarget)) {
69541            event.currentTarget.focus();
69542            return true;
69543          }
69544          return false;
69545        },
69546        blurOnHoverEnd(event) {
69547          if (typeof blurOnHoverEnd === "function") return blurOnHoverEnd(event);
69548          if (blurOnHoverEnd != null) return blurOnHoverEnd;
69549          return isWithinMenu;
69550        }
69551      }));
69552      return props;
69553    }
69554  );
69555  var UQC4RYOT_MenuItem = memo2(
69556    forwardRef2(function MenuItem2(props) {
69557      const htmlProps = useMenuItem(props);
69558      return HKOOKEDE_createElement(UQC4RYOT_TagName, htmlProps);
69559    })
69560  );
69561  
69562  
69563  
69564  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/AUGWLYYL.js
69565  "use client";
69566  
69567  
69568  // src/checkbox/checkbox-context.tsx
69569  var AUGWLYYL_ctx = createStoreContext();
69570  var useCheckboxContext = AUGWLYYL_ctx.useContext;
69571  var useCheckboxScopedContext = AUGWLYYL_ctx.useScopedContext;
69572  var useCheckboxProviderContext = AUGWLYYL_ctx.useProviderContext;
69573  var CheckboxContextProvider = AUGWLYYL_ctx.ContextProvider;
69574  var CheckboxScopedContextProvider = AUGWLYYL_ctx.ScopedContextProvider;
69575  
69576  
69577  
69578  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/U5ZVLSUU.js
69579  "use client";
69580  
69581  
69582  
69583  
69584  
69585  
69586  
69587  
69588  // src/checkbox/checkbox.tsx
69589  
69590  
69591  
69592  var U5ZVLSUU_TagName = "input";
69593  function setMixed(element, mixed) {
69594    if (mixed) {
69595      element.indeterminate = true;
69596    } else if (element.indeterminate) {
69597      element.indeterminate = false;
69598    }
69599  }
69600  function isNativeCheckbox(tagName, type) {
69601    return tagName === "input" && (!type || type === "checkbox");
69602  }
69603  function getPrimitiveValue(value) {
69604    if (Array.isArray(value)) {
69605      return value.toString();
69606    }
69607    return value;
69608  }
69609  var useCheckbox = createHook(
69610    function useCheckbox2(_a) {
69611      var _b = _a, {
69612        store,
69613        name,
69614        value: valueProp,
69615        checked: checkedProp,
69616        defaultChecked
69617      } = _b, props = __objRest(_b, [
69618        "store",
69619        "name",
69620        "value",
69621        "checked",
69622        "defaultChecked"
69623      ]);
69624      const context = useCheckboxContext();
69625      store = store || context;
69626      const [_checked, setChecked] = (0,external_React_.useState)(defaultChecked != null ? defaultChecked : false);
69627      const checked = useStoreState(store, (state) => {
69628        if (checkedProp !== void 0) return checkedProp;
69629        if ((state == null ? void 0 : state.value) === void 0) return _checked;
69630        if (valueProp != null) {
69631          if (Array.isArray(state.value)) {
69632            const primitiveValue = getPrimitiveValue(valueProp);
69633            return state.value.includes(primitiveValue);
69634          }
69635          return state.value === valueProp;
69636        }
69637        if (Array.isArray(state.value)) return false;
69638        if (typeof state.value === "boolean") return state.value;
69639        return false;
69640      });
69641      const ref = (0,external_React_.useRef)(null);
69642      const tagName = useTagName(ref, U5ZVLSUU_TagName);
69643      const nativeCheckbox = isNativeCheckbox(tagName, props.type);
69644      const mixed = checked ? checked === "mixed" : void 0;
69645      const isChecked = checked === "mixed" ? false : checked;
69646      const disabled = disabledFromProps(props);
69647      const [propertyUpdated, schedulePropertyUpdate] = useForceUpdate();
69648      (0,external_React_.useEffect)(() => {
69649        const element = ref.current;
69650        if (!element) return;
69651        setMixed(element, mixed);
69652        if (nativeCheckbox) return;
69653        element.checked = isChecked;
69654        if (name !== void 0) {
69655          element.name = name;
69656        }
69657        if (valueProp !== void 0) {
69658          element.value = `$valueProp}`;
69659        }
69660      }, [propertyUpdated, mixed, nativeCheckbox, isChecked, name, valueProp]);
69661      const onChangeProp = props.onChange;
69662      const onChange = useEvent((event) => {
69663        if (disabled) {
69664          event.stopPropagation();
69665          event.preventDefault();
69666          return;
69667        }
69668        setMixed(event.currentTarget, mixed);
69669        if (!nativeCheckbox) {
69670          event.currentTarget.checked = !event.currentTarget.checked;
69671          schedulePropertyUpdate();
69672        }
69673        onChangeProp == null ? void 0 : onChangeProp(event);
69674        if (event.defaultPrevented) return;
69675        const elementChecked = event.currentTarget.checked;
69676        setChecked(elementChecked);
69677        store == null ? void 0 : store.setValue((prevValue) => {
69678          if (valueProp == null) return elementChecked;
69679          const primitiveValue = getPrimitiveValue(valueProp);
69680          if (!Array.isArray(prevValue)) {
69681            return prevValue === primitiveValue ? false : primitiveValue;
69682          }
69683          if (elementChecked) {
69684            if (prevValue.includes(primitiveValue)) {
69685              return prevValue;
69686            }
69687            return [...prevValue, primitiveValue];
69688          }
69689          return prevValue.filter((v) => v !== primitiveValue);
69690        });
69691      });
69692      const onClickProp = props.onClick;
69693      const onClick = useEvent((event) => {
69694        onClickProp == null ? void 0 : onClickProp(event);
69695        if (event.defaultPrevented) return;
69696        if (nativeCheckbox) return;
69697        onChange(event);
69698      });
69699      props = useWrapElement(
69700        props,
69701        (element) => /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(CheckboxCheckedContext.Provider, { value: isChecked, children: element }),
69702        [isChecked]
69703      );
69704      props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({
69705        role: !nativeCheckbox ? "checkbox" : void 0,
69706        type: nativeCheckbox ? "checkbox" : void 0,
69707        "aria-checked": checked
69708      }, props), {
69709        ref: useMergeRefs(ref, props.ref),
69710        onChange,
69711        onClick
69712      });
69713      props = useCommand(_3YLGPPWQ_spreadValues({ clickOnEnter: !nativeCheckbox }, props));
69714      return removeUndefinedValues(_3YLGPPWQ_spreadValues({
69715        name: nativeCheckbox ? name : void 0,
69716        value: nativeCheckbox ? valueProp : void 0,
69717        checked: isChecked
69718      }, props));
69719    }
69720  );
69721  var Checkbox = forwardRef2(function Checkbox2(props) {
69722    const htmlProps = useCheckbox(props);
69723    return HKOOKEDE_createElement(U5ZVLSUU_TagName, htmlProps);
69724  });
69725  
69726  
69727  
69728  ;// CONCATENATED MODULE: ./node_modules/@ariakit/core/esm/checkbox/checkbox-store.js
69729  "use client";
69730  
69731  
69732  
69733  
69734  // src/checkbox/checkbox-store.ts
69735  function createCheckboxStore(props = {}) {
69736    var _a;
69737    throwOnConflictingProps(props, props.store);
69738    const syncState = (_a = props.store) == null ? void 0 : _a.getState();
69739    const initialState = {
69740      value: defaultValue(
69741        props.value,
69742        syncState == null ? void 0 : syncState.value,
69743        props.defaultValue,
69744        false
69745      )
69746    };
69747    const checkbox = createStore(initialState, props.store);
69748    return _chunks_3YLGPPWQ_spreadProps(_chunks_3YLGPPWQ_spreadValues({}, checkbox), {
69749      setValue: (value) => checkbox.setState("value", value)
69750    });
69751  }
69752  
69753  
69754  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/EJOTW52C.js
69755  "use client";
69756  
69757  
69758  
69759  // src/checkbox/checkbox-store.ts
69760  
69761  function useCheckboxStoreProps(store, update, props) {
69762    useUpdateEffect(update, [props.store]);
69763    useStoreProps(store, props, "value", "setValue");
69764    return store;
69765  }
69766  function useCheckboxStore(props = {}) {
69767    const [store, update] = _2GXGCHW6_useStore(createCheckboxStore, props);
69768    return useCheckboxStoreProps(store, update, props);
69769  }
69770  
69771  
69772  
69773  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/menu/menu-item-checkbox.js
69774  "use client";
69775  
69776  
69777  
69778  
69779  
69780  
69781  
69782  
69783  
69784  
69785  
69786  
69787  
69788  
69789  
69790  
69791  
69792  
69793  
69794  
69795  
69796  
69797  
69798  
69799  
69800  
69801  // src/menu/menu-item-checkbox.tsx
69802  
69803  
69804  var menu_item_checkbox_TagName = "div";
69805  function menu_item_checkbox_getPrimitiveValue(value) {
69806    if (Array.isArray(value)) {
69807      return value.toString();
69808    }
69809    return value;
69810  }
69811  function getValue(storeValue, value, checked) {
69812    if (value === void 0) {
69813      if (Array.isArray(storeValue)) return storeValue;
69814      return !!checked;
69815    }
69816    const primitiveValue = menu_item_checkbox_getPrimitiveValue(value);
69817    if (!Array.isArray(storeValue)) {
69818      if (checked) {
69819        return primitiveValue;
69820      }
69821      return storeValue === primitiveValue ? false : storeValue;
69822    }
69823    if (checked) {
69824      if (storeValue.includes(primitiveValue)) {
69825        return storeValue;
69826      }
69827      return [...storeValue, primitiveValue];
69828    }
69829    return storeValue.filter((v) => v !== primitiveValue);
69830  }
69831  var useMenuItemCheckbox = createHook(
69832    function useMenuItemCheckbox2(_a) {
69833      var _b = _a, {
69834        store,
69835        name,
69836        value,
69837        checked,
69838        defaultChecked: defaultCheckedProp,
69839        hideOnClick = false
69840      } = _b, props = __objRest(_b, [
69841        "store",
69842        "name",
69843        "value",
69844        "checked",
69845        "defaultChecked",
69846        "hideOnClick"
69847      ]);
69848      const context = useMenuScopedContext();
69849      store = store || context;
69850      invariant(
69851        store,
69852         false && 0
69853      );
69854      const defaultChecked = useInitialValue(defaultCheckedProp);
69855      (0,external_React_.useEffect)(() => {
69856        store == null ? void 0 : store.setValue(name, (prevValue = []) => {
69857          if (!defaultChecked) return prevValue;
69858          return getValue(prevValue, value, true);
69859        });
69860      }, [store, name, value, defaultChecked]);
69861      (0,external_React_.useEffect)(() => {
69862        if (checked === void 0) return;
69863        store == null ? void 0 : store.setValue(name, (prevValue) => {
69864          return getValue(prevValue, value, checked);
69865        });
69866      }, [store, name, value, checked]);
69867      const checkboxStore = useCheckboxStore({
69868        value: store.useState((state) => state.values[name]),
69869        setValue(internalValue) {
69870          store == null ? void 0 : store.setValue(name, () => {
69871            if (checked === void 0) return internalValue;
69872            const nextValue = getValue(internalValue, value, checked);
69873            if (!Array.isArray(nextValue)) return nextValue;
69874            if (!Array.isArray(internalValue)) return nextValue;
69875            if (shallowEqual(internalValue, nextValue)) return internalValue;
69876            return nextValue;
69877          });
69878        }
69879      });
69880      props = _3YLGPPWQ_spreadValues({
69881        role: "menuitemcheckbox"
69882      }, props);
69883      props = useCheckbox(_3YLGPPWQ_spreadValues({
69884        store: checkboxStore,
69885        name,
69886        value,
69887        checked
69888      }, props));
69889      props = useMenuItem(_3YLGPPWQ_spreadValues({ store, hideOnClick }, props));
69890      return props;
69891    }
69892  );
69893  var MenuItemCheckbox = memo2(
69894    forwardRef2(function MenuItemCheckbox2(props) {
69895      const htmlProps = useMenuItemCheckbox(props);
69896      return HKOOKEDE_createElement(menu_item_checkbox_TagName, htmlProps);
69897    })
69898  );
69899  
69900  
69901  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/menu/menu-item-radio.js
69902  "use client";
69903  
69904  
69905  
69906  
69907  
69908  
69909  
69910  
69911  
69912  
69913  
69914  
69915  
69916  
69917  
69918  
69919  
69920  
69921  
69922  
69923  
69924  
69925  
69926  
69927  // src/menu/menu-item-radio.tsx
69928  
69929  
69930  
69931  var menu_item_radio_TagName = "div";
69932  function menu_item_radio_getValue(prevValue, value, checked) {
69933    if (checked === void 0) return prevValue;
69934    if (checked) return value;
69935    return prevValue;
69936  }
69937  var useMenuItemRadio = createHook(
69938    function useMenuItemRadio2(_a) {
69939      var _b = _a, {
69940        store,
69941        name,
69942        value,
69943        checked,
69944        onChange: onChangeProp,
69945        hideOnClick = false
69946      } = _b, props = __objRest(_b, [
69947        "store",
69948        "name",
69949        "value",
69950        "checked",
69951        "onChange",
69952        "hideOnClick"
69953      ]);
69954      const context = useMenuScopedContext();
69955      store = store || context;
69956      invariant(
69957        store,
69958         false && 0
69959      );
69960      const defaultChecked = useInitialValue(props.defaultChecked);
69961      (0,external_React_.useEffect)(() => {
69962        store == null ? void 0 : store.setValue(name, (prevValue = false) => {
69963          return menu_item_radio_getValue(prevValue, value, defaultChecked);
69964        });
69965      }, [store, name, value, defaultChecked]);
69966      (0,external_React_.useEffect)(() => {
69967        if (checked === void 0) return;
69968        store == null ? void 0 : store.setValue(name, (prevValue) => {
69969          return menu_item_radio_getValue(prevValue, value, checked);
69970        });
69971      }, [store, name, value, checked]);
69972      const isChecked = store.useState((state) => state.values[name] === value);
69973      props = useWrapElement(
69974        props,
69975        (element) => /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(MenuItemCheckedContext.Provider, { value: !!isChecked, children: element }),
69976        [isChecked]
69977      );
69978      props = _3YLGPPWQ_spreadValues({
69979        role: "menuitemradio"
69980      }, props);
69981      props = useRadio(_3YLGPPWQ_spreadValues({
69982        name,
69983        value,
69984        checked: isChecked,
69985        onChange(event) {
69986          onChangeProp == null ? void 0 : onChangeProp(event);
69987          if (event.defaultPrevented) return;
69988          const element = event.currentTarget;
69989          store == null ? void 0 : store.setValue(name, (prevValue) => {
69990            return menu_item_radio_getValue(prevValue, value, checked != null ? checked : element.checked);
69991          });
69992        }
69993      }, props));
69994      props = useMenuItem(_3YLGPPWQ_spreadValues({ store, hideOnClick }, props));
69995      return props;
69996    }
69997  );
69998  var MenuItemRadio = memo2(
69999    forwardRef2(function MenuItemRadio2(props) {
70000      const htmlProps = useMenuItemRadio(props);
70001      return HKOOKEDE_createElement(menu_item_radio_TagName, htmlProps);
70002    })
70003  );
70004  
70005  
70006  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/menu/menu-group.js
70007  "use client";
70008  
70009  
70010  
70011  
70012  
70013  
70014  
70015  
70016  // src/menu/menu-group.tsx
70017  var menu_group_TagName = "div";
70018  var useMenuGroup = createHook(
70019    function useMenuGroup2(props) {
70020      props = useCompositeGroup(props);
70021      return props;
70022    }
70023  );
70024  var menu_group_MenuGroup = forwardRef2(function MenuGroup2(props) {
70025    const htmlProps = useMenuGroup(props);
70026    return HKOOKEDE_createElement(menu_group_TagName, htmlProps);
70027  });
70028  
70029  
70030  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/menu/menu-group-label.js
70031  "use client";
70032  
70033  
70034  
70035  
70036  
70037  
70038  
70039  
70040  // src/menu/menu-group-label.tsx
70041  var menu_group_label_TagName = "div";
70042  var useMenuGroupLabel = createHook(
70043    function useMenuGroupLabel2(props) {
70044      props = useCompositeGroupLabel(props);
70045      return props;
70046    }
70047  );
70048  var MenuGroupLabel = forwardRef2(function MenuGroupLabel2(props) {
70049    const htmlProps = useMenuGroupLabel(props);
70050    return HKOOKEDE_createElement(menu_group_label_TagName, htmlProps);
70051  });
70052  
70053  
70054  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/WEEEI3KU.js
70055  "use client";
70056  
70057  
70058  
70059  
70060  
70061  // src/composite/composite-separator.tsx
70062  
70063  var WEEEI3KU_TagName = "hr";
70064  var useCompositeSeparator = createHook(function useCompositeSeparator2(_a) {
70065    var _b = _a, { store } = _b, props = __objRest(_b, ["store"]);
70066    const context = useCompositeContext();
70067    store = store || context;
70068    invariant(
70069      store,
70070       false && 0
70071    );
70072    const orientation = store.useState(
70073      (state) => state.orientation === "horizontal" ? "vertical" : "horizontal"
70074    );
70075    props = useSeparator(_3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, props), { orientation }));
70076    return props;
70077  });
70078  var CompositeSeparator = forwardRef2(function CompositeSeparator2(props) {
70079    const htmlProps = useCompositeSeparator(props);
70080    return HKOOKEDE_createElement(WEEEI3KU_TagName, htmlProps);
70081  });
70082  
70083  
70084  
70085  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/menu/menu-separator.js
70086  "use client";
70087  
70088  
70089  
70090  
70091  
70092  
70093  
70094  
70095  
70096  
70097  
70098  
70099  
70100  
70101  
70102  // src/menu/menu-separator.tsx
70103  var menu_separator_TagName = "hr";
70104  var useMenuSeparator = createHook(
70105    function useMenuSeparator2(_a) {
70106      var _b = _a, { store } = _b, props = __objRest(_b, ["store"]);
70107      const context = useMenuContext();
70108      store = store || context;
70109      props = useCompositeSeparator(_3YLGPPWQ_spreadValues({ store }, props));
70110      return props;
70111    }
70112  );
70113  var MenuSeparator = forwardRef2(function MenuSeparator2(props) {
70114    const htmlProps = useMenuSeparator(props);
70115    return HKOOKEDE_createElement(menu_separator_TagName, htmlProps);
70116  });
70117  
70118  
70119  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/dropdown-menu-v2/styles.js
70120  
70121  function dropdown_menu_v2_styles_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)."; }
70122  /**
70123   * External dependencies
70124   */
70125  
70126  
70127  /**
70128   * Internal dependencies
70129   */
70130  
70131  
70132  
70133  
70134  const styles_ANIMATION_PARAMS = {
70135    SCALE_AMOUNT_OUTER: 0.82,
70136    SCALE_AMOUNT_CONTENT: 0.9,
70137    DURATION: {
70138      IN: '400ms',
70139      OUT: '200ms'
70140    },
70141    EASING: 'cubic-bezier(0.33, 0, 0, 1)'
70142  };
70143  const CONTENT_WRAPPER_PADDING = space(1);
70144  const ITEM_PADDING_BLOCK = space(2);
70145  const ITEM_PADDING_INLINE = space(3);
70146  
70147  // TODO:
70148  // - border color and divider color are different from COLORS.theme variables
70149  // - lighter text color is not defined in COLORS.theme, should it be?
70150  // - lighter background color is not defined in COLORS.theme, should it be?
70151  const DEFAULT_BORDER_COLOR = COLORS.theme.gray[300];
70152  const DIVIDER_COLOR = COLORS.theme.gray[200];
70153  const LIGHTER_TEXT_COLOR = COLORS.theme.gray[700];
70154  const LIGHT_BACKGROUND_COLOR = COLORS.theme.gray[100];
70155  const TOOLBAR_VARIANT_BORDER_COLOR = COLORS.theme.foreground;
70156  const DEFAULT_BOX_SHADOW = `0 0 0 $config_values.borderWidth} $DEFAULT_BORDER_COLOR}, $config_values.elevationMedium}`;
70157  const TOOLBAR_VARIANT_BOX_SHADOW = `0 0 0 $config_values.borderWidth} $TOOLBAR_VARIANT_BORDER_COLOR}`;
70158  const GRID_TEMPLATE_COLS = 'minmax( 0, max-content ) 1fr';
70159  const MenuPopoverOuterWrapper = /*#__PURE__*/emotion_styled_base_browser_esm("div",  true ? {
70160    target: "e1kdzosf14"
70161  } : 0)("position:relative;background-color:", COLORS.ui.background, ";border-radius:", config_values.radiusMedium, ";", props => /*#__PURE__*/emotion_react_browser_esm_css("box-shadow:", props.variant === 'toolbar' ? TOOLBAR_VARIANT_BOX_SHADOW : DEFAULT_BOX_SHADOW, ";" + ( true ? "" : 0),  true ? "" : 0), " overflow:hidden;@media not ( prefers-reduced-motion ){transition-property:transform,opacity;transition-timing-function:", styles_ANIMATION_PARAMS.EASING, ";transition-duration:", styles_ANIMATION_PARAMS.DURATION.IN, ";will-change:transform,opacity;opacity:0;&:has( [data-enter] ){opacity:1;}&:has( [data-leave] ){transition-duration:", styles_ANIMATION_PARAMS.DURATION.OUT, ";}&:has( [data-side='bottom'] ),&:has( [data-side='top'] ){transform:scaleY( ", styles_ANIMATION_PARAMS.SCALE_AMOUNT_OUTER, " );}&:has( [data-side='bottom'] ){transform-origin:top;}&:has( [data-side='top'] ){transform-origin:bottom;}&:has( [data-enter][data-side='bottom'] ),&:has( [data-enter][data-side='top'] ),&:has( [data-leave][data-side='bottom'] ),&:has( [data-leave][data-side='top'] ){transform:scaleY( 1 );}}" + ( true ? "" : 0));
70162  const MenuPopoverInnerWrapper = /*#__PURE__*/emotion_styled_base_browser_esm("div",  true ? {
70163    target: "e1kdzosf13"
70164  } : 0)("position:relative;z-index:1000000;display:grid;grid-template-columns:", GRID_TEMPLATE_COLS, ";grid-template-rows:auto;box-sizing:border-box;min-width:160px;max-width:320px;max-height:var( --popover-available-height );padding:", CONTENT_WRAPPER_PADDING, ";overscroll-behavior:contain;overflow:auto;outline:2px solid transparent!important;@media not ( prefers-reduced-motion ){transition:inherit;transform-origin:inherit;&[data-side='bottom'],&[data-side='top']{transform:scaleY(\n\t\t\t\tcalc(\n\t\t\t\t\t1 / ", styles_ANIMATION_PARAMS.SCALE_AMOUNT_OUTER, " *\n\t\t\t\t\t\t", styles_ANIMATION_PARAMS.SCALE_AMOUNT_CONTENT, "\n\t\t\t\t)\n\t\t\t);}&[data-enter][data-side='bottom'],&[data-enter][data-side='top'],&[data-leave][data-side='bottom'],&[data-leave][data-side='top']{transform:scaleY( 1 );}}" + ( true ? "" : 0));
70165  const baseItem = /*#__PURE__*/emotion_react_browser_esm_css("all:unset;position:relative;min-height:", space(10), ";box-sizing:border-box;grid-column:1/-1;display:grid;grid-template-columns:", GRID_TEMPLATE_COLS, ";align-items:center;@supports ( grid-template-columns: subgrid ){grid-template-columns:subgrid;}font-size:", font('default.fontSize'), ";font-family:inherit;font-weight:normal;line-height:20px;color:", COLORS.theme.foreground, ";border-radius:", config_values.radiusSmall, ";padding-block:", ITEM_PADDING_BLOCK, ";padding-inline:", ITEM_PADDING_INLINE, ";scroll-margin:", CONTENT_WRAPPER_PADDING, ";user-select:none;outline:none;&[aria-disabled='true']{color:", COLORS.ui.textDisabled, ";cursor:not-allowed;}&[data-active-item]:not( [data-focus-visible] ):not(\n\t\t\t[aria-disabled='true']\n\t\t){background-color:", COLORS.theme.accent, ";color:", COLORS.white, ";}&[data-focus-visible]{box-shadow:0 0 0 1.5px ", COLORS.theme.accent, ";outline:2px solid transparent;}&:active,&[data-active]{}", MenuPopoverInnerWrapper, ":not(:focus) &:not(:focus)[aria-expanded=\"true\"]{background-color:", LIGHT_BACKGROUND_COLOR, ";color:", COLORS.theme.foreground, ";}svg{fill:currentColor;}" + ( true ? "" : 0),  true ? "" : 0);
70166  const styles_DropdownMenuItem = /*#__PURE__*/emotion_styled_base_browser_esm(UQC4RYOT_MenuItem,  true ? {
70167    target: "e1kdzosf12"
70168  } : 0)(baseItem, ";" + ( true ? "" : 0));
70169  const styles_DropdownMenuCheckboxItem = /*#__PURE__*/emotion_styled_base_browser_esm(MenuItemCheckbox,  true ? {
70170    target: "e1kdzosf11"
70171  } : 0)(baseItem, ";" + ( true ? "" : 0));
70172  const styles_DropdownMenuRadioItem = /*#__PURE__*/emotion_styled_base_browser_esm(MenuItemRadio,  true ? {
70173    target: "e1kdzosf10"
70174  } : 0)(baseItem, ";" + ( true ? "" : 0));
70175  const ItemPrefixWrapper = /*#__PURE__*/emotion_styled_base_browser_esm("span",  true ? {
70176    target: "e1kdzosf9"
70177  } : 0)("grid-column:1;", styles_DropdownMenuCheckboxItem, ">&,", styles_DropdownMenuRadioItem, ">&{min-width:", space(6), ";}", styles_DropdownMenuCheckboxItem, ">&,", styles_DropdownMenuRadioItem, ">&,&:not( :empty ){margin-inline-end:", space(2), ";}display:flex;align-items:center;justify-content:center;color:", LIGHTER_TEXT_COLOR, ";[data-active-item]:not( [data-focus-visible] )>&,[aria-disabled='true']>&{color:inherit;}" + ( true ? "" : 0));
70178  const DropdownMenuItemContentWrapper = /*#__PURE__*/emotion_styled_base_browser_esm("div",  true ? {
70179    target: "e1kdzosf8"
70180  } : 0)("grid-column:2;display:flex;align-items:center;justify-content:space-between;gap:", space(3), ";pointer-events:none;" + ( true ? "" : 0));
70181  const DropdownMenuItemChildrenWrapper = /*#__PURE__*/emotion_styled_base_browser_esm("div",  true ? {
70182    target: "e1kdzosf7"
70183  } : 0)("flex:1;display:inline-flex;flex-direction:column;gap:", space(1), ";" + ( true ? "" : 0));
70184  const ItemSuffixWrapper = /*#__PURE__*/emotion_styled_base_browser_esm("span",  true ? {
70185    target: "e1kdzosf6"
70186  } : 0)("flex:0 1 fit-content;min-width:0;width:fit-content;display:flex;align-items:center;justify-content:center;gap:", space(3), ";color:", LIGHTER_TEXT_COLOR, ";[data-active-item]:not( [data-focus-visible] ) *:not(", MenuPopoverInnerWrapper, ") &,[aria-disabled='true'] *:not(", MenuPopoverInnerWrapper, ") &{color:inherit;}" + ( true ? "" : 0));
70187  const styles_DropdownMenuGroup = /*#__PURE__*/emotion_styled_base_browser_esm(menu_group_MenuGroup,  true ? {
70188    target: "e1kdzosf5"
70189  } : 0)( true ? {
70190    name: "49aokf",
70191    styles: "display:contents"
70192  } : 0);
70193  const DropdownMenuGroupLabel = /*#__PURE__*/emotion_styled_base_browser_esm(MenuGroupLabel,  true ? {
70194    target: "e1kdzosf4"
70195  } : 0)("grid-column:1/-1;padding-block-start:", space(3), ";padding-block-end:", space(2), ";padding-inline:", ITEM_PADDING_INLINE, ";" + ( true ? "" : 0));
70196  const styles_DropdownMenuSeparator = /*#__PURE__*/emotion_styled_base_browser_esm(MenuSeparator,  true ? {
70197    target: "e1kdzosf3"
70198  } : 0)("grid-column:1/-1;border:none;height:", config_values.borderWidth, ";background-color:", props => props.variant === 'toolbar' ? TOOLBAR_VARIANT_BORDER_COLOR : DIVIDER_COLOR, ";margin-block:", space(2), ";margin-inline:", ITEM_PADDING_INLINE, ";outline:2px solid transparent;" + ( true ? "" : 0));
70199  const SubmenuChevronIcon = /*#__PURE__*/emotion_styled_base_browser_esm(build_module_icon,  true ? {
70200    target: "e1kdzosf2"
70201  } : 0)("width:", space(1.5), ";", rtl({
70202    transform: `scaleX(1)`
70203  }, {
70204    transform: `scaleX(-1)`
70205  }), ";" + ( true ? "" : 0));
70206  const styles_DropdownMenuItemLabel = /*#__PURE__*/emotion_styled_base_browser_esm(truncate_component,  true ? {
70207    target: "e1kdzosf1"
70208  } : 0)("font-size:", font('default.fontSize'), ";line-height:20px;color:inherit;" + ( true ? "" : 0));
70209  const styles_DropdownMenuItemHelpText = /*#__PURE__*/emotion_styled_base_browser_esm(truncate_component,  true ? {
70210    target: "e1kdzosf0"
70211  } : 0)("font-size:", font('helpText.fontSize'), ";line-height:16px;color:", LIGHTER_TEXT_COLOR, ";word-break:break-all;[data-active-item]:not( [data-focus-visible] ) *:not( ", MenuPopoverInnerWrapper, " ) &,[aria-disabled='true'] *:not( ", MenuPopoverInnerWrapper, " ) &{color:inherit;}" + ( true ? "" : 0));
70212  
70213  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/dropdown-menu-v2/context.js
70214  /**
70215   * WordPress dependencies
70216   */
70217  
70218  
70219  /**
70220   * Internal dependencies
70221   */
70222  
70223  const DropdownMenuContext = (0,external_wp_element_namespaceObject.createContext)(undefined);
70224  
70225  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/dropdown-menu-v2/use-temporary-focus-visible-fix.js
70226  /**
70227   * WordPress dependencies
70228   */
70229  
70230  function useTemporaryFocusVisibleFix({
70231    onBlur: onBlurProp
70232  }) {
70233    const [focusVisible, setFocusVisible] = (0,external_wp_element_namespaceObject.useState)(false);
70234    return {
70235      'data-focus-visible': focusVisible || undefined,
70236      onFocusVisible: () => {
70237        (0,external_wp_element_namespaceObject.flushSync)(() => setFocusVisible(true));
70238      },
70239      onBlur: event => {
70240        onBlurProp?.(event);
70241        setFocusVisible(false);
70242      }
70243    };
70244  }
70245  
70246  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/dropdown-menu-v2/item.js
70247  /**
70248   * WordPress dependencies
70249   */
70250  
70251  
70252  /**
70253   * Internal dependencies
70254   */
70255  
70256  
70257  
70258  
70259  
70260  
70261  const DropdownMenuItem = (0,external_wp_element_namespaceObject.forwardRef)(function DropdownMenuItem({
70262    prefix,
70263    suffix,
70264    children,
70265    onBlur,
70266    hideOnClick = true,
70267    ...props
70268  }, ref) {
70269    // TODO: Remove when https://github.com/ariakit/ariakit/issues/4083 is fixed
70270    const focusVisibleFixProps = useTemporaryFocusVisibleFix({
70271      onBlur
70272    });
70273    const dropdownMenuContext = (0,external_wp_element_namespaceObject.useContext)(DropdownMenuContext);
70274    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(styles_DropdownMenuItem, {
70275      ref: ref,
70276      ...props,
70277      ...focusVisibleFixProps,
70278      accessibleWhenDisabled: true,
70279      hideOnClick: hideOnClick,
70280      store: dropdownMenuContext?.store,
70281      children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ItemPrefixWrapper, {
70282        children: prefix
70283      }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(DropdownMenuItemContentWrapper, {
70284        children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(DropdownMenuItemChildrenWrapper, {
70285          children: children
70286        }), suffix && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ItemSuffixWrapper, {
70287          children: suffix
70288        })]
70289      })]
70290    });
70291  });
70292  
70293  ;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/menu/menu-item-check.js
70294  "use client";
70295  
70296  
70297  
70298  
70299  
70300  
70301  
70302  
70303  
70304  
70305  
70306  
70307  
70308  
70309  
70310  // src/menu/menu-item-check.tsx
70311  
70312  var menu_item_check_TagName = "span";
70313  var useMenuItemCheck = createHook(
70314    function useMenuItemCheck2(_a) {
70315      var _b = _a, { store, checked } = _b, props = __objRest(_b, ["store", "checked"]);
70316      const context = (0,external_React_.useContext)(MenuItemCheckedContext);
70317      checked = checked != null ? checked : context;
70318      props = useCheckboxCheck(_3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, props), { checked }));
70319      return props;
70320    }
70321  );
70322  var MenuItemCheck = forwardRef2(function MenuItemCheck2(props) {
70323    const htmlProps = useMenuItemCheck(props);
70324    return HKOOKEDE_createElement(menu_item_check_TagName, htmlProps);
70325  });
70326  
70327  
70328  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/dropdown-menu-v2/checkbox-item.js
70329  /**
70330   * External dependencies
70331   */
70332  
70333  
70334  /**
70335   * WordPress dependencies
70336   */
70337  
70338  
70339  
70340  /**
70341   * Internal dependencies
70342   */
70343  
70344  
70345  
70346  
70347  
70348  
70349  const DropdownMenuCheckboxItem = (0,external_wp_element_namespaceObject.forwardRef)(function DropdownMenuCheckboxItem({
70350    suffix,
70351    children,
70352    onBlur,
70353    hideOnClick = false,
70354    ...props
70355  }, ref) {
70356    // TODO: Remove when https://github.com/ariakit/ariakit/issues/4083 is fixed
70357    const focusVisibleFixProps = useTemporaryFocusVisibleFix({
70358      onBlur
70359    });
70360    const dropdownMenuContext = (0,external_wp_element_namespaceObject.useContext)(DropdownMenuContext);
70361    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(styles_DropdownMenuCheckboxItem, {
70362      ref: ref,
70363      ...props,
70364      ...focusVisibleFixProps,
70365      accessibleWhenDisabled: true,
70366      hideOnClick: hideOnClick,
70367      store: dropdownMenuContext?.store,
70368      children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(MenuItemCheck, {
70369        store: dropdownMenuContext?.store,
70370        render: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ItemPrefixWrapper, {})
70371        // Override some ariakit inline styles
70372        ,
70373        style: {
70374          width: 'auto',
70375          height: 'auto'
70376        },
70377        children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(icons_build_module_icon, {
70378          icon: library_check,
70379          size: 24
70380        })
70381      }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(DropdownMenuItemContentWrapper, {
70382        children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(DropdownMenuItemChildrenWrapper, {
70383          children: children
70384        }), suffix && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ItemSuffixWrapper, {
70385          children: suffix
70386        })]
70387      })]
70388    });
70389  });
70390  
70391  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/dropdown-menu-v2/radio-item.js
70392  /**
70393   * External dependencies
70394   */
70395  
70396  
70397  /**
70398   * WordPress dependencies
70399   */
70400  
70401  
70402  
70403  /**
70404   * Internal dependencies
70405   */
70406  
70407  
70408  
70409  
70410  
70411  
70412  
70413  const radioCheck = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, {
70414    xmlns: "http://www.w3.org/2000/svg",
70415    viewBox: "0 0 24 24",
70416    children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Circle, {
70417      cx: 12,
70418      cy: 12,
70419      r: 3
70420    })
70421  });
70422  const DropdownMenuRadioItem = (0,external_wp_element_namespaceObject.forwardRef)(function DropdownMenuRadioItem({
70423    suffix,
70424    children,
70425    onBlur,
70426    hideOnClick = false,
70427    ...props
70428  }, ref) {
70429    // TODO: Remove when https://github.com/ariakit/ariakit/issues/4083 is fixed
70430    const focusVisibleFixProps = useTemporaryFocusVisibleFix({
70431      onBlur
70432    });
70433    const dropdownMenuContext = (0,external_wp_element_namespaceObject.useContext)(DropdownMenuContext);
70434    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(styles_DropdownMenuRadioItem, {
70435      ref: ref,
70436      ...props,
70437      ...focusVisibleFixProps,
70438      accessibleWhenDisabled: true,
70439      hideOnClick: hideOnClick,
70440      store: dropdownMenuContext?.store,
70441      children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(MenuItemCheck, {
70442        store: dropdownMenuContext?.store,
70443        render: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ItemPrefixWrapper, {})
70444        // Override some ariakit inline styles
70445        ,
70446        style: {
70447          width: 'auto',
70448          height: 'auto'
70449        },
70450        children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(icons_build_module_icon, {
70451          icon: radioCheck,
70452          size: 24
70453        })
70454      }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(DropdownMenuItemContentWrapper, {
70455        children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(DropdownMenuItemChildrenWrapper, {
70456          children: children
70457        }), suffix && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ItemSuffixWrapper, {
70458          children: suffix
70459        })]
70460      })]
70461    });
70462  });
70463  
70464  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/dropdown-menu-v2/group.js
70465  /**
70466   * WordPress dependencies
70467   */
70468  
70469  
70470  /**
70471   * Internal dependencies
70472   */
70473  
70474  
70475  
70476  
70477  const DropdownMenuGroup = (0,external_wp_element_namespaceObject.forwardRef)(function DropdownMenuGroup(props, ref) {
70478    const dropdownMenuContext = (0,external_wp_element_namespaceObject.useContext)(DropdownMenuContext);
70479    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(styles_DropdownMenuGroup, {
70480      ref: ref,
70481      ...props,
70482      store: dropdownMenuContext?.store
70483    });
70484  });
70485  
70486  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/dropdown-menu-v2/group-label.js
70487  /**
70488   * WordPress dependencies
70489   */
70490  
70491  
70492  /**
70493   * Internal dependencies
70494   */
70495  
70496  
70497  
70498  
70499  
70500  const group_label_DropdownMenuGroupLabel = (0,external_wp_element_namespaceObject.forwardRef)(function DropdownMenuGroup(props, ref) {
70501    const dropdownMenuContext = (0,external_wp_element_namespaceObject.useContext)(DropdownMenuContext);
70502    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(DropdownMenuGroupLabel, {
70503      ref: ref,
70504      render:
70505      /*#__PURE__*/
70506      // @ts-expect-error The `children` prop is passed
70507      (0,external_ReactJSXRuntime_namespaceObject.jsx)(text_component, {
70508        upperCase: true,
70509        variant: "muted",
70510        size: "11px",
70511        weight: 500,
70512        lineHeight: "16px"
70513      }),
70514      ...props,
70515      store: dropdownMenuContext?.store
70516    });
70517  });
70518  
70519  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/dropdown-menu-v2/separator.js
70520  /**
70521   * WordPress dependencies
70522   */
70523  
70524  
70525  /**
70526   * Internal dependencies
70527   */
70528  
70529  
70530  
70531  
70532  const DropdownMenuSeparator = (0,external_wp_element_namespaceObject.forwardRef)(function DropdownMenuSeparator(props, ref) {
70533    const dropdownMenuContext = (0,external_wp_element_namespaceObject.useContext)(DropdownMenuContext);
70534    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(styles_DropdownMenuSeparator, {
70535      ref: ref,
70536      ...props,
70537      store: dropdownMenuContext?.store,
70538      variant: dropdownMenuContext?.variant
70539    });
70540  });
70541  
70542  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/dropdown-menu-v2/item-label.js
70543  /**
70544   * WordPress dependencies
70545   */
70546  
70547  
70548  /**
70549   * Internal dependencies
70550   */
70551  
70552  
70553  
70554  const DropdownMenuItemLabel = (0,external_wp_element_namespaceObject.forwardRef)(function DropdownMenuItemLabel(props, ref) {
70555    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(styles_DropdownMenuItemLabel, {
70556      numberOfLines: 1,
70557      ref: ref,
70558      ...props
70559    });
70560  });
70561  
70562  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/dropdown-menu-v2/item-help-text.js
70563  /**
70564   * WordPress dependencies
70565   */
70566  
70567  
70568  /**
70569   * Internal dependencies
70570   */
70571  
70572  
70573  
70574  const DropdownMenuItemHelpText = (0,external_wp_element_namespaceObject.forwardRef)(function DropdownMenuItemHelpText(props, ref) {
70575    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(styles_DropdownMenuItemHelpText, {
70576      numberOfLines: 2,
70577      ref: ref,
70578      ...props
70579    });
70580  });
70581  
70582  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/dropdown-menu-v2/index.js
70583  /**
70584   * External dependencies
70585   */
70586  
70587  
70588  
70589  /**
70590   * WordPress dependencies
70591   */
70592  
70593  
70594  
70595  
70596  /**
70597   * Internal dependencies
70598   */
70599  
70600  
70601  
70602  
70603  
70604  
70605  
70606  
70607  
70608  
70609  
70610  
70611  
70612  
70613  const dropdown_menu_v2_UnconnectedDropdownMenu = (props, ref) => {
70614    var _props$placement;
70615    const {
70616      // Store props
70617      open,
70618      defaultOpen = false,
70619      onOpenChange,
70620      placement,
70621      // Menu trigger props
70622      trigger,
70623      // Menu props
70624      gutter,
70625      children,
70626      shift,
70627      modal = true,
70628      // From internal components context
70629      variant,
70630      // Rest
70631      ...otherProps
70632    } = useContextSystem(props, 'DropdownMenu');
70633    const parentContext = (0,external_wp_element_namespaceObject.useContext)(DropdownMenuContext);
70634    const computedDirection = (0,external_wp_i18n_namespaceObject.isRTL)() ? 'rtl' : 'ltr';
70635  
70636    // If an explicit value for the `placement` prop is not passed,
70637    // apply a default placement of `bottom-start` for the root dropdown,
70638    // and of `right-start` for nested dropdowns.
70639    let computedPlacement = (_props$placement = props.placement) !== null && _props$placement !== void 0 ? _props$placement : parentContext?.store ? 'right-start' : 'bottom-start';
70640    // Swap left/right in case of RTL direction
70641    if (computedDirection === 'rtl') {
70642      if (/right/.test(computedPlacement)) {
70643        computedPlacement = computedPlacement.replace('right', 'left');
70644      } else if (/left/.test(computedPlacement)) {
70645        computedPlacement = computedPlacement.replace('left', 'right');
70646      }
70647    }
70648    const dropdownMenuStore = useMenuStore({
70649      parent: parentContext?.store,
70650      open,
70651      defaultOpen,
70652      placement: computedPlacement,
70653      focusLoop: true,
70654      setOpen(willBeOpen) {
70655        onOpenChange?.(willBeOpen);
70656      },
70657      rtl: computedDirection === 'rtl'
70658    });
70659    const contextValue = (0,external_wp_element_namespaceObject.useMemo)(() => ({
70660      store: dropdownMenuStore,
70661      variant
70662    }), [dropdownMenuStore, variant]);
70663  
70664    // Extract the side from the applied placement — useful for animations.
70665    // Using `currentPlacement` instead of `placement` to make sure that we
70666    // use the final computed placement (including "flips" etc).
70667    const appliedPlacementSide = useStoreState(dropdownMenuStore, 'currentPlacement').split('-')[0];
70668    if (dropdownMenuStore.parent && !((0,external_wp_element_namespaceObject.isValidElement)(trigger) && DropdownMenuItem === trigger.type)) {
70669      // eslint-disable-next-line no-console
70670      console.warn('For nested DropdownMenus, the `trigger` should always be a `DropdownMenuItem`.');
70671    }
70672    const hideOnEscape = (0,external_wp_element_namespaceObject.useCallback)(event => {
70673      // Pressing Escape can cause unexpected consequences (ie. exiting
70674      // full screen mode on MacOs, close parent modals...).
70675      event.preventDefault();
70676      // Returning `true` causes the menu to hide.
70677      return true;
70678    }, []);
70679    const wrapperProps = (0,external_wp_element_namespaceObject.useMemo)(() => ({
70680      dir: computedDirection,
70681      style: {
70682        direction: computedDirection
70683      }
70684    }), [computedDirection]);
70685    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, {
70686      children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(MenuButton, {
70687        ref: ref,
70688        store: dropdownMenuStore,
70689        render: dropdownMenuStore.parent ? (0,external_wp_element_namespaceObject.cloneElement)(trigger, {
70690          // Add submenu arrow, unless a `suffix` is explicitly specified
70691          suffix: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, {
70692            children: [trigger.props.suffix, /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(SubmenuChevronIcon, {
70693              "aria-hidden": "true",
70694              icon: chevron_right_small,
70695              size: 24,
70696              preserveAspectRatio: "xMidYMid slice"
70697            })]
70698          })
70699        }) : trigger
70700      }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Menu, {
70701        ...otherProps,
70702        modal: modal,
70703        store: dropdownMenuStore
70704        // Root menu has an 8px distance from its trigger,
70705        // otherwise 0 (which causes the submenu to slightly overlap)
70706        ,
70707        gutter: gutter !== null && gutter !== void 0 ? gutter : dropdownMenuStore.parent ? 0 : 8
70708        // Align nested menu by the same (but opposite) amount
70709        // as the menu container's padding.
70710        ,
70711        shift: shift !== null && shift !== void 0 ? shift : dropdownMenuStore.parent ? -4 : 0,
70712        hideOnHoverOutside: false,
70713        "data-side": appliedPlacementSide,
70714        wrapperProps: wrapperProps,
70715        hideOnEscape: hideOnEscape,
70716        unmountOnHide: true,
70717        render: renderProps =>
70718        /*#__PURE__*/
70719        // Two wrappers are needed for the entry animation, where the menu
70720        // container scales with a different factor than its contents.
70721        // The {...renderProps} are passed to the inner wrapper, so that the
70722        // menu element is the direct parent of the menu item elements.
70723        (0,external_ReactJSXRuntime_namespaceObject.jsx)(MenuPopoverOuterWrapper, {
70724          variant: variant,
70725          children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(MenuPopoverInnerWrapper, {
70726            ...renderProps
70727          })
70728        }),
70729        children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(DropdownMenuContext.Provider, {
70730          value: contextValue,
70731          children: children
70732        })
70733      })]
70734    });
70735  };
70736  const DropdownMenuV2 = Object.assign(contextConnect(dropdown_menu_v2_UnconnectedDropdownMenu, 'DropdownMenu'), {
70737    Context: Object.assign(DropdownMenuContext, {
70738      displayName: 'DropdownMenuV2.Context'
70739    }),
70740    Item: Object.assign(DropdownMenuItem, {
70741      displayName: 'DropdownMenuV2.Item'
70742    }),
70743    RadioItem: Object.assign(DropdownMenuRadioItem, {
70744      displayName: 'DropdownMenuV2.RadioItem'
70745    }),
70746    CheckboxItem: Object.assign(DropdownMenuCheckboxItem, {
70747      displayName: 'DropdownMenuV2.CheckboxItem'
70748    }),
70749    Group: Object.assign(DropdownMenuGroup, {
70750      displayName: 'DropdownMenuV2.Group'
70751    }),
70752    GroupLabel: Object.assign(group_label_DropdownMenuGroupLabel, {
70753      displayName: 'DropdownMenuV2.GroupLabel'
70754    }),
70755    Separator: Object.assign(DropdownMenuSeparator, {
70756      displayName: 'DropdownMenuV2.Separator'
70757    }),
70758    ItemLabel: Object.assign(DropdownMenuItemLabel, {
70759      displayName: 'DropdownMenuV2.ItemLabel'
70760    }),
70761    ItemHelpText: Object.assign(DropdownMenuItemHelpText, {
70762      displayName: 'DropdownMenuV2.ItemHelpText'
70763    })
70764  });
70765  /* harmony default export */ const dropdown_menu_v2 = ((/* unused pure expression or super */ null && (DropdownMenuV2)));
70766  
70767  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/theme/styles.js
70768  
70769  function theme_styles_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)."; }
70770  /**
70771   * External dependencies
70772   */
70773  
70774  
70775  
70776  /**
70777   * Internal dependencies
70778   */
70779  
70780  const colorVariables = ({
70781    colors
70782  }) => {
70783    const shades = Object.entries(colors.gray || {}).map(([k, v]) => `--wp-components-color-gray-$k}: $v};`).join('');
70784    return [/*#__PURE__*/emotion_react_browser_esm_css("--wp-components-color-accent:", colors.accent, ";--wp-components-color-accent-darker-10:", colors.accentDarker10, ";--wp-components-color-accent-darker-20:", colors.accentDarker20, ";--wp-components-color-accent-inverted:", colors.accentInverted, ";--wp-components-color-background:", colors.background, ";--wp-components-color-foreground:", colors.foreground, ";--wp-components-color-foreground-inverted:", colors.foregroundInverted, ";", shades, ";" + ( true ? "" : 0),  true ? "" : 0)];
70785  };
70786  const theme_styles_Wrapper = /*#__PURE__*/emotion_styled_base_browser_esm("div",  true ? {
70787    target: "e1krjpvb0"
70788  } : 0)( true ? {
70789    name: "1a3idx0",
70790    styles: "color:var( --wp-components-color-foreground, currentColor )"
70791  } : 0);
70792  
70793  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/theme/color-algorithms.js
70794  /**
70795   * External dependencies
70796   */
70797  
70798  
70799  
70800  
70801  /**
70802   * WordPress dependencies
70803   */
70804  
70805  
70806  /**
70807   * Internal dependencies
70808   */
70809  
70810  
70811  k([names, a11y]);
70812  function generateThemeVariables(inputs) {
70813    validateInputs(inputs);
70814    const generatedColors = {
70815      ...generateAccentDependentColors(inputs.accent),
70816      ...generateBackgroundDependentColors(inputs.background)
70817    };
70818    warnContrastIssues(checkContrasts(inputs, generatedColors));
70819    return {
70820      colors: generatedColors
70821    };
70822  }
70823  function validateInputs(inputs) {
70824    for (const [key, value] of Object.entries(inputs)) {
70825      if (typeof value !== 'undefined' && !w(value).isValid()) {
70826         true ? external_wp_warning_default()(`wp.components.Theme: "$value}" is not a valid color value for the '$key}' prop.`) : 0;
70827      }
70828    }
70829  }
70830  function checkContrasts(inputs, outputs) {
70831    const background = inputs.background || COLORS.white;
70832    const accent = inputs.accent || '#3858e9';
70833    const foreground = outputs.foreground || COLORS.gray[900];
70834    const gray = outputs.gray || COLORS.gray;
70835    return {
70836      accent: w(background).isReadable(accent) ? undefined : `The background color ("$background}") does not have sufficient contrast against the accent color ("$accent}").`,
70837      foreground: w(background).isReadable(foreground) ? undefined : `The background color provided ("$background}") does not have sufficient contrast against the standard foreground colors.`,
70838      grays: w(background).contrast(gray[600]) >= 3 && w(background).contrast(gray[700]) >= 4.5 ? undefined : `The background color provided ("$background}") cannot generate a set of grayscale foreground colors with sufficient contrast. Try adjusting the color to be lighter or darker.`
70839    };
70840  }
70841  function warnContrastIssues(issues) {
70842    for (const error of Object.values(issues)) {
70843      if (error) {
70844         true ? external_wp_warning_default()('wp.components.Theme: ' + error) : 0;
70845      }
70846    }
70847  }
70848  function generateAccentDependentColors(accent) {
70849    if (!accent) {
70850      return {};
70851    }
70852    return {
70853      accent,
70854      accentDarker10: w(accent).darken(0.1).toHex(),
70855      accentDarker20: w(accent).darken(0.2).toHex(),
70856      accentInverted: getForegroundForColor(accent)
70857    };
70858  }
70859  function generateBackgroundDependentColors(background) {
70860    if (!background) {
70861      return {};
70862    }
70863    const foreground = getForegroundForColor(background);
70864    return {
70865      background,
70866      foreground,
70867      foregroundInverted: getForegroundForColor(foreground),
70868      gray: generateShades(background, foreground)
70869    };
70870  }
70871  function getForegroundForColor(color) {
70872    return w(color).isDark() ? COLORS.white : COLORS.gray[900];
70873  }
70874  function generateShades(background, foreground) {
70875    // How much darkness you need to add to #fff to get the COLORS.gray[n] color
70876    const SHADES = {
70877      100: 0.06,
70878      200: 0.121,
70879      300: 0.132,
70880      400: 0.2,
70881      600: 0.42,
70882      700: 0.543,
70883      800: 0.821
70884    };
70885  
70886    // Darkness of COLORS.gray[ 900 ], relative to #fff
70887    const limit = 0.884;
70888    const direction = w(background).isDark() ? 'lighten' : 'darken';
70889  
70890    // Lightness delta between the background and foreground colors
70891    const range = Math.abs(w(background).toHsl().l - w(foreground).toHsl().l) / 100;
70892    const result = {};
70893    Object.entries(SHADES).forEach(([key, value]) => {
70894      result[parseInt(key)] = w(background)[direction](value / limit * range).toHex();
70895    });
70896    return result;
70897  }
70898  
70899  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/theme/index.js
70900  /**
70901   * WordPress dependencies
70902   */
70903  
70904  
70905  /**
70906   * Internal dependencies
70907   */
70908  
70909  
70910  
70911  
70912  
70913  /**
70914   * `Theme` allows defining theme variables for components in the `@wordpress/components` package.
70915   *
70916   * Multiple `Theme` components can be nested in order to override specific theme variables.
70917   *
70918   *
70919   * ```jsx
70920   * const Example = () => {
70921   *   return (
70922   *     <Theme accent="red">
70923   *       <Button variant="primary">I'm red</Button>
70924   *       <Theme accent="blue">
70925   *         <Button variant="primary">I'm blue</Button>
70926   *       </Theme>
70927   *     </Theme>
70928   *   );
70929   * };
70930   * ```
70931   */
70932  
70933  function Theme({
70934    accent,
70935    background,
70936    className,
70937    ...props
70938  }) {
70939    const cx = useCx();
70940    const classes = (0,external_wp_element_namespaceObject.useMemo)(() => cx(...colorVariables(generateThemeVariables({
70941      accent,
70942      background
70943    })), className), [accent, background, className, cx]);
70944    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(theme_styles_Wrapper, {
70945      className: classes,
70946      ...props
70947    });
70948  }
70949  /* harmony default export */ const theme = (Theme);
70950  
70951  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/tabs/context.js
70952  /**
70953   * WordPress dependencies
70954   */
70955  
70956  
70957  /**
70958   * Internal dependencies
70959   */
70960  
70961  const TabsContext = (0,external_wp_element_namespaceObject.createContext)(undefined);
70962  const useTabsContext = () => (0,external_wp_element_namespaceObject.useContext)(TabsContext);
70963  
70964  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/tabs/styles.js
70965  
70966  /**
70967   * External dependencies
70968   */
70969  
70970  
70971  
70972  /**
70973   * Internal dependencies
70974   */
70975  
70976  
70977  const TabListWrapper = /*#__PURE__*/emotion_styled_base_browser_esm("div",  true ? {
70978    target: "enfox0g2"
70979  } : 0)("position:relative;display:flex;align-items:stretch;flex-direction:row;text-align:center;&[aria-orientation='vertical']{flex-direction:column;text-align:start;}@media not ( prefers-reduced-motion ){&.is-animation-enabled::after{transition-property:transform;transition-duration:0.2s;transition-timing-function:ease-out;}}--direction-factor:1;--direction-origin-x:left;--indicator-start:var( --indicator-left );&:dir( rtl ){--direction-factor:-1;--direction-origin-x:right;--indicator-start:var( --indicator-right );}&::after{content:'';position:absolute;pointer-events:none;transform-origin:var( --direction-origin-x ) top;outline:2px solid transparent;outline-offset:-1px;}--antialiasing-factor:100;&:not( [aria-orientation='vertical'] ){&::after{bottom:0;height:0;width:calc( var( --antialiasing-factor ) * 1px );transform:translateX(\n\t\t\t\t\tcalc(\n\t\t\t\t\t\tvar( --indicator-start ) * var( --direction-factor ) *\n\t\t\t\t\t\t\t1px\n\t\t\t\t\t)\n\t\t\t\t) scaleX(\n\t\t\t\t\tcalc(\n\t\t\t\t\t\tvar( --indicator-width ) / var( --antialiasing-factor )\n\t\t\t\t\t)\n\t\t\t\t);border-bottom:var( --wp-admin-border-width-focus ) solid ", COLORS.theme.accent, ";}}&[aria-orientation='vertical']::after{z-index:-1;top:0;left:0;width:100%;height:calc( var( --antialiasing-factor ) * 1px );transform:translateY( calc( var( --indicator-top ) * 1px ) ) scaleY(\n\t\t\t\tcalc( var( --indicator-height ) / var( --antialiasing-factor ) )\n\t\t\t);background-color:", COLORS.theme.gray[100], ";}" + ( true ? "" : 0));
70980  const styles_Tab = /*#__PURE__*/emotion_styled_base_browser_esm(Tab,  true ? {
70981    target: "enfox0g1"
70982  } : 0)("&{display:inline-flex;align-items:center;position:relative;border-radius:0;min-height:", space(12), ";height:auto;background:transparent;border:none;box-shadow:none;cursor:pointer;line-height:1.2;padding:", space(3), " ", space(4), ";margin-left:0;font-weight:500;text-align:inherit;hyphens:auto;color:", COLORS.theme.foreground, ";&[aria-disabled='true']{cursor:default;color:", COLORS.ui.textDisabled, ";}&:not( [aria-disabled='true'] ):hover{color:", COLORS.theme.accent, ";}&:focus:not( :disabled ){position:relative;box-shadow:none;outline:none;}&::before{content:'';position:absolute;top:", space(3), ";right:", space(3), ";bottom:", space(3), ";left:", space(3), ";pointer-events:none;outline:var( --wp-admin-border-width-focus ) solid ", COLORS.theme.accent, ";border-radius:", config_values.radiusSmall, ";opacity:0;@media not ( prefers-reduced-motion ){transition:opacity 0.1s linear;}}&:focus-visible::before{opacity:1;}}[aria-orientation='vertical'] &{min-height:", space(10), ";}" + ( true ? "" : 0));
70983  const styles_TabPanel = /*#__PURE__*/emotion_styled_base_browser_esm(TabPanel,  true ? {
70984    target: "enfox0g0"
70985  } : 0)("&:focus{box-shadow:none;outline:none;}&:focus-visible{box-shadow:0 0 0 var( --wp-admin-border-width-focus ) ", COLORS.theme.accent, ";outline:2px solid transparent;outline-offset:0;}" + ( true ? "" : 0));
70986  
70987  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/tabs/tab.js
70988  /**
70989   * WordPress dependencies
70990   */
70991  
70992  
70993  
70994  /**
70995   * Internal dependencies
70996   */
70997  
70998  
70999  
71000  
71001  
71002  const tab_Tab = (0,external_wp_element_namespaceObject.forwardRef)(function Tab({
71003    children,
71004    tabId,
71005    disabled,
71006    render,
71007    ...otherProps
71008  }, ref) {
71009    const context = useTabsContext();
71010    if (!context) {
71011       true ? external_wp_warning_default()('`Tabs.Tab` must be wrapped in a `Tabs` component.') : 0;
71012      return null;
71013    }
71014    const {
71015      store,
71016      instanceId
71017    } = context;
71018    const instancedTabId = `$instanceId}-$tabId}`;
71019    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(styles_Tab, {
71020      ref: ref,
71021      store: store,
71022      id: instancedTabId,
71023      disabled: disabled,
71024      render: render,
71025      ...otherProps,
71026      children: children
71027    });
71028  });
71029  
71030  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/utils/hooks/use-event.js
71031  /* eslint-disable jsdoc/require-param */
71032  /**
71033   * WordPress dependencies
71034   */
71035  
71036  
71037  /**
71038   * Any function.
71039   */
71040  
71041  /**
71042   * Creates a stable callback function that has access to the latest state and
71043   * can be used within event handlers and effect callbacks. Throws when used in
71044   * the render phase.
71045   *
71046   * @example
71047   *
71048   * ```tsx
71049   * function Component(props) {
71050   *   const onClick = useEvent(props.onClick);
71051   *   React.useEffect(() => {}, [onClick]);
71052   * }
71053   * ```
71054   */
71055  function use_event_useEvent(callback) {
71056    const ref = (0,external_wp_element_namespaceObject.useRef)(() => {
71057      throw new Error('Cannot call an event handler while rendering.');
71058    });
71059    (0,external_wp_element_namespaceObject.useInsertionEffect)(() => {
71060      ref.current = callback;
71061    });
71062    return (0,external_wp_element_namespaceObject.useCallback)((...args) => ref.current?.(...args), []);
71063  }
71064  /* eslint-enable jsdoc/require-param */
71065  
71066  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/utils/element-rect.js
71067  /* eslint-disable jsdoc/require-param */
71068  /**
71069   * WordPress dependencies
71070   */
71071  
71072  
71073  /**
71074   * Internal dependencies
71075   */
71076  
71077  
71078  /**
71079   * The position and dimensions of an element, relative to its offset parent.
71080   */
71081  
71082  /**
71083   * An `ElementOffsetRect` object with all values set to zero.
71084   */
71085  const NULL_ELEMENT_OFFSET_RECT = {
71086    top: 0,
71087    right: 0,
71088    bottom: 0,
71089    left: 0,
71090    width: 0,
71091    height: 0
71092  };
71093  
71094  /**
71095   * Returns the position and dimensions of an element, relative to its offset
71096   * parent, with subpixel precision. Values reflect the real measures before any
71097   * potential scaling distortions along the X and Y axes.
71098   *
71099   * Useful in contexts where plain `getBoundingClientRect` calls or `ResizeObserver`
71100   * entries are not suitable, such as when the element is transformed, and when
71101   * `element.offset<Top|Left|Width|Height>` methods are not precise enough.
71102   *
71103   * **Note:** in some contexts, like when the scale is 0, this method will fail
71104   * because it's impossible to calculate a scaling ratio. When that happens, it
71105   * will return `undefined`.
71106   */
71107  function getElementOffsetRect(element) {
71108    var _element$offsetParent;
71109    // Position and dimension values computed with `getBoundingClientRect` have
71110    // subpixel precision, but are affected by distortions since they represent
71111    // the "real" measures, or in other words, the actual final values as rendered
71112    // by the browser.
71113    const rect = element.getBoundingClientRect();
71114    if (rect.width === 0 || rect.height === 0) {
71115      return;
71116    }
71117    const offsetParentRect = (_element$offsetParent = element.offsetParent?.getBoundingClientRect()) !== null && _element$offsetParent !== void 0 ? _element$offsetParent : NULL_ELEMENT_OFFSET_RECT;
71118  
71119    // Computed widths and heights have subpixel precision, and are not affected
71120    // by distortions.
71121    const computedWidth = parseFloat(getComputedStyle(element).width);
71122    const computedHeight = parseFloat(getComputedStyle(element).height);
71123  
71124    // We can obtain the current scale factor for the element by comparing "computed"
71125    // dimensions with the "real" ones.
71126    const scaleX = computedWidth / rect.width;
71127    const scaleY = computedHeight / rect.height;
71128    return {
71129      // To obtain the adjusted values for the position:
71130      // 1. Compute the element's position relative to the offset parent.
71131      // 2. Correct for the scale factor.
71132      top: (rect.top - offsetParentRect?.top) * scaleY,
71133      right: (offsetParentRect?.right - rect.right) * scaleX,
71134      bottom: (offsetParentRect?.bottom - rect.bottom) * scaleY,
71135      left: (rect.left - offsetParentRect?.left) * scaleX,
71136      // Computed dimensions don't need any adjustments.
71137      width: computedWidth,
71138      height: computedHeight
71139    };
71140  }
71141  const POLL_RATE = 100;
71142  
71143  /**
71144   * Tracks the position and dimensions of an element, relative to its offset
71145   * parent. The element can be changed dynamically.
71146   *
71147   * **Note:** sometimes, the measurement will fail (see `getElementOffsetRect`'s
71148   * documentation for more details). When that happens, this hook will attempt
71149   * to measure again after a frame, and if that fails, it will poll every 100
71150   * milliseconds until it succeeds.
71151   */
71152  function useTrackElementOffsetRect(targetElement) {
71153    const [indicatorPosition, setIndicatorPosition] = (0,external_wp_element_namespaceObject.useState)(NULL_ELEMENT_OFFSET_RECT);
71154    const intervalRef = (0,external_wp_element_namespaceObject.useRef)();
71155    const measure = use_event_useEvent(() => {
71156      if (targetElement) {
71157        const elementOffsetRect = getElementOffsetRect(targetElement);
71158        if (elementOffsetRect) {
71159          setIndicatorPosition(elementOffsetRect);
71160          clearInterval(intervalRef.current);
71161          return true;
71162        }
71163      } else {
71164        clearInterval(intervalRef.current);
71165      }
71166      return false;
71167    });
71168    const setElement = (0,external_wp_compose_namespaceObject.useResizeObserver)(() => {
71169      if (!measure()) {
71170        requestAnimationFrame(() => {
71171          if (!measure()) {
71172            intervalRef.current = setInterval(measure, POLL_RATE);
71173          }
71174        });
71175      }
71176    });
71177    (0,external_wp_element_namespaceObject.useLayoutEffect)(() => setElement(targetElement), [setElement, targetElement]);
71178    return indicatorPosition;
71179  }
71180  
71181  /* eslint-enable jsdoc/require-param */
71182  
71183  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/utils/hooks/use-on-value-update.js
71184  /* eslint-disable jsdoc/require-param */
71185  /**
71186   * WordPress dependencies
71187   */
71188  
71189  /**
71190   * Internal dependencies
71191   */
71192  
71193  
71194  /**
71195   * Context object for the `onUpdate` callback of `useOnValueUpdate`.
71196   */
71197  
71198  /**
71199   * Calls the `onUpdate` callback when the `value` changes.
71200   */
71201  function useOnValueUpdate(
71202  /**
71203   * The value to watch for changes.
71204   */
71205  value,
71206  /**
71207   * Callback to fire when the value changes.
71208   */
71209  onUpdate) {
71210    const previousValueRef = (0,external_wp_element_namespaceObject.useRef)(value);
71211    const updateCallbackEvent = use_event_useEvent(onUpdate);
71212    (0,external_wp_element_namespaceObject.useEffect)(() => {
71213      if (previousValueRef.current !== value) {
71214        updateCallbackEvent({
71215          previousValue: previousValueRef.current
71216        });
71217        previousValueRef.current = value;
71218      }
71219    }, [updateCallbackEvent, value]);
71220  }
71221  /* eslint-enable jsdoc/require-param */
71222  
71223  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/tabs/tablist.js
71224  /**
71225   * External dependencies
71226   */
71227  
71228  
71229  
71230  /**
71231   * WordPress dependencies
71232   */
71233  
71234  
71235  
71236  /**
71237   * Internal dependencies
71238   */
71239  
71240  
71241  
71242  
71243  
71244  
71245  
71246  const TabList = (0,external_wp_element_namespaceObject.forwardRef)(function TabList({
71247    children,
71248    ...otherProps
71249  }, ref) {
71250    const context = useTabsContext();
71251    const tabStoreState = useStoreState(context?.store);
71252    const selectedId = tabStoreState?.selectedId;
71253    const indicatorPosition = useTrackElementOffsetRect(context?.store.item(selectedId)?.element);
71254    const [animationEnabled, setAnimationEnabled] = (0,external_wp_element_namespaceObject.useState)(false);
71255    useOnValueUpdate(selectedId, ({
71256      previousValue
71257    }) => previousValue && setAnimationEnabled(true));
71258    if (!context || !tabStoreState) {
71259       true ? external_wp_warning_default()('`Tabs.TabList` must be wrapped in a `Tabs` component.') : 0;
71260      return null;
71261    }
71262    const {
71263      store
71264    } = context;
71265    const {
71266      activeId,
71267      selectOnMove
71268    } = tabStoreState;
71269    const {
71270      setActiveId
71271    } = store;
71272    const onBlur = () => {
71273      if (!selectOnMove) {
71274        return;
71275      }
71276  
71277      // When automatic tab selection is on, make sure that the active tab is up
71278      // to date with the selected tab when leaving the tablist. This makes sure
71279      // that the selected tab will receive keyboard focus when tabbing back into
71280      // the tablist.
71281      if (selectedId !== activeId) {
71282        setActiveId(selectedId);
71283      }
71284    };
71285    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(tab_list_TabList, {
71286      ref: ref,
71287      store: store,
71288      render: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(TabListWrapper, {
71289        onTransitionEnd: event => {
71290          if (event.pseudoElement === '::after') {
71291            setAnimationEnabled(false);
71292          }
71293        }
71294      }),
71295      onBlur: onBlur,
71296      ...otherProps,
71297      style: {
71298        '--indicator-top': indicatorPosition.top,
71299        '--indicator-right': indicatorPosition.right,
71300        '--indicator-left': indicatorPosition.left,
71301        '--indicator-width': indicatorPosition.width,
71302        '--indicator-height': indicatorPosition.height,
71303        ...otherProps.style
71304      },
71305      className: dist_clsx(animationEnabled ? 'is-animation-enabled' : '', otherProps.className),
71306      children: children
71307    });
71308  });
71309  
71310  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/tabs/tabpanel.js
71311  /**
71312   * External dependencies
71313   */
71314  
71315  
71316  /**
71317   * WordPress dependencies
71318   */
71319  
71320  
71321  /**
71322   * Internal dependencies
71323   */
71324  
71325  
71326  
71327  
71328  
71329  const tabpanel_TabPanel = (0,external_wp_element_namespaceObject.forwardRef)(function TabPanel({
71330    children,
71331    tabId,
71332    focusable = true,
71333    ...otherProps
71334  }, ref) {
71335    const context = useTabsContext();
71336    const selectedId = useStoreState(context?.store, 'selectedId');
71337    if (!context) {
71338       true ? external_wp_warning_default()('`Tabs.TabPanel` must be wrapped in a `Tabs` component.') : 0;
71339      return null;
71340    }
71341    const {
71342      store,
71343      instanceId
71344    } = context;
71345    const instancedTabId = `$instanceId}-$tabId}`;
71346    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(styles_TabPanel, {
71347      ref: ref,
71348      store: store
71349      // For TabPanel, the id passed here is the id attribute of the DOM
71350      // element.
71351      // `tabId` is the id of the tab that controls this panel.
71352      ,
71353      id: `$instancedTabId}-view`,
71354      tabId: instancedTabId,
71355      focusable: focusable,
71356      ...otherProps,
71357      children: selectedId === instancedTabId && children
71358    });
71359  });
71360  
71361  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/tabs/index.js
71362  /**
71363   * External dependencies
71364   */
71365  
71366  
71367  
71368  /**
71369   * WordPress dependencies
71370   */
71371  
71372  
71373  
71374  /**
71375   * Internal dependencies
71376   */
71377  
71378  
71379  
71380  
71381  
71382  
71383  function Tabs({
71384    selectOnMove = true,
71385    defaultTabId,
71386    orientation = 'horizontal',
71387    onSelect,
71388    children,
71389    selectedTabId
71390  }) {
71391    const instanceId = (0,external_wp_compose_namespaceObject.useInstanceId)(Tabs, 'tabs');
71392    const store = useTabStore({
71393      selectOnMove,
71394      orientation,
71395      defaultSelectedId: defaultTabId && `$instanceId}-$defaultTabId}`,
71396      setSelectedId: selectedId => {
71397        const strippedDownId = typeof selectedId === 'string' ? selectedId.replace(`$instanceId}-`, '') : selectedId;
71398        onSelect?.(strippedDownId);
71399      },
71400      selectedId: selectedTabId && `$instanceId}-$selectedTabId}`
71401    });
71402    const isControlled = selectedTabId !== undefined;
71403    const {
71404      items,
71405      selectedId,
71406      activeId
71407    } = useStoreState(store);
71408    const {
71409      setSelectedId,
71410      setActiveId
71411    } = store;
71412  
71413    // Keep track of whether tabs have been populated. This is used to prevent
71414    // certain effects from firing too early while tab data and relevant
71415    // variables are undefined during the initial render.
71416    const tabsHavePopulatedRef = (0,external_wp_element_namespaceObject.useRef)(false);
71417    if (items.length > 0) {
71418      tabsHavePopulatedRef.current = true;
71419    }
71420    const selectedTab = items.find(item => item.id === selectedId);
71421    const firstEnabledTab = items.find(item => {
71422      // Ariakit internally refers to disabled tabs as `dimmed`.
71423      return !item.dimmed;
71424    });
71425    const initialTab = items.find(item => item.id === `$instanceId}-$defaultTabId}`);
71426  
71427    // Handle selecting the initial tab.
71428    (0,external_wp_element_namespaceObject.useLayoutEffect)(() => {
71429      if (isControlled) {
71430        return;
71431      }
71432  
71433      // Wait for the denoted initial tab to be declared before making a
71434      // selection. This ensures that if a tab is declared lazily it can
71435      // still receive initial selection, as well as ensuring no tab is
71436      // selected if an invalid `defaultTabId` is provided.
71437      if (defaultTabId && !initialTab) {
71438        return;
71439      }
71440  
71441      // If the currently selected tab is missing (i.e. removed from the DOM),
71442      // fall back to the initial tab or the first enabled tab if there is
71443      // one. Otherwise, no tab should be selected.
71444      if (!items.find(item => item.id === selectedId)) {
71445        if (initialTab && !initialTab.dimmed) {
71446          setSelectedId(initialTab?.id);
71447          return;
71448        }
71449        if (firstEnabledTab) {
71450          setSelectedId(firstEnabledTab.id);
71451        } else if (tabsHavePopulatedRef.current) {
71452          setSelectedId(null);
71453        }
71454      }
71455    }, [firstEnabledTab, initialTab, defaultTabId, isControlled, items, selectedId, setSelectedId]);
71456  
71457    // Handle the currently selected tab becoming disabled.
71458    (0,external_wp_element_namespaceObject.useLayoutEffect)(() => {
71459      if (!selectedTab?.dimmed) {
71460        return;
71461      }
71462  
71463      // In controlled mode, we trust that disabling tabs is done
71464      // intentionally, and don't select a new tab automatically.
71465      if (isControlled) {
71466        setSelectedId(null);
71467        return;
71468      }
71469  
71470      // If the currently selected tab becomes disabled, fall back to the
71471      // `defaultTabId` if possible. Otherwise select the first
71472      // enabled tab (if there is one).
71473      if (initialTab && !initialTab.dimmed) {
71474        setSelectedId(initialTab.id);
71475        return;
71476      }
71477      if (firstEnabledTab) {
71478        setSelectedId(firstEnabledTab.id);
71479      }
71480    }, [firstEnabledTab, initialTab, isControlled, selectedTab?.dimmed, setSelectedId]);
71481  
71482    // Clear `selectedId` if the active tab is removed from the DOM in controlled mode.
71483    (0,external_wp_element_namespaceObject.useLayoutEffect)(() => {
71484      if (!isControlled) {
71485        return;
71486      }
71487  
71488      // Once the tabs have populated, if the `selectedTabId` still can't be
71489      // found, clear the selection.
71490      if (tabsHavePopulatedRef.current && !!selectedTabId && !selectedTab) {
71491        setSelectedId(null);
71492      }
71493    }, [isControlled, selectedTab, selectedTabId, setSelectedId]);
71494    (0,external_wp_element_namespaceObject.useEffect)(() => {
71495      // If there is no active tab, fallback to place focus on the first enabled tab
71496      // so there is always an active element
71497      if (selectedTabId === null && !activeId && firstEnabledTab?.id) {
71498        setActiveId(firstEnabledTab.id);
71499      }
71500    }, [selectedTabId, activeId, firstEnabledTab?.id, setActiveId]);
71501    (0,external_wp_element_namespaceObject.useEffect)(() => {
71502      if (!isControlled) {
71503        return;
71504      }
71505      requestAnimationFrame(() => {
71506        const focusedElement = items?.[0]?.element?.ownerDocument.activeElement;
71507        if (!focusedElement || !items.some(item => focusedElement === item.element)) {
71508          return; // Return early if no tabs are focused.
71509        }
71510  
71511        // If, after ariakit re-computes the active tab, that tab doesn't match
71512        // the currently focused tab, then we force an update to ariakit to avoid
71513        // any mismatches, especially when navigating to previous/next tab with
71514        // arrow keys.
71515        if (activeId !== focusedElement.id) {
71516          setActiveId(focusedElement.id);
71517        }
71518      });
71519    }, [activeId, isControlled, items, setActiveId]);
71520    const contextValue = (0,external_wp_element_namespaceObject.useMemo)(() => ({
71521      store,
71522      instanceId
71523    }), [store, instanceId]);
71524    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(TabsContext.Provider, {
71525      value: contextValue,
71526      children: children
71527    });
71528  }
71529  Tabs.TabList = TabList;
71530  Tabs.Tab = tab_Tab;
71531  Tabs.TabPanel = tabpanel_TabPanel;
71532  Tabs.Context = TabsContext;
71533  /* harmony default export */ const tabs = (Tabs);
71534  
71535  ;// CONCATENATED MODULE: external ["wp","privateApis"]
71536  const external_wp_privateApis_namespaceObject = window["wp"]["privateApis"];
71537  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/lock-unlock.js
71538  /**
71539   * WordPress dependencies
71540   */
71541  
71542  const {
71543    lock,
71544    unlock
71545  } = (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/components');
71546  
71547  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/private-apis.js
71548  /**
71549   * Internal dependencies
71550   */
71551  
71552  
71553  
71554  
71555  
71556  
71557  
71558  
71559  const privateApis = {};
71560  lock(privateApis, {
71561    __experimentalPopoverLegacyPositionToPlacement: positionToPlacement,
71562    createPrivateSlotFill: createPrivateSlotFill,
71563    ComponentsContext: ComponentsContext,
71564    Tabs: tabs,
71565    Theme: theme,
71566    DropdownMenuV2: DropdownMenuV2,
71567    kebabCase: kebabCase
71568  });
71569  
71570  ;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/index.js
71571  // Primitives.
71572  
71573  
71574  // Components.
71575  
71576  
71577  
71578  
71579  
71580  
71581  
71582  
71583  
71584  
71585  
71586  
71587  
71588  
71589  
71590  
71591  
71592  
71593  
71594  
71595  
71596  
71597  
71598  
71599  
71600  
71601  
71602  
71603  
71604  
71605  
71606  
71607  
71608  
71609  
71610  
71611  
71612  
71613  
71614  
71615  
71616  
71617  
71618  
71619  
71620  
71621  
71622  
71623  
71624  
71625  
71626  
71627  
71628  
71629  
71630  
71631  
71632  
71633  
71634  
71635  
71636  
71637  
71638  
71639  
71640  
71641  
71642  
71643  
71644  
71645  
71646  
71647  
71648  
71649  
71650  
71651  
71652  
71653  
71654  
71655  
71656  
71657  
71658  
71659  
71660  
71661  
71662  
71663  
71664  
71665  
71666  
71667  
71668  
71669  
71670  
71671  
71672  
71673  
71674  
71675  
71676  
71677  
71678  
71679  
71680  
71681  
71682  
71683  
71684  
71685  
71686  
71687  
71688  
71689  
71690  
71691  
71692  
71693  
71694  
71695  // Higher-Order Components.
71696  
71697  
71698  
71699  
71700  
71701  
71702  
71703  
71704  
71705  // Private APIs.
71706  
71707  
71708  })();
71709  
71710  (window.wp = window.wp || {}).components = __webpack_exports__;
71711  /******/ })()
71712  ;