diff -r 48c4eec2b7e6 -r 8c2e4d02f4ef wp/wp-includes/js/dist/components.js --- a/wp/wp-includes/js/dist/components.js Fri Sep 05 18:40:08 2025 +0200 +++ b/wp/wp-includes/js/dist/components.js Fri Sep 05 18:52:52 2025 +0200 @@ -142,12 +142,230 @@ /***/ }), -/***/ 2287: +/***/ 83: +/***/ ((__unused_webpack_module, exports, __webpack_require__) => { + +"use strict"; +/** + * @license React + * use-sync-external-store-shim.production.js + * + * Copyright (c) Meta Platforms, Inc. and affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + */ + + +var React = __webpack_require__(1609); +function is(x, y) { + return (x === y && (0 !== x || 1 / x === 1 / y)) || (x !== x && y !== y); +} +var objectIs = "function" === typeof Object.is ? Object.is : is, + useState = React.useState, + useEffect = React.useEffect, + useLayoutEffect = React.useLayoutEffect, + useDebugValue = React.useDebugValue; +function useSyncExternalStore$2(subscribe, getSnapshot) { + var value = getSnapshot(), + _useState = useState({ inst: { value: value, getSnapshot: getSnapshot } }), + inst = _useState[0].inst, + forceUpdate = _useState[1]; + useLayoutEffect( + function () { + inst.value = value; + inst.getSnapshot = getSnapshot; + checkIfSnapshotChanged(inst) && forceUpdate({ inst: inst }); + }, + [subscribe, value, getSnapshot] + ); + useEffect( + function () { + checkIfSnapshotChanged(inst) && forceUpdate({ inst: inst }); + return subscribe(function () { + checkIfSnapshotChanged(inst) && forceUpdate({ inst: inst }); + }); + }, + [subscribe] + ); + useDebugValue(value); + return value; +} +function checkIfSnapshotChanged(inst) { + var latestGetSnapshot = inst.getSnapshot; + inst = inst.value; + try { + var nextValue = latestGetSnapshot(); + return !objectIs(inst, nextValue); + } catch (error) { + return !0; + } +} +function useSyncExternalStore$1(subscribe, getSnapshot) { + return getSnapshot(); +} +var shim = + "undefined" === typeof window || + "undefined" === typeof window.document || + "undefined" === typeof window.document.createElement + ? useSyncExternalStore$1 + : useSyncExternalStore$2; +exports.useSyncExternalStore = + void 0 !== React.useSyncExternalStore ? React.useSyncExternalStore : shim; + + +/***/ }), + +/***/ 422: +/***/ ((module, __unused_webpack_exports, __webpack_require__) => { + +"use strict"; + + +if (true) { + module.exports = __webpack_require__(83); +} else {} + + +/***/ }), + +/***/ 1178: +/***/ ((module, __unused_webpack_exports, __webpack_require__) => { + +"use strict"; + + +if (true) { + module.exports = __webpack_require__(2950); +} else {} + + +/***/ }), + +/***/ 1609: +/***/ ((module) => { + +"use strict"; +module.exports = window["React"]; + +/***/ }), + +/***/ 1880: +/***/ ((module, __unused_webpack_exports, __webpack_require__) => { + +"use strict"; + + +var reactIs = __webpack_require__(1178); + +/** + * Copyright 2015, Yahoo! Inc. + * Copyrights licensed under the New BSD License. See the accompanying LICENSE file for terms. + */ +var REACT_STATICS = { + childContextTypes: true, + contextType: true, + contextTypes: true, + defaultProps: true, + displayName: true, + getDefaultProps: true, + getDerivedStateFromError: true, + getDerivedStateFromProps: true, + mixins: true, + propTypes: true, + type: true +}; +var KNOWN_STATICS = { + name: true, + length: true, + prototype: true, + caller: true, + callee: true, + arguments: true, + arity: true +}; +var FORWARD_REF_STATICS = { + '$$typeof': true, + render: true, + defaultProps: true, + displayName: true, + propTypes: true +}; +var MEMO_STATICS = { + '$$typeof': true, + compare: true, + defaultProps: true, + displayName: true, + propTypes: true, + type: true +}; +var TYPE_STATICS = {}; +TYPE_STATICS[reactIs.ForwardRef] = FORWARD_REF_STATICS; +TYPE_STATICS[reactIs.Memo] = MEMO_STATICS; + +function getStatics(component) { + // React v16.11 and below + if (reactIs.isMemo(component)) { + return MEMO_STATICS; + } // React v16.12 and above + + + return TYPE_STATICS[component['$$typeof']] || REACT_STATICS; +} + +var defineProperty = Object.defineProperty; +var getOwnPropertyNames = Object.getOwnPropertyNames; +var getOwnPropertySymbols = Object.getOwnPropertySymbols; +var getOwnPropertyDescriptor = Object.getOwnPropertyDescriptor; +var getPrototypeOf = Object.getPrototypeOf; +var objectPrototype = Object.prototype; +function hoistNonReactStatics(targetComponent, sourceComponent, blacklist) { + if (typeof sourceComponent !== 'string') { + // don't hoist over string (html) components + if (objectPrototype) { + var inheritedComponent = getPrototypeOf(sourceComponent); + + if (inheritedComponent && inheritedComponent !== objectPrototype) { + hoistNonReactStatics(targetComponent, inheritedComponent, blacklist); + } + } + + var keys = getOwnPropertyNames(sourceComponent); + + if (getOwnPropertySymbols) { + keys = keys.concat(getOwnPropertySymbols(sourceComponent)); + } + + var targetStatics = getStatics(targetComponent); + var sourceStatics = getStatics(sourceComponent); + + for (var i = 0; i < keys.length; ++i) { + var key = keys[i]; + + if (!KNOWN_STATICS[key] && !(blacklist && blacklist[key]) && !(sourceStatics && sourceStatics[key]) && !(targetStatics && targetStatics[key])) { + var descriptor = getOwnPropertyDescriptor(sourceComponent, key); + + try { + // Avoid failures from read-only properties + defineProperty(targetComponent, key, descriptor); + } catch (e) {} + } + } + } + + return targetComponent; +} + +module.exports = hoistNonReactStatics; + + +/***/ }), + +/***/ 2950: /***/ ((__unused_webpack_module, exports) => { "use strict"; -var __webpack_unused_export__; -/** @license React v17.0.2 +/** @license React v16.13.1 * react-is.production.min.js * * Copyright (c) Facebook, Inc. and its affiliates. @@ -155,25 +373,13 @@ * This source code is licensed under the MIT license found in the * LICENSE file in the root directory of this source tree. */ -var b=60103,c=60106,d=60107,e=60108,f=60114,g=60109,h=60110,k=60112,l=60113,m=60120,n=60115,p=60116,q=60121,r=60122,u=60117,v=60129,w=60131; -if("function"===typeof Symbol&&Symbol.for){var x=Symbol.for;b=x("react.element");c=x("react.portal");d=x("react.fragment");e=x("react.strict_mode");f=x("react.profiler");g=x("react.provider");h=x("react.context");k=x("react.forward_ref");l=x("react.suspense");m=x("react.suspense_list");n=x("react.memo");p=x("react.lazy");q=x("react.block");r=x("react.server.block");u=x("react.fundamental");v=x("react.debug_trace_mode");w=x("react.legacy_hidden")} -function y(a){if("object"===typeof a&&null!==a){var t=a.$$typeof;switch(t){case b:switch(a=a.type,a){case d:case f:case e:case l:case m:return a;default:switch(a=a&&a.$$typeof,a){case h:case k:case p:case n:case g:return a;default:return t}}case c:return t}}}var z=g,A=b,B=k,C=d,D=p,E=n,F=c,G=f,H=e,I=l;__webpack_unused_export__=h;__webpack_unused_export__=z;__webpack_unused_export__=A;__webpack_unused_export__=B;__webpack_unused_export__=C;__webpack_unused_export__=D;__webpack_unused_export__=E;__webpack_unused_export__=F;__webpack_unused_export__=G;__webpack_unused_export__=H; -__webpack_unused_export__=I;__webpack_unused_export__=function(){return!1};__webpack_unused_export__=function(){return!1};__webpack_unused_export__=function(a){return y(a)===h};__webpack_unused_export__=function(a){return y(a)===g};__webpack_unused_export__=function(a){return"object"===typeof a&&null!==a&&a.$$typeof===b};__webpack_unused_export__=function(a){return y(a)===k};__webpack_unused_export__=function(a){return y(a)===d};__webpack_unused_export__=function(a){return y(a)===p};__webpack_unused_export__=function(a){return y(a)===n}; -__webpack_unused_export__=function(a){return y(a)===c};__webpack_unused_export__=function(a){return y(a)===f};__webpack_unused_export__=function(a){return y(a)===e};__webpack_unused_export__=function(a){return y(a)===l};__webpack_unused_export__=function(a){return"string"===typeof a||"function"===typeof a||a===d||a===f||a===v||a===e||a===l||a===m||a===w||"object"===typeof a&&null!==a&&(a.$$typeof===p||a.$$typeof===n||a.$$typeof===g||a.$$typeof===h||a.$$typeof===k||a.$$typeof===u||a.$$typeof===q||a[0]===r)?!0:!1}; -__webpack_unused_export__=y; - - -/***/ }), - -/***/ 1915: -/***/ ((module, __unused_webpack_exports, __webpack_require__) => { - -"use strict"; - - -if (true) { - /* unused reexport */ __webpack_require__(2287); -} else {} + +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? +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; +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; +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}; +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}; +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; /***/ }), @@ -866,265 +1072,6 @@ /***/ }), -/***/ 1880: -/***/ ((module, __unused_webpack_exports, __webpack_require__) => { - -"use strict"; - - -var reactIs = __webpack_require__(1178); - -/** - * Copyright 2015, Yahoo! Inc. - * Copyrights licensed under the New BSD License. See the accompanying LICENSE file for terms. - */ -var REACT_STATICS = { - childContextTypes: true, - contextType: true, - contextTypes: true, - defaultProps: true, - displayName: true, - getDefaultProps: true, - getDerivedStateFromError: true, - getDerivedStateFromProps: true, - mixins: true, - propTypes: true, - type: true -}; -var KNOWN_STATICS = { - name: true, - length: true, - prototype: true, - caller: true, - callee: true, - arguments: true, - arity: true -}; -var FORWARD_REF_STATICS = { - '$$typeof': true, - render: true, - defaultProps: true, - displayName: true, - propTypes: true -}; -var MEMO_STATICS = { - '$$typeof': true, - compare: true, - defaultProps: true, - displayName: true, - propTypes: true, - type: true -}; -var TYPE_STATICS = {}; -TYPE_STATICS[reactIs.ForwardRef] = FORWARD_REF_STATICS; -TYPE_STATICS[reactIs.Memo] = MEMO_STATICS; - -function getStatics(component) { - // React v16.11 and below - if (reactIs.isMemo(component)) { - return MEMO_STATICS; - } // React v16.12 and above - - - return TYPE_STATICS[component['$$typeof']] || REACT_STATICS; -} - -var defineProperty = Object.defineProperty; -var getOwnPropertyNames = Object.getOwnPropertyNames; -var getOwnPropertySymbols = Object.getOwnPropertySymbols; -var getOwnPropertyDescriptor = Object.getOwnPropertyDescriptor; -var getPrototypeOf = Object.getPrototypeOf; -var objectPrototype = Object.prototype; -function hoistNonReactStatics(targetComponent, sourceComponent, blacklist) { - if (typeof sourceComponent !== 'string') { - // don't hoist over string (html) components - if (objectPrototype) { - var inheritedComponent = getPrototypeOf(sourceComponent); - - if (inheritedComponent && inheritedComponent !== objectPrototype) { - hoistNonReactStatics(targetComponent, inheritedComponent, blacklist); - } - } - - var keys = getOwnPropertyNames(sourceComponent); - - if (getOwnPropertySymbols) { - keys = keys.concat(getOwnPropertySymbols(sourceComponent)); - } - - var targetStatics = getStatics(targetComponent); - var sourceStatics = getStatics(sourceComponent); - - for (var i = 0; i < keys.length; ++i) { - var key = keys[i]; - - if (!KNOWN_STATICS[key] && !(blacklist && blacklist[key]) && !(sourceStatics && sourceStatics[key]) && !(targetStatics && targetStatics[key])) { - var descriptor = getOwnPropertyDescriptor(sourceComponent, key); - - try { - // Avoid failures from read-only properties - defineProperty(targetComponent, key, descriptor); - } catch (e) {} - } - } - } - - return targetComponent; -} - -module.exports = hoistNonReactStatics; - - -/***/ }), - -/***/ 2950: -/***/ ((__unused_webpack_module, exports) => { - -"use strict"; -/** @license React v16.13.1 - * react-is.production.min.js - * - * Copyright (c) Facebook, Inc. and its affiliates. - * - * This source code is licensed under the MIT license found in the - * LICENSE file in the root directory of this source tree. - */ - -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? -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; -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; -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}; -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}; -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; - - -/***/ }), - -/***/ 1178: -/***/ ((module, __unused_webpack_exports, __webpack_require__) => { - -"use strict"; - - -if (true) { - module.exports = __webpack_require__(2950); -} else {} - - -/***/ }), - -/***/ 628: -/***/ ((module, __unused_webpack_exports, __webpack_require__) => { - -"use strict"; -/** - * Copyright (c) 2013-present, Facebook, Inc. - * - * This source code is licensed under the MIT license found in the - * LICENSE file in the root directory of this source tree. - */ - - - -var ReactPropTypesSecret = __webpack_require__(4067); - -function emptyFunction() {} -function emptyFunctionWithReset() {} -emptyFunctionWithReset.resetWarningCache = emptyFunction; - -module.exports = function() { - function shim(props, propName, componentName, location, propFullName, secret) { - if (secret === ReactPropTypesSecret) { - // It is still safe when called from React. - return; - } - var err = new Error( - 'Calling PropTypes validators directly is not supported by the `prop-types` package. ' + - 'Use PropTypes.checkPropTypes() to call them. ' + - 'Read more at http://fb.me/use-check-prop-types' - ); - err.name = 'Invariant Violation'; - throw err; - }; - shim.isRequired = shim; - function getShim() { - return shim; - }; - // Important! - // Keep this list in sync with production version in `./factoryWithTypeCheckers.js`. - var ReactPropTypes = { - array: shim, - bigint: shim, - bool: shim, - func: shim, - number: shim, - object: shim, - string: shim, - symbol: shim, - - any: shim, - arrayOf: getShim, - element: shim, - elementType: shim, - instanceOf: getShim, - node: shim, - objectOf: getShim, - oneOf: getShim, - oneOfType: getShim, - shape: getShim, - exact: getShim, - - checkPropTypes: emptyFunctionWithReset, - resetWarningCache: emptyFunction - }; - - ReactPropTypes.PropTypes = ReactPropTypes; - - return ReactPropTypes; -}; - - -/***/ }), - -/***/ 5826: -/***/ ((module, __unused_webpack_exports, __webpack_require__) => { - -/** - * Copyright (c) 2013-present, Facebook, Inc. - * - * This source code is licensed under the MIT license found in the - * LICENSE file in the root directory of this source tree. - */ - -if (false) { var throwOnDirectAccess, ReactIs; } else { - // By explicitly using `prop-types` you are opting into new production behavior. - // http://fb.me/prop-types-in-prod - module.exports = __webpack_require__(628)(); -} - - -/***/ }), - -/***/ 4067: -/***/ ((module) => { - -"use strict"; -/** - * Copyright (c) 2013-present, Facebook, Inc. - * - * This source code is licensed under the MIT license found in the - * LICENSE file in the root directory of this source tree. - */ - - - -var ReactPropTypesSecret = 'SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED'; - -module.exports = ReactPropTypesSecret; - - -/***/ }), - /***/ 9681: /***/ ((module) => { @@ -1611,46 +1558,6 @@ module.exports.remove = removeAccents; -/***/ }), - -/***/ 8477: -/***/ ((__unused_webpack_module, exports, __webpack_require__) => { - -"use strict"; -/** - * @license React - * use-sync-external-store-shim.production.min.js - * - * Copyright (c) Facebook, Inc. and its affiliates. - * - * This source code is licensed under the MIT license found in the - * LICENSE file in the root directory of this source tree. - */ -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} -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; - - -/***/ }), - -/***/ 422: -/***/ ((module, __unused_webpack_exports, __webpack_require__) => { - -"use strict"; - - -if (true) { - module.exports = __webpack_require__(8477); -} else {} - - -/***/ }), - -/***/ 1609: -/***/ ((module) => { - -"use strict"; -module.exports = window["React"]; - /***/ }) /******/ }); @@ -1757,7 +1664,7 @@ /******/ /************************************************************************/ var __webpack_exports__ = {}; -// This entry need to be wrapped in an IIFE because it need to be in strict mode. +// This entry needs to be wrapped in an IIFE because it needs to be in strict mode. (() => { "use strict"; // ESM COMPAT FLAG @@ -1765,11 +1672,15 @@ // EXPORTS __webpack_require__.d(__webpack_exports__, { + AlignmentMatrixControl: () => (/* reexport */ alignment_matrix_control), AnglePickerControl: () => (/* reexport */ angle_picker_control), Animate: () => (/* reexport */ animate), Autocomplete: () => (/* reexport */ Autocomplete), BaseControl: () => (/* reexport */ base_control), BlockQuotation: () => (/* reexport */ external_wp_primitives_namespaceObject.BlockQuotation), + BorderBoxControl: () => (/* reexport */ border_box_control_component), + BorderControl: () => (/* reexport */ border_control_component), + BoxControl: () => (/* reexport */ box_control), Button: () => (/* reexport */ build_module_button), ButtonGroup: () => (/* reexport */ button_group), Card: () => (/* reexport */ card_component), @@ -1785,8 +1696,9 @@ ColorPalette: () => (/* reexport */ color_palette), ColorPicker: () => (/* reexport */ LegacyAdapter), ComboboxControl: () => (/* reexport */ combobox_control), + Composite: () => (/* reexport */ Composite), CustomGradientPicker: () => (/* reexport */ custom_gradient_picker), - CustomSelectControl: () => (/* reexport */ StableCustomSelectControl), + CustomSelectControl: () => (/* reexport */ custom_select_control), Dashicon: () => (/* reexport */ dashicon), DatePicker: () => (/* reexport */ date), DateTimePicker: () => (/* reexport */ build_module_date_time), @@ -1825,6 +1737,7 @@ MenuItemsChoice: () => (/* reexport */ menu_items_choice), Modal: () => (/* reexport */ modal), NavigableMenu: () => (/* reexport */ navigable_container_menu), + Navigator: () => (/* reexport */ navigator_Navigator), Notice: () => (/* reexport */ build_module_notice), NoticeList: () => (/* reexport */ list), Panel: () => (/* reexport */ panel), @@ -1894,11 +1807,11 @@ __experimentalNavigationGroup: () => (/* reexport */ group), __experimentalNavigationItem: () => (/* reexport */ navigation_item), __experimentalNavigationMenu: () => (/* reexport */ navigation_menu), - __experimentalNavigatorBackButton: () => (/* reexport */ navigator_back_button_component), - __experimentalNavigatorButton: () => (/* reexport */ navigator_button_component), - __experimentalNavigatorProvider: () => (/* reexport */ navigator_provider_component), - __experimentalNavigatorScreen: () => (/* reexport */ navigator_screen_component), - __experimentalNavigatorToParentButton: () => (/* reexport */ navigator_to_parent_button_component), + __experimentalNavigatorBackButton: () => (/* reexport */ legacy_NavigatorBackButton), + __experimentalNavigatorButton: () => (/* reexport */ legacy_NavigatorButton), + __experimentalNavigatorProvider: () => (/* reexport */ NavigatorProvider), + __experimentalNavigatorScreen: () => (/* reexport */ legacy_NavigatorScreen), + __experimentalNavigatorToParentButton: () => (/* reexport */ legacy_NavigatorToParentButton), __experimentalNumberControl: () => (/* reexport */ number_control), __experimentalPaletteEdit: () => (/* reexport */ palette_edit), __experimentalParseQuantityAndUnitFromRawValue: () => (/* reexport */ parseQuantityAndUnitFromRawValue), @@ -1923,7 +1836,7 @@ __experimentalTruncate: () => (/* reexport */ truncate_component), __experimentalUnitControl: () => (/* reexport */ unit_control), __experimentalUseCustomUnits: () => (/* reexport */ useCustomUnits), - __experimentalUseNavigator: () => (/* reexport */ use_navigator), + __experimentalUseNavigator: () => (/* reexport */ useNavigator), __experimentalUseSlot: () => (/* reexport */ useSlot), __experimentalUseSlotFills: () => (/* reexport */ useSlotFills), __experimentalVStack: () => (/* reexport */ v_stack_component), @@ -1936,7 +1849,6 @@ __unstableDisclosureContent: () => (/* reexport */ disclosure_DisclosureContent), __unstableGetAnimateClassName: () => (/* reexport */ getAnimateClassName), __unstableMotion: () => (/* reexport */ motion), - __unstableMotionContext: () => (/* reexport */ MotionContext), __unstableUseAutocompleteProps: () => (/* reexport */ useAutocompleteProps), __unstableUseCompositeState: () => (/* reexport */ useCompositeState), __unstableUseNavigateRegions: () => (/* reexport */ useNavigateRegions), @@ -1944,6 +1856,7 @@ navigateRegions: () => (/* reexport */ navigate_regions), privateApis: () => (/* reexport */ privateApis), useBaseControlProps: () => (/* reexport */ useBaseControlProps), + useNavigator: () => (/* reexport */ useNavigator), withConstrainedTabbing: () => (/* reexport */ with_constrained_tabbing), withFallbackStyles: () => (/* reexport */ with_fallback_styles), withFilters: () => (/* reexport */ withFilters), @@ -1970,35 +1883,23 @@ var toggle_group_control_option_base_styles_namespaceObject = {}; __webpack_require__.r(toggle_group_control_option_base_styles_namespaceObject); __webpack_require__.d(toggle_group_control_option_base_styles_namespaceObject, { - ButtonContentView: () => (ButtonContentView), - LabelView: () => (LabelView), - ou: () => (backdropView), + Rp: () => (ButtonContentView), + y0: () => (LabelView), uG: () => (buttonView), eh: () => (labelBlock) }); -;// CONCATENATED MODULE: external ["wp","primitives"] +;// external ["wp","primitives"] const external_wp_primitives_namespaceObject = window["wp"]["primitives"]; -;// CONCATENATED MODULE: ./node_modules/clsx/dist/clsx.mjs +;// ./node_modules/clsx/dist/clsx.mjs 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 key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value; -var _4R3V3JGP_spreadValues = (a, b) => { +var _3YLGPPWQ_spreadValues = (a, b) => { for (var prop in b || (b = {})) if (__hasOwnProp.call(b, prop)) __defNormalProp(a, prop, b[prop]); @@ -2018,7 +1919,7 @@ } return a; }; -var _4R3V3JGP_spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b)); +var _3YLGPPWQ_spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b)); var __objRest = (source, exclude) => { var target = {}; for (var prop in source) @@ -2034,35 +1935,35 @@ -;// CONCATENATED MODULE: ./node_modules/@ariakit/core/esm/__chunks/4R3V3JGP.js -"use client"; -var _4R3V3JGP_defProp = Object.defineProperty; -var _4R3V3JGP_defProps = Object.defineProperties; -var _4R3V3JGP_getOwnPropDescs = Object.getOwnPropertyDescriptors; -var _4R3V3JGP_getOwnPropSymbols = Object.getOwnPropertySymbols; -var _4R3V3JGP_hasOwnProp = Object.prototype.hasOwnProperty; -var _4R3V3JGP_propIsEnum = Object.prototype.propertyIsEnumerable; -var _4R3V3JGP_defNormalProp = (obj, key, value) => key in obj ? _4R3V3JGP_defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value; -var _chunks_4R3V3JGP_spreadValues = (a, b) => { +;// ./node_modules/@ariakit/core/esm/__chunks/3YLGPPWQ.js +"use client"; +var _3YLGPPWQ_defProp = Object.defineProperty; +var _3YLGPPWQ_defProps = Object.defineProperties; +var _3YLGPPWQ_getOwnPropDescs = Object.getOwnPropertyDescriptors; +var _3YLGPPWQ_getOwnPropSymbols = Object.getOwnPropertySymbols; +var _3YLGPPWQ_hasOwnProp = Object.prototype.hasOwnProperty; +var _3YLGPPWQ_propIsEnum = Object.prototype.propertyIsEnumerable; +var _3YLGPPWQ_defNormalProp = (obj, key, value) => key in obj ? _3YLGPPWQ_defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value; +var _chunks_3YLGPPWQ_spreadValues = (a, b) => { for (var prop in b || (b = {})) - if (_4R3V3JGP_hasOwnProp.call(b, prop)) - _4R3V3JGP_defNormalProp(a, prop, b[prop]); - if (_4R3V3JGP_getOwnPropSymbols) - for (var prop of _4R3V3JGP_getOwnPropSymbols(b)) { - if (_4R3V3JGP_propIsEnum.call(b, prop)) - _4R3V3JGP_defNormalProp(a, prop, b[prop]); + if (_3YLGPPWQ_hasOwnProp.call(b, prop)) + _3YLGPPWQ_defNormalProp(a, prop, b[prop]); + if (_3YLGPPWQ_getOwnPropSymbols) + for (var prop of _3YLGPPWQ_getOwnPropSymbols(b)) { + if (_3YLGPPWQ_propIsEnum.call(b, prop)) + _3YLGPPWQ_defNormalProp(a, prop, b[prop]); } return a; }; -var _chunks_4R3V3JGP_spreadProps = (a, b) => _4R3V3JGP_defProps(a, _4R3V3JGP_getOwnPropDescs(b)); -var _4R3V3JGP_objRest = (source, exclude) => { +var _chunks_3YLGPPWQ_spreadProps = (a, b) => _3YLGPPWQ_defProps(a, _3YLGPPWQ_getOwnPropDescs(b)); +var _3YLGPPWQ_objRest = (source, exclude) => { var target = {}; for (var prop in source) - if (_4R3V3JGP_hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0) + if (_3YLGPPWQ_hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0) target[prop] = source[prop]; - if (source != null && _4R3V3JGP_getOwnPropSymbols) - for (var prop of _4R3V3JGP_getOwnPropSymbols(source)) { - if (exclude.indexOf(prop) < 0 && _4R3V3JGP_propIsEnum.call(source, prop)) + if (source != null && _3YLGPPWQ_getOwnPropSymbols) + for (var prop of _3YLGPPWQ_getOwnPropSymbols(source)) { + if (exclude.indexOf(prop) < 0 && _3YLGPPWQ_propIsEnum.call(source, prop)) target[prop] = source[prop]; } return target; @@ -2070,7 +1971,7 @@ -;// CONCATENATED MODULE: ./node_modules/@ariakit/core/esm/__chunks/Y3OOHFCN.js +;// ./node_modules/@ariakit/core/esm/__chunks/PBFD2E7P.js "use client"; @@ -2078,21 +1979,15 @@ function noop(..._) { } function shallowEqual(a, b) { - if (a === b) - return true; - if (!a) - return false; - if (!b) - return false; - if (typeof a !== "object") - return false; - if (typeof b !== "object") - return false; + if (a === b) return true; + if (!a) return false; + if (!b) return false; + if (typeof a !== "object") return false; + if (typeof b !== "object") return false; const aKeys = Object.keys(a); const bKeys = Object.keys(b); const { length } = aKeys; - if (bKeys.length !== length) - return false; + if (bKeys.length !== length) return false; for (const key of aKeys) { if (a[key] !== b[key]) { return false; @@ -2100,7 +1995,7 @@ } return true; } -function Y3OOHFCN_applyState(argument, currentValue) { +function applyState(argument, currentValue) { if (isUpdater(argument)) { const value = isLazyValue(currentValue) ? currentValue() : currentValue; return argument(value); @@ -2117,14 +2012,10 @@ return typeof arg === "object" && arg != null; } function isEmpty(arg) { - if (Array.isArray(arg)) - return !arg.length; - if (isObject(arg)) - return !Object.keys(arg).length; - if (arg == null) - return true; - if (arg === "") - return true; + if (Array.isArray(arg)) return !arg.length; + if (isObject(arg)) return !Object.keys(arg).length; + if (arg == null) return true; + if (arg === "") return true; return false; } function isInteger(arg) { @@ -2133,7 +2024,7 @@ } return String(Math.floor(Number(arg))) === arg; } -function Y3OOHFCN_hasOwnProperty(object, prop) { +function PBFD2E7P_hasOwnProperty(object, prop) { if (typeof Object.hasOwn === "function") { return Object.hasOwn(object, prop); } @@ -2155,9 +2046,9 @@ return str.normalize("NFD").replace(/[\u0300-\u036f]/g, ""); } function omit(object, keys) { - const result = _chunks_4R3V3JGP_spreadValues({}, object); + const result = _chunks_3YLGPPWQ_spreadValues({}, object); for (const key of keys) { - if (Y3OOHFCN_hasOwnProperty(result, key)) { + if (PBFD2E7P_hasOwnProperty(result, key)) { delete result[key]; } } @@ -2166,7 +2057,7 @@ function pick(object, paths) { const result = {}; for (const key of paths) { - if (Y3OOHFCN_hasOwnProperty(object, key)) { + if (PBFD2E7P_hasOwnProperty(object, key)) { result[key] = object[key]; } } @@ -2186,10 +2077,8 @@ return () => cancelAnimationFrame(raf); } function invariant(condition, message) { - if (condition) - return; - if (typeof message !== "string") - throw new Error("Invariant failed"); + if (condition) return; + if (typeof message !== "string") throw new Error("Invariant failed"); throw new Error(message); } function getKeys(obj) { @@ -2197,24 +2086,35 @@ } function isFalsyBooleanCallback(booleanOrCallback, ...args) { const result = typeof booleanOrCallback === "function" ? booleanOrCallback(...args) : booleanOrCallback; - if (result == null) - return false; + if (result == null) return false; return !result; } function disabledFromProps(props) { return props.disabled || props["aria-disabled"] === true || props["aria-disabled"] === "true"; } +function removeUndefinedValues(obj) { + const result = {}; + for (const key in obj) { + if (obj[key] !== void 0) { + result[key] = obj[key]; + } + } + return result; +} function defaultValue(...values) { for (const value of values) { - if (value !== void 0) - return value; + if (value !== void 0) return value; } return void 0; } -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/XM66DUTO.js +// EXTERNAL MODULE: external "React" +var external_React_ = __webpack_require__(1609); +var external_React_namespaceObject = /*#__PURE__*/__webpack_require__.t(external_React_, 2); +var external_React_default = /*#__PURE__*/__webpack_require__.n(external_React_); +;// ./node_modules/@ariakit/react-core/esm/__chunks/SK3NAZA3.js "use client"; @@ -2229,24 +2129,21 @@ } } function isValidElementWithRef(element) { - if (!element) - return false; - if (!(0,external_React_.isValidElement)(element)) - return false; - if (!("ref" in element)) - return false; - return true; + if (!element) return false; + if (!(0,external_React_.isValidElement)(element)) return false; + if ("ref" in element.props) return true; + if ("ref" in element) return true; + return false; } function getRefProperty(element) { - if (!isValidElementWithRef(element)) - return null; - return element.ref; + if (!isValidElementWithRef(element)) return null; + const props = _3YLGPPWQ_spreadValues({}, element.props); + return props.ref || element.ref; } function mergeProps(base, overrides) { - const props = _4R3V3JGP_spreadValues({}, base); + const props = _3YLGPPWQ_spreadValues({}, base); for (const key in overrides) { - if (!Y3OOHFCN_hasOwnProperty(overrides, key)) - continue; + if (!PBFD2E7P_hasOwnProperty(overrides, key)) continue; if (key === "className") { const prop = "className"; props[prop] = base[prop] ? `${base[prop]} ${overrides[prop]}` : overrides[prop]; @@ -2254,7 +2151,7 @@ } if (key === "style") { const prop = "style"; - props[prop] = base[prop] ? _4R3V3JGP_spreadValues(_4R3V3JGP_spreadValues({}, base[prop]), overrides[prop]) : overrides[prop]; + props[prop] = base[prop] ? _3YLGPPWQ_spreadValues(_3YLGPPWQ_spreadValues({}, base[prop]), overrides[prop]) : overrides[prop]; continue; } const overrideValue = overrides[key]; @@ -2275,7 +2172,7 @@ -;// CONCATENATED MODULE: ./node_modules/@ariakit/core/esm/__chunks/DLOEKDPY.js +;// ./node_modules/@ariakit/core/esm/__chunks/DTR5TSDJ.js "use client"; // src/utils/dom.ts @@ -2284,14 +2181,18 @@ var _a; return typeof window !== "undefined" && !!((_a = window.document) == null ? void 0 : _a.createElement); } -function DLOEKDPY_getDocument(node) { - return node ? node.ownerDocument || node : document; +function getDocument(node) { + if (!node) return document; + if ("self" in node) return node.document; + return node.ownerDocument || document; } function getWindow(node) { - return DLOEKDPY_getDocument(node).defaultView || window; + if (!node) return self; + if ("self" in node) return node.self; + return getDocument(node).defaultView || window; } function getActiveElement(node, activeDescendant = false) { - const { activeElement } = DLOEKDPY_getDocument(node); + const { activeElement } = getDocument(node); if (!(activeElement == null ? void 0 : activeElement.nodeName)) { return null; } @@ -2304,7 +2205,7 @@ if (activeDescendant) { const id = activeElement.getAttribute("aria-activedescendant"); if (id) { - const element = DLOEKDPY_getDocument(activeElement).getElementById(id); + const element = getDocument(activeElement).getElementById(id); if (element) { return element; } @@ -2320,8 +2221,7 @@ } function isButton(element) { const tagName = element.tagName.toLowerCase(); - if (tagName === "button") - return true; + if (tagName === "button") return true; if (tagName === "input" && element.type) { return buttonInputTypes.indexOf(element.type) !== -1; } @@ -2335,30 +2235,14 @@ "reset", "submit" ]; -function matches(element, selectors) { - if ("matches" in element) { - return element.matches(selectors); - } - if ("msMatchesSelector" in element) { - return element.msMatchesSelector(selectors); - } - return element.webkitMatchesSelector(selectors); -} function isVisible(element) { + if (typeof element.checkVisibility === "function") { + return element.checkVisibility(); + } const htmlElement = element; return htmlElement.offsetWidth > 0 || htmlElement.offsetHeight > 0 || element.getClientRects().length > 0; } -function DLOEKDPY_closest(element, selectors) { - if ("closest" in element) - return element.closest(selectors); - do { - if (matches(element, selectors)) - return element; - element = element.parentElement || element.parentNode; - } while (element !== null && element.nodeType === 1); - return null; -} -function DLOEKDPY_isTextField(element) { +function isTextField(element) { try { const isTextInput = element instanceof HTMLInputElement && element.selectionStart !== null; const isTextArea = element.tagName === "TEXTAREA"; @@ -2367,6 +2251,40 @@ return false; } } +function isTextbox(element) { + return element.isContentEditable || isTextField(element); +} +function getTextboxValue(element) { + if (isTextField(element)) { + return element.value; + } + if (element.isContentEditable) { + const range = getDocument(element).createRange(); + range.selectNodeContents(element); + return range.toString(); + } + return ""; +} +function getTextboxSelection(element) { + let start = 0; + let end = 0; + if (isTextField(element)) { + start = element.selectionStart || 0; + end = element.selectionEnd || 0; + } else if (element.isContentEditable) { + const selection = getDocument(element).getSelection(); + if ((selection == null ? void 0 : selection.rangeCount) && selection.anchorNode && contains(element, selection.anchorNode) && selection.focusNode && contains(element, selection.focusNode)) { + const range = selection.getRangeAt(0); + const nextRange = range.cloneRange(); + nextRange.selectNodeContents(element); + nextRange.setEnd(range.startContainer, range.startOffset); + start = nextRange.toString().length; + nextRange.setEnd(range.endContainer, range.endOffset); + end = nextRange.toString().length; + } + } + return { start, end }; +} function getPopupRole(element, fallback) { const allowedPopupRoles = ["dialog", "menu", "listbox", "tree", "grid"]; const role = element == null ? void 0 : element.getAttribute("role"); @@ -2380,61 +2298,38 @@ const itemRoleByPopupRole = { menu: "menuitem", listbox: "option", - tree: "treeitem", - grid: "gridcell" + tree: "treeitem" }; const popupRole = getPopupRole(element); - if (!popupRole) - return fallback; + if (!popupRole) return fallback; const key = popupRole; return (_a = itemRoleByPopupRole[key]) != null ? _a : fallback; } -function getTextboxSelection(element) { - let start = 0; - let end = 0; - if (DLOEKDPY_isTextField(element)) { - start = element.selectionStart || 0; - end = element.selectionEnd || 0; - } else if (element.isContentEditable) { - const selection = DLOEKDPY_getDocument(element).getSelection(); - if ((selection == null ? void 0 : selection.rangeCount) && selection.anchorNode && contains(element, selection.anchorNode) && selection.focusNode && contains(element, selection.focusNode)) { - const range = selection.getRangeAt(0); - const nextRange = range.cloneRange(); - nextRange.selectNodeContents(element); - nextRange.setEnd(range.startContainer, range.startOffset); - start = nextRange.toString().length; - nextRange.setEnd(range.endContainer, range.endOffset); - end = nextRange.toString().length; - } - } - return { start, end }; -} function scrollIntoViewIfNeeded(element, arg) { if (isPartiallyHidden(element) && "scrollIntoView" in element) { element.scrollIntoView(arg); } } function getScrollingElement(element) { - if (!element) - return null; + if (!element) return null; + const isScrollableOverflow = (overflow) => { + if (overflow === "auto") return true; + if (overflow === "scroll") return true; + return false; + }; if (element.clientHeight && element.scrollHeight > element.clientHeight) { const { overflowY } = getComputedStyle(element); - const isScrollable = overflowY !== "visible" && overflowY !== "hidden"; - if (isScrollable) - return element; + if (isScrollableOverflow(overflowY)) return element; } else if (element.clientWidth && element.scrollWidth > element.clientWidth) { const { overflowX } = getComputedStyle(element); - const isScrollable = overflowX !== "visible" && overflowX !== "hidden"; - if (isScrollable) - return element; + if (isScrollableOverflow(overflowX)) return element; } return getScrollingElement(element.parentElement) || document.scrollingElement || document.body; } function isPartiallyHidden(element) { const elementRect = element.getBoundingClientRect(); const scroller = getScrollingElement(element); - if (!scroller) - return false; + if (!scroller) return false; const scrollerRect = scroller.getBoundingClientRect(); const isHTML = scroller.tagName === "HTML"; const scrollerTop = isHTML ? scrollerRect.top + scroller.scrollTop : scrollerRect.top; @@ -2452,10 +2347,39 @@ element.setSelectionRange(...args); } } - - - -;// CONCATENATED MODULE: ./node_modules/@ariakit/core/esm/__chunks/MHPO2BXA.js +function sortBasedOnDOMPosition(items, getElement) { + const pairs = items.map((item, index) => [index, item]); + let isOrderDifferent = false; + pairs.sort(([indexA, a], [indexB, b]) => { + const elementA = getElement(a); + const elementB = getElement(b); + if (elementA === elementB) return 0; + if (!elementA || !elementB) return 0; + if (isElementPreceding(elementA, elementB)) { + if (indexA > indexB) { + isOrderDifferent = true; + } + return -1; + } + if (indexA < indexB) { + isOrderDifferent = true; + } + return 1; + }); + if (isOrderDifferent) { + return pairs.map(([_, item]) => item); + } + return items; +} +function isElementPreceding(a, b) { + return Boolean( + b.compareDocumentPosition(a) & Node.DOCUMENT_POSITION_PRECEDING + ); +} + + + +;// ./node_modules/@ariakit/core/esm/__chunks/QAGXQEUG.js "use client"; @@ -2464,8 +2388,7 @@ return canUseDOM && !!navigator.maxTouchPoints; } function isApple() { - if (!canUseDOM) - return false; + if (!canUseDOM) return false; return /mac|iphone|ipad|ipod/i.test(navigator.platform); } function isSafari() { @@ -2480,7 +2403,7 @@ -;// CONCATENATED MODULE: ./node_modules/@ariakit/core/esm/utils/events.js +;// ./node_modules/@ariakit/core/esm/utils/events.js "use client"; @@ -2497,35 +2420,24 @@ } function isOpeningInNewTab(event) { const element = event.currentTarget; - if (!element) - return false; + if (!element) return false; const isAppleDevice = isApple(); - if (isAppleDevice && !event.metaKey) - return false; - if (!isAppleDevice && !event.ctrlKey) - return false; + if (isAppleDevice && !event.metaKey) return false; + if (!isAppleDevice && !event.ctrlKey) return false; const tagName = element.tagName.toLowerCase(); - if (tagName === "a") - return true; - if (tagName === "button" && element.type === "submit") - return true; - if (tagName === "input" && element.type === "submit") - return true; + if (tagName === "a") return true; + if (tagName === "button" && element.type === "submit") return true; + if (tagName === "input" && element.type === "submit") return true; return false; } function isDownloading(event) { const element = event.currentTarget; - if (!element) - return false; + if (!element) return false; const tagName = element.tagName.toLowerCase(); - if (!event.altKey) - return false; - if (tagName === "a") - return true; - if (tagName === "button" && element.type === "submit") - return true; - if (tagName === "input" && element.type === "submit") - return true; + if (!event.altKey) return false; + if (tagName === "a") return true; + if (tagName === "button" && element.type === "submit") return true; + if (tagName === "input" && element.type === "submit") return true; return false; } function fireEvent(element, type, eventInit) { @@ -2535,7 +2447,7 @@ function fireBlurEvent(element, eventInit) { const event = new FocusEvent("blur", eventInit); const defaultAllowed = element.dispatchEvent(event); - const bubbleInit = _chunks_4R3V3JGP_spreadProps(_chunks_4R3V3JGP_spreadValues({}, eventInit), { bubbles: true }); + const bubbleInit = _chunks_3YLGPPWQ_spreadProps(_chunks_3YLGPPWQ_spreadValues({}, eventInit), { bubbles: true }); element.dispatchEvent(new FocusEvent("focusout", bubbleInit)); return defaultAllowed; } @@ -2559,20 +2471,32 @@ const relatedTarget = event.relatedTarget; return !relatedTarget || !contains(containerElement, relatedTarget); } -function queueBeforeEvent(element, type, callback) { - const raf = requestAnimationFrame(() => { - element.removeEventListener(type, callImmediately, true); +function getInputType(event) { + const nativeEvent = "nativeEvent" in event ? event.nativeEvent : event; + if (!nativeEvent) return; + if (!("inputType" in nativeEvent)) return; + if (typeof nativeEvent.inputType !== "string") return; + return nativeEvent.inputType; +} +function queueBeforeEvent(element, type, callback, timeout) { + const createTimer = (callback2) => { + if (timeout) { + const timerId2 = setTimeout(callback2, timeout); + return () => clearTimeout(timerId2); + } + const timerId = requestAnimationFrame(callback2); + return () => cancelAnimationFrame(timerId); + }; + const cancelTimer = createTimer(() => { + element.removeEventListener(type, callSync, true); callback(); }); - const callImmediately = () => { - cancelAnimationFrame(raf); + const callSync = () => { + cancelTimer(); callback(); }; - element.addEventListener(type, callImmediately, { - once: true, - capture: true - }); - return raf; + element.addEventListener(type, callSync, { once: true, capture: true }); + return cancelTimer; } function addGlobalEventListener(type, listener, options, scope = window) { const children = []; @@ -2588,13 +2512,15 @@ scope.document.removeEventListener(type, listener, options); } catch (e) { } - children.forEach((remove) => remove()); + for (const remove of children) { + remove(); + } }; return removeEventListener; } -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/6O5OEQGF.js +;// ./node_modules/@ariakit/react-core/esm/__chunks/ABQUS43J.js "use client"; @@ -2604,8 +2530,7 @@ - -var _React = _4R3V3JGP_spreadValues({}, external_React_namespaceObject); +var _React = _3YLGPPWQ_spreadValues({}, external_React_namespaceObject); var useReactId = _React.useId; var useReactDeferredValue = _React.useDeferredValue; var useReactInsertionEffect = _React.useInsertionEffect; @@ -2651,35 +2576,42 @@ return (_a = ref.current) == null ? void 0 : _a.call(ref, ...args); }, []); } +function useTransactionState(callback) { + const [state, setState] = (0,external_React_.useState)(null); + useSafeLayoutEffect(() => { + if (state == null) return; + if (!callback) return; + let prevState = null; + callback((prev) => { + prevState = prev; + return state; + }); + return () => { + callback(prevState); + }; + }, [state, callback]); + return [state, setState]; +} function useMergeRefs(...refs) { return (0,external_React_.useMemo)(() => { - if (!refs.some(Boolean)) - return; + if (!refs.some(Boolean)) return; return (value) => { - refs.forEach((ref) => setRef(ref, value)); + for (const ref of refs) { + setRef(ref, value); + } }; }, refs); } -function useRefId(ref, deps) { - const [id, setId] = useState(void 0); - useSafeLayoutEffect(() => { - var _a; - setId((_a = ref == null ? void 0 : ref.current) == null ? void 0 : _a.id); - }, deps); - return id; -} function useId(defaultId) { if (useReactId) { const reactId = useReactId(); - if (defaultId) - return defaultId; + if (defaultId) return defaultId; return reactId; } const [id, setId] = (0,external_React_.useState)(defaultId); useSafeLayoutEffect(() => { - if (defaultId || id) - return; - const random = Math.random().toString(36).substr(2, 6); + if (defaultId || id) return; + const random = Math.random().toString(36).slice(2, 8); setId(`id-${random}`); }, [defaultId, id]); return defaultId || id; @@ -2697,8 +2629,7 @@ } function useTagName(refOrElement, type) { const stringOrUndefined = (type2) => { - if (typeof type2 !== "string") - return; + if (typeof type2 !== "string") return; return type2; }; const [tagName, setTagName] = (0,external_React_.useState)(() => stringOrUndefined(type)); @@ -2709,14 +2640,20 @@ return tagName; } function useAttribute(refOrElement, attributeName, defaultValue) { - const [attribute, setAttribute] = useState(defaultValue); - useSafeLayoutEffect(() => { + const initialValue = useInitialValue(defaultValue); + const [attribute, setAttribute] = (0,external_React_.useState)(initialValue); + (0,external_React_.useEffect)(() => { const element = refOrElement && "current" in refOrElement ? refOrElement.current : refOrElement; - const value = element == null ? void 0 : element.getAttribute(attributeName); - if (value == null) - return; - setAttribute(value); - }, [refOrElement, attributeName]); + if (!element) return; + const callback = () => { + const value = element.getAttribute(attributeName); + setAttribute(value == null ? initialValue : value); + }; + const observer = new MutationObserver(callback); + observer.observe(element, { attributeFilter: [attributeName] }); + callback(); + return () => observer.disconnect(); + }, [refOrElement, attributeName, initialValue]); return attribute; } function useUpdateEffect(effect, deps) { @@ -2749,39 +2686,6 @@ [] ); } -function useControlledState(defaultState, state, setState) { - const [localState, setLocalState] = useState(defaultState); - const nextState = state !== void 0 ? state : localState; - const stateRef = useLiveRef(state); - const setStateRef = useLiveRef(setState); - const nextStateRef = useLiveRef(nextState); - const setNextState = useCallback((prevValue) => { - const setStateProp = setStateRef.current; - if (setStateProp) { - if (isSetNextState(setStateProp)) { - setStateProp(prevValue); - } else { - const nextValue = applyState(prevValue, nextStateRef.current); - nextStateRef.current = nextValue; - setStateProp(nextValue); - } - } - if (stateRef.current === void 0) { - setLocalState(prevValue); - } - }, []); - defineSetNextState(setNextState); - return [nextState, setNextState]; -} -var SET_NEXT_STATE = Symbol("setNextState"); -function isSetNextState(arg) { - return arg[SET_NEXT_STATE] === true; -} -function defineSetNextState(arg) { - if (!isSetNextState(arg)) { - Object.defineProperty(arg, SET_NEXT_STATE, { value: true }); - } -} function useForceUpdate() { return (0,external_React_.useReducer)(() => [], []); } @@ -2800,7 +2704,7 @@ }, [...deps, props.wrapElement] ); - return _4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues({}, props), { wrapElement }); + return _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, props), { wrapElement }); } function usePortalRef(portalProp = false, portalRefProp) { const [portalNode, setPortalNode] = (0,external_React_.useState)(null); @@ -2812,7 +2716,7 @@ const parent = props.onLoadedMetadataCapture; const onLoadedMetadataCapture = (0,external_React_.useMemo)(() => { return Object.assign(() => { - }, _4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues({}, parent), { [key]: value })); + }, _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, parent), { [key]: value })); }, [parent, key, value]); return [parent == null ? void 0 : parent[key], { onLoadedMetadataCapture }]; } @@ -2838,8 +2742,7 @@ return movementX || movementY || "production" === "test"; } function setMouseMoving(event) { - if (!hasMouseMovement(event)) - return; + if (!hasMouseMovement(event)) return; mouseMoving = true; } function resetMouseMoving() { @@ -2848,9 +2751,915 @@ -;// CONCATENATED MODULE: external "ReactJSXRuntime" +;// ./node_modules/@ariakit/core/esm/__chunks/BCALMBPZ.js +"use client"; + + + +// src/utils/store.ts +function getInternal(store, key) { + const internals = store.__unstableInternals; + invariant(internals, "Invalid store"); + return internals[key]; +} +function createStore(initialState, ...stores) { + let state = initialState; + let prevStateBatch = state; + let lastUpdate = Symbol(); + let destroy = noop; + const instances = /* @__PURE__ */ new Set(); + const updatedKeys = /* @__PURE__ */ new Set(); + const setups = /* @__PURE__ */ new Set(); + const listeners = /* @__PURE__ */ new Set(); + const batchListeners = /* @__PURE__ */ new Set(); + const disposables = /* @__PURE__ */ new WeakMap(); + const listenerKeys = /* @__PURE__ */ new WeakMap(); + const storeSetup = (callback) => { + setups.add(callback); + return () => setups.delete(callback); + }; + const storeInit = () => { + const initialized = instances.size; + const instance = Symbol(); + instances.add(instance); + const maybeDestroy = () => { + instances.delete(instance); + if (instances.size) return; + destroy(); + }; + if (initialized) return maybeDestroy; + const desyncs = getKeys(state).map( + (key) => chain( + ...stores.map((store) => { + var _a; + const storeState = (_a = store == null ? void 0 : store.getState) == null ? void 0 : _a.call(store); + if (!storeState) return; + if (!PBFD2E7P_hasOwnProperty(storeState, key)) return; + return sync(store, [key], (state2) => { + setState( + key, + state2[key], + // @ts-expect-error - Not public API. This is just to prevent + // infinite loops. + true + ); + }); + }) + ) + ); + const teardowns = []; + for (const setup2 of setups) { + teardowns.push(setup2()); + } + const cleanups = stores.map(init); + destroy = chain(...desyncs, ...teardowns, ...cleanups); + return maybeDestroy; + }; + const sub = (keys, listener, set = listeners) => { + set.add(listener); + listenerKeys.set(listener, keys); + return () => { + var _a; + (_a = disposables.get(listener)) == null ? void 0 : _a(); + disposables.delete(listener); + listenerKeys.delete(listener); + set.delete(listener); + }; + }; + const storeSubscribe = (keys, listener) => sub(keys, listener); + const storeSync = (keys, listener) => { + disposables.set(listener, listener(state, state)); + return sub(keys, listener); + }; + const storeBatch = (keys, listener) => { + disposables.set(listener, listener(state, prevStateBatch)); + return sub(keys, listener, batchListeners); + }; + const storePick = (keys) => createStore(pick(state, keys), finalStore); + const storeOmit = (keys) => createStore(omit(state, keys), finalStore); + const getState = () => state; + const setState = (key, value, fromStores = false) => { + var _a; + if (!PBFD2E7P_hasOwnProperty(state, key)) return; + const nextValue = applyState(value, state[key]); + if (nextValue === state[key]) return; + if (!fromStores) { + for (const store of stores) { + (_a = store == null ? void 0 : store.setState) == null ? void 0 : _a.call(store, key, nextValue); + } + } + const prevState = state; + state = _chunks_3YLGPPWQ_spreadProps(_chunks_3YLGPPWQ_spreadValues({}, state), { [key]: nextValue }); + const thisUpdate = Symbol(); + lastUpdate = thisUpdate; + updatedKeys.add(key); + const run = (listener, prev, uKeys) => { + var _a2; + const keys = listenerKeys.get(listener); + const updated = (k) => uKeys ? uKeys.has(k) : k === key; + if (!keys || keys.some(updated)) { + (_a2 = disposables.get(listener)) == null ? void 0 : _a2(); + disposables.set(listener, listener(state, prev)); + } + }; + for (const listener of listeners) { + run(listener, prevState); + } + queueMicrotask(() => { + if (lastUpdate !== thisUpdate) return; + const snapshot = state; + for (const listener of batchListeners) { + run(listener, prevStateBatch, updatedKeys); + } + prevStateBatch = snapshot; + updatedKeys.clear(); + }); + }; + const finalStore = { + getState, + setState, + __unstableInternals: { + setup: storeSetup, + init: storeInit, + subscribe: storeSubscribe, + sync: storeSync, + batch: storeBatch, + pick: storePick, + omit: storeOmit + } + }; + return finalStore; +} +function setup(store, ...args) { + if (!store) return; + return getInternal(store, "setup")(...args); +} +function init(store, ...args) { + if (!store) return; + return getInternal(store, "init")(...args); +} +function subscribe(store, ...args) { + if (!store) return; + return getInternal(store, "subscribe")(...args); +} +function sync(store, ...args) { + if (!store) return; + return getInternal(store, "sync")(...args); +} +function batch(store, ...args) { + if (!store) return; + return getInternal(store, "batch")(...args); +} +function omit2(store, ...args) { + if (!store) return; + return getInternal(store, "omit")(...args); +} +function pick2(store, ...args) { + if (!store) return; + return getInternal(store, "pick")(...args); +} +function mergeStore(...stores) { + const initialState = stores.reduce((state, store2) => { + var _a; + const nextState = (_a = store2 == null ? void 0 : store2.getState) == null ? void 0 : _a.call(store2); + if (!nextState) return state; + return Object.assign(state, nextState); + }, {}); + const store = createStore(initialState, ...stores); + return Object.assign({}, ...stores, store); +} +function throwOnConflictingProps(props, store) { + if (true) return; + if (!store) return; + const defaultKeys = Object.entries(props).filter(([key, value]) => key.startsWith("default") && value !== void 0).map(([key]) => { + var _a; + const stateKey = key.replace("default", ""); + return `${((_a = stateKey[0]) == null ? void 0 : _a.toLowerCase()) || ""}${stateKey.slice(1)}`; + }); + if (!defaultKeys.length) return; + const storeState = store.getState(); + const conflictingProps = defaultKeys.filter( + (key) => PBFD2E7P_hasOwnProperty(storeState, key) + ); + if (!conflictingProps.length) return; + throw new Error( + `Passing a store prop in conjunction with a default state is not supported. + +const store = useSelectStore(); + + ^ ^ + +Instead, pass the default state to the topmost store: + +const store = useSelectStore({ defaultValue: "Apple" }); + + +See https://github.com/ariakit/ariakit/pull/2745 for more details. + +If there's a particular need for this, please submit a feature request at https://github.com/ariakit/ariakit +` + ); +} + + + +// EXTERNAL MODULE: ./node_modules/use-sync-external-store/shim/index.js +var shim = __webpack_require__(422); +;// ./node_modules/@ariakit/react-core/esm/__chunks/YV4JVR4I.js +"use client"; + + + +// src/utils/store.tsx + + + + +var { useSyncExternalStore } = shim; +var noopSubscribe = () => () => { +}; +function useStoreState(store, keyOrSelector = identity) { + const storeSubscribe = external_React_.useCallback( + (callback) => { + if (!store) return noopSubscribe(); + return subscribe(store, null, callback); + }, + [store] + ); + const getSnapshot = () => { + const key = typeof keyOrSelector === "string" ? keyOrSelector : null; + const selector = typeof keyOrSelector === "function" ? keyOrSelector : null; + const state = store == null ? void 0 : store.getState(); + if (selector) return selector(state); + if (!state) return; + if (!key) return; + if (!PBFD2E7P_hasOwnProperty(state, key)) return; + return state[key]; + }; + return useSyncExternalStore(storeSubscribe, getSnapshot, getSnapshot); +} +function useStoreStateObject(store, object) { + const objRef = external_React_.useRef( + {} + ); + const storeSubscribe = external_React_.useCallback( + (callback) => { + if (!store) return noopSubscribe(); + return subscribe(store, null, callback); + }, + [store] + ); + const getSnapshot = () => { + const state = store == null ? void 0 : store.getState(); + let updated = false; + const obj = objRef.current; + for (const prop in object) { + const keyOrSelector = object[prop]; + if (typeof keyOrSelector === "function") { + const value = keyOrSelector(state); + if (value !== obj[prop]) { + obj[prop] = value; + updated = true; + } + } + if (typeof keyOrSelector === "string") { + if (!state) continue; + if (!PBFD2E7P_hasOwnProperty(state, keyOrSelector)) continue; + const value = state[keyOrSelector]; + if (value !== obj[prop]) { + obj[prop] = value; + updated = true; + } + } + } + if (updated) { + objRef.current = _3YLGPPWQ_spreadValues({}, obj); + } + return objRef.current; + }; + return useSyncExternalStore(storeSubscribe, getSnapshot, getSnapshot); +} +function useStoreProps(store, props, key, setKey) { + const value = PBFD2E7P_hasOwnProperty(props, key) ? props[key] : void 0; + const setValue = setKey ? props[setKey] : void 0; + const propsRef = useLiveRef({ value, setValue }); + useSafeLayoutEffect(() => { + return sync(store, [key], (state, prev) => { + const { value: value2, setValue: setValue2 } = propsRef.current; + if (!setValue2) return; + if (state[key] === prev[key]) return; + if (state[key] === value2) return; + setValue2(state[key]); + }); + }, [store, key]); + useSafeLayoutEffect(() => { + if (value === void 0) return; + store.setState(key, value); + return batch(store, [key], () => { + if (value === void 0) return; + store.setState(key, value); + }); + }); +} +function YV4JVR4I_useStore(createStore, props) { + const [store, setStore] = external_React_.useState(() => createStore(props)); + useSafeLayoutEffect(() => init(store), [store]); + const useState2 = external_React_.useCallback( + (keyOrSelector) => useStoreState(store, keyOrSelector), + [store] + ); + const memoizedStore = external_React_.useMemo( + () => _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, store), { useState: useState2 }), + [store, useState2] + ); + const updateStore = useEvent(() => { + setStore((store2) => createStore(_3YLGPPWQ_spreadValues(_3YLGPPWQ_spreadValues({}, props), store2.getState()))); + }); + return [memoizedStore, updateStore]; +} + + + +;// ./node_modules/@ariakit/react-core/esm/__chunks/C3IKGW5T.js +"use client"; + + + +// src/collection/collection-store.ts + +function useCollectionStoreProps(store, update, props) { + useUpdateEffect(update, [props.store]); + useStoreProps(store, props, "items", "setItems"); + return store; +} +function useCollectionStore(props = {}) { + const [store, update] = useStore(Core.createCollectionStore, props); + return useCollectionStoreProps(store, update, props); +} + + + +;// ./node_modules/@ariakit/core/esm/__chunks/CYQWQL4J.js +"use client"; + + + + + +// src/collection/collection-store.ts +function getCommonParent(items) { + var _a; + const firstItem = items.find((item) => !!item.element); + const lastItem = [...items].reverse().find((item) => !!item.element); + let parentElement = (_a = firstItem == null ? void 0 : firstItem.element) == null ? void 0 : _a.parentElement; + while (parentElement && (lastItem == null ? void 0 : lastItem.element)) { + const parent = parentElement; + if (lastItem && parent.contains(lastItem.element)) { + return parentElement; + } + parentElement = parentElement.parentElement; + } + return getDocument(parentElement).body; +} +function getPrivateStore(store) { + return store == null ? void 0 : store.__unstablePrivateStore; +} +function createCollectionStore(props = {}) { + var _a; + throwOnConflictingProps(props, props.store); + const syncState = (_a = props.store) == null ? void 0 : _a.getState(); + const items = defaultValue( + props.items, + syncState == null ? void 0 : syncState.items, + props.defaultItems, + [] + ); + const itemsMap = new Map(items.map((item) => [item.id, item])); + const initialState = { + items, + renderedItems: defaultValue(syncState == null ? void 0 : syncState.renderedItems, []) + }; + const syncPrivateStore = getPrivateStore(props.store); + const privateStore = createStore( + { items, renderedItems: initialState.renderedItems }, + syncPrivateStore + ); + const collection = createStore(initialState, props.store); + const sortItems = (renderedItems) => { + const sortedItems = sortBasedOnDOMPosition(renderedItems, (i) => i.element); + privateStore.setState("renderedItems", sortedItems); + collection.setState("renderedItems", sortedItems); + }; + setup(collection, () => init(privateStore)); + setup(privateStore, () => { + return batch(privateStore, ["items"], (state) => { + collection.setState("items", state.items); + }); + }); + setup(privateStore, () => { + return batch(privateStore, ["renderedItems"], (state) => { + let firstRun = true; + let raf = requestAnimationFrame(() => { + const { renderedItems } = collection.getState(); + if (state.renderedItems === renderedItems) return; + sortItems(state.renderedItems); + }); + if (typeof IntersectionObserver !== "function") { + return () => cancelAnimationFrame(raf); + } + const ioCallback = () => { + if (firstRun) { + firstRun = false; + return; + } + cancelAnimationFrame(raf); + raf = requestAnimationFrame(() => sortItems(state.renderedItems)); + }; + const root = getCommonParent(state.renderedItems); + const observer = new IntersectionObserver(ioCallback, { root }); + for (const item of state.renderedItems) { + if (!item.element) continue; + observer.observe(item.element); + } + return () => { + cancelAnimationFrame(raf); + observer.disconnect(); + }; + }); + }); + const mergeItem = (item, setItems, canDeleteFromMap = false) => { + let prevItem; + setItems((items2) => { + const index = items2.findIndex(({ id }) => id === item.id); + const nextItems = items2.slice(); + if (index !== -1) { + prevItem = items2[index]; + const nextItem = _chunks_3YLGPPWQ_spreadValues(_chunks_3YLGPPWQ_spreadValues({}, prevItem), item); + nextItems[index] = nextItem; + itemsMap.set(item.id, nextItem); + } else { + nextItems.push(item); + itemsMap.set(item.id, item); + } + return nextItems; + }); + const unmergeItem = () => { + setItems((items2) => { + if (!prevItem) { + if (canDeleteFromMap) { + itemsMap.delete(item.id); + } + return items2.filter(({ id }) => id !== item.id); + } + const index = items2.findIndex(({ id }) => id === item.id); + if (index === -1) return items2; + const nextItems = items2.slice(); + nextItems[index] = prevItem; + itemsMap.set(item.id, prevItem); + return nextItems; + }); + }; + return unmergeItem; + }; + const registerItem = (item) => mergeItem( + item, + (getItems) => privateStore.setState("items", getItems), + true + ); + return _chunks_3YLGPPWQ_spreadProps(_chunks_3YLGPPWQ_spreadValues({}, collection), { + registerItem, + renderItem: (item) => chain( + registerItem(item), + mergeItem( + item, + (getItems) => privateStore.setState("renderedItems", getItems) + ) + ), + item: (id) => { + if (!id) return null; + let item = itemsMap.get(id); + if (!item) { + const { items: items2 } = privateStore.getState(); + item = items2.find((item2) => item2.id === id); + if (item) { + itemsMap.set(id, item); + } + } + return item || null; + }, + // @ts-expect-error Internal + __unstablePrivateStore: privateStore + }); +} + + + +;// ./node_modules/@ariakit/core/esm/__chunks/7PRQYBBV.js +"use client"; + +// src/utils/array.ts +function toArray(arg) { + if (Array.isArray(arg)) { + return arg; + } + return typeof arg !== "undefined" ? [arg] : []; +} +function addItemToArray(array, item, index = -1) { + if (!(index in array)) { + return [...array, item]; + } + return [...array.slice(0, index), item, ...array.slice(index)]; +} +function flatten2DArray(array) { + const flattened = []; + for (const row of array) { + flattened.push(...row); + } + return flattened; +} +function reverseArray(array) { + return array.slice().reverse(); +} + + + +;// ./node_modules/@ariakit/core/esm/__chunks/AJZ4BYF3.js +"use client"; + + + + + + +// src/composite/composite-store.ts +var NULL_ITEM = { id: null }; +function findFirstEnabledItem(items, excludeId) { + return items.find((item) => { + if (excludeId) { + return !item.disabled && item.id !== excludeId; + } + return !item.disabled; + }); +} +function getEnabledItems(items, excludeId) { + return items.filter((item) => { + if (excludeId) { + return !item.disabled && item.id !== excludeId; + } + return !item.disabled; + }); +} +function getItemsInRow(items, rowId) { + return items.filter((item) => item.rowId === rowId); +} +function flipItems(items, activeId, shouldInsertNullItem = false) { + const index = items.findIndex((item) => item.id === activeId); + return [ + ...items.slice(index + 1), + ...shouldInsertNullItem ? [NULL_ITEM] : [], + ...items.slice(0, index) + ]; +} +function groupItemsByRows(items) { + const rows = []; + for (const item of items) { + const row = rows.find((currentRow) => { + var _a; + return ((_a = currentRow[0]) == null ? void 0 : _a.rowId) === item.rowId; + }); + if (row) { + row.push(item); + } else { + rows.push([item]); + } + } + return rows; +} +function getMaxRowLength(array) { + let maxLength = 0; + for (const { length } of array) { + if (length > maxLength) { + maxLength = length; + } + } + return maxLength; +} +function createEmptyItem(rowId) { + return { + id: "__EMPTY_ITEM__", + disabled: true, + rowId + }; +} +function normalizeRows(rows, activeId, focusShift) { + const maxLength = getMaxRowLength(rows); + for (const row of rows) { + for (let i = 0; i < maxLength; i += 1) { + const item = row[i]; + if (!item || focusShift && item.disabled) { + const isFirst = i === 0; + const previousItem = isFirst && focusShift ? findFirstEnabledItem(row) : row[i - 1]; + row[i] = previousItem && activeId !== previousItem.id && focusShift ? previousItem : createEmptyItem(previousItem == null ? void 0 : previousItem.rowId); + } + } + } + return rows; +} +function verticalizeItems(items) { + const rows = groupItemsByRows(items); + const maxLength = getMaxRowLength(rows); + const verticalized = []; + for (let i = 0; i < maxLength; i += 1) { + for (const row of rows) { + const item = row[i]; + if (item) { + verticalized.push(_chunks_3YLGPPWQ_spreadProps(_chunks_3YLGPPWQ_spreadValues({}, item), { + // If there's no rowId, it means that it's not a grid composite, but + // a single row instead. So, instead of verticalizing it, that is, + // assigning a different rowId based on the column index, we keep it + // undefined so they will be part of the same row. This is useful + // when using up/down on one-dimensional composites. + rowId: item.rowId ? `${i}` : void 0 + })); + } + } + } + return verticalized; +} +function createCompositeStore(props = {}) { + var _a; + const syncState = (_a = props.store) == null ? void 0 : _a.getState(); + const collection = createCollectionStore(props); + const activeId = defaultValue( + props.activeId, + syncState == null ? void 0 : syncState.activeId, + props.defaultActiveId + ); + const initialState = _chunks_3YLGPPWQ_spreadProps(_chunks_3YLGPPWQ_spreadValues({}, collection.getState()), { + id: defaultValue( + props.id, + syncState == null ? void 0 : syncState.id, + `id-${Math.random().toString(36).slice(2, 8)}` + ), + activeId, + baseElement: defaultValue(syncState == null ? void 0 : syncState.baseElement, null), + includesBaseElement: defaultValue( + props.includesBaseElement, + syncState == null ? void 0 : syncState.includesBaseElement, + activeId === null + ), + moves: defaultValue(syncState == null ? void 0 : syncState.moves, 0), + orientation: defaultValue( + props.orientation, + syncState == null ? void 0 : syncState.orientation, + "both" + ), + rtl: defaultValue(props.rtl, syncState == null ? void 0 : syncState.rtl, false), + virtualFocus: defaultValue( + props.virtualFocus, + syncState == null ? void 0 : syncState.virtualFocus, + false + ), + focusLoop: defaultValue(props.focusLoop, syncState == null ? void 0 : syncState.focusLoop, false), + focusWrap: defaultValue(props.focusWrap, syncState == null ? void 0 : syncState.focusWrap, false), + focusShift: defaultValue(props.focusShift, syncState == null ? void 0 : syncState.focusShift, false) + }); + const composite = createStore(initialState, collection, props.store); + setup( + composite, + () => sync(composite, ["renderedItems", "activeId"], (state) => { + composite.setState("activeId", (activeId2) => { + var _a2; + if (activeId2 !== void 0) return activeId2; + return (_a2 = findFirstEnabledItem(state.renderedItems)) == null ? void 0 : _a2.id; + }); + }) + ); + const getNextId = (direction = "next", options = {}) => { + var _a2, _b; + const defaultState = composite.getState(); + const { + skip = 0, + activeId: activeId2 = defaultState.activeId, + focusShift = defaultState.focusShift, + focusLoop = defaultState.focusLoop, + focusWrap = defaultState.focusWrap, + includesBaseElement = defaultState.includesBaseElement, + renderedItems = defaultState.renderedItems, + rtl = defaultState.rtl + } = options; + const isVerticalDirection = direction === "up" || direction === "down"; + const isNextDirection = direction === "next" || direction === "down"; + const canReverse = isNextDirection ? rtl && !isVerticalDirection : !rtl || isVerticalDirection; + const canShift = focusShift && !skip; + let items = !isVerticalDirection ? renderedItems : flatten2DArray( + normalizeRows(groupItemsByRows(renderedItems), activeId2, canShift) + ); + items = canReverse ? reverseArray(items) : items; + items = isVerticalDirection ? verticalizeItems(items) : items; + if (activeId2 == null) { + return (_a2 = findFirstEnabledItem(items)) == null ? void 0 : _a2.id; + } + const activeItem = items.find((item) => item.id === activeId2); + if (!activeItem) { + return (_b = findFirstEnabledItem(items)) == null ? void 0 : _b.id; + } + const isGrid = items.some((item) => item.rowId); + const activeIndex = items.indexOf(activeItem); + const nextItems = items.slice(activeIndex + 1); + const nextItemsInRow = getItemsInRow(nextItems, activeItem.rowId); + if (skip) { + const nextEnabledItemsInRow = getEnabledItems(nextItemsInRow, activeId2); + const nextItem2 = nextEnabledItemsInRow.slice(skip)[0] || // If we can't find an item, just return the last one. + nextEnabledItemsInRow[nextEnabledItemsInRow.length - 1]; + return nextItem2 == null ? void 0 : nextItem2.id; + } + const canLoop = focusLoop && (isVerticalDirection ? focusLoop !== "horizontal" : focusLoop !== "vertical"); + const canWrap = isGrid && focusWrap && (isVerticalDirection ? focusWrap !== "horizontal" : focusWrap !== "vertical"); + const hasNullItem = isNextDirection ? (!isGrid || isVerticalDirection) && canLoop && includesBaseElement : isVerticalDirection ? includesBaseElement : false; + if (canLoop) { + const loopItems = canWrap && !hasNullItem ? items : getItemsInRow(items, activeItem.rowId); + const sortedItems = flipItems(loopItems, activeId2, hasNullItem); + const nextItem2 = findFirstEnabledItem(sortedItems, activeId2); + return nextItem2 == null ? void 0 : nextItem2.id; + } + if (canWrap) { + const nextItem2 = findFirstEnabledItem( + // We can use nextItems, which contains all the next items, including + // items from other rows, to wrap between rows. However, if there is a + // null item (the composite container), we'll only use the next items in + // the row. So moving next from the last item will focus on the + // composite container. On grid composites, horizontal navigation never + // focuses on the composite container, only vertical. + hasNullItem ? nextItemsInRow : nextItems, + activeId2 + ); + const nextId = hasNullItem ? (nextItem2 == null ? void 0 : nextItem2.id) || null : nextItem2 == null ? void 0 : nextItem2.id; + return nextId; + } + const nextItem = findFirstEnabledItem(nextItemsInRow, activeId2); + if (!nextItem && hasNullItem) { + return null; + } + return nextItem == null ? void 0 : nextItem.id; + }; + return _chunks_3YLGPPWQ_spreadProps(_chunks_3YLGPPWQ_spreadValues(_chunks_3YLGPPWQ_spreadValues({}, collection), composite), { + setBaseElement: (element) => composite.setState("baseElement", element), + setActiveId: (id) => composite.setState("activeId", id), + move: (id) => { + if (id === void 0) return; + composite.setState("activeId", id); + composite.setState("moves", (moves) => moves + 1); + }, + first: () => { + var _a2; + return (_a2 = findFirstEnabledItem(composite.getState().renderedItems)) == null ? void 0 : _a2.id; + }, + last: () => { + var _a2; + return (_a2 = findFirstEnabledItem(reverseArray(composite.getState().renderedItems))) == null ? void 0 : _a2.id; + }, + next: (options) => { + if (options !== void 0 && typeof options === "number") { + options = { skip: options }; + } + return getNextId("next", options); + }, + previous: (options) => { + if (options !== void 0 && typeof options === "number") { + options = { skip: options }; + } + return getNextId("previous", options); + }, + down: (options) => { + if (options !== void 0 && typeof options === "number") { + options = { skip: options }; + } + return getNextId("down", options); + }, + up: (options) => { + if (options !== void 0 && typeof options === "number") { + options = { skip: options }; + } + return getNextId("up", options); + } + }); +} + + + +;// ./node_modules/@ariakit/react-core/esm/__chunks/4CMBR7SL.js +"use client"; + + + + + +// src/composite/composite-store.ts + +function useCompositeStoreOptions(props) { + const id = useId(props.id); + return _3YLGPPWQ_spreadValues({ id }, props); +} +function useCompositeStoreProps(store, update, props) { + store = useCollectionStoreProps(store, update, props); + useStoreProps(store, props, "activeId", "setActiveId"); + useStoreProps(store, props, "includesBaseElement"); + useStoreProps(store, props, "virtualFocus"); + useStoreProps(store, props, "orientation"); + useStoreProps(store, props, "rtl"); + useStoreProps(store, props, "focusLoop"); + useStoreProps(store, props, "focusWrap"); + useStoreProps(store, props, "focusShift"); + return store; +} +function useCompositeStore(props = {}) { + props = useCompositeStoreOptions(props); + const [store, update] = YV4JVR4I_useStore(createCompositeStore, props); + return useCompositeStoreProps(store, update, props); +} + + + +;// ./node_modules/@ariakit/react-core/esm/__chunks/5VQZOHHZ.js +"use client"; + +// src/composite/utils.ts + +var _5VQZOHHZ_NULL_ITEM = { id: null }; +function _5VQZOHHZ_flipItems(items, activeId, shouldInsertNullItem = false) { + const index = items.findIndex((item) => item.id === activeId); + return [ + ...items.slice(index + 1), + ...shouldInsertNullItem ? [_5VQZOHHZ_NULL_ITEM] : [], + ...items.slice(0, index) + ]; +} +function _5VQZOHHZ_findFirstEnabledItem(items, excludeId) { + return items.find((item) => { + if (excludeId) { + return !item.disabled && item.id !== excludeId; + } + return !item.disabled; + }); +} +function getEnabledItem(store, id) { + if (!id) return null; + return store.item(id) || null; +} +function _5VQZOHHZ_groupItemsByRows(items) { + const rows = []; + for (const item of items) { + const row = rows.find((currentRow) => { + var _a; + return ((_a = currentRow[0]) == null ? void 0 : _a.rowId) === item.rowId; + }); + if (row) { + row.push(item); + } else { + rows.push([item]); + } + } + return rows; +} +function selectTextField(element, collapseToEnd = false) { + if (isTextField(element)) { + element.setSelectionRange( + collapseToEnd ? element.value.length : 0, + element.value.length + ); + } else if (element.isContentEditable) { + const selection = getDocument(element).getSelection(); + selection == null ? void 0 : selection.selectAllChildren(element); + if (collapseToEnd) { + selection == null ? void 0 : selection.collapseToEnd(); + } + } +} +var FOCUS_SILENTLY = Symbol("FOCUS_SILENTLY"); +function focusSilently(element) { + element[FOCUS_SILENTLY] = true; + element.focus({ preventScroll: true }); +} +function silentlyFocused(element) { + const isSilentlyFocused = element[FOCUS_SILENTLY]; + delete element[FOCUS_SILENTLY]; + return isSilentlyFocused; +} +function isItem(store, element, exclude) { + if (!element) return false; + if (element === exclude) return false; + const item = store.item(element.id); + if (!item) return false; + if (exclude && item.element === exclude) return false; + return true; +} + + + +;// external "ReactJSXRuntime" const external_ReactJSXRuntime_namespaceObject = window["ReactJSXRuntime"]; -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/3ORBWXWF.js +;// ./node_modules/@ariakit/react-core/esm/__chunks/LMDWO4NN.js "use client"; @@ -2859,48 +3668,25 @@ // src/utils/system.tsx - -function isRenderProp(children) { - return typeof children === "function"; -} function forwardRef2(render) { - const Role = React.forwardRef((props, ref) => render(__spreadProps(__spreadValues({}, props), { ref }))); + const Role = external_React_.forwardRef((props, ref) => render(_3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, props), { ref }))); Role.displayName = render.displayName || render.name; return Role; } function memo2(Component, propsAreEqual) { - const Role = React.memo(Component, propsAreEqual); - Role.displayName = Component.displayName || Component.name; - return Role; -} -function createComponent(render) { - const Role = (props, ref) => render(_4R3V3JGP_spreadValues({ ref }, props)); - return external_React_.forwardRef(Role); -} -function createMemoComponent(render) { - const Role = createComponent(render); - return external_React_.memo(Role); -} -function _3ORBWXWF_createElement(Type, props) { - const _a = props, { as: As, wrapElement, render } = _a, rest = __objRest(_a, ["as", "wrapElement", "render"]); + return external_React_.memo(Component, propsAreEqual); +} +function LMDWO4NN_createElement(Type, props) { + const _a = props, { wrapElement, render } = _a, rest = __objRest(_a, ["wrapElement", "render"]); + const mergedRef = useMergeRefs(props.ref, getRefProperty(render)); let element; - const mergedRef = useMergeRefs(props.ref, getRefProperty(render)); - if (false) {} - if (As && typeof As !== "string") { - element = /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(As, _4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues({}, rest), { render })); - } else if (external_React_.isValidElement(render)) { - const renderProps = _4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues({}, render.props), { ref: mergedRef }); + if (external_React_.isValidElement(render)) { + const renderProps = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, render.props), { ref: mergedRef }); element = external_React_.cloneElement(render, mergeProps(rest, renderProps)); } else if (render) { element = render(rest); - } else if (isRenderProp(props.children)) { - if (false) {} - const _b = rest, { children } = _b, otherProps = __objRest(_b, ["children"]); - element = props.children(otherProps); - } else if (As) { - element = /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(As, _4R3V3JGP_spreadValues({}, rest)); } else { - element = /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(Type, _4R3V3JGP_spreadValues({}, rest)); + element = /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(Type, _3YLGPPWQ_spreadValues({}, rest)); } if (wrapElement) { return wrapElement(element); @@ -2909,15 +3695,9 @@ } function createHook(useProps) { const useRole = (props = {}) => { - const htmlProps = useProps(props); - const copy = {}; - for (const prop in htmlProps) { - if (Y3OOHFCN_hasOwnProperty(htmlProps, prop) && htmlProps[prop] !== void 0) { - copy[prop] = htmlProps[prop]; - } - } - return copy; - }; + return useProps(props); + }; + useRole.displayName = useProps.name; return useRole; } function createStoreContext(providers = [], scopedProviders = []) { @@ -2927,27 +3707,25 @@ const useScopedContext = (onlyScoped = false) => { const scoped = external_React_.useContext(scopedContext); const store = useContext2(); - if (onlyScoped) - return scoped; + if (onlyScoped) return scoped; return scoped || store; }; const useProviderContext = () => { const scoped = external_React_.useContext(scopedContext); const store = useContext2(); - if (scoped && scoped === store) - return; + if (scoped && scoped === store) return; return store; }; const ContextProvider = (props) => { return providers.reduceRight( - (children, Provider) => /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(Provider, _4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues({}, props), { children })), - /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(context.Provider, _4R3V3JGP_spreadValues({}, props)) + (children, Provider) => /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(Provider, _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, props), { children })), + /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(context.Provider, _3YLGPPWQ_spreadValues({}, props)) ); }; const ScopedContextProvider = (props) => { - return /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(ContextProvider, _4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues({}, props), { children: scopedProviders.reduceRight( - (children, Provider) => /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(Provider, _4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues({}, props), { children })), - /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(scopedContext.Provider, _4R3V3JGP_spreadValues({}, props)) + return /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(ContextProvider, _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, props), { children: scopedProviders.reduceRight( + (children, Provider) => /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(Provider, _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, props), { children })), + /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(scopedContext.Provider, _3YLGPPWQ_spreadValues({}, props)) ) })); }; return { @@ -2963,55 +3741,87 @@ -;// CONCATENATED MODULE: ./node_modules/@ariakit/core/esm/utils/focus.js +;// ./node_modules/@ariakit/react-core/esm/__chunks/VDHZ5F7K.js +"use client"; + + +// src/collection/collection-context.tsx +var ctx = createStoreContext(); +var useCollectionContext = ctx.useContext; +var useCollectionScopedContext = ctx.useScopedContext; +var useCollectionProviderContext = ctx.useProviderContext; +var CollectionContextProvider = ctx.ContextProvider; +var CollectionScopedContextProvider = ctx.ScopedContextProvider; + + + +;// ./node_modules/@ariakit/react-core/esm/__chunks/P7GR5CS5.js +"use client"; + + + +// src/composite/composite-context.tsx + +var P7GR5CS5_ctx = createStoreContext( + [CollectionContextProvider], + [CollectionScopedContextProvider] +); +var useCompositeContext = P7GR5CS5_ctx.useContext; +var useCompositeScopedContext = P7GR5CS5_ctx.useScopedContext; +var useCompositeProviderContext = P7GR5CS5_ctx.useProviderContext; +var CompositeContextProvider = P7GR5CS5_ctx.ContextProvider; +var CompositeScopedContextProvider = P7GR5CS5_ctx.ScopedContextProvider; +var CompositeItemContext = (0,external_React_.createContext)( + void 0 +); +var CompositeRowContext = (0,external_React_.createContext)( + void 0 +); + + + +;// ./node_modules/@ariakit/react-core/esm/__chunks/SWN3JYXT.js +"use client"; + +// src/focusable/focusable-context.tsx + +var FocusableContext = (0,external_React_.createContext)(true); + + + +;// ./node_modules/@ariakit/core/esm/utils/focus.js "use client"; // src/utils/focus.ts -var selector = "input:not([type='hidden']):not([disabled]), select:not([disabled]), textarea:not([disabled]), a[href], button:not([disabled]), [tabindex], iframe, object, embed, area[href], audio[controls], video[controls], [contenteditable]:not([contenteditable='false'])"; +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'])"; function hasNegativeTabIndex(element) { - const tabIndex = parseInt(element.getAttribute("tabindex") || "0", 10); + const tabIndex = Number.parseInt(element.getAttribute("tabindex") || "0", 10); return tabIndex < 0; } function isFocusable(element) { - if (!matches(element, selector)) - return false; - if (!isVisible(element)) - return false; - if (DLOEKDPY_closest(element, "[inert]")) - return false; + if (!element.matches(selector)) return false; + if (!isVisible(element)) return false; + if (element.closest("[inert]")) return false; return true; } function isTabbable(element) { - if (!isFocusable(element)) - return false; - if (hasNegativeTabIndex(element)) - return false; - if (!("form" in element)) - return true; - if (!element.form) - return true; - if (element.checked) - return true; - if (element.type !== "radio") - return true; + if (!isFocusable(element)) return false; + if (hasNegativeTabIndex(element)) return false; + if (!("form" in element)) return true; + if (!element.form) return true; + if (element.checked) return true; + if (element.type !== "radio") return true; const radioGroup = element.form.elements.namedItem(element.name); - if (!radioGroup) - return true; - if (!("length" in radioGroup)) - return true; + if (!radioGroup) return true; + if (!("length" in radioGroup)) return true; const activeElement = getActiveElement(element); - if (!activeElement) - return true; - if (activeElement === element) - return true; - if (!("form" in activeElement)) - return true; - if (activeElement.form !== element.form) - return true; - if (activeElement.name !== element.name) - return true; + if (!activeElement) return true; + if (activeElement === element) return true; + if (!("form" in activeElement)) return true; + if (activeElement.form !== element.form) return true; + if (activeElement.name !== element.name) return true; return false; } function getAllFocusableIn(container, includeContainer) { @@ -3121,34 +3931,26 @@ } function getClosestFocusable(element) { while (element && !isFocusable(element)) { - element = closest(element, selector); + element = element.closest(selector); } return element || null; } function hasFocus(element) { const activeElement = getActiveElement(element); - if (!activeElement) - return false; - if (activeElement === element) - return true; + if (!activeElement) return false; + if (activeElement === element) return true; const activeDescendant = activeElement.getAttribute("aria-activedescendant"); - if (!activeDescendant) - return false; + if (!activeDescendant) return false; return activeDescendant === element.id; } function hasFocusWithin(element) { const activeElement = getActiveElement(element); - if (!activeElement) - return false; - if (contains(element, activeElement)) - return true; + if (!activeElement) return false; + if (contains(element, activeElement)) return true; const activeDescendant = activeElement.getAttribute("aria-activedescendant"); - if (!activeDescendant) - return false; - if (!("id" in element)) - return false; - if (activeDescendant === element.id) - return true; + if (!activeDescendant) return false; + if (!("id" in element)) return false; + if (activeDescendant === element.id) return true; return !!element.querySelector(`#${CSS.escape(activeDescendant)}`); } function focusIfNeeded(element) { @@ -3164,7 +3966,9 @@ } function disableFocusIn(container, includeContainer) { const tabbableElements = getAllTabbableIn(container, includeContainer); - tabbableElements.forEach(disableFocus); + for (const element of tabbableElements) { + disableFocus(element); + } } function restoreFocusIn(container) { const elements = container.querySelectorAll("[data-tabindex]"); @@ -3180,32 +3984,35 @@ if (container.hasAttribute("data-tabindex")) { restoreTabIndex(container); } - elements.forEach(restoreTabIndex); + for (const element of elements) { + restoreTabIndex(element); + } } function focusIntoView(element, options) { if (!("scrollIntoView" in element)) { element.focus(); } else { element.focus({ preventScroll: true }); - element.scrollIntoView(_chunks_4R3V3JGP_spreadValues({ block: "nearest", inline: "nearest" }, options)); - } -} - - -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/KK7H3W2B.js -"use client"; - - - - - -// src/focusable/focusable.ts - - - - - - + element.scrollIntoView(_chunks_3YLGPPWQ_spreadValues({ block: "nearest", inline: "nearest" }, options)); + } +} + + +;// ./node_modules/@ariakit/react-core/esm/__chunks/LVA2YJMS.js +"use client"; + + + + + +// src/focusable/focusable.tsx + + + + + + +var TagName = "div"; var isSafariBrowser = isSafari(); var alwaysFocusVisibleInputTypes = [ "text", @@ -3222,25 +4029,29 @@ "datetime", "datetime-local" ]; +var safariFocusAncestorSymbol = Symbol("safariFocusAncestor"); +function isSafariFocusAncestor(element) { + if (!element) return false; + return !!element[safariFocusAncestorSymbol]; +} +function markSafariFocusAncestor(element, value) { + if (!element) return; + element[safariFocusAncestorSymbol] = value; +} function isAlwaysFocusVisible(element) { const { tagName, readOnly, type } = element; - if (tagName === "TEXTAREA" && !readOnly) - return true; - if (tagName === "SELECT" && !readOnly) - return true; + if (tagName === "TEXTAREA" && !readOnly) return true; + if (tagName === "SELECT" && !readOnly) return true; if (tagName === "INPUT" && !readOnly) { return alwaysFocusVisibleInputTypes.includes(type); } - if (element.isContentEditable) + if (element.isContentEditable) return true; + const role = element.getAttribute("role"); + if (role === "combobox" && element.dataset.name) { return true; + } return false; } -function isAlwaysFocusVisibleDelayed(element) { - const role = element.getAttribute("role"); - if (role !== "combobox") - return false; - return !!element.dataset.name; -} function getLabels(element) { if ("labels" in element) { return element.labels; @@ -3255,13 +4066,11 @@ return false; } function isNativeTabbable(tagName) { - if (!tagName) - return true; - return tagName === "button" || tagName === "input" || tagName === "select" || tagName === "textarea" || tagName === "a"; + if (!tagName) return true; + return tagName === "button" || tagName === "summary" || tagName === "input" || tagName === "select" || tagName === "textarea" || tagName === "a"; } function supportsDisabledAttribute(tagName) { - if (!tagName) - return true; + if (!tagName) return true; return tagName === "button" || tagName === "input" || tagName === "select" || tagName === "textarea"; } function getTabIndex(focusable, trulyDisabled, nativeTabbable, supportsDisabled, tabIndexProp) { @@ -3282,8 +4091,7 @@ function useDisableEvent(onEvent, disabled) { return useEvent((event) => { onEvent == null ? void 0 : onEvent(event); - if (event.defaultPrevented) - return; + if (event.defaultPrevented) return; if (disabled) { event.stopPropagation(); event.preventDefault(); @@ -3300,16 +4108,13 @@ } } function onGlobalKeyDown(event) { - if (event.metaKey) - return; - if (event.ctrlKey) - return; - if (event.altKey) - return; + if (event.metaKey) return; + if (event.ctrlKey) return; + if (event.altKey) return; isKeyboardModality = true; } var useFocusable = createHook( - (_a) => { + function useFocusable2(_a) { var _b = _a, { focusable = true, accessibleWhenDisabled, @@ -3323,29 +4128,26 @@ ]); const ref = (0,external_React_.useRef)(null); (0,external_React_.useEffect)(() => { - if (!focusable) - return; + if (!focusable) return; addGlobalEventListener("mousedown", onGlobalMouseDown, true); addGlobalEventListener("keydown", onGlobalKeyDown, true); }, [focusable]); if (isSafariBrowser) { (0,external_React_.useEffect)(() => { - if (!focusable) - return; + if (!focusable) return; const element = ref.current; - if (!element) - return; - if (!isNativeCheckboxOrRadio(element)) - return; + if (!element) return; + if (!isNativeCheckboxOrRadio(element)) return; const labels = getLabels(element); - if (!labels) - return; + if (!labels) return; const onMouseUp = () => queueMicrotask(() => element.focus()); - labels.forEach((label) => label.addEventListener("mouseup", onMouseUp)); + for (const label of labels) { + label.addEventListener("mouseup", onMouseUp); + } return () => { - labels.forEach( - (label) => label.removeEventListener("mouseup", onMouseUp) - ); + for (const label of labels) { + label.removeEventListener("mouseup", onMouseUp); + } }; }, [focusable]); } @@ -3353,22 +4155,17 @@ const trulyDisabled = !!disabled && !accessibleWhenDisabled; const [focusVisible, setFocusVisible] = (0,external_React_.useState)(false); (0,external_React_.useEffect)(() => { - if (!focusable) - return; + if (!focusable) return; if (trulyDisabled && focusVisible) { setFocusVisible(false); } }, [focusable, trulyDisabled, focusVisible]); (0,external_React_.useEffect)(() => { - if (!focusable) - return; - if (!focusVisible) - return; + if (!focusable) return; + if (!focusVisible) return; const element = ref.current; - if (!element) - return; - if (typeof IntersectionObserver === "undefined") - return; + if (!element) return; + if (typeof IntersectionObserver === "undefined") return; const observer = new IntersectionObserver(() => { if (!isFocusable(element)) { setFocusVisible(false); @@ -3389,27 +4186,24 @@ const onMouseDownProp = props.onMouseDown; const onMouseDown = useEvent((event) => { onMouseDownProp == null ? void 0 : onMouseDownProp(event); - if (event.defaultPrevented) - return; - if (!focusable) - return; + if (event.defaultPrevented) return; + if (!focusable) return; const element = event.currentTarget; - if (!isSafariBrowser) - return; - if (isPortalEvent(event)) - return; - if (!isButton(element) && !isNativeCheckboxOrRadio(element)) - return; + if (!isSafariBrowser) return; + if (isPortalEvent(event)) return; + if (!isButton(element) && !isNativeCheckboxOrRadio(element)) return; let receivedFocus = false; const onFocus = () => { receivedFocus = true; }; const options = { capture: true, once: true }; element.addEventListener("focusin", onFocus, options); + const focusableContainer = getClosestFocusable(element.parentElement); + markSafariFocusAncestor(focusableContainer, true); queueBeforeEvent(element, "mouseup", () => { element.removeEventListener("focusin", onFocus, true); - if (receivedFocus) - return; + markSafariFocusAncestor(focusableContainer, false); + if (receivedFocus) return; focusIfNeeded(element); }); }); @@ -3417,47 +4211,34 @@ if (currentTarget) { event.currentTarget = currentTarget; } - if (!focusable) - return; + if (!focusable) return; const element = event.currentTarget; - if (!element) - return; - if (!hasFocus(element)) - return; + if (!element) return; + if (!hasFocus(element)) return; onFocusVisible == null ? void 0 : onFocusVisible(event); - if (event.defaultPrevented) - return; + if (event.defaultPrevented) return; + element.dataset.focusVisible = "true"; setFocusVisible(true); }; const onKeyDownCaptureProp = props.onKeyDownCapture; - const onKeyDownCapture = useEvent( - (event) => { - onKeyDownCaptureProp == null ? void 0 : onKeyDownCaptureProp(event); - if (event.defaultPrevented) - return; - if (!focusable) - return; - if (focusVisible) - return; - if (event.metaKey) - return; - if (event.altKey) - return; - if (event.ctrlKey) - return; - if (!isSelfTarget(event)) - return; - const element = event.currentTarget; - queueMicrotask(() => handleFocusVisible(event, element)); - } - ); + const onKeyDownCapture = useEvent((event) => { + onKeyDownCaptureProp == null ? void 0 : onKeyDownCaptureProp(event); + if (event.defaultPrevented) return; + if (!focusable) return; + if (focusVisible) return; + if (event.metaKey) return; + if (event.altKey) return; + if (event.ctrlKey) return; + if (!isSelfTarget(event)) return; + const element = event.currentTarget; + const applyFocusVisible = () => handleFocusVisible(event, element); + queueBeforeEvent(element, "focusout", applyFocusVisible); + }); const onFocusCaptureProp = props.onFocusCapture; const onFocusCapture = useEvent((event) => { onFocusCaptureProp == null ? void 0 : onFocusCaptureProp(event); - if (event.defaultPrevented) - return; - if (!focusable) - return; + if (event.defaultPrevented) return; + if (!focusable) return; if (!isSelfTarget(event)) { setFocusVisible(false); return; @@ -3465,8 +4246,6 @@ const element = event.currentTarget; const applyFocusVisible = () => handleFocusVisible(event, element); if (isKeyboardModality || isAlwaysFocusVisible(event.target)) { - queueMicrotask(applyFocusVisible); - } else if (isAlwaysFocusVisibleDelayed(event.target)) { queueBeforeEvent(event.target, "focusout", applyFocusVisible); } else { setFocusVisible(false); @@ -3475,38 +4254,36 @@ const onBlurProp = props.onBlur; const onBlur = useEvent((event) => { onBlurProp == null ? void 0 : onBlurProp(event); - if (!focusable) - return; - if (!isFocusEventOutside(event)) - return; + if (!focusable) return; + if (!isFocusEventOutside(event)) return; setFocusVisible(false); }); const autoFocusOnShow = (0,external_React_.useContext)(FocusableContext); const autoFocusRef = useEvent((element) => { - if (!focusable) - return; - if (!autoFocus) - return; - if (!element) - return; - if (!autoFocusOnShow) - return; + if (!focusable) return; + if (!autoFocus) return; + if (!element) return; + if (!autoFocusOnShow) return; queueMicrotask(() => { - if (hasFocus(element)) - return; - if (!isFocusable(element)) - return; + if (hasFocus(element)) return; + if (!isFocusable(element)) return; element.focus(); }); }); - const tagName = useTagName(ref, props.as); + const tagName = useTagName(ref); const nativeTabbable = focusable && isNativeTabbable(tagName); const supportsDisabled = focusable && supportsDisabledAttribute(tagName); - const style = trulyDisabled ? _4R3V3JGP_spreadValues({ pointerEvents: "none" }, props.style) : props.style; - props = _4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues({ - "data-focus-visible": focusable && focusVisible ? "" : void 0, - "data-autofocus": autoFocus ? true : void 0, - "aria-disabled": disabled ? true : void 0 + const styleProp = props.style; + const style = (0,external_React_.useMemo)(() => { + if (trulyDisabled) { + return _3YLGPPWQ_spreadValues({ pointerEvents: "none" }, styleProp); + } + return styleProp; + }, [trulyDisabled, styleProp]); + props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({ + "data-focus-visible": focusable && focusVisible || void 0, + "data-autofocus": autoFocus || void 0, + "aria-disabled": disabled || void 0 }, props), { ref: useMergeRefs(ref, autoFocusRef, props.ref), style, @@ -3528,33 +4305,706 @@ onFocusCapture, onBlur }); + return removeUndefinedValues(props); + } +); +var Focusable = forwardRef2(function Focusable2(props) { + const htmlProps = useFocusable(props); + return LMDWO4NN_createElement(TagName, htmlProps); +}); + + + +;// ./node_modules/@ariakit/react-core/esm/__chunks/ITI7HKP4.js +"use client"; + + + + + + + +// src/composite/composite.tsx + + + + + + + +var ITI7HKP4_TagName = "div"; +function isGrid(items) { + return items.some((item) => !!item.rowId); +} +function isPrintableKey(event) { + const target = event.target; + if (target && !isTextField(target)) return false; + return event.key.length === 1 && !event.ctrlKey && !event.metaKey; +} +function isModifierKey(event) { + return event.key === "Shift" || event.key === "Control" || event.key === "Alt" || event.key === "Meta"; +} +function useKeyboardEventProxy(store, onKeyboardEvent, previousElementRef) { + return useEvent((event) => { + var _a; + onKeyboardEvent == null ? void 0 : onKeyboardEvent(event); + if (event.defaultPrevented) return; + if (event.isPropagationStopped()) return; + if (!isSelfTarget(event)) return; + if (isModifierKey(event)) return; + if (isPrintableKey(event)) return; + const state = store.getState(); + const activeElement = (_a = getEnabledItem(store, state.activeId)) == null ? void 0 : _a.element; + if (!activeElement) return; + const _b = event, { view } = _b, eventInit = __objRest(_b, ["view"]); + const previousElement = previousElementRef == null ? void 0 : previousElementRef.current; + if (activeElement !== previousElement) { + activeElement.focus(); + } + if (!fireKeyboardEvent(activeElement, event.type, eventInit)) { + event.preventDefault(); + } + if (event.currentTarget.contains(activeElement)) { + event.stopPropagation(); + } + }); +} +function findFirstEnabledItemInTheLastRow(items) { + return _5VQZOHHZ_findFirstEnabledItem( + flatten2DArray(reverseArray(_5VQZOHHZ_groupItemsByRows(items))) + ); +} +function useScheduleFocus(store) { + const [scheduled, setScheduled] = (0,external_React_.useState)(false); + const schedule = (0,external_React_.useCallback)(() => setScheduled(true), []); + const activeItem = store.useState( + (state) => getEnabledItem(store, state.activeId) + ); + (0,external_React_.useEffect)(() => { + const activeElement = activeItem == null ? void 0 : activeItem.element; + if (!scheduled) return; + if (!activeElement) return; + setScheduled(false); + activeElement.focus({ preventScroll: true }); + }, [activeItem, scheduled]); + return schedule; +} +var useComposite = createHook( + function useComposite2(_a) { + var _b = _a, { + store, + composite = true, + focusOnMove = composite, + moveOnKeyPress = true + } = _b, props = __objRest(_b, [ + "store", + "composite", + "focusOnMove", + "moveOnKeyPress" + ]); + const context = useCompositeProviderContext(); + store = store || context; + invariant( + store, + false && 0 + ); + const ref = (0,external_React_.useRef)(null); + const previousElementRef = (0,external_React_.useRef)(null); + const scheduleFocus = useScheduleFocus(store); + const moves = store.useState("moves"); + const [, setBaseElement] = useTransactionState( + composite ? store.setBaseElement : null + ); + (0,external_React_.useEffect)(() => { + var _a2; + if (!store) return; + if (!moves) return; + if (!composite) return; + if (!focusOnMove) return; + const { activeId: activeId2 } = store.getState(); + const itemElement = (_a2 = getEnabledItem(store, activeId2)) == null ? void 0 : _a2.element; + if (!itemElement) return; + focusIntoView(itemElement); + }, [store, moves, composite, focusOnMove]); + useSafeLayoutEffect(() => { + if (!store) return; + if (!moves) return; + if (!composite) return; + const { baseElement, activeId: activeId2 } = store.getState(); + const isSelfAcive = activeId2 === null; + if (!isSelfAcive) return; + if (!baseElement) return; + const previousElement = previousElementRef.current; + previousElementRef.current = null; + if (previousElement) { + fireBlurEvent(previousElement, { relatedTarget: baseElement }); + } + if (!hasFocus(baseElement)) { + baseElement.focus(); + } + }, [store, moves, composite]); + const activeId = store.useState("activeId"); + const virtualFocus = store.useState("virtualFocus"); + useSafeLayoutEffect(() => { + var _a2; + if (!store) return; + if (!composite) return; + if (!virtualFocus) return; + const previousElement = previousElementRef.current; + previousElementRef.current = null; + if (!previousElement) return; + const activeElement = (_a2 = getEnabledItem(store, activeId)) == null ? void 0 : _a2.element; + const relatedTarget = activeElement || getActiveElement(previousElement); + if (relatedTarget === previousElement) return; + fireBlurEvent(previousElement, { relatedTarget }); + }, [store, activeId, virtualFocus, composite]); + const onKeyDownCapture = useKeyboardEventProxy( + store, + props.onKeyDownCapture, + previousElementRef + ); + const onKeyUpCapture = useKeyboardEventProxy( + store, + props.onKeyUpCapture, + previousElementRef + ); + const onFocusCaptureProp = props.onFocusCapture; + const onFocusCapture = useEvent((event) => { + onFocusCaptureProp == null ? void 0 : onFocusCaptureProp(event); + if (event.defaultPrevented) return; + if (!store) return; + const { virtualFocus: virtualFocus2 } = store.getState(); + if (!virtualFocus2) return; + const previousActiveElement = event.relatedTarget; + const isSilentlyFocused = silentlyFocused(event.currentTarget); + if (isSelfTarget(event) && isSilentlyFocused) { + event.stopPropagation(); + previousElementRef.current = previousActiveElement; + } + }); + const onFocusProp = props.onFocus; + const onFocus = useEvent((event) => { + onFocusProp == null ? void 0 : onFocusProp(event); + if (event.defaultPrevented) return; + if (!composite) return; + if (!store) return; + const { relatedTarget } = event; + const { virtualFocus: virtualFocus2 } = store.getState(); + if (virtualFocus2) { + if (isSelfTarget(event) && !isItem(store, relatedTarget)) { + queueMicrotask(scheduleFocus); + } + } else if (isSelfTarget(event)) { + store.setActiveId(null); + } + }); + const onBlurCaptureProp = props.onBlurCapture; + const onBlurCapture = useEvent((event) => { + var _a2; + onBlurCaptureProp == null ? void 0 : onBlurCaptureProp(event); + if (event.defaultPrevented) return; + if (!store) return; + const { virtualFocus: virtualFocus2, activeId: activeId2 } = store.getState(); + if (!virtualFocus2) return; + const activeElement = (_a2 = getEnabledItem(store, activeId2)) == null ? void 0 : _a2.element; + const nextActiveElement = event.relatedTarget; + const nextActiveElementIsItem = isItem(store, nextActiveElement); + const previousElement = previousElementRef.current; + previousElementRef.current = null; + if (isSelfTarget(event) && nextActiveElementIsItem) { + if (nextActiveElement === activeElement) { + if (previousElement && previousElement !== nextActiveElement) { + fireBlurEvent(previousElement, event); + } + } else if (activeElement) { + fireBlurEvent(activeElement, event); + } else if (previousElement) { + fireBlurEvent(previousElement, event); + } + event.stopPropagation(); + } else { + const targetIsItem = isItem(store, event.target); + if (!targetIsItem && activeElement) { + fireBlurEvent(activeElement, event); + } + } + }); + const onKeyDownProp = props.onKeyDown; + const moveOnKeyPressProp = useBooleanEvent(moveOnKeyPress); + const onKeyDown = useEvent((event) => { + var _a2; + onKeyDownProp == null ? void 0 : onKeyDownProp(event); + if (event.defaultPrevented) return; + if (!store) return; + if (!isSelfTarget(event)) return; + const { orientation, renderedItems, activeId: activeId2 } = store.getState(); + const activeItem = getEnabledItem(store, activeId2); + if ((_a2 = activeItem == null ? void 0 : activeItem.element) == null ? void 0 : _a2.isConnected) return; + const isVertical = orientation !== "horizontal"; + const isHorizontal = orientation !== "vertical"; + const grid = isGrid(renderedItems); + const isHorizontalKey = event.key === "ArrowLeft" || event.key === "ArrowRight" || event.key === "Home" || event.key === "End"; + if (isHorizontalKey && isTextField(event.currentTarget)) return; + const up = () => { + if (grid) { + const item = findFirstEnabledItemInTheLastRow(renderedItems); + return item == null ? void 0 : item.id; + } + return store == null ? void 0 : store.last(); + }; + const keyMap = { + ArrowUp: (grid || isVertical) && up, + ArrowRight: (grid || isHorizontal) && store.first, + ArrowDown: (grid || isVertical) && store.first, + ArrowLeft: (grid || isHorizontal) && store.last, + Home: store.first, + End: store.last, + PageUp: store.first, + PageDown: store.last + }; + const action = keyMap[event.key]; + if (action) { + const id = action(); + if (id !== void 0) { + if (!moveOnKeyPressProp(event)) return; + event.preventDefault(); + store.move(id); + } + } + }); + props = useWrapElement( + props, + (element) => /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(CompositeContextProvider, { value: store, children: element }), + [store] + ); + const activeDescendant = store.useState((state) => { + var _a2; + if (!store) return; + if (!composite) return; + if (!state.virtualFocus) return; + return (_a2 = getEnabledItem(store, state.activeId)) == null ? void 0 : _a2.id; + }); + props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({ + "aria-activedescendant": activeDescendant + }, props), { + ref: useMergeRefs(ref, setBaseElement, props.ref), + onKeyDownCapture, + onKeyUpCapture, + onFocusCapture, + onFocus, + onBlurCapture, + onKeyDown + }); + const focusable = store.useState( + (state) => composite && (state.virtualFocus || state.activeId === null) + ); + props = useFocusable(_3YLGPPWQ_spreadValues({ focusable }, props)); return props; } ); -var Focusable = createComponent((props) => { - props = useFocusable(props); - return _3ORBWXWF_createElement("div", props); -}); -if (false) {} - - - -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/NWCBQ4CV.js -"use client"; - - - - - -// src/command/command.ts - - - - - +var ITI7HKP4_Composite = forwardRef2(function Composite2(props) { + const htmlProps = useComposite(props); + return LMDWO4NN_createElement(ITI7HKP4_TagName, htmlProps); +}); + + + +;// ./node_modules/@wordpress/components/build-module/composite/context.js +/** + * WordPress dependencies + */ + + +/** + * Internal dependencies + */ + +const CompositeContext = (0,external_wp_element_namespaceObject.createContext)({}); +const context_useCompositeContext = () => (0,external_wp_element_namespaceObject.useContext)(CompositeContext); + +;// ./node_modules/@ariakit/react-core/esm/__chunks/7HVFURXT.js +"use client"; + +// src/group/group-label-context.tsx + +var GroupLabelContext = (0,external_React_.createContext)(void 0); + + + +;// ./node_modules/@ariakit/react-core/esm/__chunks/36LIF33V.js +"use client"; + + + + + +// src/group/group.tsx + + + +var _36LIF33V_TagName = "div"; +var useGroup = createHook( + function useGroup2(props) { + const [labelId, setLabelId] = (0,external_React_.useState)(); + props = useWrapElement( + props, + (element) => /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(GroupLabelContext.Provider, { value: setLabelId, children: element }), + [] + ); + props = _3YLGPPWQ_spreadValues({ + role: "group", + "aria-labelledby": labelId + }, props); + return removeUndefinedValues(props); + } +); +var Group = forwardRef2(function Group2(props) { + const htmlProps = useGroup(props); + return LMDWO4NN_createElement(_36LIF33V_TagName, htmlProps); +}); + + + +;// ./node_modules/@ariakit/react-core/esm/__chunks/YORGHBM4.js +"use client"; + + + + +// src/composite/composite-group.tsx +var YORGHBM4_TagName = "div"; +var useCompositeGroup = createHook( + function useCompositeGroup2(_a) { + var _b = _a, { store } = _b, props = __objRest(_b, ["store"]); + props = useGroup(props); + return props; + } +); +var YORGHBM4_CompositeGroup = forwardRef2(function CompositeGroup2(props) { + const htmlProps = useCompositeGroup(props); + return LMDWO4NN_createElement(YORGHBM4_TagName, htmlProps); +}); + + + +;// ./node_modules/@wordpress/components/build-module/composite/group.js +/** + * External dependencies + */ + + +/** + * WordPress dependencies + */ + + +/** + * Internal dependencies + */ + + + +const CompositeGroup = (0,external_wp_element_namespaceObject.forwardRef)(function CompositeGroup(props, ref) { + var _props$store; + const context = context_useCompositeContext(); + + // @ts-expect-error The store prop is undocumented and only used by the + // legacy compat layer. The `store` prop is documented, but its type is + // obfuscated to discourage its use outside of the component's internals. + const store = (_props$store = props.store) !== null && _props$store !== void 0 ? _props$store : context.store; + return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(YORGHBM4_CompositeGroup, { + store: store, + ...props, + ref: ref + }); +}); + +;// ./node_modules/@ariakit/react-core/esm/__chunks/YUOJWFSO.js +"use client"; + + + + + +// src/group/group-label.tsx + + +var YUOJWFSO_TagName = "div"; +var useGroupLabel = createHook( + function useGroupLabel2(props) { + const setLabelId = (0,external_React_.useContext)(GroupLabelContext); + const id = useId(props.id); + useSafeLayoutEffect(() => { + setLabelId == null ? void 0 : setLabelId(id); + return () => setLabelId == null ? void 0 : setLabelId(void 0); + }, [setLabelId, id]); + props = _3YLGPPWQ_spreadValues({ + id, + "aria-hidden": true + }, props); + return removeUndefinedValues(props); + } +); +var GroupLabel = forwardRef2(function GroupLabel2(props) { + const htmlProps = useGroupLabel(props); + return LMDWO4NN_createElement(YUOJWFSO_TagName, htmlProps); +}); + + + +;// ./node_modules/@ariakit/react-core/esm/__chunks/SWSPTQMT.js +"use client"; + + + + +// src/composite/composite-group-label.tsx +var SWSPTQMT_TagName = "div"; +var useCompositeGroupLabel = createHook(function useCompositeGroupLabel2(_a) { + var _b = _a, { store } = _b, props = __objRest(_b, ["store"]); + props = useGroupLabel(props); + return props; +}); +var SWSPTQMT_CompositeGroupLabel = forwardRef2(function CompositeGroupLabel2(props) { + const htmlProps = useCompositeGroupLabel(props); + return LMDWO4NN_createElement(SWSPTQMT_TagName, htmlProps); +}); + + + +;// ./node_modules/@wordpress/components/build-module/composite/group-label.js +/** + * External dependencies + */ + + +/** + * WordPress dependencies + */ + + +/** + * Internal dependencies + */ + + + +const CompositeGroupLabel = (0,external_wp_element_namespaceObject.forwardRef)(function CompositeGroupLabel(props, ref) { + var _props$store; + const context = context_useCompositeContext(); + + // @ts-expect-error The store prop is undocumented and only used by the + // legacy compat layer. The `store` prop is documented, but its type is + // obfuscated to discourage its use outside of the component's internals. + const store = (_props$store = props.store) !== null && _props$store !== void 0 ? _props$store : context.store; + return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(SWSPTQMT_CompositeGroupLabel, { + store: store, + ...props, + ref: ref + }); +}); + +;// ./node_modules/@ariakit/react-core/esm/__chunks/UQQRIHDV.js +"use client"; + + + + + +// src/composite/composite-hover.tsx + + + + +var UQQRIHDV_TagName = "div"; +function getMouseDestination(event) { + const relatedTarget = event.relatedTarget; + if ((relatedTarget == null ? void 0 : relatedTarget.nodeType) === Node.ELEMENT_NODE) { + return relatedTarget; + } + return null; +} +function hoveringInside(event) { + const nextElement = getMouseDestination(event); + if (!nextElement) return false; + return contains(event.currentTarget, nextElement); +} +var symbol = Symbol("composite-hover"); +function movingToAnotherItem(event) { + let dest = getMouseDestination(event); + if (!dest) return false; + do { + if (PBFD2E7P_hasOwnProperty(dest, symbol) && dest[symbol]) return true; + dest = dest.parentElement; + } while (dest); + return false; +} +var useCompositeHover = createHook( + function useCompositeHover2(_a) { + var _b = _a, { + store, + focusOnHover = true, + blurOnHoverEnd = !!focusOnHover + } = _b, props = __objRest(_b, [ + "store", + "focusOnHover", + "blurOnHoverEnd" + ]); + const context = useCompositeContext(); + store = store || context; + invariant( + store, + false && 0 + ); + const isMouseMoving = useIsMouseMoving(); + const onMouseMoveProp = props.onMouseMove; + const focusOnHoverProp = useBooleanEvent(focusOnHover); + const onMouseMove = useEvent((event) => { + onMouseMoveProp == null ? void 0 : onMouseMoveProp(event); + if (event.defaultPrevented) return; + if (!isMouseMoving()) return; + if (!focusOnHoverProp(event)) return; + if (!hasFocusWithin(event.currentTarget)) { + const baseElement = store == null ? void 0 : store.getState().baseElement; + if (baseElement && !hasFocus(baseElement)) { + baseElement.focus(); + } + } + store == null ? void 0 : store.setActiveId(event.currentTarget.id); + }); + const onMouseLeaveProp = props.onMouseLeave; + const blurOnHoverEndProp = useBooleanEvent(blurOnHoverEnd); + const onMouseLeave = useEvent((event) => { + var _a2; + onMouseLeaveProp == null ? void 0 : onMouseLeaveProp(event); + if (event.defaultPrevented) return; + if (!isMouseMoving()) return; + if (hoveringInside(event)) return; + if (movingToAnotherItem(event)) return; + if (!focusOnHoverProp(event)) return; + if (!blurOnHoverEndProp(event)) return; + store == null ? void 0 : store.setActiveId(null); + (_a2 = store == null ? void 0 : store.getState().baseElement) == null ? void 0 : _a2.focus(); + }); + const ref = (0,external_React_.useCallback)((element) => { + if (!element) return; + element[symbol] = true; + }, []); + props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, props), { + ref: useMergeRefs(ref, props.ref), + onMouseMove, + onMouseLeave + }); + return removeUndefinedValues(props); + } +); +var UQQRIHDV_CompositeHover = memo2( + forwardRef2(function CompositeHover2(props) { + const htmlProps = useCompositeHover(props); + return LMDWO4NN_createElement(UQQRIHDV_TagName, htmlProps); + }) +); + + + +;// ./node_modules/@wordpress/components/build-module/composite/hover.js +/** + * External dependencies + */ + + +/** + * WordPress dependencies + */ + + +/** + * Internal dependencies + */ + + + +const CompositeHover = (0,external_wp_element_namespaceObject.forwardRef)(function CompositeHover(props, ref) { + var _props$store; + const context = context_useCompositeContext(); + + // @ts-expect-error The store prop is undocumented and only used by the + // legacy compat layer. The `store` prop is documented, but its type is + // obfuscated to discourage its use outside of the component's internals. + const store = (_props$store = props.store) !== null && _props$store !== void 0 ? _props$store : context.store; + return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(UQQRIHDV_CompositeHover, { + store: store, + ...props, + ref: ref + }); +}); + +;// ./node_modules/@ariakit/react-core/esm/__chunks/RZ4GPYOB.js +"use client"; + + + + + +// src/collection/collection-item.tsx + + +var RZ4GPYOB_TagName = "div"; +var useCollectionItem = createHook( + function useCollectionItem2(_a) { + var _b = _a, { + store, + shouldRegisterItem = true, + getItem = identity, + element: element + } = _b, props = __objRest(_b, [ + "store", + "shouldRegisterItem", + "getItem", + // @ts-expect-error This prop may come from a collection renderer. + "element" + ]); + const context = useCollectionContext(); + store = store || context; + const id = useId(props.id); + const ref = (0,external_React_.useRef)(element); + (0,external_React_.useEffect)(() => { + const element2 = ref.current; + if (!id) return; + if (!element2) return; + if (!shouldRegisterItem) return; + const item = getItem({ id, element: element2 }); + return store == null ? void 0 : store.renderItem(item); + }, [id, shouldRegisterItem, getItem, store]); + props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, props), { + ref: useMergeRefs(ref, props.ref) + }); + return removeUndefinedValues(props); + } +); +var CollectionItem = forwardRef2(function CollectionItem2(props) { + const htmlProps = useCollectionItem(props); + return LMDWO4NN_createElement(RZ4GPYOB_TagName, htmlProps); +}); + + + +;// ./node_modules/@ariakit/react-core/esm/__chunks/KUU7WJ55.js +"use client"; + + + + + +// src/command/command.tsx + + + + + +var KUU7WJ55_TagName = "button"; function isNativeClick(event) { - if (!event.isTrusted) - return false; + if (!event.isTrusted) return false; const element = event.currentTarget; if (event.key === "Enter") { return isButton(element) || element.tagName === "SUMMARY" || element.tagName === "A"; @@ -3564,41 +5014,30 @@ } return false; } -var symbol = Symbol("command"); +var KUU7WJ55_symbol = Symbol("command"); var useCommand = createHook( - (_a) => { + function useCommand2(_a) { var _b = _a, { clickOnEnter = true, clickOnSpace = true } = _b, props = __objRest(_b, ["clickOnEnter", "clickOnSpace"]); const ref = (0,external_React_.useRef)(null); - const tagName = useTagName(ref, props.as); - const type = props.type; - const [isNativeButton, setIsNativeButton] = (0,external_React_.useState)( - () => !!tagName && isButton({ tagName, type }) - ); + const [isNativeButton, setIsNativeButton] = (0,external_React_.useState)(false); (0,external_React_.useEffect)(() => { - if (!ref.current) - return; + if (!ref.current) return; setIsNativeButton(isButton(ref.current)); }, []); const [active, setActive] = (0,external_React_.useState)(false); const activeRef = (0,external_React_.useRef)(false); const disabled = disabledFromProps(props); - const [isDuplicate, metadataProps] = useMetadataProps(props, symbol, true); + const [isDuplicate, metadataProps] = useMetadataProps(props, KUU7WJ55_symbol, true); const onKeyDownProp = props.onKeyDown; const onKeyDown = useEvent((event) => { onKeyDownProp == null ? void 0 : onKeyDownProp(event); const element = event.currentTarget; - if (event.defaultPrevented) - return; - if (isDuplicate) - return; - if (disabled) - return; - if (!isSelfTarget(event)) - return; - if (DLOEKDPY_isTextField(element)) - return; - if (element.isContentEditable) - return; + if (event.defaultPrevented) return; + if (isDuplicate) return; + if (disabled) return; + if (!isSelfTarget(event)) return; + if (isTextField(element)) return; + if (element.isContentEditable) return; const isEnter = clickOnEnter && event.key === "Enter"; const isSpace = clickOnSpace && event.key === " "; const shouldPreventEnter = event.key === "Enter" && !clickOnEnter; @@ -3632,14 +5071,10 @@ const onKeyUpProp = props.onKeyUp; const onKeyUp = useEvent((event) => { onKeyUpProp == null ? void 0 : onKeyUpProp(event); - if (event.defaultPrevented) - return; - if (isDuplicate) - return; - if (disabled) - return; - if (event.metaKey) - return; + if (event.defaultPrevented) return; + if (isDuplicate) return; + if (disabled) return; + if (event.metaKey) return; const isSpace = clickOnSpace && event.key === " "; if (activeRef.current && isSpace) { activeRef.current = false; @@ -3652,8 +5087,8 @@ } } }); - props = _4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues(_4R3V3JGP_spreadValues({ - "data-active": active ? "" : void 0, + props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues(_3YLGPPWQ_spreadValues({ + "data-active": active || void 0, type: isNativeButton ? "button" : void 0 }, metadataProps), props), { ref: useMergeRefs(ref, props.ref), @@ -3664,505 +5099,14 @@ return props; } ); -var Command = createComponent((props) => { - props = useCommand(props); - return _3ORBWXWF_createElement("button", props); -}); -if (false) {} - - - -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/4UUKJZ4V.js -"use client"; - - -// src/collection/collection-context.tsx -var ctx = createStoreContext(); -var useCollectionContext = ctx.useContext; -var useCollectionScopedContext = ctx.useScopedContext; -var useCollectionProviderContext = ctx.useProviderContext; -var CollectionContextProvider = ctx.ContextProvider; -var CollectionScopedContextProvider = ctx.ScopedContextProvider; - - - -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/UH3I23HL.js -"use client"; - - - - - -// src/collection/collection-item.ts - - -var useCollectionItem = createHook( - (_a) => { - var _b = _a, { - store, - shouldRegisterItem = true, - getItem = identity, - element: element - } = _b, props = __objRest(_b, [ - "store", - "shouldRegisterItem", - "getItem", - // @ts-expect-error This prop may come from a collection renderer. - "element" - ]); - const context = useCollectionContext(); - store = store || context; - const id = useId(props.id); - const ref = (0,external_React_.useRef)(element); - (0,external_React_.useEffect)(() => { - const element2 = ref.current; - if (!id) - return; - if (!element2) - return; - if (!shouldRegisterItem) - return; - const item = getItem({ id, element: element2 }); - return store == null ? void 0 : store.renderItem(item); - }, [id, shouldRegisterItem, getItem, store]); - props = _4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues({}, props), { - ref: useMergeRefs(ref, props.ref) - }); - return props; - } -); -var CollectionItem = createComponent( - (props) => { - const htmlProps = useCollectionItem(props); - return _3ORBWXWF_createElement("div", htmlProps); - } -); -if (false) {} - - - -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/3IEDWLST.js -"use client"; - -// src/composite/utils.ts - -var NULL_ITEM = { id: null }; -function flipItems(items, activeId, shouldInsertNullItem = false) { - const index = items.findIndex((item) => item.id === activeId); - return [ - ...items.slice(index + 1), - ...shouldInsertNullItem ? [NULL_ITEM] : [], - ...items.slice(0, index) - ]; -} -function findFirstEnabledItem(items, excludeId) { - return items.find((item) => { - if (excludeId) { - return !item.disabled && item.id !== excludeId; - } - return !item.disabled; - }); -} -function getEnabledItem(store, id) { - if (!id) - return null; - return store.item(id) || null; -} -function groupItemsByRows(items) { - const rows = []; - for (const item of items) { - const row = rows.find((currentRow) => { - var _a; - return ((_a = currentRow[0]) == null ? void 0 : _a.rowId) === item.rowId; - }); - if (row) { - row.push(item); - } else { - rows.push([item]); - } - } - return rows; -} -function selectTextField(element, collapseToEnd = false) { - if (isTextField(element)) { - element.setSelectionRange( - collapseToEnd ? element.value.length : 0, - element.value.length - ); - } else if (element.isContentEditable) { - const selection = getDocument(element).getSelection(); - selection == null ? void 0 : selection.selectAllChildren(element); - if (collapseToEnd) { - selection == null ? void 0 : selection.collapseToEnd(); - } - } -} -var FOCUS_SILENTLY = Symbol("FOCUS_SILENTLY"); -function focusSilently(element) { - element[FOCUS_SILENTLY] = true; - element.focus({ preventScroll: true }); -} -function silentlyFocused(element) { - const isSilentlyFocused = element[FOCUS_SILENTLY]; - delete element[FOCUS_SILENTLY]; - return isSilentlyFocused; -} -function isItem(store, element, exclude) { - if (!element) - return false; - if (element === exclude) - return false; - const item = store.item(element.id); - if (!item) - return false; - if (exclude && item.element === exclude) - return false; - return true; -} - - - -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/IB7YUKH5.js -"use client"; - - - -// src/composite/composite-context.tsx - -var IB7YUKH5_ctx = createStoreContext( - [CollectionContextProvider], - [CollectionScopedContextProvider] -); -var useCompositeContext = IB7YUKH5_ctx.useContext; -var useCompositeScopedContext = IB7YUKH5_ctx.useScopedContext; -var useCompositeProviderContext = IB7YUKH5_ctx.useProviderContext; -var CompositeContextProvider = IB7YUKH5_ctx.ContextProvider; -var CompositeScopedContextProvider = IB7YUKH5_ctx.ScopedContextProvider; -var CompositeItemContext = (0,external_React_.createContext)( - void 0 -); -var CompositeRowContext = (0,external_React_.createContext)( - void 0 -); - - - -;// CONCATENATED MODULE: ./node_modules/@ariakit/core/esm/__chunks/EAHJFCU4.js -"use client"; - - - -// src/utils/store.ts -function getInternal(store, key) { - const internals = store.__unstableInternals; - invariant(internals, "Invalid store"); - return internals[key]; -} -function createStore(initialState, ...stores) { - let state = initialState; - let prevStateBatch = state; - let lastUpdate = Symbol(); - let destroy = noop; - const instances = /* @__PURE__ */ new Set(); - const updatedKeys = /* @__PURE__ */ new Set(); - const setups = /* @__PURE__ */ new Set(); - const listeners = /* @__PURE__ */ new Set(); - const batchListeners = /* @__PURE__ */ new Set(); - const disposables = /* @__PURE__ */ new WeakMap(); - const listenerKeys = /* @__PURE__ */ new WeakMap(); - const storeSetup = (callback) => { - setups.add(callback); - return () => setups.delete(callback); - }; - const storeInit = () => { - const initialized = instances.size; - const instance = Symbol(); - instances.add(instance); - const maybeDestroy = () => { - instances.delete(instance); - if (instances.size) - return; - destroy(); - }; - if (initialized) - return maybeDestroy; - const desyncs = getKeys(state).map( - (key) => chain( - ...stores.map((store) => { - var _a; - const storeState = (_a = store == null ? void 0 : store.getState) == null ? void 0 : _a.call(store); - if (!storeState) - return; - if (!Y3OOHFCN_hasOwnProperty(storeState, key)) - return; - return sync(store, [key], (state2) => { - setState( - key, - state2[key], - // @ts-expect-error - Not public API. This is just to prevent - // infinite loops. - true - ); - }); - }) - ) - ); - const teardowns = []; - setups.forEach((setup2) => teardowns.push(setup2())); - const cleanups = stores.map(init); - destroy = chain(...desyncs, ...teardowns, ...cleanups); - return maybeDestroy; - }; - const sub = (keys, listener, set = listeners) => { - set.add(listener); - listenerKeys.set(listener, keys); - return () => { - var _a; - (_a = disposables.get(listener)) == null ? void 0 : _a(); - disposables.delete(listener); - listenerKeys.delete(listener); - set.delete(listener); - }; - }; - const storeSubscribe = (keys, listener) => sub(keys, listener); - const storeSync = (keys, listener) => { - disposables.set(listener, listener(state, state)); - return sub(keys, listener); - }; - const storeBatch = (keys, listener) => { - disposables.set(listener, listener(state, prevStateBatch)); - return sub(keys, listener, batchListeners); - }; - const storePick = (keys) => createStore(pick(state, keys), finalStore); - const storeOmit = (keys) => createStore(omit(state, keys), finalStore); - const getState = () => state; - const setState = (key, value, fromStores = false) => { - if (!Y3OOHFCN_hasOwnProperty(state, key)) - return; - const nextValue = Y3OOHFCN_applyState(value, state[key]); - if (nextValue === state[key]) - return; - if (!fromStores) { - stores.forEach((store) => { - var _a; - (_a = store == null ? void 0 : store.setState) == null ? void 0 : _a.call(store, key, nextValue); - }); - } - const prevState = state; - state = _chunks_4R3V3JGP_spreadProps(_chunks_4R3V3JGP_spreadValues({}, state), { [key]: nextValue }); - const thisUpdate = Symbol(); - lastUpdate = thisUpdate; - updatedKeys.add(key); - const run = (listener, prev, uKeys) => { - var _a; - const keys = listenerKeys.get(listener); - const updated = (k) => uKeys ? uKeys.has(k) : k === key; - if (!keys || keys.some(updated)) { - (_a = disposables.get(listener)) == null ? void 0 : _a(); - disposables.set(listener, listener(state, prev)); - } - }; - listeners.forEach((listener) => { - run(listener, prevState); - }); - queueMicrotask(() => { - if (lastUpdate !== thisUpdate) - return; - const snapshot = state; - batchListeners.forEach((listener) => { - run(listener, prevStateBatch, updatedKeys); - }); - prevStateBatch = snapshot; - updatedKeys.clear(); - }); - }; - const finalStore = { - getState, - setState, - __unstableInternals: { - setup: storeSetup, - init: storeInit, - subscribe: storeSubscribe, - sync: storeSync, - batch: storeBatch, - pick: storePick, - omit: storeOmit - } - }; - return finalStore; -} -function setup(store, ...args) { - if (!store) - return; - return getInternal(store, "setup")(...args); -} -function init(store, ...args) { - if (!store) - return; - return getInternal(store, "init")(...args); -} -function subscribe(store, ...args) { - if (!store) - return; - return getInternal(store, "subscribe")(...args); -} -function sync(store, ...args) { - if (!store) - return; - return getInternal(store, "sync")(...args); -} -function batch(store, ...args) { - if (!store) - return; - return getInternal(store, "batch")(...args); -} -function omit2(store, ...args) { - if (!store) - return; - return getInternal(store, "omit")(...args); -} -function pick2(store, ...args) { - if (!store) - return; - return getInternal(store, "pick")(...args); -} -function mergeStore(...stores) { - const initialState = stores.reduce((state, store2) => { - var _a; - const nextState = (_a = store2 == null ? void 0 : store2.getState) == null ? void 0 : _a.call(store2); - if (!nextState) - return state; - return _chunks_4R3V3JGP_spreadValues(_chunks_4R3V3JGP_spreadValues({}, state), nextState); - }, {}); - const store = createStore(initialState, ...stores); - return store; -} -function throwOnConflictingProps(props, store) { - if (true) - return; - if (!store) - return; - const defaultKeys = Object.entries(props).filter(([key, value]) => key.startsWith("default") && value !== void 0).map(([key]) => { - var _a; - const stateKey = key.replace("default", ""); - return `${((_a = stateKey[0]) == null ? void 0 : _a.toLowerCase()) || ""}${stateKey.slice(1)}`; - }); - if (!defaultKeys.length) - return; - const storeState = store.getState(); - const conflictingProps = defaultKeys.filter( - (key) => Y3OOHFCN_hasOwnProperty(storeState, key) - ); - if (!conflictingProps.length) - return; - throw new Error( - `Passing a store prop in conjunction with a default state is not supported. - -const store = useSelectStore(); - - ^ ^ - -Instead, pass the default state to the topmost store: - -const store = useSelectStore({ defaultValue: "Apple" }); - - -See https://github.com/ariakit/ariakit/pull/2745 for more details. - -If there's a particular need for this, please submit a feature request at https://github.com/ariakit/ariakit -` - ); -} - - - -// EXTERNAL MODULE: ./node_modules/use-sync-external-store/shim/index.js -var shim = __webpack_require__(422); -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/EKQEJRUF.js -"use client"; - - - -// src/utils/store.tsx - - - - -var { useSyncExternalStore } = shim; -var noopSubscribe = () => () => { -}; -function useStoreState(store, keyOrSelector = identity) { - const storeSubscribe = external_React_.useCallback( - (callback) => { - if (!store) - return noopSubscribe(); - return subscribe(store, null, callback); - }, - [store] - ); - const getSnapshot = () => { - const key = typeof keyOrSelector === "string" ? keyOrSelector : null; - const selector = typeof keyOrSelector === "function" ? keyOrSelector : null; - const state = store == null ? void 0 : store.getState(); - if (selector) - return selector(state); - if (!state) - return; - if (!key) - return; - if (!Y3OOHFCN_hasOwnProperty(state, key)) - return; - return state[key]; - }; - return useSyncExternalStore(storeSubscribe, getSnapshot, getSnapshot); -} -function useStoreProps(store, props, key, setKey) { - const value = Y3OOHFCN_hasOwnProperty(props, key) ? props[key] : void 0; - const setValue = setKey ? props[setKey] : void 0; - const propsRef = useLiveRef({ value, setValue }); - useSafeLayoutEffect(() => { - return sync(store, [key], (state, prev) => { - const { value: value2, setValue: setValue2 } = propsRef.current; - if (!setValue2) - return; - if (state[key] === prev[key]) - return; - if (state[key] === value2) - return; - setValue2(state[key]); - }); - }, [store, key]); - useSafeLayoutEffect(() => { - if (value === void 0) - return; - store.setState(key, value); - return batch(store, [key], () => { - if (value === void 0) - return; - store.setState(key, value); - }); - }); -} -function EKQEJRUF_useStore(createStore, props) { - const [store, setStore] = external_React_.useState(() => createStore(props)); - useSafeLayoutEffect(() => init(store), [store]); - const useState2 = external_React_.useCallback( - (keyOrSelector) => useStoreState(store, keyOrSelector), - [store] - ); - const memoizedStore = external_React_.useMemo( - () => _4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues({}, store), { useState: useState2 }), - [store, useState2] - ); - const updateStore = useEvent(() => { - setStore((store2) => createStore(_4R3V3JGP_spreadValues(_4R3V3JGP_spreadValues({}, props), store2.getState()))); - }); - return [memoizedStore, updateStore]; -} - - - -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/QZLXIDNP.js +var Command = forwardRef2(function Command2(props) { + const htmlProps = useCommand(props); + return LMDWO4NN_createElement(KUU7WJ55_TagName, htmlProps); +}); + + + +;// ./node_modules/@ariakit/react-core/esm/__chunks/P2CTZE2T.js "use client"; @@ -4179,11 +5123,10 @@ + +var P2CTZE2T_TagName = "button"; function isEditableElement(element) { - if (element.isContentEditable) - return true; - if (DLOEKDPY_isTextField(element)) - return true; + if (isTextbox(element)) return true; return element.tagName === "INPUT" && !isButton(element); } function getNextPageOffset(scrollingElement, pageUp = false) { @@ -4205,27 +5148,21 @@ } function findNextPageItemId(element, store, next, pageUp = false) { var _a; - if (!store) - return; - if (!next) - return; + if (!store) return; + if (!next) return; const { renderedItems } = store.getState(); const scrollingElement = getScrollingElement(element); - if (!scrollingElement) - return; + if (!scrollingElement) return; const nextPageOffset = getNextPageOffset(scrollingElement, pageUp); let id; let prevDifference; for (let i = 0; i < renderedItems.length; i += 1) { const previousId = id; id = next(i); - if (!id) - break; - if (id === previousId) - continue; + if (!id) break; + if (id === previousId) continue; const itemElement = (_a = getEnabledItem(store, id)) == null ? void 0 : _a.element; - if (!itemElement) - continue; + if (!itemElement) continue; const itemOffset = getItemOffset(itemElement, pageUp); const difference = itemOffset - nextPageOffset; const absDifference = Math.abs(difference); @@ -4240,43 +5177,11 @@ return id; } function targetIsAnotherItem(event, store) { - if (isSelfTarget(event)) - return false; + if (isSelfTarget(event)) return false; return isItem(store, event.target); } -function useRole(ref, props) { - const roleProp = props.role; - const [role, setRole] = (0,external_React_.useState)(roleProp); - useSafeLayoutEffect(() => { - const element = ref.current; - if (!element) - return; - setRole(element.getAttribute("role") || roleProp); - }, [roleProp]); - return role; -} -function requiresAriaSelected(role) { - return role === "option" || role === "treeitem"; -} -function supportsAriaSelected(role) { - if (role === "option") - return true; - if (role === "tab") - return true; - if (role === "treeitem") - return true; - if (role === "gridcell") - return true; - if (role === "row") - return true; - if (role === "columnheader") - return true; - if (role === "rowheader") - return true; - return false; -} var useCompositeItem = createHook( - (_a) => { + function useCompositeItem2(_a) { var _b = _a, { store, rowId: rowIdProp, @@ -4301,25 +5206,65 @@ const id = useId(props.id); const ref = (0,external_React_.useRef)(null); const row = (0,external_React_.useContext)(CompositeRowContext); - const rowId = useStoreState(store, (state) => { - if (rowIdProp) - return rowIdProp; - if (!state) - return; - if (!(row == null ? void 0 : row.baseElement)) - return; - if (row.baseElement !== state.baseElement) - return; - return row.id; - }); const disabled = disabledFromProps(props); const trulyDisabled = disabled && !props.accessibleWhenDisabled; + const { + rowId, + baseElement, + isActiveItem, + ariaSetSize, + ariaPosInSet, + isTabbable + } = useStoreStateObject(store, { + rowId(state) { + if (rowIdProp) return rowIdProp; + if (!state) return; + if (!(row == null ? void 0 : row.baseElement)) return; + if (row.baseElement !== state.baseElement) return; + return row.id; + }, + baseElement(state) { + return (state == null ? void 0 : state.baseElement) || void 0; + }, + isActiveItem(state) { + return !!state && state.activeId === id; + }, + ariaSetSize(state) { + if (ariaSetSizeProp != null) return ariaSetSizeProp; + if (!state) return; + if (!(row == null ? void 0 : row.ariaSetSize)) return; + if (row.baseElement !== state.baseElement) return; + return row.ariaSetSize; + }, + ariaPosInSet(state) { + if (ariaPosInSetProp != null) return ariaPosInSetProp; + if (!state) return; + if (!(row == null ? void 0 : row.ariaPosInSet)) return; + if (row.baseElement !== state.baseElement) return; + const itemsInRow = state.renderedItems.filter( + (item) => item.rowId === rowId + ); + return row.ariaPosInSet + itemsInRow.findIndex((item) => item.id === id); + }, + isTabbable(state) { + if (!(state == null ? void 0 : state.renderedItems.length)) return true; + if (state.virtualFocus) return false; + if (tabbable) return true; + if (state.activeId === null) return false; + const item = store == null ? void 0 : store.item(state.activeId); + if (item == null ? void 0 : item.disabled) return true; + if (!(item == null ? void 0 : item.element)) return true; + return state.activeId === id; + } + }); const getItem = (0,external_React_.useCallback)( (item) => { - const nextItem = _4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues({}, item), { + var _a2; + const nextItem = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, item), { id: id || item.id, rowId, - disabled: !!trulyDisabled + disabled: !!trulyDisabled, + children: (_a2 = item.element) == null ? void 0 : _a2.textContent }); if (getItemProp) { return getItemProp(nextItem); @@ -4332,28 +5277,26 @@ const hasFocusedComposite = (0,external_React_.useRef)(false); const onFocus = useEvent((event) => { onFocusProp == null ? void 0 : onFocusProp(event); - if (event.defaultPrevented) - return; - if (isPortalEvent(event)) - return; - if (!id) - return; - if (!store) - return; - const { activeId, virtualFocus: virtualFocus2, baseElement: baseElement2 } = store.getState(); - if (targetIsAnotherItem(event, store)) - return; - if (activeId !== id) { - store.setActiveId(id); - } - if (!virtualFocus2) - return; - if (!isSelfTarget(event)) - return; - if (isEditableElement(event.currentTarget)) - return; - if (!(baseElement2 == null ? void 0 : baseElement2.isConnected)) - return; + if (event.defaultPrevented) return; + if (isPortalEvent(event)) return; + if (!id) return; + if (!store) return; + if (targetIsAnotherItem(event, store)) return; + const { virtualFocus, baseElement: baseElement2 } = store.getState(); + store.setActiveId(id); + if (isTextbox(event.currentTarget)) { + selectTextField(event.currentTarget); + } + if (!virtualFocus) return; + if (!isSelfTarget(event)) return; + if (isEditableElement(event.currentTarget)) return; + if (!(baseElement2 == null ? void 0 : baseElement2.isConnected)) return; + if (isSafari() && event.currentTarget.hasAttribute("data-autofocus")) { + event.currentTarget.scrollIntoView({ + block: "nearest", + inline: "nearest" + }); + } hasFocusedComposite.current = true; const fromComposite = event.relatedTarget === baseElement2 || isItem(store, event.relatedTarget); if (fromComposite) { @@ -4365,8 +5308,7 @@ const onBlurCaptureProp = props.onBlurCapture; const onBlurCapture = useEvent((event) => { onBlurCaptureProp == null ? void 0 : onBlurCaptureProp(event); - if (event.defaultPrevented) - return; + if (event.defaultPrevented) return; const state = store == null ? void 0 : store.getState(); if ((state == null ? void 0 : state.virtualFocus) && hasFocusedComposite.current) { hasFocusedComposite.current = false; @@ -4379,12 +5321,9 @@ const moveOnKeyPressProp = useBooleanEvent(moveOnKeyPress); const onKeyDown = useEvent((event) => { onKeyDownProp == null ? void 0 : onKeyDownProp(event); - if (event.defaultPrevented) - return; - if (!isSelfTarget(event)) - return; - if (!store) - return; + if (event.defaultPrevented) return; + if (!isSelfTarget(event)) return; + if (!store) return; const { currentTarget } = event; const state = store.getState(); const item = store.item(id); @@ -4392,14 +5331,10 @@ const isVertical = state.orientation !== "horizontal"; const isHorizontal = state.orientation !== "vertical"; const canHomeEnd = () => { - if (isGrid) - return true; - if (isHorizontal) - return true; - if (!state.baseElement) - return true; - if (!DLOEKDPY_isTextField(state.baseElement)) - return true; + if (isGrid) return true; + if (isHorizontal) return true; + if (!state.baseElement) return true; + if (!isTextField(state.baseElement)) return true; return false; }; const keyMap = { @@ -4408,16 +5343,14 @@ ArrowDown: (isGrid || isVertical) && store.down, ArrowLeft: (isGrid || isHorizontal) && store.previous, Home: () => { - if (!canHomeEnd()) - return; + if (!canHomeEnd()) return; if (!isGrid || event.ctrlKey) { return store == null ? void 0 : store.first(); } return store == null ? void 0 : store.previous(-1); }, End: () => { - if (!canHomeEnd()) - return; + if (!canHomeEnd()) return; if (!isGrid || event.ctrlKey) { return store == null ? void 0 : store.last(); } @@ -4432,19 +5365,25 @@ }; const action = keyMap[event.key]; if (action) { + if (isTextbox(currentTarget)) { + const selection = getTextboxSelection(currentTarget); + const isLeft = isHorizontal && event.key === "ArrowLeft"; + const isRight = isHorizontal && event.key === "ArrowRight"; + const isUp = isVertical && event.key === "ArrowUp"; + const isDown = isVertical && event.key === "ArrowDown"; + if (isRight || isDown) { + const { length: valueLength } = getTextboxValue(currentTarget); + if (selection.end !== valueLength) return; + } else if ((isLeft || isUp) && selection.start !== 0) return; + } const nextId = action(); if (preventScrollOnKeyDownProp(event) || nextId !== void 0) { - if (!moveOnKeyPressProp(event)) - return; + if (!moveOnKeyPressProp(event)) return; event.preventDefault(); store.move(nextId); } } }); - const baseElement = useStoreState( - store, - (state) => (state == null ? void 0 : state.baseElement) || void 0 - ); const providerValue = (0,external_React_.useMemo)( () => ({ id, baseElement }), [id, baseElement] @@ -4454,58 +5393,9 @@ (element) => /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(CompositeItemContext.Provider, { value: providerValue, children: element }), [providerValue] ); - const isActiveItem = useStoreState( - store, - (state) => !!state && state.activeId === id - ); - const virtualFocus = useStoreState(store, "virtualFocus"); - const role = useRole(ref, props); - let ariaSelected; - if (isActiveItem) { - if (requiresAriaSelected(role)) { - ariaSelected = true; - } else if (virtualFocus && supportsAriaSelected(role)) { - ariaSelected = true; - } - } - const ariaSetSize = useStoreState(store, (state) => { - if (ariaSetSizeProp != null) - return ariaSetSizeProp; - if (!state) - return; - if (!(row == null ? void 0 : row.ariaSetSize)) - return; - if (row.baseElement !== state.baseElement) - return; - return row.ariaSetSize; - }); - const ariaPosInSet = useStoreState(store, (state) => { - if (ariaPosInSetProp != null) - return ariaPosInSetProp; - if (!state) - return; - if (!(row == null ? void 0 : row.ariaPosInSet)) - return; - if (row.baseElement !== state.baseElement) - return; - const itemsInRow = state.renderedItems.filter( - (item) => item.rowId === rowId - ); - return row.ariaPosInSet + itemsInRow.findIndex((item) => item.id === id); - }); - const isTabbable = useStoreState(store, (state) => { - if (!(state == null ? void 0 : state.renderedItems.length)) - return true; - if (state.virtualFocus) - return false; - if (tabbable) - return true; - return state.activeId === id; - }); - props = _4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues({ + props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({ id, - "aria-selected": ariaSelected, - "data-active-item": isActiveItem ? "" : void 0 + "data-active-item": isActiveItem || void 0 }, props), { ref: useMergeRefs(ref, props.ref), tabIndex: isTabbable ? props.tabIndex : -1, @@ -4514,29 +5404,530 @@ onKeyDown }); props = useCommand(props); - props = useCollectionItem(_4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues({ + props = useCollectionItem(_3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({ store }, props), { getItem, - shouldRegisterItem: !!id ? props.shouldRegisterItem : false + shouldRegisterItem: id ? props.shouldRegisterItem : false + })); + return removeUndefinedValues(_3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, props), { + "aria-setsize": ariaSetSize, + "aria-posinset": ariaPosInSet })); - return _4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues({}, props), { + } +); +var P2CTZE2T_CompositeItem = memo2( + forwardRef2(function CompositeItem2(props) { + const htmlProps = useCompositeItem(props); + return LMDWO4NN_createElement(P2CTZE2T_TagName, htmlProps); + }) +); + + + +;// ./node_modules/@wordpress/components/build-module/composite/item.js +/** + * External dependencies + */ + + +/** + * WordPress dependencies + */ + + +/** + * Internal dependencies + */ + + + +const CompositeItem = (0,external_wp_element_namespaceObject.forwardRef)(function CompositeItem(props, ref) { + var _props$store; + const context = context_useCompositeContext(); + + // @ts-expect-error The store prop is undocumented and only used by the + // legacy compat layer. The `store` prop is documented, but its type is + // obfuscated to discourage its use outside of the component's internals. + const store = (_props$store = props.store) !== null && _props$store !== void 0 ? _props$store : context.store; + return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(P2CTZE2T_CompositeItem, { + store: store, + ...props, + ref: ref + }); +}); + +;// ./node_modules/@ariakit/react-core/esm/__chunks/J2LQO3EC.js +"use client"; + + + + + +// src/composite/composite-row.tsx + + + +var J2LQO3EC_TagName = "div"; +var useCompositeRow = createHook( + function useCompositeRow2(_a) { + var _b = _a, { + store, "aria-setsize": ariaSetSize, "aria-posinset": ariaPosInSet - }); - } -); -var CompositeItem = createMemoComponent( - (props) => { - const htmlProps = useCompositeItem(props); - return _3ORBWXWF_createElement("button", htmlProps); - } -); -if (false) {} - - - -;// CONCATENATED MODULE: ./node_modules/@ariakit/core/esm/__chunks/Z5IGYIPT.js + } = _b, props = __objRest(_b, [ + "store", + "aria-setsize", + "aria-posinset" + ]); + const context = useCompositeContext(); + store = store || context; + invariant( + store, + false && 0 + ); + const id = useId(props.id); + const baseElement = store.useState( + (state) => state.baseElement || void 0 + ); + const providerValue = (0,external_React_.useMemo)( + () => ({ id, baseElement, ariaSetSize, ariaPosInSet }), + [id, baseElement, ariaSetSize, ariaPosInSet] + ); + props = useWrapElement( + props, + (element) => /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(CompositeRowContext.Provider, { value: providerValue, children: element }), + [providerValue] + ); + props = _3YLGPPWQ_spreadValues({ id }, props); + return removeUndefinedValues(props); + } +); +var J2LQO3EC_CompositeRow = forwardRef2(function CompositeRow2(props) { + const htmlProps = useCompositeRow(props); + return LMDWO4NN_createElement(J2LQO3EC_TagName, htmlProps); +}); + + + +;// ./node_modules/@wordpress/components/build-module/composite/row.js +/** + * External dependencies + */ + + +/** + * WordPress dependencies + */ + + +/** + * Internal dependencies + */ + + + +const CompositeRow = (0,external_wp_element_namespaceObject.forwardRef)(function CompositeRow(props, ref) { + var _props$store; + const context = context_useCompositeContext(); + + // @ts-expect-error The store prop is undocumented and only used by the + // legacy compat layer. The `store` prop is documented, but its type is + // obfuscated to discourage its use outside of the component's internals. + const store = (_props$store = props.store) !== null && _props$store !== void 0 ? _props$store : context.store; + return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(J2LQO3EC_CompositeRow, { + store: store, + ...props, + ref: ref + }); +}); + +;// ./node_modules/@ariakit/react-core/esm/__chunks/T7VMP3TM.js +"use client"; + + + + + + +// src/composite/composite-typeahead.tsx + + + + +var T7VMP3TM_TagName = "div"; +var chars = ""; +function clearChars() { + chars = ""; +} +function isValidTypeaheadEvent(event) { + const target = event.target; + if (target && isTextField(target)) return false; + if (event.key === " " && chars.length) return true; + return event.key.length === 1 && !event.ctrlKey && !event.altKey && !event.metaKey && /^[\p{Letter}\p{Number}]$/u.test(event.key); +} +function isSelfTargetOrItem(event, items) { + if (isSelfTarget(event)) return true; + const target = event.target; + if (!target) return false; + const isItem = items.some((item) => item.element === target); + return isItem; +} +function T7VMP3TM_getEnabledItems(items) { + return items.filter((item) => !item.disabled); +} +function itemTextStartsWith(item, text) { + var _a; + const itemText = ((_a = item.element) == null ? void 0 : _a.textContent) || item.children || // The composite item object itself doesn't include a value property, but + // other components like Select do. Since CompositeTypeahead is a generic + // component that can be used with those as well, we also consider the value + // property as a fallback for the typeahead text content. + "value" in item && item.value; + if (!itemText) return false; + return normalizeString(itemText).trim().toLowerCase().startsWith(text.toLowerCase()); +} +function getSameInitialItems(items, char, activeId) { + if (!activeId) return items; + const activeItem = items.find((item) => item.id === activeId); + if (!activeItem) return items; + if (!itemTextStartsWith(activeItem, char)) return items; + if (chars !== char && itemTextStartsWith(activeItem, chars)) return items; + chars = char; + return _5VQZOHHZ_flipItems( + items.filter((item) => itemTextStartsWith(item, chars)), + activeId + ).filter((item) => item.id !== activeId); +} +var useCompositeTypeahead = createHook(function useCompositeTypeahead2(_a) { + var _b = _a, { store, typeahead = true } = _b, props = __objRest(_b, ["store", "typeahead"]); + const context = useCompositeContext(); + store = store || context; + invariant( + store, + false && 0 + ); + const onKeyDownCaptureProp = props.onKeyDownCapture; + const cleanupTimeoutRef = (0,external_React_.useRef)(0); + const onKeyDownCapture = useEvent((event) => { + onKeyDownCaptureProp == null ? void 0 : onKeyDownCaptureProp(event); + if (event.defaultPrevented) return; + if (!typeahead) return; + if (!store) return; + if (!isValidTypeaheadEvent(event)) { + return clearChars(); + } + const { renderedItems, items, activeId, id } = store.getState(); + let enabledItems = T7VMP3TM_getEnabledItems( + items.length > renderedItems.length ? items : renderedItems + ); + const document = getDocument(event.currentTarget); + const selector = `[data-offscreen-id="${id}"]`; + const offscreenItems = document.querySelectorAll(selector); + for (const element of offscreenItems) { + const disabled = element.ariaDisabled === "true" || "disabled" in element && !!element.disabled; + enabledItems.push({ id: element.id, element, disabled }); + } + if (offscreenItems.length) { + enabledItems = sortBasedOnDOMPosition(enabledItems, (i) => i.element); + } + if (!isSelfTargetOrItem(event, enabledItems)) return clearChars(); + event.preventDefault(); + window.clearTimeout(cleanupTimeoutRef.current); + cleanupTimeoutRef.current = window.setTimeout(() => { + chars = ""; + }, 500); + const char = event.key.toLowerCase(); + chars += char; + enabledItems = getSameInitialItems(enabledItems, char, activeId); + const item = enabledItems.find((item2) => itemTextStartsWith(item2, chars)); + if (item) { + store.move(item.id); + } else { + clearChars(); + } + }); + props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, props), { + onKeyDownCapture + }); + return removeUndefinedValues(props); +}); +var T7VMP3TM_CompositeTypeahead = forwardRef2(function CompositeTypeahead2(props) { + const htmlProps = useCompositeTypeahead(props); + return LMDWO4NN_createElement(T7VMP3TM_TagName, htmlProps); +}); + + + +;// ./node_modules/@wordpress/components/build-module/composite/typeahead.js +/** + * External dependencies + */ + + +/** + * WordPress dependencies + */ + + +/** + * Internal dependencies + */ + + + +const CompositeTypeahead = (0,external_wp_element_namespaceObject.forwardRef)(function CompositeTypeahead(props, ref) { + var _props$store; + const context = context_useCompositeContext(); + + // @ts-expect-error The store prop is undocumented and only used by the + // legacy compat layer. The `store` prop is documented, but its type is + // obfuscated to discourage its use outside of the component's internals. + const store = (_props$store = props.store) !== null && _props$store !== void 0 ? _props$store : context.store; + return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(T7VMP3TM_CompositeTypeahead, { + store: store, + ...props, + ref: ref + }); +}); + +;// ./node_modules/@wordpress/components/build-module/composite/index.js +/** + * Composite is a component that may contain navigable items represented by + * Composite.Item. It's inspired by the WAI-ARIA Composite Role and implements + * all the keyboard navigation mechanisms to ensure that there's only one + * tab stop for the whole Composite element. This means that it can behave as + * a roving tabindex or aria-activedescendant container. + * + * @see https://ariakit.org/components/composite + */ + +/** + * External dependencies + */ + + +/** + * WordPress dependencies + */ + + + +/** + * Internal dependencies + */ + + + + + + + + + +/** + * Renders a widget based on the WAI-ARIA [`composite`](https://w3c.github.io/aria/#composite) + * role, which provides a single tab stop on the page and arrow key navigation + * through the focusable descendants. + * + * @example + * ```jsx + * import { Composite } from '@wordpress/components'; + * + * + * Item 1 + * Item 2 + * + * ``` + */ +const Composite = Object.assign((0,external_wp_element_namespaceObject.forwardRef)(function Composite({ + // Composite store props + activeId, + defaultActiveId, + setActiveId, + focusLoop = false, + focusWrap = false, + focusShift = false, + virtualFocus = false, + orientation = 'both', + rtl = (0,external_wp_i18n_namespaceObject.isRTL)(), + // Composite component props + children, + disabled = false, + // Rest props + ...props +}, ref) { + // @ts-expect-error The store prop is undocumented and only used by the + // legacy compat layer. + const storeProp = props.store; + const internalStore = useCompositeStore({ + activeId, + defaultActiveId, + setActiveId, + focusLoop, + focusWrap, + focusShift, + virtualFocus, + orientation, + rtl + }); + const store = storeProp !== null && storeProp !== void 0 ? storeProp : internalStore; + const contextValue = (0,external_wp_element_namespaceObject.useMemo)(() => ({ + store + }), [store]); + return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ITI7HKP4_Composite, { + disabled: disabled, + store: store, + ...props, + ref: ref, + children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(CompositeContext.Provider, { + value: contextValue, + children: children + }) + }); +}), { + /** + * Renders a group element for composite items. + * + * @example + * ```jsx + * import { Composite } from '@wordpress/components'; + * + * + * + * Label + * Item 1 + * Item 2 + * + * + * ``` + */ + Group: Object.assign(CompositeGroup, { + displayName: 'Composite.Group' + }), + /** + * Renders a label in a composite group. This component must be wrapped with + * `Composite.Group` so the `aria-labelledby` prop is properly set on the + * composite group element. + * + * @example + * ```jsx + * import { Composite } from '@wordpress/components'; + * + * + * + * Label + * Item 1 + * Item 2 + * + * + * ``` + */ + GroupLabel: Object.assign(CompositeGroupLabel, { + displayName: 'Composite.GroupLabel' + }), + /** + * Renders a composite item. + * + * @example + * ```jsx + * import { Composite } from '@wordpress/components'; + * + * + * Item 1 + * Item 2 + * Item 3 + * + * ``` + */ + Item: Object.assign(CompositeItem, { + displayName: 'Composite.Item' + }), + /** + * Renders a composite row. Wrapping `Composite.Item` elements within + * `Composite.Row` will create a two-dimensional composite widget, such as a + * grid. + * + * @example + * ```jsx + * import { Composite } from '@wordpress/components'; + * + * + * + * Item 1.1 + * Item 1.2 + * Item 1.3 + * + * + * Item 2.1 + * Item 2.2 + * Item 2.3 + * + * + * ``` + */ + Row: Object.assign(CompositeRow, { + displayName: 'Composite.Row' + }), + /** + * Renders an element in a composite widget that receives focus on mouse move + * and loses focus to the composite base element on mouse leave. This should + * be combined with the `Composite.Item` component. + * + * @example + * ```jsx + * import { Composite } from '@wordpress/components'; + * + * + * }> + * Item 1 + * + * }> + * Item 2 + * + * + * ``` + */ + Hover: Object.assign(CompositeHover, { + displayName: 'Composite.Hover' + }), + /** + * Renders a component that adds typeahead functionality to composite + * components. Hitting printable character keys will move focus to the next + * composite item that begins with the input characters. + * + * @example + * ```jsx + * import { Composite } from '@wordpress/components'; + * + * }> + * Item 1 + * Item 2 + * + * ``` + */ + Typeahead: Object.assign(CompositeTypeahead, { + displayName: 'Composite.Typeahead' + }), + /** + * The React context used by the composite components. It can be used by + * to access the composite store, and to forward the context when composite + * sub-components are rendered across portals (ie. `SlotFill` components) + * that would not otherwise forward the context to the `Fill` children. + * + * @example + * ```jsx + * import { Composite } from '@wordpress/components'; + * import { useContext } from '@wordpress/element'; + * + * const compositeContext = useContext( Composite.Context ); + * ``` + */ + Context: Object.assign(CompositeContext, { + displayName: 'Composite.Context' + }) +}); + +;// ./node_modules/@ariakit/core/esm/__chunks/RCQ5P4YE.js "use client"; @@ -4569,16 +5960,14 @@ setup( disclosure, () => sync(disclosure, ["animated", "animating"], (state) => { - if (state.animated) - return; + if (state.animated) return; disclosure.setState("animating", false); }) ); setup( disclosure, () => subscribe(disclosure, ["open"], () => { - if (!disclosure.getState().animated) - return; + if (!disclosure.getState().animated) return; disclosure.setState("animating", true); }) ); @@ -4588,7 +5977,8 @@ disclosure.setState("mounted", state.open || state.animating); }) ); - return _chunks_4R3V3JGP_spreadProps(_chunks_4R3V3JGP_spreadValues({}, disclosure), { + return _chunks_3YLGPPWQ_spreadProps(_chunks_3YLGPPWQ_spreadValues({}, disclosure), { + disclosure: props.disclosure, setOpen: (value) => disclosure.setState("open", value), show: () => disclosure.setState("open", true), hide: () => disclosure.setState("open", false), @@ -4601,7 +5991,7 @@ -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/SFCBA2JZ.js +;// ./node_modules/@ariakit/react-core/esm/__chunks/WYCIER3C.js "use client"; @@ -4613,16 +6003,16 @@ useStoreProps(store, props, "open", "setOpen"); useStoreProps(store, props, "mounted", "setMounted"); useStoreProps(store, props, "animated"); - return store; + return Object.assign(store, { disclosure: props.disclosure }); } function useDisclosureStore(props = {}) { - const [store, update] = EKQEJRUF_useStore(createDisclosureStore, props); + const [store, update] = YV4JVR4I_useStore(createDisclosureStore, props); return useDisclosureStoreProps(store, update, props); } -;// CONCATENATED MODULE: ./node_modules/@ariakit/core/esm/__chunks/SX2XFD6A.js +;// ./node_modules/@ariakit/core/esm/__chunks/FZZ2AVHF.js "use client"; @@ -4633,7 +6023,7 @@ -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/ZSELSBRM.js +;// ./node_modules/@ariakit/react-core/esm/__chunks/BM6PGYQY.js "use client"; @@ -4644,13 +6034,13 @@ return useDisclosureStoreProps(store, update, props); } function useDialogStore(props = {}) { - const [store, update] = EKQEJRUF_useStore(createDialogStore, props); + const [store, update] = YV4JVR4I_useStore(createDialogStore, props); return useDialogStoreProps(store, update, props); } -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/MG4P3223.js +;// ./node_modules/@ariakit/react-core/esm/__chunks/O2PQ2652.js "use client"; @@ -4660,9 +6050,8 @@ function usePopoverStoreProps(store, update, props) { useUpdateEffect(update, [props.popover]); - store = useDialogStoreProps(store, update, props); useStoreProps(store, props, "placement"); - return store; + return useDialogStoreProps(store, update, props); } function usePopoverStore(props = {}) { const [store, update] = useStore(Core.createPopoverStore, props); @@ -4671,7 +6060,7 @@ -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/ZU7LQC5V.js +;// ./node_modules/@ariakit/react-core/esm/__chunks/FTXTWCCT.js "use client"; @@ -4679,11 +6068,10 @@ // src/hovercard/hovercard-store.ts function useHovercardStoreProps(store, update, props) { - store = usePopoverStoreProps(store, update, props); useStoreProps(store, props, "timeout"); useStoreProps(store, props, "showTimeout"); useStoreProps(store, props, "hideTimeout"); - return store; + return usePopoverStoreProps(store, update, props); } function useHovercardStore(props = {}) { const [store, update] = useStore(Core.createHovercardStore, props); @@ -4692,7 +6080,7 @@ -;// CONCATENATED MODULE: ./node_modules/@ariakit/core/esm/__chunks/AF6IUUFN.js +;// ./node_modules/@ariakit/core/esm/__chunks/ME2CUF3F.js "use client"; @@ -4703,7 +6091,7 @@ function createPopoverStore(_a = {}) { var _b = _a, { popover: otherPopover - } = _b, props = _4R3V3JGP_objRest(_b, [ + } = _b, props = _3YLGPPWQ_objRest(_b, [ "popover" ]); const store = mergeStore( @@ -4718,13 +6106,13 @@ ); throwOnConflictingProps(props, store); const syncState = store == null ? void 0 : store.getState(); - const dialog = createDialogStore(_chunks_4R3V3JGP_spreadProps(_chunks_4R3V3JGP_spreadValues({}, props), { store })); + const dialog = createDialogStore(_chunks_3YLGPPWQ_spreadProps(_chunks_3YLGPPWQ_spreadValues({}, props), { store })); const placement = defaultValue( props.placement, syncState == null ? void 0 : syncState.placement, "bottom" ); - const initialState = _chunks_4R3V3JGP_spreadProps(_chunks_4R3V3JGP_spreadValues({}, dialog.getState()), { + const initialState = _chunks_3YLGPPWQ_spreadProps(_chunks_3YLGPPWQ_spreadValues({}, dialog.getState()), { placement, currentPlacement: placement, anchorElement: defaultValue(syncState == null ? void 0 : syncState.anchorElement, null), @@ -4733,7 +6121,7 @@ rendered: Symbol("rendered") }); const popover = createStore(initialState, dialog, store); - return _chunks_4R3V3JGP_spreadProps(_chunks_4R3V3JGP_spreadValues(_chunks_4R3V3JGP_spreadValues({}, dialog), popover), { + return _chunks_3YLGPPWQ_spreadProps(_chunks_3YLGPPWQ_spreadValues(_chunks_3YLGPPWQ_spreadValues({}, dialog), popover), { setAnchorElement: (element) => popover.setState("anchorElement", element), setPopoverElement: (element) => popover.setState("popoverElement", element), setArrowElement: (element) => popover.setState("arrowElement", element), @@ -4743,7 +6131,7 @@ -;// CONCATENATED MODULE: ./node_modules/@ariakit/core/esm/__chunks/SOLWE6E5.js +;// ./node_modules/@ariakit/core/esm/__chunks/JTLIIJ4U.js "use client"; @@ -4754,7 +6142,7 @@ function createHovercardStore(props = {}) { var _a; const syncState = (_a = props.store) == null ? void 0 : _a.getState(); - const popover = createPopoverStore(_chunks_4R3V3JGP_spreadProps(_chunks_4R3V3JGP_spreadValues({}, props), { + const popover = createPopoverStore(_chunks_3YLGPPWQ_spreadProps(_chunks_3YLGPPWQ_spreadValues({}, props), { placement: defaultValue( props.placement, syncState == null ? void 0 : syncState.placement, @@ -4762,21 +6150,21 @@ ) })); const timeout = defaultValue(props.timeout, syncState == null ? void 0 : syncState.timeout, 500); - const initialState = _chunks_4R3V3JGP_spreadProps(_chunks_4R3V3JGP_spreadValues({}, popover.getState()), { + const initialState = _chunks_3YLGPPWQ_spreadProps(_chunks_3YLGPPWQ_spreadValues({}, popover.getState()), { timeout, showTimeout: defaultValue(props.showTimeout, syncState == null ? void 0 : syncState.showTimeout), hideTimeout: defaultValue(props.hideTimeout, syncState == null ? void 0 : syncState.hideTimeout), autoFocusOnShow: defaultValue(syncState == null ? void 0 : syncState.autoFocusOnShow, false) }); const hovercard = createStore(initialState, popover, props.store); - return _chunks_4R3V3JGP_spreadProps(_chunks_4R3V3JGP_spreadValues(_chunks_4R3V3JGP_spreadValues({}, popover), hovercard), { + return _chunks_3YLGPPWQ_spreadProps(_chunks_3YLGPPWQ_spreadValues(_chunks_3YLGPPWQ_spreadValues({}, popover), hovercard), { setAutoFocusOnShow: (value) => hovercard.setState("autoFocusOnShow", value) }); } -;// CONCATENATED MODULE: ./node_modules/@ariakit/core/esm/tooltip/tooltip-store.js +;// ./node_modules/@ariakit/core/esm/tooltip/tooltip-store.js "use client"; @@ -4789,8 +6177,9 @@ // src/tooltip/tooltip-store.ts function createTooltipStore(props = {}) { var _a; + if (false) {} const syncState = (_a = props.store) == null ? void 0 : _a.getState(); - const hovercard = createHovercardStore(_chunks_4R3V3JGP_spreadProps(_chunks_4R3V3JGP_spreadValues({}, props), { + const hovercard = createHovercardStore(_chunks_3YLGPPWQ_spreadProps(_chunks_3YLGPPWQ_spreadValues({}, props), { placement: defaultValue( props.placement, syncState == null ? void 0 : syncState.placement, @@ -4798,16 +6187,16 @@ ), hideTimeout: defaultValue(props.hideTimeout, syncState == null ? void 0 : syncState.hideTimeout, 0) })); - const initialState = _chunks_4R3V3JGP_spreadProps(_chunks_4R3V3JGP_spreadValues({}, hovercard.getState()), { + const initialState = _chunks_3YLGPPWQ_spreadProps(_chunks_3YLGPPWQ_spreadValues({}, hovercard.getState()), { type: defaultValue(props.type, syncState == null ? void 0 : syncState.type, "description"), skipTimeout: defaultValue(props.skipTimeout, syncState == null ? void 0 : syncState.skipTimeout, 300) }); const tooltip = createStore(initialState, hovercard, props.store); - return _chunks_4R3V3JGP_spreadValues(_chunks_4R3V3JGP_spreadValues({}, hovercard), tooltip); -} - - -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/2QMN5E6B.js + return _chunks_3YLGPPWQ_spreadValues(_chunks_3YLGPPWQ_spreadValues({}, hovercard), tooltip); +} + + +;// ./node_modules/@ariakit/react-core/esm/__chunks/YTDK2NGG.js "use client"; @@ -4815,24 +6204,24 @@ // src/tooltip/tooltip-store.ts function useTooltipStoreProps(store, update, props) { - store = useHovercardStoreProps(store, update, props); useStoreProps(store, props, "type"); useStoreProps(store, props, "skipTimeout"); - return store; + return useHovercardStoreProps(store, update, props); } function useTooltipStore(props = {}) { - const [store, update] = EKQEJRUF_useStore(createTooltipStore, props); + const [store, update] = YV4JVR4I_useStore(createTooltipStore, props); return useTooltipStoreProps(store, update, props); } -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/FSFPRQFR.js -"use client"; - - -// src/role/role.ts -var FSFPRQFR_elements = [ +;// ./node_modules/@ariakit/react-core/esm/__chunks/XL7CSKGW.js +"use client"; + + +// src/role/role.tsx +var XL7CSKGW_TagName = "div"; +var XL7CSKGW_elements = [ "a", "button", "details", @@ -4856,22 +6245,27 @@ "section", "select", "span", + "summary", "textarea", "ul", "svg" ]; -var FSFPRQFR_useRole = createHook((props) => { - return props; -}); -var Role = createComponent((props) => { - return _3ORBWXWF_createElement("div", props); -}); -if (false) {} +var useRole = createHook( + function useRole2(props) { + return props; + } +); +var Role = forwardRef2( + // @ts-expect-error + function Role2(props) { + return LMDWO4NN_createElement(XL7CSKGW_TagName, props); + } +); Object.assign( Role, - FSFPRQFR_elements.reduce((acc, element) => { - acc[element] = createComponent((props) => { - return _3ORBWXWF_createElement(element, props); + XL7CSKGW_elements.reduce((acc, element) => { + acc[element] = forwardRef2(function Role3(props) { + return LMDWO4NN_createElement(element, props); }); return acc; }, {}) @@ -4879,91 +6273,92 @@ -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/OAYFXAQ2.js +;// ./node_modules/@ariakit/react-core/esm/__chunks/S6EF7IVO.js "use client"; // src/disclosure/disclosure-context.tsx -var OAYFXAQ2_ctx = createStoreContext(); -var useDisclosureContext = OAYFXAQ2_ctx.useContext; -var useDisclosureScopedContext = OAYFXAQ2_ctx.useScopedContext; -var useDisclosureProviderContext = OAYFXAQ2_ctx.useProviderContext; -var DisclosureContextProvider = OAYFXAQ2_ctx.ContextProvider; -var DisclosureScopedContextProvider = OAYFXAQ2_ctx.ScopedContextProvider; - - - -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/G6BJYYBK.js +var S6EF7IVO_ctx = createStoreContext(); +var useDisclosureContext = S6EF7IVO_ctx.useContext; +var useDisclosureScopedContext = S6EF7IVO_ctx.useScopedContext; +var useDisclosureProviderContext = S6EF7IVO_ctx.useProviderContext; +var DisclosureContextProvider = S6EF7IVO_ctx.ContextProvider; +var DisclosureScopedContextProvider = S6EF7IVO_ctx.ScopedContextProvider; + + + +;// ./node_modules/@ariakit/react-core/esm/__chunks/RS7LB2H4.js "use client"; // src/dialog/dialog-context.tsx -var G6BJYYBK_ctx = createStoreContext( +var RS7LB2H4_ctx = createStoreContext( [DisclosureContextProvider], [DisclosureScopedContextProvider] ); -var useDialogContext = G6BJYYBK_ctx.useContext; -var useDialogScopedContext = G6BJYYBK_ctx.useScopedContext; -var useDialogProviderContext = G6BJYYBK_ctx.useProviderContext; -var DialogContextProvider = G6BJYYBK_ctx.ContextProvider; -var DialogScopedContextProvider = G6BJYYBK_ctx.ScopedContextProvider; +var useDialogContext = RS7LB2H4_ctx.useContext; +var useDialogScopedContext = RS7LB2H4_ctx.useScopedContext; +var useDialogProviderContext = RS7LB2H4_ctx.useProviderContext; +var DialogContextProvider = RS7LB2H4_ctx.ContextProvider; +var DialogScopedContextProvider = RS7LB2H4_ctx.ScopedContextProvider; var DialogHeadingContext = (0,external_React_.createContext)(void 0); var DialogDescriptionContext = (0,external_React_.createContext)(void 0); -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/7H5KSHHF.js +;// ./node_modules/@ariakit/react-core/esm/__chunks/MTZPJQMC.js "use client"; // src/popover/popover-context.tsx -var _7H5KSHHF_ctx = createStoreContext( +var MTZPJQMC_ctx = createStoreContext( [DialogContextProvider], [DialogScopedContextProvider] ); -var usePopoverContext = _7H5KSHHF_ctx.useContext; -var usePopoverScopedContext = _7H5KSHHF_ctx.useScopedContext; -var usePopoverProviderContext = _7H5KSHHF_ctx.useProviderContext; -var PopoverContextProvider = _7H5KSHHF_ctx.ContextProvider; -var PopoverScopedContextProvider = _7H5KSHHF_ctx.ScopedContextProvider; - - - -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/TI7CMBHW.js +var usePopoverContext = MTZPJQMC_ctx.useContext; +var usePopoverScopedContext = MTZPJQMC_ctx.useScopedContext; +var usePopoverProviderContext = MTZPJQMC_ctx.useProviderContext; +var PopoverContextProvider = MTZPJQMC_ctx.ContextProvider; +var PopoverScopedContextProvider = MTZPJQMC_ctx.ScopedContextProvider; + + + +;// ./node_modules/@ariakit/react-core/esm/__chunks/EM5CXX6A.js "use client"; // src/hovercard/hovercard-context.tsx -var TI7CMBHW_ctx = createStoreContext( +var EM5CXX6A_ctx = createStoreContext( [PopoverContextProvider], [PopoverScopedContextProvider] ); -var useHovercardContext = TI7CMBHW_ctx.useContext; -var useHovercardScopedContext = TI7CMBHW_ctx.useScopedContext; -var useHovercardProviderContext = TI7CMBHW_ctx.useProviderContext; -var HovercardContextProvider = TI7CMBHW_ctx.ContextProvider; -var HovercardScopedContextProvider = TI7CMBHW_ctx.ScopedContextProvider; - - - -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/7X4DYKYU.js -"use client"; - - - - - - -// src/hovercard/hovercard-anchor.ts - - - +var useHovercardContext = EM5CXX6A_ctx.useContext; +var useHovercardScopedContext = EM5CXX6A_ctx.useScopedContext; +var useHovercardProviderContext = EM5CXX6A_ctx.useProviderContext; +var HovercardContextProvider = EM5CXX6A_ctx.ContextProvider; +var HovercardScopedContextProvider = EM5CXX6A_ctx.ScopedContextProvider; + + + +;// ./node_modules/@ariakit/react-core/esm/__chunks/BYC7LY2E.js +"use client"; + + + + + + +// src/hovercard/hovercard-anchor.tsx + + + +var BYC7LY2E_TagName = "a"; var useHovercardAnchor = createHook( - (_a) => { + function useHovercardAnchor2(_a) { var _b = _a, { store, showOnHover = true } = _b, props = __objRest(_b, ["store", "showOnHover"]); const context = useHovercardProviderContext(); store = store || context; @@ -4976,13 +6371,10 @@ (0,external_React_.useEffect)(() => () => window.clearTimeout(showTimeoutRef.current), []); (0,external_React_.useEffect)(() => { const onMouseLeave = (event) => { - if (!store) - return; + if (!store) return; const { anchorElement } = store.getState(); - if (!anchorElement) - return; - if (event.target !== anchorElement) - return; + if (!anchorElement) return; + if (event.target !== anchorElement) return; window.clearTimeout(showTimeoutRef.current); showTimeoutRef.current = 0; }; @@ -4991,114 +6383,116 @@ const onMouseMoveProp = props.onMouseMove; const showOnHoverProp = useBooleanEvent(showOnHover); const isMouseMoving = useIsMouseMoving(); - const onMouseMove = useEvent( - (event) => { - onMouseMoveProp == null ? void 0 : onMouseMoveProp(event); - if (disabled) - return; - if (!store) - return; - if (event.defaultPrevented) - return; - if (showTimeoutRef.current) - return; - if (!isMouseMoving()) - return; - if (!showOnHoverProp(event)) - return; - const element = event.currentTarget; - store.setAnchorElement(element); - store.setDisclosureElement(element); - const { showTimeout, timeout } = store.getState(); - const showHovercard = () => { - showTimeoutRef.current = 0; - if (!isMouseMoving()) - return; - store == null ? void 0 : store.setAnchorElement(element); - store == null ? void 0 : store.show(); - queueMicrotask(() => { - store == null ? void 0 : store.setDisclosureElement(element); - }); - }; - const timeoutMs = showTimeout != null ? showTimeout : timeout; - if (timeoutMs === 0) { - showHovercard(); - } else { - showTimeoutRef.current = window.setTimeout(showHovercard, timeoutMs); - } - } - ); + const onMouseMove = useEvent((event) => { + onMouseMoveProp == null ? void 0 : onMouseMoveProp(event); + if (disabled) return; + if (!store) return; + if (event.defaultPrevented) return; + if (showTimeoutRef.current) return; + if (!isMouseMoving()) return; + if (!showOnHoverProp(event)) return; + const element = event.currentTarget; + store.setAnchorElement(element); + store.setDisclosureElement(element); + const { showTimeout, timeout } = store.getState(); + const showHovercard = () => { + showTimeoutRef.current = 0; + if (!isMouseMoving()) return; + store == null ? void 0 : store.setAnchorElement(element); + store == null ? void 0 : store.show(); + queueMicrotask(() => { + store == null ? void 0 : store.setDisclosureElement(element); + }); + }; + const timeoutMs = showTimeout != null ? showTimeout : timeout; + if (timeoutMs === 0) { + showHovercard(); + } else { + showTimeoutRef.current = window.setTimeout(showHovercard, timeoutMs); + } + }); + const onClickProp = props.onClick; + const onClick = useEvent((event) => { + onClickProp == null ? void 0 : onClickProp(event); + if (!store) return; + window.clearTimeout(showTimeoutRef.current); + showTimeoutRef.current = 0; + }); const ref = (0,external_React_.useCallback)( (element) => { - if (!store) - return; + if (!store) return; const { anchorElement } = store.getState(); - if (anchorElement == null ? void 0 : anchorElement.isConnected) - return; + if (anchorElement == null ? void 0 : anchorElement.isConnected) return; store.setAnchorElement(element); }, [store] ); - props = _4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues({}, props), { + props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, props), { ref: useMergeRefs(ref, props.ref), - onMouseMove + onMouseMove, + onClick }); props = useFocusable(props); return props; } ); -var HovercardAnchor = createComponent( - (props) => { - const htmlProps = useHovercardAnchor(props); - return _3ORBWXWF_createElement("a", htmlProps); - } -); -if (false) {} - - - -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/MNFF5YOJ.js +var HovercardAnchor = forwardRef2(function HovercardAnchor2(props) { + const htmlProps = useHovercardAnchor(props); + return LMDWO4NN_createElement(BYC7LY2E_TagName, htmlProps); +}); + + + +;// ./node_modules/@ariakit/react-core/esm/__chunks/F4IYJ42G.js "use client"; // src/tooltip/tooltip-context.tsx -var MNFF5YOJ_ctx = createStoreContext( +var F4IYJ42G_ctx = createStoreContext( [HovercardContextProvider], [HovercardScopedContextProvider] ); -var useTooltipContext = MNFF5YOJ_ctx.useContext; -var useTooltipScopedContext = MNFF5YOJ_ctx.useScopedContext; -var useTooltipProviderContext = MNFF5YOJ_ctx.useProviderContext; -var TooltipContextProvider = MNFF5YOJ_ctx.ContextProvider; -var TooltipScopedContextProvider = MNFF5YOJ_ctx.ScopedContextProvider; - - - -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/tooltip/tooltip-anchor.js -"use client"; - - - - - - - - - - - - - -// src/tooltip/tooltip-anchor.ts - - - +var useTooltipContext = F4IYJ42G_ctx.useContext; +var useTooltipScopedContext = F4IYJ42G_ctx.useScopedContext; +var useTooltipProviderContext = F4IYJ42G_ctx.useProviderContext; +var TooltipContextProvider = F4IYJ42G_ctx.ContextProvider; +var TooltipScopedContextProvider = F4IYJ42G_ctx.ScopedContextProvider; + + + +;// ./node_modules/@ariakit/react-core/esm/tooltip/tooltip-anchor.js +"use client"; + + + + + + + + + + + + + +// src/tooltip/tooltip-anchor.tsx + + + +var tooltip_anchor_TagName = "div"; var globalStore = createStore({ activeStore: null }); +function createRemoveStoreCallback(store) { + return () => { + const { activeStore } = globalStore.getState(); + if (activeStore !== store) return; + globalStore.setState("activeStore", null); + }; +} var useTooltipAnchor = createHook( - (_a) => { + function useTooltipAnchor2(_a) { var _b = _a, { store, showOnHover = true } = _b, props = __objRest(_b, ["store", "showOnHover"]); const context = useTooltipProviderContext(); store = store || context; @@ -5109,30 +6503,33 @@ const canShowOnHoverRef = (0,external_React_.useRef)(false); (0,external_React_.useEffect)(() => { return sync(store, ["mounted"], (state) => { - if (state.mounted) - return; + if (state.mounted) return; canShowOnHoverRef.current = false; }); }, [store]); (0,external_React_.useEffect)(() => { - return sync(store, ["mounted", "skipTimeout"], (state) => { - if (!store) - return; - if (state.mounted) { - const { activeStore } = globalStore.getState(); - if (activeStore !== store) { - activeStore == null ? void 0 : activeStore.hide(); + if (!store) return; + return chain( + // Immediately remove the current store from the global store when + // the component unmounts. This is useful, for example, to avoid + // showing tooltips immediately on serial tests. + createRemoveStoreCallback(store), + sync(store, ["mounted", "skipTimeout"], (state) => { + if (!store) return; + if (state.mounted) { + const { activeStore } = globalStore.getState(); + if (activeStore !== store) { + activeStore == null ? void 0 : activeStore.hide(); + } + return globalStore.setState("activeStore", store); } - return globalStore.setState("activeStore", store); - } - const id = setTimeout(() => { - const { activeStore } = globalStore.getState(); - if (activeStore !== store) - return; - globalStore.setState("activeStore", null); - }, state.skipTimeout); - return () => clearTimeout(id); - }); + const id = setTimeout( + createRemoveStoreCallback(store), + state.skipTimeout + ); + return () => clearTimeout(id); + }) + ); }, [store]); const onMouseEnterProp = props.onMouseEnter; const onMouseEnter = useEvent((event) => { @@ -5142,17 +6539,16 @@ const onFocusVisibleProp = props.onFocusVisible; const onFocusVisible = useEvent((event) => { onFocusVisibleProp == null ? void 0 : onFocusVisibleProp(event); - if (event.defaultPrevented) - return; + if (event.defaultPrevented) return; store == null ? void 0 : store.setAnchorElement(event.currentTarget); store == null ? void 0 : store.show(); }); const onBlurProp = props.onBlur; const onBlur = useEvent((event) => { onBlurProp == null ? void 0 : onBlurProp(event); - if (event.defaultPrevented) - return; + if (event.defaultPrevented) return; const { activeStore } = globalStore.getState(); + canShowOnHoverRef.current = false; if (activeStore === store) { globalStore.setState("activeStore", null); } @@ -5162,24 +6558,20 @@ var _a2; return (_a2 = state.contentElement) == null ? void 0 : _a2.id; }); - props = _4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues({ - "aria-labelledby": type === "label" ? contentId : void 0, - "aria-describedby": type === "description" ? contentId : void 0 + props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({ + "aria-labelledby": type === "label" ? contentId : void 0 }, props), { onMouseEnter, onFocusVisible, onBlur }); - props = useHovercardAnchor(_4R3V3JGP_spreadValues({ + props = useHovercardAnchor(_3YLGPPWQ_spreadValues({ store, - showOnHover: (event) => { - if (!canShowOnHoverRef.current) - return false; - if (isFalsyBooleanCallback(showOnHover, event)) - return false; + showOnHover(event) { + if (!canShowOnHoverRef.current) return false; + if (isFalsyBooleanCallback(showOnHover, event)) return false; const { activeStore } = globalStore.getState(); - if (!activeStore) - return true; + if (!activeStore) return true; store == null ? void 0 : store.show(); return false; } @@ -5187,14 +6579,13 @@ return props; } ); -var TooltipAnchor = createComponent((props) => { +var TooltipAnchor = forwardRef2(function TooltipAnchor2(props) { const htmlProps = useTooltipAnchor(props); - return _3ORBWXWF_createElement("div", htmlProps); -}); -if (false) {} - - -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/YMV43K4F.js + return LMDWO4NN_createElement(tooltip_anchor_TagName, htmlProps); +}); + + +;// ./node_modules/@ariakit/react-core/esm/__chunks/X7QOZUD3.js "use client"; // src/hovercard/utils/polygon.ts @@ -5212,8 +6603,7 @@ const where = (yi - yj) * (x - xi) - (xi - xj) * (y - yi); if (yj < yi) { if (y >= yj && y < yi) { - if (where === 0) - return true; + if (where === 0) return true; if (where > 0) { if (y === yj) { if (y > vy) { @@ -5226,8 +6616,7 @@ } } else if (yi < yj) { if (y > yi && y <= yj) { - if (where === 0) - return true; + if (where === 0) return true; if (where < 0) { if (y === yj) { if (y < vy) { @@ -5238,7 +6627,7 @@ } } } - } else if (y == yi && (x >= xj && x <= xi || x >= xi && x <= xj)) { + } else if (y === yi && (x >= xj && x <= xi || x >= xi && x <= xj)) { return true; } } @@ -5281,28 +6670,23 @@ -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/MKDDWKFK.js +;// ./node_modules/@ariakit/react-core/esm/__chunks/63XF7ACK.js "use client"; // src/dialog/utils/is-backdrop.ts -function MKDDWKFK_isBackdrop(element, ...ids) { - if (!element) - return false; +function _63XF7ACK_isBackdrop(element, ...ids) { + if (!element) return false; const backdrop = element.getAttribute("data-backdrop"); - if (backdrop == null) - return false; - if (backdrop === "") - return true; - if (backdrop === "true") - return true; - if (!ids.length) - return true; + if (backdrop == null) return false; + if (backdrop === "") return true; + if (backdrop === "true") return true; + if (!ids.length) return true; return ids.some((id) => backdrop === id); } -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/X6WIMZJE.js +;// ./node_modules/@ariakit/react-core/esm/__chunks/K2ZF5NU7.js "use client"; // src/dialog/utils/orchestrate.ts @@ -5330,8 +6714,7 @@ elementCleanups.set(key, nextCleanup); return () => { const isCurrent = elementCleanups.get(key) === nextCleanup; - if (!isCurrent) - return; + if (!isCurrent) return; cleanup(); elementCleanups.set(key, prevCleanup); }; @@ -5366,9 +6749,8 @@ return orchestrate(element, property, setup); } function assignStyle(element, style) { - if (!element) - return () => { - }; + if (!element) return () => { + }; const setup = () => { const prevStyle = element.style.cssText; Object.assign(element.style, style); @@ -5379,9 +6761,8 @@ return orchestrate(element, "style", setup); } function setCSSProperty(element, property, value) { - if (!element) - return () => { - }; + if (!element) return () => { + }; const setup = () => { const previousValue = element.style.getPropertyValue(property); element.style.setProperty(property, value); @@ -5398,7 +6779,7 @@ -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/72E5EPFF.js +;// ./node_modules/@ariakit/react-core/esm/__chunks/AOUGVQZ3.js "use client"; @@ -5410,41 +6791,32 @@ return `__ariakit-dialog-snapshot-${id}`; } function inSnapshot(id, element) { - const doc = DLOEKDPY_getDocument(element); + const doc = getDocument(element); const propertyName = getSnapshotPropertyName(id); - if (!doc.body[propertyName]) - return true; + if (!doc.body[propertyName]) return true; do { - if (element === doc.body) - return false; - if (!!element[propertyName]) - return true; - if (!element.parentElement) - return false; + if (element === doc.body) return false; + if (element[propertyName]) return true; + if (!element.parentElement) return false; element = element.parentElement; } while (true); } function isValidElement(id, element, ignoredElements) { - if (ignoreTags.includes(element.tagName)) - return false; - if (!inSnapshot(id, element)) - return false; + if (ignoreTags.includes(element.tagName)) return false; + if (!inSnapshot(id, element)) return false; return !ignoredElements.some( (enabledElement) => enabledElement && contains(element, enabledElement) ); } -function _72E5EPFF_walkTreeOutside(id, elements, callback, ancestorCallback) { +function AOUGVQZ3_walkTreeOutside(id, elements, callback, ancestorCallback) { for (let element of elements) { - if (!(element == null ? void 0 : element.isConnected)) - continue; + if (!(element == null ? void 0 : element.isConnected)) continue; const hasAncestorAlready = elements.some((maybeAncestor) => { - if (!maybeAncestor) - return false; - if (maybeAncestor === element) - return false; + if (!maybeAncestor) return false; + if (maybeAncestor === element) return false; return maybeAncestor.contains(element); }); - const doc = DLOEKDPY_getDocument(element); + const doc = getDocument(element); const originalElement = element; while (element.parentElement && element !== doc.body) { ancestorCallback == null ? void 0 : ancestorCallback(element.parentElement, originalElement); @@ -5460,21 +6832,22 @@ } } function createWalkTreeSnapshot(id, elements) { - const { body } = DLOEKDPY_getDocument(elements[0]); + const { body } = getDocument(elements[0]); const cleanups = []; const markElement = (element) => { cleanups.push(setProperty(element, getSnapshotPropertyName(id), true)); }; - _72E5EPFF_walkTreeOutside(id, elements, markElement); - return chain( - setProperty(body, getSnapshotPropertyName(id), true), - () => cleanups.forEach((fn) => fn()) - ); -} - - - -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/TL67WVI6.js + AOUGVQZ3_walkTreeOutside(id, elements, markElement); + return chain(setProperty(body, getSnapshotPropertyName(id), true), () => { + for (const cleanup of cleanups) { + cleanup(); + } + }); +} + + + +;// ./node_modules/@ariakit/react-core/esm/__chunks/2PGBN2Y4.js "use client"; @@ -5499,44 +6872,43 @@ } function isElementMarked(element, id) { const ancestorProperty = getPropertyName(id, true); - if (element[ancestorProperty]) - return true; + if (element[ancestorProperty]) return true; const elementProperty = getPropertyName(id); do { - if (element[elementProperty]) - return true; - if (!element.parentElement) - return false; + if (element[elementProperty]) return true; + if (!element.parentElement) return false; element = element.parentElement; } while (true); } function markTreeOutside(id, elements) { const cleanups = []; const ids = elements.map((el) => el == null ? void 0 : el.id); - _72E5EPFF_walkTreeOutside( + AOUGVQZ3_walkTreeOutside( id, elements, (element) => { - if (MKDDWKFK_isBackdrop(element, ...ids)) - return; + if (_63XF7ACK_isBackdrop(element, ...ids)) return; cleanups.unshift(markElement(element, id)); }, (ancestor, element) => { const isAnotherDialogAncestor = element.hasAttribute("data-dialog") && element.id !== id; - if (isAnotherDialogAncestor) - return; + if (isAnotherDialogAncestor) return; cleanups.unshift(markAncestor(ancestor, id)); } ); const restoreAccessibilityTree = () => { - cleanups.forEach((fn) => fn()); + for (const cleanup of cleanups) { + cleanup(); + } }; return restoreAccessibilityTree; } -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/CLE7NTOY.js +;// external "ReactDOM" +const external_ReactDOM_namespaceObject = window["ReactDOM"]; +;// ./node_modules/@ariakit/react-core/esm/__chunks/VGCJ63VH.js "use client"; @@ -5549,11 +6921,13 @@ + +var VGCJ63VH_TagName = "div"; function afterTimeout(timeoutMs, cb) { const timeoutId = setTimeout(cb, timeoutMs); return () => clearTimeout(timeoutId); } -function CLE7NTOY_afterPaint(cb) { +function VGCJ63VH_afterPaint(cb) { let raf = requestAnimationFrame(() => { raf = requestAnimationFrame(cb); }); @@ -5561,116 +6935,155 @@ } function parseCSSTime(...times) { return times.join(", ").split(", ").reduce((longestTime, currentTimeString) => { - const currentTime = parseFloat(currentTimeString || "0s") * 1e3; - if (currentTime > longestTime) - return currentTime; + const multiplier = currentTimeString.endsWith("ms") ? 1 : 1e3; + const currentTime = Number.parseFloat(currentTimeString || "0s") * multiplier; + if (currentTime > longestTime) return currentTime; return longestTime; }, 0); } function isHidden(mounted, hidden, alwaysVisible) { return !alwaysVisible && hidden !== false && (!mounted || !!hidden); } -var useDisclosureContent = createHook( - (_a) => { - var _b = _a, { store, alwaysVisible } = _b, props = __objRest(_b, ["store", "alwaysVisible"]); - const context = useDisclosureProviderContext(); - store = store || context; - invariant( - store, - false && 0 - ); - const id = useId(props.id); - const [transition, setTransition] = (0,external_React_.useState)(null); - const open = store.useState("open"); - const mounted = store.useState("mounted"); - const animated = store.useState("animated"); - const contentElement = store.useState("contentElement"); - useSafeLayoutEffect(() => { - if (!animated) - return; - if (!(contentElement == null ? void 0 : contentElement.isConnected)) { - setTransition(null); - return; - } - return CLE7NTOY_afterPaint(() => { - setTransition(open ? "enter" : "leave"); - }); - }, [animated, contentElement, open]); - useSafeLayoutEffect(() => { - if (!store) - return; - if (!animated) - return; - if (!contentElement) - return; - if (!transition) - return; - if (transition === "enter" && !open) - return; - if (transition === "leave" && open) - return; - if (typeof animated === "number") { - const timeoutMs2 = animated; - return afterTimeout(timeoutMs2, store.stopAnimation); - } - const { - transitionDuration, - animationDuration, - transitionDelay, - animationDelay - } = getComputedStyle(contentElement); - const delay = parseCSSTime(transitionDelay, animationDelay); - const duration = parseCSSTime(transitionDuration, animationDuration); - const timeoutMs = delay + duration; - if (!timeoutMs) - return; - return afterTimeout(timeoutMs, store.stopAnimation); - }, [store, animated, contentElement, open, transition]); - props = useWrapElement( - props, - (element) => /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(DialogScopedContextProvider, { value: store, children: element }), - [store] - ); - const hidden = isHidden(mounted, props.hidden, alwaysVisible); - const style = hidden ? _4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues({}, props.style), { display: "none" }) : props.style; - props = _4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues({ - id, - "data-enter": transition === "enter" ? "" : void 0, - "data-leave": transition === "leave" ? "" : void 0, - hidden - }, props), { - ref: useMergeRefs(id ? store.setContentElement : null, props.ref), - style - }); - return props; - } -); -var DisclosureContentImpl = createComponent( - (props) => { - const htmlProps = useDisclosureContent(props); - return _3ORBWXWF_createElement("div", htmlProps); - } -); -var DisclosureContent = createComponent( - (_a) => { - var _b = _a, { unmountOnHide } = _b, props = __objRest(_b, ["unmountOnHide"]); - const context = useDisclosureProviderContext(); - const store = props.store || context; - const mounted = useStoreState( - store, - (state) => !unmountOnHide || (state == null ? void 0 : state.mounted) - ); - if (mounted === false) - return null; - return /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(DisclosureContentImpl, _4R3V3JGP_spreadValues({}, props)); - } -); -if (false) {} - - - -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/LWHPHW7Q.js -"use client"; +var useDisclosureContent = createHook(function useDisclosureContent2(_a) { + var _b = _a, { store, alwaysVisible } = _b, props = __objRest(_b, ["store", "alwaysVisible"]); + const context = useDisclosureProviderContext(); + store = store || context; + invariant( + store, + false && 0 + ); + const ref = (0,external_React_.useRef)(null); + const id = useId(props.id); + const [transition, setTransition] = (0,external_React_.useState)(null); + const open = store.useState("open"); + const mounted = store.useState("mounted"); + const animated = store.useState("animated"); + const contentElement = store.useState("contentElement"); + const otherElement = useStoreState(store.disclosure, "contentElement"); + useSafeLayoutEffect(() => { + if (!ref.current) return; + store == null ? void 0 : store.setContentElement(ref.current); + }, [store]); + useSafeLayoutEffect(() => { + let previousAnimated; + store == null ? void 0 : store.setState("animated", (animated2) => { + previousAnimated = animated2; + return true; + }); + return () => { + if (previousAnimated === void 0) return; + store == null ? void 0 : store.setState("animated", previousAnimated); + }; + }, [store]); + useSafeLayoutEffect(() => { + if (!animated) return; + if (!(contentElement == null ? void 0 : contentElement.isConnected)) { + setTransition(null); + return; + } + return VGCJ63VH_afterPaint(() => { + setTransition(open ? "enter" : mounted ? "leave" : null); + }); + }, [animated, contentElement, open, mounted]); + useSafeLayoutEffect(() => { + if (!store) return; + if (!animated) return; + if (!transition) return; + if (!contentElement) return; + const stopAnimation = () => store == null ? void 0 : store.setState("animating", false); + const stopAnimationSync = () => (0,external_ReactDOM_namespaceObject.flushSync)(stopAnimation); + if (transition === "leave" && open) return; + if (transition === "enter" && !open) return; + if (typeof animated === "number") { + const timeout2 = animated; + return afterTimeout(timeout2, stopAnimationSync); + } + const { + transitionDuration, + animationDuration, + transitionDelay, + animationDelay + } = getComputedStyle(contentElement); + const { + transitionDuration: transitionDuration2 = "0", + animationDuration: animationDuration2 = "0", + transitionDelay: transitionDelay2 = "0", + animationDelay: animationDelay2 = "0" + } = otherElement ? getComputedStyle(otherElement) : {}; + const delay = parseCSSTime( + transitionDelay, + animationDelay, + transitionDelay2, + animationDelay2 + ); + const duration = parseCSSTime( + transitionDuration, + animationDuration, + transitionDuration2, + animationDuration2 + ); + const timeout = delay + duration; + if (!timeout) { + if (transition === "enter") { + store.setState("animated", false); + } + stopAnimation(); + return; + } + const frameRate = 1e3 / 60; + const maxTimeout = Math.max(timeout - frameRate, 0); + return afterTimeout(maxTimeout, stopAnimationSync); + }, [store, animated, contentElement, otherElement, open, transition]); + props = useWrapElement( + props, + (element) => /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(DialogScopedContextProvider, { value: store, children: element }), + [store] + ); + const hidden = isHidden(mounted, props.hidden, alwaysVisible); + const styleProp = props.style; + const style = (0,external_React_.useMemo)(() => { + if (hidden) { + return _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, styleProp), { display: "none" }); + } + return styleProp; + }, [hidden, styleProp]); + props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({ + id, + "data-open": open || void 0, + "data-enter": transition === "enter" || void 0, + "data-leave": transition === "leave" || void 0, + hidden + }, props), { + ref: useMergeRefs(id ? store.setContentElement : null, ref, props.ref), + style + }); + return removeUndefinedValues(props); +}); +var DisclosureContentImpl = forwardRef2(function DisclosureContentImpl2(props) { + const htmlProps = useDisclosureContent(props); + return LMDWO4NN_createElement(VGCJ63VH_TagName, htmlProps); +}); +var DisclosureContent = forwardRef2(function DisclosureContent2(_a) { + var _b = _a, { + unmountOnHide + } = _b, props = __objRest(_b, [ + "unmountOnHide" + ]); + const context = useDisclosureProviderContext(); + const store = props.store || context; + const mounted = useStoreState( + store, + (state) => !unmountOnHide || (state == null ? void 0 : state.mounted) + ); + if (mounted === false) return null; + return /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(DisclosureContentImpl, _3YLGPPWQ_spreadValues({}, props)); +}); + + + +;// ./node_modules/@ariakit/react-core/esm/__chunks/63FEHJZV.js +"use client"; + @@ -5684,61 +7097,67 @@ function DialogBackdrop({ store, backdrop, - backdropProps, alwaysVisible, hidden }) { const ref = (0,external_React_.useRef)(null); const disclosure = useDisclosureStore({ disclosure: store }); - const contentElement = store.useState("contentElement"); - useSafeLayoutEffect(() => { + const contentElement = useStoreState(store, "contentElement"); + (0,external_React_.useEffect)(() => { const backdrop2 = ref.current; const dialog = contentElement; - if (!backdrop2) - return; - if (!dialog) - return; + if (!backdrop2) return; + if (!dialog) return; backdrop2.style.zIndex = getComputedStyle(dialog).zIndex; }, [contentElement]); useSafeLayoutEffect(() => { const id = contentElement == null ? void 0 : contentElement.id; - if (!id) - return; + if (!id) return; const backdrop2 = ref.current; - if (!backdrop2) - return; + if (!backdrop2) return; return markAncestor(backdrop2, id); }, [contentElement]); - if (hidden != null) { - backdropProps = _4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues({}, backdropProps), { hidden }); - } - const props = useDisclosureContent(_4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues({ + const props = useDisclosureContent({ + ref, store: disclosure, role: "presentation", "data-backdrop": (contentElement == null ? void 0 : contentElement.id) || "", - alwaysVisible - }, backdropProps), { - ref: useMergeRefs(backdropProps == null ? void 0 : backdropProps.ref, ref), - style: _4R3V3JGP_spreadValues({ + alwaysVisible, + hidden: hidden != null ? hidden : void 0, + style: { position: "fixed", top: 0, right: 0, bottom: 0, left: 0 - }, backdropProps == null ? void 0 : backdropProps.style) - })); - if (!backdrop) - return null; + } + }); + if (!backdrop) return null; if ((0,external_React_.isValidElement)(backdrop)) { - return /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(Role, _4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues({}, props), { render: backdrop })); + return /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(Role, _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, props), { render: backdrop })); } const Component = typeof backdrop !== "boolean" ? backdrop : "div"; - return /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(Role, _4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues({}, props), { render: /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(Component, {}) })); -} - - - -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/BULCTPRV.js + return /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(Role, _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, props), { render: /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(Component, {}) })); +} + + + +;// ./node_modules/@ariakit/react-core/esm/__chunks/IGR4SXG2.js +"use client"; + +// src/dialog/utils/is-focus-trap.ts +function isFocusTrap(element, ...ids) { + if (!element) return false; + const attr = element.getAttribute("data-focus-trap"); + if (attr == null) return false; + if (!ids.length) return true; + if (attr === "") return false; + return ids.some((id) => attr === id); +} + + + +;// ./node_modules/@ariakit/react-core/esm/__chunks/ESSM74HH.js "use client"; @@ -5752,19 +7171,20 @@ const cleanups = []; const ids = elements.map((el) => el == null ? void 0 : el.id); walkTreeOutside(id, elements, (element) => { - if (isBackdrop(element, ...ids)) - return; + if (isBackdrop(element, ...ids)) return; cleanups.unshift(hideElementFromAccessibilityTree(element)); }); const restoreAccessibilityTree = () => { - cleanups.forEach((fn) => fn()); + for (const cleanup of cleanups) { + cleanup(); + } }; return restoreAccessibilityTree; } -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/677M2CI3.js +;// ./node_modules/@ariakit/react-core/esm/__chunks/677M2CI3.js "use client"; // src/dialog/utils/supports-inert.ts @@ -5774,8 +7194,9 @@ -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/TQYOGOE2.js -"use client"; +;// ./node_modules/@ariakit/react-core/esm/__chunks/KZAQFFOU.js +"use client"; + @@ -5787,16 +7208,20 @@ function disableTree(element, ignoredElements) { - if (!("style" in element)) - return noop; + if (!("style" in element)) return noop; if (supportsInert()) { return setProperty(element, "inert", true); } const tabbableElements = getAllTabbableIn(element, true); const enableElements = tabbableElements.map((element2) => { - if (ignoredElements == null ? void 0 : ignoredElements.some((el) => el && contains(el, element2))) - return noop; - return setAttribute(element2, "tabindex", "-1"); + if (ignoredElements == null ? void 0 : ignoredElements.some((el) => el && contains(el, element2))) return noop; + const restoreFocusMethod = orchestrate(element2, "focus", () => { + element2.focus = noop; + return () => { + delete element2.focus; + }; + }); + return chain(setAttribute(element2, "tabindex", "-1"), restoreFocusMethod); }); return chain( ...enableElements, @@ -5811,22 +7236,31 @@ function disableTreeOutside(id, elements) { const cleanups = []; const ids = elements.map((el) => el == null ? void 0 : el.id); - _72E5EPFF_walkTreeOutside(id, elements, (element) => { - if (MKDDWKFK_isBackdrop(element, ...ids)) - return; - cleanups.unshift(disableTree(element, elements)); - }); + AOUGVQZ3_walkTreeOutside( + id, + elements, + (element) => { + if (_63XF7ACK_isBackdrop(element, ...ids)) return; + if (isFocusTrap(element, ...ids)) return; + cleanups.unshift(disableTree(element, elements)); + }, + (element) => { + if (!element.hasAttribute("role")) return; + if (elements.some((el) => el && contains(el, element))) return; + cleanups.unshift(setAttribute(element, "role", "none")); + } + ); const restoreTreeOutside = () => { - cleanups.forEach((fn) => fn()); + for (const cleanup of cleanups) { + cleanup(); + } }; return restoreTreeOutside; } -;// CONCATENATED MODULE: external "ReactDOM" -const external_ReactDOM_namespaceObject = window["ReactDOM"]; -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/CS347UVZ.js +;// ./node_modules/@ariakit/react-core/esm/__chunks/YKJECYU7.js "use client"; @@ -5842,22 +7276,17 @@ }) { const [updated, retry] = useForceUpdate(); const isRootDialog = (0,external_React_.useCallback)(() => { - if (!enabled) - return false; - if (!contentElement) - return false; - const { body } = DLOEKDPY_getDocument(contentElement); + if (!enabled) return false; + if (!contentElement) return false; + const { body } = getDocument(contentElement); const id = body.getAttribute(attribute); return !id || id === contentId; }, [updated, enabled, contentElement, attribute, contentId]); (0,external_React_.useEffect)(() => { - if (!enabled) - return; - if (!contentId) - return; - if (!contentElement) - return; - const { body } = DLOEKDPY_getDocument(contentElement); + if (!enabled) return; + if (!contentId) return; + if (!contentElement) return; + const { body } = getDocument(contentElement); if (isRootDialog()) { body.setAttribute(attribute, contentId); return () => body.removeAttribute(attribute); @@ -5871,7 +7300,7 @@ -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/6BJGLK2C.js +;// ./node_modules/@ariakit/react-core/esm/__chunks/BGQ3KQ5M.js "use client"; @@ -5894,15 +7323,13 @@ enabled }); (0,external_React_.useEffect)(() => { - if (!isRootDialog()) - return; - if (!contentElement) - return; - const doc = DLOEKDPY_getDocument(contentElement); + if (!isRootDialog()) return; + if (!contentElement) return; + const doc = getDocument(contentElement); const win = getWindow(contentElement); const { documentElement, body } = doc; const cssScrollbarWidth = documentElement.style.getPropertyValue("--scrollbar-width"); - const scrollbarWidth = cssScrollbarWidth ? parseInt(cssScrollbarWidth) : win.innerWidth - documentElement.clientWidth; + const scrollbarWidth = cssScrollbarWidth ? Number.parseInt(cssScrollbarWidth) : win.innerWidth - documentElement.clientWidth; const setScrollbarWidthProperty = () => setCSSProperty( documentElement, "--scrollbar-width", @@ -5929,7 +7356,7 @@ return () => { restoreStyle(); if (true) { - win.scrollTo(scrollX, scrollY); + win.scrollTo({ left: scrollX, top: scrollY, behavior: "instant" }); } }; }; @@ -5943,7 +7370,7 @@ -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/IUB2BTEK.js +;// ./node_modules/@ariakit/react-core/esm/__chunks/TOU75OXH.js "use client"; @@ -5969,10 +7396,8 @@ useSafeLayoutEffect(() => { return sync(store, ["open", "contentElement"], (state) => { var _a; - if (!state.open) - return; - if (!state.contentElement) - return; + if (!state.open) return; + if (!state.contentElement) return; return (_a = context.add) == null ? void 0 : _a.call(context, store); }); }, [store, context]); @@ -5986,7 +7411,7 @@ -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/OOBDFMJL.js +;// ./node_modules/@ariakit/react-core/esm/__chunks/HLTQOHKZ.js "use client"; // src/dialog/utils/use-previous-mouse-down-ref.ts @@ -6009,8 +7434,10 @@ -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/XHJGS6Z5.js -"use client"; +;// ./node_modules/@ariakit/react-core/esm/__chunks/WBDYNH73.js +"use client"; + + @@ -6021,18 +7448,15 @@ function isInDocument(target) { - if (target.tagName === "HTML") - return true; - return contains(DLOEKDPY_getDocument(target).body, target); + if (target.tagName === "HTML") return true; + return contains(getDocument(target).body, target); } function isDisclosure(disclosure, target) { - if (!disclosure) - return false; - if (contains(disclosure, target)) - return true; + if (!disclosure) return false; + if (contains(disclosure, target)) return true; const activeId = target.getAttribute("aria-activedescendant"); if (activeId) { - const activeElement = DLOEKDPY_getDocument(disclosure).getElementById(activeId); + const activeElement = getDocument(disclosure).getElementById(activeId); if (activeElement) { return contains(disclosure, activeElement); } @@ -6040,11 +7464,9 @@ return false; } function isMouseEventOnDialog(event, dialog) { - if (!("clientY" in event)) - return false; + if (!("clientY" in event)) return false; const rect = dialog.getBoundingClientRect(); - if (rect.width === 0 || rect.height === 0) - return false; + if (rect.width === 0 || rect.height === 0) return false; return rect.top <= event.clientY && event.clientY <= rect.top + rect.height && rect.left <= event.clientX && event.clientX <= rect.left + rect.width; } function useEventOutside({ @@ -6055,16 +7477,13 @@ domReady }) { const callListener = useEvent(listener); - const open = store.useState("open"); + const open = useStoreState(store, "open"); const focusedRef = (0,external_React_.useRef)(false); useSafeLayoutEffect(() => { - if (!open) - return; - if (!domReady) - return; + if (!open) return; + if (!domReady) return; const { contentElement } = store.getState(); - if (!contentElement) - return; + if (!contentElement) return; const onFocus = () => { focusedRef.current = true; }; @@ -6072,28 +7491,20 @@ return () => contentElement.removeEventListener("focusin", onFocus, true); }, [store, open, domReady]); (0,external_React_.useEffect)(() => { - if (!open) - return; + if (!open) return; const onEvent = (event) => { const { contentElement, disclosureElement } = store.getState(); const target = event.target; - if (!contentElement) - return; - if (!target) - return; - if (!isInDocument(target)) - return; - if (contains(contentElement, target)) - return; - if (isDisclosure(disclosureElement, target)) - return; - if (target.hasAttribute("data-focus-trap")) - return; - if (isMouseEventOnDialog(event, contentElement)) - return; + if (!contentElement) return; + if (!target) return; + if (!isInDocument(target)) return; + if (contains(contentElement, target)) return; + if (isDisclosure(disclosureElement, target)) return; + if (target.hasAttribute("data-focus-trap")) return; + if (isMouseEventOnDialog(event, contentElement)) return; const focused = focusedRef.current; - if (focused && !isElementMarked(target, contentElement.id)) - return; + if (focused && !isElementMarked(target, contentElement.id)) return; + if (isSafariFocusAncestor(target)) return; callListener(event); }; return addGlobalEventListener(type, onEvent, capture); @@ -6106,43 +7517,35 @@ return !!hideOnInteractOutside; } function useHideOnInteractOutside(store, hideOnInteractOutside, domReady) { - const open = store.useState("open"); + const open = useStoreState(store, "open"); const previousMouseDownRef = usePreviousMouseDownRef(open); const props = { store, domReady, capture: true }; - useEventOutside(_4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues({}, props), { + useEventOutside(_3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, props), { type: "click", listener: (event) => { const { contentElement } = store.getState(); const previousMouseDown = previousMouseDownRef.current; - if (!previousMouseDown) - return; - if (!isVisible(previousMouseDown)) - return; - if (!isElementMarked(previousMouseDown, contentElement == null ? void 0 : contentElement.id)) - return; - if (!shouldHideOnInteractOutside(hideOnInteractOutside, event)) - return; + if (!previousMouseDown) return; + if (!isVisible(previousMouseDown)) return; + if (!isElementMarked(previousMouseDown, contentElement == null ? void 0 : contentElement.id)) return; + if (!shouldHideOnInteractOutside(hideOnInteractOutside, event)) return; store.hide(); } })); - useEventOutside(_4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues({}, props), { + useEventOutside(_3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, props), { type: "focusin", listener: (event) => { const { contentElement } = store.getState(); - if (!contentElement) - return; - if (event.target === DLOEKDPY_getDocument(contentElement)) - return; - if (!shouldHideOnInteractOutside(hideOnInteractOutside, event)) - return; + if (!contentElement) return; + if (event.target === getDocument(contentElement)) return; + if (!shouldHideOnInteractOutside(hideOnInteractOutside, event)) return; store.hide(); } })); - useEventOutside(_4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues({}, props), { + useEventOutside(_3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, props), { type: "contextmenu", listener: (event) => { - if (!shouldHideOnInteractOutside(hideOnInteractOutside, event)) - return; + if (!shouldHideOnInteractOutside(hideOnInteractOutside, event)) return; store.hide(); } })); @@ -6150,13 +7553,13 @@ -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/6GXEOXGT.js +;// ./node_modules/@ariakit/react-core/esm/__chunks/6GXEOXGT.js "use client"; // src/dialog/utils/prepend-hidden-dismiss.ts function prependHiddenDismiss(container, onClick) { - const document = DLOEKDPY_getDocument(container); + const document = getDocument(container); const button = document.createElement("button"); button.type = "button"; button.tabIndex = -1; @@ -6183,7 +7586,7 @@ -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/HPP6CWMY.js +;// ./node_modules/@ariakit/react-core/esm/__chunks/ZWYATQFU.js "use client"; @@ -6192,37 +7595,33 @@ // src/focusable/focusable-container.tsx -var useFocusableContainer = createHook( - (_a) => { - var _b = _a, { autoFocusOnShow = true } = _b, props = __objRest(_b, ["autoFocusOnShow"]); - props = useWrapElement( - props, - (element) => /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(FocusableContext.Provider, { value: autoFocusOnShow, children: element }), - [autoFocusOnShow] - ); - return props; - } -); -var FocusableContainer = createComponent( - (props) => { - const htmlProps = useFocusableContainer(props); - return _3ORBWXWF_createElement("div", htmlProps); - } -); -if (false) {} - - - -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/XPF5GU3Q.js -"use client"; - -// src/heading/heading-context.ts +var ZWYATQFU_TagName = "div"; +var useFocusableContainer = createHook(function useFocusableContainer2(_a) { + var _b = _a, { autoFocusOnShow = true } = _b, props = __objRest(_b, ["autoFocusOnShow"]); + props = useWrapElement( + props, + (element) => /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(FocusableContext.Provider, { value: autoFocusOnShow, children: element }), + [autoFocusOnShow] + ); + return props; +}); +var FocusableContainer = forwardRef2(function FocusableContainer2(props) { + const htmlProps = useFocusableContainer(props); + return LMDWO4NN_createElement(ZWYATQFU_TagName, htmlProps); +}); + + + +;// ./node_modules/@ariakit/react-core/esm/__chunks/CZ4GFWYL.js +"use client"; + +// src/heading/heading-context.tsx var HeadingContext = (0,external_React_.createContext)(0); -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/UYRJLDVS.js +;// ./node_modules/@ariakit/react-core/esm/__chunks/5M6RIVE2.js "use client"; @@ -6240,79 +7639,81 @@ -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/BG6HZDS7.js -"use client"; - - - -// src/visually-hidden/visually-hidden.ts -var useVisuallyHidden = createHook((props) => { - props = _4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues({}, props), { - style: _4R3V3JGP_spreadValues({ - border: 0, - clip: "rect(0 0 0 0)", - height: "1px", - margin: "-1px", - overflow: "hidden", - padding: 0, - position: "absolute", - whiteSpace: "nowrap", - width: "1px" - }, props.style) - }); - return props; -}); -var VisuallyHidden = createComponent( - (props) => { - const htmlProps = useVisuallyHidden(props); - return _3ORBWXWF_createElement("span", htmlProps); - } -); -if (false) {} - - - -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/CHKJ74UC.js -"use client"; - - - - -// src/focus-trap/focus-trap.ts -var useFocusTrap = createHook((props) => { - props = _4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues({ - "data-focus-trap": "", - tabIndex: 0, - "aria-hidden": true - }, props), { - style: _4R3V3JGP_spreadValues({ - // Prevents unintended scroll jumps. - position: "fixed", - top: 0, - left: 0 - }, props.style) - }); - props = useVisuallyHidden(props); - return props; -}); -var FocusTrap = createComponent((props) => { +;// ./node_modules/@ariakit/react-core/esm/__chunks/XX67R432.js +"use client"; + + + +// src/visually-hidden/visually-hidden.tsx +var XX67R432_TagName = "span"; +var useVisuallyHidden = createHook( + function useVisuallyHidden2(props) { + props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, props), { + style: _3YLGPPWQ_spreadValues({ + border: 0, + clip: "rect(0 0 0 0)", + height: "1px", + margin: "-1px", + overflow: "hidden", + padding: 0, + position: "absolute", + whiteSpace: "nowrap", + width: "1px" + }, props.style) + }); + return props; + } +); +var VisuallyHidden = forwardRef2(function VisuallyHidden2(props) { + const htmlProps = useVisuallyHidden(props); + return LMDWO4NN_createElement(XX67R432_TagName, htmlProps); +}); + + + +;// ./node_modules/@ariakit/react-core/esm/__chunks/W3VI7GFU.js +"use client"; + + + + +// src/focus-trap/focus-trap.tsx +var W3VI7GFU_TagName = "span"; +var useFocusTrap = createHook( + function useFocusTrap2(props) { + props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({ + "data-focus-trap": "", + tabIndex: 0, + "aria-hidden": true + }, props), { + style: _3YLGPPWQ_spreadValues({ + // Prevents unintended scroll jumps. + position: "fixed", + top: 0, + left: 0 + }, props.style) + }); + props = useVisuallyHidden(props); + return props; + } +); +var FocusTrap = forwardRef2(function FocusTrap2(props) { const htmlProps = useFocusTrap(props); - return _3ORBWXWF_createElement("span", htmlProps); -}); -if (false) {} - - - -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/7452U3HH.js -"use client"; - -// src/portal/portal-context.ts + return LMDWO4NN_createElement(W3VI7GFU_TagName, htmlProps); +}); + + + +;// ./node_modules/@ariakit/react-core/esm/__chunks/AOQQTIBO.js +"use client"; + +// src/portal/portal-context.tsx var PortalContext = (0,external_React_.createContext)(null); -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/JPXNJYSO.js +;// ./node_modules/@ariakit/react-core/esm/__chunks/O37CNYMR.js "use client"; @@ -6328,12 +7729,13 @@ +var O37CNYMR_TagName = "div"; function getRootElement(element) { - return DLOEKDPY_getDocument(element).body; + return getDocument(element).body; } function getPortalElement(element, portalElement) { if (!portalElement) { - return DLOEKDPY_getDocument(element).createElement("div"); + return getDocument(element).createElement("div"); } if (typeof portalElement === "function") { return portalElement(element); @@ -6341,238 +7743,229 @@ return portalElement; } function getRandomId(prefix = "id") { - return `${prefix ? `${prefix}-` : ""}${Math.random().toString(36).substr(2, 6)}`; + return `${prefix ? `${prefix}-` : ""}${Math.random().toString(36).slice(2, 8)}`; } function queueFocus(element) { queueMicrotask(() => { element == null ? void 0 : element.focus(); }); } -var usePortal = createHook( - (_a) => { - var _b = _a, { - preserveTabOrder, - preserveTabOrderAnchor, - portalElement, - portalRef, - portal = true - } = _b, props = __objRest(_b, [ - "preserveTabOrder", - "preserveTabOrderAnchor", - "portalElement", - "portalRef", - "portal" - ]); - const ref = (0,external_React_.useRef)(null); - const refProp = useMergeRefs(ref, props.ref); - const context = (0,external_React_.useContext)(PortalContext); - const [portalNode, setPortalNode] = (0,external_React_.useState)(null); - const [anchorPortalNode, setAnchorPortalNode] = (0,external_React_.useState)(null); - const outerBeforeRef = (0,external_React_.useRef)(null); - const innerBeforeRef = (0,external_React_.useRef)(null); - const innerAfterRef = (0,external_React_.useRef)(null); - const outerAfterRef = (0,external_React_.useRef)(null); - useSafeLayoutEffect(() => { - const element = ref.current; - if (!element || !portal) { - setPortalNode(null); - return; - } - const portalEl = getPortalElement(element, portalElement); - if (!portalEl) { - setPortalNode(null); - return; - } - const isPortalInDocument = portalEl.isConnected; - if (!isPortalInDocument) { - const rootElement = context || getRootElement(element); - rootElement.appendChild(portalEl); - } - if (!portalEl.id) { - portalEl.id = element.id ? `portal/${element.id}` : getRandomId(); - } - setPortalNode(portalEl); - setRef(portalRef, portalEl); - if (isPortalInDocument) - return; - return () => { - portalEl.remove(); - setRef(portalRef, null); - }; - }, [portal, portalElement, context, portalRef]); - useSafeLayoutEffect(() => { - if (!preserveTabOrder) - return; - if (!preserveTabOrderAnchor) - return; - const doc = DLOEKDPY_getDocument(preserveTabOrderAnchor); - const element = doc.createElement("span"); - element.style.position = "fixed"; - preserveTabOrderAnchor.insertAdjacentElement("afterend", element); - setAnchorPortalNode(element); - return () => { - element.remove(); - setAnchorPortalNode(null); - }; - }, [preserveTabOrder, preserveTabOrderAnchor]); - (0,external_React_.useEffect)(() => { - if (!portalNode) - return; - if (!preserveTabOrder) - return; - let raf = 0; - const onFocus = (event) => { - if (!isFocusEventOutside(event)) - return; - const focusing = event.type === "focusin"; - cancelAnimationFrame(raf); - if (focusing) { - return restoreFocusIn(portalNode); - } - raf = requestAnimationFrame(() => { - disableFocusIn(portalNode, true); - }); - }; - portalNode.addEventListener("focusin", onFocus, true); - portalNode.addEventListener("focusout", onFocus, true); - return () => { - cancelAnimationFrame(raf); - portalNode.removeEventListener("focusin", onFocus, true); - portalNode.removeEventListener("focusout", onFocus, true); - }; - }, [portalNode, preserveTabOrder]); - props = useWrapElement( - props, - (element) => { - element = // While the portal node is not in the DOM, we need to pass the - // current context to the portal context, otherwise it's going to - // reset to the body element on nested portals. - /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(PortalContext.Provider, { value: portalNode || context, children: element }); - if (!portal) - return element; - if (!portalNode) { - return /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)( - "span", - { - ref: refProp, - id: props.id, - style: { position: "fixed" }, - hidden: true - } - ); - } - element = /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { children: [ - preserveTabOrder && portalNode && /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)( - FocusTrap, - { - ref: innerBeforeRef, - className: "__focus-trap-inner-before", - onFocus: (event) => { - if (isFocusEventOutside(event, portalNode)) { - queueFocus(getNextTabbable()); - } else { - queueFocus(outerBeforeRef.current); - } +var usePortal = createHook(function usePortal2(_a) { + var _b = _a, { + preserveTabOrder, + preserveTabOrderAnchor, + portalElement, + portalRef, + portal = true + } = _b, props = __objRest(_b, [ + "preserveTabOrder", + "preserveTabOrderAnchor", + "portalElement", + "portalRef", + "portal" + ]); + const ref = (0,external_React_.useRef)(null); + const refProp = useMergeRefs(ref, props.ref); + const context = (0,external_React_.useContext)(PortalContext); + const [portalNode, setPortalNode] = (0,external_React_.useState)(null); + const [anchorPortalNode, setAnchorPortalNode] = (0,external_React_.useState)( + null + ); + const outerBeforeRef = (0,external_React_.useRef)(null); + const innerBeforeRef = (0,external_React_.useRef)(null); + const innerAfterRef = (0,external_React_.useRef)(null); + const outerAfterRef = (0,external_React_.useRef)(null); + useSafeLayoutEffect(() => { + const element = ref.current; + if (!element || !portal) { + setPortalNode(null); + return; + } + const portalEl = getPortalElement(element, portalElement); + if (!portalEl) { + setPortalNode(null); + return; + } + const isPortalInDocument = portalEl.isConnected; + if (!isPortalInDocument) { + const rootElement = context || getRootElement(element); + rootElement.appendChild(portalEl); + } + if (!portalEl.id) { + portalEl.id = element.id ? `portal/${element.id}` : getRandomId(); + } + setPortalNode(portalEl); + setRef(portalRef, portalEl); + if (isPortalInDocument) return; + return () => { + portalEl.remove(); + setRef(portalRef, null); + }; + }, [portal, portalElement, context, portalRef]); + useSafeLayoutEffect(() => { + if (!portal) return; + if (!preserveTabOrder) return; + if (!preserveTabOrderAnchor) return; + const doc = getDocument(preserveTabOrderAnchor); + const element = doc.createElement("span"); + element.style.position = "fixed"; + preserveTabOrderAnchor.insertAdjacentElement("afterend", element); + setAnchorPortalNode(element); + return () => { + element.remove(); + setAnchorPortalNode(null); + }; + }, [portal, preserveTabOrder, preserveTabOrderAnchor]); + (0,external_React_.useEffect)(() => { + if (!portalNode) return; + if (!preserveTabOrder) return; + let raf = 0; + const onFocus = (event) => { + if (!isFocusEventOutside(event)) return; + const focusing = event.type === "focusin"; + cancelAnimationFrame(raf); + if (focusing) { + return restoreFocusIn(portalNode); + } + raf = requestAnimationFrame(() => { + disableFocusIn(portalNode, true); + }); + }; + portalNode.addEventListener("focusin", onFocus, true); + portalNode.addEventListener("focusout", onFocus, true); + return () => { + cancelAnimationFrame(raf); + portalNode.removeEventListener("focusin", onFocus, true); + portalNode.removeEventListener("focusout", onFocus, true); + }; + }, [portalNode, preserveTabOrder]); + props = useWrapElement( + props, + (element) => { + element = // While the portal node is not in the DOM, we need to pass the + // current context to the portal context, otherwise it's going to + // reset to the body element on nested portals. + /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(PortalContext.Provider, { value: portalNode || context, children: element }); + if (!portal) return element; + if (!portalNode) { + return /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)( + "span", + { + ref: refProp, + id: props.id, + style: { position: "fixed" }, + hidden: true + } + ); + } + element = /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { children: [ + preserveTabOrder && portalNode && /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)( + FocusTrap, + { + ref: innerBeforeRef, + "data-focus-trap": props.id, + className: "__focus-trap-inner-before", + onFocus: (event) => { + if (isFocusEventOutside(event, portalNode)) { + queueFocus(getNextTabbable()); + } else { + queueFocus(outerBeforeRef.current); } } - ), - element, - preserveTabOrder && portalNode && /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)( - FocusTrap, - { - ref: innerAfterRef, - className: "__focus-trap-inner-after", - onFocus: (event) => { - if (isFocusEventOutside(event, portalNode)) { - queueFocus(getPreviousTabbable()); - } else { - queueFocus(outerAfterRef.current); - } + } + ), + element, + preserveTabOrder && portalNode && /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)( + FocusTrap, + { + ref: innerAfterRef, + "data-focus-trap": props.id, + className: "__focus-trap-inner-after", + onFocus: (event) => { + if (isFocusEventOutside(event, portalNode)) { + queueFocus(getPreviousTabbable()); + } else { + queueFocus(outerAfterRef.current); } } - ) - ] }); - if (portalNode) { - element = (0,external_ReactDOM_namespaceObject.createPortal)(element, portalNode); - } - let preserveTabOrderElement = /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { children: [ - preserveTabOrder && portalNode && /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)( - FocusTrap, - { - ref: outerBeforeRef, - className: "__focus-trap-outer-before", - onFocus: (event) => { - const fromOuter = event.relatedTarget === outerAfterRef.current; - if (!fromOuter && isFocusEventOutside(event, portalNode)) { - queueFocus(innerBeforeRef.current); - } else { - queueFocus(getPreviousTabbable()); - } + } + ) + ] }); + if (portalNode) { + element = (0,external_ReactDOM_namespaceObject.createPortal)(element, portalNode); + } + let preserveTabOrderElement = /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { children: [ + preserveTabOrder && portalNode && /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)( + FocusTrap, + { + ref: outerBeforeRef, + "data-focus-trap": props.id, + className: "__focus-trap-outer-before", + onFocus: (event) => { + const fromOuter = event.relatedTarget === outerAfterRef.current; + if (!fromOuter && isFocusEventOutside(event, portalNode)) { + queueFocus(innerBeforeRef.current); + } else { + queueFocus(getPreviousTabbable()); } } - ), - preserveTabOrder && // We're using position: fixed here so that the browser doesn't - // add margin to the element when setting gap on a parent element. - /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)("span", { "aria-owns": portalNode == null ? void 0 : portalNode.id, style: { position: "fixed" } }), - preserveTabOrder && portalNode && /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)( - FocusTrap, - { - ref: outerAfterRef, - className: "__focus-trap-outer-after", - onFocus: (event) => { - if (isFocusEventOutside(event, portalNode)) { - queueFocus(innerAfterRef.current); - } else { - const nextTabbable = getNextTabbable(); - if (nextTabbable === innerBeforeRef.current) { - requestAnimationFrame(() => { - var _a2; - return (_a2 = getNextTabbable()) == null ? void 0 : _a2.focus(); - }); - return; - } - queueFocus(nextTabbable); - } + } + ), + preserveTabOrder && // We're using position: fixed here so that the browser doesn't + // add margin to the element when setting gap on a parent element. + /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)("span", { "aria-owns": portalNode == null ? void 0 : portalNode.id, style: { position: "fixed" } }), + preserveTabOrder && portalNode && /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)( + FocusTrap, + { + ref: outerAfterRef, + "data-focus-trap": props.id, + className: "__focus-trap-outer-after", + onFocus: (event) => { + if (isFocusEventOutside(event, portalNode)) { + queueFocus(innerAfterRef.current); + } else { + const nextTabbable = getNextTabbable(); + if (nextTabbable === innerBeforeRef.current) { + requestAnimationFrame(() => { + var _a2; + return (_a2 = getNextTabbable()) == null ? void 0 : _a2.focus(); + }); + return; + } + queueFocus(nextTabbable); } } - ) - ] }); - if (anchorPortalNode && preserveTabOrder) { - preserveTabOrderElement = (0,external_ReactDOM_namespaceObject.createPortal)( - preserveTabOrderElement, - anchorPortalNode - ); - } - return /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { children: [ + } + ) + ] }); + if (anchorPortalNode && preserveTabOrder) { + preserveTabOrderElement = (0,external_ReactDOM_namespaceObject.createPortal)( preserveTabOrderElement, - element - ] }); - }, - [ - portalNode, - context, - portal, - props.id, - preserveTabOrder, - anchorPortalNode - ] - ); - props = _4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues({}, props), { - ref: refProp - }); - return props; - } -); -var Portal = createComponent((props) => { + anchorPortalNode + ); + } + return /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { children: [ + preserveTabOrderElement, + element + ] }); + }, + [portalNode, context, portal, props.id, preserveTabOrder, anchorPortalNode] + ); + props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, props), { + ref: refProp + }); + return props; +}); +var Portal = forwardRef2(function Portal2(props) { const htmlProps = usePortal(props); - return _3ORBWXWF_createElement("div", htmlProps); -}); -if (false) {} - - - -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/NERBASET.js -"use client"; + return LMDWO4NN_createElement(O37CNYMR_TagName, htmlProps); +}); + + + +;// ./node_modules/@ariakit/react-core/esm/__chunks/JC64G2H7.js +"use client"; + @@ -6601,436 +7994,401 @@ -var NERBASET_isSafariBrowser = isSafari(); +var JC64G2H7_TagName = "div"; +var JC64G2H7_isSafariBrowser = isSafari(); function isAlreadyFocusingAnotherElement(dialog) { const activeElement = getActiveElement(); - if (!activeElement) - return false; - if (dialog && contains(dialog, activeElement)) - return false; - if (isFocusable(activeElement)) - return true; + if (!activeElement) return false; + if (dialog && contains(dialog, activeElement)) return false; + if (isFocusable(activeElement)) return true; return false; } function getElementFromProp(prop, focusable = false) { - if (!prop) - return null; + if (!prop) return null; const element = "current" in prop ? prop.current : prop; - if (!element) - return null; - if (focusable) - return isFocusable(element) ? element : null; + if (!element) return null; + if (focusable) return isFocusable(element) ? element : null; return element; } -var useDialog = createHook( - (_a) => { - var _b = _a, { - store: storeProp, - open: openProp, - onClose, - focusable = true, - modal = true, - portal = !!modal, - backdrop = !!modal, - backdropProps, - hideOnEscape = true, - hideOnInteractOutside = true, - getPersistentElements, - preventBodyScroll = !!modal, - autoFocusOnShow = true, - autoFocusOnHide = true, - initialFocus, - finalFocus, - unmountOnHide - } = _b, props = __objRest(_b, [ - "store", - "open", - "onClose", - "focusable", - "modal", - "portal", - "backdrop", - "backdropProps", - "hideOnEscape", - "hideOnInteractOutside", - "getPersistentElements", - "preventBodyScroll", - "autoFocusOnShow", - "autoFocusOnHide", - "initialFocus", - "finalFocus", - "unmountOnHide" - ]); - const context = useDialogProviderContext(); - const ref = (0,external_React_.useRef)(null); - const store = useDialogStore({ - store: storeProp || context, - open: openProp, - setOpen(open2) { - if (open2) - return; - const dialog = ref.current; - if (!dialog) - return; - const event = new Event("close", { bubbles: false, cancelable: true }); - if (onClose) { - dialog.addEventListener("close", onClose, { once: true }); - } - dialog.dispatchEvent(event); - if (!event.defaultPrevented) - return; - store.setOpen(true); - } - }); - const { portalRef, domReady } = usePortalRef(portal, props.portalRef); - const preserveTabOrderProp = props.preserveTabOrder; - const preserveTabOrder = store.useState( - (state) => preserveTabOrderProp && !modal && state.mounted - ); - const id = useId(props.id); - const open = store.useState("open"); - const mounted = store.useState("mounted"); - const contentElement = store.useState("contentElement"); - const hidden = isHidden(mounted, props.hidden, props.alwaysVisible); - usePreventBodyScroll(contentElement, id, preventBodyScroll && !hidden); - useHideOnInteractOutside(store, hideOnInteractOutside, domReady); - const { wrapElement, nestedDialogs } = useNestedDialogs(store); - props = useWrapElement(props, wrapElement, [wrapElement]); - if (false) {} - useSafeLayoutEffect(() => { - if (!open) - return; +var useDialog = createHook(function useDialog2(_a) { + var _b = _a, { + store: storeProp, + open: openProp, + onClose, + focusable = true, + modal = true, + portal = !!modal, + backdrop = !!modal, + hideOnEscape = true, + hideOnInteractOutside = true, + getPersistentElements, + preventBodyScroll = !!modal, + autoFocusOnShow = true, + autoFocusOnHide = true, + initialFocus, + finalFocus, + unmountOnHide, + unstable_treeSnapshotKey + } = _b, props = __objRest(_b, [ + "store", + "open", + "onClose", + "focusable", + "modal", + "portal", + "backdrop", + "hideOnEscape", + "hideOnInteractOutside", + "getPersistentElements", + "preventBodyScroll", + "autoFocusOnShow", + "autoFocusOnHide", + "initialFocus", + "finalFocus", + "unmountOnHide", + "unstable_treeSnapshotKey" + ]); + const context = useDialogProviderContext(); + const ref = (0,external_React_.useRef)(null); + const store = useDialogStore({ + store: storeProp || context, + open: openProp, + setOpen(open2) { + if (open2) return; const dialog = ref.current; - const activeElement = getActiveElement(dialog, true); - if (!activeElement) - return; - if (activeElement.tagName === "BODY") - return; - if (dialog && contains(dialog, activeElement)) - return; - store.setDisclosureElement(activeElement); - }, [store, open]); - if (NERBASET_isSafariBrowser) { - (0,external_React_.useEffect)(() => { - if (!mounted) - return; - const { disclosureElement } = store.getState(); - if (!disclosureElement) - return; - if (!isButton(disclosureElement)) - return; - const onMouseDown = () => { - let receivedFocus = false; - const onFocus = () => { - receivedFocus = true; - }; - const options = { capture: true, once: true }; - disclosureElement.addEventListener("focusin", onFocus, options); - queueBeforeEvent(disclosureElement, "mouseup", () => { - disclosureElement.removeEventListener("focusin", onFocus, true); - if (receivedFocus) - return; - focusIfNeeded(disclosureElement); - }); - }; - disclosureElement.addEventListener("mousedown", onMouseDown); - return () => { - disclosureElement.removeEventListener("mousedown", onMouseDown); - }; - }, [store, mounted]); - } + if (!dialog) return; + const event = new Event("close", { bubbles: false, cancelable: true }); + if (onClose) { + dialog.addEventListener("close", onClose, { once: true }); + } + dialog.dispatchEvent(event); + if (!event.defaultPrevented) return; + store.setOpen(true); + } + }); + const { portalRef, domReady } = usePortalRef(portal, props.portalRef); + const preserveTabOrderProp = props.preserveTabOrder; + const preserveTabOrder = useStoreState( + store, + (state) => preserveTabOrderProp && !modal && state.mounted + ); + const id = useId(props.id); + const open = useStoreState(store, "open"); + const mounted = useStoreState(store, "mounted"); + const contentElement = useStoreState(store, "contentElement"); + const hidden = isHidden(mounted, props.hidden, props.alwaysVisible); + usePreventBodyScroll(contentElement, id, preventBodyScroll && !hidden); + useHideOnInteractOutside(store, hideOnInteractOutside, domReady); + const { wrapElement, nestedDialogs } = useNestedDialogs(store); + props = useWrapElement(props, wrapElement, [wrapElement]); + useSafeLayoutEffect(() => { + if (!open) return; + const dialog = ref.current; + const activeElement = getActiveElement(dialog, true); + if (!activeElement) return; + if (activeElement.tagName === "BODY") return; + if (dialog && contains(dialog, activeElement)) return; + store.setDisclosureElement(activeElement); + }, [store, open]); + if (JC64G2H7_isSafariBrowser) { (0,external_React_.useEffect)(() => { - if (!modal) - return; - if (!mounted) - return; - if (!domReady) - return; - const dialog = ref.current; - if (!dialog) - return; - const existingDismiss = dialog.querySelector("[data-dialog-dismiss]"); - if (existingDismiss) - return; - return prependHiddenDismiss(dialog, store.hide); - }, [store, modal, mounted, domReady]); - useSafeLayoutEffect(() => { - if (open) - return; - if (!mounted) - return; - if (!domReady) - return; - const dialog = ref.current; - if (!dialog) - return; - return disableTree(dialog); - }, [open, mounted, domReady]); - const canTakeTreeSnapshot = open && domReady; - useSafeLayoutEffect(() => { - if (!id) - return; - if (!canTakeTreeSnapshot) - return; - const dialog = ref.current; - return createWalkTreeSnapshot(id, [dialog]); - }, [id, canTakeTreeSnapshot]); - const getPersistentElementsProp = useEvent(getPersistentElements); - useSafeLayoutEffect(() => { - if (!id) - return; - if (!canTakeTreeSnapshot) - return; + if (!mounted) return; const { disclosureElement } = store.getState(); - const dialog = ref.current; - const persistentElements = getPersistentElementsProp() || []; - const allElements = [ - dialog, - ...persistentElements, - ...nestedDialogs.map((dialog2) => dialog2.getState().contentElement) - ]; - if (modal) { - return chain( - markTreeOutside(id, allElements), - disableTreeOutside(id, allElements) - ); - } - return markTreeOutside(id, [disclosureElement, ...allElements]); - }, [ - id, - store, - canTakeTreeSnapshot, - getPersistentElementsProp, - nestedDialogs, - modal - ]); - const mayAutoFocusOnShow = !!autoFocusOnShow; - const autoFocusOnShowProp = useBooleanEvent(autoFocusOnShow); - const [autoFocusEnabled, setAutoFocusEnabled] = (0,external_React_.useState)(false); - (0,external_React_.useEffect)(() => { - if (!open) + if (!disclosureElement) return; + if (!isButton(disclosureElement)) return; + const onMouseDown = () => { + let receivedFocus = false; + const onFocus = () => { + receivedFocus = true; + }; + const options = { capture: true, once: true }; + disclosureElement.addEventListener("focusin", onFocus, options); + queueBeforeEvent(disclosureElement, "mouseup", () => { + disclosureElement.removeEventListener("focusin", onFocus, true); + if (receivedFocus) return; + focusIfNeeded(disclosureElement); + }); + }; + disclosureElement.addEventListener("mousedown", onMouseDown); + return () => { + disclosureElement.removeEventListener("mousedown", onMouseDown); + }; + }, [store, mounted]); + } + (0,external_React_.useEffect)(() => { + if (!mounted) return; + if (!domReady) return; + const dialog = ref.current; + if (!dialog) return; + const win = getWindow(dialog); + const viewport = win.visualViewport || win; + const setViewportHeight = () => { + var _a2, _b2; + const height = (_b2 = (_a2 = win.visualViewport) == null ? void 0 : _a2.height) != null ? _b2 : win.innerHeight; + dialog.style.setProperty("--dialog-viewport-height", `${height}px`); + }; + setViewportHeight(); + viewport.addEventListener("resize", setViewportHeight); + return () => { + viewport.removeEventListener("resize", setViewportHeight); + }; + }, [mounted, domReady]); + (0,external_React_.useEffect)(() => { + if (!modal) return; + if (!mounted) return; + if (!domReady) return; + const dialog = ref.current; + if (!dialog) return; + const existingDismiss = dialog.querySelector("[data-dialog-dismiss]"); + if (existingDismiss) return; + return prependHiddenDismiss(dialog, store.hide); + }, [store, modal, mounted, domReady]); + useSafeLayoutEffect(() => { + if (!supportsInert()) return; + if (open) return; + if (!mounted) return; + if (!domReady) return; + const dialog = ref.current; + if (!dialog) return; + return disableTree(dialog); + }, [open, mounted, domReady]); + const canTakeTreeSnapshot = open && domReady; + useSafeLayoutEffect(() => { + if (!id) return; + if (!canTakeTreeSnapshot) return; + const dialog = ref.current; + return createWalkTreeSnapshot(id, [dialog]); + }, [id, canTakeTreeSnapshot, unstable_treeSnapshotKey]); + const getPersistentElementsProp = useEvent(getPersistentElements); + useSafeLayoutEffect(() => { + if (!id) return; + if (!canTakeTreeSnapshot) return; + const { disclosureElement } = store.getState(); + const dialog = ref.current; + const persistentElements = getPersistentElementsProp() || []; + const allElements = [ + dialog, + ...persistentElements, + ...nestedDialogs.map((dialog2) => dialog2.getState().contentElement) + ]; + if (modal) { + return chain( + markTreeOutside(id, allElements), + disableTreeOutside(id, allElements) + ); + } + return markTreeOutside(id, [disclosureElement, ...allElements]); + }, [ + id, + store, + canTakeTreeSnapshot, + getPersistentElementsProp, + nestedDialogs, + modal, + unstable_treeSnapshotKey + ]); + const mayAutoFocusOnShow = !!autoFocusOnShow; + const autoFocusOnShowProp = useBooleanEvent(autoFocusOnShow); + const [autoFocusEnabled, setAutoFocusEnabled] = (0,external_React_.useState)(false); + (0,external_React_.useEffect)(() => { + if (!open) return; + if (!mayAutoFocusOnShow) return; + if (!domReady) return; + if (!(contentElement == null ? void 0 : contentElement.isConnected)) return; + const element = getElementFromProp(initialFocus, true) || // If no initial focus is specified, we try to focus the first element + // with the autofocus attribute. If it's an Ariakit component, the + // Focusable component will consume the autoFocus prop and add the + // data-autofocus attribute to the element instead. + contentElement.querySelector( + "[data-autofocus=true],[autofocus]" + ) || // We have to fallback to the first focusable element otherwise portaled + // dialogs with preserveTabOrder set to true will not receive focus + // properly because the elements aren't tabbable until the dialog receives + // focus. + getFirstTabbableIn(contentElement, true, portal && preserveTabOrder) || // Finally, we fallback to the dialog element itself. + contentElement; + const isElementFocusable = isFocusable(element); + if (!autoFocusOnShowProp(isElementFocusable ? element : null)) return; + setAutoFocusEnabled(true); + queueMicrotask(() => { + element.focus(); + if (!JC64G2H7_isSafariBrowser) return; + element.scrollIntoView({ block: "nearest", inline: "nearest" }); + }); + }, [ + open, + mayAutoFocusOnShow, + domReady, + contentElement, + initialFocus, + portal, + preserveTabOrder, + autoFocusOnShowProp + ]); + const mayAutoFocusOnHide = !!autoFocusOnHide; + const autoFocusOnHideProp = useBooleanEvent(autoFocusOnHide); + const [hasOpened, setHasOpened] = (0,external_React_.useState)(false); + (0,external_React_.useEffect)(() => { + if (!open) return; + setHasOpened(true); + return () => setHasOpened(false); + }, [open]); + const focusOnHide = (0,external_React_.useCallback)( + (dialog, retry = true) => { + const { disclosureElement } = store.getState(); + if (isAlreadyFocusingAnotherElement(dialog)) return; + let element = getElementFromProp(finalFocus) || disclosureElement; + if (element == null ? void 0 : element.id) { + const doc = getDocument(element); + const selector = `[aria-activedescendant="${element.id}"]`; + const composite = doc.querySelector(selector); + if (composite) { + element = composite; + } + } + if (element && !isFocusable(element)) { + const maybeParentDialog = element.closest("[data-dialog]"); + if (maybeParentDialog == null ? void 0 : maybeParentDialog.id) { + const doc = getDocument(maybeParentDialog); + const selector = `[aria-controls~="${maybeParentDialog.id}"]`; + const control = doc.querySelector(selector); + if (control) { + element = control; + } + } + } + const isElementFocusable = element && isFocusable(element); + if (!isElementFocusable && retry) { + requestAnimationFrame(() => focusOnHide(dialog, false)); return; - if (!mayAutoFocusOnShow) - return; - if (!domReady) - return; - if (!(contentElement == null ? void 0 : contentElement.isConnected)) - return; - const element = getElementFromProp(initialFocus, true) || // If no initial focus is specified, we try to focus the first element - // with the autofocus attribute. If it's an Ariakit component, the - // Focusable component will consume the autoFocus prop and add the - // data-autofocus attribute to the element instead. - contentElement.querySelector( - "[data-autofocus=true],[autofocus]" - ) || // We have to fallback to the first focusable element otherwise portaled - // dialogs with preserveTabOrder set to true will not receive focus - // properly because the elements aren't tabbable until the dialog - // receives focus. - getFirstTabbableIn(contentElement, true, portal && preserveTabOrder) || // Finally, we fallback to the dialog element itself. - contentElement; - const isElementFocusable = isFocusable(element); - if (!autoFocusOnShowProp(isElementFocusable ? element : null)) - return; - setAutoFocusEnabled(true); - queueMicrotask(() => { - element.focus(); - if (!NERBASET_isSafariBrowser) - return; - element.scrollIntoView({ block: "nearest", inline: "nearest" }); - }); - }, [ - open, - mayAutoFocusOnShow, - domReady, - contentElement, - initialFocus, - portal, - preserveTabOrder, - autoFocusOnShowProp - ]); - const mayAutoFocusOnHide = !!autoFocusOnHide; - const autoFocusOnHideProp = useBooleanEvent(autoFocusOnHide); - const [hasOpened, setHasOpened] = (0,external_React_.useState)(false); - (0,external_React_.useEffect)(() => { - if (!open) - return; - setHasOpened(true); - return () => setHasOpened(false); - }, [open]); - const focusOnHide = (0,external_React_.useCallback)( - (dialog, retry = true) => { - const { disclosureElement } = store.getState(); - if (isAlreadyFocusingAnotherElement(dialog)) - return; - let element = getElementFromProp(finalFocus) || disclosureElement; - if (element == null ? void 0 : element.id) { - const doc = DLOEKDPY_getDocument(element); - const selector = `[aria-activedescendant="${element.id}"]`; - const composite = doc.querySelector(selector); - if (composite) { - element = composite; - } - } - if (element && !isFocusable(element)) { - const maybeParentDialog = DLOEKDPY_closest(element, "[data-dialog]"); - if (maybeParentDialog && maybeParentDialog.id) { - const doc = DLOEKDPY_getDocument(maybeParentDialog); - const selector = `[aria-controls~="${maybeParentDialog.id}"]`; - const control = doc.querySelector(selector); - if (control) { - element = control; - } - } - } - const isElementFocusable = element && isFocusable(element); - if (!isElementFocusable && retry) { - requestAnimationFrame(() => focusOnHide(dialog, false)); - return; - } - if (!autoFocusOnHideProp(isElementFocusable ? element : null)) - return; - if (!isElementFocusable) - return; - element == null ? void 0 : element.focus(); - }, - [store, finalFocus, autoFocusOnHideProp] - ); - useSafeLayoutEffect(() => { - if (open) - return; - if (!hasOpened) - return; - if (!mayAutoFocusOnHide) - return; - const dialog = ref.current; - focusOnHide(dialog); - }, [open, hasOpened, domReady, mayAutoFocusOnHide, focusOnHide]); - (0,external_React_.useEffect)(() => { - if (!hasOpened) + } + if (!autoFocusOnHideProp(isElementFocusable ? element : null)) return; + if (!isElementFocusable) return; + element == null ? void 0 : element.focus(); + }, + [store, finalFocus, autoFocusOnHideProp] + ); + const focusedOnHideRef = (0,external_React_.useRef)(false); + useSafeLayoutEffect(() => { + if (open) return; + if (!hasOpened) return; + if (!mayAutoFocusOnHide) return; + const dialog = ref.current; + focusedOnHideRef.current = true; + focusOnHide(dialog); + }, [open, hasOpened, domReady, mayAutoFocusOnHide, focusOnHide]); + (0,external_React_.useEffect)(() => { + if (!hasOpened) return; + if (!mayAutoFocusOnHide) return; + const dialog = ref.current; + return () => { + if (focusedOnHideRef.current) { + focusedOnHideRef.current = false; return; - if (!mayAutoFocusOnHide) - return; + } + focusOnHide(dialog); + }; + }, [hasOpened, mayAutoFocusOnHide, focusOnHide]); + const hideOnEscapeProp = useBooleanEvent(hideOnEscape); + (0,external_React_.useEffect)(() => { + if (!domReady) return; + if (!mounted) return; + const onKeyDown = (event) => { + if (event.key !== "Escape") return; + if (event.defaultPrevented) return; const dialog = ref.current; - return () => focusOnHide(dialog); - }, [hasOpened, mayAutoFocusOnHide, focusOnHide]); - const hideOnEscapeProp = useBooleanEvent(hideOnEscape); - (0,external_React_.useEffect)(() => { - if (!domReady) - return; - if (!mounted) - return; - const onKeyDown = (event) => { - if (event.key !== "Escape") - return; - if (event.defaultPrevented) - return; - const dialog = ref.current; - if (!dialog) - return; - if (isElementMarked(dialog)) - return; - const target = event.target; - if (!target) - return; - const { disclosureElement } = store.getState(); - const isValidTarget = () => { - if (target.tagName === "BODY") - return true; - if (contains(dialog, target)) - return true; - if (!disclosureElement) - return true; - if (contains(disclosureElement, target)) - return true; - return false; - }; - if (!isValidTarget()) - return; - if (!hideOnEscapeProp(event)) - return; - store.hide(); + if (!dialog) return; + if (isElementMarked(dialog)) return; + const target = event.target; + if (!target) return; + const { disclosureElement } = store.getState(); + const isValidTarget = () => { + if (target.tagName === "BODY") return true; + if (contains(dialog, target)) return true; + if (!disclosureElement) return true; + if (contains(disclosureElement, target)) return true; + return false; }; - return addGlobalEventListener("keydown", onKeyDown, true); - }, [store, domReady, mounted, hideOnEscapeProp]); - props = useWrapElement( - props, - (element) => /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(HeadingLevel, { level: modal ? 1 : void 0, children: element }), - [modal] - ); - const hiddenProp = props.hidden; - const alwaysVisible = props.alwaysVisible; - props = useWrapElement( - props, - (element) => { - if (!backdrop) - return element; - return /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { children: [ - /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)( - DialogBackdrop, - { - store, - backdrop, - backdropProps, - hidden: hiddenProp, - alwaysVisible - } - ), - element - ] }); - }, - [store, backdrop, backdropProps, hiddenProp, alwaysVisible] - ); - const [headingId, setHeadingId] = (0,external_React_.useState)(); - const [descriptionId, setDescriptionId] = (0,external_React_.useState)(); - props = useWrapElement( - props, - (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 }) }) }), - [store] - ); - props = _4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues({ - id, - "data-dialog": "", - role: "dialog", - tabIndex: focusable ? -1 : void 0, - "aria-labelledby": headingId, - "aria-describedby": descriptionId - }, props), { - ref: useMergeRefs(ref, props.ref) - }); - props = useFocusableContainer(_4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues({}, props), { - autoFocusOnShow: autoFocusEnabled - })); - props = useDisclosureContent(_4R3V3JGP_spreadValues({ store }, props)); - props = useFocusable(_4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues({}, props), { focusable })); - props = usePortal(_4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues({ portal }, props), { portalRef, preserveTabOrder })); - return props; - } -); + if (!isValidTarget()) return; + if (!hideOnEscapeProp(event)) return; + store.hide(); + }; + return addGlobalEventListener("keydown", onKeyDown, true); + }, [store, domReady, mounted, hideOnEscapeProp]); + props = useWrapElement( + props, + (element) => /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(HeadingLevel, { level: modal ? 1 : void 0, children: element }), + [modal] + ); + const hiddenProp = props.hidden; + const alwaysVisible = props.alwaysVisible; + props = useWrapElement( + props, + (element) => { + if (!backdrop) return element; + return /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { children: [ + /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)( + DialogBackdrop, + { + store, + backdrop, + hidden: hiddenProp, + alwaysVisible + } + ), + element + ] }); + }, + [store, backdrop, hiddenProp, alwaysVisible] + ); + const [headingId, setHeadingId] = (0,external_React_.useState)(); + const [descriptionId, setDescriptionId] = (0,external_React_.useState)(); + props = useWrapElement( + props, + (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 }) }) }), + [store] + ); + props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({ + id, + "data-dialog": "", + role: "dialog", + tabIndex: focusable ? -1 : void 0, + "aria-labelledby": headingId, + "aria-describedby": descriptionId + }, props), { + ref: useMergeRefs(ref, props.ref) + }); + props = useFocusableContainer(_3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, props), { + autoFocusOnShow: autoFocusEnabled + })); + props = useDisclosureContent(_3YLGPPWQ_spreadValues({ store }, props)); + props = useFocusable(_3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, props), { focusable })); + props = usePortal(_3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({ portal }, props), { portalRef, preserveTabOrder })); + return props; +}); function createDialogComponent(Component, useProviderContext = useDialogProviderContext) { - return createComponent((props) => { + return forwardRef2(function DialogComponent(props) { const context = useProviderContext(); const store = props.store || context; const mounted = useStoreState( store, (state) => !props.unmountOnHide || (state == null ? void 0 : state.mounted) || !!props.open ); - if (!mounted) - return null; - return /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(Component, _4R3V3JGP_spreadValues({}, props)); + if (!mounted) return null; + return /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(Component, _3YLGPPWQ_spreadValues({}, props)); }); } var Dialog = createDialogComponent( - createComponent((props) => { + forwardRef2(function Dialog2(props) { const htmlProps = useDialog(props); - return _3ORBWXWF_createElement("div", htmlProps); + return LMDWO4NN_createElement(JC64G2H7_TagName, htmlProps); }), useDialogProviderContext ); -if (false) {} - - - -;// CONCATENATED MODULE: ./node_modules/@floating-ui/utils/dist/floating-ui.utils.mjs + + + +;// ./node_modules/@floating-ui/utils/dist/floating-ui.utils.mjs const floating_ui_utils_sides = (/* unused pure expression or super */ null && (['top', 'right', 'bottom', 'left'])); const alignments = (/* unused pure expression or super */ null && (['start', 'end'])); 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]), []))); @@ -7156,7 +8514,7 @@ -;// CONCATENATED MODULE: ./node_modules/@floating-ui/core/dist/floating-ui.core.mjs +;// ./node_modules/@floating-ui/core/dist/floating-ui.core.mjs @@ -8169,7 +9527,7 @@ -;// CONCATENATED MODULE: ./node_modules/@floating-ui/dom/node_modules/@floating-ui/utils/dist/floating-ui.utils.mjs +;// ./node_modules/@floating-ui/dom/node_modules/@floating-ui/utils/dist/floating-ui.utils.mjs /** * Custom positioning reference element. * @see https://floating-ui.com/docs/virtual-elements @@ -8289,18 +9647,30 @@ }; } function dist_floating_ui_utils_rectToClientRect(rect) { - return { - ...rect, - top: rect.y, - left: rect.x, - right: rect.x + rect.width, - bottom: rect.y + rect.height - }; -} - - - -;// CONCATENATED MODULE: ./node_modules/@floating-ui/dom/node_modules/@floating-ui/utils/dist/floating-ui.utils.dom.mjs + const { + x, + y, + width, + height + } = rect; + return { + width, + height, + top: y, + left: x, + right: x + width, + bottom: y + height, + x, + y + }; +} + + + +;// ./node_modules/@floating-ui/dom/node_modules/@floating-ui/utils/dist/floating-ui.utils.dom.mjs +function hasWindow() { + return typeof window !== 'undefined'; +} function getNodeName(node) { if (isNode(node)) { return (node.nodeName || '').toLowerCase(); @@ -8319,17 +9689,25 @@ return (_ref = (isNode(node) ? node.ownerDocument : node.document) || window.document) == null ? void 0 : _ref.documentElement; } function isNode(value) { + if (!hasWindow()) { + return false; + } return value instanceof Node || value instanceof floating_ui_utils_dom_getWindow(value).Node; } function isElement(value) { + if (!hasWindow()) { + return false; + } return value instanceof Element || value instanceof floating_ui_utils_dom_getWindow(value).Element; } function isHTMLElement(value) { + if (!hasWindow()) { + return false; + } return value instanceof HTMLElement || value instanceof floating_ui_utils_dom_getWindow(value).HTMLElement; } function isShadowRoot(value) { - // Browsers without `ShadowRoot` support. - if (typeof ShadowRoot === 'undefined') { + if (!hasWindow() || typeof ShadowRoot === 'undefined') { return false; } return value instanceof ShadowRoot || value instanceof floating_ui_utils_dom_getWindow(value).ShadowRoot; @@ -8346,21 +9724,32 @@ function isTableElement(element) { return ['table', 'td', 'th'].includes(getNodeName(element)); } -function isContainingBlock(element) { +function isTopLayer(element) { + return [':popover-open', ':modal'].some(selector => { + try { + return element.matches(selector); + } catch (e) { + return false; + } + }); +} +function isContainingBlock(elementOrCss) { const webkit = isWebKit(); - const css = floating_ui_utils_dom_getComputedStyle(element); + const css = isElement(elementOrCss) ? floating_ui_utils_dom_getComputedStyle(elementOrCss) : elementOrCss; // https://developer.mozilla.org/en-US/docs/Web/CSS/Containing_block#identifying_the_containing_block - 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)); + // https://drafts.csswg.org/css-transforms-2/#individual-transforms + return ['transform', 'translate', 'scale', 'rotate', 'perspective'].some(value => css[value] ? css[value] !== 'none' : false) || (css.containerType ? css.containerType !== 'normal' : false) || !webkit && (css.backdropFilter ? css.backdropFilter !== 'none' : false) || !webkit && (css.filter ? css.filter !== 'none' : false) || ['transform', 'translate', 'scale', 'rotate', 'perspective', 'filter'].some(value => (css.willChange || '').includes(value)) || ['paint', 'layout', 'strict', 'content'].some(value => (css.contain || '').includes(value)); } function getContainingBlock(element) { let currentNode = getParentNode(element); while (isHTMLElement(currentNode) && !isLastTraversableNode(currentNode)) { if (isContainingBlock(currentNode)) { return currentNode; - } else { - currentNode = getParentNode(currentNode); - } + } else if (isTopLayer(currentNode)) { + return null; + } + currentNode = getParentNode(currentNode); } return null; } @@ -8382,8 +9771,8 @@ }; } return { - scrollLeft: element.pageXOffset, - scrollTop: element.pageYOffset + scrollLeft: element.scrollX, + scrollTop: element.scrollY }; } function getParentNode(node) { @@ -8423,14 +9812,18 @@ const isBody = scrollableAncestor === ((_node$ownerDocument2 = node.ownerDocument) == null ? void 0 : _node$ownerDocument2.body); const win = floating_ui_utils_dom_getWindow(scrollableAncestor); if (isBody) { - return list.concat(win, win.visualViewport || [], isOverflowElement(scrollableAncestor) ? scrollableAncestor : [], win.frameElement && traverseIframes ? getOverflowAncestors(win.frameElement) : []); + const frameElement = getFrameElement(win); + return list.concat(win, win.visualViewport || [], isOverflowElement(scrollableAncestor) ? scrollableAncestor : [], frameElement && traverseIframes ? getOverflowAncestors(frameElement) : []); } return list.concat(scrollableAncestor, getOverflowAncestors(scrollableAncestor, [], traverseIframes)); } - - - -;// CONCATENATED MODULE: ./node_modules/@floating-ui/dom/dist/floating-ui.dom.mjs +function getFrameElement(win) { + return win.parent && Object.getPrototypeOf(win.parent) ? win.frameElement : null; +} + + + +;// ./node_modules/@floating-ui/dom/dist/floating-ui.dom.mjs @@ -8565,7 +9958,7 @@ } const topLayerSelectors = [':popover-open', ':modal']; -function isTopLayer(floating) { +function floating_ui_dom_isTopLayer(floating) { return topLayerSelectors.some(selector => { try { return floating.matches(selector); @@ -8584,7 +9977,7 @@ } = _ref; const isFixed = strategy === 'fixed'; const documentElement = getDocumentElement(offsetParent); - const topLayer = elements ? isTopLayer(elements.floating) : false; + const topLayer = elements ? floating_ui_dom_isTopLayer(elements.floating) : false; if (offsetParent === documentElement || topLayer && isFixed) { return rect; } @@ -8832,7 +10225,7 @@ // such as table ancestors and cross browser bugs. function getOffsetParent(element, polyfill) { const window = floating_ui_utils_dom_getWindow(element); - if (!isHTMLElement(element) || isTopLayer(element)) { + if (!isHTMLElement(element) || floating_ui_dom_isTopLayer(element)) { return window; } let offsetParent = getTrueOffsetParent(element, polyfill); @@ -9111,7 +10504,7 @@ -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/IRX7SFUJ.js +;// ./node_modules/@ariakit/react-core/esm/__chunks/T6C2RYFI.js "use client"; @@ -9124,6 +10517,7 @@ +var T6C2RYFI_TagName = "div"; function createDOMRect(x = 0, y = 0, width = 0, height = 0) { if (typeof DOMRect === "function") { return new DOMRect(x, y, width, height); @@ -9138,11 +10532,10 @@ bottom: y + height, left: x }; - return _4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues({}, rect), { toJSON: () => rect }); + return _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, rect), { toJSON: () => rect }); } function getDOMRect(anchorRect) { - if (!anchorRect) - return createDOMRect(); + if (!anchorRect) return createDOMRect(); const { x, y, width, height } = anchorRect; return createDOMRect(x, y, width, height); } @@ -9181,8 +10574,7 @@ }); } function getFlipMiddleware(props) { - if (props.flip === false) - return; + if (props.flip === false) return; const fallbackPlacements = typeof props.flip === "string" ? props.flip.split(" ") : void 0; invariant( !fallbackPlacements || fallbackPlacements.every(isValidPlacement), @@ -9194,8 +10586,7 @@ }); } function getShiftMiddleware(props) { - if (!props.slide && !props.overlap) - return; + if (!props.slide && !props.overlap) return; return floating_ui_dom_shift({ mainAxis: props.slide, crossAxis: props.overlap, @@ -9234,15 +10625,14 @@ }); } function getArrowMiddleware(arrowElement, props) { - if (!arrowElement) - return; + if (!arrowElement) return; return floating_ui_dom_arrow({ element: arrowElement, padding: props.arrowPadding }); } var usePopover = createHook( - (_a) => { + function usePopover2(_a) { var _b = _a, { store, modal = false, @@ -9296,27 +10686,30 @@ const placement = store.useState("placement"); const mounted = store.useState("mounted"); const rendered = store.useState("rendered"); + const defaultArrowElementRef = (0,external_React_.useRef)(null); const [positioned, setPositioned] = (0,external_React_.useState)(false); const { portalRef, domReady } = usePortalRef(portal, props.portalRef); const getAnchorRectProp = useEvent(getAnchorRect); const updatePositionProp = useEvent(updatePosition); const hasCustomUpdatePosition = !!updatePosition; useSafeLayoutEffect(() => { - if (!(popoverElement == null ? void 0 : popoverElement.isConnected)) - return; + if (!(popoverElement == null ? void 0 : popoverElement.isConnected)) return; popoverElement.style.setProperty( "--popover-overflow-padding", `${overflowPadding}px` ); const anchor = getAnchorElement(anchorElement, getAnchorRectProp); const updatePosition2 = async () => { - if (!mounted) - return; + if (!mounted) return; + if (!arrowElement) { + defaultArrowElementRef.current = defaultArrowElementRef.current || document.createElement("div"); + } + const arrow2 = arrowElement || defaultArrowElementRef.current; const middleware = [ - getOffsetMiddleware(arrowElement, { gutter, shift: shift2 }), + getOffsetMiddleware(arrow2, { gutter, shift: shift2 }), getFlipMiddleware({ flip: flip2, overflowPadding }), getShiftMiddleware({ slide, shift: shift2, overlap, overflowPadding }), - getArrowMiddleware(arrowElement, { arrowPadding }), + getArrowMiddleware(arrow2, { arrowPadding }), getSizeMiddleware({ sameWidth, fitViewport, @@ -9337,13 +10730,26 @@ left: "0", transform: `translate3d(${x}px,${y}px,0)` }); - if (arrowElement && pos.middlewareData.arrow) { + if (arrow2 && pos.middlewareData.arrow) { const { x: arrowX, y: arrowY } = pos.middlewareData.arrow; - const dir = pos.placement.split("-")[0]; - Object.assign(arrowElement.style, { + const side = pos.placement.split("-")[0]; + const centerX = arrow2.clientWidth / 2; + const centerY = arrow2.clientHeight / 2; + const originX = arrowX != null ? arrowX + centerX : -centerX; + const originY = arrowY != null ? arrowY + centerY : -centerY; + popoverElement.style.setProperty( + "--popover-transform-origin", + { + top: `${originX}px calc(100% + ${centerY}px)`, + bottom: `${originX}px ${-centerY}px`, + left: `calc(100% + ${centerX}px) ${originY}px`, + right: `${-centerX}px ${originY}px` + }[side] + ); + Object.assign(arrow2.style, { left: arrowX != null ? `${arrowX}px` : "", top: arrowY != null ? `${arrowY}px` : "", - [dir]: "100%" + [side]: "100%" }); } }; @@ -9388,14 +10794,10 @@ updatePositionProp ]); useSafeLayoutEffect(() => { - if (!mounted) - return; - if (!domReady) - return; - if (!(popoverElement == null ? void 0 : popoverElement.isConnected)) - return; - if (!(contentElement == null ? void 0 : contentElement.isConnected)) - return; + if (!mounted) return; + if (!domReady) return; + if (!(popoverElement == null ? void 0 : popoverElement.isConnected)) return; + if (!(contentElement == null ? void 0 : contentElement.isConnected)) return; const applyZIndex = () => { popoverElement.style.zIndex = getComputedStyle(contentElement).zIndex; }; @@ -9410,10 +10812,8 @@ props, (element) => /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)( "div", - _4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues({ - role: "presentation" - }, wrapperProps), { - style: _4R3V3JGP_spreadValues({ + _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, wrapperProps), { + style: _3YLGPPWQ_spreadValues({ // https://floating-ui.com/docs/computeposition#initial-layout position, top: 0, @@ -9431,18 +10831,18 @@ (element) => /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(PopoverScopedContextProvider, { value: store, children: element }), [store] ); - props = _4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues({ + props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({ // data-placing is not part of the public API. We're setting this here so // we can wait for the popover to be positioned before other components // move focus into it. For example, this attribute is observed by the // Combobox component with the autoSelect behavior. - "data-placing": !positioned ? "" : void 0 + "data-placing": !positioned || void 0 }, props), { - style: _4R3V3JGP_spreadValues({ + style: _3YLGPPWQ_spreadValues({ position: "relative" }, props.style) }); - props = useDialog(_4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues({ + props = useDialog(_3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({ store, modal, portal, @@ -9456,17 +10856,16 @@ } ); var Popover = createDialogComponent( - createComponent((props) => { + forwardRef2(function Popover2(props) { const htmlProps = usePopover(props); - return _3ORBWXWF_createElement("div", htmlProps); + return LMDWO4NN_createElement(T6C2RYFI_TagName, htmlProps); }), usePopoverProviderContext ); -if (false) {} - - - -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/QWSZGSIG.js + + + +;// ./node_modules/@ariakit/react-core/esm/__chunks/KQKDTOT4.js "use client"; @@ -9484,15 +10883,12 @@ +var KQKDTOT4_TagName = "div"; function isMovingOnHovercard(target, card, anchor, nested) { - if (hasFocusWithin(card)) - return true; - if (!target) - return false; - if (contains(card, target)) - return true; - if (anchor && contains(anchor, target)) - return true; + if (hasFocusWithin(card)) return true; + if (!target) return false; + if (contains(card, target)) return true; + if (anchor && contains(anchor, target)) return true; if (nested == null ? void 0 : nested.some((card2) => isMovingOnHovercard(target, card2, anchor))) { return true; } @@ -9514,8 +10910,7 @@ const onFocusProp = props.onFocus; const onFocus = useEvent((event) => { onFocusProp == null ? void 0 : onFocusProp(event); - if (event.defaultPrevented) - return; + if (event.defaultPrevented) return; setAutoFocusOnHide(true); }); const finalFocusRef = (0,external_React_.useRef)(null); @@ -9524,7 +10919,7 @@ finalFocusRef.current = state.anchorElement; }); }, []); - props = _4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues({ + props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({ autoFocusOnHide, finalFocus: finalFocusRef }, props), { @@ -9534,7 +10929,7 @@ } var NestedHovercardContext = (0,external_React_.createContext)(null); var useHovercard = createHook( - (_a) => { + function useHovercard2(_a) { var _b = _a, { store, modal = false, @@ -9561,6 +10956,7 @@ const hideTimeoutRef = (0,external_React_.useRef)(0); const enterPointRef = (0,external_React_.useRef)(null); const { portalRef, domReady } = usePortalRef(portal, props.portalRef); + const isMouseMoving = useIsMouseMoving(); const mayHideOnHoverOutside = !!hideOnHoverOutside; const hideOnHoverOutsideProp = useBooleanEvent(hideOnHoverOutside); const mayDisablePointerEvents = !!disablePointerEventsOnApproach; @@ -9570,18 +10966,14 @@ const open = store.useState("open"); const mounted = store.useState("mounted"); (0,external_React_.useEffect)(() => { - if (!domReady) - return; - if (!mounted) - return; - if (!mayHideOnHoverOutside && !mayDisablePointerEvents) - return; + if (!domReady) return; + if (!mounted) return; + if (!mayHideOnHoverOutside && !mayDisablePointerEvents) return; const element = ref.current; - if (!element) - return; + if (!element) return; const onMouseMove = (event) => { - if (!store) - return; + if (!store) return; + if (!isMouseMoving()) return; const { anchorElement, hideTimeout, timeout } = store.getState(); const enterPoint = enterPointRef.current; const [target] = event.composedPath(); @@ -9592,22 +10984,19 @@ hideTimeoutRef.current = 0; return; } - if (hideTimeoutRef.current) - return; + if (hideTimeoutRef.current) return; if (enterPoint) { const currentPoint = getEventPoint(event); const polygon = getElementPolygon(element, enterPoint); if (isPointInPolygon(currentPoint, polygon)) { enterPointRef.current = currentPoint; - if (!disablePointerEventsProp(event)) - return; + if (!disablePointerEventsProp(event)) return; event.preventDefault(); event.stopPropagation(); return; } } - if (!hideOnHoverOutsideProp(event)) - return; + if (!hideOnHoverOutsideProp(event)) return; hideTimeoutRef.current = window.setTimeout(() => { hideTimeoutRef.current = 0; store == null ? void 0 : store.hide(); @@ -9619,6 +11008,7 @@ ); }, [ store, + isMouseMoving, domReady, mounted, mayHideOnHoverOutside, @@ -9628,23 +11018,17 @@ hideOnHoverOutsideProp ]); (0,external_React_.useEffect)(() => { - if (!domReady) - return; - if (!mounted) - return; - if (!mayDisablePointerEvents) - return; + if (!domReady) return; + if (!mounted) return; + if (!mayDisablePointerEvents) return; const disableEvent = (event) => { const element = ref.current; - if (!element) - return; + if (!element) return; const enterPoint = enterPointRef.current; - if (!enterPoint) - return; + if (!enterPoint) return; const polygon = getElementPolygon(element, enterPoint); if (isPointInPolygon(getEventPoint(event), polygon)) { - if (!disablePointerEventsProp(event)) - return; + if (!disablePointerEventsProp(event)) return; event.preventDefault(); event.stopPropagation(); } @@ -9658,16 +11042,13 @@ ); }, [domReady, mounted, mayDisablePointerEvents, disablePointerEventsProp]); (0,external_React_.useEffect)(() => { - if (!domReady) - return; - if (open) - return; + if (!domReady) return; + if (open) return; store == null ? void 0 : store.setAutoFocusOnShow(false); }, [store, domReady, open]); const openRef = useLiveRef(open); (0,external_React_.useEffect)(() => { - if (!domReady) - return; + if (!domReady) return; return () => { if (!openRef.current) { store == null ? void 0 : store.setAutoFocusOnShow(false); @@ -9676,17 +11057,12 @@ }, [store, domReady]); const registerOnParent = (0,external_React_.useContext)(NestedHovercardContext); useSafeLayoutEffect(() => { - if (modal) - return; - if (!portal) - return; - if (!mounted) - return; - if (!domReady) - return; + if (modal) return; + if (!portal) return; + if (!mounted) return; + if (!domReady) return; const element = ref.current; - if (!element) - return; + if (!element) return; return registerOnParent == null ? void 0 : registerOnParent(element); }, [modal, portal, mounted, domReady]); const registerNestedHovercard = (0,external_React_.useCallback)( @@ -9707,14 +11083,14 @@ (element) => /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(HovercardScopedContextProvider, { value: store, children: /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(NestedHovercardContext.Provider, { value: registerNestedHovercard, children: element }) }), [store, registerNestedHovercard] ); - props = _4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues({}, props), { + props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, props), { ref: useMergeRefs(ref, props.ref) }); - props = useAutoFocusOnHide(_4R3V3JGP_spreadValues({ store }, props)); + props = useAutoFocusOnHide(_3YLGPPWQ_spreadValues({ store }, props)); const autoFocusOnShow = store.useState( (state) => modal || state.autoFocusOnShow ); - props = usePopover(_4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues({ + props = usePopover(_3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({ store, modal, portal, @@ -9722,8 +11098,7 @@ }, props), { portalRef, hideOnEscape(event) { - if (isFalsyBooleanCallback(hideOnEscape, event)) - return false; + if (isFalsyBooleanCallback(hideOnEscape, event)) return false; requestAnimationFrame(() => { requestAnimationFrame(() => { store == null ? void 0 : store.hide(); @@ -9736,18 +11111,18 @@ } ); var Hovercard = createDialogComponent( - createComponent((props) => { + forwardRef2(function Hovercard2(props) { const htmlProps = useHovercard(props); - return _3ORBWXWF_createElement("div", htmlProps); + return LMDWO4NN_createElement(KQKDTOT4_TagName, htmlProps); }), useHovercardProviderContext ); -if (false) {} - - - -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/tooltip/tooltip.js -"use client"; + + + +;// ./node_modules/@ariakit/react-core/esm/tooltip/tooltip.js +"use client"; + @@ -9794,8 +11169,9 @@ +var tooltip_TagName = "div"; var useTooltip = createHook( - (_a) => { + function useTooltip2(_a) { var _b = _a, { store, portal = true, @@ -9825,30 +11201,24 @@ const role = store.useState( (state) => state.type === "description" ? "tooltip" : "none" ); - props = _4R3V3JGP_spreadValues({ role }, props); - props = useHovercard(_4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues({}, props), { + props = _3YLGPPWQ_spreadValues({ role }, props); + props = useHovercard(_3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, props), { store, portal, gutter, preserveTabOrder, - hideOnHoverOutside: (event) => { - if (isFalsyBooleanCallback(hideOnHoverOutside, event)) - return false; + hideOnHoverOutside(event) { + if (isFalsyBooleanCallback(hideOnHoverOutside, event)) return false; const anchorElement = store == null ? void 0 : store.getState().anchorElement; - if (!anchorElement) - return true; - if ("focusVisible" in anchorElement.dataset) - return false; + if (!anchorElement) return true; + if ("focusVisible" in anchorElement.dataset) return false; return true; }, hideOnInteractOutside: (event) => { - if (isFalsyBooleanCallback(hideOnInteractOutside, event)) - return false; + if (isFalsyBooleanCallback(hideOnInteractOutside, event)) return false; const anchorElement = store == null ? void 0 : store.getState().anchorElement; - if (!anchorElement) - return true; - if (contains(anchorElement, event.target)) - return false; + if (!anchorElement) return true; + if (contains(anchorElement, event.target)) return false; return true; } })); @@ -9856,21 +11226,18 @@ } ); var Tooltip = createDialogComponent( - createComponent((props) => { + forwardRef2(function Tooltip2(props) { const htmlProps = useTooltip(props); - return _3ORBWXWF_createElement("div", htmlProps); + return LMDWO4NN_createElement(tooltip_TagName, htmlProps); }), useTooltipProviderContext ); -if (false) {} - - -;// CONCATENATED MODULE: external ["wp","element"] -const external_wp_element_namespaceObject = window["wp"]["element"]; -;// CONCATENATED MODULE: external ["wp","deprecated"] + + +;// external ["wp","deprecated"] const external_wp_deprecated_namespaceObject = window["wp"]["deprecated"]; var external_wp_deprecated_default = /*#__PURE__*/__webpack_require__.n(external_wp_deprecated_namespaceObject); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/shortcut/index.js +;// ./node_modules/@wordpress/components/build-module/shortcut/index.js /** * Internal dependencies @@ -9914,11 +11281,10 @@ } /* harmony default export */ const build_module_shortcut = (Shortcut); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/popover/utils.js -/** - * External dependencies - */ -// eslint-disable-next-line no-restricted-imports +;// ./node_modules/@wordpress/components/build-module/popover/utils.js +/** + * External dependencies + */ /** * Internal dependencies @@ -10164,24 +11530,23 @@ */ const computePopoverPosition = c => c === null || Number.isNaN(c) ? undefined : Math.round(c); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/tooltip/index.js -/** - * External dependencies - */ -// eslint-disable-next-line no-restricted-imports - - -/** - * WordPress dependencies - */ - - - - -/** - * Internal dependencies - */ - +;// ./node_modules/@wordpress/components/build-module/tooltip/index.js +/** + * External dependencies + */ + + + +/** + * WordPress dependencies + */ + + + + +/** + * Internal dependencies + */ @@ -10200,6 +11565,7 @@ function UnforwardedTooltip(props, ref) { const { children, + className, delay = TOOLTIP_DELAY, hideOnClick = true, placement, @@ -10238,23 +11604,38 @@ placement: computedPlacement, showTimeout: delay }); + const mounted = useStoreState(tooltipStore, 'mounted'); if (isNestedInTooltip) { return isOnlyChild ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Role, { ...restProps, render: children }) : children; } + + // TODO: this is a temporary workaround to minimize the effects of the + // Ariakit upgrade. Ariakit doesn't pass the `aria-describedby` prop to + // the tooltip anchor anymore since 0.4.0, so we need to add it manually. + // The `aria-describedby` attribute is added only if the anchor doesn't have + // one already, and if the tooltip text is not the same as the anchor's + // `aria-label` + // See: https://github.com/WordPress/gutenberg/pull/64066 + // See: https://github.com/WordPress/gutenberg/pull/65989 + function addDescribedById(element) { + return describedById && mounted && element.props['aria-describedby'] === undefined && element.props['aria-label'] !== text ? (0,external_wp_element_namespaceObject.cloneElement)(element, { + 'aria-describedby': describedById + }) : element; + } return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(TooltipInternalContext.Provider, { value: CONTEXT_VALUE, children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(TooltipAnchor, { onClick: hideOnClick ? tooltipStore.hide : undefined, store: tooltipStore, - render: isOnlyChild ? children : undefined, + render: isOnlyChild ? addDescribedById(children) : undefined, ref: ref, children: isOnlyChild ? undefined : children }), isOnlyChild && (text || shortcut) && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(Tooltip, { ...restProps, - className: "components-tooltip", + className: dist_clsx('components-tooltip', className), unmountOnHide: true, gutter: 4, id: describedById, @@ -10270,7 +11651,7 @@ const tooltip_Tooltip = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedTooltip); /* harmony default export */ const tooltip = (tooltip_Tooltip); -;// CONCATENATED MODULE: external ["wp","warning"] +;// external ["wp","warning"] const external_wp_warning_namespaceObject = window["wp"]["warning"]; var external_wp_warning_default = /*#__PURE__*/__webpack_require__.n(external_wp_warning_namespaceObject); // EXTERNAL MODULE: ./node_modules/deepmerge/dist/cjs.js @@ -10279,7 +11660,7 @@ // EXTERNAL MODULE: ./node_modules/fast-deep-equal/es6/index.js var es6 = __webpack_require__(7734); var es6_default = /*#__PURE__*/__webpack_require__.n(es6); -;// CONCATENATED MODULE: ./node_modules/is-plain-object/dist/is-plain-object.mjs +;// ./node_modules/is-plain-object/dist/is-plain-object.mjs /*! * is-plain-object * @@ -10315,7 +11696,7 @@ -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/utils/hooks/use-update-effect.js +;// ./node_modules/@wordpress/components/build-module/utils/hooks/use-update-effect.js /** * WordPress dependencies */ @@ -10324,48 +11705,49 @@ /** * A `React.useEffect` that will not run on the first render. * Source: - * https://github.com/ariakit/ariakit/blob/reakit/packages/reakit-utils/src/useUpdateEffect.ts + * https://github.com/ariakit/ariakit/blob/main/packages/ariakit-react-core/src/utils/hooks.ts * * @param {import('react').EffectCallback} effect * @param {import('react').DependencyList} deps */ function use_update_effect_useUpdateEffect(effect, deps) { - const mounted = (0,external_wp_element_namespaceObject.useRef)(false); + const mountedRef = (0,external_wp_element_namespaceObject.useRef)(false); (0,external_wp_element_namespaceObject.useEffect)(() => { - if (mounted.current) { + if (mountedRef.current) { return effect(); } - mounted.current = true; + mountedRef.current = true; return undefined; - // Disable reasons: // 1. This hook needs to pass a dep list that isn't an array literal // 2. `effect` is missing from the array, and will need to be added carefully to avoid additional warnings // see https://github.com/WordPress/gutenberg/pull/41166 - // eslint-disable-next-line react-hooks/exhaustive-deps }, deps); + (0,external_wp_element_namespaceObject.useEffect)(() => () => { + mountedRef.current = false; + }, []); } /* harmony default export */ const use_update_effect = (use_update_effect_useUpdateEffect); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/context/context-system-provider.js -/** - * External dependencies - */ - - - - -/** - * WordPress dependencies - */ - - - -/** - * Internal dependencies - */ - - -const ComponentsContext = (0,external_wp_element_namespaceObject.createContext)( /** @type {Record} */{}); +;// ./node_modules/@wordpress/components/build-module/context/context-system-provider.js +/** + * External dependencies + */ + + + + +/** + * WordPress dependencies + */ + + + +/** + * Internal dependencies + */ + + +const ComponentsContext = (0,external_wp_element_namespaceObject.createContext)(/** @type {Record} */{}); const useComponentsContext = () => (0,external_wp_element_namespaceObject.useContext)(ComponentsContext); /** @@ -10444,7 +11826,7 @@ }; const ContextSystemProvider = (0,external_wp_element_namespaceObject.memo)(BaseContextSystemProvider); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/context/constants.js +;// ./node_modules/@wordpress/components/build-module/context/constants.js const COMPONENT_NAMESPACE = 'data-wp-component'; const CONNECTED_NAMESPACE = 'data-wp-c16t'; @@ -10454,7 +11836,7 @@ */ const CONNECT_STATIC_NAMESPACE = '__contextSystemKey__'; -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/context/utils.js +;// ./node_modules/@wordpress/components/build-module/context/utils.js /** * Internal dependencies */ @@ -10495,7 +11877,7 @@ }; } -;// CONCATENATED MODULE: ./node_modules/tslib/tslib.es6.mjs +;// ./node_modules/tslib/tslib.es6.mjs /****************************************************************************** Copyright (c) Microsoft Corporation. @@ -10510,7 +11892,7 @@ OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR PERFORMANCE OF THIS SOFTWARE. ***************************************************************************** */ -/* global Reflect, Promise, SuppressedError, Symbol */ +/* global Reflect, Promise, SuppressedError, Symbol, Iterator */ var extendStatics = function(d, b) { extendStatics = Object.setPrototypeOf || @@ -10621,8 +12003,8 @@ } function __generator(thisArg, body) { - var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g; - return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g; + 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); + return g.next = verb(0), g["throw"] = verb(1), g["return"] = verb(2), typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g; function verb(n) { return function (v) { return step([n, v]); }; } function step(op) { if (f) throw new TypeError("Generator is already executing."); @@ -10726,8 +12108,9 @@ function __asyncGenerator(thisArg, _arguments, generator) { if (!Symbol.asyncIterator) throw new TypeError("Symbol.asyncIterator is not defined."); var g = generator.apply(thisArg, _arguments || []), i, q = []; - return i = {}, verb("next"), verb("throw"), verb("return"), i[Symbol.asyncIterator] = function () { return this; }, i; - function verb(n) { if (g[n]) i[n] = function (v) { return new Promise(function (a, b) { q.push([n, v, a, b]) > 1 || resume(n, v); }); }; } + return i = Object.create((typeof AsyncIterator === "function" ? AsyncIterator : Object).prototype), verb("next"), verb("throw"), verb("return", awaitReturn), i[Symbol.asyncIterator] = function () { return this; }, i; + function awaitReturn(f) { return function (v) { return Promise.resolve(v).then(f, reject); }; } + 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]); } } function resume(n, v) { try { step(g[n](v)); } catch (e) { settle(q[0][3], e); } } function step(r) { r.value instanceof __await ? Promise.resolve(r.value.v).then(fulfill, reject) : settle(q[0][2], r); } function fulfill(value) { resume("next", value); } @@ -10760,10 +12143,19 @@ o["default"] = v; }; +var ownKeys = function(o) { + ownKeys = Object.getOwnPropertyNames || function (o) { + var ar = []; + for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k; + return ar; + }; + return ownKeys(o); +}; + function __importStar(mod) { if (mod && mod.__esModule) return mod; var result = {}; - if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k); + if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]); __setModuleDefault(result, mod); return result; } @@ -10793,16 +12185,18 @@ function __addDisposableResource(env, value, async) { if (value !== null && value !== void 0) { if (typeof value !== "object" && typeof value !== "function") throw new TypeError("Object expected."); - var dispose; + var dispose, inner; if (async) { - if (!Symbol.asyncDispose) throw new TypeError("Symbol.asyncDispose is not defined."); - dispose = value[Symbol.asyncDispose]; + if (!Symbol.asyncDispose) throw new TypeError("Symbol.asyncDispose is not defined."); + dispose = value[Symbol.asyncDispose]; } if (dispose === void 0) { - if (!Symbol.dispose) throw new TypeError("Symbol.dispose is not defined."); - dispose = value[Symbol.dispose]; + if (!Symbol.dispose) throw new TypeError("Symbol.dispose is not defined."); + dispose = value[Symbol.dispose]; + if (async) inner = dispose; } if (typeof dispose !== "function") throw new TypeError("Object not disposable."); + if (inner) dispose = function() { try { inner.call(this); } catch (e) { return Promise.reject(e); } }; env.stack.push({ value: value, dispose: dispose, async: async }); } else if (async) { @@ -10821,28 +12215,46 @@ env.error = env.hasError ? new _SuppressedError(e, env.error, "An error was suppressed during disposal.") : e; env.hasError = true; } + var r, s = 0; function next() { - while (env.stack.length) { - var rec = env.stack.pop(); + while (r = env.stack.pop()) { try { - var result = rec.dispose && rec.dispose.call(rec.value); - if (rec.async) return Promise.resolve(result).then(next, function(e) { fail(e); return next(); }); + if (!r.async && s === 1) return s = 0, env.stack.push(r), Promise.resolve().then(next); + if (r.dispose) { + var result = r.dispose.call(r.value); + if (r.async) return s |= 2, Promise.resolve(result).then(next, function(e) { fail(e); return next(); }); + } + else s |= 1; } catch (e) { - fail(e); - } - } + fail(e); + } + } + if (s === 1) return env.hasError ? Promise.reject(env.error) : Promise.resolve(); if (env.hasError) throw env.error; } return next(); } +function __rewriteRelativeImportExtension(path, preserveJsx) { + if (typeof path === "string" && /^\.\.?\//.test(path)) { + return path.replace(/\.(tsx)$|((?:\.d)?)((?:\.[^./]+?)?)\.([cm]?)ts$/i, function (m, tsx, d, ext, cm) { + return tsx ? preserveJsx ? ".jsx" : ".js" : d && (!ext || !cm) ? m : (d + ext + "." + cm.toLowerCase() + "js"); + }); + } + return path; +} + /* harmony default export */ const tslib_es6 = ({ __extends, __assign, __rest, __decorate, __param, + __esDecorate, + __runInitializers, + __propKey, + __setFunctionName, __metadata, __awaiter, __generator, @@ -10865,9 +12277,10 @@ __classPrivateFieldIn, __addDisposableResource, __disposeResources, -}); - -;// CONCATENATED MODULE: ./node_modules/lower-case/dist.es2015/index.js + __rewriteRelativeImportExtension, +}); + +;// ./node_modules/lower-case/dist.es2015/index.js /** * Source: ftp://ftp.unicode.org/Public/UCD/latest/ucd/SpecialCasing.txt */ @@ -10916,7 +12329,7 @@ return str.toLowerCase(); } -;// CONCATENATED MODULE: ./node_modules/no-case/dist.es2015/index.js +;// ./node_modules/no-case/dist.es2015/index.js // Support camel case ("camelCase" -> "camel Case" and "CAMELCase" -> "CAMEL Case"). var DEFAULT_SPLIT_REGEXP = [/([a-z0-9])([A-Z])/g, /([A-Z])([A-Z][a-z])/g]; @@ -10948,7 +12361,7 @@ return re.reduce(function (input, re) { return input.replace(re, value); }, input); } -;// CONCATENATED MODULE: ./node_modules/dot-case/dist.es2015/index.js +;// ./node_modules/dot-case/dist.es2015/index.js function dotCase(input, options) { @@ -10956,7 +12369,7 @@ return noCase(input, __assign({ delimiter: "." }, options)); } -;// CONCATENATED MODULE: ./node_modules/param-case/dist.es2015/index.js +;// ./node_modules/param-case/dist.es2015/index.js function paramCase(input, options) { @@ -10964,7 +12377,7 @@ return dotCase(input, __assign({ delimiter: "-" }, options)); } -;// CONCATENATED MODULE: ./node_modules/memize/dist/index.js +;// ./node_modules/memize/dist/index.js /** * Memize options object. * @@ -11126,7 +12539,7 @@ -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/context/get-styled-class-name-from-key.js +;// ./node_modules/@wordpress/components/build-module/context/get-styled-class-name-from-key.js /** * External dependencies */ @@ -11145,7 +12558,7 @@ } const getStyledClassNameFromKey = memize(getStyledClassName); -;// CONCATENATED MODULE: ./node_modules/@emotion/sheet/dist/emotion-sheet.browser.esm.js +;// ./node_modules/@emotion/sheet/dist/emotion-sheet.browser.esm.js /* Based off glamor's StyleSheet, thanks Sunil ❤️ @@ -11287,7 +12700,7 @@ -;// CONCATENATED MODULE: ./node_modules/stylis/src/Utility.js +;// ./node_modules/stylis/src/Utility.js /** * @param {number} * @return {number} @@ -11404,7 +12817,7 @@ return array.map(callback).join('') } -;// CONCATENATED MODULE: ./node_modules/stylis/src/Tokenizer.js +;// ./node_modules/stylis/src/Tokenizer.js var line = 1 @@ -11652,7 +13065,7 @@ return slice(index, position) } -;// CONCATENATED MODULE: ./node_modules/stylis/src/Enum.js +;// ./node_modules/stylis/src/Enum.js var Enum_MS = '-ms-' var Enum_MOZ = '-moz-' var Enum_WEBKIT = '-webkit-' @@ -11674,7 +13087,7 @@ var COUNTER_STYLE = '@counter-style' var FONT_FEATURE_VALUES = '@font-feature-values' -;// CONCATENATED MODULE: ./node_modules/stylis/src/Serializer.js +;// ./node_modules/stylis/src/Serializer.js @@ -11711,7 +13124,7 @@ return Utility_strlen(children = Serializer_serialize(element.children, callback)) ? element.return = element.value + '{' + children + '}' : '' } -;// CONCATENATED MODULE: ./node_modules/stylis/src/Middleware.js +;// ./node_modules/stylis/src/Middleware.js @@ -11821,7 +13234,7 @@ } } -;// CONCATENATED MODULE: ./node_modules/stylis/src/Parser.js +;// ./node_modules/stylis/src/Parser.js @@ -12014,7 +13427,7 @@ return node(value, root, parent, Enum_DECLARATION, Utility_substr(value, 0, length), Utility_substr(value, length + 1, -1), length) } -;// CONCATENATED MODULE: ./node_modules/@emotion/cache/dist/emotion-cache.browser.esm.js +;// ./node_modules/@emotion/cache/dist/emotion-cache.browser.esm.js @@ -12569,7 +13982,7 @@ /* harmony default export */ const emotion_cache_browser_esm = (createCache); -;// CONCATENATED MODULE: ./node_modules/@emotion/hash/dist/emotion-hash.esm.js +;// ./node_modules/@emotion/hash/dist/emotion-hash.esm.js /* eslint-disable */ // Inspired by https://github.com/garycourt/murmurhash-js // Ported from https://github.com/aappleby/smhasher/blob/61a0530f28277f2e850bfc39600ce61d02b518de/src/MurmurHash2.cpp#L37-L86 @@ -12626,7 +14039,7 @@ /* harmony default export */ const emotion_hash_esm = (murmur2); -;// CONCATENATED MODULE: ./node_modules/@emotion/unitless/dist/emotion-unitless.esm.js +;// ./node_modules/@emotion/unitless/dist/emotion-unitless.esm.js var unitlessKeys = { animationIterationCount: 1, borderImageOutset: 1, @@ -12678,7 +14091,7 @@ /* harmony default export */ const emotion_unitless_esm = (unitlessKeys); -;// CONCATENATED MODULE: ./node_modules/@emotion/serialize/node_modules/@emotion/memoize/dist/emotion-memoize.esm.js +;// ./node_modules/@emotion/memoize/dist/emotion-memoize.esm.js function memoize(fn) { var cache = Object.create(null); return function (arg) { @@ -12689,7 +14102,7 @@ -;// CONCATENATED MODULE: ./node_modules/@emotion/serialize/dist/emotion-serialize.browser.esm.js +;// ./node_modules/@emotion/serialize/dist/emotion-serialize.browser.esm.js @@ -12938,7 +14351,7 @@ -;// CONCATENATED MODULE: ./node_modules/@emotion/use-insertion-effect-with-fallbacks/dist/emotion-use-insertion-effect-with-fallbacks.browser.esm.js +;// ./node_modules/@emotion/use-insertion-effect-with-fallbacks/dist/emotion-use-insertion-effect-with-fallbacks.browser.esm.js @@ -12952,7 +14365,7 @@ -;// CONCATENATED MODULE: ./node_modules/@emotion/react/dist/emotion-element-6a883da9.browser.esm.js +;// ./node_modules/@emotion/react/dist/emotion-element-6a883da9.browser.esm.js @@ -13166,7 +14579,7 @@ -;// CONCATENATED MODULE: ./node_modules/@emotion/utils/dist/emotion-utils.browser.esm.js +;// ./node_modules/@emotion/utils/dist/emotion-utils.browser.esm.js var isBrowser = "object" !== 'undefined'; function emotion_utils_browser_esm_getRegisteredStyles(registered, registeredStyles, classNames) { var rawClassName = ''; @@ -13212,7 +14625,7 @@ -;// CONCATENATED MODULE: ./node_modules/@emotion/css/create-instance/dist/emotion-css-create-instance.esm.js +;// ./node_modules/@emotion/css/create-instance/dist/emotion-css-create-instance.esm.js @@ -13356,7 +14769,7 @@ /* harmony default export */ const emotion_css_create_instance_esm = (createEmotion); -;// CONCATENATED MODULE: ./node_modules/@emotion/css/dist/emotion-css.esm.js +;// ./node_modules/@emotion/css/dist/emotion-css.esm.js @@ -13378,7 +14791,7 @@ -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/utils/hooks/use-cx.js +;// ./node_modules/@wordpress/components/build-module/utils/hooks/use-cx.js /** * External dependencies */ @@ -13434,7 +14847,7 @@ return cx; }; -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/context/use-context-system.js +;// ./node_modules/@wordpress/components/build-module/context/use-context-system.js /** * WordPress dependencies */ @@ -13507,7 +14920,7 @@ return finalComponentProps; } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/context/context-connect.js +;// ./node_modules/@wordpress/components/build-module/context/context-connect.js /** * External dependencies */ @@ -13625,7 +15038,7 @@ return false; } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/visually-hidden/styles.js +;// ./node_modules/@wordpress/components/build-module/visually-hidden/styles.js /** * External dependencies */ @@ -13644,38 +15057,23 @@ wordWrap: 'normal' }; -;// CONCATENATED MODULE: ./node_modules/@babel/runtime/helpers/esm/extends.js +;// ./node_modules/@babel/runtime/helpers/esm/extends.js function extends_extends() { - extends_extends = Object.assign ? Object.assign.bind() : function (target) { - for (var i = 1; i < arguments.length; i++) { - var source = arguments[i]; - for (var key in source) { - if (Object.prototype.hasOwnProperty.call(source, key)) { - target[key] = source[key]; - } - } - } - return target; - }; - return extends_extends.apply(this, arguments); -} -;// CONCATENATED MODULE: ./node_modules/@emotion/styled/node_modules/@emotion/memoize/dist/emotion-memoize.esm.js -function emotion_memoize_esm_memoize(fn) { - var cache = Object.create(null); - return function (arg) { - if (cache[arg] === undefined) cache[arg] = fn(arg); - return cache[arg]; - }; -} - - - -;// CONCATENATED MODULE: ./node_modules/@emotion/styled/node_modules/@emotion/is-prop-valid/dist/emotion-is-prop-valid.esm.js + return extends_extends = Object.assign ? Object.assign.bind() : function (n) { + for (var e = 1; e < arguments.length; e++) { + var t = arguments[e]; + for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); + } + return n; + }, extends_extends.apply(null, arguments); +} + +;// ./node_modules/@emotion/styled/node_modules/@emotion/is-prop-valid/dist/emotion-is-prop-valid.esm.js 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 -var isPropValid = /* #__PURE__ */emotion_memoize_esm_memoize(function (prop) { +var isPropValid = /* #__PURE__ */memoize(function (prop) { return reactPropsRegex.test(prop) || prop.charCodeAt(0) === 111 /* o */ && prop.charCodeAt(1) === 110 @@ -13687,7 +15085,7 @@ -;// CONCATENATED MODULE: ./node_modules/@emotion/styled/base/dist/emotion-styled-base.browser.esm.js +;// ./node_modules/@emotion/styled/base/dist/emotion-styled-base.browser.esm.js @@ -13856,7 +15254,7 @@ /* harmony default export */ const emotion_styled_base_browser_esm = (createStyled); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/view/component.js +;// ./node_modules/@wordpress/components/build-module/view/component.js /** * External dependencies @@ -13906,7 +15304,7 @@ }); /* harmony default export */ const component = (View); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/visually-hidden/component.js +;// ./node_modules/@wordpress/components/build-module/visually-hidden/component.js /** * External dependencies */ @@ -13953,7 +15351,7 @@ const component_VisuallyHidden = contextConnect(UnconnectedVisuallyHidden, 'VisuallyHidden'); /* harmony default export */ const visually_hidden_component = (component_VisuallyHidden); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/alignment-matrix-control/utils.js +;// ./node_modules/@wordpress/components/build-module/alignment-matrix-control/utils.js /** * WordPress dependencies */ @@ -14046,7 +15444,7 @@ // EXTERNAL MODULE: ./node_modules/hoist-non-react-statics/dist/hoist-non-react-statics.cjs.js var hoist_non_react_statics_cjs = __webpack_require__(1880); -;// CONCATENATED MODULE: ./node_modules/@emotion/react/dist/emotion-react.browser.esm.js +;// ./node_modules/@emotion/react/dist/emotion-react.browser.esm.js @@ -14413,7 +15811,49 @@ -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/utils/colors-values.js +;// ./node_modules/@wordpress/components/build-module/utils/space.js +/** + * The argument value for the `space()` utility function. + * + * When this is a number or a numeric string, it will be interpreted as a + * multiplier for the grid base value (4px). For example, `space( 2 )` will be 8px. + * + * Otherwise, it will be interpreted as a literal CSS length value. For example, + * `space( 'auto' )` will be 'auto', and `space( '2px' )` will be 2px. + */ + +const GRID_BASE = '4px'; + +/** + * A function that handles numbers, numeric strings, and unit values. + * + * When given a number or a numeric string, it will return the grid-based + * value as a factor of GRID_BASE, defined above. + * + * When given a unit value or one of the named CSS values like `auto`, + * it will simply return the value back. + * + * @param value A number, numeric string, or a unit value. + */ +function space(value) { + if (typeof value === 'undefined') { + return undefined; + } + + // Handle empty strings, if it's the number 0 this still works. + if (!value) { + return '0'; + } + const asInt = typeof value === 'number' ? value : Number(value); + + // 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. + if (typeof window !== 'undefined' && window.CSS?.supports?.('margin', value.toString()) || Number.isNaN(asInt)) { + return value.toString(); + } + return `calc(${GRID_BASE} * ${value})`; +} + +;// ./node_modules/@wordpress/components/build-module/utils/colors-values.js /** * Internal dependencies */ @@ -14486,6 +15926,9 @@ */ gray: GRAY, // TODO: Stop exporting this when everything is migrated to `theme` or `ui` + /** + * @deprecated Prefer theme-ready variables in `COLORS.theme`. + */ white, alert: ALERT, /** @@ -14501,7 +15944,86 @@ }); /* harmony default export */ const colors_values = ((/* unused pure expression or super */ null && (COLORS))); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/alignment-matrix-control/styles/alignment-matrix-control-styles.js +;// ./node_modules/@wordpress/components/build-module/utils/config-values.js +/** + * Internal dependencies + */ + + +const CONTROL_HEIGHT = '36px'; +const CONTROL_PROPS = { + // These values should be shared with TextControl. + controlPaddingX: 12, + controlPaddingXSmall: 8, + controlPaddingXLarge: 12 * 1.3334, + // TODO: Deprecate + + controlBoxShadowFocus: `0 0 0 0.5px ${COLORS.theme.accent}`, + controlHeight: CONTROL_HEIGHT, + controlHeightXSmall: `calc( ${CONTROL_HEIGHT} * 0.6 )`, + controlHeightSmall: `calc( ${CONTROL_HEIGHT} * 0.8 )`, + controlHeightLarge: `calc( ${CONTROL_HEIGHT} * 1.2 )`, + controlHeightXLarge: `calc( ${CONTROL_HEIGHT} * 1.4 )` +}; + +// Using Object.assign to avoid creating circular references when emitting +// TypeScript type declarations. +/* harmony default export */ const config_values = (Object.assign({}, CONTROL_PROPS, { + colorDivider: 'rgba(0, 0, 0, 0.1)', + colorScrollbarThumb: 'rgba(0, 0, 0, 0.2)', + colorScrollbarThumbHover: 'rgba(0, 0, 0, 0.5)', + colorScrollbarTrack: 'rgba(0, 0, 0, 0.04)', + elevationIntensity: 1, + radiusXSmall: '1px', + radiusSmall: '2px', + radiusMedium: '4px', + radiusLarge: '8px', + radiusFull: '9999px', + radiusRound: '50%', + borderWidth: '1px', + borderWidthFocus: '1.5px', + borderWidthTab: '4px', + spinnerSize: 16, + fontSize: '13px', + fontSizeH1: 'calc(2.44 * 13px)', + fontSizeH2: 'calc(1.95 * 13px)', + fontSizeH3: 'calc(1.56 * 13px)', + fontSizeH4: 'calc(1.25 * 13px)', + fontSizeH5: '13px', + fontSizeH6: 'calc(0.8 * 13px)', + fontSizeInputMobile: '16px', + fontSizeMobile: '15px', + fontSizeSmall: 'calc(0.92 * 13px)', + fontSizeXSmall: 'calc(0.75 * 13px)', + fontLineHeightBase: '1.4', + fontWeight: 'normal', + fontWeightHeading: '600', + gridBase: '4px', + cardPaddingXSmall: `${space(2)}`, + cardPaddingSmall: `${space(4)}`, + cardPaddingMedium: `${space(4)} ${space(6)}`, + cardPaddingLarge: `${space(6)} ${space(8)}`, + 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)`, + 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)`, + 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)`, + 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)`, + surfaceBackgroundColor: COLORS.white, + surfaceBackgroundSubtleColor: '#F3F3F3', + surfaceBackgroundTintColor: '#F5F5F5', + surfaceBorderColor: 'rgba(0, 0, 0, 0.1)', + surfaceBorderBoldColor: 'rgba(0, 0, 0, 0.15)', + surfaceBorderSubtleColor: 'rgba(0, 0, 0, 0.05)', + surfaceBackgroundTertiaryColor: COLORS.white, + surfaceColor: COLORS.white, + transitionDuration: '200ms', + transitionDurationFast: '160ms', + transitionDurationFaster: '120ms', + transitionDurationFastest: '100ms', + transitionTimingFunction: 'cubic-bezier(0.08, 0.52, 0.52, 1)', + transitionTimingFunctionControl: 'cubic-bezier(0.12, 0.8, 0.32, 1)' +})); + +;// ./node_modules/@wordpress/components/build-module/alignment-matrix-control/styles.js 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)."; } /** @@ -14514,73 +16036,59 @@ * Internal dependencies */ -var _ref = true ? { - name: "93uojk", - styles: "border-radius:2px;box-sizing:border-box;direction:ltr;display:grid;grid-template-columns:repeat( 3, 1fr );outline:none" -} : 0; -const rootBase = () => { - return _ref; -}; -const rootSize = ({ +// Grid structure + +const rootBase = ({ size = 92 -}) => { - return /*#__PURE__*/emotion_react_browser_esm_css("grid-template-rows:repeat( 3, calc( ", size, "px / 3 ) );width:", size, "px;" + ( true ? "" : 0), true ? "" : 0); -}; -const Root = /*#__PURE__*/emotion_styled_base_browser_esm("div", true ? { - target: "ecapk1j3" -} : 0)(rootBase, ";border:1px solid transparent;cursor:pointer;grid-template-columns:auto;", rootSize, ";" + ( true ? "" : 0)); -const Row = /*#__PURE__*/emotion_styled_base_browser_esm("div", true ? { - target: "ecapk1j2" +}) => /*#__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); +var _ref = true ? { + name: "e0dnmk", + styles: "cursor:pointer" +} : 0; +const GridContainer = /*#__PURE__*/emotion_styled_base_browser_esm("div", true ? { + target: "e1r95csn3" +} : 0)(rootBase, " border:1px solid transparent;", props => props.disablePointerEvents ? /*#__PURE__*/emotion_react_browser_esm_css( true ? "" : 0, true ? "" : 0) : _ref, ";" + ( true ? "" : 0)); +const GridRow = /*#__PURE__*/emotion_styled_base_browser_esm("div", true ? { + target: "e1r95csn2" } : 0)( true ? { - name: "1x5gbbj", - styles: "box-sizing:border-box;display:grid;grid-template-columns:repeat( 3, 1fr )" + name: "1fbxn64", + styles: "grid-column:1/-1;box-sizing:border-box;display:grid;grid-template-columns:repeat( 3, 1fr )" } : 0); -const pointActive = ({ - isActive -}) => { - const boxShadow = isActive ? `0 0 0 2px ${COLORS.gray[900]}` : null; - const pointColor = isActive ? COLORS.gray[900] : COLORS.gray[400]; - const pointColorHover = isActive ? COLORS.gray[900] : COLORS.theme.accent; - return /*#__PURE__*/emotion_react_browser_esm_css("box-shadow:", boxShadow, ";color:", pointColor, ";*:hover>&{color:", pointColorHover, ";}" + ( true ? "" : 0), true ? "" : 0); -}; -const pointBase = props => { - return /*#__PURE__*/emotion_react_browser_esm_css("background:currentColor;box-sizing:border-box;display:grid;margin:auto;@media not ( prefers-reduced-motion ){transition:all 120ms linear;}", pointActive(props), ";" + ( true ? "" : 0), true ? "" : 0); -}; -const Point = /*#__PURE__*/emotion_styled_base_browser_esm("span", true ? { - target: "ecapk1j1" -} : 0)("height:6px;width:6px;", pointBase, ";" + ( true ? "" : 0)); + +// Cell const Cell = /*#__PURE__*/emotion_styled_base_browser_esm("span", true ? { - target: "ecapk1j0" + target: "e1r95csn1" } : 0)( true ? { - name: "rjf3ub", - styles: "appearance:none;border:none;box-sizing:border-box;margin:0;display:flex;position:relative;outline:none;align-items:center;justify-content:center;padding:0" + name: "e2kws5", + 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" } : 0); - -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/alignment-matrix-control/cell.js -/** - * Internal dependencies - */ - - - - -/** - * Internal dependencies - */ - +const POINT_SIZE = 6; +const Point = /*#__PURE__*/emotion_styled_base_browser_esm("span", true ? { + target: "e1r95csn0" +} : 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)); + +;// ./node_modules/@wordpress/components/build-module/alignment-matrix-control/cell.js +/** + * Internal dependencies + */ + + + + +/** + * Internal dependencies + */ function cell_Cell({ id, - isActive = false, value, ...props }) { - const tooltipText = ALIGNMENT_LABEL[value]; return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(tooltip, { - text: tooltipText, - children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(CompositeItem, { + text: ALIGNMENT_LABEL[value], + children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(Composite.Item, { id: id, render: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Cell, { ...props, @@ -14589,1071 +16097,140 @@ children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(visually_hidden_component, { children: value }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Point, { - isActive: isActive, role: "presentation" })] }) }); } -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/Y6GYTNQ2.js -"use client"; - - - -// src/collection/collection-store.ts - -function useCollectionStoreProps(store, update, props) { - useUpdateEffect(update, [props.store]); - useStoreProps(store, props, "items", "setItems"); - return store; -} -function useCollectionStore(props = {}) { - const [store, update] = useStore(Core.createCollectionStore, props); - return useCollectionStoreProps(store, update, props); -} - - - -;// CONCATENATED MODULE: ./node_modules/@ariakit/core/esm/__chunks/22K762VQ.js -"use client"; - - - - - -// src/collection/collection-store.ts -function isElementPreceding(a, b) { - return Boolean( - b.compareDocumentPosition(a) & Node.DOCUMENT_POSITION_PRECEDING - ); -} -function sortBasedOnDOMPosition(items) { - const pairs = items.map((item, index) => [index, item]); - let isOrderDifferent = false; - pairs.sort(([indexA, a], [indexB, b]) => { - const elementA = a.element; - const elementB = b.element; - if (elementA === elementB) - return 0; - if (!elementA || !elementB) - return 0; - if (isElementPreceding(elementA, elementB)) { - if (indexA > indexB) { - isOrderDifferent = true; - } - return -1; - } - if (indexA < indexB) { - isOrderDifferent = true; - } - return 1; - }); - if (isOrderDifferent) { - return pairs.map(([_, item]) => item); - } - return items; -} -function getCommonParent(items) { - var _a; - const firstItem = items.find((item) => !!item.element); - const lastItem = [...items].reverse().find((item) => !!item.element); - let parentElement = (_a = firstItem == null ? void 0 : firstItem.element) == null ? void 0 : _a.parentElement; - while (parentElement && (lastItem == null ? void 0 : lastItem.element)) { - const parent = parentElement; - if (lastItem && parent.contains(lastItem.element)) { - return parentElement; - } - parentElement = parentElement.parentElement; - } - return DLOEKDPY_getDocument(parentElement).body; -} -function getPrivateStore(store) { - return store == null ? void 0 : store.__unstablePrivateStore; -} -function createCollectionStore(props = {}) { - var _a; - throwOnConflictingProps(props, props.store); - const syncState = (_a = props.store) == null ? void 0 : _a.getState(); - const items = defaultValue( - props.items, - syncState == null ? void 0 : syncState.items, - props.defaultItems, - [] - ); - const itemsMap = new Map(items.map((item) => [item.id, item])); - const initialState = { - items, - renderedItems: defaultValue(syncState == null ? void 0 : syncState.renderedItems, []) - }; - const syncPrivateStore = getPrivateStore(props.store); - const privateStore = createStore( - { items, renderedItems: initialState.renderedItems }, - syncPrivateStore - ); - const collection = createStore(initialState, props.store); - const sortItems = (renderedItems) => { - const sortedItems = sortBasedOnDOMPosition(renderedItems); - privateStore.setState("renderedItems", sortedItems); - collection.setState("renderedItems", sortedItems); - }; - setup(collection, () => init(privateStore)); - setup(privateStore, () => { - return batch(privateStore, ["items"], (state) => { - collection.setState("items", state.items); - }); - }); - setup(privateStore, () => { - return batch(privateStore, ["renderedItems"], (state) => { - let firstRun = true; - let raf = requestAnimationFrame(() => { - const { renderedItems } = collection.getState(); - if (state.renderedItems === renderedItems) - return; - sortItems(state.renderedItems); - }); - if (typeof IntersectionObserver !== "function") { - return () => cancelAnimationFrame(raf); - } - const ioCallback = () => { - if (firstRun) { - firstRun = false; - return; - } - cancelAnimationFrame(raf); - raf = requestAnimationFrame(() => sortItems(state.renderedItems)); - }; - const root = getCommonParent(state.renderedItems); - const observer = new IntersectionObserver(ioCallback, { root }); - for (const item of state.renderedItems) { - if (!item.element) - continue; - observer.observe(item.element); - } - return () => { - cancelAnimationFrame(raf); - observer.disconnect(); - }; - }); - }); - const mergeItem = (item, setItems, canDeleteFromMap = false) => { - let prevItem; - setItems((items2) => { - const index = items2.findIndex(({ id }) => id === item.id); - const nextItems = items2.slice(); - if (index !== -1) { - prevItem = items2[index]; - const nextItem = _chunks_4R3V3JGP_spreadValues(_chunks_4R3V3JGP_spreadValues({}, prevItem), item); - nextItems[index] = nextItem; - itemsMap.set(item.id, nextItem); - } else { - nextItems.push(item); - itemsMap.set(item.id, item); - } - return nextItems; - }); - const unmergeItem = () => { - setItems((items2) => { - if (!prevItem) { - if (canDeleteFromMap) { - itemsMap.delete(item.id); - } - return items2.filter(({ id }) => id !== item.id); - } - const index = items2.findIndex(({ id }) => id === item.id); - if (index === -1) - return items2; - const nextItems = items2.slice(); - nextItems[index] = prevItem; - itemsMap.set(item.id, prevItem); - return nextItems; - }); - }; - return unmergeItem; - }; - const registerItem = (item) => mergeItem( - item, - (getItems) => privateStore.setState("items", getItems), - true - ); - return _chunks_4R3V3JGP_spreadProps(_chunks_4R3V3JGP_spreadValues({}, collection), { - registerItem, - renderItem: (item) => chain( - registerItem(item), - mergeItem( - item, - (getItems) => privateStore.setState("renderedItems", getItems) - ) - ), - item: (id) => { - if (!id) - return null; - let item = itemsMap.get(id); - if (!item) { - const { items: items2 } = collection.getState(); - item = items2.find((item2) => item2.id === id); - if (item) { - itemsMap.set(id, item); - } - } - return item || null; - }, - // @ts-expect-error Internal - __unstablePrivateStore: privateStore - }); -} - - - -;// CONCATENATED MODULE: ./node_modules/@ariakit/core/esm/__chunks/7PRQYBBV.js -"use client"; - -// src/utils/array.ts -function toArray(arg) { - if (Array.isArray(arg)) { - return arg; - } - return typeof arg !== "undefined" ? [arg] : []; -} -function addItemToArray(array, item, index = -1) { - if (!(index in array)) { - return [...array, item]; - } - return [...array.slice(0, index), item, ...array.slice(index)]; -} -function flatten2DArray(array) { - const flattened = []; - for (const row of array) { - flattened.push(...row); - } - return flattened; -} -function reverseArray(array) { - return array.slice().reverse(); -} - - - -;// CONCATENATED MODULE: ./node_modules/@ariakit/core/esm/__chunks/IERTEJ3A.js -"use client"; - - - - - - -// src/composite/composite-store.ts -var IERTEJ3A_NULL_ITEM = { id: null }; -function IERTEJ3A_findFirstEnabledItem(items, excludeId) { - return items.find((item) => { - if (excludeId) { - return !item.disabled && item.id !== excludeId; - } - return !item.disabled; - }); -} -function getEnabledItems(items, excludeId) { - return items.filter((item) => { - if (excludeId) { - return !item.disabled && item.id !== excludeId; - } - return !item.disabled; - }); -} -function getOppositeOrientation(orientation) { - if (orientation === "vertical") - return "horizontal"; - if (orientation === "horizontal") - return "vertical"; - return; -} -function getItemsInRow(items, rowId) { - return items.filter((item) => item.rowId === rowId); -} -function IERTEJ3A_flipItems(items, activeId, shouldInsertNullItem = false) { - const index = items.findIndex((item) => item.id === activeId); - return [ - ...items.slice(index + 1), - ...shouldInsertNullItem ? [IERTEJ3A_NULL_ITEM] : [], - ...items.slice(0, index) - ]; -} -function IERTEJ3A_groupItemsByRows(items) { - const rows = []; - for (const item of items) { - const row = rows.find((currentRow) => { - var _a; - return ((_a = currentRow[0]) == null ? void 0 : _a.rowId) === item.rowId; - }); - if (row) { - row.push(item); - } else { - rows.push([item]); - } - } - return rows; -} -function getMaxRowLength(array) { - let maxLength = 0; - for (const { length } of array) { - if (length > maxLength) { - maxLength = length; - } - } - return maxLength; -} -function createEmptyItem(rowId) { - return { - id: "__EMPTY_ITEM__", - disabled: true, - rowId - }; -} -function normalizeRows(rows, activeId, focusShift) { - const maxLength = getMaxRowLength(rows); - for (const row of rows) { - for (let i = 0; i < maxLength; i += 1) { - const item = row[i]; - if (!item || focusShift && item.disabled) { - const isFirst = i === 0; - const previousItem = isFirst && focusShift ? IERTEJ3A_findFirstEnabledItem(row) : row[i - 1]; - row[i] = previousItem && activeId !== previousItem.id && focusShift ? previousItem : createEmptyItem(previousItem == null ? void 0 : previousItem.rowId); - } - } - } - return rows; -} -function verticalizeItems(items) { - const rows = IERTEJ3A_groupItemsByRows(items); - const maxLength = getMaxRowLength(rows); - const verticalized = []; - for (let i = 0; i < maxLength; i += 1) { - for (const row of rows) { - const item = row[i]; - if (item) { - verticalized.push(_chunks_4R3V3JGP_spreadProps(_chunks_4R3V3JGP_spreadValues({}, item), { - // If there's no rowId, it means that it's not a grid composite, but - // a single row instead. So, instead of verticalizing it, that is, - // assigning a different rowId based on the column index, we keep it - // undefined so they will be part of the same row. This is useful - // when using up/down on one-dimensional composites. - rowId: item.rowId ? `${i}` : void 0 - })); - } - } - } - return verticalized; -} -function createCompositeStore(props = {}) { - var _a; - const syncState = (_a = props.store) == null ? void 0 : _a.getState(); - const collection = createCollectionStore(props); - const activeId = defaultValue( - props.activeId, - syncState == null ? void 0 : syncState.activeId, - props.defaultActiveId - ); - const initialState = _chunks_4R3V3JGP_spreadProps(_chunks_4R3V3JGP_spreadValues({}, collection.getState()), { - activeId, - baseElement: defaultValue(syncState == null ? void 0 : syncState.baseElement, null), - includesBaseElement: defaultValue( - props.includesBaseElement, - syncState == null ? void 0 : syncState.includesBaseElement, - activeId === null - ), - moves: defaultValue(syncState == null ? void 0 : syncState.moves, 0), - orientation: defaultValue( - props.orientation, - syncState == null ? void 0 : syncState.orientation, - "both" - ), - rtl: defaultValue(props.rtl, syncState == null ? void 0 : syncState.rtl, false), - virtualFocus: defaultValue( - props.virtualFocus, - syncState == null ? void 0 : syncState.virtualFocus, - false - ), - focusLoop: defaultValue(props.focusLoop, syncState == null ? void 0 : syncState.focusLoop, false), - focusWrap: defaultValue(props.focusWrap, syncState == null ? void 0 : syncState.focusWrap, false), - focusShift: defaultValue(props.focusShift, syncState == null ? void 0 : syncState.focusShift, false) - }); - const composite = createStore(initialState, collection, props.store); - setup( - composite, - () => sync(composite, ["renderedItems", "activeId"], (state) => { - composite.setState("activeId", (activeId2) => { - var _a2; - if (activeId2 !== void 0) - return activeId2; - return (_a2 = IERTEJ3A_findFirstEnabledItem(state.renderedItems)) == null ? void 0 : _a2.id; - }); - }) - ); - const getNextId = (items, orientation, hasNullItem, skip) => { - var _a2, _b; - const { activeId: activeId2, rtl, focusLoop, focusWrap, includesBaseElement } = composite.getState(); - const isHorizontal = orientation !== "vertical"; - const isRTL = rtl && isHorizontal; - const allItems = isRTL ? reverseArray(items) : items; - if (activeId2 == null) { - return (_a2 = IERTEJ3A_findFirstEnabledItem(allItems)) == null ? void 0 : _a2.id; - } - const activeItem = allItems.find((item) => item.id === activeId2); - if (!activeItem) { - return (_b = IERTEJ3A_findFirstEnabledItem(allItems)) == null ? void 0 : _b.id; - } - const isGrid = !!activeItem.rowId; - const activeIndex = allItems.indexOf(activeItem); - const nextItems = allItems.slice(activeIndex + 1); - const nextItemsInRow = getItemsInRow(nextItems, activeItem.rowId); - if (skip !== void 0) { - const nextEnabledItemsInRow = getEnabledItems(nextItemsInRow, activeId2); - const nextItem2 = nextEnabledItemsInRow.slice(skip)[0] || // If we can't find an item, just return the last one. - nextEnabledItemsInRow[nextEnabledItemsInRow.length - 1]; - return nextItem2 == null ? void 0 : nextItem2.id; - } - const oppositeOrientation = getOppositeOrientation( - // If it's a grid and orientation is not set, it's a next/previous call, - // which is inherently horizontal. up/down will call next with orientation - // set to vertical by default (see below on up/down methods). - isGrid ? orientation || "horizontal" : orientation - ); - const canLoop = focusLoop && focusLoop !== oppositeOrientation; - const canWrap = isGrid && focusWrap && focusWrap !== oppositeOrientation; - hasNullItem = hasNullItem || !isGrid && canLoop && includesBaseElement; - if (canLoop) { - const loopItems = canWrap && !hasNullItem ? allItems : getItemsInRow(allItems, activeItem.rowId); - const sortedItems = IERTEJ3A_flipItems(loopItems, activeId2, hasNullItem); - const nextItem2 = IERTEJ3A_findFirstEnabledItem(sortedItems, activeId2); - return nextItem2 == null ? void 0 : nextItem2.id; - } - if (canWrap) { - const nextItem2 = IERTEJ3A_findFirstEnabledItem( - // We can use nextItems, which contains all the next items, including - // items from other rows, to wrap between rows. However, if there is a - // null item (the composite container), we'll only use the next items in - // the row. So moving next from the last item will focus on the - // composite container. On grid composites, horizontal navigation never - // focuses on the composite container, only vertical. - hasNullItem ? nextItemsInRow : nextItems, - activeId2 - ); - const nextId = hasNullItem ? (nextItem2 == null ? void 0 : nextItem2.id) || null : nextItem2 == null ? void 0 : nextItem2.id; - return nextId; - } - const nextItem = IERTEJ3A_findFirstEnabledItem(nextItemsInRow, activeId2); - if (!nextItem && hasNullItem) { - return null; - } - return nextItem == null ? void 0 : nextItem.id; - }; - return _chunks_4R3V3JGP_spreadProps(_chunks_4R3V3JGP_spreadValues(_chunks_4R3V3JGP_spreadValues({}, collection), composite), { - setBaseElement: (element) => composite.setState("baseElement", element), - setActiveId: (id) => composite.setState("activeId", id), - move: (id) => { - if (id === void 0) - return; - composite.setState("activeId", id); - composite.setState("moves", (moves) => moves + 1); - }, - first: () => { - var _a2; - return (_a2 = IERTEJ3A_findFirstEnabledItem(composite.getState().renderedItems)) == null ? void 0 : _a2.id; - }, - last: () => { - var _a2; - return (_a2 = IERTEJ3A_findFirstEnabledItem(reverseArray(composite.getState().renderedItems))) == null ? void 0 : _a2.id; - }, - next: (skip) => { - const { renderedItems, orientation } = composite.getState(); - return getNextId(renderedItems, orientation, false, skip); - }, - previous: (skip) => { - var _a2; - const { renderedItems, orientation, includesBaseElement } = composite.getState(); - const isGrid = !!((_a2 = IERTEJ3A_findFirstEnabledItem(renderedItems)) == null ? void 0 : _a2.rowId); - const hasNullItem = !isGrid && includesBaseElement; - return getNextId( - reverseArray(renderedItems), - orientation, - hasNullItem, - skip - ); - }, - down: (skip) => { - const { - activeId: activeId2, - renderedItems, - focusShift, - focusLoop, - includesBaseElement - } = composite.getState(); - const shouldShift = focusShift && !skip; - const verticalItems = verticalizeItems( - flatten2DArray( - normalizeRows(IERTEJ3A_groupItemsByRows(renderedItems), activeId2, shouldShift) - ) - ); - const canLoop = focusLoop && focusLoop !== "horizontal"; - const hasNullItem = canLoop && includesBaseElement; - return getNextId(verticalItems, "vertical", hasNullItem, skip); - }, - up: (skip) => { - const { activeId: activeId2, renderedItems, focusShift, includesBaseElement } = composite.getState(); - const shouldShift = focusShift && !skip; - const verticalItems = verticalizeItems( - reverseArray( - flatten2DArray( - normalizeRows( - IERTEJ3A_groupItemsByRows(renderedItems), - activeId2, - shouldShift - ) - ) - ) - ); - const hasNullItem = includesBaseElement; - return getNextId(verticalItems, "vertical", hasNullItem, skip); - } - }); -} - - - -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/7GBW5FLS.js -"use client"; - - - -// src/composite/composite-store.ts - -function useCompositeStoreProps(store, update, props) { - store = useCollectionStoreProps(store, update, props); - useStoreProps(store, props, "activeId", "setActiveId"); - useStoreProps(store, props, "includesBaseElement"); - useStoreProps(store, props, "virtualFocus"); - useStoreProps(store, props, "orientation"); - useStoreProps(store, props, "rtl"); - useStoreProps(store, props, "focusLoop"); - useStoreProps(store, props, "focusWrap"); - useStoreProps(store, props, "focusShift"); - return store; -} -function useCompositeStore(props = {}) { - const [store, update] = EKQEJRUF_useStore(createCompositeStore, props); - return useCompositeStoreProps(store, update, props); -} - - - -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/7QTPYGNZ.js -"use client"; - - - - - - - -// src/composite/composite.tsx - - - - - - - -function isGrid(items) { - return items.some((item) => !!item.rowId); -} -function isPrintableKey(event) { - const target = event.target; - if (target && !DLOEKDPY_isTextField(target)) - return false; - return event.key.length === 1 && !event.ctrlKey && !event.metaKey; -} -function isModifierKey(event) { - return event.key === "Shift" || event.key === "Control" || event.key === "Alt" || event.key === "Meta"; -} -function useKeyboardEventProxy(store, onKeyboardEvent, previousElementRef) { - return useEvent((event) => { - var _a; - onKeyboardEvent == null ? void 0 : onKeyboardEvent(event); - if (event.defaultPrevented) - return; - if (event.isPropagationStopped()) - return; - if (!isSelfTarget(event)) - return; - if (isModifierKey(event)) - return; - if (isPrintableKey(event)) - return; - const state = store.getState(); - const activeElement = (_a = getEnabledItem(store, state.activeId)) == null ? void 0 : _a.element; - if (!activeElement) - return; - const _b = event, { view } = _b, eventInit = __objRest(_b, ["view"]); - const previousElement = previousElementRef == null ? void 0 : previousElementRef.current; - if (activeElement !== previousElement) { - activeElement.focus(); - } - if (!fireKeyboardEvent(activeElement, event.type, eventInit)) { - event.preventDefault(); - } - if (event.currentTarget.contains(activeElement)) { - event.stopPropagation(); - } - }); -} -function findFirstEnabledItemInTheLastRow(items) { - return findFirstEnabledItem( - flatten2DArray(reverseArray(groupItemsByRows(items))) - ); -} -function useScheduleFocus(store) { - const [scheduled, setScheduled] = (0,external_React_.useState)(false); - const schedule = (0,external_React_.useCallback)(() => setScheduled(true), []); - const activeItem = store.useState( - (state) => getEnabledItem(store, state.activeId) - ); - (0,external_React_.useEffect)(() => { - const activeElement = activeItem == null ? void 0 : activeItem.element; - if (!scheduled) - return; - if (!activeElement) - return; - setScheduled(false); - activeElement.focus({ preventScroll: true }); - }, [activeItem, scheduled]); - return schedule; -} -var useComposite = createHook( - (_a) => { - var _b = _a, { - store, - composite = true, - focusOnMove = composite, - moveOnKeyPress = true - } = _b, props = __objRest(_b, [ - "store", - "composite", - "focusOnMove", - "moveOnKeyPress" - ]); - const context = useCompositeProviderContext(); - store = store || context; - invariant( - store, - false && 0 - ); - const previousElementRef = (0,external_React_.useRef)(null); - const scheduleFocus = useScheduleFocus(store); - const moves = store.useState("moves"); - (0,external_React_.useEffect)(() => { - var _a2; - if (!store) - return; - if (!moves) - return; - if (!composite) - return; - if (!focusOnMove) - return; - const { activeId: activeId2 } = store.getState(); - const itemElement = (_a2 = getEnabledItem(store, activeId2)) == null ? void 0 : _a2.element; - if (!itemElement) - return; - focusIntoView(itemElement); - }, [store, moves, composite, focusOnMove]); - useSafeLayoutEffect(() => { - if (!store) - return; - if (!moves) - return; - if (!composite) - return; - const { baseElement, activeId: activeId2 } = store.getState(); - const isSelfAcive = activeId2 === null; - if (!isSelfAcive) - return; - if (!baseElement) - return; - const previousElement = previousElementRef.current; - previousElementRef.current = null; - if (previousElement) { - fireBlurEvent(previousElement, { relatedTarget: baseElement }); - } - if (!hasFocus(baseElement)) { - baseElement.focus(); - } - }, [store, moves, composite]); - const activeId = store.useState("activeId"); - const virtualFocus = store.useState("virtualFocus"); - useSafeLayoutEffect(() => { - var _a2; - if (!store) - return; - if (!composite) - return; - if (!virtualFocus) - return; - const previousElement = previousElementRef.current; - previousElementRef.current = null; - if (!previousElement) - return; - const activeElement = (_a2 = getEnabledItem(store, activeId)) == null ? void 0 : _a2.element; - const relatedTarget = activeElement || getActiveElement(previousElement); - if (relatedTarget === previousElement) - return; - fireBlurEvent(previousElement, { relatedTarget }); - }, [store, activeId, virtualFocus, composite]); - const onKeyDownCapture = useKeyboardEventProxy( - store, - props.onKeyDownCapture, - previousElementRef - ); - const onKeyUpCapture = useKeyboardEventProxy( - store, - props.onKeyUpCapture, - previousElementRef - ); - const onFocusCaptureProp = props.onFocusCapture; - const onFocusCapture = useEvent((event) => { - onFocusCaptureProp == null ? void 0 : onFocusCaptureProp(event); - if (event.defaultPrevented) - return; - if (!store) - return; - const { virtualFocus: virtualFocus2 } = store.getState(); - if (!virtualFocus2) - return; - const previousActiveElement = event.relatedTarget; - const isSilentlyFocused = silentlyFocused(event.currentTarget); - if (isSelfTarget(event) && isSilentlyFocused) { - event.stopPropagation(); - previousElementRef.current = previousActiveElement; - } - }); - const onFocusProp = props.onFocus; - const onFocus = useEvent((event) => { - onFocusProp == null ? void 0 : onFocusProp(event); - if (event.defaultPrevented) - return; - if (!composite) - return; - if (!store) - return; - const { relatedTarget } = event; - const { virtualFocus: virtualFocus2 } = store.getState(); - if (virtualFocus2) { - if (isSelfTarget(event) && !isItem(store, relatedTarget)) { - queueMicrotask(scheduleFocus); - } - } else if (isSelfTarget(event)) { - store.setActiveId(null); - } - }); - const onBlurCaptureProp = props.onBlurCapture; - const onBlurCapture = useEvent((event) => { - var _a2; - onBlurCaptureProp == null ? void 0 : onBlurCaptureProp(event); - if (event.defaultPrevented) - return; - if (!store) - return; - const { virtualFocus: virtualFocus2, activeId: activeId2 } = store.getState(); - if (!virtualFocus2) - return; - const activeElement = (_a2 = getEnabledItem(store, activeId2)) == null ? void 0 : _a2.element; - const nextActiveElement = event.relatedTarget; - const nextActiveElementIsItem = isItem(store, nextActiveElement); - const previousElement = previousElementRef.current; - previousElementRef.current = null; - if (isSelfTarget(event) && nextActiveElementIsItem) { - if (nextActiveElement === activeElement) { - if (previousElement && previousElement !== nextActiveElement) { - fireBlurEvent(previousElement, event); - } - } else if (activeElement) { - fireBlurEvent(activeElement, event); - } else if (previousElement) { - fireBlurEvent(previousElement, event); - } - event.stopPropagation(); - } else { - const targetIsItem = isItem(store, event.target); - if (!targetIsItem && activeElement) { - fireBlurEvent(activeElement, event); - } - } - }); - const onKeyDownProp = props.onKeyDown; - const moveOnKeyPressProp = useBooleanEvent(moveOnKeyPress); - const onKeyDown = useEvent((event) => { - var _a2; - onKeyDownProp == null ? void 0 : onKeyDownProp(event); - if (event.defaultPrevented) - return; - if (!store) - return; - if (!isSelfTarget(event)) - return; - const { orientation, items, renderedItems, activeId: activeId2 } = store.getState(); - const activeItem = getEnabledItem(store, activeId2); - if ((_a2 = activeItem == null ? void 0 : activeItem.element) == null ? void 0 : _a2.isConnected) - return; - const isVertical = orientation !== "horizontal"; - const isHorizontal = orientation !== "vertical"; - const grid = isGrid(renderedItems); - const isHorizontalKey = event.key === "ArrowLeft" || event.key === "ArrowRight" || event.key === "Home" || event.key === "End"; - if (isHorizontalKey && DLOEKDPY_isTextField(event.currentTarget)) - return; - const up = () => { - if (grid) { - const item = items && findFirstEnabledItemInTheLastRow(items); - return item == null ? void 0 : item.id; - } - return store == null ? void 0 : store.last(); - }; - const keyMap = { - ArrowUp: (grid || isVertical) && up, - ArrowRight: (grid || isHorizontal) && store.first, - ArrowDown: (grid || isVertical) && store.first, - ArrowLeft: (grid || isHorizontal) && store.last, - Home: store.first, - End: store.last, - PageUp: store.first, - PageDown: store.last - }; - const action = keyMap[event.key]; - if (action) { - const id = action(); - if (id !== void 0) { - if (!moveOnKeyPressProp(event)) - return; - event.preventDefault(); - store.move(id); - } - } - }); - props = useWrapElement( - props, - (element) => /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(CompositeContextProvider, { value: store, children: element }), - [store] - ); - const activeDescendant = store.useState((state) => { - var _a2; - if (!store) - return; - if (!composite) - return; - if (!state.virtualFocus) - return; - return (_a2 = getEnabledItem(store, state.activeId)) == null ? void 0 : _a2.id; - }); - props = _4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues({ - "aria-activedescendant": activeDescendant - }, props), { - ref: useMergeRefs(composite ? store.setBaseElement : null, props.ref), - onKeyDownCapture, - onKeyUpCapture, - onFocusCapture, - onFocus, - onBlurCapture, - onKeyDown - }); - const focusable = store.useState( - (state) => composite && (state.virtualFocus || state.activeId === null) - ); - props = useFocusable(_4R3V3JGP_spreadValues({ focusable }, props)); - return props; - } -); -var Composite = createComponent((props) => { - const htmlProps = useComposite(props); - return _3ORBWXWF_createElement("div", htmlProps); -}); -if (false) {} - - - -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/BNUFNEVY.js -"use client"; - - - - - -// src/composite/composite-row.tsx - - - -var useCompositeRow = createHook( - (_a) => { - var _b = _a, { - store, - "aria-setsize": ariaSetSize, - "aria-posinset": ariaPosInSet - } = _b, props = __objRest(_b, [ - "store", - "aria-setsize", - "aria-posinset" - ]); - const context = useCompositeContext(); - store = store || context; - invariant( - store, - false && 0 - ); - const id = useId(props.id); - const baseElement = store.useState( - (state) => state.baseElement || void 0 - ); - const providerValue = (0,external_React_.useMemo)( - () => ({ id, baseElement, ariaSetSize, ariaPosInSet }), - [id, baseElement, ariaSetSize, ariaPosInSet] - ); - props = useWrapElement( - props, - (element) => /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(CompositeRowContext.Provider, { value: providerValue, children: element }), - [providerValue] - ); - props = _4R3V3JGP_spreadValues({ id }, props); - return props; - } -); -var CompositeRow = createComponent((props) => { - const htmlProps = useCompositeRow(props); - return _3ORBWXWF_createElement("div", htmlProps); -}); -if (false) {} - - - -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/alignment-matrix-control/styles/alignment-matrix-control-icon-styles.js - -function alignment_matrix_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)."; } -/** - * External dependencies - */ - - - -/** - * Internal dependencies - */ - -const alignment_matrix_control_icon_styles_rootSize = () => { - const padding = 1.5; - const size = 24; - return /*#__PURE__*/emotion_react_browser_esm_css({ - gridTemplateRows: `repeat( 3, calc( ${size - padding * 2}px / 3))`, - padding, - maxHeight: size, - maxWidth: size - }, true ? "" : 0, true ? "" : 0); -}; -const rootPointerEvents = ({ - disablePointerEvents -}) => { - return /*#__PURE__*/emotion_react_browser_esm_css({ - pointerEvents: disablePointerEvents ? 'none' : undefined - }, true ? "" : 0, true ? "" : 0); -}; -const Wrapper = /*#__PURE__*/emotion_styled_base_browser_esm("div", true ? { - target: "erowt52" -} : 0)( true ? { - name: "ogl07i", - styles: "box-sizing:border-box;padding:2px" -} : 0); -const alignment_matrix_control_icon_styles_Root = /*#__PURE__*/emotion_styled_base_browser_esm("div", true ? { - target: "erowt51" -} : 0)("transform-origin:top left;height:100%;width:100%;", rootBase, ";", alignment_matrix_control_icon_styles_rootSize, ";", rootPointerEvents, ";" + ( true ? "" : 0)); -const alignment_matrix_control_icon_styles_pointActive = ({ - isActive -}) => { - const boxShadow = isActive ? `0 0 0 1px currentColor` : null; - return /*#__PURE__*/emotion_react_browser_esm_css("box-shadow:", boxShadow, ";color:currentColor;*:hover>&{color:currentColor;}" + ( true ? "" : 0), true ? "" : 0); -}; -const alignment_matrix_control_icon_styles_Point = /*#__PURE__*/emotion_styled_base_browser_esm("span", true ? { - target: "erowt50" -} : 0)("height:2px;width:2px;", pointBase, ";", alignment_matrix_control_icon_styles_pointActive, ";" + ( true ? "" : 0)); -const alignment_matrix_control_icon_styles_Cell = Cell; - -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/alignment-matrix-control/icon.js -/** - * External dependencies - */ - - -/** - * Internal dependencies - */ - +;// ./node_modules/@wordpress/components/build-module/alignment-matrix-control/icon.js +/** + * External dependencies + */ + + +/** + * WordPress dependencies + */ + + +/** + * Internal dependencies + */ const BASE_SIZE = 24; +const GRID_CELL_SIZE = 7; +const GRID_PADDING = (BASE_SIZE - 3 * GRID_CELL_SIZE) / 2; +const DOT_SIZE = 2; +const DOT_SIZE_SELECTED = 4; function AlignmentMatrixControlIcon({ className, disablePointerEvents = true, - size = BASE_SIZE, + size, + width, + height, style = {}, value = 'center', ...props }) { - const alignIndex = getAlignmentIndex(value); - const scale = (size / BASE_SIZE).toFixed(2); - const classes = dist_clsx('component-alignment-matrix-control-icon', className); - const styles = { - ...style, - transform: `scale(${scale})` - }; - return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(alignment_matrix_control_icon_styles_Root, { + var _ref, _ref2; + return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { + xmlns: "http://www.w3.org/2000/svg", + viewBox: `0 0 ${BASE_SIZE} ${BASE_SIZE}`, + width: (_ref = size !== null && size !== void 0 ? size : width) !== null && _ref !== void 0 ? _ref : BASE_SIZE, + height: (_ref2 = size !== null && size !== void 0 ? size : height) !== null && _ref2 !== void 0 ? _ref2 : BASE_SIZE, + role: "presentation", + className: dist_clsx('component-alignment-matrix-control-icon', className), + style: { + pointerEvents: disablePointerEvents ? 'none' : undefined, + ...style + }, ...props, - className: classes, - disablePointerEvents: disablePointerEvents, - role: "presentation", - style: styles, children: ALIGNMENTS.map((align, index) => { - const isActive = alignIndex === index; - return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(alignment_matrix_control_icon_styles_Cell, { - children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(alignment_matrix_control_icon_styles_Point, { - isActive: isActive - }) + const dotSize = getAlignmentIndex(value) === index ? DOT_SIZE_SELECTED : DOT_SIZE; + return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Rect, { + x: GRID_PADDING + index % 3 * GRID_CELL_SIZE + (GRID_CELL_SIZE - dotSize) / 2, + y: GRID_PADDING + Math.floor(index / 3) * GRID_CELL_SIZE + (GRID_CELL_SIZE - dotSize) / 2, + width: dotSize, + height: dotSize, + fill: "currentColor" }, align); }) }); } /* harmony default export */ const icon = (AlignmentMatrixControlIcon); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/alignment-matrix-control/index.js -/** - * External dependencies - */ - - -/** - * WordPress dependencies - */ - - - -/** - * Internal dependencies - */ - - - - - - -/** - * +;// ./node_modules/@wordpress/components/build-module/alignment-matrix-control/index.js +/** + * External dependencies + */ + + +/** + * WordPress dependencies + */ + + + + +/** + * Internal dependencies + */ + + + + + + +function UnforwardedAlignmentMatrixControl({ + className, + id, + label = (0,external_wp_i18n_namespaceObject.__)('Alignment Matrix Control'), + defaultValue = 'center center', + value, + onChange, + width = 92, + ...props +}) { + const baseId = (0,external_wp_compose_namespaceObject.useInstanceId)(UnforwardedAlignmentMatrixControl, 'alignment-matrix-control', id); + const setActiveId = (0,external_wp_element_namespaceObject.useCallback)(nextActiveId => { + const nextValue = getItemValue(baseId, nextActiveId); + if (nextValue) { + onChange?.(nextValue); + } + }, [baseId, onChange]); + const classes = dist_clsx('component-alignment-matrix-control', className); + return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Composite, { + defaultActiveId: getItemId(baseId, defaultValue), + activeId: getItemId(baseId, value), + setActiveId: setActiveId, + rtl: (0,external_wp_i18n_namespaceObject.isRTL)(), + render: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(GridContainer, { + ...props, + "aria-label": label, + className: classes, + id: baseId, + role: "grid", + size: width + }), + children: GRID.map((cells, index) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Composite.Row, { + render: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(GridRow, { + role: "row" + }), + children: cells.map(cell => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(cell_Cell, { + id: getItemId(baseId, cell), + value: cell + }, cell)) + }, index)) + }); +} + +/** * AlignmentMatrixControl components enable adjustments to horizontal and vertical alignments for UI. * * ```jsx - * import { __experimentalAlignmentMatrixControl as AlignmentMatrixControl } from '@wordpress/components'; + * import { AlignmentMatrixControl } from '@wordpress/components'; * import { useState } from '@wordpress/element'; * * const Example = () => { @@ -15668,60 +16245,23 @@ * }; * ``` */ -function AlignmentMatrixControl({ - className, - id, - label = (0,external_wp_i18n_namespaceObject.__)('Alignment Matrix Control'), - defaultValue = 'center center', - value, - onChange, - width = 92, - ...props -}) { - const baseId = (0,external_wp_compose_namespaceObject.useInstanceId)(AlignmentMatrixControl, 'alignment-matrix-control', id); - const compositeStore = useCompositeStore({ - defaultActiveId: getItemId(baseId, defaultValue), - activeId: getItemId(baseId, value), - setActiveId: nextActiveId => { - const nextValue = getItemValue(baseId, nextActiveId); - if (nextValue) { - onChange?.(nextValue); - } - }, - rtl: (0,external_wp_i18n_namespaceObject.isRTL)() - }); - const activeId = compositeStore.useState('activeId'); - const classes = dist_clsx('component-alignment-matrix-control', className); - return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Composite, { - store: compositeStore, - render: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Root, { - ...props, - "aria-label": label, - className: classes, - id: baseId, - role: "grid", - size: width - }), - children: GRID.map((cells, index) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(CompositeRow, { - render: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Row, { - role: "row" - }), - children: cells.map(cell => { - const cellId = getItemId(baseId, cell); - const isActive = cellId === activeId; - return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(cell_Cell, { - id: cellId, - isActive: isActive, - value: cell - }, cell); - }) - }, index)) - }); -} -AlignmentMatrixControl.Icon = icon; +const AlignmentMatrixControl = Object.assign(UnforwardedAlignmentMatrixControl, { + /** + * Render an alignment matrix as an icon. + * + * ```jsx + * import { AlignmentMatrixControl } from '@wordpress/components'; + * + * } /> + * ``` + */ + Icon: Object.assign(icon, { + displayName: 'AlignmentMatrixControl.Icon' + }) +}); /* harmony default export */ const alignment_matrix_control = (AlignmentMatrixControl); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/animate/index.js +;// ./node_modules/@wordpress/components/build-module/animate/index.js /** * External dependencies */ @@ -15796,7 +16336,7 @@ } /* harmony default export */ const animate = (Animate); -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/context/MotionConfigContext.mjs +;// ./node_modules/framer-motion/dist/es/context/MotionConfigContext.mjs /** @@ -15810,14 +16350,14 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/context/MotionContext/index.mjs +;// ./node_modules/framer-motion/dist/es/context/MotionContext/index.mjs const MotionContext = (0,external_React_.createContext)({}); -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/context/PresenceContext.mjs +;// ./node_modules/framer-motion/dist/es/context/PresenceContext.mjs /** @@ -15827,12 +16367,12 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/is-browser.mjs +;// ./node_modules/framer-motion/dist/es/utils/is-browser.mjs const is_browser_isBrowser = typeof document !== "undefined"; -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/use-isomorphic-effect.mjs +;// ./node_modules/framer-motion/dist/es/utils/use-isomorphic-effect.mjs @@ -15840,14 +16380,14 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/context/LazyContext.mjs +;// ./node_modules/framer-motion/dist/es/context/LazyContext.mjs const LazyContext = (0,external_React_.createContext)({ strict: false }); -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/dom/utils/camel-to-dash.mjs +;// ./node_modules/framer-motion/dist/es/render/dom/utils/camel-to-dash.mjs /** * Convert camelCase to dash-case properties. */ @@ -15855,7 +16395,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/animation/optimized-appear/data-id.mjs +;// ./node_modules/framer-motion/dist/es/animation/optimized-appear/data-id.mjs const optimizedAppearDataId = "framerAppearId"; @@ -15863,7 +16403,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/GlobalConfig.mjs +;// ./node_modules/framer-motion/dist/es/utils/GlobalConfig.mjs const MotionGlobalConfig = { skipAnimations: false, useManualTiming: false, @@ -15871,7 +16411,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/frameloop/render-step.mjs +;// ./node_modules/framer-motion/dist/es/frameloop/render-step.mjs class Queue { constructor() { this.order = []; @@ -15977,7 +16517,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/frameloop/batcher.mjs +;// ./node_modules/framer-motion/dist/es/frameloop/batcher.mjs @@ -16044,14 +16584,14 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/frameloop/microtask.mjs +;// ./node_modules/framer-motion/dist/es/frameloop/microtask.mjs const { schedule: microtask, cancel: cancelMicrotask } = createRenderBatcher(queueMicrotask, false); -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/motion/utils/use-visual-element.mjs +;// ./node_modules/framer-motion/dist/es/motion/utils/use-visual-element.mjs @@ -16129,7 +16669,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/is-ref-object.mjs +;// ./node_modules/framer-motion/dist/es/utils/is-ref-object.mjs function isRefObject(ref) { return (ref && typeof ref === "object" && @@ -16138,7 +16678,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/motion/utils/use-motion-ref.mjs +;// ./node_modules/framer-motion/dist/es/motion/utils/use-motion-ref.mjs @@ -16173,7 +16713,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/utils/is-variant-label.mjs +;// ./node_modules/framer-motion/dist/es/render/utils/is-variant-label.mjs /** * Decides if the supplied variable is variant label */ @@ -16183,7 +16723,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/animation/utils/is-animation-controls.mjs +;// ./node_modules/framer-motion/dist/es/animation/utils/is-animation-controls.mjs function isAnimationControls(v) { return (v !== null && typeof v === "object" && @@ -16192,7 +16732,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/utils/variant-props.mjs +;// ./node_modules/framer-motion/dist/es/render/utils/variant-props.mjs const variantPriorityOrder = [ "animate", "whileInView", @@ -16206,7 +16746,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/utils/is-controlling-variants.mjs +;// ./node_modules/framer-motion/dist/es/render/utils/is-controlling-variants.mjs @@ -16221,7 +16761,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/context/MotionContext/utils.mjs +;// ./node_modules/framer-motion/dist/es/context/MotionContext/utils.mjs @@ -16240,7 +16780,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/context/MotionContext/create.mjs +;// ./node_modules/framer-motion/dist/es/context/MotionContext/create.mjs @@ -16255,7 +16795,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/motion/features/definitions.mjs +;// ./node_modules/framer-motion/dist/es/motion/features/definitions.mjs const featureProps = { animation: [ "animate", @@ -16285,7 +16825,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/motion/features/load-features.mjs +;// ./node_modules/framer-motion/dist/es/motion/features/load-features.mjs function loadFeatures(features) { @@ -16299,14 +16839,14 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/context/LayoutGroupContext.mjs +;// ./node_modules/framer-motion/dist/es/context/LayoutGroupContext.mjs const LayoutGroupContext = (0,external_React_.createContext)({}); -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/context/SwitchLayoutGroupContext.mjs +;// ./node_modules/framer-motion/dist/es/context/SwitchLayoutGroupContext.mjs /** @@ -16316,12 +16856,12 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/motion/utils/symbol.mjs +;// ./node_modules/framer-motion/dist/es/motion/utils/symbol.mjs const motionComponentSymbol = Symbol.for("motionComponentSymbol"); -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/motion/index.mjs +;// ./node_modules/framer-motion/dist/es/motion/index.mjs @@ -16400,7 +16940,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/dom/motion-proxy.mjs +;// ./node_modules/framer-motion/dist/es/render/dom/motion-proxy.mjs /** @@ -16449,7 +16989,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/svg/lowercase-elements.mjs +;// ./node_modules/framer-motion/dist/es/render/svg/lowercase-elements.mjs /** * We keep these listed seperately as we use the lowercase tag names as part * of the runtime bundle to detect SVG components @@ -16484,7 +17024,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/dom/utils/is-svg-component.mjs +;// ./node_modules/framer-motion/dist/es/render/dom/utils/is-svg-component.mjs function isSVGComponent(Component) { @@ -16516,7 +17056,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/projection/styles/scale-correction.mjs +;// ./node_modules/framer-motion/dist/es/projection/styles/scale-correction.mjs const scaleCorrectors = {}; function addScaleCorrector(correctors) { Object.assign(scaleCorrectors, correctors); @@ -16524,7 +17064,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/html/utils/transform.mjs +;// ./node_modules/framer-motion/dist/es/render/html/utils/transform.mjs /** * Generate a list of every possible transform key. */ @@ -16554,7 +17094,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/motion/utils/is-forced-motion-value.mjs +;// ./node_modules/framer-motion/dist/es/motion/utils/is-forced-motion-value.mjs @@ -16567,12 +17107,12 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/value/utils/is-motion-value.mjs +;// ./node_modules/framer-motion/dist/es/value/utils/is-motion-value.mjs const isMotionValue = (value) => Boolean(value && value.getVelocity); -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/html/utils/build-transform.mjs +;// ./node_modules/framer-motion/dist/es/render/html/utils/build-transform.mjs const translateAlias = { @@ -16619,7 +17159,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/dom/utils/is-css-variable.mjs +;// ./node_modules/framer-motion/dist/es/render/dom/utils/is-css-variable.mjs const checkStringStartsWith = (token) => (key) => typeof key === "string" && key.startsWith(token); const isCSSVariableName = checkStringStartsWith("--"); const startsAsVariableToken = checkStringStartsWith("var(--"); @@ -16634,7 +17174,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/dom/value-types/get-as-type.mjs +;// ./node_modules/framer-motion/dist/es/render/dom/value-types/get-as-type.mjs /** * Provided a value and a ValueType, returns the value as that value type. */ @@ -16646,7 +17186,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/clamp.mjs +;// ./node_modules/framer-motion/dist/es/utils/clamp.mjs const clamp_clamp = (min, max, v) => { if (v > max) return max; @@ -16657,7 +17197,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/value/types/numbers/index.mjs +;// ./node_modules/framer-motion/dist/es/value/types/numbers/index.mjs const number = { @@ -16676,7 +17216,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/value/types/utils.mjs +;// ./node_modules/framer-motion/dist/es/value/types/utils.mjs /** * TODO: When we move from string as a source of truth to data models * everything in this folder should probably be referred to as models vs types @@ -16693,7 +17233,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/value/types/numbers/units.mjs +;// ./node_modules/framer-motion/dist/es/value/types/numbers/units.mjs const createUnitType = (unit) => ({ @@ -16714,7 +17254,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/dom/value-types/type-int.mjs +;// ./node_modules/framer-motion/dist/es/render/dom/value-types/type-int.mjs const type_int_int = { @@ -16724,7 +17264,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/dom/value-types/number.mjs +;// ./node_modules/framer-motion/dist/es/render/dom/value-types/number.mjs @@ -16800,7 +17340,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/html/utils/build-styles.mjs +;// ./node_modules/framer-motion/dist/es/render/html/utils/build-styles.mjs @@ -16876,7 +17416,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/html/utils/create-render-state.mjs +;// ./node_modules/framer-motion/dist/es/render/html/utils/create-render-state.mjs const createHtmlRenderState = () => ({ style: {}, transform: {}, @@ -16886,7 +17426,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/html/use-props.mjs +;// ./node_modules/framer-motion/dist/es/render/html/use-props.mjs @@ -16945,7 +17485,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/motion/utils/valid-prop.mjs +;// ./node_modules/framer-motion/dist/es/motion/utils/valid-prop.mjs /** * A list of all valid MotionProps. * @@ -17004,7 +17544,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/dom/utils/filter-props.mjs +;// ./node_modules/framer-motion/dist/es/render/dom/utils/filter-props.mjs let shouldForward = (key) => !isValidMotionProp(key); @@ -17065,7 +17605,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/svg/utils/transform-origin.mjs +;// ./node_modules/framer-motion/dist/es/render/svg/utils/transform-origin.mjs function calcOrigin(origin, offset, size) { @@ -17085,7 +17625,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/svg/utils/path.mjs +;// ./node_modules/framer-motion/dist/es/render/svg/utils/path.mjs const dashKeys = { @@ -17119,7 +17659,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/svg/utils/build-attrs.mjs +;// ./node_modules/framer-motion/dist/es/render/svg/utils/build-attrs.mjs @@ -17173,7 +17713,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/svg/utils/create-render-state.mjs +;// ./node_modules/framer-motion/dist/es/render/svg/utils/create-render-state.mjs const createSvgRenderState = () => ({ @@ -17183,12 +17723,12 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/svg/utils/is-svg-tag.mjs +;// ./node_modules/framer-motion/dist/es/render/svg/utils/is-svg-tag.mjs const isSVGTag = (tag) => typeof tag === "string" && tag.toLowerCase() === "svg"; -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/svg/use-props.mjs +;// ./node_modules/framer-motion/dist/es/render/svg/use-props.mjs @@ -17214,7 +17754,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/dom/use-render.mjs +;// ./node_modules/framer-motion/dist/es/render/dom/use-render.mjs @@ -17249,7 +17789,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/html/utils/render.mjs +;// ./node_modules/framer-motion/dist/es/render/html/utils/render.mjs function renderHTML(element, { style, vars }, styleProp, projection) { Object.assign(element.style, style, projection && projection.getProjectionStyles(styleProp)); // Loop over any CSS variables and assign those. @@ -17260,7 +17800,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/svg/utils/camel-case-attrs.mjs +;// ./node_modules/framer-motion/dist/es/render/svg/utils/camel-case-attrs.mjs /** * A set of attribute names that are always read/written as camel case. */ @@ -17292,7 +17832,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/svg/utils/render.mjs +;// ./node_modules/framer-motion/dist/es/render/svg/utils/render.mjs @@ -17306,7 +17846,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/html/utils/scrape-motion-values.mjs +;// ./node_modules/framer-motion/dist/es/render/html/utils/scrape-motion-values.mjs @@ -17328,7 +17868,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/svg/utils/scrape-motion-values.mjs +;// ./node_modules/framer-motion/dist/es/render/svg/utils/scrape-motion-values.mjs @@ -17349,7 +17889,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/utils/resolve-variants.mjs +;// ./node_modules/framer-motion/dist/es/render/utils/resolve-variants.mjs function getValueState(visualElement) { const state = [{}, {}]; visualElement === null || visualElement === void 0 ? void 0 : visualElement.values.forEach((value, key) => { @@ -17387,7 +17927,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/use-constant.mjs +;// ./node_modules/framer-motion/dist/es/utils/use-constant.mjs /** @@ -17407,14 +17947,14 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/animation/utils/is-keyframes-target.mjs +;// ./node_modules/framer-motion/dist/es/animation/utils/is-keyframes-target.mjs const isKeyframesTarget = (v) => { return Array.isArray(v); }; -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/resolve-value.mjs +;// ./node_modules/framer-motion/dist/es/utils/resolve-value.mjs const isCustomValue = (v) => { @@ -17427,7 +17967,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/value/utils/resolve-motion-value.mjs +;// ./node_modules/framer-motion/dist/es/value/utils/resolve-motion-value.mjs @@ -17445,7 +17985,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/motion/utils/use-visual-state.mjs +;// ./node_modules/framer-motion/dist/es/motion/utils/use-visual-state.mjs @@ -17528,12 +18068,12 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/noop.mjs +;// ./node_modules/framer-motion/dist/es/utils/noop.mjs const noop_noop = (any) => any; -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/frameloop/frame.mjs +;// ./node_modules/framer-motion/dist/es/frameloop/frame.mjs @@ -17541,7 +18081,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/svg/config-motion.mjs +;// ./node_modules/framer-motion/dist/es/render/svg/config-motion.mjs @@ -17583,7 +18123,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/html/config-motion.mjs +;// ./node_modules/framer-motion/dist/es/render/html/config-motion.mjs @@ -17597,7 +18137,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/dom/utils/create-config.mjs +;// ./node_modules/framer-motion/dist/es/render/dom/utils/create-config.mjs @@ -17618,7 +18158,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/events/add-dom-event.mjs +;// ./node_modules/framer-motion/dist/es/events/add-dom-event.mjs function addDomEvent(target, eventName, handler, options = { passive: true }) { target.addEventListener(eventName, handler, options); return () => target.removeEventListener(eventName, handler); @@ -17626,7 +18166,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/events/utils/is-primary-pointer.mjs +;// ./node_modules/framer-motion/dist/es/events/utils/is-primary-pointer.mjs const isPrimaryPointer = (event) => { if (event.pointerType === "mouse") { return typeof event.button !== "number" || event.button <= 0; @@ -17646,7 +18186,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/events/event-info.mjs +;// ./node_modules/framer-motion/dist/es/events/event-info.mjs function extractEventInfo(event, pointType = "page") { @@ -17663,7 +18203,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/events/add-pointer-event.mjs +;// ./node_modules/framer-motion/dist/es/events/add-pointer-event.mjs @@ -17673,7 +18213,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/pipe.mjs +;// ./node_modules/framer-motion/dist/es/utils/pipe.mjs /** * Pipe * Compose other transformers to run linearily @@ -17686,7 +18226,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/gestures/drag/utils/lock.mjs +;// ./node_modules/framer-motion/dist/es/gestures/drag/utils/lock.mjs function createLock(name) { let lock = null; return () => { @@ -17741,7 +18281,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/motion/features/Feature.mjs +;// ./node_modules/framer-motion/dist/es/motion/features/Feature.mjs class Feature { constructor(node) { this.isMounted = false; @@ -17752,7 +18292,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/gestures/hover.mjs +;// ./node_modules/framer-motion/dist/es/gestures/hover.mjs @@ -17787,7 +18327,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/gestures/focus.mjs +;// ./node_modules/framer-motion/dist/es/gestures/focus.mjs @@ -17830,7 +18370,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/gestures/utils/is-node-or-child.mjs +;// ./node_modules/framer-motion/dist/es/gestures/utils/is-node-or-child.mjs /** * Recursively traverse up the tree to check whether the provided child node * is the parent or a descendant of it. @@ -17852,7 +18392,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/gestures/press.mjs +;// ./node_modules/framer-motion/dist/es/gestures/press.mjs @@ -17984,7 +18524,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/motion/features/viewport/observers.mjs +;// ./node_modules/framer-motion/dist/es/motion/features/viewport/observers.mjs /** * Map an IntersectionHandler callback to an element. We only ever make one handler for one * element, so even though these handlers might all be triggered by different @@ -18035,7 +18575,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/motion/features/viewport/index.mjs +;// ./node_modules/framer-motion/dist/es/motion/features/viewport/index.mjs @@ -18109,7 +18649,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/motion/features/gestures.mjs +;// ./node_modules/framer-motion/dist/es/motion/features/gestures.mjs @@ -18132,7 +18672,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/shallow-compare.mjs +;// ./node_modules/framer-motion/dist/es/utils/shallow-compare.mjs function shallowCompare(next, prev) { if (!Array.isArray(prev)) return false; @@ -18148,7 +18688,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/utils/resolve-dynamic-variants.mjs +;// ./node_modules/framer-motion/dist/es/render/utils/resolve-dynamic-variants.mjs function resolveVariant(visualElement, definition, custom) { @@ -18158,7 +18698,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/time-conversion.mjs +;// ./node_modules/framer-motion/dist/es/utils/time-conversion.mjs /** * Converts seconds to milliseconds * @@ -18170,7 +18710,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/animation/utils/default-transitions.mjs +;// ./node_modules/framer-motion/dist/es/animation/utils/default-transitions.mjs const underDampedSpring = { @@ -18212,7 +18752,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/animation/utils/transitions.mjs +;// ./node_modules/framer-motion/dist/es/animation/utils/transitions.mjs /** * Decide whether a transition is defined on a given Transition. * This filters out orchestration options and returns true @@ -18229,14 +18769,14 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/use-instant-transition-state.mjs +;// ./node_modules/framer-motion/dist/es/utils/use-instant-transition-state.mjs const instantAnimationState = { current: false, }; -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/animation/animators/waapi/utils/get-final-keyframe.mjs +;// ./node_modules/framer-motion/dist/es/animation/animators/waapi/utils/get-final-keyframe.mjs const isNotNull = (value) => value !== null; function getFinalKeyframe(keyframes, { repeat, repeatType = "loop" }, finalKeyframe) { const resolvedKeyframes = keyframes.filter(isNotNull); @@ -18250,7 +18790,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/frameloop/sync-time.mjs +;// ./node_modules/framer-motion/dist/es/frameloop/sync-time.mjs @@ -18283,7 +18823,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/is-zero-value-string.mjs +;// ./node_modules/framer-motion/dist/es/utils/is-zero-value-string.mjs /** * Check if the value is a zero value string like "0px" or "0%" */ @@ -18291,7 +18831,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/animation/utils/is-none.mjs +;// ./node_modules/framer-motion/dist/es/animation/utils/is-none.mjs function isNone(value) { @@ -18308,7 +18848,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/errors.mjs +;// ./node_modules/framer-motion/dist/es/utils/errors.mjs let warning = noop_noop; @@ -18317,7 +18857,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/is-numerical-string.mjs +;// ./node_modules/framer-motion/dist/es/utils/is-numerical-string.mjs /** * Check if value is a numerical string, ie a string that is purely a number eg "100" or "-100.1" */ @@ -18325,7 +18865,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/dom/utils/css-variables-conversion.mjs +;// ./node_modules/framer-motion/dist/es/render/dom/utils/css-variables-conversion.mjs @@ -18369,7 +18909,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/dom/utils/unit-conversion.mjs +;// ./node_modules/framer-motion/dist/es/render/dom/utils/unit-conversion.mjs @@ -18436,7 +18976,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/dom/value-types/test.mjs +;// ./node_modules/framer-motion/dist/es/render/dom/value-types/test.mjs /** * Tests a provided value against a ValueType */ @@ -18444,7 +18984,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/dom/value-types/type-auto.mjs +;// ./node_modules/framer-motion/dist/es/render/dom/value-types/type-auto.mjs /** * ValueType for "auto" */ @@ -18455,7 +18995,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/dom/value-types/dimensions.mjs +;// ./node_modules/framer-motion/dist/es/render/dom/value-types/dimensions.mjs @@ -18472,7 +19012,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/utils/KeyframesResolver.mjs +;// ./node_modules/framer-motion/dist/es/render/utils/KeyframesResolver.mjs @@ -18638,7 +19178,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/value/types/color/utils.mjs +;// ./node_modules/framer-motion/dist/es/value/types/color/utils.mjs /** @@ -18663,7 +19203,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/value/types/color/rgba.mjs +;// ./node_modules/framer-motion/dist/es/value/types/color/rgba.mjs @@ -18690,7 +19230,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/value/types/color/hex.mjs +;// ./node_modules/framer-motion/dist/es/value/types/color/hex.mjs @@ -18732,7 +19272,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/value/types/color/hsla.mjs +;// ./node_modules/framer-motion/dist/es/value/types/color/hsla.mjs @@ -18756,7 +19296,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/value/types/color/index.mjs +;// ./node_modules/framer-motion/dist/es/value/types/color/index.mjs @@ -18786,7 +19326,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/value/types/complex/index.mjs +;// ./node_modules/framer-motion/dist/es/value/types/complex/index.mjs @@ -18878,7 +19418,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/value/types/complex/filter.mjs +;// ./node_modules/framer-motion/dist/es/value/types/complex/filter.mjs @@ -18910,7 +19450,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/dom/value-types/defaults.mjs +;// ./node_modules/framer-motion/dist/es/render/dom/value-types/defaults.mjs @@ -18942,7 +19482,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/dom/value-types/animatable-none.mjs +;// ./node_modules/framer-motion/dist/es/render/dom/value-types/animatable-none.mjs @@ -18959,7 +19499,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/html/utils/make-none-animatable.mjs +;// ./node_modules/framer-motion/dist/es/render/html/utils/make-none-animatable.mjs @@ -18991,7 +19531,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/dom/DOMKeyframesResolver.mjs +;// ./node_modules/framer-motion/dist/es/render/dom/DOMKeyframesResolver.mjs @@ -19120,7 +19660,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/memo.mjs +;// ./node_modules/framer-motion/dist/es/utils/memo.mjs function memo(callback) { let result; return () => { @@ -19132,7 +19672,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/animation/utils/is-animatable.mjs +;// ./node_modules/framer-motion/dist/es/animation/utils/is-animatable.mjs /** @@ -19164,7 +19704,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/animation/animators/utils/can-animate.mjs +;// ./node_modules/framer-motion/dist/es/animation/animators/utils/can-animate.mjs @@ -19206,7 +19746,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/animation/animators/BaseAnimation.mjs +;// ./node_modules/framer-motion/dist/es/animation/animators/BaseAnimation.mjs @@ -19292,7 +19832,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/velocity-per-second.mjs +;// ./node_modules/framer-motion/dist/es/utils/velocity-per-second.mjs /* Convert velocity into velocity per second @@ -19305,7 +19845,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/animation/generators/utils/velocity.mjs +;// ./node_modules/framer-motion/dist/es/animation/generators/utils/velocity.mjs const velocitySampleDuration = 5; // ms @@ -19316,7 +19856,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/animation/generators/spring/find.mjs +;// ./node_modules/framer-motion/dist/es/animation/generators/spring/find.mjs @@ -19407,7 +19947,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/animation/generators/spring/index.mjs +;// ./node_modules/framer-motion/dist/es/animation/generators/spring/index.mjs @@ -19540,7 +20080,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/animation/generators/inertia.mjs +;// ./node_modules/framer-motion/dist/es/animation/generators/inertia.mjs @@ -19629,7 +20169,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/easing/cubic-bezier.mjs +;// ./node_modules/framer-motion/dist/es/easing/cubic-bezier.mjs /* @@ -19682,7 +20222,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/easing/ease.mjs +;// ./node_modules/framer-motion/dist/es/easing/ease.mjs const easeIn = cubicBezier(0.42, 0, 1, 1); @@ -19691,28 +20231,28 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/easing/utils/is-easing-array.mjs +;// ./node_modules/framer-motion/dist/es/easing/utils/is-easing-array.mjs const isEasingArray = (ease) => { return Array.isArray(ease) && typeof ease[0] !== "number"; }; -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/easing/modifiers/mirror.mjs +;// ./node_modules/framer-motion/dist/es/easing/modifiers/mirror.mjs // Accepts an easing function and returns a new one that outputs mirrored values for // the second half of the animation. Turns easeIn into easeInOut. const mirrorEasing = (easing) => (p) => p <= 0.5 ? easing(2 * p) / 2 : (2 - easing(2 * (1 - p))) / 2; -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/easing/modifiers/reverse.mjs +;// ./node_modules/framer-motion/dist/es/easing/modifiers/reverse.mjs // Accepts an easing function and returns a new one that outputs reversed values. // Turns easeIn into easeOut. const reverseEasing = (easing) => (p) => 1 - easing(1 - p); -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/easing/circ.mjs +;// ./node_modules/framer-motion/dist/es/easing/circ.mjs @@ -19722,7 +20262,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/easing/back.mjs +;// ./node_modules/framer-motion/dist/es/easing/back.mjs @@ -19733,14 +20273,14 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/easing/anticipate.mjs +;// ./node_modules/framer-motion/dist/es/easing/anticipate.mjs const anticipate = (p) => (p *= 2) < 1 ? 0.5 * backIn(p) : 0.5 * (2 - Math.pow(2, -10 * (p - 1))); -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/easing/utils/map.mjs +;// ./node_modules/framer-motion/dist/es/easing/utils/map.mjs @@ -19779,7 +20319,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/progress.mjs +;// ./node_modules/framer-motion/dist/es/utils/progress.mjs /* Progress within given range @@ -19799,7 +20339,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/mix/number.mjs +;// ./node_modules/framer-motion/dist/es/utils/mix/number.mjs /* Value in range from progress @@ -19827,7 +20367,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/hsla-to-rgba.mjs +;// ./node_modules/framer-motion/dist/es/utils/hsla-to-rgba.mjs // Adapted from https://gist.github.com/mjackson/5311256 function hueToRgb(p, q, t) { if (t < 0) @@ -19871,7 +20411,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/mix/color.mjs +;// ./node_modules/framer-motion/dist/es/utils/mix/color.mjs @@ -19914,7 +20454,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/mix/visibility.mjs +;// ./node_modules/framer-motion/dist/es/utils/mix/visibility.mjs const invisibleValues = new Set(["none", "hidden"]); /** * Returns a function that, when provided a progress value between 0 and 1, @@ -19932,7 +20472,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/mix/complex.mjs +;// ./node_modules/framer-motion/dist/es/utils/mix/complex.mjs @@ -20030,7 +20570,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/mix/index.mjs +;// ./node_modules/framer-motion/dist/es/utils/mix/index.mjs @@ -20046,7 +20586,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/interpolate.mjs +;// ./node_modules/framer-motion/dist/es/utils/interpolate.mjs @@ -20123,7 +20663,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/offsets/fill.mjs +;// ./node_modules/framer-motion/dist/es/utils/offsets/fill.mjs @@ -20137,7 +20677,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/offsets/default.mjs +;// ./node_modules/framer-motion/dist/es/utils/offsets/default.mjs function defaultOffset(arr) { @@ -20148,14 +20688,14 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/offsets/time.mjs +;// ./node_modules/framer-motion/dist/es/utils/offsets/time.mjs function convertOffsetToTimes(offset, duration) { return offset.map((o) => o * duration); } -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/animation/generators/keyframes.mjs +;// ./node_modules/framer-motion/dist/es/animation/generators/keyframes.mjs @@ -20208,7 +20748,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/animation/generators/utils/calc-duration.mjs +;// ./node_modules/framer-motion/dist/es/animation/generators/utils/calc-duration.mjs /** * Implement a practical max duration for keyframe generation * to prevent infinite loops @@ -20227,7 +20767,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/animation/animators/drivers/driver-frameloop.mjs +;// ./node_modules/framer-motion/dist/es/animation/animators/drivers/driver-frameloop.mjs @@ -20246,7 +20786,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/animation/animators/MainThreadAnimation.mjs +;// ./node_modules/framer-motion/dist/es/animation/animators/MainThreadAnimation.mjs @@ -20628,12 +21168,12 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/easing/utils/is-bezier-definition.mjs +;// ./node_modules/framer-motion/dist/es/easing/utils/is-bezier-definition.mjs const isBezierDefinition = (easing) => Array.isArray(easing) && typeof easing[0] === "number"; -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/animation/animators/waapi/easing.mjs +;// ./node_modules/framer-motion/dist/es/animation/animators/waapi/easing.mjs function isWaapiSupportedEasing(easing) { @@ -20675,7 +21215,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/animation/animators/waapi/index.mjs +;// ./node_modules/framer-motion/dist/es/animation/animators/waapi/index.mjs function animateStyle(element, valueName, keyframes, { delay = 0, duration = 300, repeat = 0, repeatType = "loop", ease, times, } = {}) { @@ -20700,7 +21240,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/animation/animators/AcceleratedAnimation.mjs +;// ./node_modules/framer-motion/dist/es/animation/animators/AcceleratedAnimation.mjs @@ -20997,7 +21537,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/animation/interfaces/motion-value.mjs +;// ./node_modules/framer-motion/dist/es/animation/interfaces/motion-value.mjs @@ -21108,7 +21648,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/value/use-will-change/is.mjs +;// ./node_modules/framer-motion/dist/es/value/use-will-change/is.mjs function isWillChangeMotionValue(value) { @@ -21117,7 +21657,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/array.mjs +;// ./node_modules/framer-motion/dist/es/utils/array.mjs function addUniqueItem(arr, item) { if (arr.indexOf(item) === -1) arr.push(item); @@ -21140,7 +21680,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/subscription-manager.mjs +;// ./node_modules/framer-motion/dist/es/utils/subscription-manager.mjs class SubscriptionManager { @@ -21182,7 +21722,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/value/index.mjs +;// ./node_modules/framer-motion/dist/es/value/index.mjs @@ -21501,7 +22041,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/utils/setters.mjs +;// ./node_modules/framer-motion/dist/es/render/utils/setters.mjs @@ -21530,7 +22070,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/animation/interfaces/visual-element-target.mjs +;// ./node_modules/framer-motion/dist/es/animation/interfaces/visual-element-target.mjs @@ -21613,7 +22153,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/animation/interfaces/visual-element-variant.mjs +;// ./node_modules/framer-motion/dist/es/animation/interfaces/visual-element-variant.mjs @@ -21681,7 +22221,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/animation/interfaces/visual-element.mjs +;// ./node_modules/framer-motion/dist/es/animation/interfaces/visual-element.mjs @@ -21712,7 +22252,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/utils/animation-state.mjs +;// ./node_modules/framer-motion/dist/es/render/utils/animation-state.mjs @@ -22038,7 +22578,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/motion/features/animation/index.mjs +;// ./node_modules/framer-motion/dist/es/motion/features/animation/index.mjs @@ -22078,7 +22618,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/motion/features/animation/exit.mjs +;// ./node_modules/framer-motion/dist/es/motion/features/animation/exit.mjs let id = 0; @@ -22111,7 +22651,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/motion/features/animations.mjs +;// ./node_modules/framer-motion/dist/es/motion/features/animations.mjs @@ -22126,7 +22666,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/distance.mjs +;// ./node_modules/framer-motion/dist/es/utils/distance.mjs const distance = (a, b) => Math.abs(a - b); function distance2D(a, b) { // Multi-dimensional @@ -22137,7 +22677,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/gestures/pan/PanSession.mjs +;// ./node_modules/framer-motion/dist/es/gestures/pan/PanSession.mjs @@ -22295,7 +22835,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/projection/geometry/delta-calc.mjs +;// ./node_modules/framer-motion/dist/es/projection/geometry/delta-calc.mjs function calcLength(axis) { @@ -22338,7 +22878,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/gestures/drag/utils/constraints.mjs +;// ./node_modules/framer-motion/dist/es/gestures/drag/utils/constraints.mjs @@ -22469,7 +23009,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/projection/geometry/models.mjs +;// ./node_modules/framer-motion/dist/es/projection/geometry/models.mjs const createAxisDelta = () => ({ translate: 0, scale: 1, @@ -22488,14 +23028,14 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/projection/utils/each-axis.mjs +;// ./node_modules/framer-motion/dist/es/projection/utils/each-axis.mjs function eachAxis(callback) { return [callback("x"), callback("y")]; } -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/projection/geometry/conversion.mjs +;// ./node_modules/framer-motion/dist/es/projection/geometry/conversion.mjs /** * Bounding boxes tend to be defined as top, left, right, bottom. For various operations * it's easier to consider each axis individually. This function returns a bounding box @@ -22530,7 +23070,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/projection/utils/has-transform.mjs +;// ./node_modules/framer-motion/dist/es/projection/utils/has-transform.mjs function isIdentityScale(scale) { return scale === undefined || scale === 1; } @@ -22558,7 +23098,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/projection/geometry/delta-apply.mjs +;// ./node_modules/framer-motion/dist/es/projection/geometry/delta-apply.mjs @@ -22682,7 +23222,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/projection/utils/measure.mjs +;// ./node_modules/framer-motion/dist/es/projection/utils/measure.mjs @@ -22701,7 +23241,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/get-context-window.mjs +;// ./node_modules/framer-motion/dist/es/utils/get-context-window.mjs // Fixes https://github.com/framer/motion/issues/2270 const getContextWindow = ({ current }) => { return current ? current.ownerDocument.defaultView : null; @@ -22709,7 +23249,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/gestures/drag/VisualElementDragControls.mjs +;// ./node_modules/framer-motion/dist/es/gestures/drag/VisualElementDragControls.mjs @@ -23195,7 +23735,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/gestures/drag/index.mjs +;// ./node_modules/framer-motion/dist/es/gestures/drag/index.mjs @@ -23224,7 +23764,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/gestures/pan/index.mjs +;// ./node_modules/framer-motion/dist/es/gestures/pan/index.mjs @@ -23276,7 +23816,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/components/AnimatePresence/use-presence.mjs +;// ./node_modules/framer-motion/dist/es/components/AnimatePresence/use-presence.mjs @@ -23344,7 +23884,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/projection/node/state.mjs +;// ./node_modules/framer-motion/dist/es/projection/node/state.mjs /** * This should only ever be modified on the client otherwise it'll * persist through server requests. If we need instanced states we @@ -23365,7 +23905,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/projection/styles/scale-border-radius.mjs +;// ./node_modules/framer-motion/dist/es/projection/styles/scale-border-radius.mjs function pixelsToPercent(pixels, axis) { @@ -23408,7 +23948,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/projection/styles/scale-box-shadow.mjs +;// ./node_modules/framer-motion/dist/es/projection/styles/scale-box-shadow.mjs @@ -23445,7 +23985,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/motion/features/layout/MeasureLayout.mjs +;// ./node_modules/framer-motion/dist/es/motion/features/layout/MeasureLayout.mjs @@ -23580,7 +24120,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/projection/animation/mix-values.mjs +;// ./node_modules/framer-motion/dist/es/projection/animation/mix-values.mjs @@ -23675,7 +24215,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/projection/geometry/copy.mjs +;// ./node_modules/framer-motion/dist/es/projection/geometry/copy.mjs /** * Reset an axis to the provided origin box. * @@ -23697,7 +24237,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/projection/geometry/delta-remove.mjs +;// ./node_modules/framer-motion/dist/es/projection/geometry/delta-remove.mjs @@ -23753,7 +24293,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/projection/geometry/utils.mjs +;// ./node_modules/framer-motion/dist/es/projection/geometry/utils.mjs function isAxisDeltaZero(delta) { @@ -23780,7 +24320,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/projection/shared/stack.mjs +;// ./node_modules/framer-motion/dist/es/projection/shared/stack.mjs class NodeStack { @@ -23894,7 +24434,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/projection/styles/transform.mjs +;// ./node_modules/framer-motion/dist/es/projection/styles/transform.mjs function buildProjectionTransform(delta, treeScale, latestTransform) { let transform = ""; /** @@ -23945,12 +24485,12 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/utils/compare-by-depth.mjs +;// ./node_modules/framer-motion/dist/es/render/utils/compare-by-depth.mjs const compareByDepth = (a, b) => a.depth - b.depth; -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/utils/flat-tree.mjs +;// ./node_modules/framer-motion/dist/es/render/utils/flat-tree.mjs @@ -23976,7 +24516,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/delay.mjs +;// ./node_modules/framer-motion/dist/es/utils/delay.mjs @@ -23998,7 +24538,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/debug/record.mjs +;// ./node_modules/framer-motion/dist/es/debug/record.mjs function record(data) { if (window.MotionDebug) { window.MotionDebug.record(data); @@ -24007,14 +24547,14 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/dom/utils/is-svg-element.mjs +;// ./node_modules/framer-motion/dist/es/render/dom/utils/is-svg-element.mjs function isSVGElement(element) { return element instanceof SVGElement && element.tagName !== "svg"; } -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/animation/interfaces/single-value.mjs +;// ./node_modules/framer-motion/dist/es/animation/interfaces/single-value.mjs @@ -24027,7 +24567,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/projection/node/create-projection-node.mjs +;// ./node_modules/framer-motion/dist/es/projection/node/create-projection-node.mjs @@ -25554,7 +26094,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/projection/node/DocumentProjectionNode.mjs +;// ./node_modules/framer-motion/dist/es/projection/node/DocumentProjectionNode.mjs @@ -25569,7 +26109,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/projection/node/HTMLProjectionNode.mjs +;// ./node_modules/framer-motion/dist/es/projection/node/HTMLProjectionNode.mjs @@ -25598,7 +26138,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/motion/features/drag.mjs +;// ./node_modules/framer-motion/dist/es/motion/features/drag.mjs @@ -25617,14 +26157,14 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/reduced-motion/state.mjs +;// ./node_modules/framer-motion/dist/es/utils/reduced-motion/state.mjs // Does this device prefer reduced motion? Returns `null` server-side. const prefersReducedMotion = { current: null }; const hasReducedMotionListener = { current: false }; -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/reduced-motion/index.mjs +;// ./node_modules/framer-motion/dist/es/utils/reduced-motion/index.mjs @@ -25645,7 +26185,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/utils/motion-values.mjs +;// ./node_modules/framer-motion/dist/es/render/utils/motion-values.mjs @@ -25712,12 +26252,12 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/store.mjs +;// ./node_modules/framer-motion/dist/es/render/store.mjs const visualElementStore = new WeakMap(); -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/dom/value-types/find.mjs +;// ./node_modules/framer-motion/dist/es/render/dom/value-types/find.mjs @@ -25734,7 +26274,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/VisualElement.mjs +;// ./node_modules/framer-motion/dist/es/render/VisualElement.mjs @@ -26271,7 +26811,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/dom/DOMVisualElement.mjs +;// ./node_modules/framer-motion/dist/es/render/dom/DOMVisualElement.mjs @@ -26301,7 +26841,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/html/HTMLVisualElement.mjs +;// ./node_modules/framer-motion/dist/es/render/html/HTMLVisualElement.mjs @@ -26362,7 +26902,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/svg/SVGVisualElement.mjs +;// ./node_modules/framer-motion/dist/es/render/svg/SVGVisualElement.mjs @@ -26411,7 +26951,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/dom/create-visual-element.mjs +;// ./node_modules/framer-motion/dist/es/render/dom/create-visual-element.mjs @@ -26428,7 +26968,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/motion/features/layout.mjs +;// ./node_modules/framer-motion/dist/es/motion/features/layout.mjs @@ -26441,7 +26981,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/render/dom/motion.mjs +;// ./node_modules/framer-motion/dist/es/render/dom/motion.mjs @@ -26485,7 +27025,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/use-is-mounted.mjs +;// ./node_modules/framer-motion/dist/es/utils/use-is-mounted.mjs @@ -26502,7 +27042,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/use-force-update.mjs +;// ./node_modules/framer-motion/dist/es/utils/use-force-update.mjs @@ -26523,7 +27063,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/components/AnimatePresence/PopChild.mjs +;// ./node_modules/framer-motion/dist/es/components/AnimatePresence/PopChild.mjs @@ -26601,7 +27141,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/components/AnimatePresence/PresenceChild.mjs +;// ./node_modules/framer-motion/dist/es/components/AnimatePresence/PresenceChild.mjs @@ -26660,7 +27200,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/utils/use-unmount-effect.mjs +;// ./node_modules/framer-motion/dist/es/utils/use-unmount-effect.mjs function useUnmountEffect(callback) { @@ -26669,7 +27209,7 @@ -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/components/AnimatePresence/index.mjs +;// ./node_modules/framer-motion/dist/es/components/AnimatePresence/index.mjs @@ -26836,7 +27376,7 @@ -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/utils/use-responsive-value.js +;// ./node_modules/@wordpress/components/build-module/utils/use-responsive-value.js /** * WordPress dependencies */ @@ -26888,49 +27428,7 @@ index >= array.length ? array.length - 1 : index]; } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/utils/space.js -/** - * The argument value for the `space()` utility function. - * - * When this is a number or a numeric string, it will be interpreted as a - * multiplier for the grid base value (4px). For example, `space( 2 )` will be 8px. - * - * Otherwise, it will be interpreted as a literal CSS length value. For example, - * `space( 'auto' )` will be 'auto', and `space( '2px' )` will be 2px. - */ - -const GRID_BASE = '4px'; - -/** - * A function that handles numbers, numeric strings, and unit values. - * - * When given a number or a numeric string, it will return the grid-based - * value as a factor of GRID_BASE, defined above. - * - * When given a unit value or one of the named CSS values like `auto`, - * it will simply return the value back. - * - * @param value A number, numeric string, or a unit value. - */ -function space(value) { - if (typeof value === 'undefined') { - return undefined; - } - - // Handle empty strings, if it's the number 0 this still works. - if (!value) { - return '0'; - } - const asInt = typeof value === 'number' ? value : Number(value); - - // 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. - if (typeof window !== 'undefined' && window.CSS?.supports?.('margin', value.toString()) || Number.isNaN(asInt)) { - return value.toString(); - } - return `calc(${GRID_BASE} * ${value})`; -} - -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/flex/styles.js +;// ./node_modules/@wordpress/components/build-module/flex/styles.js 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)."; } /** * External dependencies @@ -26970,7 +27468,7 @@ styles: ">*{min-width:0;}" } : 0; -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/flex/flex/hook.js +;// ./node_modules/@wordpress/components/build-module/flex/flex/hook.js /** * External dependencies */ @@ -27042,7 +27540,7 @@ }; } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/flex/context.js +;// ./node_modules/@wordpress/components/build-module/flex/context.js /** * WordPress dependencies */ @@ -27052,7 +27550,7 @@ }); const useFlexContext = () => (0,external_wp_element_namespaceObject.useContext)(FlexContext); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/flex/flex/component.js +;// ./node_modules/@wordpress/components/build-module/flex/flex/component.js /** * External dependencies */ @@ -27112,7 +27610,7 @@ const component_Flex = contextConnect(UnconnectedFlex, 'Flex'); /* harmony default export */ const flex_component = (component_Flex); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/flex/flex-item/hook.js +;// ./node_modules/@wordpress/components/build-module/flex/flex-item/hook.js /** * External dependencies */ @@ -27147,7 +27645,7 @@ }; } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/flex/flex-block/hook.js +;// ./node_modules/@wordpress/components/build-module/flex/flex-block/hook.js /** * Internal dependencies */ @@ -27163,7 +27661,7 @@ return flexItemProps; } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/flex/flex-block/component.js +;// ./node_modules/@wordpress/components/build-module/flex/flex-block/component.js /** * External dependencies */ @@ -27203,7 +27701,7 @@ const FlexBlock = contextConnect(UnconnectedFlexBlock, 'FlexBlock'); /* harmony default export */ const flex_block_component = (FlexBlock); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/utils/rtl.js +;// ./node_modules/@wordpress/components/build-module/utils/rtl.js /** * External dependencies */ @@ -27292,20 +27790,22 @@ */ rtl.watch = () => (0,external_wp_i18n_namespaceObject.isRTL)(); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/spacer/hook.js -/** - * External dependencies - */ - - -/** - * Internal dependencies - */ - - - - -const isDefined = o => typeof o !== 'undefined' && o !== null; +;// ./node_modules/@wordpress/components/build-module/spacer/hook.js +/** + * External dependencies + */ + + +/** + * Internal dependencies + */ + + + + +function isDefined(o) { + return typeof o !== 'undefined' && o !== null; +} function useSpacer(props) { const { className, @@ -27341,7 +27841,7 @@ }; } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/spacer/component.js +;// ./node_modules/@wordpress/components/build-module/spacer/component.js /** * External dependencies */ @@ -27389,7 +27889,7 @@ const Spacer = contextConnect(UnconnectedSpacer, 'Spacer'); /* harmony default export */ const spacer_component = (Spacer); -;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/plus.js +;// ./node_modules/@wordpress/icons/build-module/library/plus.js /** * WordPress dependencies */ @@ -27404,7 +27904,7 @@ }); /* harmony default export */ const library_plus = (plus); -;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/reset.js +;// ./node_modules/@wordpress/icons/build-module/library/reset.js /** * WordPress dependencies */ @@ -27419,7 +27919,7 @@ }); /* harmony default export */ const library_reset = (reset_reset); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/flex/flex-item/component.js +;// ./node_modules/@wordpress/components/build-module/flex/flex-item/component.js /** * External dependencies */ @@ -27459,7 +27959,7 @@ const FlexItem = contextConnect(UnconnectedFlexItem, 'FlexItem'); /* harmony default export */ const flex_item_component = (FlexItem); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/truncate/styles.js +;// ./node_modules/@wordpress/components/build-module/truncate/styles.js 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)."; } /** * External dependencies @@ -27470,7 +27970,7 @@ styles: "display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap" } : 0; -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/utils/values.js +;// ./node_modules/@wordpress/components/build-module/utils/values.js /* eslint-disable jsdoc/valid-types */ /** * Determines if a value is null or undefined. @@ -27534,7 +28034,7 @@ return typeof value === 'string' ? stringToNumber(value) : value; }; -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/truncate/utils.js +;// ./node_modules/@wordpress/components/build-module/truncate/utils.js /** * Internal dependencies */ @@ -27607,7 +28107,7 @@ return truncatedContent; } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/truncate/hook.js +;// ./node_modules/@wordpress/components/build-module/truncate/hook.js /** * External dependencies */ @@ -27664,13 +28164,13 @@ }; } -;// CONCATENATED MODULE: ./node_modules/colord/index.mjs +;// ./node_modules/colord/index.mjs 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=.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()})}; -;// CONCATENATED MODULE: ./node_modules/colord/plugins/names.mjs +;// ./node_modules/colord/plugins/names.mjs /* 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} [highlightClassName=''] Classname to apply to highlighted text or a Record of classnames to apply to given text (which should be the key). * @property {import('react').AllHTMLAttributes['style']} [highlightStyle={}] Styles to apply to highlighted text. * @property {keyof JSX.IntrinsicElements} [highlightTag='mark'] Tag to use for the highlighted text. - * @property {import('highlight-words-core').FindAllArgs['sanitize']} [sanitize] Custom `santize` function to pass to `highlight-words-core`. + * @property {import('highlight-words-core').FindAllArgs['sanitize']} [sanitize] Custom `sanitize` function to pass to `highlight-words-core`. * @property {string[]} [searchWords=[]] Words to search for and highlight. * @property {string} [unhighlightClassName=''] Classname to apply to unhighlighted text. * @property {import('react').AllHTMLAttributes['style']} [unhighlightStyle] Style to apply to unhighlighted text. @@ -28042,7 +28459,7 @@ return textContent; } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/utils/font-size.js +;// ./node_modules/@wordpress/components/build-module/utils/font-size.js /** * External dependencies */ @@ -28083,7 +28500,7 @@ return config_values[headingSize]; } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/text/get-line-height.js +;// ./node_modules/@wordpress/components/build-module/text/get-line-height.js /** * External dependencies */ @@ -28118,7 +28535,7 @@ return value; } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/text/hook.js +;// ./node_modules/@wordpress/components/build-module/text/hook.js 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)."; } /** * External dependencies @@ -28208,6 +28625,8 @@ sx.optimalTextColor = null; if (optimizeReadabilityFor) { const isOptimalTextColorDark = getOptimalTextShade(optimizeReadabilityFor) === 'dark'; + + // Should not use theme colors sx.optimalTextColor = isOptimalTextColorDark ? /*#__PURE__*/emotion_react_browser_esm_css({ color: COLORS.gray[900] }, true ? "" : 0, true ? "" : 0) : /*#__PURE__*/emotion_react_browser_esm_css({ @@ -28254,7 +28673,7 @@ }; } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/text/component.js +;// ./node_modules/@wordpress/components/build-module/text/component.js /** * Internal dependencies */ @@ -28295,7 +28714,7 @@ const component_Text = contextConnect(UnconnectedText, 'Text'); /* harmony default export */ const text_component = (component_Text); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/utils/base-label.js +;// ./node_modules/@wordpress/components/build-module/utils/base-label.js 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)."; } /** * External dependencies @@ -28309,7 +28728,7 @@ styles: "font-size:11px;font-weight:500;line-height:1.4;text-transform:uppercase" } : 0; -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/input-control/styles/input-control-styles.js +;// ./node_modules/@wordpress/components/build-module/input-control/styles/input-control-styles.js 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)."; } /** @@ -28325,15 +28744,14 @@ - const Prefix = /*#__PURE__*/emotion_styled_base_browser_esm("span", true ? { - target: "em5sgkm7" + target: "em5sgkm8" } : 0)( true ? { name: "pvvbxf", styles: "box-sizing:border-box;display:block" } : 0); const Suffix = /*#__PURE__*/emotion_styled_base_browser_esm("span", true ? { - target: "em5sgkm6" + target: "em5sgkm7" } : 0)( true ? { name: "jgf79h", styles: "align-items:center;align-self:stretch;box-sizing:border-box;display:flex" @@ -28351,13 +28769,13 @@ return COLORS.ui.border; }; const BackdropUI = /*#__PURE__*/emotion_styled_base_browser_esm("div", true ? { - target: "em5sgkm5" + target: "em5sgkm6" } : 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({ paddingLeft: 2 }), ";}" + ( true ? "" : 0)); -const input_control_styles_Root = /*#__PURE__*/emotion_styled_base_browser_esm(flex_component, true ? { - target: "em5sgkm4" -} : 0)("box-sizing:border-box;position:relative;border-radius:2px;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)); +const Root = /*#__PURE__*/emotion_styled_base_browser_esm(flex_component, true ? { + target: "em5sgkm5" +} : 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)); const containerDisabledStyles = ({ disabled }) => { @@ -28390,7 +28808,7 @@ }, true ? "" : 0, true ? "" : 0); }; const Container = /*#__PURE__*/emotion_styled_base_browser_esm("div", true ? { - target: "em5sgkm3" + target: "em5sgkm4" } : 0)("align-items:center;box-sizing:border-box;border-radius:inherit;display:flex;flex:1;position:relative;", containerDisabledStyles, " ", containerWidthStyles, ";" + ( true ? "" : 0)); const disabledStyles = ({ disabled @@ -28428,29 +28846,29 @@ height: 40, lineHeight: 1, minHeight: 40, - paddingLeft: space(4), - paddingRight: space(4) + paddingLeft: config_values.controlPaddingX, + paddingRight: config_values.controlPaddingX }, small: { height: 24, lineHeight: 1, minHeight: 24, - paddingLeft: space(2), - paddingRight: space(2) + paddingLeft: config_values.controlPaddingXSmall, + paddingRight: config_values.controlPaddingXSmall }, compact: { height: 32, lineHeight: 1, minHeight: 32, - paddingLeft: space(2), - paddingRight: space(2) + paddingLeft: config_values.controlPaddingXSmall, + paddingRight: config_values.controlPaddingXSmall }, '__unstable-large': { height: 40, lineHeight: 1, minHeight: 40, - paddingLeft: space(4), - paddingRight: space(4) + paddingLeft: config_values.controlPaddingX, + paddingRight: config_values.controlPaddingX } }; if (!__next40pxDefaultSize) { @@ -28489,23 +28907,51 @@ // https://github.com/WordPress/gutenberg/issues/18483 const Input = /*#__PURE__*/emotion_styled_base_browser_esm("input", true ? { + target: "em5sgkm3" +} : 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{color:", COLORS.ui.darkGrayPlaceholder, ";}&::-moz-placeholder{color:", COLORS.ui.darkGrayPlaceholder, ";}&:-ms-input-placeholder{color:", COLORS.ui.darkGrayPlaceholder, ";}&[type='email'],&[type='url']{direction:ltr;}}" + ( true ? "" : 0)); +const BaseLabel = /*#__PURE__*/emotion_styled_base_browser_esm(text_component, true ? { target: "em5sgkm2" -} : 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)); -const BaseLabel = /*#__PURE__*/emotion_styled_base_browser_esm(text_component, true ? { - target: "em5sgkm1" } : 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)); const Label = props => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BaseLabel, { ...props, as: "label" }); const LabelWrapper = /*#__PURE__*/emotion_styled_base_browser_esm(flex_item_component, true ? { - target: "em5sgkm0" + target: "em5sgkm1" } : 0)( true ? { name: "1b6uupn", styles: "max-width:calc( 100% - 10px )" } : 0); - -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/input-control/backdrop.js +const prefixSuffixWrapperStyles = ({ + variant = 'default', + size, + __next40pxDefaultSize, + isPrefix +}) => { + const { + paddingLeft: padding + } = getSizeConfig({ + inputSize: size, + __next40pxDefaultSize + }); + const paddingProperty = isPrefix ? 'paddingInlineStart' : 'paddingInlineEnd'; + if (variant === 'default') { + return /*#__PURE__*/emotion_react_browser_esm_css({ + [paddingProperty]: padding + }, true ? "" : 0, true ? "" : 0); + } + + // If variant is 'icon' or 'control' + return /*#__PURE__*/emotion_react_browser_esm_css({ + display: 'flex', + [paddingProperty]: padding - 4 + }, true ? "" : 0, true ? "" : 0); +}; +const PrefixSuffixWrapper = /*#__PURE__*/emotion_styled_base_browser_esm("div", true ? { + target: "em5sgkm0" +} : 0)(prefixSuffixWrapperStyles, ";" + ( true ? "" : 0)); + +;// ./node_modules/@wordpress/components/build-module/input-control/backdrop.js /** * WordPress dependencies */ @@ -28529,7 +28975,7 @@ const MemoizedBackdrop = (0,external_wp_element_namespaceObject.memo)(Backdrop); /* harmony default export */ const backdrop = (MemoizedBackdrop); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/input-control/label.js +;// ./node_modules/@wordpress/components/build-module/input-control/label.js /** * Internal dependencies */ @@ -28561,7 +29007,7 @@ }); } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/utils/use-deprecated-props.js +;// ./node_modules/@wordpress/components/build-module/utils/use-deprecated-props.js function useDeprecated36pxDefaultSizeProp(props) { const { __next36pxDefaultSize, @@ -28574,21 +29020,20 @@ }; } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/input-control/input-base.js -/** - * External dependencies - */ - -/** - * WordPress dependencies - */ - - - -/** - * Internal dependencies - */ - +;// ./node_modules/@wordpress/components/build-module/input-control/input-base.js +/** + * External dependencies + */ + +/** + * WordPress dependencies + */ + + + +/** + * Internal dependencies + */ @@ -28640,27 +29085,22 @@ } = useDeprecated36pxDefaultSizeProp(useContextSystem(props, 'InputBase')); const id = useUniqueId(idProp); const hideLabel = hideLabelFromVision || !label; - const { - paddingLeft, - paddingRight - } = getSizeConfig({ - inputSize: size, - __next40pxDefaultSize - }); const prefixSuffixContextValue = (0,external_wp_element_namespaceObject.useMemo)(() => { return { InputControlPrefixWrapper: { - paddingLeft + __next40pxDefaultSize, + size }, InputControlSuffixWrapper: { - paddingRight - } - }; - }, [paddingLeft, paddingRight]); + __next40pxDefaultSize, + size + } + }; + }, [__next40pxDefaultSize, size]); return ( /*#__PURE__*/ // @ts-expect-error The `direction` prop from Flex (FlexDirection) conflicts with legacy SVGAttributes `direction` (string) that come from React intrinsic prop definitions. - (0,external_ReactJSXRuntime_namespaceObject.jsxs)(input_control_styles_Root, { + (0,external_ReactJSXRuntime_namespaceObject.jsxs)(Root, { ...restProps, ...getUIFlexProps(labelPosition), className: className, @@ -28702,7 +29142,7 @@ */ /* harmony default export */ const input_base = (contextConnect(InputBase, 'InputBase')); -;// CONCATENATED MODULE: ./node_modules/@use-gesture/core/dist/maths-0ab39ae9.esm.js +;// ./node_modules/@use-gesture/core/dist/maths-0ab39ae9.esm.js function maths_0ab39ae9_esm_clamp(v, min, max) { return Math.max(min, Math.min(v, max)); } @@ -28743,7 +29183,7 @@ -;// CONCATENATED MODULE: ./node_modules/@use-gesture/core/dist/actions-fe213e88.esm.js +;// ./node_modules/@use-gesture/core/dist/actions-fe213e88.esm.js function _toPrimitive(input, hint) { @@ -28777,7 +29217,7 @@ return obj; } -function ownKeys(e, r) { +function actions_fe213e88_esm_ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); @@ -28790,9 +29230,9 @@ function _objectSpread2(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; - r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { + r % 2 ? actions_fe213e88_esm_ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); - }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { + }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : actions_fe213e88_esm_ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } @@ -30143,7 +30583,7 @@ -;// CONCATENATED MODULE: ./node_modules/@use-gesture/core/dist/use-gesture-core.esm.js +;// ./node_modules/@use-gesture/core/dist/use-gesture-core.esm.js @@ -30464,7 +30904,7 @@ -;// CONCATENATED MODULE: ./node_modules/@use-gesture/react/dist/use-gesture-react.esm.js +;// ./node_modules/@use-gesture/react/dist/use-gesture-react.esm.js @@ -30547,7 +30987,7 @@ -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/input-control/utils.js +;// ./node_modules/@wordpress/components/build-module/input-control/utils.js /** * External dependencies */ @@ -30603,7 +31043,7 @@ return dragCursor; } function useDraft(props) { - const refPreviousValue = (0,external_wp_element_namespaceObject.useRef)(props.value); + const previousValueRef = (0,external_wp_element_namespaceObject.useRef)(props.value); const [draft, setDraft] = (0,external_wp_element_namespaceObject.useState)({}); const value = draft.value !== undefined ? draft.value : props.value; @@ -30613,8 +31053,8 @@ (0,external_wp_element_namespaceObject.useLayoutEffect)(() => { const { current: previousValue - } = refPreviousValue; - refPreviousValue.current = props.value; + } = previousValueRef; + previousValueRef.current = props.value; if (draft.value !== undefined && !draft.isStale) { setDraft({ ...draft, @@ -30643,7 +31083,7 @@ }; } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/input-control/reducer/state.js +;// ./node_modules/@wordpress/components/build-module/input-control/reducer/state.js /** * External dependencies */ @@ -30663,7 +31103,7 @@ value: '' }; -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/input-control/reducer/actions.js +;// ./node_modules/@wordpress/components/build-module/input-control/reducer/actions.js /** * External dependencies */ @@ -30684,7 +31124,7 @@ const PRESS_UP = 'PRESS_UP'; const RESET = 'RESET'; -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/input-control/reducer/reducer.js +;// ./node_modules/@wordpress/components/build-module/input-control/reducer/reducer.js /** * External dependencies */ @@ -30861,8 +31301,8 @@ const pressUp = createKeyEvent(PRESS_UP); const pressDown = createKeyEvent(PRESS_DOWN); const pressEnter = createKeyEvent(PRESS_ENTER); - const currentState = (0,external_wp_element_namespaceObject.useRef)(state); - const refProps = (0,external_wp_element_namespaceObject.useRef)({ + const currentStateRef = (0,external_wp_element_namespaceObject.useRef)(state); + const refPropsRef = (0,external_wp_element_namespaceObject.useRef)({ value: initialState.value, onChangeHandler }); @@ -30870,8 +31310,8 @@ // Freshens refs to props and state so that subsequent effects have access // to their latest values without their changes causing effect runs. (0,external_wp_element_namespaceObject.useLayoutEffect)(() => { - currentState.current = state; - refProps.current = { + currentStateRef.current = state; + refPropsRef.current = { value: initialState.value, onChangeHandler }; @@ -30879,17 +31319,17 @@ // Propagates the latest state through onChange. (0,external_wp_element_namespaceObject.useLayoutEffect)(() => { - if (currentState.current._event !== undefined && state.value !== refProps.current.value && !state.isDirty) { + if (currentStateRef.current._event !== undefined && state.value !== refPropsRef.current.value && !state.isDirty) { var _state$value; - refProps.current.onChangeHandler((_state$value = state.value) !== null && _state$value !== void 0 ? _state$value : '', { - event: currentState.current._event + refPropsRef.current.onChangeHandler((_state$value = state.value) !== null && _state$value !== void 0 ? _state$value : '', { + event: currentStateRef.current._event }); } }, [state.value, state.isDirty]); // Updates the state from props. (0,external_wp_element_namespaceObject.useLayoutEffect)(() => { - if (initialState.value !== currentState.current.value && !currentState.current.isDirty) { + if (initialState.value !== currentStateRef.current.value && !currentStateRef.current.isDirty) { var _initialState$value; dispatch({ type: CONTROL, @@ -30915,7 +31355,7 @@ }; } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/utils/with-ignore-ime-events.js +;// ./node_modules/@wordpress/components/build-module/utils/with-ignore-ime-events.js /** * A higher-order function that wraps a keydown event handler to ensure it is not an IME event. * @@ -30944,7 +31384,7 @@ }; } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/input-control/input-field.js +;// ./node_modules/@wordpress/components/build-module/input-control/input-field.js /** * External dependencies */ @@ -31145,7 +31585,7 @@ const ForwardedComponent = (0,external_wp_element_namespaceObject.forwardRef)(InputField); /* harmony default export */ const input_field = (ForwardedComponent); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/utils/font-values.js +;// ./node_modules/@wordpress/components/build-module/utils/font-values.js /* harmony default export */ const font_values = ({ 'default.fontFamily': "-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen-Sans, Ubuntu, Cantarell, 'Helvetica Neue', sans-serif", 'default.fontSize': '13px', @@ -31153,7 +31593,7 @@ mobileTextMinFontSize: '16px' }); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/utils/font.js +;// ./node_modules/@wordpress/components/build-module/utils/font.js /** * Internal dependencies */ @@ -31169,7 +31609,7 @@ return (_FONT$value = font_values[value]) !== null && _FONT$value !== void 0 ? _FONT$value : ''; } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/utils/box-sizing.js +;// ./node_modules/@wordpress/components/build-module/utils/box-sizing.js 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)."; } /** * External dependencies @@ -31180,7 +31620,7 @@ styles: "box-sizing:border-box;*,*::before,*::after{box-sizing:inherit;}" } : 0; -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/base-control/styles/base-control-styles.js +;// ./node_modules/@wordpress/components/build-module/base-control/styles/base-control-styles.js 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)."; } /** @@ -31194,7 +31634,7 @@ */ -const base_control_styles_Wrapper = /*#__PURE__*/emotion_styled_base_browser_esm("div", true ? { +const Wrapper = /*#__PURE__*/emotion_styled_base_browser_esm("div", true ? { target: "ej5x27r4" } : 0)("font-family:", font('default.fontFamily'), ";font-size:", font('default.fontSize'), ";", boxSizingReset, ";" + ( true ? "" : 0)); const deprecatedMarginField = ({ @@ -31205,7 +31645,7 @@ const StyledField = /*#__PURE__*/emotion_styled_base_browser_esm("div", true ? { target: "ej5x27r3" } : 0)(deprecatedMarginField, " .components-panel__row &{margin-bottom:inherit;}" + ( true ? "" : 0)); -const labelStyles = /*#__PURE__*/emotion_react_browser_esm_css(baseLabelTypography, ";display:inline-block;margin-bottom:", space(2), ";padding:0;" + ( true ? "" : 0), true ? "" : 0); +const labelStyles = /*#__PURE__*/emotion_react_browser_esm_css(baseLabelTypography, ";display:block;margin-bottom:", space(2), ";padding:0;" + ( true ? "" : 0), true ? "" : 0); const StyledLabel = /*#__PURE__*/emotion_styled_base_browser_esm("label", true ? { target: "ej5x27r2" } : 0)(labelStyles, ";" + ( true ? "" : 0)); @@ -31225,48 +31665,29 @@ target: "ej5x27r0" } : 0)(labelStyles, ";" + ( true ? "" : 0)); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/base-control/index.js -/** - * External dependencies - */ - - -/** - * Internal dependencies - */ - - - - - - - -/** - * `BaseControl` is a component used to generate labels and help text for components handling user inputs. - * - * ```jsx - * import { BaseControl, useBaseControlProps } from '@wordpress/components'; - * - * // Render a `BaseControl` for a textarea input - * const MyCustomTextareaControl = ({ children, ...baseProps }) => ( - * // `useBaseControlProps` is a convenience hook to get the props for the `BaseControl` - * // and the inner control itself. Namely, it takes care of generating a unique `id`, - * // properly associating it with the `label` and `help` elements. - * const { baseControlProps, controlProps } = useBaseControlProps( baseProps ); - * - * return ( - * - * - * - * ); - * ); - * ``` - */ +;// ./node_modules/@wordpress/components/build-module/base-control/index.js +/** + * External dependencies + */ + +/** + * WordPress dependencies + */ + + + +/** + * Internal dependencies + */ + + + + + const UnconnectedBaseControl = props => { const { __nextHasNoMarginBottom = false, + __associatedWPComponentName = 'BaseControl', id, label, hideLabelFromVision = false, @@ -31274,7 +31695,14 @@ className, children } = useContextSystem(props, 'BaseControl'); - return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(base_control_styles_Wrapper, { + if (!__nextHasNoMarginBottom) { + external_wp_deprecated_default()(`Bottom margin styles for wp.components.${__associatedWPComponentName}`, { + since: '6.7', + version: '7.0', + hint: 'Set the `__nextHasNoMarginBottom` prop to true to start opting into the new styles, which will become the default in a future version.' + }); + } + return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(Wrapper, { className: className, children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(StyledField, { className: "components-base-control__field" @@ -31303,54 +31731,106 @@ })] }); }; - -/** - * `BaseControl.VisualLabel` is used to render a purely visual label inside a `BaseControl` component. - * - * It should only be used in cases where the children being rendered inside `BaseControl` are already accessibly labeled, - * e.g., a button, but we want an additional visual label for that section equivalent to the labels `BaseControl` would - * otherwise use if the `label` prop was passed. - * - * @example - * import { BaseControl } from '@wordpress/components'; - * - * const MyBaseControl = () => ( - * - * Author - * - * - * ); - */ -const VisualLabel = ({ - className, - children, - ...props -}) => { +const UnforwardedVisualLabel = (props, ref) => { + const { + className, + children, + ...restProps + } = props; return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(StyledVisualLabel, { - ...props, + ref: ref, + ...restProps, className: dist_clsx('components-base-control__label', className), children: children }); }; +const VisualLabel = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedVisualLabel); + +/** + * `BaseControl` is a component used to generate labels and help text for components handling user inputs. + * + * ```jsx + * import { BaseControl, useBaseControlProps } from '@wordpress/components'; + * + * // Render a `BaseControl` for a textarea input + * const MyCustomTextareaControl = ({ children, ...baseProps }) => ( + * // `useBaseControlProps` is a convenience hook to get the props for the `BaseControl` + * // and the inner control itself. Namely, it takes care of generating a unique `id`, + * // properly associating it with the `label` and `help` elements. + * const { baseControlProps, controlProps } = useBaseControlProps( baseProps ); + * + * return ( + * + * + * + * ); + * ); + * ``` + */ const BaseControl = Object.assign(contextConnectWithoutRef(UnconnectedBaseControl, 'BaseControl'), { + /** + * `BaseControl.VisualLabel` is used to render a purely visual label inside a `BaseControl` component. + * + * It should only be used in cases where the children being rendered inside `BaseControl` are already accessibly labeled, + * e.g., a button, but we want an additional visual label for that section equivalent to the labels `BaseControl` would + * otherwise use if the `label` prop was passed. + * + * ```jsx + * import { BaseControl } from '@wordpress/components'; + * + * const MyBaseControl = () => ( + * + * Author + * + * + * ); + * ``` + */ VisualLabel }); /* harmony default export */ const base_control = (BaseControl); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/input-control/index.js -/** - * External dependencies - */ - -/** - * WordPress dependencies - */ - - - -/** - * Internal dependencies - */ +;// ./node_modules/@wordpress/components/build-module/utils/deprecated-36px-size.js +/** + * WordPress dependencies + */ + +function maybeWarnDeprecated36pxSize({ + componentName, + __next40pxDefaultSize, + size, + __shouldNotWarnDeprecated36pxSize +}) { + if (__shouldNotWarnDeprecated36pxSize || __next40pxDefaultSize || size !== undefined && size !== 'default') { + return; + } + external_wp_deprecated_default()(`36px default size for wp.components.${componentName}`, { + since: '6.8', + version: '7.1', + hint: 'Set the `__next40pxDefaultSize` prop to true to start opting into the new default size, which will become the default in a future version.' + }); +} + +;// ./node_modules/@wordpress/components/build-module/input-control/index.js +/** + * External dependencies + */ + +/** + * WordPress dependencies + */ + + + +/** + * Internal dependencies + */ + @@ -31367,6 +31847,7 @@ function UnforwardedInputControl(props, ref) { const { __next40pxDefaultSize, + __shouldNotWarnDeprecated36pxSize, __unstableStateReducer: stateReducer = state => state, __unstableInputWidth, className, @@ -31397,6 +31878,12 @@ const helpProp = !!help ? { 'aria-describedby': `${id}__help` } : {}; + maybeWarnDeprecated36pxSize({ + componentName: 'InputControl', + __next40pxDefaultSize, + size, + __shouldNotWarnDeprecated36pxSize + }); return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(base_control, { className: classes, help: help, @@ -31426,8 +31913,8 @@ isPressEnterToChange: isPressEnterToChange, onKeyDown: onKeyDown, onValidate: onValidate, - paddingInlineStart: prefix ? space(2) : undefined, - paddingInlineEnd: suffix ? space(2) : undefined, + paddingInlineStart: prefix ? space(1) : undefined, + paddingInlineEnd: suffix ? space(1) : undefined, ref: ref, size: size, stateReducer: stateReducer, @@ -31450,6 +31937,7 @@ * * return ( * setValue( nextValue ?? '' ) } * /> @@ -31460,7 +31948,7 @@ const InputControl = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedInputControl); /* harmony default export */ const input_control = (InputControl); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/dashicon/index.js +;// ./node_modules/@wordpress/components/build-module/dashicon/index.js /** * @typedef OwnProps @@ -31504,22 +31992,31 @@ } /* harmony default export */ const dashicon = (Dashicon); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/icon/index.js -/** - * External dependencies - */ - -/** - * WordPress dependencies - */ - - - -/** - * Internal dependencies - */ - - +;// ./node_modules/@wordpress/components/build-module/icon/index.js +/** + * External dependencies + */ + +/** + * WordPress dependencies + */ + + + +/** + * Internal dependencies + */ + + +/** + * Renders a raw icon without any initial styling or wrappers. + * + * ```jsx + * import { wordpress } from '@wordpress/icons'; + * + * + * ``` + */ function Icon({ icon = null, size = 'string' === typeof icon ? 20 : 24, @@ -31565,23 +32062,21 @@ } /* harmony default export */ const build_module_icon = (Icon); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/button/index.js -/** - * External dependencies - */ - -/** - * WordPress dependencies - */ - - - - -/** - * Internal dependencies - */ - - +;// ./node_modules/@wordpress/components/build-module/button/index.js +/** + * External dependencies + */ + +/** + * WordPress dependencies + */ + + + + +/** + * Internal dependencies + */ @@ -31589,6 +32084,7 @@ const disabledEventsOnDisabledButton = ['onMouseDown', 'onClick']; function button_useDeprecatedProps({ + __experimentalIsFocusable, isDefault, isPrimary, isSecondary, @@ -31598,13 +32094,16 @@ isSmall, size, variant, + describedBy, ...otherProps }) { let computedSize = size; let computedVariant = variant; const newProps = { + accessibleWhenDisabled: __experimentalIsFocusable, // @todo Mark `isPressed` as deprecated - 'aria-pressed': isPressed + 'aria-pressed': isPressed, + description: describedBy }; if (isSmall) { var _computedSize; @@ -31644,6 +32143,7 @@ function UnforwardedButton(props, ref) { const { __next40pxDefaultSize, + accessibleWhenDisabled, isBusy, isDestructive, className, @@ -31659,8 +32159,7 @@ size = 'default', text, variant, - __experimentalIsFocusable: isFocusable, - describedBy, + description, ...buttonOrAnchorProps } = button_useDeprecatedProps(props); const { @@ -31695,8 +32194,8 @@ 'has-text': !!icon && (hasChildren || text), 'has-icon': !!icon }); - const trulyDisabled = disabled && !isFocusable; - const Tag = href !== undefined && !trulyDisabled ? 'a' : 'button'; + const trulyDisabled = disabled && !accessibleWhenDisabled; + const Tag = href !== undefined && !disabled ? 'a' : 'button'; const buttonProps = Tag === 'button' ? { type: 'button', disabled: trulyDisabled, @@ -31709,7 +32208,7 @@ target } : {}; const disableEventProps = {}; - if (disabled && isFocusable) { + if (disabled && accessibleWhenDisabled) { // In this case, the button will be disabled, but still focusable and // perceivable by screen reader users. buttonProps['aria-disabled'] = true; @@ -31736,7 +32235,7 @@ !children?.length && // The tooltip is not explicitly disabled. false !== showTooltip); - const descriptionId = describedBy ? instanceId : undefined; + const descriptionId = description ? instanceId : undefined; const describedById = additionalProps['aria-describedby'] || descriptionId; const commonProps = { className: classes, @@ -31774,7 +32273,7 @@ // In order to make sure that the tooltip doesn't show when it shouldn't, // we don't pass the props to the `Tooltip` component. const tooltipProps = shouldShowTooltip ? { - text: children?.length && describedBy ? describedBy : label, + text: children?.length && description ? description : label, shortcut, placement: tooltipPosition && // Convert legacy `position` values to be used with the new `placement` prop @@ -31784,10 +32283,10 @@ children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(tooltip, { ...tooltipProps, children: element - }), describedBy && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(visually_hidden_component, { + }), description && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(visually_hidden_component, { children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", { id: descriptionId, - children: describedBy + children: description }) })] }); @@ -31811,7 +32310,7 @@ const Button = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedButton); /* harmony default export */ const build_module_button = (Button); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/number-control/styles/number-control-styles.js +;// ./node_modules/@wordpress/components/build-module/number-control/styles/number-control-styles.js 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)."; } /** @@ -31848,7 +32347,7 @@ smallSpinButtons }; -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/utils/math.js +;// ./node_modules/@wordpress/components/build-module/utils/math.js /** * Parses and retrieves a number value. * @@ -31869,7 +32368,7 @@ * @return {number} The sum of values. */ function add(...args) { - return args.reduce( /** @type {(sum:number, arg: number|string) => number} */ + return args.reduce(/** @type {(sum:number, arg: number|string) => number} */ (sum, arg) => sum + getNumber(arg), 0); } @@ -31881,7 +32380,7 @@ * @return {number} The difference of the values. */ function subtract(...args) { - return args.reduce( /** @type {(diff:number, arg: number|string, index:number) => number} */ + return args.reduce(/** @type {(diff:number, arg: number|string, index:number) => number} */ (diff, arg, index) => { const value = getNumber(arg); return index === 0 ? value : diff - value; @@ -31933,7 +32432,7 @@ return precision ? getNumber(clampedValue.toFixed(precision)) : clampedValue; } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/h-stack/utils.js +;// ./node_modules/@wordpress/components/build-module/h-stack/utils.js /** * External dependencies */ @@ -32045,7 +32544,7 @@ return alignmentProps; } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/utils/get-valid-children.js +;// ./node_modules/@wordpress/components/build-module/utils/get-valid-children.js /** * External dependencies */ @@ -32069,7 +32568,7 @@ return external_wp_element_namespaceObject.Children.toArray(children).filter(child => (0,external_wp_element_namespaceObject.isValidElement)(child)); } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/h-stack/hook.js +;// ./node_modules/@wordpress/components/build-module/h-stack/hook.js /** * External dependencies */ @@ -32122,7 +32621,7 @@ return flexProps; } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/h-stack/component.js +;// ./node_modules/@wordpress/components/build-module/h-stack/component.js /** * Internal dependencies */ @@ -32164,24 +32663,23 @@ const HStack = contextConnect(UnconnectedHStack, 'HStack'); /* harmony default export */ const h_stack_component = (HStack); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/number-control/index.js -/** - * External dependencies - */ - -/** - * WordPress dependencies - */ - - - - - - -/** - * Internal dependencies - */ - +;// ./node_modules/@wordpress/components/build-module/number-control/index.js +/** + * External dependencies + */ + +/** + * WordPress dependencies + */ + + + + + + +/** + * Internal dependencies + */ @@ -32214,8 +32712,15 @@ size = 'default', suffix, onChange = number_control_noop, + __shouldNotWarnDeprecated36pxSize, ...restProps } = useDeprecated36pxDefaultSizeProp(props); + maybeWarnDeprecated36pxSize({ + componentName: 'NumberControl', + size, + __next40pxDefaultSize: restProps.__next40pxDefaultSize, + __shouldNotWarnDeprecated36pxSize + }); if (hideHTMLArrows) { external_wp_deprecated_default()('wp.components.NumberControl hideHTMLArrows prop ', { alternative: 'spinControls="none"', @@ -32340,8 +32845,8 @@ hideHTMLArrows: spinControls !== 'native', isDragEnabled: isDragEnabled, label: label, - max: max, - min: min, + max: max === Infinity ? undefined : max, + min: min === -Infinity ? undefined : min, ref: mergedRef, required: required, step: step, @@ -32355,6 +32860,7 @@ return (_stateReducerProp = stateReducerProp?.(baseState, action)) !== null && _stateReducerProp !== void 0 ? _stateReducerProp : baseState; }, size: size, + __shouldNotWarnDeprecated36pxSize: true, suffix: spinControls === 'custom' ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { children: [suffix, /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(spacer_component, { marginBottom: 0, @@ -32383,7 +32889,7 @@ const NumberControl = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedNumberControl); /* harmony default export */ const number_control = (NumberControl); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/angle-picker-control/styles/angle-picker-control-styles.js +;// ./node_modules/@wordpress/components/build-module/angle-picker-control/styles/angle-picker-control-styles.js 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)."; } /** @@ -32401,7 +32907,7 @@ const INNER_CIRCLE_SIZE = 6; const CircleRoot = /*#__PURE__*/emotion_styled_base_browser_esm("div", true ? { target: "eln3bjz3" -} : 0)("border-radius:50%;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)); +} : 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)); const CircleIndicatorWrapper = /*#__PURE__*/emotion_styled_base_browser_esm("div", true ? { target: "eln3bjz2" } : 0)( true ? { @@ -32410,12 +32916,12 @@ } : 0); const CircleIndicator = /*#__PURE__*/emotion_styled_base_browser_esm("div", true ? { target: "eln3bjz1" -} : 0)("background:", COLORS.theme.accent, ";border-radius:50%;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)); +} : 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)); const UnitText = /*#__PURE__*/emotion_styled_base_browser_esm(text_component, true ? { target: "eln3bjz0" } : 0)("color:", COLORS.theme.accent, ";margin-right:", space(3), ";" + ( true ? "" : 0)); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/angle-picker-control/angle-circle.js +;// ./node_modules/@wordpress/components/build-module/angle-picker-control/angle-circle.js /** * WordPress dependencies */ @@ -32433,14 +32939,14 @@ ...props }) { const angleCircleRef = (0,external_wp_element_namespaceObject.useRef)(null); - const angleCircleCenter = (0,external_wp_element_namespaceObject.useRef)(); - const previousCursorValue = (0,external_wp_element_namespaceObject.useRef)(); + const angleCircleCenterRef = (0,external_wp_element_namespaceObject.useRef)(); + const previousCursorValueRef = (0,external_wp_element_namespaceObject.useRef)(); const setAngleCircleCenter = () => { if (angleCircleRef.current === null) { return; } const rect = angleCircleRef.current.getBoundingClientRect(); - angleCircleCenter.current = { + angleCircleCenterRef.current = { x: rect.x + rect.width / 2, y: rect.y + rect.height / 2 }; @@ -32455,11 +32961,11 @@ event.preventDefault(); // Input control needs to lose focus and by preventDefault above, it doesn't. event.target?.focus(); - if (angleCircleCenter.current !== undefined && onChange !== undefined) { + if (angleCircleCenterRef.current !== undefined && onChange !== undefined) { const { x: centerX, y: centerY - } = angleCircleCenter.current; + } = angleCircleCenterRef.current; onChange(getAngle(centerX, centerY, event.clientX, event.clientY)); } }; @@ -32476,13 +32982,13 @@ }); (0,external_wp_element_namespaceObject.useEffect)(() => { if (isDragging) { - if (previousCursorValue.current === undefined) { - previousCursorValue.current = document.body.style.cursor; + if (previousCursorValueRef.current === undefined) { + previousCursorValueRef.current = document.body.style.cursor; } document.body.style.cursor = 'grabbing'; } else { - document.body.style.cursor = previousCursorValue.current || ''; - previousCursorValue.current = undefined; + document.body.style.cursor = previousCursorValueRef.current || ''; + previousCursorValueRef.current = undefined; } }, [isDragging]); return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(CircleRoot, { @@ -32514,23 +33020,22 @@ } /* harmony default export */ const angle_circle = (AngleCircle); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/angle-picker-control/index.js -/** - * External dependencies - */ - - - -/** - * WordPress dependencies - */ - - - -/** - * Internal dependencies - */ - +;// ./node_modules/@wordpress/components/build-module/angle-picker-control/index.js +/** + * External dependencies + */ + + + +/** + * WordPress dependencies + */ + + + +/** + * Internal dependencies + */ @@ -32564,12 +33069,12 @@ gap: 2, children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(flex_block_component, { children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(number_control, { + __next40pxDefaultSize: true, label: label, className: "components-angle-picker-control__input-field", max: 360, min: 0, onChange: handleOnNumberChange, - size: "__unstable-large", step: "1", value: value, spinControls: "none", @@ -32615,13 +33120,13 @@ // EXTERNAL MODULE: ./node_modules/remove-accents/index.js var remove_accents = __webpack_require__(9681); var remove_accents_default = /*#__PURE__*/__webpack_require__.n(remove_accents); -;// CONCATENATED MODULE: external ["wp","richText"] +;// external ["wp","richText"] const external_wp_richText_namespaceObject = window["wp"]["richText"]; -;// CONCATENATED MODULE: external ["wp","a11y"] +;// external ["wp","a11y"] const external_wp_a11y_namespaceObject = window["wp"]["a11y"]; -;// CONCATENATED MODULE: external ["wp","keycodes"] +;// external ["wp","keycodes"] const external_wp_keycodes_namespaceObject = window["wp"]["keycodes"]; -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/utils/strings.js +;// ./node_modules/@wordpress/components/build-module/utils/strings.js /** * External dependencies */ @@ -32683,7 +33188,7 @@ return string.replace(/[\\^$.*+?()[\]{}|]/g, '\\$&'); } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/autocomplete/get-default-use-items.js +;// ./node_modules/@wordpress/components/build-module/autocomplete/get-default-use-items.js /** * External dependencies */ @@ -32774,7 +33279,7 @@ }; } -;// CONCATENATED MODULE: ./node_modules/@floating-ui/react-dom/dist/floating-ui.react-dom.mjs +;// ./node_modules/@floating-ui/react-dom/dist/floating-ui.react-dom.mjs @@ -33049,7 +33554,7 @@ -;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/close.js +;// ./node_modules/@wordpress/icons/build-module/library/close.js /** * WordPress dependencies */ @@ -33059,12 +33564,12 @@ xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { - d: "M13 11.8l6.1-6.3-1-1-6.1 6.2-6.1-6.2-1 1 6.1 6.3-6.5 6.7 1 1 6.5-6.6 6.5 6.6 1-1z" + 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" }) }); /* harmony default export */ const library_close = (close_close); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/scroll-lock/index.js +;// ./node_modules/@wordpress/components/build-module/scroll-lock/index.js /** * WordPress dependencies */ @@ -33144,7 +33649,7 @@ } /* harmony default export */ const scroll_lock = (ScrollLock); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/slot-fill/bubbles-virtually/slot-fill-context.js +;// ./node_modules/@wordpress/components/build-module/slot-fill/bubbles-virtually/slot-fill-context.js /** * WordPress dependencies */ @@ -33172,7 +33677,7 @@ const SlotFillContext = (0,external_wp_element_namespaceObject.createContext)(initialContextValue); /* harmony default export */ const slot_fill_context = (SlotFillContext); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/slot-fill/bubbles-virtually/use-slot.js +;// ./node_modules/@wordpress/components/build-module/slot-fill/bubbles-virtually/use-slot.js /** * WordPress dependencies */ @@ -33186,134 +33691,79 @@ function useSlot(name) { const registry = (0,external_wp_element_namespaceObject.useContext)(slot_fill_context); const slot = (0,external_wp_compose_namespaceObject.useObservableValue)(registry.slots, name); - const api = (0,external_wp_element_namespaceObject.useMemo)(() => ({ - updateSlot: fillProps => registry.updateSlot(name, fillProps), - unregisterSlot: ref => registry.unregisterSlot(name, ref), - registerFill: ref => registry.registerFill(name, ref), - unregisterFill: ref => registry.unregisterFill(name, ref) - }), [name, registry]); - return { - ...slot, - ...api - }; -} - -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/slot-fill/context.js -/** - * WordPress dependencies - */ + return { + ...slot + }; +} + +;// ./node_modules/@wordpress/components/build-module/slot-fill/context.js +/** + * WordPress dependencies + */ + + /** * Internal dependencies */ const initialValue = { + slots: (0,external_wp_compose_namespaceObject.observableMap)(), + fills: (0,external_wp_compose_namespaceObject.observableMap)(), registerSlot: () => {}, unregisterSlot: () => {}, registerFill: () => {}, unregisterFill: () => {}, - getSlot: () => undefined, - getFills: () => [], - subscribe: () => () => {} + updateFill: () => {} }; const context_SlotFillContext = (0,external_wp_element_namespaceObject.createContext)(initialValue); /* harmony default export */ const context = (context_SlotFillContext); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/slot-fill/use-slot.js -/** - * WordPress dependencies - */ - - -/** - * Internal dependencies - */ - -/** - * React hook returning the active slot given a name. - * - * @param name Slot name. - * @return Slot object. - */ -const use_slot_useSlot = name => { - const { - getSlot, - subscribe - } = (0,external_wp_element_namespaceObject.useContext)(context); - return (0,external_wp_element_namespaceObject.useSyncExternalStore)(subscribe, () => getSlot(name), () => getSlot(name)); -}; -/* harmony default export */ const use_slot = (use_slot_useSlot); - -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/slot-fill/fill.js -/** - * WordPress dependencies - */ - - -/** - * Internal dependencies - */ - +;// ./node_modules/@wordpress/components/build-module/slot-fill/fill.js +/** + * WordPress dependencies + */ + + +/** + * Internal dependencies + */ function Fill({ name, children }) { - const { - registerFill, - unregisterFill - } = (0,external_wp_element_namespaceObject.useContext)(context); - const slot = use_slot(name); - const ref = (0,external_wp_element_namespaceObject.useRef)({ - name, - children - }); + const registry = (0,external_wp_element_namespaceObject.useContext)(context); + const instanceRef = (0,external_wp_element_namespaceObject.useRef)({}); + const childrenRef = (0,external_wp_element_namespaceObject.useRef)(children); (0,external_wp_element_namespaceObject.useLayoutEffect)(() => { - const refValue = ref.current; - registerFill(name, refValue); - return () => unregisterFill(name, refValue); - // Ignore reason: the useLayoutEffects here are written to fire at specific times, and introducing new dependencies could cause unexpected changes in behavior. - // We'll leave them as-is until a more detailed investigation/refactor can be performed. - // eslint-disable-next-line react-hooks/exhaustive-deps - }, []); - (0,external_wp_element_namespaceObject.useLayoutEffect)(() => { - ref.current.children = children; - if (slot) { - slot.forceUpdate(); - } - // Ignore reason: the useLayoutEffects here are written to fire at specific times, and introducing new dependencies could cause unexpected changes in behavior. - // We'll leave them as-is until a more detailed investigation/refactor can be performed. - // eslint-disable-next-line react-hooks/exhaustive-deps + childrenRef.current = children; }, [children]); (0,external_wp_element_namespaceObject.useLayoutEffect)(() => { - if (name === ref.current.name) { - // Ignore initial effect. - return; - } - unregisterFill(ref.current.name, ref.current); - ref.current.name = name; - registerFill(name, ref.current); - // Ignore reason: the useLayoutEffects here are written to fire at specific times, and introducing new dependencies could cause unexpected changes in behavior. - // We'll leave them as-is until a more detailed investigation/refactor can be performed. - // eslint-disable-next-line react-hooks/exhaustive-deps - }, [name]); + const instance = instanceRef.current; + registry.registerFill(name, instance, childrenRef.current); + return () => registry.unregisterFill(name, instance); + }, [registry, name]); + (0,external_wp_element_namespaceObject.useLayoutEffect)(() => { + registry.updateFill(name, instanceRef.current, childrenRef.current); + }); return null; } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/slot-fill/slot.js -/** - * External dependencies - */ - -/** - * WordPress dependencies - */ - - -/** - * Internal dependencies - */ - +;// ./node_modules/@wordpress/components/build-module/slot-fill/slot.js +/** + * External dependencies + */ + +/** + * WordPress dependencies + */ + + + +/** + * Internal dependencies + */ /** @@ -33325,94 +33775,61 @@ function isFunction(maybeFunc) { return typeof maybeFunc === 'function'; } -class SlotComponent extends external_wp_element_namespaceObject.Component { - constructor(props) { - super(props); - this.isUnmounted = false; - } - componentDidMount() { - const { - registerSlot - } = this.props; - this.isUnmounted = false; - registerSlot(this.props.name, this); - } - componentWillUnmount() { - const { - unregisterSlot - } = this.props; - this.isUnmounted = true; - unregisterSlot(this.props.name, this); - } - componentDidUpdate(prevProps) { - const { - name, - unregisterSlot, - registerSlot - } = this.props; - if (prevProps.name !== name) { - unregisterSlot(prevProps.name, this); - registerSlot(name, this); - } - } - forceUpdate() { - if (this.isUnmounted) { - return; - } - super.forceUpdate(); - } - render() { - var _getFills; - const { - children, - name, - fillProps = {}, - getFills - } = this.props; - const fills = ((_getFills = getFills(name, this)) !== null && _getFills !== void 0 ? _getFills : []).map(fill => { - const fillChildren = isFunction(fill.children) ? fill.children(fillProps) : fill.children; - return external_wp_element_namespaceObject.Children.map(fillChildren, (child, childIndex) => { - if (!child || typeof child === 'string') { - return child; - } - let childKey = childIndex; - if (typeof child === 'object' && 'key' in child && child?.key) { - childKey = child.key; - } - return (0,external_wp_element_namespaceObject.cloneElement)(child, { - key: childKey - }); - }); - }).filter( - // In some cases fills are rendered only when some conditions apply. - // This ensures that we only use non-empty fills when rendering, i.e., - // it allows us to render wrappers only when the fills are actually present. - element => !(0,external_wp_element_namespaceObject.isEmptyElement)(element)); - return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_ReactJSXRuntime_namespaceObject.Fragment, { - children: isFunction(children) ? children(fills) : fills - }); - } -} -const Slot = props => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(context.Consumer, { - children: ({ - registerSlot, - unregisterSlot, - getFills - }) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(SlotComponent, { - ...props, - registerSlot: registerSlot, - unregisterSlot: unregisterSlot, - getFills: getFills - }) -}); +function addKeysToChildren(children) { + return external_wp_element_namespaceObject.Children.map(children, (child, childIndex) => { + if (!child || typeof child === 'string') { + return child; + } + let childKey = childIndex; + if (typeof child === 'object' && 'key' in child && child?.key) { + childKey = child.key; + } + return (0,external_wp_element_namespaceObject.cloneElement)(child, { + key: childKey + }); + }); +} +function Slot(props) { + var _useObservableValue; + const registry = (0,external_wp_element_namespaceObject.useContext)(context); + const instanceRef = (0,external_wp_element_namespaceObject.useRef)({}); + const { + name, + children, + fillProps = {} + } = props; + (0,external_wp_element_namespaceObject.useLayoutEffect)(() => { + const instance = instanceRef.current; + registry.registerSlot(name, instance); + return () => registry.unregisterSlot(name, instance); + }, [registry, name]); + let fills = (_useObservableValue = (0,external_wp_compose_namespaceObject.useObservableValue)(registry.fills, name)) !== null && _useObservableValue !== void 0 ? _useObservableValue : []; + const currentSlot = (0,external_wp_compose_namespaceObject.useObservableValue)(registry.slots, name); + + // Fills should only be rendered in the currently registered instance of the slot. + if (currentSlot !== instanceRef.current) { + fills = []; + } + const renderedFills = fills.map(fill => { + const fillChildren = isFunction(fill.children) ? fill.children(fillProps) : fill.children; + return addKeysToChildren(fillChildren); + }).filter( + // In some cases fills are rendered only when some conditions apply. + // This ensures that we only use non-empty fills when rendering, i.e., + // it allows us to render wrappers only when the fills are actually present. + element => !(0,external_wp_element_namespaceObject.isEmptyElement)(element)); + return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_ReactJSXRuntime_namespaceObject.Fragment, { + children: isFunction(children) ? children(renderedFills) : renderedFills + }); +} /* harmony default export */ const slot = (Slot); -;// CONCATENATED MODULE: ./node_modules/uuid/dist/esm-browser/native.js +;// ./node_modules/@wordpress/components/node_modules/uuid/dist/esm-browser/native.js const randomUUID = typeof crypto !== 'undefined' && crypto.randomUUID && crypto.randomUUID.bind(crypto); /* harmony default export */ const esm_browser_native = ({ randomUUID }); -;// CONCATENATED MODULE: ./node_modules/uuid/dist/esm-browser/rng.js +;// ./node_modules/@wordpress/components/node_modules/uuid/dist/esm-browser/rng.js // Unique ID creation requires a high quality random # generator. In the browser we therefore // require the crypto API and do not support built-in fallback to lower quality random number // generators (like Math.random()). @@ -33431,7 +33848,7 @@ return getRandomValues(rnds8); } -;// CONCATENATED MODULE: ./node_modules/uuid/dist/esm-browser/stringify.js +;// ./node_modules/@wordpress/components/node_modules/uuid/dist/esm-browser/stringify.js /** * Convert array of 16 byte values to UUID string format of the form: @@ -33465,7 +33882,7 @@ } /* harmony default export */ const esm_browser_stringify = ((/* unused pure expression or super */ null && (stringify_stringify))); -;// CONCATENATED MODULE: ./node_modules/uuid/dist/esm-browser/v4.js +;// ./node_modules/@wordpress/components/node_modules/uuid/dist/esm-browser/v4.js @@ -33495,7 +33912,7 @@ } /* harmony default export */ const esm_browser_v4 = (v4); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/style-provider/index.js +;// ./node_modules/@wordpress/components/build-module/style-provider/index.js /** * External dependencies */ @@ -33546,58 +33963,37 @@ } /* harmony default export */ const style_provider = (StyleProvider); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/slot-fill/bubbles-virtually/fill.js -/** - * WordPress dependencies - */ - - -/** - * Internal dependencies - */ - - - -function fill_useForceUpdate() { - const [, setState] = (0,external_wp_element_namespaceObject.useState)({}); - const mounted = (0,external_wp_element_namespaceObject.useRef)(true); +;// ./node_modules/@wordpress/components/build-module/slot-fill/bubbles-virtually/fill.js +/** + * WordPress dependencies + */ + + + +/** + * Internal dependencies + */ + + + +function fill_Fill({ + name, + children +}) { + var _slot$fillProps; + const registry = (0,external_wp_element_namespaceObject.useContext)(slot_fill_context); + const slot = (0,external_wp_compose_namespaceObject.useObservableValue)(registry.slots, name); + const instanceRef = (0,external_wp_element_namespaceObject.useRef)({}); + + // We register fills so we can keep track of their existence. + // Slots can use the `useSlotFills` hook to know if there're already fills + // registered so they can choose to render themselves or not. (0,external_wp_element_namespaceObject.useEffect)(() => { - mounted.current = true; - return () => { - mounted.current = false; - }; - }, []); - return () => { - if (mounted.current) { - setState({}); - } - }; -} -function fill_Fill(props) { - var _slot$fillProps; - const { - name, - children - } = props; - const { - registerFill, - unregisterFill, - ...slot - } = useSlot(name); - const rerender = fill_useForceUpdate(); - const ref = (0,external_wp_element_namespaceObject.useRef)({ - rerender - }); - (0,external_wp_element_namespaceObject.useEffect)(() => { - // We register fills so we can keep track of their existence. - // Some Slot implementations need to know if there're already fills - // registered so they can choose to render themselves or not. - registerFill(ref); - return () => { - unregisterFill(ref); - }; - }, [registerFill, unregisterFill]); - if (!slot.ref || !slot.ref.current) { + const instance = instanceRef.current; + registry.registerFill(name, instance); + return () => registry.unregisterFill(name, instance); + }, [registry, name]); + if (!slot || !slot.ref.current) { return null; } @@ -33612,7 +34008,7 @@ return (0,external_wp_element_namespaceObject.createPortal)(wrappedChildren, slot.ref.current); } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/slot-fill/bubbles-virtually/slot.js +;// ./node_modules/@wordpress/components/build-module/slot-fill/bubbles-virtually/slot.js /** * External dependencies */ @@ -33636,31 +34032,26 @@ as, // `children` is not allowed. However, if it is passed, // it will be displayed as is, so remove `children`. - // @ts-ignore children, ...restProps } = props; - const { - registerSlot, - unregisterSlot, - ...registry - } = (0,external_wp_element_namespaceObject.useContext)(slot_fill_context); + const registry = (0,external_wp_element_namespaceObject.useContext)(slot_fill_context); const ref = (0,external_wp_element_namespaceObject.useRef)(null); + + // We don't want to unregister and register the slot whenever + // `fillProps` change, which would cause the fill to be re-mounted. Instead, + // we can just update the slot (see hook below). + // For more context, see https://github.com/WordPress/gutenberg/pull/44403#discussion_r994415973 + const fillPropsRef = (0,external_wp_element_namespaceObject.useRef)(fillProps); (0,external_wp_element_namespaceObject.useLayoutEffect)(() => { - registerSlot(name, ref, fillProps); - return () => { - unregisterSlot(name, ref); - }; - // Ignore reason: We don't want to unregister and register the slot whenever - // `fillProps` change, which would cause the fill to be re-mounted. Instead, - // we can just update the slot (see hook below). - // For more context, see https://github.com/WordPress/gutenberg/pull/44403#discussion_r994415973 - // eslint-disable-next-line react-hooks/exhaustive-deps - }, [registerSlot, unregisterSlot, name]); - // fillProps may be an update that interacts with the layout, so we - // useLayoutEffect. + fillPropsRef.current = fillProps; + }, [fillProps]); (0,external_wp_element_namespaceObject.useLayoutEffect)(() => { - registry.updateSlot(name, fillProps); + registry.registerSlot(name, ref, fillPropsRef.current); + return () => registry.unregisterSlot(name, ref); + }, [registry, name]); + (0,external_wp_element_namespaceObject.useLayoutEffect)(() => { + registry.updateSlot(name, ref, fillPropsRef.current); }); return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(component, { as: as, @@ -33670,10 +34061,10 @@ } /* harmony default export */ const bubbles_virtually_slot = ((0,external_wp_element_namespaceObject.forwardRef)(slot_Slot)); -;// CONCATENATED MODULE: external ["wp","isShallowEqual"] +;// external ["wp","isShallowEqual"] const external_wp_isShallowEqual_namespaceObject = window["wp"]["isShallowEqual"]; var external_wp_isShallowEqual_default = /*#__PURE__*/__webpack_require__.n(external_wp_isShallowEqual_namespaceObject); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/slot-fill/bubbles-virtually/slot-fill-provider.js +;// ./node_modules/@wordpress/components/build-module/slot-fill/bubbles-virtually/slot-fill-provider.js /** * WordPress dependencies */ @@ -33690,34 +34081,39 @@ const slots = (0,external_wp_compose_namespaceObject.observableMap)(); const fills = (0,external_wp_compose_namespaceObject.observableMap)(); const registerSlot = (name, ref, fillProps) => { - const slot = slots.get(name); slots.set(name, { - ...slot, - ref: ref || slot?.ref, - fillProps: fillProps || slot?.fillProps || {} + ref, + fillProps }); }; const unregisterSlot = (name, ref) => { + const slot = slots.get(name); + if (!slot) { + return; + } + // Make sure we're not unregistering a slot registered by another element // See https://github.com/WordPress/gutenberg/pull/19242#issuecomment-590295412 - if (slots.get(name)?.ref === ref) { - slots.delete(name); - } - }; - const updateSlot = (name, fillProps) => { + if (slot.ref !== ref) { + return; + } + slots.delete(name); + }; + const updateSlot = (name, ref, fillProps) => { const slot = slots.get(name); if (!slot) { return; } + if (slot.ref !== ref) { + return; + } if (external_wp_isShallowEqual_default()(slot.fillProps, fillProps)) { return; } - slot.fillProps = fillProps; - const slotFills = fills.get(name); - if (slotFills) { - // Force update fills. - slotFills.forEach(fill => fill.current.rerender()); - } + slots.set(name, { + ref, + fillProps + }); }; const registerFill = (name, ref) => { fills.set(name, [...(fills.get(name) || []), ref]); @@ -33749,92 +34145,77 @@ }); } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/slot-fill/provider.js -/** - * WordPress dependencies - */ - - - -/** - * Internal dependencies - */ +;// ./node_modules/@wordpress/components/build-module/slot-fill/provider.js +/** + * WordPress dependencies + */ + + +/** + * Internal dependencies + */ + function provider_createSlotRegistry() { - const slots = {}; - const fills = {}; - let listeners = []; - function registerSlot(name, slot) { - const previousSlot = slots[name]; - slots[name] = slot; - triggerListeners(); - - // Sometimes the fills are registered after the initial render of slot - // But before the registerSlot call, we need to rerender the slot. - forceUpdateSlot(name); - - // If a new instance of a slot is being mounted while another with the - // same name exists, force its update _after_ the new slot has been - // assigned into the instance, such that its own rendering of children - // will be empty (the new Slot will subsume all fills for this name). - if (previousSlot) { - previousSlot.forceUpdate(); - } - } - function registerFill(name, instance) { - fills[name] = [...(fills[name] || []), instance]; - forceUpdateSlot(name); + const slots = (0,external_wp_compose_namespaceObject.observableMap)(); + const fills = (0,external_wp_compose_namespaceObject.observableMap)(); + function registerSlot(name, instance) { + slots.set(name, instance); } function unregisterSlot(name, instance) { // If a previous instance of a Slot by this name unmounts, do nothing, // as the slot and its fills should only be removed for the current // known instance. - if (slots[name] !== instance) { - return; - } - delete slots[name]; - triggerListeners(); + if (slots.get(name) !== instance) { + return; + } + slots.delete(name); + } + function registerFill(name, instance, children) { + fills.set(name, [...(fills.get(name) || []), { + instance, + children + }]); } function unregisterFill(name, instance) { - var _fills$name$filter; - fills[name] = (_fills$name$filter = fills[name]?.filter(fill => fill !== instance)) !== null && _fills$name$filter !== void 0 ? _fills$name$filter : []; - forceUpdateSlot(name); - } - function getSlot(name) { - return slots[name]; - } - function getFills(name, slotInstance) { - // Fills should only be returned for the current instance of the slot - // in which they occupy. - if (slots[name] !== slotInstance) { - return []; - } - return fills[name]; - } - function forceUpdateSlot(name) { - const slot = getSlot(name); - if (slot) { - slot.forceUpdate(); - } - } - function triggerListeners() { - listeners.forEach(listener => listener()); - } - function subscribe(listener) { - listeners.push(listener); - return () => { - listeners = listeners.filter(l => l !== listener); - }; - } - return { + const fillsForName = fills.get(name); + if (!fillsForName) { + return; + } + fills.set(name, fillsForName.filter(fill => fill.instance !== instance)); + } + function updateFill(name, instance, children) { + const fillsForName = fills.get(name); + if (!fillsForName) { + return; + } + const fillForInstance = fillsForName.find(f => f.instance === instance); + if (!fillForInstance) { + return; + } + if (fillForInstance.children === children) { + return; + } + fills.set(name, fillsForName.map(f => { + if (f.instance === instance) { + // Replace with new record with updated `children`. + return { + instance, + children + }; + } + return f; + })); + } + return { + slots, + fills, registerSlot, unregisterSlot, registerFill, unregisterFill, - getSlot, - getFills, - subscribe + updateFill }; } function provider_SlotFillProvider({ @@ -33848,21 +34229,19 @@ } /* harmony default export */ const provider = (provider_SlotFillProvider); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/slot-fill/index.js -/** - * External dependencies - */ - -/** - * WordPress dependencies - */ - - -/** - * Internal dependencies - */ - - +;// ./node_modules/@wordpress/components/build-module/slot-fill/index.js +/** + * External dependencies + */ + +/** + * WordPress dependencies + */ + + +/** + * Internal dependencies + */ @@ -33917,6 +34296,7 @@ }) }); } +Provider.displayName = 'SlotFillProvider'; function createSlotFill(key) { const baseName = typeof key === 'symbol' ? key.description : key; const FillComponent = props => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(slot_fill_Fill, { @@ -33929,22 +34309,19 @@ ...props }); SlotComponent.displayName = `${baseName}Slot`; + /** + * @deprecated 6.8.0 + * Please use `slotFill.name` instead of `slotFill.Slot.__unstableName`. + */ SlotComponent.__unstableName = key; return { + name: key, Fill: FillComponent, Slot: SlotComponent }; } -const createPrivateSlotFill = name => { - const privateKey = Symbol(name); - const privateSlotFill = createSlotFill(privateKey); - return { - privateKey, - ...privateSlotFill - }; -}; - -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/popover/overlay-middlewares.js + +;// ./node_modules/@wordpress/components/build-module/popover/overlay-middlewares.js /** * External dependencies */ @@ -33982,21 +34359,19 @@ })]; } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/popover/index.js -/** - * External dependencies - */ - - - -// eslint-disable-next-line no-restricted-imports - -// eslint-disable-next-line no-restricted-imports - - -/** - * WordPress dependencies - */ +;// ./node_modules/@wordpress/components/build-module/popover/index.js +/** + * External dependencies + */ + + + + + +/** + * WordPress dependencies + */ + @@ -34020,8 +34395,6 @@ * @type {string} */ - - const SLOT_NAME = 'Popover'; // An SVG displaying a triangle facing down, filled with a solid @@ -34075,6 +34448,7 @@ shift = false, inline = false, variant, + style: contentStyle, // Deprecated props __unstableForcePosition, anchorRef, @@ -34243,6 +34617,7 @@ } = (0,external_wp_element_namespaceObject.useMemo)(() => placementToMotionAnimationProps(computedPlacement), [computedPlacement]); const animationProps = shouldAnimate ? { style: { + ...contentStyle, ...motionInlineStyles, ...style }, @@ -34250,7 +34625,10 @@ ...otherMotionProps } : { animate: false, - style + style: { + ...contentStyle, + ...style + } }; // When Floating UI has finished positioning and Framer Motion has finished animating @@ -34275,8 +34653,10 @@ children: headerTitle }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, { className: "components-popover__close", + size: "small", icon: library_close, - onClick: onClose + onClick: onClose, + label: (0,external_wp_i18n_namespaceObject.__)('Close') })] }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { className: "components-popover__content", @@ -34299,7 +34679,7 @@ children: content }); } else if (!inline) { - content = (0,external_wp_element_namespaceObject.createPortal)( /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(StyleProvider, { + content = (0,external_wp_element_namespaceObject.createPortal)(/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(StyleProvider, { document: document, children: content }), getPopoverFallbackContainer()); @@ -34355,26 +34735,24 @@ popover_Popover.__unstableSlotNameProvider = slotNameContext.Provider; /* harmony default export */ const popover = (popover_Popover); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/autocomplete/autocompleter-ui.js -/** - * External dependencies - */ - - -/** - * WordPress dependencies - */ - - - - - - -/** - * Internal dependencies - */ - - +;// ./node_modules/@wordpress/components/build-module/autocomplete/autocompleter-ui.js +/** + * External dependencies + */ + + +/** + * WordPress dependencies + */ + + + + + + +/** + * Internal dependencies + */ @@ -34397,11 +34775,15 @@ children: items.map((option, index) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, { id: `components-autocomplete-item-${instanceId}-${option.key}`, role: "option", + __next40pxDefaultSize: true, "aria-selected": index === selectedIndex, + accessibleWhenDisabled: true, disabled: option.isDisabled, className: dist_clsx('components-autocomplete__result', className, { + // Unused, for backwards compatibility. 'is-selected': index === selectedIndex }), + variant: index === selectedIndex ? 'primary' : undefined, onClick: () => onSelect(option), children: option.label }, option.key)) @@ -34447,10 +34829,10 @@ } if (!!options.length) { if (filterValue) { - debouncedSpeak((0,external_wp_i18n_namespaceObject.sprintf)( /* translators: %d: number of results. */ + debouncedSpeak((0,external_wp_i18n_namespaceObject.sprintf)(/* translators: %d: number of results. */ (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'); } else { - debouncedSpeak((0,external_wp_i18n_namespaceObject.sprintf)( /* translators: %d: number of results. */ + debouncedSpeak((0,external_wp_i18n_namespaceObject.sprintf)(/* translators: %d: number of results. */ (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'); } } else { @@ -34460,9 +34842,8 @@ (0,external_wp_element_namespaceObject.useLayoutEffect)(() => { onChangeOptions(items); announce(items); - // Temporarily disabling exhaustive-deps to avoid introducing unexpected side effecst. + // We want to avoid introducing unexpected side effects. // See https://github.com/WordPress/gutenberg/pull/41820 - // eslint-disable-next-line react-hooks/exhaustive-deps }, [items]); if (items.length === 0) { return null; @@ -34483,7 +34864,7 @@ listBoxId: listBoxId, className: className }) - }), contentRef.current && needsA11yCompat && (0,external_ReactDOM_namespaceObject.createPortal)( /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ListBox, { + }), contentRef.current && needsA11yCompat && (0,external_ReactDOM_namespaceObject.createPortal)(/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ListBox, { items: items, onSelect: onSelect, selectedIndex: selectedIndex, @@ -34511,32 +34892,27 @@ document.removeEventListener('mousedown', listener); document.removeEventListener('touchstart', listener); }; - // Disable reason: `ref` is a ref object and should not be included in a - // hook's dependency list. - // eslint-disable-next-line react-hooks/exhaustive-deps - }, [handler]); -} - -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/autocomplete/index.js -/** - * External dependencies - */ - - -/** - * WordPress dependencies - */ - - - - - - -/** - * Internal dependencies - */ - - + }, [handler, ref]); +} + +;// ./node_modules/@wordpress/components/build-module/autocomplete/index.js +/** + * External dependencies + */ + + +/** + * WordPress dependencies + */ + + + + + + +/** + * Internal dependencies + */ @@ -34569,6 +34945,9 @@ return ''; }; const EMPTY_FILTERED_OPTIONS = []; + +// Used for generating the instance ID +const AUTOCOMPLETE_HOOK_REFERENCE = {}; function useAutocomplete({ record, onChange, @@ -34576,13 +34955,13 @@ completers, contentRef }) { - const instanceId = (0,external_wp_compose_namespaceObject.useInstanceId)(useAutocomplete); + const instanceId = (0,external_wp_compose_namespaceObject.useInstanceId)(AUTOCOMPLETE_HOOK_REFERENCE); const [selectedIndex, setSelectedIndex] = (0,external_wp_element_namespaceObject.useState)(0); const [filteredOptions, setFilteredOptions] = (0,external_wp_element_namespaceObject.useState)(EMPTY_FILTERED_OPTIONS); const [filterValue, setFilterValue] = (0,external_wp_element_namespaceObject.useState)(''); const [autocompleter, setAutocompleter] = (0,external_wp_element_namespaceObject.useState)(null); const [AutocompleterUI, setAutocompleterUI] = (0,external_wp_element_namespaceObject.useState)(null); - const backspacing = (0,external_wp_element_namespaceObject.useRef)(false); + const backspacingRef = (0,external_wp_element_namespaceObject.useRef)(false); function insertCompletion(replacement) { if (autocompleter === null) { return; @@ -34642,7 +35021,7 @@ setFilteredOptions(options); } function handleKeyDown(event) { - backspacing.current = event.key === 'Backspace'; + backspacingRef.current = event.key === 'Backspace'; if (!autocompleter) { return; } @@ -34757,7 +35136,7 @@ // // Ex: "Some text @marcelo sekkkk" <--- "kkkk" caused a mismatch, but // if the user presses backspace here, it will show the completion popup again. - const matchingWhileBackspacing = backspacing.current && wordsFromTrigger.length <= 3; + const matchingWhileBackspacing = backspacingRef.current && wordsFromTrigger.length <= 3; if (mismatch && !(matchingWhileBackspacing || hasOneTriggerWord)) { if (autocompleter) { reset(); @@ -34790,9 +35169,8 @@ setAutocompleter(completer); setAutocompleterUI(() => completer !== autocompleter ? getAutoCompleterUI(completer) : AutocompleterUI); setFilterValue(query === null ? '' : query); - // Temporarily disabling exhaustive-deps to avoid introducing unexpected side effecst. + // We want to avoid introducing unexpected side effects. // See https://github.com/WordPress/gutenberg/pull/41820 - // eslint-disable-next-line react-hooks/exhaustive-deps }, [textContent]); const { key: selectedKey = '' @@ -34888,7 +35266,7 @@ }); } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/base-control/hooks.js +;// ./node_modules/@wordpress/components/build-module/base-control/hooks.js /** * WordPress dependencies */ @@ -34927,7 +35305,7 @@ }; } -;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/link.js +;// ./node_modules/@wordpress/icons/build-module/library/link.js /** * WordPress dependencies */ @@ -34942,7 +35320,7 @@ }); /* harmony default export */ const library_link = (link_link); -;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/link-off.js +;// ./node_modules/@wordpress/icons/build-module/library/link-off.js /** * WordPress dependencies */ @@ -34957,7 +35335,7 @@ }); /* harmony default export */ const link_off = (linkOff); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/border-box-control/styles.js +;// ./node_modules/@wordpress/components/build-module/border-box-control/styles.js 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)."; } /** * External dependencies @@ -35008,7 +35386,7 @@ marginLeft: 'auto' })(), ";" + ( true ? "" : 0), true ? "" : 0); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/border-box-control/border-box-control-linked-button/hook.js +;// ./node_modules/@wordpress/components/build-module/border-box-control/border-box-control-linked-button/hook.js /** * WordPress dependencies */ @@ -35038,18 +35416,16 @@ }; } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/border-box-control/border-box-control-linked-button/component.js -/** - * WordPress dependencies - */ - - - -/** - * Internal dependencies - */ - - +;// ./node_modules/@wordpress/components/build-module/border-box-control/border-box-control-linked-button/component.js +/** + * WordPress dependencies + */ + + + +/** + * Internal dependencies + */ @@ -35061,25 +35437,20 @@ ...buttonProps } = useBorderBoxControlLinkedButton(props); const label = isLinked ? (0,external_wp_i18n_namespaceObject.__)('Unlink sides') : (0,external_wp_i18n_namespaceObject.__)('Link sides'); - return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(tooltip, { - text: label, - children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(component, { - className: className, - children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, { - ...buttonProps, - size: "small", - icon: isLinked ? library_link : link_off, - iconSize: 24, - "aria-label": label, - ref: forwardedRef - }) - }) + return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, { + ...buttonProps, + size: "small", + icon: isLinked ? library_link : link_off, + iconSize: 24, + label: label, + ref: forwardedRef, + className: className }); }; const ConnectedBorderBoxControlLinkedButton = contextConnect(BorderBoxControlLinkedButton, 'BorderBoxControlLinkedButton'); /* harmony default export */ const border_box_control_linked_button_component = (ConnectedBorderBoxControlLinkedButton); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/border-box-control/border-box-control-visualizer/hook.js +;// ./node_modules/@wordpress/components/build-module/border-box-control/border-box-control-visualizer/hook.js /** * WordPress dependencies */ @@ -35111,11 +35482,7 @@ }; } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/border-box-control/border-box-control-visualizer/component.js -/** - * WordPress dependencies - */ - +;// ./node_modules/@wordpress/components/build-module/border-box-control/border-box-control-visualizer/component.js /** * Internal dependencies */ @@ -35136,22 +35503,7 @@ const ConnectedBorderBoxControlVisualizer = contextConnect(BorderBoxControlVisualizer, 'BorderBoxControlVisualizer'); /* harmony default export */ const border_box_control_visualizer_component = (ConnectedBorderBoxControlVisualizer); -;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/close-small.js -/** - * WordPress dependencies - */ - - -const closeSmall = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { - xmlns: "http://www.w3.org/2000/svg", - viewBox: "0 0 24 24", - children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { - 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" - }) -}); -/* harmony default export */ const close_small = (closeSmall); - -;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/line-solid.js +;// ./node_modules/@wordpress/icons/build-module/library/line-solid.js /** * WordPress dependencies */ @@ -35166,7 +35518,7 @@ }); /* harmony default export */ const line_solid = (lineSolid); -;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/line-dashed.js +;// ./node_modules/@wordpress/icons/build-module/library/line-dashed.js /** * WordPress dependencies */ @@ -35183,7 +35535,7 @@ }); /* harmony default export */ const line_dashed = (lineDashed); -;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/line-dotted.js +;// ./node_modules/@wordpress/icons/build-module/library/line-dotted.js /** * WordPress dependencies */ @@ -35200,78 +35552,7 @@ }); /* harmony default export */ const line_dotted = (lineDotted); -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/context/DeprecatedLayoutGroupContext.mjs - - -/** - * Note: Still used by components generated by old versions of Framer - * - * @deprecated - */ -const DeprecatedLayoutGroupContext = (0,external_React_.createContext)(null); - - - -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/projection/node/group.mjs -const notify = (node) => !node.isLayoutDirty && node.willUpdate(false); -function nodeGroup() { - const nodes = new Set(); - const subscriptions = new WeakMap(); - const dirtyAll = () => nodes.forEach(notify); - return { - add: (node) => { - nodes.add(node); - subscriptions.set(node, node.addEventListener("willUpdate", dirtyAll)); - }, - remove: (node) => { - nodes.delete(node); - const unsubscribe = subscriptions.get(node); - if (unsubscribe) { - unsubscribe(); - subscriptions.delete(node); - } - dirtyAll(); - }, - dirty: dirtyAll, - }; -} - - - -;// CONCATENATED MODULE: ./node_modules/framer-motion/dist/es/components/LayoutGroup/index.mjs - - - - - - - -const shouldInheritGroup = (inherit) => inherit === true; -const shouldInheritId = (inherit) => shouldInheritGroup(inherit === true) || inherit === "id"; -const LayoutGroup = ({ children, id, inherit = true }) => { - const layoutGroupContext = (0,external_React_.useContext)(LayoutGroupContext); - const deprecatedLayoutGroupContext = (0,external_React_.useContext)(DeprecatedLayoutGroupContext); - const [forceRender, key] = use_force_update_useForceUpdate(); - const context = (0,external_React_.useRef)(null); - const upstreamId = layoutGroupContext.id || deprecatedLayoutGroupContext; - if (context.current === null) { - if (shouldInheritId(inherit) && upstreamId) { - id = id ? upstreamId + "-" + id : upstreamId; - } - context.current = { - id, - group: shouldInheritGroup(inherit) - ? layoutGroupContext.group || nodeGroup() - : nodeGroup(), - }; - } - const memoizedContext = (0,external_React_.useMemo)(() => ({ ...context.current, forceRender }), [key]); - return ((0,external_ReactJSXRuntime_namespaceObject.jsx)(LayoutGroupContext.Provider, { value: memoizedContext, children: children })); -}; - - - -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/toggle-group-control/toggle-group-control/styles.js +;// ./node_modules/@wordpress/components/build-module/toggle-group-control/toggle-group-control/styles.js 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)."; } /** @@ -35286,7 +35567,7 @@ isBlock, isDeselectable, size -}) => /*#__PURE__*/emotion_react_browser_esm_css("background:", COLORS.ui.background, ";border:1px solid transparent;border-radius:", config_values.controlBorderRadius, ";display:inline-flex;min-width:0;position:relative;", toggleGroupControlSize(size), " ", !isDeselectable && enclosingBorders(isBlock), ";" + ( true ? "" : 0), true ? "" : 0); +}) => /*#__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), "@media not ( prefers-reduced-motion ){&[data-indicator-animated]::before{transition-property:transform,border-radius;transition-duration:0.2s;transition-timing-function:ease-out;}}&::before{content:'';position:absolute;pointer-events:none;background:", COLORS.theme.foreground, ";outline:2px solid transparent;outline-offset:-3px;--antialiasing-factor:100;border-radius:calc(\n\t\t\t\t", config_values.radiusXSmall, " /\n\t\t\t\t\t(\n\t\t\t\t\t\tvar( --selected-width, 0 ) /\n\t\t\t\t\t\t\tvar( --antialiasing-factor )\n\t\t\t\t\t)\n\t\t\t)/", config_values.radiusXSmall, ";left:-1px;width:calc( var( --antialiasing-factor ) * 1px );height:calc( var( --selected-height, 0 ) * 1px );transform-origin:left top;transform:translateX( calc( var( --selected-left, 0 ) * 1px ) ) scaleX(\n\t\t\t\tcalc(\n\t\t\t\t\tvar( --selected-width, 0 ) / var( --antialiasing-factor )\n\t\t\t\t)\n\t\t\t);}" + ( true ? "" : 0), true ? "" : 0); const enclosingBorders = isBlock => { const enclosingBorder = /*#__PURE__*/emotion_react_browser_esm_css("border-color:", COLORS.ui.border, ";" + ( true ? "" : 0), true ? "" : 0); 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); @@ -35317,7 +35598,7 @@ styles: "display:flex" } : 0); -;// CONCATENATED MODULE: ./node_modules/@ariakit/core/esm/radio/radio-store.js +;// ./node_modules/@ariakit/core/esm/radio/radio-store.js "use client"; @@ -35329,13 +35610,13 @@ // src/radio/radio-store.ts function createRadioStore(_a = {}) { - var props = _4R3V3JGP_objRest(_a, []); + var props = _3YLGPPWQ_objRest(_a, []); var _a2; const syncState = (_a2 = props.store) == null ? void 0 : _a2.getState(); - const composite = createCompositeStore(_chunks_4R3V3JGP_spreadProps(_chunks_4R3V3JGP_spreadValues({}, props), { + const composite = createCompositeStore(_chunks_3YLGPPWQ_spreadProps(_chunks_3YLGPPWQ_spreadValues({}, props), { focusLoop: defaultValue(props.focusLoop, syncState == null ? void 0 : syncState.focusLoop, true) })); - const initialState = _chunks_4R3V3JGP_spreadProps(_chunks_4R3V3JGP_spreadValues({}, composite.getState()), { + const initialState = _chunks_3YLGPPWQ_spreadProps(_chunks_3YLGPPWQ_spreadValues({}, composite.getState()), { value: defaultValue( props.value, syncState == null ? void 0 : syncState.value, @@ -35344,13 +35625,13 @@ ) }); const radio = createStore(initialState, composite, props.store); - return _chunks_4R3V3JGP_spreadProps(_chunks_4R3V3JGP_spreadValues(_chunks_4R3V3JGP_spreadValues({}, composite), radio), { + return _chunks_3YLGPPWQ_spreadProps(_chunks_3YLGPPWQ_spreadValues(_chunks_3YLGPPWQ_spreadValues({}, composite), radio), { setValue: (value) => radio.setState("value", value) }); } -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/LEIRFLRL.js +;// ./node_modules/@ariakit/react-core/esm/__chunks/4BXJGRNH.js "use client"; @@ -35363,31 +35644,31 @@ return store; } function useRadioStore(props = {}) { - const [store, update] = EKQEJRUF_useStore(createRadioStore, props); + const [store, update] = YV4JVR4I_useStore(createRadioStore, props); return useRadioStoreProps(store, update, props); } -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/XEV62JUQ.js +;// ./node_modules/@ariakit/react-core/esm/__chunks/UVUMR3WP.js "use client"; // src/radio/radio-context.tsx -var XEV62JUQ_ctx = createStoreContext( +var UVUMR3WP_ctx = createStoreContext( [CompositeContextProvider], [CompositeScopedContextProvider] ); -var useRadioContext = XEV62JUQ_ctx.useContext; -var useRadioScopedContext = XEV62JUQ_ctx.useScopedContext; -var useRadioProviderContext = XEV62JUQ_ctx.useProviderContext; -var RadioContextProvider = XEV62JUQ_ctx.ContextProvider; -var RadioScopedContextProvider = XEV62JUQ_ctx.ScopedContextProvider; - - - -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/radio/radio-group.js +var useRadioContext = UVUMR3WP_ctx.useContext; +var useRadioScopedContext = UVUMR3WP_ctx.useScopedContext; +var useRadioProviderContext = UVUMR3WP_ctx.useProviderContext; +var RadioContextProvider = UVUMR3WP_ctx.ContextProvider; +var RadioScopedContextProvider = UVUMR3WP_ctx.ScopedContextProvider; + + + +;// ./node_modules/@ariakit/react-core/esm/radio/radio-group.js "use client"; @@ -35404,8 +35685,9 @@ // src/radio/radio-group.tsx +var radio_group_TagName = "div"; var useRadioGroup = createHook( - (_a) => { + function useRadioGroup2(_a) { var _b = _a, { store } = _b, props = __objRest(_b, ["store"]); const context = useRadioProviderContext(); store = store || context; @@ -35418,21 +35700,20 @@ (element) => /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(RadioScopedContextProvider, { value: store, children: element }), [store] ); - props = _4R3V3JGP_spreadValues({ + props = _3YLGPPWQ_spreadValues({ role: "radiogroup" }, props); - props = useComposite(_4R3V3JGP_spreadValues({ store }, props)); + props = useComposite(_3YLGPPWQ_spreadValues({ store }, props)); return props; } ); -var RadioGroup = createComponent((props) => { +var RadioGroup = forwardRef2(function RadioGroup2(props) { const htmlProps = useRadioGroup(props); - return _3ORBWXWF_createElement("div", htmlProps); -}); -if (false) {} - - -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/toggle-group-control/context.js + return LMDWO4NN_createElement(radio_group_TagName, htmlProps); +}); + + +;// ./node_modules/@wordpress/components/build-module/toggle-group-control/context.js /** * WordPress dependencies */ @@ -35446,7 +35727,7 @@ const useToggleGroupControlContext = () => (0,external_wp_element_namespaceObject.useContext)(ToggleGroupControlContext); /* harmony default export */ const toggle_group_control_context = (ToggleGroupControlContext); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/toggle-group-control/toggle-group-control/utils.js +;// ./node_modules/@wordpress/components/build-module/toggle-group-control/toggle-group-control/utils.js /** * WordPress dependencies */ @@ -35465,20 +35746,20 @@ * @param valueProp The received `value` */ function useComputeControlledOrUncontrolledValue(valueProp) { - const isInitialRender = (0,external_wp_element_namespaceObject.useRef)(true); + const isInitialRenderRef = (0,external_wp_element_namespaceObject.useRef)(true); const prevValueProp = (0,external_wp_compose_namespaceObject.usePrevious)(valueProp); - const prevIsControlled = (0,external_wp_element_namespaceObject.useRef)(false); + const prevIsControlledRef = (0,external_wp_element_namespaceObject.useRef)(false); (0,external_wp_element_namespaceObject.useEffect)(() => { - if (isInitialRender.current) { - isInitialRender.current = false; + if (isInitialRenderRef.current) { + isInitialRenderRef.current = false; } }, []); // Assume the component is being used in controlled mode on the first re-render // that has a different `valueProp` from the previous render. - const isControlled = prevIsControlled.current || !isInitialRender.current && prevValueProp !== valueProp; + const isControlled = prevIsControlledRef.current || !isInitialRenderRef.current && prevValueProp !== valueProp; (0,external_wp_element_namespaceObject.useEffect)(() => { - prevIsControlled.current = isControlled; + prevIsControlledRef.current = isControlled; }, [isControlled]); if (isControlled) { // When in controlled mode, use `''` instead of `undefined` @@ -35495,17 +35776,17 @@ }; } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/toggle-group-control/toggle-group-control/as-radio-group.js -/** - * External dependencies - */ - -// eslint-disable-next-line no-restricted-imports - - -/** - * WordPress dependencies - */ +;// ./node_modules/@wordpress/components/build-module/toggle-group-control/toggle-group-control/as-radio-group.js +/** + * External dependencies + */ + + + +/** + * WordPress dependencies + */ + @@ -35524,6 +35805,7 @@ size, value: valueProp, id: idProp, + setSelectedElement, ...otherProps }, forwardedRef) { const generatedId = (0,external_wp_compose_namespaceObject.useInstanceId)(ToggleGroupControlAsRadioGroup, 'toggle-group-control-as-radio-group'); @@ -35546,17 +35828,29 @@ const radio = useRadioStore({ defaultValue, value, - setValue: wrappedOnChangeProp - }); - const selectedValue = radio.useState('value'); + setValue: wrappedOnChangeProp, + rtl: (0,external_wp_i18n_namespaceObject.isRTL)() + }); + const selectedValue = useStoreState(radio, 'value'); const setValue = radio.setValue; + + // Ensures that the active id is also reset after the value is "reset" by the consumer. + (0,external_wp_element_namespaceObject.useEffect)(() => { + if (selectedValue === '') { + radio.setActiveId(undefined); + } + }, [radio, selectedValue]); const groupContextValue = (0,external_wp_element_namespaceObject.useMemo)(() => ({ + activeItemIsNotFirstItem: () => radio.getState().activeId !== radio.first(), baseId, isBlock: !isAdaptiveWidth, size, + // @ts-expect-error - This is wrong and we should fix it. value: selectedValue, - setValue - }), [baseId, isAdaptiveWidth, size, selectedValue, setValue]); + // @ts-expect-error - This is wrong and we should fix it. + setValue, + setSelectedElement + }), [baseId, isAdaptiveWidth, radio, selectedValue, setSelectedElement, setValue, size]); return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(toggle_group_control_context.Provider, { value: groupContextValue, children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(RadioGroup, { @@ -35572,7 +35866,7 @@ } const ToggleGroupControlAsRadioGroup = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedToggleGroupControlAsRadioGroup); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/utils/hooks/use-controlled-value.js +;// ./node_modules/@wordpress/components/build-module/utils/hooks/use-controlled-value.js /** * WordPress dependencies */ @@ -35609,7 +35903,7 @@ return [value, setValue]; } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/toggle-group-control/toggle-group-control/as-button-group.js +;// ./node_modules/@wordpress/components/build-module/toggle-group-control/toggle-group-control/as-button-group.js /** * WordPress dependencies */ @@ -35632,6 +35926,7 @@ size, value: valueProp, id: idProp, + setSelectedElement, ...otherProps }, forwardedRef) { const generatedId = (0,external_wp_compose_namespaceObject.useInstanceId)(ToggleGroupControlAsButtonGroup, 'toggle-group-control-as-button-group'); @@ -35656,8 +35951,9 @@ setValue: setSelectedValue, isBlock: !isAdaptiveWidth, isDeselectable: true, - size - }), [baseId, selectedValue, setSelectedValue, isAdaptiveWidth, size]); + size, + setSelectedElement + }), [baseId, selectedValue, setSelectedValue, isAdaptiveWidth, size, setSelectedElement]); return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(toggle_group_control_context.Provider, { value: groupContextValue, children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(component, { @@ -35671,23 +35967,273 @@ } const ToggleGroupControlAsButtonGroup = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedToggleGroupControlAsButtonGroup); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/toggle-group-control/toggle-group-control/component.js -/** - * External dependencies - */ - -// eslint-disable-next-line no-restricted-imports - - -/** - * WordPress dependencies - */ - - - -/** - * Internal dependencies - */ +;// ./node_modules/@wordpress/components/build-module/utils/element-rect.js +/* eslint-disable jsdoc/require-param */ +/** + * WordPress dependencies + */ + + + +/** + * The position and dimensions of an element, relative to its offset parent. + */ + +/** + * An `ElementOffsetRect` object with all values set to zero. + */ +const NULL_ELEMENT_OFFSET_RECT = { + element: undefined, + top: 0, + right: 0, + bottom: 0, + left: 0, + width: 0, + height: 0 +}; + +/** + * Returns the position and dimensions of an element, relative to its offset + * parent, with subpixel precision. Values reflect the real measures before any + * potential scaling distortions along the X and Y axes. + * + * Useful in contexts where plain `getBoundingClientRect` calls or `ResizeObserver` + * entries are not suitable, such as when the element is transformed, and when + * `element.offset` methods are not precise enough. + * + * **Note:** in some contexts, like when the scale is 0, this method will fail + * because it's impossible to calculate a scaling ratio. When that happens, it + * will return `undefined`. + */ +function getElementOffsetRect(element) { + var _offsetParent$getBoun, _offsetParent$scrollL, _offsetParent$scrollT; + // Position and dimension values computed with `getBoundingClientRect` have + // subpixel precision, but are affected by distortions since they represent + // the "real" measures, or in other words, the actual final values as rendered + // by the browser. + const rect = element.getBoundingClientRect(); + if (rect.width === 0 || rect.height === 0) { + return; + } + const offsetParent = element.offsetParent; + const offsetParentRect = (_offsetParent$getBoun = offsetParent?.getBoundingClientRect()) !== null && _offsetParent$getBoun !== void 0 ? _offsetParent$getBoun : NULL_ELEMENT_OFFSET_RECT; + const offsetParentScrollX = (_offsetParent$scrollL = offsetParent?.scrollLeft) !== null && _offsetParent$scrollL !== void 0 ? _offsetParent$scrollL : 0; + const offsetParentScrollY = (_offsetParent$scrollT = offsetParent?.scrollTop) !== null && _offsetParent$scrollT !== void 0 ? _offsetParent$scrollT : 0; + + // Computed widths and heights have subpixel precision, and are not affected + // by distortions. + const computedWidth = parseFloat(getComputedStyle(element).width); + const computedHeight = parseFloat(getComputedStyle(element).height); + + // We can obtain the current scale factor for the element by comparing "computed" + // dimensions with the "real" ones. + const scaleX = computedWidth / rect.width; + const scaleY = computedHeight / rect.height; + return { + element, + // To obtain the adjusted values for the position: + // 1. Compute the element's position relative to the offset parent. + // 2. Correct for the scale factor. + // 3. Adjust for the scroll position of the offset parent. + top: (rect.top - offsetParentRect?.top) * scaleY + offsetParentScrollY, + right: (offsetParentRect?.right - rect.right) * scaleX - offsetParentScrollX, + bottom: (offsetParentRect?.bottom - rect.bottom) * scaleY - offsetParentScrollY, + left: (rect.left - offsetParentRect?.left) * scaleX + offsetParentScrollX, + // Computed dimensions don't need any adjustments. + width: computedWidth, + height: computedHeight + }; +} +const POLL_RATE = 100; + +/** + * Tracks the position and dimensions of an element, relative to its offset + * parent. The element can be changed dynamically. + * + * When no element is provided (`null` or `undefined`), the hook will return + * a "null" rect, in which all values are `0` and `element` is `undefined`. + * + * **Note:** sometimes, the measurement will fail (see `getElementOffsetRect`'s + * documentation for more details). When that happens, this hook will attempt + * to measure again after a frame, and if that fails, it will poll every 100 + * milliseconds until it succeeds. + */ +function useTrackElementOffsetRect(targetElement, deps = []) { + const [indicatorPosition, setIndicatorPosition] = (0,external_wp_element_namespaceObject.useState)(NULL_ELEMENT_OFFSET_RECT); + const intervalRef = (0,external_wp_element_namespaceObject.useRef)(); + const measure = (0,external_wp_compose_namespaceObject.useEvent)(() => { + // Check that the targetElement is still attached to the DOM, in case + // it was removed since the last `measure` call. + if (targetElement && targetElement.isConnected) { + const elementOffsetRect = getElementOffsetRect(targetElement); + if (elementOffsetRect) { + setIndicatorPosition(elementOffsetRect); + clearInterval(intervalRef.current); + return true; + } + } else { + clearInterval(intervalRef.current); + } + return false; + }); + const setElement = (0,external_wp_compose_namespaceObject.useResizeObserver)(() => { + if (!measure()) { + requestAnimationFrame(() => { + if (!measure()) { + intervalRef.current = setInterval(measure, POLL_RATE); + } + }); + } + }); + (0,external_wp_element_namespaceObject.useLayoutEffect)(() => { + setElement(targetElement); + if (!targetElement) { + setIndicatorPosition(NULL_ELEMENT_OFFSET_RECT); + } + }, [setElement, targetElement]); + + // Escape hatch to force a remeasurement when something else changes rather + // than the target elements' ref or size (for example, the target element + // can change its position within the tablist). + (0,external_wp_element_namespaceObject.useLayoutEffect)(() => { + measure(); + // `measure` is a stable function, so it's safe to omit it from the deps array. + // deps can't be statically analyzed by ESLint + }, deps); + return indicatorPosition; +} + +/* eslint-enable jsdoc/require-param */ + +;// ./node_modules/@wordpress/components/build-module/utils/hooks/use-on-value-update.js +/* eslint-disable jsdoc/require-param */ +/** + * WordPress dependencies + */ + + + +/** + * Context object for the `onUpdate` callback of `useOnValueUpdate`. + */ + +/** + * Calls the `onUpdate` callback when the `value` changes. + */ +function useOnValueUpdate( +/** + * The value to watch for changes. + */ +value, +/** + * Callback to fire when the value changes. + */ +onUpdate) { + const previousValueRef = (0,external_wp_element_namespaceObject.useRef)(value); + const updateCallbackEvent = (0,external_wp_compose_namespaceObject.useEvent)(onUpdate); + (0,external_wp_element_namespaceObject.useLayoutEffect)(() => { + if (previousValueRef.current !== value) { + updateCallbackEvent({ + previousValue: previousValueRef.current + }); + previousValueRef.current = value; + } + }, [updateCallbackEvent, value]); +} +/* eslint-enable jsdoc/require-param */ + +;// ./node_modules/@wordpress/components/build-module/utils/hooks/use-animated-offset-rect.js +/* eslint-disable jsdoc/require-param */ + +/** + * WordPress dependencies + */ + + +/** + * Internal dependencies + */ + + + +/** + * A utility used to animate something in a container component based on the "offset + * rect" (position relative to the container and size) of a subelement. For example, + * this is useful to render an indicator for the selected option of a component, and + * to animate it when the selected option changes. + * + * Takes in a container element and the up-to-date "offset rect" of the target + * subelement, obtained with `useTrackElementOffsetRect`. Then it does the following: + * + * - Adds CSS variables with rect information to the container, so that the indicator + * can be rendered and animated with them. These are kept up-to-date, enabling CSS + * transitions on change. + * - Sets an attribute (`data-subelement-animated` by default) when the tracked + * element changes, so that the target (e.g. the indicator) can be animated to its + * new size and position. + * - Removes the attribute when the animation is done. + * + * The need for the attribute is due to the fact that the rect might update in + * situations other than when the tracked element changes, e.g. the tracked element + * might be resized. In such cases, there is no need to animate the indicator, and + * the change in size or position of the indicator needs to be reflected immediately. + */ +function useAnimatedOffsetRect( +/** + * The container element. + */ +container, +/** + * The rect of the tracked element. + */ +rect, { + prefix = 'subelement', + dataAttribute = `${prefix}-animated`, + transitionEndFilter = () => true, + roundRect = false +} = {}) { + const setProperties = (0,external_wp_compose_namespaceObject.useEvent)(() => { + Object.keys(rect).forEach(property => property !== 'element' && container?.style.setProperty(`--${prefix}-${property}`, String(roundRect ? Math.floor(rect[property]) : rect[property]))); + }); + (0,external_wp_element_namespaceObject.useLayoutEffect)(() => { + setProperties(); + }, [rect, setProperties]); + useOnValueUpdate(rect.element, ({ + previousValue + }) => { + // Only enable the animation when moving from one element to another. + if (rect.element && previousValue) { + container?.setAttribute(`data-${dataAttribute}`, ''); + } + }); + (0,external_wp_element_namespaceObject.useLayoutEffect)(() => { + function onTransitionEnd(event) { + if (transitionEndFilter(event)) { + container?.removeAttribute(`data-${dataAttribute}`); + } + } + container?.addEventListener('transitionend', onTransitionEnd); + return () => container?.removeEventListener('transitionend', onTransitionEnd); + }, [dataAttribute, container, transitionEndFilter]); +} +/* eslint-enable jsdoc/require-param */ + +;// ./node_modules/@wordpress/components/build-module/toggle-group-control/toggle-group-control/component.js +/** + * External dependencies + */ + +/** + * WordPress dependencies + */ + + +/** + * Internal dependencies + */ + + + @@ -35702,6 +36248,7 @@ const { __nextHasNoMarginBottom = false, __next40pxDefaultSize = false, + __shouldNotWarnDeprecated36pxSize, className, isAdaptiveWidth = false, isBlock = false, @@ -35715,8 +36262,17 @@ children, ...otherProps } = useContextSystem(props, 'ToggleGroupControl'); - const baseId = (0,external_wp_compose_namespaceObject.useInstanceId)(ToggleGroupControl, 'toggle-group-control'); const normalizedSize = __next40pxDefaultSize && size === 'default' ? '__unstable-large' : size; + const [selectedElement, setSelectedElement] = (0,external_wp_element_namespaceObject.useState)(); + const [controlElement, setControlElement] = (0,external_wp_element_namespaceObject.useState)(); + const refs = (0,external_wp_compose_namespaceObject.useMergeRefs)([setControlElement, forwardedRef]); + const selectedRect = useTrackElementOffsetRect(value !== null && value !== undefined ? selectedElement : undefined); + useAnimatedOffsetRect(controlElement, selectedRect, { + prefix: 'selected', + dataAttribute: 'indicator-animated', + transitionEndFilter: event => event.pseudoElement === '::before', + roundRect: true + }); const cx = useCx(); const classes = (0,external_wp_element_namespaceObject.useMemo)(() => cx(toggleGroupControl({ isBlock, @@ -35724,26 +36280,31 @@ size: normalizedSize }), isBlock && toggle_group_control_styles_block, className), [className, cx, isBlock, isDeselectable, normalizedSize]); const MainControl = isDeselectable ? ToggleGroupControlAsButtonGroup : ToggleGroupControlAsRadioGroup; + maybeWarnDeprecated36pxSize({ + componentName: 'ToggleGroupControl', + size, + __next40pxDefaultSize, + __shouldNotWarnDeprecated36pxSize + }); return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(base_control, { help: help, __nextHasNoMarginBottom: __nextHasNoMarginBottom, + __associatedWPComponentName: "ToggleGroupControl", children: [!hideLabelFromVision && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(VisualLabelWrapper, { children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(base_control.VisualLabel, { children: label }) }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(MainControl, { ...otherProps, + setSelectedElement: setSelectedElement, className: classes, isAdaptiveWidth: isAdaptiveWidth, label: label, onChange: onChange, - ref: forwardedRef, + ref: refs, size: normalizedSize, value: value, - children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(LayoutGroup, { - id: baseId, - children: children - }) + children: children })] }); } @@ -35769,7 +36330,13 @@ * * function Example() { * return ( - * + * * * * @@ -35780,21 +36347,21 @@ const ToggleGroupControl = contextConnect(UnconnectedToggleGroupControl, 'ToggleGroupControl'); /* harmony default export */ const toggle_group_control_component = (ToggleGroupControl); -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/JL6IRDFK.js -"use client"; - - - - - - - -// src/radio/radio.ts - - +;// ./node_modules/@ariakit/react-core/esm/__chunks/NLEBE274.js +"use client"; + + + + + + + +// src/radio/radio.tsx + + +var NLEBE274_TagName = "input"; function getIsChecked(value, storeValue) { - if (storeValue === void 0) - return; + if (storeValue === void 0) return; if (value != null && storeValue != null) { return storeValue === value; } @@ -35803,116 +36370,116 @@ function isNativeRadio(tagName, type) { return tagName === "input" && (!type || type === "radio"); } -var useRadio = createHook( - (_a) => { - var _b = _a, { store, name, value, checked } = _b, props = __objRest(_b, ["store", "name", "value", "checked"]); - const context = useRadioContext(); - store = store || context; - const id = useId(props.id); - const ref = (0,external_React_.useRef)(null); - const isChecked = useStoreState( - store, - (state) => checked != null ? checked : getIsChecked(value, state == null ? void 0 : state.value) - ); - (0,external_React_.useEffect)(() => { - if (!id) - return; - if (!isChecked) - return; - const isActiveItem = (store == null ? void 0 : store.getState().activeId) === id; - if (isActiveItem) - return; - store == null ? void 0 : store.setActiveId(id); - }, [store, isChecked, id]); - const onChangeProp = props.onChange; - const tagName = useTagName(ref, props.as || "input"); - const nativeRadio = isNativeRadio(tagName, props.type); - const disabled = disabledFromProps(props); - const [propertyUpdated, schedulePropertyUpdate] = useForceUpdate(); - (0,external_React_.useEffect)(() => { - const element = ref.current; - if (!element) - return; - if (nativeRadio) - return; - if (isChecked !== void 0) { - element.checked = isChecked; - } - if (name !== void 0) { - element.name = name; - } - if (value !== void 0) { - element.value = `${value}`; - } - }, [propertyUpdated, nativeRadio, isChecked, name, value]); - const onChange = useEvent((event) => { - if (disabled) { - event.preventDefault(); - event.stopPropagation(); - return; - } - if (!nativeRadio) { - event.currentTarget.checked = true; - schedulePropertyUpdate(); - } - onChangeProp == null ? void 0 : onChangeProp(event); - if (event.defaultPrevented) - return; - store == null ? void 0 : store.setValue(value); - }); - const onClickProp = props.onClick; - const onClick = useEvent((event) => { - onClickProp == null ? void 0 : onClickProp(event); - if (event.defaultPrevented) - return; - if (nativeRadio) - return; - onChange(event); - }); - const onFocusProp = props.onFocus; - const onFocus = useEvent((event) => { - onFocusProp == null ? void 0 : onFocusProp(event); - if (event.defaultPrevented) - return; - if (!nativeRadio) - return; - if (!store) - return; - const { moves, activeId } = store.getState(); - if (!moves) - return; - if (id && activeId !== id) - return; - onChange(event); - }); - props = _4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues({ - id, - role: !nativeRadio ? "radio" : void 0, - type: nativeRadio ? "radio" : void 0, - "aria-checked": isChecked - }, props), { - ref: useMergeRefs(ref, props.ref), - onChange, - onClick, - onFocus - }); - props = useCompositeItem(_4R3V3JGP_spreadValues({ store, clickOnEnter: !nativeRadio }, props)); - return _4R3V3JGP_spreadValues({ - name: nativeRadio ? name : void 0, - value: nativeRadio ? value : void 0, - checked: isChecked - }, props); - } -); -var Radio = createMemoComponent((props) => { - const htmlProps = useRadio(props); - return _3ORBWXWF_createElement("input", htmlProps); -}); -if (false) {} - - - -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/toggle-group-control/toggle-group-control-option-base/styles.js +var useRadio = createHook(function useRadio2(_a) { + var _b = _a, { + store, + name, + value, + checked + } = _b, props = __objRest(_b, [ + "store", + "name", + "value", + "checked" + ]); + const context = useRadioContext(); + store = store || context; + const id = useId(props.id); + const ref = (0,external_React_.useRef)(null); + const isChecked = useStoreState( + store, + (state) => checked != null ? checked : getIsChecked(value, state == null ? void 0 : state.value) + ); + (0,external_React_.useEffect)(() => { + if (!id) return; + if (!isChecked) return; + const isActiveItem = (store == null ? void 0 : store.getState().activeId) === id; + if (isActiveItem) return; + store == null ? void 0 : store.setActiveId(id); + }, [store, isChecked, id]); + const onChangeProp = props.onChange; + const tagName = useTagName(ref, NLEBE274_TagName); + const nativeRadio = isNativeRadio(tagName, props.type); + const disabled = disabledFromProps(props); + const [propertyUpdated, schedulePropertyUpdate] = useForceUpdate(); + (0,external_React_.useEffect)(() => { + const element = ref.current; + if (!element) return; + if (nativeRadio) return; + if (isChecked !== void 0) { + element.checked = isChecked; + } + if (name !== void 0) { + element.name = name; + } + if (value !== void 0) { + element.value = `${value}`; + } + }, [propertyUpdated, nativeRadio, isChecked, name, value]); + const onChange = useEvent((event) => { + if (disabled) { + event.preventDefault(); + event.stopPropagation(); + return; + } + if ((store == null ? void 0 : store.getState().value) === value) return; + if (!nativeRadio) { + event.currentTarget.checked = true; + schedulePropertyUpdate(); + } + onChangeProp == null ? void 0 : onChangeProp(event); + if (event.defaultPrevented) return; + store == null ? void 0 : store.setValue(value); + }); + const onClickProp = props.onClick; + const onClick = useEvent((event) => { + onClickProp == null ? void 0 : onClickProp(event); + if (event.defaultPrevented) return; + if (nativeRadio) return; + onChange(event); + }); + const onFocusProp = props.onFocus; + const onFocus = useEvent((event) => { + onFocusProp == null ? void 0 : onFocusProp(event); + if (event.defaultPrevented) return; + if (!nativeRadio) return; + if (!store) return; + const { moves, activeId } = store.getState(); + if (!moves) return; + if (id && activeId !== id) return; + onChange(event); + }); + props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({ + id, + role: !nativeRadio ? "radio" : void 0, + type: nativeRadio ? "radio" : void 0, + "aria-checked": isChecked + }, props), { + ref: useMergeRefs(ref, props.ref), + onChange, + onClick, + onFocus + }); + props = useCompositeItem(_3YLGPPWQ_spreadValues({ + store, + clickOnEnter: !nativeRadio + }, props)); + return removeUndefinedValues(_3YLGPPWQ_spreadValues({ + name: nativeRadio ? name : void 0, + value: nativeRadio ? value : void 0, + checked: isChecked + }, props)); +}); +var Radio = memo2( + forwardRef2(function Radio2(props) { + const htmlProps = useRadio(props); + return LMDWO4NN_createElement(NLEBE274_TagName, htmlProps); + }) +); + + + +;// ./node_modules/@wordpress/components/build-module/toggle-group-control/toggle-group-control-option-base/styles.js 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)."; } /** @@ -35938,11 +36505,11 @@ isIcon, isPressed, size -}) => /*#__PURE__*/emotion_react_browser_esm_css("align-items:center;appearance:none;background:transparent;border:none;border-radius:", config_values.controlBorderRadius, ";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;}&:active{background:", config_values.toggleGroupControlBackgroundColor, ";}", isDeselectable && deselectable, " ", isIcon && isIconStyles({ +}) => /*#__PURE__*/emotion_react_browser_esm_css("align-items:center;appearance:none;background:transparent;border:none;border-radius:", config_values.radiusXSmall, ";color:", COLORS.theme.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:", COLORS.ui.background, ";}", isDeselectable && deselectable, " ", isIcon && isIconStyles({ size }), " ", isPressed && pressed, ";" + ( true ? "" : 0), true ? "" : 0); -const pressed = /*#__PURE__*/emotion_react_browser_esm_css("color:", COLORS.white, ";&:active{background:transparent;}" + ( true ? "" : 0), true ? "" : 0); -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); +const pressed = /*#__PURE__*/emotion_react_browser_esm_css("color:", COLORS.theme.foregroundInverted, ";&:active{background:transparent;}" + ( true ? "" : 0), true ? "" : 0); +const deselectable = /*#__PURE__*/emotion_react_browser_esm_css("color:", COLORS.theme.foreground, ";&:focus{box-shadow:inset 0 0 0 1px ", COLORS.ui.background, ",0 0 0 ", config_values.borderWidthFocus, " ", COLORS.theme.accent, ";outline:2px solid transparent;}" + ( true ? "" : 0), true ? "" : 0); const ButtonContentView = /*#__PURE__*/emotion_styled_base_browser_esm("div", true ? { target: "et6ln9s0" } : 0)("display:flex;font-size:", config_values.fontSize, ";line-height:1;" + ( true ? "" : 0)); @@ -35953,31 +36520,25 @@ default: '30px', '__unstable-large': '32px' }; - 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); -}; -const backdropView = /*#__PURE__*/emotion_react_browser_esm_css("background:", COLORS.gray[900], ";border-radius:", config_values.controlBorderRadius, ";position:absolute;inset:0;z-index:1;outline:2px solid transparent;outline-offset:-3px;" + ( true ? "" : 0), true ? "" : 0); - -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/toggle-group-control/toggle-group-control-option-base/component.js -/** - * External dependencies - */ - -// eslint-disable-next-line no-restricted-imports - -// eslint-disable-next-line no-restricted-imports - - -/** - * WordPress dependencies - */ - - - -/** - * Internal dependencies - */ - - + return /*#__PURE__*/emotion_react_browser_esm_css("color:", COLORS.theme.foreground, ";height:", iconButtonSizes[size], ";aspect-ratio:1;padding-left:0;padding-right:0;" + ( true ? "" : 0), true ? "" : 0); +}; + +;// ./node_modules/@wordpress/components/build-module/toggle-group-control/toggle-group-control-option-base/component.js +/** + * External dependencies + */ + + + +/** + * WordPress dependencies + */ + + + +/** + * Internal dependencies + */ @@ -35986,13 +36547,9 @@ const { - ButtonContentView: component_ButtonContentView, - LabelView: component_LabelView + /* ButtonContentView */ "Rp": component_ButtonContentView, + /* LabelView */ "y0": component_LabelView } = toggle_group_control_option_base_styles_namespaceObject; -const REDUCED_MOTION_TRANSITION_CONFIG = { - duration: 0 -}; -const LAYOUT_ID = 'toggle-group-backdrop-shared-layout-id'; const WithToolTip = ({ showTooltip, text, @@ -36010,7 +36567,6 @@ }); }; function ToggleGroupControlOptionBase(props, forwardedRef) { - const shouldReduceMotion = (0,external_wp_compose_namespaceObject.useReducedMotion)(); const toggleGroupControlContext = useToggleGroupControlContext(); const id = (0,external_wp_compose_namespaceObject.useInstanceId)(ToggleGroupControlOptionBase, toggleGroupControlContext.baseId || 'toggle-group-control-option-base'); const buttonProps = useContextSystem({ @@ -36028,7 +36584,7 @@ value, children, showTooltip = false, - onFocus: onFocusProp, + disabled, ...otherButtonProps } = buttonProps; const isPressed = toggleGroupControlContext.value === value; @@ -36040,7 +36596,6 @@ isPressed, size }), className), [cx, isDeselectable, isIcon, isPressed, size, className]); - const backdropClasses = (0,external_wp_element_namespaceObject.useMemo)(() => cx(backdropView), [cx]); const buttonOnClick = () => { if (isDeselectable && isPressed) { toggleGroupControlContext.setValue(undefined); @@ -36054,14 +36609,21 @@ 'data-value': value, ref: forwardedRef }; - return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(component_LabelView, { + const labelRef = (0,external_wp_element_namespaceObject.useRef)(null); + (0,external_wp_element_namespaceObject.useLayoutEffect)(() => { + if (isPressed && labelRef.current) { + toggleGroupControlContext.setSelectedElement(labelRef.current); + } + }, [isPressed, toggleGroupControlContext]); + return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(component_LabelView, { + ref: labelRef, className: labelViewClasses, - children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(WithToolTip, { + children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(WithToolTip, { showTooltip: showTooltip, text: otherButtonProps['aria-label'], children: isDeselectable ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("button", { ...commonProps, - onFocus: onFocusProp, + disabled: disabled, "aria-pressed": isPressed, type: "button", onClick: buttonOnClick, @@ -36069,32 +36631,26 @@ children: children }) }) : /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Radio, { + disabled: disabled, + onFocusVisible: () => { + const selectedValueIsEmpty = toggleGroupControlContext.value === null || toggleGroupControlContext.value === ''; + + // Conditions ensure that the first visible focus to a radio group + // without a selected option will not automatically select the option. + if (!selectedValueIsEmpty || toggleGroupControlContext.activeItemIsNotFirstItem?.()) { + toggleGroupControlContext.setValue(value); + } + }, render: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("button", { type: "button", - ...commonProps, - onFocus: event => { - onFocusProp?.(event); - if (event.defaultPrevented) { - return; - } - toggleGroupControlContext.setValue(value); - } + ...commonProps }), value: value, children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(component_ButtonContentView, { children: children }) }) - }), isPressed ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(motion.div, { - layout: true, - layoutRoot: true, - children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(motion.div, { - className: backdropClasses, - transition: shouldReduceMotion ? REDUCED_MOTION_TRANSITION_CONFIG : undefined, - role: "presentation", - layoutId: LAYOUT_ID - }) - }) : null] + }) }); } @@ -36122,7 +36678,7 @@ const ConnectedToggleGroupControlOptionBase = contextConnect(ToggleGroupControlOptionBase, 'ToggleGroupControlOptionBase'); /* harmony default export */ const toggle_group_control_option_base_component = (ConnectedToggleGroupControlOptionBase); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/toggle-group-control/toggle-group-control-option-icon/component.js +;// ./node_modules/@wordpress/components/build-module/toggle-group-control/toggle-group-control-option-icon/component.js /** * External dependencies */ @@ -36170,27 +36726,27 @@ * import { formatLowercase, formatUppercase } from '@wordpress/icons'; * * function Example() { - * return ( - * - * - * - * - * ); + * return ( + * + * + * + * + * ); * } * ``` */ const ToggleGroupControlOptionIcon = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedToggleGroupControlOptionIcon); /* harmony default export */ const toggle_group_control_option_icon_component = (ToggleGroupControlOptionIcon); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/border-control/border-control-style-picker/component.js +;// ./node_modules/@wordpress/components/build-module/border-control/border-control-style-picker/component.js /** * WordPress dependencies */ @@ -36239,7 +36795,7 @@ const BorderControlStylePicker = contextConnect(UnconnectedBorderControlStylePicker, 'BorderControlStylePicker'); /* harmony default export */ const border_control_style_picker_component = (BorderControlStylePicker); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/color-indicator/index.js +;// ./node_modules/@wordpress/components/build-module/color-indicator/index.js /** * External dependencies */ @@ -36283,25 +36839,24 @@ const ColorIndicator = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedColorIndicator); /* harmony default export */ const color_indicator = (ColorIndicator); -;// CONCATENATED MODULE: ./node_modules/colord/plugins/a11y.mjs +;// ./node_modules/colord/plugins/a11y.mjs 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}} -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/dropdown/index.js -/** - * External dependencies - */ - -/** - * WordPress dependencies - */ - - - - -/** - * Internal dependencies - */ - +;// ./node_modules/@wordpress/components/build-module/dropdown/index.js +/** + * External dependencies + */ + +/** + * WordPress dependencies + */ + + + + +/** + * Internal dependencies + */ @@ -36432,21 +36987,21 @@ const Dropdown = contextConnect(UnconnectedDropdown, 'Dropdown'); /* harmony default export */ const dropdown = (Dropdown); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/input-control/input-suffix-wrapper.js -/** - * External dependencies - */ - -/** - * Internal dependencies - */ +;// ./node_modules/@wordpress/components/build-module/input-control/input-suffix-wrapper.js +/** + * External dependencies + */ + +/** + * Internal dependencies + */ + function UnconnectedInputControlSuffixWrapper(props, forwardedRef) { const derivedProps = useContextSystem(props, 'InputControlSuffixWrapper'); - return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(spacer_component, { - marginBottom: 0, + return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(PrefixSuffixWrapper, { ...derivedProps, ref: forwardedRef }); @@ -36470,15 +37025,17 @@ const InputControlSuffixWrapper = contextConnect(UnconnectedInputControlSuffixWrapper, 'InputControlSuffixWrapper'); /* harmony default export */ const input_suffix_wrapper = (InputControlSuffixWrapper); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/select-control/styles/select-control-styles.js - -/** - * External dependencies - */ - -/** - * Internal dependencies - */ +;// ./node_modules/@wordpress/components/build-module/select-control/styles/select-control-styles.js + +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)."; } +/** + * External dependencies + */ + +/** + * Internal dependencies + */ + @@ -36489,10 +37046,23 @@ if (!disabled) { return ''; } - return /*#__PURE__*/emotion_react_browser_esm_css({ - color: COLORS.ui.textDisabled - }, true ? "" : 0, true ? "" : 0); -}; + return /*#__PURE__*/emotion_react_browser_esm_css("color:", COLORS.ui.textDisabled, ";cursor:default;" + ( true ? "" : 0), true ? "" : 0); +}; +var select_control_styles_ref2 = true ? { + name: "1lv1yo7", + styles: "display:inline-flex" +} : 0; +const inputBaseVariantStyles = ({ + variant +}) => { + if (variant === 'minimal') { + return select_control_styles_ref2; + } + return ''; +}; +const StyledInputBase = /*#__PURE__*/emotion_styled_base_browser_esm(input_base, true ? { + target: "e1mv6sxx3" +} : 0)("color:", COLORS.theme.foreground, ";cursor:pointer;", select_control_styles_disabledStyles, " ", inputBaseVariantStyles, ";" + ( true ? "" : 0)); const select_control_styles_sizeStyles = ({ __next40pxDefaultSize, multiple, @@ -36542,10 +37112,10 @@ selectSize = 'default' }) => { const padding = { - default: 16, - small: 8, - compact: 8, - '__unstable-large': 16 + default: config_values.controlPaddingX, + small: config_values.controlPaddingXSmall, + compact: config_values.controlPaddingXSmall, + '__unstable-large': config_values.controlPaddingX }; if (!__next40pxDefaultSize) { padding.default = padding.compact; @@ -36567,23 +37137,35 @@ overflow: multiple ? 'auto' : 'hidden' }; }; +var select_control_styles_ref = true ? { + name: "n1jncc", + styles: "field-sizing:content" +} : 0; +const variantStyles = ({ + variant +}) => { + if (variant === 'minimal') { + return select_control_styles_ref; + } + return ''; +}; // TODO: Resolve need to use &&& to increase specificity // https://github.com/WordPress/gutenberg/issues/18483 const Select = /*#__PURE__*/emotion_styled_base_browser_esm("select", true ? { target: "e1mv6sxx2" -} : 0)("&&&{appearance:none;background:transparent;box-sizing:border-box;border:none;box-shadow:none!important;color:", COLORS.gray[900], ";display:block;font-family:inherit;margin:0;width:100%;max-width:none;cursor:pointer;white-space:nowrap;text-overflow:ellipsis;", select_control_styles_disabledStyles, ";", fontSizeStyles, ";", select_control_styles_sizeStyles, ";", sizePaddings, ";", overflowStyles, ";}" + ( true ? "" : 0)); +} : 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)); const DownArrowWrapper = /*#__PURE__*/emotion_styled_base_browser_esm("div", true ? { target: "e1mv6sxx1" -} : 0)("margin-inline-end:", space(-1), ";line-height:0;" + ( true ? "" : 0)); +} : 0)("margin-inline-end:", space(-1), ";line-height:0;path{fill:currentColor;}" + ( true ? "" : 0)); const InputControlSuffixWrapperWithClickThrough = /*#__PURE__*/emotion_styled_base_browser_esm(input_suffix_wrapper, true ? { target: "e1mv6sxx0" } : 0)("position:absolute;pointer-events:none;", rtl({ right: 0 }), ";" + ( true ? "" : 0)); -;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/icon/index.js +;// ./node_modules/@wordpress/icons/build-module/icon/index.js /** * WordPress dependencies */ @@ -36595,7 +37177,7 @@ * Return an SVG icon. * * @param {IconProps} props icon is the SVG component to render - * size is a number specifiying the icon size in pixels + * size is a number specifying the icon size in pixels * Other props will be passed to wrapped SVG component * @param {import('react').ForwardedRef} ref The forwarded ref to the SVG element. * @@ -36615,7 +37197,7 @@ } /* harmony default export */ const icons_build_module_icon = ((0,external_wp_element_namespaceObject.forwardRef)(icon_Icon)); -;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/chevron-down.js +;// ./node_modules/@wordpress/icons/build-module/library/chevron-down.js /** * WordPress dependencies */ @@ -36630,7 +37212,7 @@ }); /* harmony default export */ const chevron_down = (chevronDown); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/select-control/chevron-down.js +;// ./node_modules/@wordpress/components/build-module/select-control/chevron-down.js /** * WordPress dependencies */ @@ -36653,7 +37235,7 @@ }; /* harmony default export */ const select_control_chevron_down = (SelectControlChevronDown); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/select-control/index.js +;// ./node_modules/@wordpress/components/build-module/select-control/index.js /** * External dependencies */ @@ -36679,6 +37261,23 @@ const id = `inspector-select-control-${instanceId}`; return idProp || id; } +function SelectOptions({ + options +}) { + return options.map(({ + id, + label, + value, + ...optionProps + }, index) => { + const key = id || `${label}-${value}-${index}`; + return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("option", { + value: value, + ...optionProps, + children: label + }, key); + }); +} function UnforwardedSelectControl(props, ref) { const { className, @@ -36696,8 +37295,10 @@ children, prefix, suffix, + variant = 'default', __next40pxDefaultSize = false, __nextHasNoMarginBottom = false, + __shouldNotWarnDeprecated36pxSize, ...restProps } = useDeprecated36pxDefaultSizeProp(props); const id = select_control_useUniqueId(idProp); @@ -36725,20 +37326,30 @@ }); }; const classes = dist_clsx('components-select-control', className); + maybeWarnDeprecated36pxSize({ + componentName: 'SelectControl', + __next40pxDefaultSize, + size, + __shouldNotWarnDeprecated36pxSize + }); return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(base_control, { help: help, id: id, __nextHasNoMarginBottom: __nextHasNoMarginBottom, - children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(input_base, { + __associatedWPComponentName: "SelectControl", + children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(StyledInputBase, { className: classes, disabled: disabled, hideLabelFromVision: hideLabelFromVision, id: id, + isBorderless: variant === 'minimal', label: label, size: size, suffix: suffix || !multiple && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(select_control_chevron_down, {}), prefix: prefix, labelPosition: labelPosition, + __unstableInputWidth: variant === 'minimal' ? 'auto' : undefined, + variant: variant, __next40pxDefaultSize: __next40pxDefaultSize, children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Select, { ...restProps, @@ -36752,14 +37363,9 @@ ref: ref, selectSize: size, value: valueProp, - children: children || options.map((option, index) => { - const key = option.id || `${option.label}-${option.value}-${index}`; - return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("option", { - value: option.value, - disabled: option.disabled, - hidden: option.hidden, - children: option.label - }, key); + variant: variant, + children: children || /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(SelectOptions, { + options: options }) }) }) @@ -36779,6 +37385,8 @@ * * return ( * void]} The controlled value and the value setter. */ -function use_controlled_state_useControlledState(currentState, options = defaultOptions) { +function useControlledState(currentState, options = defaultOptions) { const { initial, fallback @@ -36878,9 +37486,9 @@ return [state, setState]; } -/* harmony default export */ const use_controlled_state = (use_controlled_state_useControlledState); - -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/range-control/utils.js +/* harmony default export */ const use_controlled_state = (useControlledState); + +;// ./node_modules/@wordpress/components/build-module/range-control/utils.js /** * WordPress dependencies */ @@ -36937,7 +37545,7 @@ return [state, setState]; } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/range-control/styles/range-control-styles.js +;// ./node_modules/@wordpress/components/build-module/range-control/styles/range-control-styles.js 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)."; } /** @@ -36981,7 +37589,8 @@ } return ''; }; -const range_control_styles_Wrapper = /*#__PURE__*/emotion_styled_base_browser_esm("div", true ? { +const range_control_styles_Wrapper = /*#__PURE__*/emotion_styled_base_browser_esm('div', true ? { + shouldForwardProp: prop => !['color', '__nextHasNoMarginBottom', 'marks'].includes(prop), target: "e1epgpqk13" } : 0)("display:block;flex:1;position:relative;width:100%;", wrapperColor, ";", rangeHeight, ";", wrapperMargin, ";" + ( true ? "" : 0)); const BeforeIconWrapper = /*#__PURE__*/emotion_styled_base_browser_esm("span", true ? { @@ -37008,7 +37617,7 @@ }; const Rail = /*#__PURE__*/emotion_styled_base_browser_esm("span", true ? { target: "e1epgpqk10" -} : 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:", railHeight, "px;", railBackgroundColor, ";" + ( true ? "" : 0)); +} : 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)); const trackBackgroundColor = ({ disabled, trackColor @@ -37023,28 +37632,16 @@ }; const Track = /*#__PURE__*/emotion_styled_base_browser_esm("span", true ? { target: "e1epgpqk9" -} : 0)("background-color:currentColor;border-radius:", railHeight, "px;height:", railHeight, "px;pointer-events:none;display:block;position:absolute;margin-top:", (rangeHeightValue - railHeight) / 2, "px;top:0;", trackBackgroundColor, ";" + ( true ? "" : 0)); +} : 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;.is-marked &{@media not ( prefers-reduced-motion ){transition:width ease 0.1s;}}", trackBackgroundColor, ";" + ( true ? "" : 0)); const MarksWrapper = /*#__PURE__*/emotion_styled_base_browser_esm("span", true ? { target: "e1epgpqk8" } : 0)( true ? { - name: "l7tjj5", - styles: "display:block;pointer-events:none;position:relative;width:100%;user-select:none" + name: "g5kg28", + styles: "display:block;pointer-events:none;position:relative;width:100%;user-select:none;margin-top:17px" } : 0); -const markFill = ({ - disabled, - isFilled -}) => { - let backgroundColor = isFilled ? 'currentColor' : COLORS.gray[300]; - if (disabled) { - backgroundColor = COLORS.gray[400]; - } - return /*#__PURE__*/emotion_react_browser_esm_css({ - backgroundColor - }, true ? "" : 0, true ? "" : 0); -}; const Mark = /*#__PURE__*/emotion_styled_base_browser_esm("span", true ? { target: "e1epgpqk7" -} : 0)("height:", thumbSize, "px;left:0;position:absolute;top:-4px;width:1px;", markFill, ";" + ( true ? "" : 0)); +} : 0)("position:absolute;left:0;top:-4px;height:4px;width:2px;transform:translateX( -50% );background-color:", COLORS.ui.background, ";z-index:1;" + ( true ? "" : 0)); const markLabelFill = ({ isFilled }) => { @@ -37054,13 +37651,19 @@ }; const MarkLabel = /*#__PURE__*/emotion_styled_base_browser_esm("span", true ? { target: "e1epgpqk6" -} : 0)("color:", COLORS.gray[300], ";left:0;font-size:11px;position:absolute;top:12px;transform:translateX( -50% );white-space:nowrap;", markLabelFill, ";" + ( true ? "" : 0)); +} : 0)("color:", COLORS.gray[300], ";font-size:11px;position:absolute;top:8px;white-space:nowrap;", rtl({ + left: 0 +}), ";", rtl({ + transform: 'translateX( -50% )' +}, { + transform: 'translateX( 50% )' +}), ";", markLabelFill, ";" + ( true ? "" : 0)); const thumbColor = ({ disabled }) => 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); const ThumbWrapper = /*#__PURE__*/emotion_styled_base_browser_esm("span", true ? { target: "e1epgpqk5" -} : 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:50%;", thumbColor, ";", rtl({ +} : 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, ";z-index:3;.is-marked &{@media not ( prefers-reduced-motion ){transition:left ease 0.1s;}}", thumbColor, ";", rtl({ marginLeft: -10 }), ";", rtl({ transform: 'translateX( 4.5px )' @@ -37070,20 +37673,18 @@ const thumbFocus = ({ isFocused }) => { - return isFocused ? /*#__PURE__*/emotion_react_browser_esm_css("&::before{content:' ';position:absolute;background-color:", COLORS.theme.accent, ";opacity:0.4;border-radius:50%;height:", thumbSize + 8, "px;width:", thumbSize + 8, "px;top:-4px;left:-4px;}" + ( true ? "" : 0), true ? "" : 0) : ''; + 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) : ''; }; const Thumb = /*#__PURE__*/emotion_styled_base_browser_esm("span", true ? { target: "e1epgpqk4" -} : 0)("align-items:center;border-radius:50%;height:100%;outline:0;position:absolute;user-select:none;width:100%;", thumbColor, ";", thumbFocus, ";" + ( true ? "" : 0)); +} : 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)); const InputRange = /*#__PURE__*/emotion_styled_base_browser_esm("input", true ? { target: "e1epgpqk3" } : 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)); const tooltipShow = ({ show }) => { - return /*#__PURE__*/emotion_react_browser_esm_css({ - opacity: show ? 1 : 0 - }, true ? "" : 0, true ? "" : 0); + return /*#__PURE__*/emotion_react_browser_esm_css("display:", show ? 'inline-block' : 'none', ";opacity:", show ? 1 : 0, ";@media not ( prefers-reduced-motion ){transition:opacity 120ms ease,display 120ms ease allow-discrete;}@starting-style{opacity:0;}" + ( true ? "" : 0), true ? "" : 0); }; var range_control_styles_ref = true ? { name: "1cypxip", @@ -37104,7 +37705,7 @@ }; const range_control_styles_Tooltip = /*#__PURE__*/emotion_styled_base_browser_esm("span", true ? { target: "e1epgpqk2" -} : 0)("background:rgba( 0, 0, 0, 0.8 );border-radius:2px;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({ +} : 0)("background:rgba( 0, 0, 0, 0.8 );border-radius:", config_values.radiusSmall, ";color:white;font-size:12px;min-width:32px;padding:4px 8px;pointer-events:none;position:absolute;text-align:center;user-select:none;line-height:1.4;", tooltipShow, ";", tooltipPosition, ";", rtl({ transform: 'translateX(-50%)' }, { transform: 'translateX(50%)' @@ -37123,7 +37724,7 @@ marginLeft: 8 }), ";" + ( true ? "" : 0)); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/range-control/input-range.js +;// ./node_modules/@wordpress/components/build-module/range-control/input-range.js /** * WordPress dependencies */ @@ -37155,17 +37756,15 @@ const input_range_ForwardedComponent = (0,external_wp_element_namespaceObject.forwardRef)(input_range_InputRange); /* harmony default export */ const input_range = (input_range_ForwardedComponent); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/range-control/mark.js -/** - * External dependencies - */ - - -/** - * Internal dependencies - */ - - +;// ./node_modules/@wordpress/components/build-module/range-control/mark.js +/** + * External dependencies + */ + + +/** + * Internal dependencies + */ function RangeMark(props) { @@ -37183,7 +37782,6 @@ ...otherProps, "aria-hidden": "true", className: classes, - isFilled: isFilled, style: style }), label && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(MarkLabel, { "aria-hidden": "true", @@ -37195,17 +37793,15 @@ }); } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/range-control/rail.js -/** - * WordPress dependencies - */ - - -/** - * Internal dependencies - */ - - +;// ./node_modules/@wordpress/components/build-module/range-control/rail.js +/** + * WordPress dependencies + */ + + +/** + * Internal dependencies + */ @@ -37301,7 +37897,7 @@ return placedMarks; } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/range-control/tooltip.js +;// ./node_modules/@wordpress/components/build-module/range-control/tooltip.js /** * External dependencies */ @@ -37340,7 +37936,7 @@ }; return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(range_control_styles_Tooltip, { ...restProps, - "aria-hidden": show, + "aria-hidden": "false", className: classes, position: position, show: show, @@ -37371,7 +37967,7 @@ return position; } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/range-control/index.js +;// ./node_modules/@wordpress/components/build-module/range-control/index.js /** * External dependencies */ @@ -37400,6 +37996,23 @@ const range_control_noop = () => {}; + +/** + * Computes the value that `RangeControl` should reset to when pressing + * the reset button. + */ +function computeResetValue({ + resetFallbackValue, + initialPosition +}) { + if (resetFallbackValue !== undefined) { + return !Number.isNaN(resetFallbackValue) ? resetFallbackValue : null; + } + if (initialPosition !== undefined) { + return !Number.isNaN(initialPosition) ? initialPosition : null; + } + return null; +} function UnforwardedRangeControl(props, forwardedRef) { const { __nextHasNoMarginBottom = false, @@ -37433,6 +38046,7 @@ trackColor, value: valueProp, withInputField = true, + __shouldNotWarnDeprecated36pxSize, ...otherProps } = props; const [value, setValue] = useControlledRangeValue({ @@ -37498,12 +38112,10 @@ } }; const handleOnReset = () => { - let resetValue = parseFloat(`${resetFallbackValue}`); - let onChangeResetValue = resetValue; - if (isNaN(resetValue)) { - resetValue = null; - onChangeResetValue = undefined; - } + // Reset to `resetFallbackValue` if defined, otherwise set internal value + // to `null` — which, if propagated to the `value` prop, will cause + // the value to be reset to the `initialPosition` prop if defined. + const resetValue = Number.isNaN(resetFallbackValue) ? null : resetFallbackValue !== null && resetFallbackValue !== void 0 ? resetFallbackValue : null; setValue(resetValue); /** @@ -37519,7 +38131,7 @@ * preserve the undefined callback argument, except when a * resetFallbackValue is defined. */ - onChange(onChangeResetValue); + onChange(resetValue !== null && resetValue !== void 0 ? resetValue : undefined); }; const handleShowTooltip = () => setShowTooltip(true); const handleHideTooltip = () => setShowTooltip(false); @@ -37536,8 +38148,17 @@ const offsetStyle = { [(0,external_wp_i18n_namespaceObject.isRTL)() ? 'right' : 'left']: fillValueOffset }; + + // Add default size deprecation warning. + maybeWarnDeprecated36pxSize({ + componentName: 'RangeControl', + __next40pxDefaultSize, + size: undefined, + __shouldNotWarnDeprecated36pxSize + }); return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(base_control, { __nextHasNoMarginBottom: __nextHasNoMarginBottom, + __associatedWPComponentName: "RangeControl", className: classes, label: label, hideLabelFromVision: hideLabelFromVision, @@ -37627,11 +38248,22 @@ step: step // @ts-expect-error TODO: Investigate if the `null` value is necessary , - value: inputSliderValue + value: inputSliderValue, + __shouldNotWarnDeprecated36pxSize: true }), allowReset && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ActionRightWrapper, { children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, { - className: "components-range-control__reset", - disabled: disabled || value === undefined, + className: "components-range-control__reset" + // If the RangeControl itself is disabled, the reset button shouldn't be in the tab sequence. + , + accessibleWhenDisabled: !disabled + // The reset button should be disabled if RangeControl itself is disabled, + // or if the current `value` is equal to the value that would be currently + // assigned when clicking the button. + , + disabled: disabled || value === computeResetValue({ + resetFallbackValue, + initialPosition + }), variant: "secondary", size: "small", onClick: handleOnReset, @@ -37653,6 +38285,8 @@ * const [ isChecked, setChecked ] = useState( true ); * return ( * svg{margin-right:0;}}" + ( true ? "" : 0)); - -;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/copy.js +} : 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)); + +;// ./node_modules/@wordpress/icons/build-module/library/copy.js /** * WordPress dependencies */ @@ -37734,7 +38364,7 @@ }); /* harmony default export */ const library_copy = (copy_copy); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/color-picker/color-copy-button.js +;// ./node_modules/@wordpress/components/build-module/color-picker/color-copy-button.js /** * WordPress dependencies */ @@ -37755,7 +38385,7 @@ colorType } = props; const [copiedColor, setCopiedColor] = (0,external_wp_element_namespaceObject.useState)(null); - const copyTimer = (0,external_wp_element_namespaceObject.useRef)(); + const copyTimerRef = (0,external_wp_element_namespaceObject.useRef)(); const copyRef = (0,external_wp_compose_namespaceObject.useCopyToClipboard)(() => { switch (colorType) { case 'hsl': @@ -37773,29 +38403,31 @@ } } }, () => { - if (copyTimer.current) { - clearTimeout(copyTimer.current); + if (copyTimerRef.current) { + clearTimeout(copyTimerRef.current); } setCopiedColor(color.toHex()); - copyTimer.current = setTimeout(() => { + copyTimerRef.current = setTimeout(() => { setCopiedColor(null); - copyTimer.current = undefined; + copyTimerRef.current = undefined; }, 3000); }); (0,external_wp_element_namespaceObject.useEffect)(() => { - // Clear copyTimer on component unmount. + // Clear copyTimerRef on component unmount. return () => { - if (copyTimer.current) { - clearTimeout(copyTimer.current); + if (copyTimerRef.current) { + clearTimeout(copyTimerRef.current); } }; }, []); + const label = copiedColor === color.toHex() ? (0,external_wp_i18n_namespaceObject.__)('Copied!') : (0,external_wp_i18n_namespaceObject.__)('Copy'); return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(tooltip, { delay: 0, hideOnClick: false, - text: copiedColor === color.toHex() ? (0,external_wp_i18n_namespaceObject.__)('Copied!') : (0,external_wp_i18n_namespaceObject.__)('Copy'), - children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(CopyButton, { - size: "small", + text: label, + children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Button, { + size: "compact", + "aria-label": label, ref: copyRef, icon: library_copy, showTooltip: false @@ -37803,12 +38435,49 @@ }); }; -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/color-picker/input-with-slider.js -/** - * Internal dependencies - */ - - +;// ./node_modules/@wordpress/components/build-module/input-control/input-prefix-wrapper.js +/** + * External dependencies + */ + +/** + * Internal dependencies + */ + + + + +function UnconnectedInputControlPrefixWrapper(props, forwardedRef) { + const derivedProps = useContextSystem(props, 'InputControlPrefixWrapper'); + return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(PrefixSuffixWrapper, { + ...derivedProps, + isPrefix: true, + ref: forwardedRef + }); +} + +/** + * A convenience wrapper for the `prefix` when you want to apply + * standard padding in accordance with the size variant. + * + * ```jsx + * import { + * __experimentalInputControl as InputControl, + * __experimentalInputControlPrefixWrapper as InputControlPrefixWrapper, + * } from '@wordpress/components'; + * + * @} + * /> + * ``` + */ +const InputControlPrefixWrapper = contextConnect(UnconnectedInputControlPrefixWrapper, 'InputControlPrefixWrapper'); +/* harmony default export */ const input_prefix_wrapper = (InputControlPrefixWrapper); + +;// ./node_modules/@wordpress/components/build-module/color-picker/input-with-slider.js +/** + * Internal dependencies + */ @@ -37837,23 +38506,24 @@ return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(h_stack_component, { spacing: 4, children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(NumberControlWrapper, { + __next40pxDefaultSize: true, min: min, max: max, label: label, hideLabelFromVision: true, value: value, onChange: onNumberControlChange, - prefix: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(spacer_component, { - as: text_component, - paddingLeft: space(4), - color: COLORS.theme.accent, - lineHeight: 1, - children: abbreviation + prefix: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(input_prefix_wrapper, { + children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(text_component, { + color: COLORS.theme.accent, + lineHeight: 1, + children: abbreviation + }) }), - spinControls: "none", - size: "__unstable-large" + spinControls: "none" }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(styles_RangeControl, { __nextHasNoMarginBottom: true, + __next40pxDefaultSize: true, label: label, hideLabelFromVision: true, min: min, @@ -37868,17 +38538,15 @@ }); }; -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/color-picker/rgb-input.js -/** - * External dependencies - */ - - -/** - * Internal dependencies - */ - - +;// ./node_modules/@wordpress/components/build-module/color-picker/rgb-input.js +/** + * External dependencies + */ + + +/** + * Internal dependencies + */ const RgbInput = ({ @@ -37945,22 +38613,20 @@ }); }; -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/color-picker/hsl-input.js -/** - * External dependencies - */ - - -/** - * WordPress dependencies - */ - - -/** - * Internal dependencies - */ - - +;// ./node_modules/@wordpress/components/build-module/color-picker/hsl-input.js +/** + * External dependencies + */ + + +/** + * WordPress dependencies + */ + + +/** + * Internal dependencies + */ const HslInput = ({ @@ -38052,21 +38718,20 @@ }); }; -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/color-picker/hex-input.js -/** - * External dependencies - */ - - -/** - * WordPress dependencies - */ - - -/** - * Internal dependencies - */ - +;// ./node_modules/@wordpress/components/build-module/color-picker/hex-input.js +/** + * External dependencies + */ + + +/** + * WordPress dependencies + */ + + +/** + * Internal dependencies + */ @@ -38098,12 +38763,12 @@ }; }; return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(InputControl, { - prefix: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(spacer_component, { - as: text_component, - marginLeft: space(4), - color: COLORS.theme.accent, - lineHeight: 1, - children: "#" + prefix: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(input_prefix_wrapper, { + children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(text_component, { + color: COLORS.theme.accent, + lineHeight: 1, + children: "#" + }) }), value: color.toHex().slice(1).toUpperCase(), onChange: handleChange, @@ -38116,7 +38781,7 @@ }); }; -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/color-picker/color-input.js +;// ./node_modules/@wordpress/components/build-module/color-picker/color-input.js /** * Internal dependencies */ @@ -38152,11 +38817,11 @@ } }; -;// CONCATENATED MODULE: ./node_modules/react-colorful/dist/index.mjs +;// ./node_modules/react-colorful/dist/index.mjs function dist_u(){return(dist_u=Object.assign||function(e){for(var r=1;r=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:e0: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,\')}.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}))}; //# sourceMappingURL=index.module.js.map -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/color-picker/picker.js +;// ./node_modules/@wordpress/components/build-module/color-picker/picker.js /** * External dependencies */ @@ -38203,25 +38868,24 @@ }); }; -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/color-picker/component.js -/** - * External dependencies - */ - - - - -/** - * WordPress dependencies - */ - - - - -/** - * Internal dependencies - */ - +;// ./node_modules/@wordpress/components/build-module/color-picker/component.js +/** + * External dependencies + */ + + + + +/** + * WordPress dependencies + */ + + + + +/** + * Internal dependencies + */ @@ -38240,13 +38904,6 @@ label: 'Hex', value: 'hex' }]; - -// `isBorderless` is still experimental and not a public prop for InputControl yet. -const BORDERLESS_SELECT_CONTROL_CONTEXT = { - InputBase: { - isBorderless: true - } -}; const UnconnectedColorPicker = (props, forwardedRef) => { const { enableAlpha = false, @@ -38281,16 +38938,15 @@ }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(AuxiliaryColorArtefactWrapper, { children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(AuxiliaryColorArtefactHStackHeader, { justify: "space-between", - children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ContextSystemProvider, { - value: BORDERLESS_SELECT_CONTROL_CONTEXT, - children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(styles_SelectControl, { - __nextHasNoMarginBottom: true, - options: options, - value: colorType, - onChange: nextColorType => setColorType(nextColorType), - label: (0,external_wp_i18n_namespaceObject.__)('Color format'), - hideLabelFromVision: true - }) + children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(styles_SelectControl, { + __nextHasNoMarginBottom: true, + size: "compact", + options: options, + value: colorType, + onChange: nextColorType => setColorType(nextColorType), + label: (0,external_wp_i18n_namespaceObject.__)('Color format'), + hideLabelFromVision: true, + variant: "minimal" }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ColorCopyButton, { color: safeColordColor, colorType: copyFormat || colorType @@ -38311,7 +38967,7 @@ const ColorPicker = contextConnect(UnconnectedColorPicker, 'ColorPicker'); /* harmony default export */ const color_picker_component = (ColorPicker); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/color-picker/use-deprecated-props.js +;// ./node_modules/@wordpress/components/build-module/color-picker/use-deprecated-props.js /** * External dependencies */ @@ -38379,7 +39035,7 @@ }; } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/color-picker/legacy-adapter.js +;// ./node_modules/@wordpress/components/build-module/color-picker/legacy-adapter.js /** * Internal dependencies */ @@ -38392,7 +39048,7 @@ }); }; -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/circular-option-picker/circular-option-picker-context.js +;// ./node_modules/@wordpress/components/build-module/circular-option-picker/circular-option-picker-context.js /** * WordPress dependencies */ @@ -38404,7 +39060,7 @@ const CircularOptionPickerContext = (0,external_wp_element_namespaceObject.createContext)({}); -;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/check.js +;// ./node_modules/@wordpress/icons/build-module/library/check.js /** * WordPress dependencies */ @@ -38419,23 +39075,21 @@ }); /* harmony default export */ const library_check = (check); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/circular-option-picker/circular-option-picker-option.js -/** - * External dependencies - */ - -/** - * WordPress dependencies - */ - - - - -/** - * Internal dependencies - */ - - +;// ./node_modules/@wordpress/components/build-module/circular-option-picker/circular-option-picker-option.js +/** + * External dependencies + */ + +/** + * WordPress dependencies + */ + + + + +/** + * Internal dependencies + */ @@ -38443,12 +39097,14 @@ function UnforwardedOptionAsButton(props, forwardedRef) { const { isPressed, + label, ...additionalProps } = props; return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, { ...additionalProps, "aria-pressed": isPressed, - ref: forwardedRef + ref: forwardedRef, + label: label }); } const OptionAsButton = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedOptionAsButton); @@ -38456,21 +39112,29 @@ const { id, isSelected, - compositeStore, + label, ...additionalProps } = props; - const activeId = compositeStore.useState('activeId'); - if (isSelected && !activeId) { - compositeStore.setActiveId(id); - } - return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(CompositeItem, { + const { + setActiveId, + activeId + } = (0,external_wp_element_namespaceObject.useContext)(CircularOptionPickerContext); + (0,external_wp_element_namespaceObject.useEffect)(() => { + if (isSelected && !activeId) { + // The setTimeout call is necessary to make sure that this update + // doesn't get overridden by `Composite`'s internal logic, which picks + // an initial active item if one is not specifically set. + window.setTimeout(() => setActiveId?.(id), 0); + } + }, [isSelected, setActiveId, activeId, id]); + return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Composite.Item, { render: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, { ...additionalProps, role: "option", "aria-selected": !!isSelected, - ref: forwardedRef + ref: forwardedRef, + label: label }), - store: compositeStore, id: id }); } @@ -38484,35 +39148,35 @@ }) { const { baseId, - compositeStore + setActiveId } = (0,external_wp_element_namespaceObject.useContext)(CircularOptionPickerContext); const id = (0,external_wp_compose_namespaceObject.useInstanceId)(Option, baseId || 'components-circular-option-picker__option'); const commonProps = { id, className: 'components-circular-option-picker__option', + __next40pxDefaultSize: true, ...additionalProps }; - const optionControl = compositeStore ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(OptionAsOption, { + const isListbox = setActiveId !== undefined; + const optionControl = isListbox ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(OptionAsOption, { ...commonProps, - compositeStore: compositeStore, + label: tooltipText, isSelected: isSelected }) : /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(OptionAsButton, { ...commonProps, + label: tooltipText, isPressed: isSelected }); return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { className: dist_clsx(className, 'components-circular-option-picker__option-wrapper'), - children: [tooltipText ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(tooltip, { - text: tooltipText, - children: optionControl - }) : optionControl, isSelected && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(icons_build_module_icon, { + children: [optionControl, isSelected && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(icons_build_module_icon, { icon: library_check, ...selectedIconProps })] }); } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/circular-option-picker/circular-option-picker-option-group.js +;// ./node_modules/@wordpress/components/build-module/circular-option-picker/circular-option-picker-option-group.js /** * External dependencies */ @@ -38536,7 +39200,7 @@ }); } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/circular-option-picker/circular-option-picker-actions.js +;// ./node_modules/@wordpress/components/build-module/circular-option-picker/circular-option-picker-actions.js /** * External dependencies */ @@ -38576,6 +39240,7 @@ ...additionalProps }) { return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, { + __next40pxDefaultSize: true, className: dist_clsx('components-circular-option-picker__clear', className), variant: "tertiary", ...additionalProps, @@ -38583,15 +39248,16 @@ }); } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/circular-option-picker/circular-option-picker.js -/** - * External dependencies - */ - - -/** - * WordPress dependencies - */ +;// ./node_modules/@wordpress/components/build-module/circular-option-picker/circular-option-picker.js +/** + * External dependencies + */ + + +/** + * WordPress dependencies + */ + @@ -38628,7 +39294,6 @@ * style={ { backgroundColor: color, color } } * isSelected={ index === currentColor } * onClick={ () => setCurrentColor( index ) } - * aria-label={ name } * /> * ); * } ) } @@ -38650,7 +39315,6 @@ * ``` */ - function ListboxCircularOptionPicker(props) { const { actions, @@ -38661,23 +39325,24 @@ children, ...additionalProps } = props; - const compositeStore = useCompositeStore({ - focusLoop: loop, - rtl: (0,external_wp_i18n_namespaceObject.isRTL)() - }); - const compositeContext = { + const [activeId, setActiveId] = (0,external_wp_element_namespaceObject.useState)(undefined); + const contextValue = (0,external_wp_element_namespaceObject.useMemo)(() => ({ baseId, - compositeStore - }; + activeId, + setActiveId + }), [baseId, activeId, setActiveId]); return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { className: className, children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(CircularOptionPickerContext.Provider, { - value: compositeContext, + value: contextValue, children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Composite, { ...additionalProps, id: baseId, - store: compositeStore, + focusLoop: loop, + rtl: (0,external_wp_i18n_namespaceObject.isRTL)(), role: "listbox", + activeId: activeId, + setActiveId: setActiveId, children: options }), children, actions] }) @@ -38691,13 +39356,15 @@ baseId, ...additionalProps } = props; + const contextValue = (0,external_wp_element_namespaceObject.useMemo)(() => ({ + baseId + }), [baseId]); return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { ...additionalProps, + role: "group", id: baseId, children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(CircularOptionPickerContext.Provider, { - value: { - baseId - }, + value: contextValue, children: [options, children, actions] }) }); @@ -38736,17 +39403,44 @@ CircularOptionPicker.DropdownLinkAction = DropdownLinkAction; /* harmony default export */ const circular_option_picker = (CircularOptionPicker); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/circular-option-picker/index.js -/** - * Internal dependencies - */ +;// ./node_modules/@wordpress/components/build-module/circular-option-picker/index.js +/** + * Internal dependencies + */ + /* harmony default export */ const build_module_circular_option_picker = (circular_option_picker); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/v-stack/hook.js +;// ./node_modules/@wordpress/components/build-module/circular-option-picker/utils.js +/** + * WordPress dependencies + */ + + +/** + * Computes the common props for the CircularOptionPicker. + */ +function getComputeCircularOptionPickerCommonProps(asButtons, loop, ariaLabel, ariaLabelledby) { + const metaProps = asButtons ? { + asButtons: true + } : { + asButtons: false, + loop + }; + const labelProps = { + 'aria-labelledby': ariaLabelledby, + 'aria-label': ariaLabelledby ? undefined : ariaLabel || (0,external_wp_i18n_namespaceObject.__)('Custom color picker') + }; + return { + metaProps, + labelProps + }; +} + +;// ./node_modules/@wordpress/components/build-module/v-stack/hook.js /** * Internal dependencies */ @@ -38768,7 +39462,7 @@ return hStackProps; } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/v-stack/component.js +;// ./node_modules/@wordpress/components/build-module/v-stack/component.js /** * External dependencies */ @@ -38815,7 +39509,7 @@ const VStack = contextConnect(UnconnectedVStack, 'VStack'); /* harmony default export */ const v_stack_component = (VStack); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/truncate/component.js +;// ./node_modules/@wordpress/components/build-module/truncate/component.js /** * External dependencies */ @@ -38860,7 +39554,7 @@ const component_Truncate = contextConnect(UnconnectedTruncate, 'Truncate'); /* harmony default export */ const truncate_component = (component_Truncate); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/heading/hook.js +;// ./node_modules/@wordpress/components/build-module/heading/hook.js /** * Internal dependencies */ @@ -38873,7 +39567,7 @@ const { as: asProp, level = 2, - color = COLORS.gray[900], + color = COLORS.theme.foreground, isBlock = true, weight = config_values.fontWeightHeading, ...otherProps @@ -38899,7 +39593,7 @@ }; } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/heading/component.js +;// ./node_modules/@wordpress/components/build-module/heading/component.js /** * External dependencies */ @@ -38934,7 +39628,7 @@ const Heading = contextConnect(UnconnectedHeading, 'Heading'); /* harmony default export */ const heading_component = (Heading); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/color-palette/styles.js +;// ./node_modules/@wordpress/components/build-module/color-palette/styles.js 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)."; } /** @@ -38952,7 +39646,7 @@ styles: "text-transform:uppercase;line-height:24px;font-weight:500;&&&{font-size:11px;margin-bottom:0;}" } : 0); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/dropdown/styles.js +;// ./node_modules/@wordpress/components/build-module/dropdown/styles.js /** * External dependencies @@ -38978,7 +39672,7 @@ target: "eovvns30" } : 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)); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/dropdown/dropdown-content-wrapper.js +;// ./node_modules/@wordpress/components/build-module/dropdown/dropdown-content-wrapper.js /** * External dependencies */ @@ -39024,7 +39718,7 @@ const DropdownContentWrapper = contextConnect(UnconnectedDropdownContentWrapper, 'DropdownContentWrapper'); /* harmony default export */ const dropdown_content_wrapper = (DropdownContentWrapper); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/color-palette/utils.js +;// ./node_modules/@wordpress/components/build-module/color-palette/utils.js /** * External dependencies */ @@ -39042,12 +39736,24 @@ */ k([names, a11y]); + +/** + * Checks if a color value is a simple CSS color. + * + * @param value The color value to check. + * @return A boolean indicating whether the color value is a simple CSS color. + */ +const isSimpleCSSColor = value => { + const valueIsCssVariable = /var\(/.test(value !== null && value !== void 0 ? value : ''); + const valueIsColorMix = /color-mix\(/.test(value !== null && value !== void 0 ? value : ''); + return !valueIsCssVariable && !valueIsColorMix; +}; const extractColorNameFromCurrentValue = (currentValue, colors = [], showMultiplePalettes = false) => { if (!currentValue) { return ''; } - const currentValueIsCssVariable = /^var\(/.test(currentValue); - const normalizedCurrentValue = currentValueIsCssVariable ? currentValue : w(currentValue).toHex(); + const currentValueIsSimpleColor = currentValue ? isSimpleCSSColor(currentValue) : false; + const normalizedCurrentValue = currentValueIsSimpleColor ? w(currentValue).toHex() : currentValue; // Normalize format of `colors` to simplify the following loop @@ -39061,7 +39767,7 @@ name: colorName, color: colorValue } of paletteColors) { - const normalizedColorValue = currentValueIsCssVariable ? colorValue : w(colorValue).toHex(); + const normalizedColorValue = currentValueIsSimpleColor ? w(colorValue).toHex() : colorValue; if (normalizedCurrentValue === normalizedColorValue) { return colorName; } @@ -39087,8 +39793,7 @@ * @return The background color value computed from a element. */ const normalizeColorValue = (value, element) => { - const currentValueIsCssVariable = /^var\(/.test(value !== null && value !== void 0 ? value : ''); - if (!currentValueIsCssVariable || element === null) { + if (!value || !element || isSimpleCSSColor(value)) { return value; } const { @@ -39101,27 +39806,26 @@ return computedBackgroundColor ? w(computedBackgroundColor).toHex() : value; }; -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/color-palette/index.js -/** - * External dependencies - */ - - - - - - -/** - * WordPress dependencies - */ - - - - -/** - * Internal dependencies - */ - +;// ./node_modules/@wordpress/components/build-module/color-palette/index.js +/** + * External dependencies + */ + + + + + + +/** + * WordPress dependencies + */ + + + + +/** + * Internal dependencies + */ @@ -39159,12 +39863,7 @@ backgroundColor: color, color }, - onClick: isSelected ? clearColor : () => onChange(color, index), - "aria-label": name ? - // translators: %s: The name of the color e.g: "vivid red". - (0,external_wp_i18n_namespaceObject.sprintf)((0,external_wp_i18n_namespaceObject.__)('Color: %s'), name) : - // translators: %s: color hex code e.g: "#f00". - (0,external_wp_i18n_namespaceObject.sprintf)((0,external_wp_i18n_namespaceObject.__)('Color code: %s'), color) + onClick: isSelected ? clearColor : () => onChange(color, index) }, `${color}-${index}`); }); }, [colors, value, onChange, clearColor]); @@ -39276,8 +39975,8 @@ // Leave hex values as-is. Remove the `var()` wrapper from CSS vars. const displayValue = value?.replace(/^var\((.+)\)$/, '$1'); const customColorAccessibleLabel = !!displayValue ? (0,external_wp_i18n_namespaceObject.sprintf)( - // translators: %1$s: The name of the color e.g: "vivid red". %2$s: The color's hex code e.g: "#f00". - (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.'); + // translators: 1: The name of the color e.g: "vivid red". 2: The color's hex code e.g: "#f00". + (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'); const paletteCommonProps = { clearColor, onChange, @@ -39285,35 +39984,14 @@ }; const actions = !!clearable && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_circular_option_picker.ButtonAction, { onClick: clearColor, + accessibleWhenDisabled: true, + disabled: !value, children: (0,external_wp_i18n_namespaceObject.__)('Clear') }); - let metaProps; - if (asButtons) { - metaProps = { - asButtons: true - }; - } else { - const _metaProps = { - asButtons: false, - loop - }; - if (ariaLabel) { - metaProps = { - ..._metaProps, - 'aria-label': ariaLabel - }; - } else if (ariaLabelledby) { - metaProps = { - ..._metaProps, - 'aria-labelledby': ariaLabelledby - }; - } else { - metaProps = { - ..._metaProps, - 'aria-label': (0,external_wp_i18n_namespaceObject.__)('Custom color picker.') - }; - } - } + const { + metaProps, + labelProps + } = getComputeCircularOptionPickerCommonProps(asButtons, loop, ariaLabel, ariaLabelledby); return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(v_stack_component, { spacing: 3, ref: forwardedRef, @@ -39352,8 +40030,9 @@ })] })] }) - }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_circular_option_picker, { + }), (colors.length > 0 || actions) && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_circular_option_picker, { ...metaProps, + ...labelProps, actions: actions, options: hasMultipleColorOrigins ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(MultiplePalettes, { ...paletteCommonProps, @@ -39396,7 +40075,7 @@ const ColorPalette = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedColorPalette); /* harmony default export */ const color_palette = (ColorPalette); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/unit-control/styles/unit-control-styles.js +;// ./node_modules/@wordpress/components/build-module/unit-control/styles/unit-control-styles.js /** * External dependencies @@ -39423,8 +40102,8 @@ selectSize }) => { const sizes = { - small: /*#__PURE__*/emotion_react_browser_esm_css("box-sizing:border-box;padding:2px 1px;width:20px;color:", COLORS.gray[800], ";font-size:8px;line-height:1;letter-spacing:-0.5px;text-transform:uppercase;text-align-last:center;" + ( true ? "" : 0), true ? "" : 0), - 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), ";color:", COLORS.theme.accent, ";font-size:13px;line-height:1;text-align-last:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;" + ( true ? "" : 0), true ? "" : 0) + 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), + 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) }; return sizes[selectSize]; }; @@ -39439,15 +40118,15 @@ borderTopLeftRadius: 0, borderBottomLeftRadius: 0 })(), " &: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), - default: /*#__PURE__*/emotion_react_browser_esm_css("display:flex;justify-content:center;align-items:center;&:hover{color:", COLORS.ui.borderFocus, ";box-shadow:inset 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) + 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) }; return sizes[selectSize]; }; const UnitSelect = /*#__PURE__*/emotion_styled_base_browser_esm("select", true ? { target: "e1bagdl30" -} : 0)("&&&{appearance:none;background:transparent;border-radius:2px;border:none;display:block;outline:none;margin:0;min-height:auto;font-family:inherit;", baseUnitLabelStyles, ";", unitSelectSizes, ";&:not( :disabled ){cursor:pointer;}}" + ( true ? "" : 0)); - -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/border-control/styles.js +} : 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)); + +;// ./node_modules/@wordpress/components/build-module/border-control/styles.js function border_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)."; } /** * External dependencies @@ -39461,10 +40140,6 @@ -const styles_labelStyles = true ? { - name: "f3vz0n", - styles: "font-weight:500" -} : 0; const focusBoxShadow = /*#__PURE__*/emotion_react_browser_esm_css("box-shadow:inset ", config_values.controlBoxShadowFocus, ";" + ( true ? "" : 0), true ? "" : 0); const borderControl = /*#__PURE__*/emotion_react_browser_esm_css("border:0;padding:0;margin:0;", boxSizingReset, ";" + ( true ? "" : 0), true ? "" : 0); const innerWrapper = () => /*#__PURE__*/emotion_react_browser_esm_css(ValueInput, "{flex:1 1 40%;}&& ", UnitSelect, "{min-height:0;}" + ( true ? "" : 0), true ? "" : 0); @@ -39495,22 +40170,25 @@ const { style } = border || {}; - return /*#__PURE__*/emotion_react_browser_esm_css("border-radius:9999px;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); + 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); }; // Must equal $color-palette-circle-size from: // @wordpress/components/src/circular-option-picker/style.scss const swatchSize = 28; const swatchGap = 12; -const borderControlPopoverControls = /*#__PURE__*/emotion_react_browser_esm_css("width:", swatchSize * 6 + swatchGap * 5, "px;>div:first-of-type>", StyledLabel, "{margin-bottom:0;", styles_labelStyles, ";}&& ", StyledLabel, "+button:not( .has-text ){min-width:24px;padding:0;}" + ( true ? "" : 0), true ? "" : 0); +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); const borderControlPopoverContent = /*#__PURE__*/emotion_react_browser_esm_css( true ? "" : 0, true ? "" : 0); const borderColorIndicator = /*#__PURE__*/emotion_react_browser_esm_css( true ? "" : 0, true ? "" : 0); -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); +const resetButtonWrapper = true ? { + name: "1ghe26v", + styles: "display:flex;justify-content:flex-end;margin-top:12px" +} : 0; const borderSlider = () => /*#__PURE__*/emotion_react_browser_esm_css("flex:1 1 60%;", rtl({ marginRight: space(3) })(), ";" + ( true ? "" : 0), true ? "" : 0); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/unit-control/utils.js +;// ./node_modules/@wordpress/components/build-module/unit-control/utils.js /** * WordPress dependencies */ @@ -39907,7 +40585,7 @@ return unitsToReturn; } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/border-control/border-control-dropdown/hook.js +;// ./node_modules/@wordpress/components/build-module/border-control/border-control-dropdown/hook.js /** * WordPress dependencies */ @@ -39977,8 +40655,8 @@ const popoverContentClassName = (0,external_wp_element_namespaceObject.useMemo)(() => { return cx(borderControlPopoverContent); }, [cx]); - const resetButtonClassName = (0,external_wp_element_namespaceObject.useMemo)(() => { - return cx(resetButton); + const resetButtonWrapperClassName = (0,external_wp_element_namespaceObject.useMemo)(() => { + return cx(resetButtonWrapper); }, [cx]); return { ...otherProps, @@ -39994,30 +40672,25 @@ onReset, popoverContentClassName, popoverControlsClassName, - resetButtonClassName, + resetButtonWrapperClassName, size, __experimentalIsRenderedInSidebar }; } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/border-control/border-control-dropdown/component.js -/** - * External dependencies - */ - -/** - * WordPress dependencies - */ - - - -/** - * Internal dependencies - */ - - - - +;// ./node_modules/@wordpress/components/build-module/border-control/border-control-dropdown/component.js +/** + * External dependencies + */ + +/** + * WordPress dependencies + */ + + +/** + * Internal dependencies + */ @@ -40058,30 +40731,30 @@ if (colorObject) { const ariaLabelValue = getAriaLabelColorValue(colorObject.color); return style ? (0,external_wp_i18n_namespaceObject.sprintf)( - // translators: %1$s: The name of the color e.g. "vivid red". %2$s: The color's hex code e.g.: "#f00:". %3$s: The current border style selection e.g. "solid". - '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)( - // translators: %1$s: The name of the color e.g. "vivid red". %2$s: The color's hex code e.g.: "#f00:". - 'Border color and style picker. The currently selected color is called "%1$s" and has a value of "%2$s".', colorObject.name, ariaLabelValue); + // 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". + (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)( + // translators: 1: The name of the color e.g. "vivid red". 2: The color's hex code e.g.: "#f00:". + (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); } if (colorValue) { const ariaLabelValue = getAriaLabelColorValue(colorValue); return style ? (0,external_wp_i18n_namespaceObject.sprintf)( - // translators: %1$s: The color's hex code e.g.: "#f00:". %2$s: The current border style selection e.g. "solid". - '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)( - // translators: %1$s: The color's hex code e.g: "#f00". - 'Border color and style picker. The currently selected color has a value of "%1$s".', ariaLabelValue); + // translators: 1: The color's hex code e.g.: "#f00:". 2: The current border style selection e.g. "solid". + (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)( + // translators: %s: The color's hex code e.g: "#f00". + (0,external_wp_i18n_namespaceObject.__)('Border color and style picker. The currently selected color has a value of "%s".'), ariaLabelValue); } return (0,external_wp_i18n_namespaceObject.__)('Border color and style picker.'); } if (colorObject) { return (0,external_wp_i18n_namespaceObject.sprintf)( - // translators: %1$s: The name of the color e.g. "vivid red". %2$s: The color's hex code e.g: "#f00". - 'Border color picker. The currently selected color is called "%1$s" and has a value of "%2$s".', colorObject.name, getAriaLabelColorValue(colorObject.color)); + // translators: 1: The name of the color e.g. "vivid red". 2: The color's hex code e.g: "#f00". + (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)); } if (colorValue) { return (0,external_wp_i18n_namespaceObject.sprintf)( - // translators: %1$s: The color's hex code e.g: "#f00". - 'Border color picker. The currently selected color has a value of "%1$s".', getAriaLabelColorValue(colorValue)); + // translators: %s: The color's hex code e.g: "#f00". + (0,external_wp_i18n_namespaceObject.__)('Border color picker. The currently selected color has a value of "%s".'), getAriaLabelColorValue(colorValue)); } return (0,external_wp_i18n_namespaceObject.__)('Border color picker.'); }; @@ -40101,8 +40774,7 @@ onStyleChange, popoverContentClassName, popoverControlsClassName, - resetButtonClassName, - showDropdownHeader, + resetButtonWrapperClassName, size, __unstablePopoverProps, ...otherProps @@ -40113,7 +40785,7 @@ } = border || {}; const colorObject = getColorObject(color, colors); const toggleAriaLabel = getToggleAriaLabel(color, colorObject, style, enableStyle); - const showResetButton = color || style && style !== 'none'; + const enableResetButton = color || style && style !== 'none'; const dropdownPosition = __experimentalIsRenderedInSidebar ? 'bottom left' : undefined; const renderToggle = ({ onToggle @@ -40124,7 +40796,7 @@ tooltipPosition: dropdownPosition, label: (0,external_wp_i18n_namespaceObject.__)('Border color and style picker'), showTooltip: true, - __next40pxDefaultSize: size === '__unstable-large' ? true : false, + __next40pxDefaultSize: size === '__unstable-large', children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", { className: indicatorWrapperClassName, children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(color_indicator, { @@ -40133,24 +40805,13 @@ }) }) }); - const renderContent = ({ - onClose - }) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { - children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(dropdown_content_wrapper, { + const renderContent = () => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_ReactJSXRuntime_namespaceObject.Fragment, { + children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(dropdown_content_wrapper, { paddingSize: "medium", - children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(v_stack_component, { + children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(v_stack_component, { className: popoverControlsClassName, spacing: 6, - children: [showDropdownHeader ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(h_stack_component, { - children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(StyledLabel, { - children: (0,external_wp_i18n_namespaceObject.__)('Border color') - }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, { - size: "small", - label: (0,external_wp_i18n_namespaceObject.__)('Close border color'), - icon: close_small, - onClick: onClose - })] - }) : undefined, /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(color_palette, { + children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(color_palette, { className: popoverContentClassName, value: color, onChange: onColorChange, @@ -40164,19 +40825,20 @@ value: style, onChange: onStyleChange })] - }) - }), showResetButton && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(dropdown_content_wrapper, { - paddingSize: "none", - children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, { - className: resetButtonClassName, - variant: "tertiary", - onClick: () => { - onReset(); - onClose(); - }, - children: (0,external_wp_i18n_namespaceObject.__)('Reset') - }) - })] + }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { + className: resetButtonWrapperClassName, + children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, { + variant: "tertiary", + onClick: () => { + onReset(); + }, + disabled: !enableResetButton, + accessibleWhenDisabled: true, + __next40pxDefaultSize: true, + children: (0,external_wp_i18n_namespaceObject.__)('Reset') + }) + })] + }) }); return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(dropdown, { renderToggle: renderToggle, @@ -40191,7 +40853,7 @@ const ConnectedBorderControlDropdown = contextConnect(BorderControlDropdown, 'BorderControlDropdown'); /* harmony default export */ const border_control_dropdown_component = (ConnectedBorderControlDropdown); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/unit-control/unit-select-control.js +;// ./node_modules/@wordpress/components/build-module/unit-control/unit-select-control.js /** * External dependencies */ @@ -40251,23 +40913,24 @@ } /* harmony default export */ const unit_select_control = ((0,external_wp_element_namespaceObject.forwardRef)(UnitSelectControl)); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/unit-control/index.js -/** - * External dependencies - */ - - - -/** - * WordPress dependencies - */ - - - - -/** - * Internal dependencies - */ +;// ./node_modules/@wordpress/components/build-module/unit-control/index.js +/** + * External dependencies + */ + + + +/** + * WordPress dependencies + */ + + + + +/** + * Internal dependencies + */ + @@ -40296,8 +40959,15 @@ units: unitsProp = CSS_UNITS, value: valueProp, onFocus: onFocusProp, + __shouldNotWarnDeprecated36pxSize, ...props } = useDeprecated36pxDefaultSizeProp(unitControlProps); + maybeWarnDeprecated36pxSize({ + componentName: 'UnitControl', + __next40pxDefaultSize: props.__next40pxDefaultSize, + size, + __shouldNotWarnDeprecated36pxSize + }); if ('unit' in unitControlProps) { external_wp_deprecated_default()('UnitControl unit prop', { since: '5.6', @@ -40366,10 +41036,10 @@ if (!disableUnits && isUnitSelectTabbable && units.length) { handleOnKeyDown = event => { props.onKeyDown?.(event); - // Unless the meta key was pressed (to avoid interfering with - // shortcuts, e.g. pastes), moves focus to the unit select if a key + // Unless the meta or ctrl key was pressed (to avoid interfering with + // shortcuts, e.g. pastes), move focus to the unit select if a key // matches the first character of a unit. - if (!event.metaKey && reFirstCharacterOfUnits.test(event.key)) { + if (!event.metaKey && !event.ctrlKey && reFirstCharacterOfUnits.test(event.key)) { refInputSuffix.current?.focus(); } }; @@ -40400,6 +41070,7 @@ } return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ValueInput, { ...props, + __shouldNotWarnDeprecated36pxSize: true, autoComplete: autoComplete, className: classes, disabled: disabled, @@ -40430,7 +41101,7 @@ * const Example = () => { * const [ value, setValue ] = useState( '10px' ); * - * return ; + * return ; * }; * ``` */ @@ -40438,15 +41109,17 @@ /* harmony default export */ const unit_control = (UnitControl); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/border-control/border-control/hook.js -/** - * WordPress dependencies - */ - - -/** - * Internal dependencies - */ +;// ./node_modules/@wordpress/components/build-module/border-control/border-control/hook.js +/** + * WordPress dependencies + */ + + +/** + * Internal dependencies + */ + + @@ -40472,8 +41145,15 @@ width, __experimentalIsRenderedInSidebar = false, __next40pxDefaultSize, + __shouldNotWarnDeprecated36pxSize, ...otherProps } = useContextSystem(props, 'BorderControl'); + maybeWarnDeprecated36pxSize({ + componentName: 'BorderControl', + __next40pxDefaultSize, + size, + __shouldNotWarnDeprecated36pxSize + }); const computedSize = size === 'default' && __next40pxDefaultSize ? '__unstable-large' : size; const [widthValue, originalWidthUnit] = parseQuantityAndUnitFromRawValue(border?.width); const widthUnit = originalWidthUnit || 'px'; @@ -40570,7 +41250,7 @@ }; } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/border-control/border-control/component.js +;// ./node_modules/@wordpress/components/build-module/border-control/border-control/component.js /** * WordPress dependencies */ @@ -40646,19 +41326,24 @@ spacing: 4, className: innerWrapperClassName, children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(unit_control, { - prefix: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(border_control_dropdown_component, { - border: border, - colors: colors, - __unstablePopoverProps: __unstablePopoverProps, - disableCustomColors: disableCustomColors, - enableAlpha: enableAlpha, - enableStyle: enableStyle, - isStyleSettable: isStyleSettable, - onChange: onBorderChange, - previousStyleSelection: previousStyleSelection, - showDropdownHeader: showDropdownHeader, - __experimentalIsRenderedInSidebar: __experimentalIsRenderedInSidebar, - size: size + __next40pxDefaultSize: __next40pxDefaultSize, + __shouldNotWarnDeprecated36pxSize: true, + prefix: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(spacer_component, { + marginRight: 1, + marginBottom: 0, + children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(border_control_dropdown_component, { + border: border, + colors: colors, + __unstablePopoverProps: __unstablePopoverProps, + disableCustomColors: disableCustomColors, + enableAlpha: enableAlpha, + enableStyle: enableStyle, + isStyleSettable: isStyleSettable, + onChange: onBorderChange, + previousStyleSelection: previousStyleSelection, + __experimentalIsRenderedInSidebar: __experimentalIsRenderedInSidebar, + size: size + }) }), label: (0,external_wp_i18n_namespaceObject.__)('Border width'), hideLabelFromVision: true, @@ -40681,7 +41366,8 @@ step: ['px', '%'].includes(widthUnit) ? 1 : 0.1, value: widthValue || undefined, withInputField: false, - __next40pxDefaultSize: __next40pxDefaultSize + __next40pxDefaultSize: __next40pxDefaultSize, + __shouldNotWarnDeprecated36pxSize: true })] })] }); @@ -40698,7 +41384,7 @@ * a "shape" abstraction. * * ```jsx - * import { __experimentalBorderControl as BorderControl } from '@wordpress/components'; + * import { BorderControl } from '@wordpress/components'; * import { __ } from '@wordpress/i18n'; * * const colors = [ @@ -40712,6 +41398,7 @@ * * return ( * { - return /*#__PURE__*/emotion_react_browser_esm_css({ - backgroundColor: 'currentColor', - opacity: isFocused ? 1 : 0.3 - }, true ? "" : 0, true ? "" : 0); -}; -const Stroke = /*#__PURE__*/emotion_styled_base_browser_esm("span", true ? { - target: "e1j5nr4z6" -} : 0)("box-sizing:border-box;display:block;pointer-events:none;position:absolute;", strokeFocus, ";" + ( true ? "" : 0)); -const VerticalStroke = /*#__PURE__*/emotion_styled_base_browser_esm(Stroke, true ? { - target: "e1j5nr4z5" -} : 0)( true ? { - name: "1k2w39q", - styles: "bottom:3px;top:3px;width:2px" -} : 0); -const HorizontalStroke = /*#__PURE__*/emotion_styled_base_browser_esm(Stroke, true ? { - target: "e1j5nr4z4" -} : 0)( true ? { - name: "1q9b07k", - styles: "height:2px;left:3px;right:3px" -} : 0); -const TopStroke = /*#__PURE__*/emotion_styled_base_browser_esm(HorizontalStroke, true ? { - target: "e1j5nr4z3" -} : 0)( true ? { - name: "abcix4", - styles: "top:0" -} : 0); -const RightStroke = /*#__PURE__*/emotion_styled_base_browser_esm(VerticalStroke, true ? { - target: "e1j5nr4z2" -} : 0)( true ? { - name: "1wf8jf", - styles: "right:0" -} : 0); -const BottomStroke = /*#__PURE__*/emotion_styled_base_browser_esm(HorizontalStroke, true ? { - target: "e1j5nr4z1" -} : 0)( true ? { - name: "8tapst", - styles: "bottom:0" -} : 0); -const LeftStroke = /*#__PURE__*/emotion_styled_base_browser_esm(VerticalStroke, true ? { - target: "e1j5nr4z0" -} : 0)( true ? { - name: "1ode3cm", - styles: "left:0" -} : 0); - -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/box-control/icon.js -/** - * Internal dependencies - */ - - - - -const BASE_ICON_SIZE = 24; -function BoxControlIcon({ - size = 24, - side = 'all', - sides, - ...props -}) { - const isSideDisabled = value => sides?.length && !sides.includes(value); - const hasSide = value => { - if (isSideDisabled(value)) { - return false; - } - return side === 'all' || side === value; - }; - const top = hasSide('top') || hasSide('vertical'); - const right = hasSide('right') || hasSide('horizontal'); - const bottom = hasSide('bottom') || hasSide('vertical'); - const left = hasSide('left') || hasSide('horizontal'); - - // Simulates SVG Icon scaling. - const scale = size / BASE_ICON_SIZE; - return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(box_control_icon_styles_Root, { - style: { - transform: `scale(${scale})` - }, - ...props, - children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(Viewbox, { - children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(TopStroke, { - isFocused: top - }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(RightStroke, { - isFocused: right - }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BottomStroke, { - isFocused: bottom - }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(LeftStroke, { - isFocused: left - })] - }) - }); -} - -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/box-control/styles/box-control-styles.js - -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)."; } -/** - * External dependencies - */ - -/** - * Internal dependencies - */ - - - - - - -const StyledUnitControl = /*#__PURE__*/emotion_styled_base_browser_esm(unit_control, true ? { - target: "e1jovhle5" -} : 0)( true ? { - name: "1ejyr19", - styles: "max-width:90px" -} : 0); -const InputWrapper = /*#__PURE__*/emotion_styled_base_browser_esm(h_stack_component, true ? { - target: "e1jovhle4" -} : 0)( true ? { - name: "1j1lmoi", - styles: "grid-column:1/span 3" -} : 0); -const ResetButton = /*#__PURE__*/emotion_styled_base_browser_esm(build_module_button, true ? { - target: "e1jovhle3" -} : 0)( true ? { - name: "tkya7b", - styles: "grid-area:1/2;justify-self:end" -} : 0); -const LinkedButtonWrapper = /*#__PURE__*/emotion_styled_base_browser_esm("div", true ? { - target: "e1jovhle2" -} : 0)( true ? { - name: "1dfa8al", - styles: "grid-area:1/3;justify-self:end" -} : 0); -const FlexedBoxControlIcon = /*#__PURE__*/emotion_styled_base_browser_esm(BoxControlIcon, true ? { - target: "e1jovhle1" -} : 0)( true ? { - name: "ou8xsw", - styles: "flex:0 0 auto" -} : 0); -const FlexedRangeControl = /*#__PURE__*/emotion_styled_base_browser_esm(range_control, true ? { - target: "e1jovhle0" -} : 0)("width:100%;margin-inline-end:", space(2), ";" + ( true ? "" : 0)); - -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/box-control/utils.js -/** - * WordPress dependencies - */ - - -/** - * Internal dependencies - */ +;// ./node_modules/@wordpress/icons/build-module/library/settings.js +/** + * WordPress dependencies + */ + + +const settings = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_primitives_namespaceObject.SVG, { + xmlns: "http://www.w3.org/2000/svg", + viewBox: "0 0 24 24", + children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { + 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" + }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { + 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" + })] +}); +/* harmony default export */ const library_settings = (settings); + +;// ./node_modules/@wordpress/components/build-module/box-control/utils.js +/** + * WordPress dependencies + */ + + +/** + * Internal dependencies + */ + const CUSTOM_VALUE_SETTINGS = { px: { @@ -41802,7 +42338,6 @@ bottom: (0,external_wp_i18n_namespaceObject.__)('Bottom side'), left: (0,external_wp_i18n_namespaceObject.__)('Left side'), right: (0,external_wp_i18n_namespaceObject.__)('Right side'), - mixed: (0,external_wp_i18n_namespaceObject.__)('Mixed'), vertical: (0,external_wp_i18n_namespaceObject.__)('Top and bottom sides'), horizontal: (0,external_wp_i18n_namespaceObject.__)('Left and right sides') }; @@ -41826,43 +42361,31 @@ } /** - * Gets the 'all' input value and unit from values data. + * Gets the merged input value and unit from values data. * * @param values Box values. - * @param selectedUnits Box units. * @param availableSides Available box sides to evaluate. * * @return A value + unit for the 'all' input. */ -function getAllValue(values = {}, selectedUnits, availableSides = ALL_SIDES) { +function getMergedValue(values = {}, availableSides = ALL_SIDES) { const sides = normalizeSides(availableSides); - const parsedQuantitiesAndUnits = sides.map(side => parseQuantityAndUnitFromRawValue(values[side])); - const allParsedQuantities = parsedQuantitiesAndUnits.map(value => { - var _value$; - return (_value$ = value[0]) !== null && _value$ !== void 0 ? _value$ : ''; - }); - const allParsedUnits = parsedQuantitiesAndUnits.map(value => value[1]); - const commonQuantity = allParsedQuantities.every(v => v === allParsedQuantities[0]) ? allParsedQuantities[0] : ''; - - /** - * The typeof === 'number' check is important. On reset actions, the incoming value - * may be null or an empty string. - * - * Also, the value may also be zero (0), which is considered a valid unit value. - * - * typeof === 'number' is more specific for these cases, rather than relying on a - * simple truthy check. - */ - let commonUnit; - if (typeof commonQuantity === 'number') { - commonUnit = utils_mode(allParsedUnits); - } else { - var _getAllUnitFallback; - // Set meaningful unit selection if no commonQuantity and user has previously - // selected units without assigning values while controls were unlinked. - commonUnit = (_getAllUnitFallback = getAllUnitFallback(selectedUnits)) !== null && _getAllUnitFallback !== void 0 ? _getAllUnitFallback : utils_mode(allParsedUnits); - } - return [commonQuantity, commonUnit].join(''); + if (sides.every(side => values[side] === values[sides[0]])) { + return values[sides[0]]; + } + return undefined; +} + +/** + * Checks if the values are mixed. + * + * @param values Box values. + * @param availableSides Available box sides to evaluate. + * @return Whether the values are mixed. + */ +function isValueMixed(values = {}, availableSides = ALL_SIDES) { + const sides = normalizeSides(availableSides); + return sides.some(side => values[side] !== values[sides[0]]); } /** @@ -41880,21 +42403,6 @@ } /** - * Checks to determine if values are mixed. - * - * @param values Box values. - * @param selectedUnits Box units. - * @param sides Available box sides to evaluate. - * - * @return Whether values are mixed. - */ -function isValuesMixed(values = {}, selectedUnits, sides = ALL_SIDES) { - const allValue = getAllValue(values, selectedUnits, sides); - const isMixed = isNaN(parseFloat(allValue)); - return isMixed; -} - -/** * Checks to determine if values are defined. * * @param values Box values. @@ -41902,7 +42410,7 @@ * @return Whether values are mixed. */ function isValuesDefined(values) { - return values !== undefined && Object.values(values).filter( + return values && Object.values(values).filter( // Switching units when input is empty causes values only // containing units. This gives false positive on mixed values // unless filtered. @@ -41954,6 +42462,8 @@ * Applies a value to an object representing top, right, bottom and left sides * while taking into account any custom side configuration. * + * @deprecated + * * @param currentValues The current values for each side. * @param newValue The value to apply to the sides object. * @param sides Array defining valid sides. @@ -41961,6 +42471,10 @@ * @return Object containing the updated values for each side. */ function applyValueToSides(currentValues, newValue, sides) { + external_wp_deprecated_default()('applyValueToSides', { + since: '6.8', + version: '7.0' + }); const newValues = { ...currentValues }; @@ -41982,119 +42496,309 @@ return newValues; } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/box-control/all-input-control.js -/** - * WordPress dependencies - */ - -/** - * Internal dependencies - */ - - - - - - - -const all_input_control_noop = () => {}; -function AllInputControl({ - __next40pxDefaultSize, - onChange = all_input_control_noop, - onFocus = all_input_control_noop, - values, +/** + * Return the allowed sides based on the sides configuration. + * + * @param sides Sides configuration. + * @return Allowed sides. + */ +function getAllowedSides(sides) { + const allowedSides = new Set(!sides ? ALL_SIDES : []); + sides?.forEach(allowedSide => { + if (allowedSide === 'vertical') { + allowedSides.add('top'); + allowedSides.add('bottom'); + } else if (allowedSide === 'horizontal') { + allowedSides.add('right'); + allowedSides.add('left'); + } else { + allowedSides.add(allowedSide); + } + }); + return allowedSides; +} + +/** + * Checks if a value is a preset value. + * + * @param value The value to check. + * @param presetKey The preset key to check against. + * @return Whether the value is a preset value. + */ +function isValuePreset(value, presetKey) { + return value.startsWith(`var:preset|${presetKey}|`); +} + +/** + * Returns the index of the preset value in the presets array. + * + * @param value The value to check. + * @param presetKey The preset key to check against. + * @param presets The array of presets to search. + * @return The index of the preset value in the presets array. + */ +function getPresetIndexFromValue(value, presetKey, presets) { + if (!isValuePreset(value, presetKey)) { + return undefined; + } + const match = value.match(new RegExp(`^var:preset\\|${presetKey}\\|(.+)$`)); + if (!match) { + return undefined; + } + const slug = match[1]; + const index = presets.findIndex(preset => { + return preset.slug === slug; + }); + return index !== -1 ? index : undefined; +} + +/** + * Returns the preset value from the index. + * + * @param index The index of the preset value in the presets array. + * @param presetKey The preset key to check against. + * @param presets The array of presets to search. + * @return The preset value from the index. + */ +function getPresetValueFromIndex(index, presetKey, presets) { + const preset = presets[index]; + return `var:preset|${presetKey}|${preset.slug}`; +} + +;// ./node_modules/@wordpress/components/build-module/box-control/styles/box-control-icon-styles.js + +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)."; } +/** + * External dependencies + */ + +const box_control_icon_styles_Root = /*#__PURE__*/emotion_styled_base_browser_esm("span", true ? { + target: "e1j5nr4z8" +} : 0)( true ? { + name: "1w884gc", + styles: "box-sizing:border-box;display:block;width:24px;height:24px;position:relative;padding:4px" +} : 0); +const Viewbox = /*#__PURE__*/emotion_styled_base_browser_esm("span", true ? { + target: "e1j5nr4z7" +} : 0)( true ? { + name: "i6vjox", + styles: "box-sizing:border-box;display:block;position:relative;width:100%;height:100%" +} : 0); +const strokeFocus = ({ + isFocused +}) => { + return /*#__PURE__*/emotion_react_browser_esm_css({ + backgroundColor: 'currentColor', + opacity: isFocused ? 1 : 0.3 + }, true ? "" : 0, true ? "" : 0); +}; +const Stroke = /*#__PURE__*/emotion_styled_base_browser_esm("span", true ? { + target: "e1j5nr4z6" +} : 0)("box-sizing:border-box;display:block;pointer-events:none;position:absolute;", strokeFocus, ";" + ( true ? "" : 0)); +const VerticalStroke = /*#__PURE__*/emotion_styled_base_browser_esm(Stroke, true ? { + target: "e1j5nr4z5" +} : 0)( true ? { + name: "1k2w39q", + styles: "bottom:3px;top:3px;width:2px" +} : 0); +const HorizontalStroke = /*#__PURE__*/emotion_styled_base_browser_esm(Stroke, true ? { + target: "e1j5nr4z4" +} : 0)( true ? { + name: "1q9b07k", + styles: "height:2px;left:3px;right:3px" +} : 0); +const TopStroke = /*#__PURE__*/emotion_styled_base_browser_esm(HorizontalStroke, true ? { + target: "e1j5nr4z3" +} : 0)( true ? { + name: "abcix4", + styles: "top:0" +} : 0); +const RightStroke = /*#__PURE__*/emotion_styled_base_browser_esm(VerticalStroke, true ? { + target: "e1j5nr4z2" +} : 0)( true ? { + name: "1wf8jf", + styles: "right:0" +} : 0); +const BottomStroke = /*#__PURE__*/emotion_styled_base_browser_esm(HorizontalStroke, true ? { + target: "e1j5nr4z1" +} : 0)( true ? { + name: "8tapst", + styles: "bottom:0" +} : 0); +const LeftStroke = /*#__PURE__*/emotion_styled_base_browser_esm(VerticalStroke, true ? { + target: "e1j5nr4z0" +} : 0)( true ? { + name: "1ode3cm", + styles: "left:0" +} : 0); + +;// ./node_modules/@wordpress/components/build-module/box-control/icon.js +/** + * Internal dependencies + */ + + + +const BASE_ICON_SIZE = 24; +function BoxControlIcon({ + size = 24, + side = 'all', sides, - selectedUnits, - setSelectedUnits, ...props }) { - var _CUSTOM_VALUE_SETTING, _CUSTOM_VALUE_SETTING2; - const inputId = (0,external_wp_compose_namespaceObject.useInstanceId)(AllInputControl, 'box-control-input-all'); - const allValue = getAllValue(values, selectedUnits, sides); - const hasValues = isValuesDefined(values); - const isMixed = hasValues && isValuesMixed(values, selectedUnits, sides); - const allPlaceholder = isMixed ? LABELS.mixed : undefined; - const [parsedQuantity, parsedUnit] = parseQuantityAndUnitFromRawValue(allValue); - const handleOnFocus = event => { - onFocus(event, { - side: 'all' - }); - }; - const onValueChange = next => { - const isNumeric = next !== undefined && !isNaN(parseFloat(next)); - const nextValue = isNumeric ? next : undefined; - const nextValues = applyValueToSides(values, nextValue, sides); - onChange(nextValues); - }; - const sliderOnChange = next => { - onValueChange(next !== undefined ? [next, parsedUnit].join('') : undefined); - }; - - // Set selected unit so it can be used as fallback by unlinked controls - // when individual sides do not have a value containing a unit. - const handleOnUnitChange = unit => { - const newUnits = applyValueToSides(selectedUnits, unit, sides); - setSelectedUnits(newUnits); - }; - return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(h_stack_component, { - children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(StyledUnitControl, { - ...props, - __next40pxDefaultSize: __next40pxDefaultSize, - className: "component-box-control__unit-control", - disableUnits: isMixed, - id: inputId, - isPressEnterToChange: true, - value: allValue, - onChange: onValueChange, - onUnitChange: handleOnUnitChange, - onFocus: handleOnFocus, - placeholder: allPlaceholder, - label: LABELS.all, - hideLabelFromVision: true - }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(FlexedRangeControl, { - __nextHasNoMarginBottom: true, - __next40pxDefaultSize: __next40pxDefaultSize, - "aria-controls": inputId, - label: LABELS.all, - hideLabelFromVision: true, - onChange: sliderOnChange, - min: 0, - 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, - 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, - value: parsedQuantity !== null && parsedQuantity !== void 0 ? parsedQuantity : 0, - withInputField: false - })] - }); -} - -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/box-control/input-controls.js -/** - * WordPress dependencies - */ - -/** - * Internal dependencies - */ - - - - - - - -const input_controls_noop = () => {}; -function BoxInputControls({ + const isSideDisabled = value => sides?.length && !sides.includes(value); + const hasSide = value => { + if (isSideDisabled(value)) { + return false; + } + return side === 'all' || side === value; + }; + const top = hasSide('top') || hasSide('vertical'); + const right = hasSide('right') || hasSide('horizontal'); + const bottom = hasSide('bottom') || hasSide('vertical'); + const left = hasSide('left') || hasSide('horizontal'); + + // Simulates SVG Icon scaling. + const scale = size / BASE_ICON_SIZE; + return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(box_control_icon_styles_Root, { + style: { + transform: `scale(${scale})` + }, + ...props, + children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(Viewbox, { + children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(TopStroke, { + isFocused: top + }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(RightStroke, { + isFocused: right + }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BottomStroke, { + isFocused: bottom + }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(LeftStroke, { + isFocused: left + })] + }) + }); +} + +;// ./node_modules/@wordpress/components/build-module/box-control/styles/box-control-styles.js + +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)."; } +/** + * External dependencies + */ + +/** + * Internal dependencies + */ + + + + + + +const StyledUnitControl = /*#__PURE__*/emotion_styled_base_browser_esm(unit_control, true ? { + target: "e1jovhle5" +} : 0)( true ? { + name: "1ejyr19", + styles: "max-width:90px" +} : 0); +const InputWrapper = /*#__PURE__*/emotion_styled_base_browser_esm(h_stack_component, true ? { + target: "e1jovhle4" +} : 0)( true ? { + name: "1j1lmoi", + styles: "grid-column:1/span 3" +} : 0); +const ResetButton = /*#__PURE__*/emotion_styled_base_browser_esm(build_module_button, true ? { + target: "e1jovhle3" +} : 0)( true ? { + name: "tkya7b", + styles: "grid-area:1/2;justify-self:end" +} : 0); +const LinkedButtonWrapper = /*#__PURE__*/emotion_styled_base_browser_esm("div", true ? { + target: "e1jovhle2" +} : 0)( true ? { + name: "1dfa8al", + styles: "grid-area:1/3;justify-self:end" +} : 0); +const FlexedBoxControlIcon = /*#__PURE__*/emotion_styled_base_browser_esm(BoxControlIcon, true ? { + target: "e1jovhle1" +} : 0)( true ? { + name: "ou8xsw", + styles: "flex:0 0 auto" +} : 0); +const FlexedRangeControl = /*#__PURE__*/emotion_styled_base_browser_esm(range_control, true ? { + target: "e1jovhle0" +} : 0)("width:100%;margin-inline-end:", space(2), ";" + ( true ? "" : 0)); + +;// ./node_modules/@wordpress/components/build-module/box-control/input-control.js +/** + * WordPress dependencies + */ + + + + + +/** + * Internal dependencies + */ + + + + + + +const box_control_input_control_noop = () => {}; +function getSidesToModify(side, sides, isAlt) { + const allowedSides = getAllowedSides(sides); + let modifiedSides = []; + switch (side) { + case 'all': + modifiedSides = ['top', 'bottom', 'left', 'right']; + break; + case 'horizontal': + modifiedSides = ['left', 'right']; + break; + case 'vertical': + modifiedSides = ['top', 'bottom']; + break; + default: + modifiedSides = [side]; + } + if (isAlt) { + switch (side) { + case 'top': + modifiedSides.push('bottom'); + break; + case 'bottom': + modifiedSides.push('top'); + break; + case 'left': + modifiedSides.push('left'); + break; + case 'right': + modifiedSides.push('right'); + break; + } + } + return modifiedSides.filter(s => allowedSides.has(s)); +} +function BoxInputControl({ __next40pxDefaultSize, - onChange = input_controls_noop, - onFocus = input_controls_noop, + onChange = box_control_input_control_noop, + onFocus = box_control_input_control_noop, values, selectedUnits, setSelectedUnits, sides, + side, + min = 0, + presets, + presetKey, ...props }) { - const generatedId = (0,external_wp_compose_namespaceObject.useInstanceId)(BoxInputControls, 'box-control-input'); - const createHandleOnFocus = side => event => { + var _CUSTOM_VALUE_SETTING, _CUSTOM_VALUE_SETTING2; + const defaultValuesToModify = getSidesToModify(side, sides); + const handleOnFocus = event => { onFocus(event, { side }); @@ -42102,14 +42806,22 @@ const handleOnChange = nextValues => { onChange(nextValues); }; - const handleOnValueChange = (side, next, extra) => { + const handleRawOnValueChange = next => { + const nextValues = { + ...values + }; + defaultValuesToModify.forEach(modifiedSide => { + nextValues[modifiedSide] = next; + }); + handleOnChange(nextValues); + }; + const handleOnValueChange = (next, extra) => { const nextValues = { ...values }; const isNumeric = next !== undefined && !isNaN(parseFloat(next)); const nextValue = isNumeric ? next : undefined; - nextValues[side] = nextValue; - + const modifiedSides = getSidesToModify(side, sides, /** * Supports changing pair sides. For example, holding the ALT key * when changing the TOP will also update BOTTOM. @@ -42117,209 +42829,130 @@ // @ts-expect-error - TODO: event.altKey is only present when the change event was // triggered by a keyboard event. Should this feature be implemented differently so // it also works with drag events? - if (extra?.event.altKey) { - switch (side) { - case 'top': - nextValues.bottom = nextValue; - break; - case 'bottom': - nextValues.top = nextValue; - break; - case 'left': - nextValues.right = nextValue; - break; - case 'right': - nextValues.left = nextValue; - break; - } - } + !!extra?.event.altKey); + modifiedSides.forEach(modifiedSide => { + nextValues[modifiedSide] = nextValue; + }); handleOnChange(nextValues); }; - const createHandleOnUnitChange = side => next => { + const handleOnUnitChange = next => { const newUnits = { ...selectedUnits }; - newUnits[side] = next; + defaultValuesToModify.forEach(modifiedSide => { + newUnits[modifiedSide] = next; + }); setSelectedUnits(newUnits); }; - - // Filter sides if custom configuration provided, maintaining default order. - const filteredSides = sides?.length ? ALL_SIDES.filter(side => sides.includes(side)) : ALL_SIDES; - return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_ReactJSXRuntime_namespaceObject.Fragment, { - children: filteredSides.map(side => { - var _CUSTOM_VALUE_SETTING, _CUSTOM_VALUE_SETTING2; - const [parsedQuantity, parsedUnit] = parseQuantityAndUnitFromRawValue(values[side]); - const computedUnit = values[side] ? parsedUnit : selectedUnits[side]; - const inputId = [generatedId, side].join('-'); - return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(InputWrapper, { - expanded: true, - children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(FlexedBoxControlIcon, { - side: side, - sides: sides - }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(tooltip, { - placement: "top-end", - text: LABELS[side], - children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(StyledUnitControl, { - ...props, - __next40pxDefaultSize: __next40pxDefaultSize, - className: "component-box-control__unit-control", - id: inputId, - isPressEnterToChange: true, - value: [parsedQuantity, computedUnit].join(''), - onChange: (nextValue, extra) => handleOnValueChange(side, nextValue, extra), - onUnitChange: createHandleOnUnitChange(side), - onFocus: createHandleOnFocus(side), - label: LABELS[side], - hideLabelFromVision: true - }) - }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(FlexedRangeControl, { - __nextHasNoMarginBottom: true, + const mergedValue = getMergedValue(values, defaultValuesToModify); + const hasValues = isValuesDefined(values); + const isMixed = hasValues && defaultValuesToModify.length > 1 && isValueMixed(values, defaultValuesToModify); + const [parsedQuantity, parsedUnit] = parseQuantityAndUnitFromRawValue(mergedValue); + const computedUnit = hasValues ? parsedUnit : selectedUnits[defaultValuesToModify[0]]; + const generatedId = (0,external_wp_compose_namespaceObject.useInstanceId)(BoxInputControl, 'box-control-input'); + const inputId = [generatedId, side].join('-'); + const isMixedUnit = defaultValuesToModify.length > 1 && mergedValue === undefined && defaultValuesToModify.some(s => selectedUnits[s] !== computedUnit); + const usedValue = mergedValue === undefined && computedUnit ? computedUnit : mergedValue; + const mixedPlaceholder = isMixed || isMixedUnit ? (0,external_wp_i18n_namespaceObject.__)('Mixed') : undefined; + const hasPresets = presets && presets.length > 0 && presetKey; + const hasPresetValue = hasPresets && mergedValue !== undefined && !isMixed && isValuePreset(mergedValue, presetKey); + const [showCustomValueControl, setShowCustomValueControl] = (0,external_wp_element_namespaceObject.useState)(!hasPresets || !hasPresetValue && !isMixed && mergedValue !== undefined); + const presetIndex = hasPresetValue ? getPresetIndexFromValue(mergedValue, presetKey, presets) : undefined; + const marks = hasPresets ? [{ + value: 0, + label: '', + tooltip: (0,external_wp_i18n_namespaceObject.__)('None') + }].concat(presets.map((preset, index) => { + var _preset$name; + return { + value: index + 1, + label: '', + tooltip: (_preset$name = preset.name) !== null && _preset$name !== void 0 ? _preset$name : preset.slug + }; + })) : []; + return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(InputWrapper, { + expanded: true, + children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(FlexedBoxControlIcon, { + side: side, + sides: sides + }), showCustomValueControl && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { + children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(tooltip, { + placement: "top-end", + text: LABELS[side], + children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(StyledUnitControl, { + ...props, + min: min, + __shouldNotWarnDeprecated36pxSize: true, __next40pxDefaultSize: __next40pxDefaultSize, - "aria-controls": inputId, + className: "component-box-control__unit-control", + id: inputId, + isPressEnterToChange: true, + disableUnits: isMixed || isMixedUnit, + value: usedValue, + onChange: handleOnValueChange, + onUnitChange: handleOnUnitChange, + onFocus: handleOnFocus, label: LABELS[side], - hideLabelFromVision: true, - onChange: newValue => { - handleOnValueChange(side, newValue !== undefined ? [newValue, computedUnit].join('') : undefined); - }, - min: 0, - 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, - 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, - value: parsedQuantity !== null && parsedQuantity !== void 0 ? parsedQuantity : 0, - withInputField: false - })] - }, `box-control-${side}`); - }) - }); -} - -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/box-control/axial-input-controls.js -/** - * WordPress dependencies - */ - -/** - * Internal dependencies - */ - - - - - - - - -const groupedSides = ['vertical', 'horizontal']; -function AxialInputControls({ - __next40pxDefaultSize, - onChange, - onFocus, - values, - selectedUnits, - setSelectedUnits, - sides, - ...props -}) { - const generatedId = (0,external_wp_compose_namespaceObject.useInstanceId)(AxialInputControls, `box-control-input`); - const createHandleOnFocus = side => event => { - if (!onFocus) { - return; - } - onFocus(event, { - side - }); - }; - const handleOnValueChange = (side, next) => { - if (!onChange) { - return; - } - const nextValues = { - ...values - }; - const isNumeric = next !== undefined && !isNaN(parseFloat(next)); - const nextValue = isNumeric ? next : undefined; - if (side === 'vertical') { - nextValues.top = nextValue; - nextValues.bottom = nextValue; - } - if (side === 'horizontal') { - nextValues.left = nextValue; - nextValues.right = nextValue; - } - onChange(nextValues); - }; - const createHandleOnUnitChange = side => next => { - const newUnits = { - ...selectedUnits - }; - if (side === 'vertical') { - newUnits.top = next; - newUnits.bottom = next; - } - if (side === 'horizontal') { - newUnits.left = next; - newUnits.right = next; - } - setSelectedUnits(newUnits); - }; - - // Filter sides if custom configuration provided, maintaining default order. - const filteredSides = sides?.length ? groupedSides.filter(side => sides.includes(side)) : groupedSides; - return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_ReactJSXRuntime_namespaceObject.Fragment, { - children: filteredSides.map(side => { - var _CUSTOM_VALUE_SETTING, _CUSTOM_VALUE_SETTING2; - const [parsedQuantity, parsedUnit] = parseQuantityAndUnitFromRawValue(side === 'vertical' ? values.top : values.left); - const selectedUnit = side === 'vertical' ? selectedUnits.top : selectedUnits.left; - const inputId = [generatedId, side].join('-'); - return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(InputWrapper, { - children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(FlexedBoxControlIcon, { - side: side, - sides: sides - }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(tooltip, { - placement: "top-end", - text: LABELS[side], - children: /*#__PURE__*/(0,external_React_.createElement)(StyledUnitControl, { - ...props, - __next40pxDefaultSize: __next40pxDefaultSize, - className: "component-box-control__unit-control", - id: inputId, - isPressEnterToChange: true, - value: [parsedQuantity, selectedUnit !== null && selectedUnit !== void 0 ? selectedUnit : parsedUnit].join(''), - onChange: newValue => handleOnValueChange(side, newValue), - onUnitChange: createHandleOnUnitChange(side), - onFocus: createHandleOnFocus(side), - label: LABELS[side], - hideLabelFromVision: true, - key: side - }) - }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(FlexedRangeControl, { - __nextHasNoMarginBottom: true, - __next40pxDefaultSize: __next40pxDefaultSize, - "aria-controls": inputId, - label: LABELS[side], - hideLabelFromVision: true, - onChange: newValue => handleOnValueChange(side, newValue !== undefined ? [newValue, selectedUnit !== null && selectedUnit !== void 0 ? selectedUnit : parsedUnit].join('') : undefined), - min: 0, - 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, - 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, - value: parsedQuantity !== null && parsedQuantity !== void 0 ? parsedQuantity : 0, - withInputField: false - })] - }, side); - }) - }); -} - -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/box-control/linked-button.js -/** - * WordPress dependencies - */ - - - -/** - * Internal dependencies - */ - + placeholder: mixedPlaceholder, + hideLabelFromVision: true + }) + }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(FlexedRangeControl, { + __nextHasNoMarginBottom: true, + __next40pxDefaultSize: __next40pxDefaultSize, + __shouldNotWarnDeprecated36pxSize: true, + "aria-controls": inputId, + label: LABELS[side], + hideLabelFromVision: true, + onChange: newValue => { + handleOnValueChange(newValue !== undefined ? [newValue, computedUnit].join('') : undefined); + }, + min: isFinite(min) ? min : 0, + 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, + 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, + value: parsedQuantity !== null && parsedQuantity !== void 0 ? parsedQuantity : 0, + withInputField: false + })] + }), hasPresets && !showCustomValueControl && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(FlexedRangeControl, { + __next40pxDefaultSize: true, + className: "spacing-sizes-control__range-control", + value: presetIndex !== undefined ? presetIndex + 1 : 0, + onChange: newIndex => { + const newValue = newIndex === 0 || newIndex === undefined ? undefined : getPresetValueFromIndex(newIndex - 1, presetKey, presets); + handleRawOnValueChange(newValue); + }, + withInputField: false, + "aria-valuenow": presetIndex !== undefined ? presetIndex + 1 : 0, + "aria-valuetext": marks[presetIndex !== undefined ? presetIndex + 1 : 0].tooltip, + renderTooltipContent: index => marks[!index ? 0 : index].tooltip, + min: 0, + max: marks.length - 1, + marks: marks, + label: LABELS[side], + hideLabelFromVision: true, + __nextHasNoMarginBottom: true + }), hasPresets && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, { + label: showCustomValueControl ? (0,external_wp_i18n_namespaceObject.__)('Use size preset') : (0,external_wp_i18n_namespaceObject.__)('Set custom size'), + icon: library_settings, + onClick: () => { + setShowCustomValueControl(!showCustomValueControl); + }, + isPressed: showCustomValueControl, + size: "small", + iconSize: 24 + })] + }, `box-control-${side}`); +} + +;// ./node_modules/@wordpress/components/build-module/box-control/linked-button.js +/** + * WordPress dependencies + */ + + + +/** + * Internal dependencies + */ function LinkedButton({ @@ -42327,32 +42960,28 @@ ...props }) { const label = isLinked ? (0,external_wp_i18n_namespaceObject.__)('Unlink sides') : (0,external_wp_i18n_namespaceObject.__)('Link sides'); - return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(tooltip, { - text: label, - children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, { - ...props, - className: "component-box-control__linked-button", - size: "small", - icon: isLinked ? library_link : link_off, - iconSize: 24, - "aria-label": label - }) - }); -} - -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/box-control/index.js -/** - * WordPress dependencies - */ - - - - -/** - * Internal dependencies - */ - - + return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, { + ...props, + className: "component-box-control__linked-button", + size: "small", + icon: isLinked ? library_link : link_off, + iconSize: 24, + label: label + }); +} + +;// ./node_modules/@wordpress/components/build-module/box-control/index.js +/** + * WordPress dependencies + */ + + + + + +/** + * Internal dependencies + */ @@ -42373,27 +43002,28 @@ } /** - * BoxControl components let users set values for Top, Right, Bottom, and Left. - * This can be used as an input control for values like `padding` or `margin`. - * - * ```jsx - * import { __experimentalBoxControl as BoxControl } from '@wordpress/components'; - * import { useState } from '@wordpress/element'; - * - * const Example = () => { - * const [ values, setValues ] = useState( { - * top: '50px', - * left: '10%', - * right: '10%', - * bottom: '50px', - * } ); - * - * return ( - * setValues( nextValues ) } - * /> - * ); + * A control that lets users set values for top, right, bottom, and left. Can be + * used as an input control for values like `padding` or `margin`. + * + * ```jsx + * import { useState } from 'react'; + * import { BoxControl } from '@wordpress/components'; + * + * function Example() { + * const [ values, setValues ] = useState( { + * top: '50px', + * left: '10%', + * right: '10%', + * bottom: '50px', + * } ); + * + * return ( + * + * ); * }; * ``` */ @@ -42409,6 +43039,8 @@ splitOnAxis = false, allowReset = true, resetValues = DEFAULT_VALUES, + presets, + presetKey, onMouseOver, onMouseOut }) { @@ -42419,7 +43051,7 @@ const hasInitialValue = isValuesDefined(valuesProp); const hasOneSide = sides?.length === 1; const [isDirty, setIsDirty] = (0,external_wp_element_namespaceObject.useState)(hasInitialValue); - const [isLinked, setIsLinked] = (0,external_wp_element_namespaceObject.useState)(!hasInitialValue || !isValuesMixed(inputValues) || hasOneSide); + const [isLinked, setIsLinked] = (0,external_wp_element_namespaceObject.useState)(!hasInitialValue || !isValueMixed(inputValues) || hasOneSide); const [side, setSide] = (0,external_wp_element_namespaceObject.useState)(getInitialSide(isLinked, splitOnAxis)); // Tracking selected units via internal state allows filtering of CSS unit @@ -42454,6 +43086,8 @@ setIsDirty(false); }; const inputControlProps = { + onMouseOver, + onMouseOut, ...inputProps, onChange: handleOnChange, onFocus: handleOnFocus, @@ -42463,10 +43097,21 @@ setSelectedUnits, sides, values: inputValues, - onMouseOver, - onMouseOut, - __next40pxDefaultSize - }; + __next40pxDefaultSize, + presets, + presetKey + }; + maybeWarnDeprecated36pxSize({ + componentName: 'BoxControl', + __next40pxDefaultSize, + size: undefined + }); + const sidesToRender = getAllowedSides(sides); + if (presets && !presetKey || !presets && presetKey) { + const definedProp = presets ? 'presets' : 'presetKey'; + const missingProp = presets ? 'presetKey' : 'presets'; + true ? external_wp_warning_default()(`wp.components.BoxControl: the '${missingProp}' prop is required when the '${definedProp}' prop is defined.`) : 0; + } return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(grid_component, { id: id, columns: 3, @@ -42476,23 +43121,23 @@ children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BaseControl.VisualLabel, { id: headingId, children: label - }), isLinked && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(InputWrapper, { - children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(FlexedBoxControlIcon, { - side: side, - sides: sides - }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(AllInputControl, { + }), isLinked && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(InputWrapper, { + children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BoxInputControl, { + side: "all", ...inputControlProps - })] + }) }), !hasOneSide && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(LinkedButtonWrapper, { children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(LinkedButton, { onClick: toggleLinked, isLinked: isLinked }) - }), !isLinked && splitOnAxis && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(AxialInputControls, { + }), !isLinked && splitOnAxis && ['vertical', 'horizontal'].map(axis => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BoxInputControl, { + side: axis, ...inputControlProps - }), !isLinked && !splitOnAxis && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BoxInputControls, { + }, axis)), !isLinked && !splitOnAxis && Array.from(sidesToRender).map(axis => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BoxInputControl, { + side: axis, ...inputControlProps - }), allowReset && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ResetButton, { + }, axis)), allowReset && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ResetButton, { className: "component-box-control__reset-button", variant: "secondary", size: "small", @@ -42505,14 +43150,15 @@ /* harmony default export */ const box_control = (BoxControl); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/button-group/index.js -/** - * External dependencies - */ - -/** - * WordPress dependencies - */ +;// ./node_modules/@wordpress/components/build-module/button-group/index.js +/** + * External dependencies + */ + +/** + * WordPress dependencies + */ + /** @@ -42522,9 +43168,16 @@ function UnforwardedButtonGroup(props, ref) { const { className, + __shouldNotWarnDeprecated, ...restProps } = props; const classes = dist_clsx('components-button-group', className); + if (!__shouldNotWarnDeprecated) { + external_wp_deprecated_default()('wp.components.ButtonGroup', { + since: '6.8', + alternative: 'wp.components.__experimentalToggleGroupControl' + }); + } return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { ref: ref, role: "group", @@ -42537,6 +43190,8 @@ * ButtonGroup can be used to group any related buttons together. To emphasize * related buttons, a group should share a common container. * + * @deprecated Use `ToggleGroupControl` instead. + * * ```jsx * import { Button, ButtonGroup } from '@wordpress/components'; * @@ -42551,7 +43206,7 @@ const ButtonGroup = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedButtonGroup); /* harmony default export */ const button_group = (ButtonGroup); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/elevation/styles.js +;// ./node_modules/@wordpress/components/build-module/elevation/styles.js 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)."; } /** * External dependencies @@ -42562,7 +43217,7 @@ styles: "background:transparent;display:block;margin:0!important;pointer-events:none;position:absolute;will-change:box-shadow" } : 0; -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/elevation/hook.js +;// ./node_modules/@wordpress/components/build-module/elevation/hook.js /** * External dependencies */ @@ -42638,7 +43293,7 @@ }; } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/elevation/component.js +;// ./node_modules/@wordpress/components/build-module/elevation/component.js /** * External dependencies */ @@ -42685,7 +43340,7 @@ const component_Elevation = contextConnect(UnconnectedElevation, 'Elevation'); /* harmony default export */ const elevation_component = (component_Elevation); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/card/styles.js +;// ./node_modules/@wordpress/components/build-module/card/styles.js 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)."; } /** * External dependencies @@ -42701,7 +43356,7 @@ // (as opposed to the `border` property), the value of the border radius needs // to be adjusted by removing 1px (this is because the `box-shadow` renders // as an "outer radius"). -const adjustedBorderRadius = `calc(${config_values.cardBorderRadius} - 1px)`; +const adjustedBorderRadius = `calc(${config_values.radiusLarge} - 1px)`; const Card = /*#__PURE__*/emotion_react_browser_esm_css("box-shadow:0 0 0 1px ", config_values.surfaceBorderColor, ";outline:none;" + ( true ? "" : 0), true ? "" : 0); const Header = true ? { name: "1showjb", @@ -42750,7 +43405,7 @@ }; const shady = /*#__PURE__*/emotion_react_browser_esm_css("background-color:", COLORS.ui.backgroundDisabled, ";" + ( true ? "" : 0), true ? "" : 0); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/surface/styles.js +;// ./node_modules/@wordpress/components/build-module/surface/styles.js /** * External dependencies */ @@ -42815,7 +43470,7 @@ } }; -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/surface/hook.js +;// ./node_modules/@wordpress/components/build-module/surface/hook.js /** * WordPress dependencies */ @@ -42856,7 +43511,7 @@ }; } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/card/card/hook.js +;// ./node_modules/@wordpress/components/build-module/card/card/hook.js /** * WordPress dependencies */ @@ -42922,20 +43577,19 @@ }; } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/card/card/component.js -/** - * External dependencies - */ - -/** - * WordPress dependencies - */ - - -/** - * Internal dependencies - */ - +;// ./node_modules/@wordpress/components/build-module/card/card/component.js +/** + * External dependencies + */ + +/** + * WordPress dependencies + */ + + +/** + * Internal dependencies + */ @@ -42954,9 +43608,9 @@ size, ...otherProps } = useCard(props); - const elevationBorderRadius = isRounded ? config_values.cardBorderRadius : 0; + const elevationBorderRadius = isRounded ? config_values.radiusLarge : 0; const cx = useCx(); - const elevationClassName = (0,external_wp_element_namespaceObject.useMemo)(() => cx( /*#__PURE__*/emotion_react_browser_esm_css({ + const elevationClassName = (0,external_wp_element_namespaceObject.useMemo)(() => cx(/*#__PURE__*/emotion_react_browser_esm_css({ borderRadius: elevationBorderRadius }, true ? "" : 0, true ? "" : 0)), [cx, elevationBorderRadius]); const contextProviderValue = (0,external_wp_element_namespaceObject.useMemo)(() => { @@ -43026,7 +43680,7 @@ const component_Card = contextConnect(UnconnectedCard, 'Card'); /* harmony default export */ const card_component = (component_Card); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/scrollable/styles.js +;// ./node_modules/@wordpress/components/build-module/scrollable/styles.js 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)."; } /** * External dependencies @@ -43063,7 +43717,7 @@ styles: "overflow-y:auto" } : 0; -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/scrollable/hook.js +;// ./node_modules/@wordpress/components/build-module/scrollable/hook.js /** * WordPress dependencies */ @@ -43091,7 +43745,7 @@ }; } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/scrollable/component.js +;// ./node_modules/@wordpress/components/build-module/scrollable/component.js /** * External dependencies */ @@ -43130,7 +43784,7 @@ const component_Scrollable = contextConnect(UnconnectedScrollable, 'Scrollable'); /* harmony default export */ const scrollable_component = (component_Scrollable); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/card/card-body/hook.js +;// ./node_modules/@wordpress/components/build-module/card/card-body/hook.js /** * WordPress dependencies */ @@ -43162,7 +43816,7 @@ }; } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/card/card-body/component.js +;// ./node_modules/@wordpress/components/build-module/card/card-body/component.js /** * External dependencies */ @@ -43210,31 +43864,31 @@ const CardBody = contextConnect(UnconnectedCardBody, 'CardBody'); /* harmony default export */ const card_body_component = (CardBody); -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/YZEJGRDQ.js -"use client"; - - - -// src/separator/separator.ts +;// ./node_modules/@ariakit/react-core/esm/__chunks/A3CZKICO.js +"use client"; + + + +// src/separator/separator.tsx +var A3CZKICO_TagName = "hr"; var useSeparator = createHook( - (_a) => { + function useSeparator2(_a) { var _b = _a, { orientation = "horizontal" } = _b, props = __objRest(_b, ["orientation"]); - props = _4R3V3JGP_spreadValues({ + props = _3YLGPPWQ_spreadValues({ role: "separator", "aria-orientation": orientation }, props); return props; } ); -var Separator = createComponent((props) => { +var Separator = forwardRef2(function Separator2(props) { const htmlProps = useSeparator(props); - return _3ORBWXWF_createElement("hr", htmlProps); -}); -if (false) {} - - - -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/divider/styles.js + return LMDWO4NN_createElement(A3CZKICO_TagName, htmlProps); +}); + + + +;// ./node_modules/@wordpress/components/build-module/divider/styles.js 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)."; } /** @@ -43297,11 +43951,10 @@ target: "e19on6iw0" } : 0)("border:0;margin:0;", renderDisplay, " ", renderBorder, " ", renderSize, " ", renderMargin, ";" + ( true ? "" : 0)); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/divider/component.js -/** - * External dependencies - */ -// eslint-disable-next-line no-restricted-imports +;// ./node_modules/@wordpress/components/build-module/divider/component.js +/** + * External dependencies + */ /** @@ -43344,7 +43997,7 @@ const component_Divider = contextConnect(UnconnectedDivider, 'Divider'); /* harmony default export */ const divider_component = (component_Divider); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/card/card-divider/hook.js +;// ./node_modules/@wordpress/components/build-module/card/card-divider/hook.js /** * WordPress dependencies */ @@ -43372,7 +44025,7 @@ }; } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/card/card-divider/component.js +;// ./node_modules/@wordpress/components/build-module/card/card-divider/component.js /** * External dependencies */ @@ -43410,7 +44063,7 @@ const CardDivider = contextConnect(UnconnectedCardDivider, 'CardDivider'); /* harmony default export */ const card_divider_component = (CardDivider); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/card/card-footer/hook.js +;// ./node_modules/@wordpress/components/build-module/card/card-footer/hook.js /** * WordPress dependencies */ @@ -43443,7 +44096,7 @@ }; } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/card/card-footer/component.js +;// ./node_modules/@wordpress/components/build-module/card/card-footer/component.js /** * External dependencies */ @@ -43479,7 +44132,7 @@ const CardFooter = contextConnect(UnconnectedCardFooter, 'CardFooter'); /* harmony default export */ const card_footer_component = (CardFooter); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/card/card-header/hook.js +;// ./node_modules/@wordpress/components/build-module/card/card-header/hook.js /** * WordPress dependencies */ @@ -43510,7 +44163,7 @@ }; } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/card/card-header/component.js +;// ./node_modules/@wordpress/components/build-module/card/card-header/component.js /** * External dependencies */ @@ -43546,7 +44199,7 @@ const CardHeader = contextConnect(UnconnectedCardHeader, 'CardHeader'); /* harmony default export */ const card_header_component = (CardHeader); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/card/card-media/hook.js +;// ./node_modules/@wordpress/components/build-module/card/card-media/hook.js /** * WordPress dependencies */ @@ -43574,7 +44227,7 @@ }; } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/card/card-media/component.js +;// ./node_modules/@wordpress/components/build-module/card/card-media/component.js /** * External dependencies */ @@ -43616,23 +44269,22 @@ const CardMedia = contextConnect(UnconnectedCardMedia, 'CardMedia'); /* harmony default export */ const card_media_component = (CardMedia); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/checkbox-control/index.js -/** - * External dependencies - */ - -/** - * WordPress dependencies - */ - - - - - -/** - * Internal dependencies - */ - +;// ./node_modules/@wordpress/components/build-module/checkbox-control/index.js +/** + * External dependencies + */ + +/** + * WordPress dependencies + */ + + + + + +/** + * Internal dependencies + */ @@ -43647,6 +44299,7 @@ * const [ isChecked, setChecked ] = useState( true ); * return ( * onChange(event.target.checked); return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(base_control, { __nextHasNoMarginBottom: __nextHasNoMarginBottom, + __associatedWPComponentName: "CheckboxControl", label: heading, id: id, help: help && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", { @@ -43736,7 +44390,7 @@ } /* harmony default export */ const checkbox_control = (CheckboxControl); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/clipboard-button/index.js +;// ./node_modules/@wordpress/components/build-module/clipboard-button/index.js /** * External dependencies */ @@ -43767,20 +44421,22 @@ since: '5.8', alternative: 'wp.compose.useCopyToClipboard' }); - const timeoutId = (0,external_wp_element_namespaceObject.useRef)(); + const timeoutIdRef = (0,external_wp_element_namespaceObject.useRef)(); const ref = (0,external_wp_compose_namespaceObject.useCopyToClipboard)(text, () => { onCopy(); - if (timeoutId.current) { - clearTimeout(timeoutId.current); + if (timeoutIdRef.current) { + clearTimeout(timeoutIdRef.current); } if (onFinishCopy) { - timeoutId.current = setTimeout(() => onFinishCopy(), TIMEOUT); + timeoutIdRef.current = setTimeout(() => onFinishCopy(), TIMEOUT); } }); (0,external_wp_element_namespaceObject.useEffect)(() => { - if (timeoutId.current) { - clearTimeout(timeoutId.current); - } + return () => { + if (timeoutIdRef.current) { + clearTimeout(timeoutIdRef.current); + } + }; }, []); const classes = dist_clsx('components-clipboard-button', className); @@ -43802,7 +44458,7 @@ }); } -;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/more-vertical.js +;// ./node_modules/@wordpress/icons/build-module/library/more-vertical.js /** * WordPress dependencies */ @@ -43817,7 +44473,7 @@ }); /* harmony default export */ const more_vertical = (moreVertical); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/item-group/styles.js +;// ./node_modules/@wordpress/components/build-module/item-group/styles.js 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)."; } /** * External dependencies @@ -43841,7 +44497,7 @@ } : 0; const bordered = /*#__PURE__*/emotion_react_browser_esm_css("border:1px solid ", config_values.surfaceBorderColor, ";" + ( true ? "" : 0), true ? "" : 0); 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); -const styles_borderRadius = config_values.controlBorderRadius; +const styles_borderRadius = config_values.radiusSmall; const styles_spacedAround = /*#__PURE__*/emotion_react_browser_esm_css("border-radius:", styles_borderRadius, ";" + ( true ? "" : 0), true ? "" : 0); 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); const baseFontHeight = `calc(${config_values.fontSize} * ${config_values.fontLineHeightBase})`; @@ -43857,12 +44513,122 @@ const paddingYSmall = `calc((${config_values.controlHeightSmall} - ${baseFontHeight} - 2px) / 2)`; const paddingYLarge = `calc((${config_values.controlHeightLarge} - ${baseFontHeight} - 2px) / 2)`; const itemSizes = { - small: /*#__PURE__*/emotion_react_browser_esm_css("padding:", paddingYSmall, " ", config_values.controlPaddingXSmall, ";" + ( true ? "" : 0), true ? "" : 0), - medium: /*#__PURE__*/emotion_react_browser_esm_css("padding:", paddingY, " ", config_values.controlPaddingX, ";" + ( true ? "" : 0), true ? "" : 0), - large: /*#__PURE__*/emotion_react_browser_esm_css("padding:", paddingYLarge, " ", config_values.controlPaddingXLarge, ";" + ( true ? "" : 0), true ? "" : 0) -}; - -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/item-group/item-group/hook.js + small: /*#__PURE__*/emotion_react_browser_esm_css("padding:", paddingYSmall, " ", config_values.controlPaddingXSmall, "px;" + ( true ? "" : 0), true ? "" : 0), + medium: /*#__PURE__*/emotion_react_browser_esm_css("padding:", paddingY, " ", config_values.controlPaddingX, "px;" + ( true ? "" : 0), true ? "" : 0), + large: /*#__PURE__*/emotion_react_browser_esm_css("padding:", paddingYLarge, " ", config_values.controlPaddingXLarge, "px;" + ( true ? "" : 0), true ? "" : 0) +}; + +;// ./node_modules/@wordpress/components/build-module/item-group/context.js +/** + * WordPress dependencies + */ + + +/** + * Internal dependencies + */ + +const ItemGroupContext = (0,external_wp_element_namespaceObject.createContext)({ + size: 'medium' +}); +const useItemGroupContext = () => (0,external_wp_element_namespaceObject.useContext)(ItemGroupContext); + +;// ./node_modules/@wordpress/components/build-module/item-group/item/hook.js +/** + * WordPress dependencies + */ + + +/** + * Internal dependencies + */ + + + + + +function useItem(props) { + const { + as: asProp, + className, + onClick, + role = 'listitem', + size: sizeProp, + ...otherProps + } = useContextSystem(props, 'Item'); + const { + spacedAround, + size: contextSize + } = useItemGroupContext(); + const size = sizeProp || contextSize; + const as = asProp || (typeof onClick !== 'undefined' ? 'button' : 'div'); + const cx = useCx(); + 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]); + const wrapperClassName = cx(itemWrapper); + return { + as, + className: classes, + onClick, + wrapperClassName, + role, + ...otherProps + }; +} + +;// ./node_modules/@wordpress/components/build-module/item-group/item/component.js +/** + * External dependencies + */ + +/** + * Internal dependencies + */ + + + + + +function UnconnectedItem(props, forwardedRef) { + const { + role, + wrapperClassName, + ...otherProps + } = useItem(props); + return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { + role: role, + className: wrapperClassName, + children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(component, { + ...otherProps, + ref: forwardedRef + }) + }); +} + +/** + * `Item` is used in combination with `ItemGroup` to display a list of items + * grouped and styled together. + * + * ```jsx + * import { + * __experimentalItemGroup as ItemGroup, + * __experimentalItem as Item, + * } from '@wordpress/components'; + * + * function Example() { + * return ( + * + * Code + * is + * Poetry + * + * ); + * } + * ``` + */ +const component_Item = contextConnect(UnconnectedItem, 'Item'); +/* harmony default export */ const item_component = (component_Item); + +;// ./node_modules/@wordpress/components/build-module/item-group/item-group/hook.js /** * Internal dependencies */ @@ -43894,22 +44660,7 @@ }; } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/item-group/context.js -/** - * WordPress dependencies - */ - - -/** - * Internal dependencies - */ - -const ItemGroupContext = (0,external_wp_element_namespaceObject.createContext)({ - size: 'medium' -}); -const useItemGroupContext = () => (0,external_wp_element_namespaceObject.useContext)(ItemGroupContext); - -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/item-group/item-group/component.js +;// ./node_modules/@wordpress/components/build-module/item-group/item-group/component.js /** * External dependencies */ @@ -43971,7 +44722,7 @@ const ItemGroup = contextConnect(UnconnectedItemGroup, 'ItemGroup'); /* harmony default export */ const item_group_component = (ItemGroup); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/custom-gradient-picker/gradient-bar/constants.js +;// ./node_modules/@wordpress/components/build-module/custom-gradient-picker/gradient-bar/constants.js const GRADIENT_MARKERS_WIDTH = 16; const INSERT_POINT_WIDTH = 16; const MINIMUM_DISTANCE_BETWEEN_INSERTER_AND_POINT = 10; @@ -43980,7 +44731,7 @@ const KEYBOARD_CONTROL_POINT_VARIATION = MINIMUM_DISTANCE_BETWEEN_INSERTER_AND_POINT; const MINIMUM_DISTANCE_BETWEEN_INSERTER_AND_MARKER = (INSERT_POINT_WIDTH + GRADIENT_MARKERS_WIDTH) / 2; -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/custom-gradient-picker/gradient-bar/utils.js +;// ./node_modules/@wordpress/components/build-module/custom-gradient-picker/gradient-bar/utils.js /** * Internal dependencies */ @@ -44137,26 +44888,24 @@ return Math.round(clampPercent(absolutePositionValue * 100 / width)); } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/custom-gradient-picker/gradient-bar/control-points.js -/** - * External dependencies - */ - - - -/** - * WordPress dependencies - */ - - - - - -/** - * Internal dependencies - */ - - +;// ./node_modules/@wordpress/components/build-module/custom-gradient-picker/gradient-bar/control-points.js +/** + * External dependencies + */ + + + +/** + * WordPress dependencies + */ + + + + + +/** + * Internal dependencies + */ @@ -44177,11 +44926,12 @@ return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, { "aria-label": (0,external_wp_i18n_namespaceObject.sprintf)( - // translators: %1$s: gradient position e.g: 70, %2$s: gradient color code e.g: rgb(52,121,151). + // translators: 1: gradient position e.g: 70. 2: gradient color code e.g: rgb(52,121,151). (0,external_wp_i18n_namespaceObject.__)('Gradient control point at position %1$s%% with color code %2$s.'), position, color), "aria-describedby": descriptionId, "aria-haspopup": "true", "aria-expanded": isOpen, + __next40pxDefaultSize: true, className: dist_clsx('components-custom-gradient-picker__control-point-button', { 'is-active': isOpen }), @@ -44225,9 +44975,9 @@ onStopControlPointChange, __experimentalIsRenderedInSidebar }) { - const controlPointMoveState = (0,external_wp_element_namespaceObject.useRef)(); + const controlPointMoveStateRef = (0,external_wp_element_namespaceObject.useRef)(); const onMouseMove = event => { - if (controlPointMoveState.current === undefined || gradientPickerDomRef.current === null) { + if (controlPointMoveStateRef.current === undefined || gradientPickerDomRef.current === null) { return; } const relativePosition = getHorizontalRelativeGradientPosition(event.clientX, gradientPickerDomRef.current); @@ -44235,18 +44985,18 @@ initialPosition, index, significantMoveHappened - } = controlPointMoveState.current; + } = controlPointMoveStateRef.current; if (!significantMoveHappened && Math.abs(initialPosition - relativePosition) >= MINIMUM_SIGNIFICANT_MOVE) { - controlPointMoveState.current.significantMoveHappened = true; + controlPointMoveStateRef.current.significantMoveHappened = true; } onChange(updateControlPointPosition(controlPoints, index, relativePosition)); }; const cleanEventListeners = () => { - if (window && window.removeEventListener && controlPointMoveState.current && controlPointMoveState.current.listenersActivated) { + if (window && window.removeEventListener && controlPointMoveStateRef.current && controlPointMoveStateRef.current.listenersActivated) { window.removeEventListener('mousemove', onMouseMove); window.removeEventListener('mouseup', cleanEventListeners); onStopControlPointChange(); - controlPointMoveState.current.listenersActivated = false; + controlPointMoveStateRef.current.listenersActivated = false; } }; @@ -44271,7 +45021,7 @@ onToggle }) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ControlPointButton, { onClick: () => { - if (controlPointMoveState.current && controlPointMoveState.current.significantMoveHappened) { + if (controlPointMoveStateRef.current && controlPointMoveStateRef.current.significantMoveHappened) { return; } if (isOpen) { @@ -44283,7 +45033,7 @@ }, onMouseDown: () => { if (window && window.addEventListener) { - controlPointMoveState.current = { + controlPointMoveStateRef.current = { initialPosition, index, significantMoveHappened: false, @@ -44362,6 +45112,7 @@ isOpen, onToggle }) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, { + __next40pxDefaultSize: true, "aria-expanded": isOpen, "aria-haspopup": "true", onClick: () => { @@ -44399,21 +45150,20 @@ ControlPoints.InsertPoint = InsertPoint; /* harmony default export */ const control_points = (ControlPoints); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/custom-gradient-picker/gradient-bar/index.js -/** - * External dependencies - */ - - -/** - * WordPress dependencies - */ - - -/** - * Internal dependencies - */ - +;// ./node_modules/@wordpress/components/build-module/custom-gradient-picker/gradient-bar/index.js +/** + * External dependencies + */ + + +/** + * WordPress dependencies + */ + + +/** + * Internal dependencies + */ @@ -44569,7 +45319,7 @@ // EXTERNAL MODULE: ./node_modules/gradient-parser/build/node.js var build_node = __webpack_require__(8924); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/custom-gradient-picker/constants.js +;// ./node_modules/@wordpress/components/build-module/custom-gradient-picker/constants.js /** * WordPress dependencies */ @@ -44602,7 +45352,7 @@ 'left top': 315 }; -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/custom-gradient-picker/serializer.js +;// ./node_modules/@wordpress/components/build-module/custom-gradient-picker/serializer.js /** * External dependencies */ @@ -44660,7 +45410,7 @@ return `${type}(${[serializedOrientation, ...serializedColorStops].filter(Boolean).join(',')})`; } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/custom-gradient-picker/utils.js +;// ./node_modules/@wordpress/components/build-module/custom-gradient-picker/utils.js /** * External dependencies */ @@ -44761,7 +45511,7 @@ } } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/custom-gradient-picker/styles/custom-gradient-picker-styles.js +;// ./node_modules/@wordpress/components/build-module/custom-gradient-picker/styles/custom-gradient-picker-styles.js 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)."; } /** @@ -44785,20 +45535,19 @@ styles: "flex-grow:5" } : 0); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/custom-gradient-picker/index.js -/** - * External dependencies - */ - -/** - * WordPress dependencies - */ - - -/** - * Internal dependencies - */ - +;// ./node_modules/@wordpress/components/build-module/custom-gradient-picker/index.js +/** + * External dependencies + */ + +/** + * WordPress dependencies + */ + + +/** + * Internal dependencies + */ @@ -44899,6 +45648,7 @@ function CustomGradientPicker({ value, onChange, + enableAlpha = true, __experimentalIsRenderedInSidebar = false }) { const { @@ -44927,6 +45677,7 @@ className: "components-custom-gradient-picker", children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(CustomGradientBar, { __experimentalIsRenderedInSidebar: __experimentalIsRenderedInSidebar, + disableAlpha: !enableAlpha, background: background, hasGradient: hasGradient, value: controlPoints, @@ -44954,18 +45705,17 @@ } /* harmony default export */ const custom_gradient_picker = (CustomGradientPicker); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/gradient-picker/index.js -/** - * WordPress dependencies - */ - - - - -/** - * Internal dependencies - */ - +;// ./node_modules/@wordpress/components/build-module/gradient-picker/index.js +/** + * WordPress dependencies + */ + + + + +/** + * Internal dependencies + */ @@ -45048,7 +45798,7 @@ }) }); } -function gradient_picker_Component(props) { +function Component(props) { const { asButtons, loop, @@ -45064,79 +45814,57 @@ }) : /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(SingleOrigin, { ...additionalProps }); - let metaProps; - if (asButtons) { - metaProps = { - asButtons: true - }; - } else { - const _metaProps = { - asButtons: false, - loop - }; - if (ariaLabel) { - metaProps = { - ..._metaProps, - 'aria-label': ariaLabel - }; - } else if (ariaLabelledby) { - metaProps = { - ..._metaProps, - 'aria-labelledby': ariaLabelledby - }; - } else { - metaProps = { - ..._metaProps, - 'aria-label': (0,external_wp_i18n_namespaceObject.__)('Custom color picker.') - }; - } - } + const { + metaProps, + labelProps + } = getComputeCircularOptionPickerCommonProps(asButtons, loop, ariaLabel, ariaLabelledby); return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_circular_option_picker, { ...metaProps, + ...labelProps, actions: actions, options: options }); } /** - * GradientPicker is a React component that renders a color gradient picker to + * GradientPicker is a React component that renders a color gradient picker to * define a multi step gradient. There's either a _linear_ or a _radial_ type * available. * * ```jsx - *import { GradientPicker } from '@wordpress/components'; - *import { useState } from '@wordpress/element'; - * - *const myGradientPicker = () => { - * const [ gradient, setGradient ] = useState( null ); - * - * return ( - * setGradient( currentGradient ) } - * gradients={ [ - * { - * name: 'JShine', - * gradient: - * 'linear-gradient(135deg,#12c2e9 0%,#c471ed 50%,#f64f59 100%)', - * slug: 'jshine', - * }, - * { - * name: 'Moonlit Asteroid', - * gradient: - * 'linear-gradient(135deg,#0F2027 0%, #203A43 0%, #2c5364 100%)', - * slug: 'moonlit-asteroid', - * }, - * { - * name: 'Rastafarie', - * gradient: - * 'linear-gradient(135deg,#1E9600 0%, #FFF200 0%, #FF0000 100%)', - * slug: 'rastafari', - * }, - * ] } - * /> - * ); - *}; + * import { useState } from 'react'; + * import { GradientPicker } from '@wordpress/components'; + * + * const MyGradientPicker = () => { + * const [ gradient, setGradient ] = useState( null ); + * + * return ( + * setGradient( currentGradient ) } + * gradients={ [ + * { + * name: 'JShine', + * gradient: + * 'linear-gradient(135deg,#12c2e9 0%,#c471ed 50%,#f64f59 100%)', + * slug: 'jshine', + * }, + * { + * name: 'Moonlit Asteroid', + * gradient: + * 'linear-gradient(135deg,#0F2027 0%, #203A43 0%, #2c5364 100%)', + * slug: 'moonlit-asteroid', + * }, + * { + * name: 'Rastafarie', + * gradient: + * 'linear-gradient(135deg,#1E9600 0%, #FFF200 0%, #FF0000 100%)', + * slug: 'rastafari', + * }, + * ] } + * /> + * ); + * }; *``` * */ @@ -45146,6 +45874,7 @@ onChange, value, clearable = true, + enableAlpha = true, disableCustomGradients = false, __experimentalIsRenderedInSidebar, headingLevel = 2, @@ -45156,9 +45885,10 @@ spacing: gradients.length ? 4 : 0, children: [!disableCustomGradients && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(custom_gradient_picker, { __experimentalIsRenderedInSidebar: __experimentalIsRenderedInSidebar, + enableAlpha: enableAlpha, value: value, onChange: onChange - }), (gradients.length > 0 || clearable) && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(gradient_picker_Component, { + }), (gradients.length > 0 || clearable) && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Component, { ...additionalProps, className: className, clearGradient: clearGradient, @@ -45167,6 +45897,8 @@ value: value, actions: clearable && !disableCustomGradients && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_circular_option_picker.ButtonAction, { onClick: clearGradient, + accessibleWhenDisabled: true, + disabled: !value, children: (0,external_wp_i18n_namespaceObject.__)('Clear') }), headingLevel: headingLevel @@ -45175,7 +45907,7 @@ } /* harmony default export */ const gradient_picker = (GradientPicker); -;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/menu.js +;// ./node_modules/@wordpress/icons/build-module/library/menu.js /** * WordPress dependencies */ @@ -45190,9 +45922,9 @@ }); /* harmony default export */ const library_menu = (menu); -;// CONCATENATED MODULE: external ["wp","dom"] +;// external ["wp","dom"] const external_wp_dom_namespaceObject = window["wp"]["dom"]; -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/navigable-container/container.js +;// ./node_modules/@wordpress/components/build-module/navigable-container/container.js /** * External dependencies */ @@ -45362,7 +46094,7 @@ forwardedNavigableContainer.displayName = 'NavigableContainer'; /* harmony default export */ const container = ((0,external_wp_element_namespaceObject.forwardRef)(forwardedNavigableContainer)); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/navigable-container/menu.js +;// ./node_modules/@wordpress/components/build-module/navigable-container/menu.js /** * External dependencies */ @@ -45447,21 +46179,20 @@ const NavigableMenu = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedNavigableMenu); /* harmony default export */ const navigable_container_menu = (NavigableMenu); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/dropdown-menu/index.js -/** - * External dependencies - */ - - -/** - * WordPress dependencies - */ - - -/** - * Internal dependencies - */ - +;// ./node_modules/@wordpress/components/build-module/dropdown-menu/index.js +/** + * External dependencies + */ + + +/** + * WordPress dependencies + */ + + +/** + * Internal dependencies + */ @@ -45579,6 +46310,7 @@ ...mergedMenuProps, role: "menu", 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, { + __next40pxDefaultSize: true, onClick: event => { event.stopPropagation(); props.onClose(); @@ -45595,6 +46327,7 @@ label: control.label, "aria-checked": control.role === 'menuitemcheckbox' || control.role === 'menuitemradio' ? control.isActive : undefined, role: control.role === 'menuitemcheckbox' || control.role === 'menuitemradio' ? control.role : 'menuitem', + accessibleWhenDisabled: true, disabled: control.isDisabled, children: control.title }, [indexOfSet, indexOfControl].join())))] @@ -45689,15 +46422,13 @@ const DropdownMenu = contextConnectWithoutRef(UnconnectedDropdownMenu, 'DropdownMenu'); /* harmony default export */ const dropdown_menu = (DropdownMenu); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/palette-edit/styles.js +;// ./node_modules/@wordpress/components/build-module/palette-edit/styles.js 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)."; } /** * External dependencies */ - - /** * Internal dependencies */ @@ -45710,22 +46441,11 @@ const IndicatorStyled = /*#__PURE__*/emotion_styled_base_browser_esm(color_indicator, true ? { - target: "e1lpqc909" + target: "e1lpqc908" } : 0)("&&{flex-shrink:0;width:", space(6), ";height:", space(6), ";}" + ( true ? "" : 0)); const NameInputControl = /*#__PURE__*/emotion_styled_base_browser_esm(input_control, true ? { - target: "e1lpqc908" -} : 0)(Container, "{background:", COLORS.gray[100], ";border-radius:", config_values.controlBorderRadius, ";", Input, Input, Input, Input, "{height:", space(8), ";}", BackdropUI, BackdropUI, BackdropUI, "{border-color:transparent;box-shadow:none;}}" + ( true ? "" : 0)); -const buttonStyleReset = ({ - as -}) => { - if (as === 'button') { - 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); - } - return null; -}; -const PaletteItem = /*#__PURE__*/emotion_styled_base_browser_esm(component, true ? { target: "e1lpqc907" -} : 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.controlBorderRadius, ";border-top-right-radius:", config_values.controlBorderRadius, ";&+&{border-top-left-radius:0;border-top-right-radius:0;}&:last-child{border-bottom-left-radius:", config_values.controlBorderRadius, ";border-bottom-right-radius:", config_values.controlBorderRadius, ";border-bottom-color:", config_values.surfaceBorderColor, ";}&.is-selected+&{border-top-color:transparent;}&.is-selected{border-color:", COLORS.theme.accent, ";}" + ( true ? "" : 0)); +} : 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)); const NameContainer = /*#__PURE__*/emotion_styled_base_browser_esm("div", true ? { target: "e1lpqc906" } : 0)("line-height:", space(8), ";margin-left:", space(2), ";margin-right:", space(2), ";white-space:nowrap;overflow:hidden;" + ( true ? "" : 0)); @@ -45751,25 +46471,23 @@ target: "e1lpqc900" } : 0)("&&{margin-top:", space(1), ";}" + ( true ? "" : 0)); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/palette-edit/index.js -/** - * External dependencies - */ - - -/** - * WordPress dependencies - */ - - - - - -/** - * Internal dependencies - */ - - +;// ./node_modules/@wordpress/components/build-module/palette-edit/index.js +/** + * External dependencies + */ + + +/** + * WordPress dependencies + */ + + + + + +/** + * Internal dependencies + */ @@ -45793,6 +46511,7 @@ label }) { return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(NameInputControl, { + size: "compact", label: label, hideLabelFromVision: true, value: value, @@ -45800,6 +46519,28 @@ }); } +/* + * Deduplicates the slugs of the provided elements. + */ +function deduplicateElementSlugs(elements) { + const slugCounts = {}; + return elements.map(element => { + var _newSlug; + let newSlug; + const { + slug + } = element; + slugCounts[slug] = (slugCounts[slug] || 0) + 1; + if (slugCounts[slug] > 1) { + newSlug = `${slug}-${slugCounts[slug] - 1}`; + } + return { + ...element, + slug: (_newSlug = newSlug) !== null && _newSlug !== void 0 ? _newSlug : slug + }; + }); +} + /** * Returns a name and slug for a palette item. The name takes the format "Color + id". * To ensure there are no duplicate ids, this function checks all slugs. @@ -45826,7 +46567,7 @@ return previousValue; }, 1); return { - name: (0,external_wp_i18n_namespaceObject.sprintf)( /* translators: %s: is an id for a custom color */ + name: (0,external_wp_i18n_namespaceObject.sprintf)(/* translators: %s: is an id for a custom color */ (0,external_wp_i18n_namespaceObject.__)('Color %s'), position), slug: `${slugPrefix}color-${position}` }; @@ -45896,12 +46637,13 @@ // Use the custom palette color item as the popover anchor. anchor: popoverAnchor }), [popoverAnchor, receivedPopoverProps]); - return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(PaletteItem, { + return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(item_component, { ref: setPopoverAnchor, - as: "div", + size: "small", children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(h_stack_component, { justify: "flex-start", children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, { + size: "small", onClick: () => { setIsEditingColor(true); }, @@ -45956,15 +46698,17 @@ addColorRef }) { // When unmounting the component if there are empty elements (the user did not complete the insertion) clean them. - const elementsReference = (0,external_wp_element_namespaceObject.useRef)(); + const elementsReferenceRef = (0,external_wp_element_namespaceObject.useRef)(); (0,external_wp_element_namespaceObject.useEffect)(() => { - elementsReference.current = elements; + elementsReferenceRef.current = elements; }, [elements]); - const debounceOnChange = (0,external_wp_compose_namespaceObject.useDebounce)(onChange, 100); + const debounceOnChange = (0,external_wp_compose_namespaceObject.useDebounce)(updatedElements => onChange(deduplicateElementSlugs(updatedElements)), 100); return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(v_stack_component, { spacing: 3, children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(item_group_component, { isRounded: true, + isBordered: true, + isSeparated: true, children: elements.map((element, index) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(palette_edit_Option, { isGradient: isGradient, canOnlyChangeValues: canOnlyChangeValues, @@ -46098,6 +46842,7 @@ children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(navigable_container_menu, { role: "menu", children: [!isEditing && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, { + __next40pxDefaultSize: true, variant: "tertiary", onClick: () => { setIsEditing(true); @@ -46106,6 +46851,7 @@ className: "components-palette-edit__menu-button", children: (0,external_wp_i18n_namespaceObject.__)('Show details') }), !canOnlyChangeValues && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, { + __next40pxDefaultSize: true, variant: "tertiary", onClick: () => { setEditingElement(null); @@ -46116,6 +46862,8 @@ className: "components-palette-edit__menu-button", children: isGradient ? (0,external_wp_i18n_namespaceObject.__)('Remove all gradients') : (0,external_wp_i18n_namespaceObject.__)('Remove all colors') }), canReset && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, { + __next40pxDefaultSize: true, + className: "components-palette-edit__menu-button", variant: "tertiary", onClick: () => { setEditingElement(null); @@ -46172,7 +46920,22 @@ } /* harmony default export */ const palette_edit = (PaletteEdit); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/combobox-control/styles.js +;// ./node_modules/@wordpress/icons/build-module/library/close-small.js +/** + * WordPress dependencies + */ + + +const closeSmall = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { + xmlns: "http://www.w3.org/2000/svg", + viewBox: "0 0 24 24", + children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { + 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" + }) +}); +/* harmony default export */ const close_small = (closeSmall); + +;// ./node_modules/@wordpress/components/build-module/combobox-control/styles.js /** * External dependencies @@ -46192,7 +46955,7 @@ target: "evuatpg0" } : 0)("height:38px;padding-left:", space(2), ";padding-right:", space(2), ";", deprecatedDefaultSize, ";" + ( true ? "" : 0)); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/form-token-field/token-input.js +;// ./node_modules/@wordpress/components/build-module/form-token-field/token-input.js /** * External dependencies */ @@ -46263,20 +47026,20 @@ const TokenInput = (0,external_wp_element_namespaceObject.forwardRef)(UnForwardedTokenInput); /* harmony default export */ const token_input = (TokenInput); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/form-token-field/suggestions-list.js -/** - * External dependencies - */ - -/** - * WordPress dependencies - */ - - -/** - * Internal dependencies - */ - +;// ./node_modules/@wordpress/components/build-module/form-token-field/suggestions-list.js +/** + * External dependencies + */ + +/** + * WordPress dependencies + */ + + + +/** + * Internal dependencies + */ const handleMouseDown = e => { // By preventing default here, we will not lose focus of when clicking a suggestion. @@ -46333,12 +47096,12 @@ suggestionAfterMatch: transformedSuggestion.substring(indexOfMatch + matchText.length) }; }; - return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("ul", { + return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("ul", { ref: listRef, className: "components-form-token-field__suggestions-list", id: `components-form-token-suggestions-${instanceId}`, role: "listbox", - children: suggestions.map((suggestion, index) => { + children: [suggestions.map((suggestion, index) => { const matchText = computeSuggestionMatch(suggestion); const isSelected = index === selectedIndex; const isDisabled = typeof suggestion === 'object' && suggestion?.disabled; @@ -46376,12 +47139,15 @@ children: output }, key); /* eslint-enable jsx-a11y/click-events-have-key-events */ - }) + }), suggestions.length === 0 && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("li", { + className: "components-form-token-field__suggestion is-empty", + children: (0,external_wp_i18n_namespaceObject.__)('No items found') + })] }); } /* harmony default export */ const suggestions_list = (SuggestionsList); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/higher-order/with-focus-outside/index.js +;// ./node_modules/@wordpress/components/build-module/higher-order/with-focus-outside/index.js /** * WordPress dependencies */ @@ -46400,24 +47166,113 @@ }); }, 'withFocusOutside')); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/combobox-control/index.js -/** - * External dependencies - */ - - -/** - * WordPress dependencies - */ - - - - - - -/** - * Internal dependencies - */ +;// ./node_modules/@wordpress/components/build-module/spinner/styles.js + +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)."; } +/** + * External dependencies + */ + + + +/** + * Internal dependencies + */ + +const spinAnimation = emotion_react_browser_esm_keyframes` + from { + transform: rotate(0deg); + } + to { + transform: rotate(360deg); + } + `; +const StyledSpinner = /*#__PURE__*/emotion_styled_base_browser_esm("svg", true ? { + target: "ea4tfvq2" +} : 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)); +const commonPathProps = true ? { + name: "9s4963", + styles: "fill:transparent;stroke-width:1.5px" +} : 0; +const SpinnerTrack = /*#__PURE__*/emotion_styled_base_browser_esm("circle", true ? { + target: "ea4tfvq1" +} : 0)(commonPathProps, ";stroke:", COLORS.gray[300], ";" + ( true ? "" : 0)); +const SpinnerIndicator = /*#__PURE__*/emotion_styled_base_browser_esm("path", true ? { + target: "ea4tfvq0" +} : 0)(commonPathProps, ";stroke:currentColor;stroke-linecap:round;transform-origin:50% 50%;animation:1.4s linear infinite both ", spinAnimation, ";" + ( true ? "" : 0)); + +;// ./node_modules/@wordpress/components/build-module/spinner/index.js +/** + * External dependencies + */ + +/** + * Internal dependencies + */ + +/** + * WordPress dependencies + */ + + +function UnforwardedSpinner({ + className, + ...props +}, forwardedRef) { + return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(StyledSpinner, { + className: dist_clsx('components-spinner', className), + viewBox: "0 0 100 100", + width: "16", + height: "16", + xmlns: "http://www.w3.org/2000/svg", + role: "presentation", + focusable: "false", + ...props, + ref: forwardedRef, + children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(SpinnerTrack, { + cx: "50", + cy: "50", + r: "50", + vectorEffect: "non-scaling-stroke" + }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(SpinnerIndicator, { + d: "m 50 0 a 50 50 0 0 1 50 50", + vectorEffect: "non-scaling-stroke" + })] + }); +} +/** + * `Spinner` is a component used to notify users that their action is being processed. + * + * ```js + * import { Spinner } from '@wordpress/components'; + * + * function Example() { + * return ; + * } + * ``` + */ +const Spinner = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedSpinner); +/* harmony default export */ const spinner = (Spinner); + +;// ./node_modules/@wordpress/components/build-module/combobox-control/index.js +/** + * External dependencies + */ + + +/** + * WordPress dependencies + */ + + + + + + +/** + * Internal dependencies + */ + @@ -46472,6 +47327,8 @@ * const [ filteredOptions, setFilteredOptions ] = useState( options ); * return ( * { + event.stopPropagation(); + }; + // Update current selections when the filter input changes. (0,external_wp_element_namespaceObject.useEffect)(() => { const hasMatchingSuggestions = matchingSuggestions.length > 0; @@ -46636,11 +47502,16 @@ (0,external_wp_element_namespaceObject.useEffect)(() => { const hasMatchingSuggestions = matchingSuggestions.length > 0; if (isExpanded) { - const message = hasMatchingSuggestions ? (0,external_wp_i18n_namespaceObject.sprintf)( /* translators: %d: number of results. */ + const message = hasMatchingSuggestions ? (0,external_wp_i18n_namespaceObject.sprintf)(/* translators: %d: number of results. */ (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.'); (0,external_wp_a11y_namespaceObject.speak)(message, 'polite'); } }, [matchingSuggestions, isExpanded]); + maybeWarnDeprecated36pxSize({ + componentName: 'ComboboxControl', + __next40pxDefaultSize, + size: undefined + }); // Disable reason: There is no appropriate role which describes the // input container intended accessible usability. @@ -46650,6 +47521,7 @@ onFocusOutside: onFocusOutside, children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(base_control, { __nextHasNoMarginBottom: __nextHasNoMarginBottom, + __associatedWPComponentName: "ComboboxControl", className: dist_clsx(className, 'components-combobox-control'), label: label, id: `components-form-token-input-${instanceId}`, @@ -46666,6 +47538,7 @@ className: "components-combobox-control__input", instanceId: instanceId, ref: inputContainer, + placeholder: placeholder, value: isExpanded ? inputValue : currentLabel, onFocus: onFocus, onBlur: onBlur, @@ -46674,16 +47547,18 @@ selectedSuggestionIndex: getIndexOfMatchingSuggestion(selectedSuggestion, matchingSuggestions), onChange: onInputChange }) - }), allowReset && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(flex_item_component, { - children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, { - className: "components-combobox-control__reset", - icon: close_small, - disabled: !value, - onClick: handleOnReset, - label: (0,external_wp_i18n_namespaceObject.__)('Reset') - }) + }), isLoading && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(spinner, {}), allowReset && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, { + size: "small", + icon: close_small + // Disable reason: Focus returns to input field when reset is clicked. + // eslint-disable-next-line no-restricted-syntax + , + disabled: !value, + onClick: handleOnReset, + onKeyDown: handleResetStopPropagation, + label: (0,external_wp_i18n_namespaceObject.__)('Reset') })] - }), isExpanded && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(suggestions_list, { + }), isExpanded && !isLoading && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(suggestions_list, { instanceId: instanceId // The empty string for `value` here is not actually used, but is // just a quick way to satisfy the TypeScript requirements of SuggestionsList. @@ -46708,71 +47583,7 @@ } /* harmony default export */ const combobox_control = (ComboboxControl); -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/3X3MDQGM.js -"use client"; - -// src/group/group-label-context.ts - -var GroupLabelContext = (0,external_React_.createContext)(void 0); - - - -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/R2QZ3KXH.js -"use client"; - - - - - -// src/group/group.tsx - - -var useGroup = createHook((props) => { - const [labelId, setLabelId] = (0,external_React_.useState)(); - props = useWrapElement( - props, - (element) => /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(GroupLabelContext.Provider, { value: setLabelId, children: element }), - [] - ); - props = _4R3V3JGP_spreadValues({ - role: "group", - "aria-labelledby": labelId - }, props); - return props; -}); -var Group = createComponent((props) => { - const htmlProps = useGroup(props); - return _3ORBWXWF_createElement("div", htmlProps); -}); -if (false) {} - - - -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/636A7WVS.js -"use client"; - - - - -// src/composite/composite-group.ts -var useCompositeGroup = createHook( - (_a) => { - var _b = _a, { store } = _b, props = __objRest(_b, ["store"]); - props = useGroup(props); - return props; - } -); -var CompositeGroup = createComponent( - (props) => { - const htmlProps = useCompositeGroup(props); - return _3ORBWXWF_createElement("div", htmlProps); - } -); -if (false) {} - - - -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/composite/legacy/index.js +;// ./node_modules/@wordpress/components/build-module/composite/legacy/index.js /** * Composite is a component that may contain navigable items represented by * CompositeItem. It's inspired by the WAI-ARIA Composite Role and implements @@ -46780,18 +47591,29 @@ * tab stop for the whole Composite element. This means that it can behave as * a roving tabindex or aria-activedescendant container. * + * This file aims at providing components that are as close as possible to the + * original `reakit`-based implementation (which was removed from the codebase), + * although it is recommended that consumers of the package switch to the stable, + * un-prefixed, `ariakit`-based version of `Composite`. + * * @see https://ariakit.org/components/composite */ /** - * WordPress dependencies - */ - - -/** - * Internal dependencies - */ - + * External dependencies + */ + + +/** + * WordPress dependencies + */ + + + + +/** + * Internal dependencies + */ // Legacy composite components can either provide state through a @@ -46819,15 +47641,29 @@ } return legacyProps; } +const LEGACY_TO_NEW_DISPLAY_NAME = { + __unstableComposite: 'Composite', + __unstableCompositeGroup: 'Composite.Group or Composite.Row', + __unstableCompositeItem: 'Composite.Item', + __unstableUseCompositeState: 'Composite' +}; function proxyComposite(ProxiedComponent, propMap = {}) { - const displayName = ProxiedComponent.displayName; + var _ProxiedComponent$dis; + const displayName = (_ProxiedComponent$dis = ProxiedComponent.displayName) !== null && _ProxiedComponent$dis !== void 0 ? _ProxiedComponent$dis : ''; const Component = legacyProps => { + external_wp_deprecated_default()(`wp.components.${displayName}`, { + since: '6.7', + alternative: LEGACY_TO_NEW_DISPLAY_NAME.hasOwnProperty(displayName) ? LEGACY_TO_NEW_DISPLAY_NAME[displayName] : undefined + }); const { store, ...rest } = mapLegacyStatePropsToComponentProps(legacyProps); - const props = rest; - props.id = (0,external_wp_compose_namespaceObject.useInstanceId)(store, props.baseId, props.id); + let props = rest; + props = { + ...props, + id: (0,external_wp_compose_namespaceObject.useInstanceId)(store, props.baseId, props.id) + }; Object.entries(propMap).forEach(([from, to]) => { if (props.hasOwnProperty(from)) { Object.assign(props, { @@ -46850,26 +47686,57 @@ // `CompositeRow`, but this has been split into two different // components. We handle that difference by checking on the // provided role, and returning the appropriate component. -const unproxiedCompositeGroup = (0,external_wp_element_namespaceObject.forwardRef)(({ +const UnproxiedCompositeGroup = (0,external_wp_element_namespaceObject.forwardRef)(({ role, ...props }, ref) => { - const Component = role === 'row' ? CompositeRow : CompositeGroup; + const Component = role === 'row' ? Composite.Row : Composite.Group; return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Component, { ref: ref, role: role, ...props }); }); -unproxiedCompositeGroup.displayName = 'CompositeGroup'; -const legacy_Composite = proxyComposite(Composite, { + +/** + * _Note: please use the `Composite` component instead._ + * + * @deprecated + */ +const legacy_Composite = proxyComposite(Object.assign(Composite, { + displayName: '__unstableComposite' +}), { baseId: 'id' }); -const legacy_CompositeGroup = proxyComposite(unproxiedCompositeGroup); -const legacy_CompositeItem = proxyComposite(CompositeItem, { +/** + * _Note: please use the `Composite.Row` or `Composite.Group` components instead._ + * + * @deprecated + */ +const legacy_CompositeGroup = proxyComposite(Object.assign(UnproxiedCompositeGroup, { + displayName: '__unstableCompositeGroup' +})); +/** + * _Note: please use the `Composite.Item` component instead._ + * + * @deprecated + */ +const legacy_CompositeItem = proxyComposite(Object.assign(Composite.Item, { + displayName: '__unstableCompositeItem' +}), { focusable: 'accessibleWhenDisabled' }); + +/** + * _Note: please use the `Composite` component instead._ + * + * @deprecated + */ function useCompositeState(legacyStateOptions = {}) { + external_wp_deprecated_default()(`wp.components.__unstableUseCompositeState`, { + since: '6.7', + alternative: LEGACY_TO_NEW_DISPLAY_NAME.__unstableUseCompositeState + }); const { baseId, currentId: defaultActiveId, @@ -46895,7 +47762,7 @@ }; } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/modal/aria-helper.js +;// ./node_modules/@wordpress/components/build-module/modal/aria-helper.js const LIVE_REGION_ARIA_ROLES = new Set(['alert', 'status', 'log', 'marquee', 'timer']); const hiddenElementsByDepth = []; @@ -46935,7 +47802,7 @@ */ function elementShouldBeHidden(element) { const role = element.getAttribute('role'); - return !(element.tagName === 'SCRIPT' || element.hasAttribute('aria-hidden') || element.hasAttribute('aria-live') || role && LIVE_REGION_ARIA_ROLES.has(role)); + return !(element.tagName === 'SCRIPT' || element.hasAttribute('hidden') || element.hasAttribute('aria-hidden') || element.hasAttribute('aria-live') || role && LIVE_REGION_ARIA_ROLES.has(role)); } /** @@ -46951,23 +47818,95 @@ } } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/modal/index.js -/** - * External dependencies - */ - -/** - * WordPress dependencies - */ - - - - - - -/** - * Internal dependencies - */ +;// ./node_modules/@wordpress/components/build-module/modal/use-modal-exit-animation.js +/** + * WordPress dependencies + */ + + + +/** + * Internal dependencies + */ + + + +// Animation duration (ms) extracted to JS in order to be used on a setTimeout. +const FRAME_ANIMATION_DURATION = config_values.transitionDuration; +const FRAME_ANIMATION_DURATION_NUMBER = Number.parseInt(config_values.transitionDuration); +const EXIT_ANIMATION_NAME = 'components-modal__disappear-animation'; +function useModalExitAnimation() { + const frameRef = (0,external_wp_element_namespaceObject.useRef)(); + const [isAnimatingOut, setIsAnimatingOut] = (0,external_wp_element_namespaceObject.useState)(false); + const isReducedMotion = (0,external_wp_compose_namespaceObject.useReducedMotion)(); + const closeModal = (0,external_wp_element_namespaceObject.useCallback)(() => new Promise(closeModalResolve => { + // Grab a "stable" reference of the frame element, since + // the value held by the react ref might change at runtime. + const frameEl = frameRef.current; + if (isReducedMotion) { + closeModalResolve(); + return; + } + if (!frameEl) { + 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; + closeModalResolve(); + return; + } + let handleAnimationEnd; + const startAnimation = () => new Promise(animationResolve => { + handleAnimationEnd = e => { + if (e.animationName === EXIT_ANIMATION_NAME) { + animationResolve(); + } + }; + frameEl.addEventListener('animationend', handleAnimationEnd); + setIsAnimatingOut(true); + }); + const animationTimeout = () => new Promise(timeoutResolve => { + setTimeout(() => timeoutResolve(), + // Allow an extra 20% of the animation duration for the + // animationend event to fire, in case the animation frame is + // slightly delayes by some other events in the event loop. + FRAME_ANIMATION_DURATION_NUMBER * 1.2); + }); + Promise.race([startAnimation(), animationTimeout()]).then(() => { + if (handleAnimationEnd) { + frameEl.removeEventListener('animationend', handleAnimationEnd); + } + setIsAnimatingOut(false); + closeModalResolve(); + }); + }), [isReducedMotion]); + return { + overlayClassname: isAnimatingOut ? 'is-animating-out' : undefined, + frameRef, + frameStyle: { + '--modal-frame-animation-duration': `${FRAME_ANIMATION_DURATION}` + }, + closeModal + }; +} + +;// ./node_modules/@wordpress/components/build-module/modal/index.js +/** + * External dependencies + */ + + +/** + * WordPress dependencies + */ + + + + + + +/** + * Internal dependencies + */ + + @@ -46975,8 +47914,7 @@ // Used to track and dismiss the prior modal when another opens unless nested. - -const ModalContext = (0,external_wp_element_namespaceObject.createContext)([]); +const ModalContext = (0,external_wp_element_namespaceObject.createContext)(new Set()); // Used to track body class names applied while modals are open. const bodyOpenClasses = new Map(); @@ -46999,7 +47937,7 @@ closeButtonLabel, children, style, - overlayClassName, + overlayClassName: overlayClassnameProp, className, contentLabel, onKeyDown, @@ -47054,31 +47992,37 @@ }, []); // Keeps a fresh ref for the subsequent effect. - const refOnRequestClose = (0,external_wp_element_namespaceObject.useRef)(); + const onRequestCloseRef = (0,external_wp_element_namespaceObject.useRef)(); (0,external_wp_element_namespaceObject.useEffect)(() => { - refOnRequestClose.current = onRequestClose; + onRequestCloseRef.current = onRequestClose; }, [onRequestClose]); // The list of `onRequestClose` callbacks of open (non-nested) Modals. Only // one should remain open at a time and the list enables closing prior ones. const dismissers = (0,external_wp_element_namespaceObject.useContext)(ModalContext); // Used for the tracking and dismissing any nested modals. - const nestedDismissers = (0,external_wp_element_namespaceObject.useRef)([]); + const [nestedDismissers] = (0,external_wp_element_namespaceObject.useState)(() => new Set()); // Updates the stack tracking open modals at this level and calls // onRequestClose for any prior and/or nested modals as applicable. (0,external_wp_element_namespaceObject.useEffect)(() => { - dismissers.push(refOnRequestClose); - const [first, second] = dismissers; - if (second) { - first?.current?.(); - } - const nested = nestedDismissers.current; + // add this modal instance to the dismissers set + dismissers.add(onRequestCloseRef); + // request that all the other modals close themselves + for (const dismisser of dismissers) { + if (dismisser !== onRequestCloseRef) { + dismisser.current?.(); + } + } return () => { - nested[0]?.current?.(); - dismissers.shift(); - }; - }, [dismissers]); + // request that all the nested modals close themselves + for (const dismisser of nestedDismissers) { + dismisser.current?.(); + } + // remove this modal instance from the dismissers set + dismissers.delete(onRequestCloseRef); + }; + }, [dismissers, nestedDismissers]); // Adds/removes the value of bodyOpenClassName to body element. (0,external_wp_element_namespaceObject.useEffect)(() => { @@ -47097,6 +48041,12 @@ } }; }, [bodyOpenClassName]); + const { + closeModal, + frameRef, + frameStyle, + overlayClassname + } = useModalExitAnimation(); // Calls the isContentScrollable callback when the Modal children container resizes. (0,external_wp_element_namespaceObject.useLayoutEffect)(() => { @@ -47113,9 +48063,7 @@ function handleEscapeKeyDown(event) { if (shouldCloseOnEsc && (event.code === 'Escape' || event.key === 'Escape') && !event.defaultPrevented) { event.preventDefault(); - if (onRequestClose) { - onRequestClose(event); - } + closeModal().then(() => onRequestClose(event)); } } const onContentContainerScroll = (0,external_wp_element_namespaceObject.useCallback)(e => { @@ -47149,7 +48097,7 @@ const isSameTarget = target === pressTarget; pressTarget = null; if (button === 0 && isSameTarget) { - onRequestClose(); + closeModal().then(() => onRequestClose()); } } }; @@ -47158,15 +48106,18 @@ // eslint-disable-next-line jsx-a11y/no-static-element-interactions (0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { ref: (0,external_wp_compose_namespaceObject.useMergeRefs)([ref, forwardedRef]), - className: dist_clsx('components-modal__screen-overlay', overlayClassName), + className: dist_clsx('components-modal__screen-overlay', overlayClassname, overlayClassnameProp), onKeyDown: withIgnoreIMEEvents(handleEscapeKeyDown), ...(shouldCloseOnClickOutside ? overlayPressHandlers : {}), children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(style_provider, { document: document, children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { className: dist_clsx('components-modal__frame', sizeClass, className), - style: style, - ref: (0,external_wp_compose_namespaceObject.useMergeRefs)([constrainedTabbingRef, focusReturnRef, focusOnMount !== 'firstContentElement' ? focusOnMountRef : null]), + style: { + ...frameStyle, + ...style + }, + ref: (0,external_wp_compose_namespaceObject.useMergeRefs)([frameRef, constrainedTabbingRef, focusReturnRef, focusOnMount !== 'firstContentElement' ? focusOnMountRef : null]), role: role, "aria-label": contentLabel, "aria-labelledby": contentLabel ? undefined : headingId, @@ -47197,10 +48148,16 @@ className: "components-modal__header-heading", children: title })] - }), headerActions, isDismissible && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, { - onClick: onRequestClose, - icon: library_close, - label: closeButtonLabel || (0,external_wp_i18n_namespaceObject.__)('Close') + }), headerActions, isDismissible && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { + children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(spacer_component, { + marginBottom: 0, + marginLeft: 2 + }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, { + size: "compact", + onClick: event => closeModal().then(() => onRequestClose(event)), + icon: library_close, + label: closeButtonLabel || (0,external_wp_i18n_namespaceObject.__)('Close') + })] })] }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { ref: (0,external_wp_compose_namespaceObject.useMergeRefs)([childrenContainerRef, focusOnMount === 'firstContentElement' ? focusOnMountRef : null]), @@ -47210,8 +48167,8 @@ }) }) }); - return (0,external_wp_element_namespaceObject.createPortal)( /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ModalContext.Provider, { - value: nestedDismissers.current, + return (0,external_wp_element_namespaceObject.createPortal)(/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ModalContext.Provider, { + value: nestedDismissers, children: modal }), document.body); } @@ -47250,7 +48207,7 @@ const Modal = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedModal); /* harmony default export */ const modal = (Modal); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/confirm-dialog/styles.js +;// ./node_modules/@wordpress/components/build-module/confirm-dialog/styles.js 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)."; } /** * External dependencies @@ -47270,18 +48227,16 @@ styles: "&&{z-index:1000001;}" } : 0; -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/confirm-dialog/component.js -/** - * WordPress dependencies - */ - - - -/** - * Internal dependencies - */ - - +;// ./node_modules/@wordpress/components/build-module/confirm-dialog/component.js +/** + * WordPress dependencies + */ + + + +/** + * Internal dependencies + */ @@ -47438,4385 +48393,1723 @@ const ConfirmDialog = contextConnect(UnconnectedConfirmDialog, 'ConfirmDialog'); /* harmony default export */ const confirm_dialog_component = (ConfirmDialog); -// EXTERNAL MODULE: ./node_modules/prop-types/index.js -var prop_types = __webpack_require__(5826); -var prop_types_default = /*#__PURE__*/__webpack_require__.n(prop_types); -// EXTERNAL MODULE: ./node_modules/downshift/node_modules/react-is/index.js -var react_is = __webpack_require__(1915); -;// CONCATENATED MODULE: ./node_modules/compute-scroll-into-view/dist/index.mjs -function dist_t(t){return"object"==typeof t&&null!=t&&1===t.nodeType}function dist_e(t,e){return(!e||"hidden"!==t)&&"visible"!==t&&"clip"!==t}function dist_n(t,n){if(t.clientHeighte||o>t&&l=e&&d>=n?o-t-r:l>e&&dn?l-e+i:0}var compute_scroll_into_view_dist_i=function(e,i){var o=window,l=i.scrollMode,d=i.block,f=i.inline,h=i.boundary,u=i.skipOverflowHiddenElements,s="function"==typeof h?h:function(t){return t!==h};if(!dist_t(e))throw new TypeError("Invalid target");for(var a,c,g=document.scrollingElement||document.documentElement,p=[],m=e;dist_t(m)&&s(m);){if((m=null==(c=(a=m).parentElement)?a.getRootNode().host||null:c)===g){p.push(m);break}null!=m&&m===document.body&&dist_n(m)&&!dist_n(document.documentElement)||null!=m&&dist_n(m,u)&&p.push(m)}for(var w=o.visualViewport?o.visualViewport.width:innerWidth,v=o.visualViewport?o.visualViewport.height:innerHeight,W=window.scrollX||pageXOffset,H=window.scrollY||pageYOffset,b=e.getBoundingClientRect(),y=b.height,E=b.width,M=b.top,V=b.right,x=b.bottom,I=b.left,C="start"===d||"nearest"===d?M:"end"===d?x:M+y/2,R="center"===f?I+E/2:"end"===f?V:I,T=[],k=0;k=0&&I>=0&&x<=v&&V<=w&&M>=Y&&x<=S&&I>=j&&V<=L)return T;var N=getComputedStyle(B),q=parseInt(N.borderLeftWidth,10),z=parseInt(N.borderTopWidth,10),A=parseInt(N.borderRightWidth,10),F=parseInt(N.borderBottomWidth,10),G=0,J=0,K="offsetWidth"in B?B.offsetWidth-B.clientWidth-q-A:0,P="offsetHeight"in B?B.offsetHeight-B.clientHeight-z-F:0,Q="offsetWidth"in B?0===B.offsetWidth?0:X/B.offsetWidth:0,U="offsetHeight"in B?0===B.offsetHeight?0:O/B.offsetHeight:0;if(g===B)G="start"===d?C:"end"===d?C-v:"nearest"===d?dist_r(H,H+v,v,z,F,H+C,H+C+y,y):C-v/2,J="start"===f?R:"center"===f?R-w/2:"end"===f?R-w:dist_r(W,W+w,w,q,A,W+R,W+R+E,E),G=Math.max(0,G+H),J=Math.max(0,J+W);else{G="start"===d?C-Y-z:"end"===d?C-S+F+P:"nearest"===d?dist_r(Y,S,O,z,F+P,C,C+y,y):C-(Y+O/2)+P/2,J="start"===f?R-j-q:"center"===f?R-(j+X/2)+K/2:"end"===f?R-L+A+K:dist_r(j,L,X,q,A+K,R,R+E,E);var Z=B.scrollLeft,$=B.scrollTop;C+=$-(G=Math.max(0,Math.min($+G/U,B.scrollHeight-O/U+P))),R+=Z-(J=Math.max(0,Math.min(Z+J/Q,B.scrollWidth-X/Q+K)))}T.push({el:B,top:G,left:J})}return T}; -//# sourceMappingURL=index.mjs.map - -;// CONCATENATED MODULE: ./node_modules/downshift/dist/downshift.esm.js - - - - - - -let idCounter = 0; -/** - * Accepts a parameter and returns it if it's a function - * or a noop function if it's not. This allows us to - * accept a callback, but not worry about it if it's not - * passed. - * @param {Function} cb the callback - * @return {Function} a function - */ - -function cbToCb(cb) { - return typeof cb === 'function' ? cb : downshift_esm_noop; -} - -function downshift_esm_noop() {} -/** - * Scroll node into view if necessary - * @param {HTMLElement} node the element that should scroll into view - * @param {HTMLElement} menuNode the menu element of the component - */ - - -function scrollIntoView(node, menuNode) { - if (!node) { - return; - } - - const actions = compute_scroll_into_view_dist_i(node, { - boundary: menuNode, - block: 'nearest', - scrollMode: 'if-needed' - }); - actions.forEach(_ref => { - let { - el, - top, - left - } = _ref; - el.scrollTop = top; - el.scrollLeft = left; - }); -} -/** - * @param {HTMLElement} parent the parent node - * @param {HTMLElement} child the child node - * @param {Window} environment The window context where downshift renders. - * @return {Boolean} whether the parent is the child or the child is in the parent - */ - - -function isOrContainsNode(parent, child, environment) { - const result = parent === child || child instanceof environment.Node && parent.contains && parent.contains(child); - return result; -} -/** - * Simple debounce implementation. Will call the given - * function once after the time given has passed since - * it was last called. - * @param {Function} fn the function to call after the time - * @param {Number} time the time to wait - * @return {Function} the debounced function - */ - - -function debounce(fn, time) { - let timeoutId; - - function cancel() { - if (timeoutId) { - clearTimeout(timeoutId); - } - } - - function wrapper() { - for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) { - args[_key] = arguments[_key]; - } - - cancel(); - timeoutId = setTimeout(() => { - timeoutId = null; - fn(...args); - }, time); - } - - wrapper.cancel = cancel; - return wrapper; -} -/** - * This is intended to be used to compose event handlers. - * They are executed in order until one of them sets - * `event.preventDownshiftDefault = true`. - * @param {...Function} fns the event handler functions - * @return {Function} the event handler to add to an element - */ - - -function callAllEventHandlers() { - for (var _len2 = arguments.length, fns = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) { - fns[_key2] = arguments[_key2]; - } - - return function (event) { - for (var _len3 = arguments.length, args = new Array(_len3 > 1 ? _len3 - 1 : 0), _key3 = 1; _key3 < _len3; _key3++) { - args[_key3 - 1] = arguments[_key3]; - } - - return fns.some(fn => { - if (fn) { - fn(event, ...args); - } - - return event.preventDownshiftDefault || event.hasOwnProperty('nativeEvent') && event.nativeEvent.preventDownshiftDefault; - }); - }; -} - -function handleRefs() { - for (var _len4 = arguments.length, refs = new Array(_len4), _key4 = 0; _key4 < _len4; _key4++) { - refs[_key4] = arguments[_key4]; - } - - return node => { - refs.forEach(ref => { - if (typeof ref === 'function') { - ref(node); - } else if (ref) { - ref.current = node; - } - }); - }; -} -/** - * This generates a unique ID for an instance of Downshift - * @return {String} the unique ID - */ - - -function generateId() { - return String(idCounter++); -} -/** - * Resets idCounter to 0. Used for SSR. - */ - - -function resetIdCounter() { - idCounter = 0; -} -/** - * Default implementation for status message. Only added when menu is open. - * Will specify if there are results in the list, and if so, how many, - * and what keys are relevant. - * - * @param {Object} param the downshift state and other relevant properties - * @return {String} the a11y status message - */ - - -function getA11yStatusMessage$1(_ref2) { - let { - isOpen, - resultCount, - previousResultCount - } = _ref2; - - if (!isOpen) { - return ''; - } - - if (!resultCount) { - return 'No results are available.'; - } - - if (resultCount !== previousResultCount) { - return `${resultCount} result${resultCount === 1 ? ' is' : 's are'} available, use up and down arrow keys to navigate. Press Enter key to select.`; - } - - return ''; -} -/** - * Takes an argument and if it's an array, returns the first item in the array - * otherwise returns the argument - * @param {*} arg the maybe-array - * @param {*} defaultValue the value if arg is falsey not defined - * @return {*} the arg or it's first item - */ - - -function unwrapArray(arg, defaultValue) { - arg = Array.isArray(arg) ? - /* istanbul ignore next (preact) */ - arg[0] : arg; - - if (!arg && defaultValue) { - return defaultValue; - } else { - return arg; - } -} -/** - * @param {Object} element (P)react element - * @return {Boolean} whether it's a DOM element - */ - - -function isDOMElement(element) { - - - return typeof element.type === 'string'; -} -/** - * @param {Object} element (P)react element - * @return {Object} the props - */ - - -function getElementProps(element) { - - return element.props; -} -/** - * Throws a helpful error message for required properties. Useful - * to be used as a default in destructuring or object params. - * @param {String} fnName the function name - * @param {String} propName the prop name - */ - - -function requiredProp(fnName, propName) { - // eslint-disable-next-line no-console - console.error(`The property "${propName}" is required in "${fnName}"`); -} - -const stateKeys = (/* unused pure expression or super */ null && (['highlightedIndex', 'inputValue', 'isOpen', 'selectedItem', 'type'])); -/** - * @param {Object} state the state object - * @return {Object} state that is relevant to downshift - */ - -function pickState(state) { - if (state === void 0) { - state = {}; - } - - const result = {}; - stateKeys.forEach(k => { - if (state.hasOwnProperty(k)) { - result[k] = state[k]; - } - }); - return result; -} -/** - * This will perform a shallow merge of the given state object - * with the state coming from props - * (for the controlled component scenario) - * This is used in state updater functions so they're referencing - * the right state regardless of where it comes from. - * - * @param {Object} state The state of the component/hook. - * @param {Object} props The props that may contain controlled values. - * @returns {Object} The merged controlled state. - */ - - -function getState(state, props) { - return Object.keys(state).reduce((prevState, key) => { - prevState[key] = isControlledProp(props, key) ? props[key] : state[key]; - return prevState; - }, {}); -} -/** - * This determines whether a prop is a "controlled prop" meaning it is - * state which is controlled by the outside of this component rather - * than within this component. - * - * @param {Object} props The props that may contain controlled values. - * @param {String} key the key to check - * @return {Boolean} whether it is a controlled controlled prop - */ - - -function isControlledProp(props, key) { - return props[key] !== undefined; -} -/** - * Normalizes the 'key' property of a KeyboardEvent in IE/Edge - * @param {Object} event a keyboardEvent object - * @return {String} keyboard key - */ - - -function normalizeArrowKey(event) { - const { - key, - keyCode - } = event; - /* istanbul ignore next (ie) */ - - if (keyCode >= 37 && keyCode <= 40 && key.indexOf('Arrow') !== 0) { - return `Arrow${key}`; - } - - return key; -} -/** - * Simple check if the value passed is object literal - * @param {*} obj any things - * @return {Boolean} whether it's object literal - */ - - -function downshift_esm_isPlainObject(obj) { - return Object.prototype.toString.call(obj) === '[object Object]'; -} -/** - * Returns the new index in the list, in a circular way. If next value is out of bonds from the total, - * it will wrap to either 0 or itemCount - 1. - * - * @param {number} moveAmount Number of positions to move. Negative to move backwards, positive forwards. - * @param {number} baseIndex The initial position to move from. - * @param {number} itemCount The total number of items. - * @param {Function} getItemNodeFromIndex Used to check if item is disabled. - * @param {boolean} circular Specify if navigation is circular. Default is true. - * @returns {number} The new index after the move. - */ - - -function getNextWrappingIndex(moveAmount, baseIndex, itemCount, getItemNodeFromIndex, circular) { - if (circular === void 0) { - circular = true; - } - - if (itemCount === 0) { - return -1; - } - - const itemsLastIndex = itemCount - 1; - - if (typeof baseIndex !== 'number' || baseIndex < 0 || baseIndex >= itemCount) { - baseIndex = moveAmount > 0 ? -1 : itemsLastIndex + 1; - } - - let newIndex = baseIndex + moveAmount; - - if (newIndex < 0) { - newIndex = circular ? itemsLastIndex : 0; - } else if (newIndex > itemsLastIndex) { - newIndex = circular ? 0 : itemsLastIndex; - } - - const nonDisabledNewIndex = getNextNonDisabledIndex(moveAmount, newIndex, itemCount, getItemNodeFromIndex, circular); - - if (nonDisabledNewIndex === -1) { - return baseIndex >= itemCount ? -1 : baseIndex; - } - - return nonDisabledNewIndex; -} -/** - * Returns the next index in the list of an item that is not disabled. - * - * @param {number} moveAmount Number of positions to move. Negative to move backwards, positive forwards. - * @param {number} baseIndex The initial position to move from. - * @param {number} itemCount The total number of items. - * @param {Function} getItemNodeFromIndex Used to check if item is disabled. - * @param {boolean} circular Specify if navigation is circular. Default is true. - * @returns {number} The new index. Returns baseIndex if item is not disabled. Returns next non-disabled item otherwise. If no non-disabled found it will return -1. - */ - - -function getNextNonDisabledIndex(moveAmount, baseIndex, itemCount, getItemNodeFromIndex, circular) { - const currentElementNode = getItemNodeFromIndex(baseIndex); - - if (!currentElementNode || !currentElementNode.hasAttribute('disabled')) { - return baseIndex; - } - - if (moveAmount > 0) { - for (let index = baseIndex + 1; index < itemCount; index++) { - if (!getItemNodeFromIndex(index).hasAttribute('disabled')) { - return index; - } - } - } else { - for (let index = baseIndex - 1; index >= 0; index--) { - if (!getItemNodeFromIndex(index).hasAttribute('disabled')) { - return index; - } - } - } - - if (circular) { - return moveAmount > 0 ? getNextNonDisabledIndex(1, 0, itemCount, getItemNodeFromIndex, false) : getNextNonDisabledIndex(-1, itemCount - 1, itemCount, getItemNodeFromIndex, false); - } - - return -1; -} -/** - * Checks if event target is within the downshift elements. - * - * @param {EventTarget} target Target to check. - * @param {HTMLElement[]} downshiftElements The elements that form downshift (list, toggle button etc). - * @param {Window} environment The window context where downshift renders. - * @param {boolean} checkActiveElement Whether to also check activeElement. - * - * @returns {boolean} Whether or not the target is within downshift elements. - */ - - -function targetWithinDownshift(target, downshiftElements, environment, checkActiveElement) { - if (checkActiveElement === void 0) { - checkActiveElement = true; - } - - return downshiftElements.some(contextNode => contextNode && (isOrContainsNode(contextNode, target, environment) || checkActiveElement && isOrContainsNode(contextNode, environment.document.activeElement, environment))); -} // eslint-disable-next-line import/no-mutable-exports - - -let validateControlledUnchanged = (/* unused pure expression or super */ null && (downshift_esm_noop)); -/* istanbul ignore next */ - -if (false) {} - -const cleanupStatus = debounce(documentProp => { - getStatusDiv(documentProp).textContent = ''; -}, 500); -/** - * @param {String} status the status message - * @param {Object} documentProp document passed by the user. - */ - -function setStatus(status, documentProp) { - const div = getStatusDiv(documentProp); - - if (!status) { - return; - } - - div.textContent = status; - cleanupStatus(documentProp); -} -/** - * Get the status node or create it if it does not already exist. - * @param {Object} documentProp document passed by the user. - * @return {HTMLElement} the status node. - */ - - -function getStatusDiv(documentProp) { - if (documentProp === void 0) { - documentProp = document; - } - - let statusDiv = documentProp.getElementById('a11y-status-message'); - - if (statusDiv) { - return statusDiv; - } - - statusDiv = documentProp.createElement('div'); - statusDiv.setAttribute('id', 'a11y-status-message'); - statusDiv.setAttribute('role', 'status'); - statusDiv.setAttribute('aria-live', 'polite'); - statusDiv.setAttribute('aria-relevant', 'additions text'); - Object.assign(statusDiv.style, { - border: '0', - clip: 'rect(0 0 0 0)', - height: '1px', - margin: '-1px', - overflow: 'hidden', - padding: '0', - position: 'absolute', - width: '1px' - }); - documentProp.body.appendChild(statusDiv); - return statusDiv; -} - -const unknown = false ? 0 : 0; -const mouseUp = false ? 0 : 1; -const itemMouseEnter = false ? 0 : 2; -const keyDownArrowUp = false ? 0 : 3; -const keyDownArrowDown = false ? 0 : 4; -const keyDownEscape = false ? 0 : 5; -const keyDownEnter = false ? 0 : 6; -const keyDownHome = false ? 0 : 7; -const keyDownEnd = false ? 0 : 8; -const clickItem = false ? 0 : 9; -const blurInput = false ? 0 : 10; -const changeInput = false ? 0 : 11; -const keyDownSpaceButton = false ? 0 : 12; -const clickButton = false ? 0 : 13; -const blurButton = false ? 0 : 14; -const controlledPropUpdatedSelectedItem = false ? 0 : 15; -const touchEnd = false ? 0 : 16; - -var stateChangeTypes$3 = /*#__PURE__*/Object.freeze({ - __proto__: null, - unknown: unknown, - mouseUp: mouseUp, - itemMouseEnter: itemMouseEnter, - keyDownArrowUp: keyDownArrowUp, - keyDownArrowDown: keyDownArrowDown, - keyDownEscape: keyDownEscape, - keyDownEnter: keyDownEnter, - keyDownHome: keyDownHome, - keyDownEnd: keyDownEnd, - clickItem: clickItem, - blurInput: blurInput, - changeInput: changeInput, - keyDownSpaceButton: keyDownSpaceButton, - clickButton: clickButton, - blurButton: blurButton, - controlledPropUpdatedSelectedItem: controlledPropUpdatedSelectedItem, - touchEnd: touchEnd -}); - -/* eslint camelcase:0 */ - -const Downshift = /*#__PURE__*/(/* unused pure expression or super */ null && ((() => { - class Downshift extends Component { - constructor(_props) { - var _this; - - super(_props); - _this = this; - this.id = this.props.id || `downshift-${generateId()}`; - this.menuId = this.props.menuId || `${this.id}-menu`; - this.labelId = this.props.labelId || `${this.id}-label`; - this.inputId = this.props.inputId || `${this.id}-input`; - - this.getItemId = this.props.getItemId || (index => `${this.id}-item-${index}`); - - this.input = null; - this.items = []; - this.itemCount = null; - this.previousResultCount = 0; - this.timeoutIds = []; - - this.internalSetTimeout = (fn, time) => { - const id = setTimeout(() => { - this.timeoutIds = this.timeoutIds.filter(i => i !== id); - fn(); - }, time); - this.timeoutIds.push(id); - }; - - this.setItemCount = count => { - this.itemCount = count; - }; - - this.unsetItemCount = () => { - this.itemCount = null; - }; - - this.setHighlightedIndex = function (highlightedIndex, otherStateToSet) { - if (highlightedIndex === void 0) { - highlightedIndex = _this.props.defaultHighlightedIndex; - } - - if (otherStateToSet === void 0) { - otherStateToSet = {}; - } - - otherStateToSet = pickState(otherStateToSet); - - _this.internalSetState({ - highlightedIndex, - ...otherStateToSet - }); - }; - - this.clearSelection = cb => { - this.internalSetState({ - selectedItem: null, - inputValue: '', - highlightedIndex: this.props.defaultHighlightedIndex, - isOpen: this.props.defaultIsOpen - }, cb); - }; - - this.selectItem = (item, otherStateToSet, cb) => { - otherStateToSet = pickState(otherStateToSet); - this.internalSetState({ - isOpen: this.props.defaultIsOpen, - highlightedIndex: this.props.defaultHighlightedIndex, - selectedItem: item, - inputValue: this.props.itemToString(item), - ...otherStateToSet - }, cb); - }; - - this.selectItemAtIndex = (itemIndex, otherStateToSet, cb) => { - const item = this.items[itemIndex]; - - if (item == null) { - return; - } - - this.selectItem(item, otherStateToSet, cb); - }; - - this.selectHighlightedItem = (otherStateToSet, cb) => { - return this.selectItemAtIndex(this.getState().highlightedIndex, otherStateToSet, cb); - }; - - this.internalSetState = (stateToSet, cb) => { - let isItemSelected, onChangeArg; - const onStateChangeArg = {}; - const isStateToSetFunction = typeof stateToSet === 'function'; // we want to call `onInputValueChange` before the `setState` call - // so someone controlling the `inputValue` state gets notified of - // the input change as soon as possible. This avoids issues with - // preserving the cursor position. - // See https://github.com/downshift-js/downshift/issues/217 for more info. - - if (!isStateToSetFunction && stateToSet.hasOwnProperty('inputValue')) { - this.props.onInputValueChange(stateToSet.inputValue, { ...this.getStateAndHelpers(), - ...stateToSet - }); - } - - return this.setState(state => { - state = this.getState(state); - let newStateToSet = isStateToSetFunction ? stateToSet(state) : stateToSet; // Your own function that could modify the state that will be set. - - newStateToSet = this.props.stateReducer(state, newStateToSet); // checks if an item is selected, regardless of if it's different from - // what was selected before - // used to determine if onSelect and onChange callbacks should be called - - isItemSelected = newStateToSet.hasOwnProperty('selectedItem'); // this keeps track of the object we want to call with setState - - const nextState = {}; // this is just used to tell whether the state changed - // and we're trying to update that state. OR if the selection has changed and we're - // trying to update the selection - - if (isItemSelected && newStateToSet.selectedItem !== state.selectedItem) { - onChangeArg = newStateToSet.selectedItem; - } - - newStateToSet.type = newStateToSet.type || unknown; - Object.keys(newStateToSet).forEach(key => { - // onStateChangeArg should only have the state that is - // actually changing - if (state[key] !== newStateToSet[key]) { - onStateChangeArg[key] = newStateToSet[key]; - } // the type is useful for the onStateChangeArg - // but we don't actually want to set it in internal state. - // this is an undocumented feature for now... Not all internalSetState - // calls support it and I'm not certain we want them to yet. - // But it enables users controlling the isOpen state to know when - // the isOpen state changes due to mouseup events which is quite handy. - - - if (key === 'type') { - return; - } - - newStateToSet[key]; // if it's coming from props, then we don't care to set it internally - - if (!isControlledProp(this.props, key)) { - nextState[key] = newStateToSet[key]; - } - }); // if stateToSet is a function, then we weren't able to call onInputValueChange - // earlier, so we'll call it now that we know what the inputValue state will be. - - if (isStateToSetFunction && newStateToSet.hasOwnProperty('inputValue')) { - this.props.onInputValueChange(newStateToSet.inputValue, { ...this.getStateAndHelpers(), - ...newStateToSet - }); - } - - return nextState; - }, () => { - // call the provided callback if it's a function - cbToCb(cb)(); // only call the onStateChange and onChange callbacks if - // we have relevant information to pass them. - - const hasMoreStateThanType = Object.keys(onStateChangeArg).length > 1; - - if (hasMoreStateThanType) { - this.props.onStateChange(onStateChangeArg, this.getStateAndHelpers()); - } - - if (isItemSelected) { - this.props.onSelect(stateToSet.selectedItem, this.getStateAndHelpers()); - } - - if (onChangeArg !== undefined) { - this.props.onChange(onChangeArg, this.getStateAndHelpers()); - } // this is currently undocumented and therefore subject to change - // We'll try to not break it, but just be warned. - - - this.props.onUserAction(onStateChangeArg, this.getStateAndHelpers()); - }); - }; - - this.rootRef = node => this._rootNode = node; - - this.getRootProps = function (_temp, _temp2) { - let { - refKey = 'ref', - ref, - ...rest - } = _temp === void 0 ? {} : _temp; - let { - suppressRefError = false - } = _temp2 === void 0 ? {} : _temp2; - // this is used in the render to know whether the user has called getRootProps. - // It uses that to know whether to apply the props automatically - _this.getRootProps.called = true; - _this.getRootProps.refKey = refKey; - _this.getRootProps.suppressRefError = suppressRefError; - - const { - isOpen - } = _this.getState(); - - return { - [refKey]: handleRefs(ref, _this.rootRef), - role: 'combobox', - 'aria-expanded': isOpen, - 'aria-haspopup': 'listbox', - 'aria-owns': isOpen ? _this.menuId : null, - 'aria-labelledby': _this.labelId, - ...rest - }; - }; - - this.keyDownHandlers = { - ArrowDown(event) { - event.preventDefault(); - - if (this.getState().isOpen) { - const amount = event.shiftKey ? 5 : 1; - this.moveHighlightedIndex(amount, { - type: keyDownArrowDown - }); - } else { - this.internalSetState({ - isOpen: true, - type: keyDownArrowDown - }, () => { - const itemCount = this.getItemCount(); - - if (itemCount > 0) { - const { - highlightedIndex - } = this.getState(); - const nextHighlightedIndex = getNextWrappingIndex(1, highlightedIndex, itemCount, index => this.getItemNodeFromIndex(index)); - this.setHighlightedIndex(nextHighlightedIndex, { - type: keyDownArrowDown - }); - } - }); - } - }, - - ArrowUp(event) { - event.preventDefault(); - - if (this.getState().isOpen) { - const amount = event.shiftKey ? -5 : -1; - this.moveHighlightedIndex(amount, { - type: keyDownArrowUp - }); - } else { - this.internalSetState({ - isOpen: true, - type: keyDownArrowUp - }, () => { - const itemCount = this.getItemCount(); - - if (itemCount > 0) { - const { - highlightedIndex - } = this.getState(); - const nextHighlightedIndex = getNextWrappingIndex(-1, highlightedIndex, itemCount, index => this.getItemNodeFromIndex(index)); - this.setHighlightedIndex(nextHighlightedIndex, { - type: keyDownArrowUp - }); - } - }); - } - }, - - Enter(event) { - if (event.which === 229) { - return; - } - - const { - isOpen, - highlightedIndex - } = this.getState(); - - if (isOpen && highlightedIndex != null) { - event.preventDefault(); - const item = this.items[highlightedIndex]; - const itemNode = this.getItemNodeFromIndex(highlightedIndex); - - if (item == null || itemNode && itemNode.hasAttribute('disabled')) { - return; - } - - this.selectHighlightedItem({ - type: keyDownEnter - }); - } - }, - - Escape(event) { - event.preventDefault(); - this.reset({ - type: keyDownEscape, - ...(!this.state.isOpen && { - selectedItem: null, - inputValue: '' - }) - }); - } - - }; - this.buttonKeyDownHandlers = { ...this.keyDownHandlers, - - ' '(event) { - event.preventDefault(); - this.toggleMenu({ - type: keyDownSpaceButton - }); - } - - }; - this.inputKeyDownHandlers = { ...this.keyDownHandlers, - - Home(event) { - const { - isOpen - } = this.getState(); - - if (!isOpen) { - return; - } - - event.preventDefault(); - const itemCount = this.getItemCount(); - - if (itemCount <= 0 || !isOpen) { - return; - } // get next non-disabled starting downwards from 0 if that's disabled. - - - const newHighlightedIndex = getNextNonDisabledIndex(1, 0, itemCount, index => this.getItemNodeFromIndex(index), false); - this.setHighlightedIndex(newHighlightedIndex, { - type: keyDownHome - }); - }, - - End(event) { - const { - isOpen - } = this.getState(); - - if (!isOpen) { - return; - } - - event.preventDefault(); - const itemCount = this.getItemCount(); - - if (itemCount <= 0 || !isOpen) { - return; - } // get next non-disabled starting upwards from last index if that's disabled. - - - const newHighlightedIndex = getNextNonDisabledIndex(-1, itemCount - 1, itemCount, index => this.getItemNodeFromIndex(index), false); - this.setHighlightedIndex(newHighlightedIndex, { - type: keyDownEnd - }); - } - - }; - - this.getToggleButtonProps = function (_temp3) { - let { - onClick, - onPress, - onKeyDown, - onKeyUp, - onBlur, - ...rest - } = _temp3 === void 0 ? {} : _temp3; - - const { - isOpen - } = _this.getState(); - - const enabledEventHandlers = { - onClick: callAllEventHandlers(onClick, _this.buttonHandleClick), - onKeyDown: callAllEventHandlers(onKeyDown, _this.buttonHandleKeyDown), - onKeyUp: callAllEventHandlers(onKeyUp, _this.buttonHandleKeyUp), - onBlur: callAllEventHandlers(onBlur, _this.buttonHandleBlur) - }; - const eventHandlers = rest.disabled ? {} : enabledEventHandlers; - return { - type: 'button', - role: 'button', - 'aria-label': isOpen ? 'close menu' : 'open menu', - 'aria-haspopup': true, - 'data-toggle': true, - ...eventHandlers, - ...rest - }; - }; - - this.buttonHandleKeyUp = event => { - // Prevent click event from emitting in Firefox - event.preventDefault(); - }; - - this.buttonHandleKeyDown = event => { - const key = normalizeArrowKey(event); - - if (this.buttonKeyDownHandlers[key]) { - this.buttonKeyDownHandlers[key].call(this, event); - } - }; - - this.buttonHandleClick = event => { - event.preventDefault(); // handle odd case for Safari and Firefox which - // don't give the button the focus properly. - - /* istanbul ignore if (can't reasonably test this) */ - - if (this.props.environment.document.activeElement === this.props.environment.document.body) { - event.target.focus(); - } // to simplify testing components that use downshift, we'll not wrap this in a setTimeout - // if the NODE_ENV is test. With the proper build system, this should be dead code eliminated - // when building for production and should therefore have no impact on production code. - - - if (false) {} else { - // Ensure that toggle of menu occurs after the potential blur event in iOS - this.internalSetTimeout(() => this.toggleMenu({ - type: clickButton - })); - } - }; - - this.buttonHandleBlur = event => { - const blurTarget = event.target; // Save blur target for comparison with activeElement later - // Need setTimeout, so that when the user presses Tab, the activeElement is the next focused element, not body element - - this.internalSetTimeout(() => { - if (!this.isMouseDown && (this.props.environment.document.activeElement == null || this.props.environment.document.activeElement.id !== this.inputId) && this.props.environment.document.activeElement !== blurTarget // Do nothing if we refocus the same element again (to solve issue in Safari on iOS) - ) { - this.reset({ - type: blurButton - }); +;// ./node_modules/@ariakit/react-core/esm/__chunks/VEVQD5MH.js +"use client"; + + + + +// src/combobox/combobox-context.tsx + +var ComboboxListRoleContext = (0,external_React_.createContext)( + void 0 +); +var VEVQD5MH_ctx = createStoreContext( + [PopoverContextProvider, CompositeContextProvider], + [PopoverScopedContextProvider, CompositeScopedContextProvider] +); +var useComboboxContext = VEVQD5MH_ctx.useContext; +var useComboboxScopedContext = VEVQD5MH_ctx.useScopedContext; +var useComboboxProviderContext = VEVQD5MH_ctx.useProviderContext; +var ComboboxContextProvider = VEVQD5MH_ctx.ContextProvider; +var ComboboxScopedContextProvider = VEVQD5MH_ctx.ScopedContextProvider; +var ComboboxItemValueContext = (0,external_React_.createContext)( + void 0 +); +var ComboboxItemCheckedContext = (0,external_React_.createContext)(false); + + + +;// ./node_modules/@ariakit/core/esm/select/select-store.js +"use client"; + + + + + + + + + + + +// src/select/select-store.ts +function createSelectStore(_a = {}) { + var _b = _a, { + combobox + } = _b, props = _3YLGPPWQ_objRest(_b, [ + "combobox" + ]); + const store = mergeStore( + props.store, + omit2(combobox, [ + "value", + "items", + "renderedItems", + "baseElement", + "arrowElement", + "anchorElement", + "contentElement", + "popoverElement", + "disclosureElement" + ]) + ); + throwOnConflictingProps(props, store); + const syncState = store.getState(); + const composite = createCompositeStore(_chunks_3YLGPPWQ_spreadProps(_chunks_3YLGPPWQ_spreadValues({}, props), { + store, + virtualFocus: defaultValue( + props.virtualFocus, + syncState.virtualFocus, + true + ), + includesBaseElement: defaultValue( + props.includesBaseElement, + syncState.includesBaseElement, + false + ), + activeId: defaultValue( + props.activeId, + syncState.activeId, + props.defaultActiveId, + null + ), + orientation: defaultValue( + props.orientation, + syncState.orientation, + "vertical" + ) + })); + const popover = createPopoverStore(_chunks_3YLGPPWQ_spreadProps(_chunks_3YLGPPWQ_spreadValues({}, props), { + store, + placement: defaultValue( + props.placement, + syncState.placement, + "bottom-start" + ) + })); + const initialValue = new String(""); + const initialState = _chunks_3YLGPPWQ_spreadProps(_chunks_3YLGPPWQ_spreadValues(_chunks_3YLGPPWQ_spreadValues({}, composite.getState()), popover.getState()), { + value: defaultValue( + props.value, + syncState.value, + props.defaultValue, + initialValue + ), + setValueOnMove: defaultValue( + props.setValueOnMove, + syncState.setValueOnMove, + false + ), + labelElement: defaultValue(syncState.labelElement, null), + selectElement: defaultValue(syncState.selectElement, null), + listElement: defaultValue(syncState.listElement, null) + }); + const select = createStore(initialState, composite, popover, store); + setup( + select, + () => sync(select, ["value", "items"], (state) => { + if (state.value !== initialValue) return; + if (!state.items.length) return; + const item = state.items.find( + (item2) => !item2.disabled && item2.value != null + ); + if ((item == null ? void 0 : item.value) == null) return; + select.setState("value", item.value); + }) + ); + setup( + select, + () => sync(select, ["mounted"], (state) => { + if (state.mounted) return; + select.setState("activeId", initialState.activeId); + }) + ); + setup( + select, + () => sync(select, ["mounted", "items", "value"], (state) => { + if (combobox) return; + if (state.mounted) return; + const values = toArray(state.value); + const lastValue = values[values.length - 1]; + if (lastValue == null) return; + const item = state.items.find( + (item2) => !item2.disabled && item2.value === lastValue + ); + if (!item) return; + select.setState("activeId", item.id); + }) + ); + setup( + select, + () => batch(select, ["setValueOnMove", "moves"], (state) => { + const { mounted, value, activeId } = select.getState(); + if (!state.setValueOnMove && mounted) return; + if (Array.isArray(value)) return; + if (!state.moves) return; + if (!activeId) return; + const item = composite.item(activeId); + if (!item || item.disabled || item.value == null) return; + select.setState("value", item.value); + }) + ); + return _chunks_3YLGPPWQ_spreadProps(_chunks_3YLGPPWQ_spreadValues(_chunks_3YLGPPWQ_spreadValues(_chunks_3YLGPPWQ_spreadValues({}, composite), popover), select), { + combobox, + setValue: (value) => select.setState("value", value), + setLabelElement: (element) => select.setState("labelElement", element), + setSelectElement: (element) => select.setState("selectElement", element), + setListElement: (element) => select.setState("listElement", element) + }); +} + + +;// ./node_modules/@ariakit/react-core/esm/__chunks/S5WQ44SQ.js +"use client"; + + + + + + + +// src/select/select-store.ts + +function useSelectStoreOptions(props) { + const combobox = useComboboxProviderContext(); + props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, props), { + combobox: props.combobox !== void 0 ? props.combobox : combobox + }); + return useCompositeStoreOptions(props); +} +function useSelectStoreProps(store, update, props) { + useUpdateEffect(update, [props.combobox]); + useStoreProps(store, props, "value", "setValue"); + useStoreProps(store, props, "setValueOnMove"); + return Object.assign( + usePopoverStoreProps( + useCompositeStoreProps(store, update, props), + update, + props + ), + { combobox: props.combobox } + ); +} +function useSelectStore(props = {}) { + props = useSelectStoreOptions(props); + const [store, update] = YV4JVR4I_useStore(createSelectStore, props); + return useSelectStoreProps(store, update, props); +} + + + +;// ./node_modules/@ariakit/react-core/esm/__chunks/KPEX55MY.js +"use client"; + + + + +// src/select/select-context.tsx + +var KPEX55MY_ctx = createStoreContext( + [PopoverContextProvider, CompositeContextProvider], + [PopoverScopedContextProvider, CompositeScopedContextProvider] +); +var useSelectContext = KPEX55MY_ctx.useContext; +var useSelectScopedContext = KPEX55MY_ctx.useScopedContext; +var useSelectProviderContext = KPEX55MY_ctx.useProviderContext; +var SelectContextProvider = KPEX55MY_ctx.ContextProvider; +var SelectScopedContextProvider = KPEX55MY_ctx.ScopedContextProvider; +var SelectItemCheckedContext = (0,external_React_.createContext)(false); +var SelectHeadingContext = (0,external_React_.createContext)(null); + + + +;// ./node_modules/@ariakit/react-core/esm/select/select-label.js +"use client"; + + + + + + + + + + + +// src/select/select-label.tsx + +var select_label_TagName = "div"; +var useSelectLabel = createHook( + function useSelectLabel2(_a) { + var _b = _a, { store } = _b, props = __objRest(_b, ["store"]); + const context = useSelectProviderContext(); + store = store || context; + invariant( + store, + false && 0 + ); + const id = useId(props.id); + const onClickProp = props.onClick; + const onClick = useEvent((event) => { + onClickProp == null ? void 0 : onClickProp(event); + if (event.defaultPrevented) return; + queueMicrotask(() => { + const select = store == null ? void 0 : store.getState().selectElement; + select == null ? void 0 : select.focus(); + }); + }); + props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({ + id + }, props), { + ref: useMergeRefs(store.setLabelElement, props.ref), + onClick, + style: _3YLGPPWQ_spreadValues({ + cursor: "default" + }, props.style) + }); + return removeUndefinedValues(props); + } +); +var SelectLabel = memo2( + forwardRef2(function SelectLabel2(props) { + const htmlProps = useSelectLabel(props); + return LMDWO4NN_createElement(select_label_TagName, htmlProps); + }) +); + + +;// ./node_modules/@ariakit/react-core/esm/__chunks/X5NMLKT6.js +"use client"; + + + + + +// src/button/button.tsx + + +var X5NMLKT6_TagName = "button"; +var useButton = createHook( + function useButton2(props) { + const ref = (0,external_React_.useRef)(null); + const tagName = useTagName(ref, X5NMLKT6_TagName); + const [isNativeButton, setIsNativeButton] = (0,external_React_.useState)( + () => !!tagName && isButton({ tagName, type: props.type }) + ); + (0,external_React_.useEffect)(() => { + if (!ref.current) return; + setIsNativeButton(isButton(ref.current)); + }, []); + props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({ + role: !isNativeButton && tagName !== "a" ? "button" : void 0 + }, props), { + ref: useMergeRefs(ref, props.ref) + }); + props = useCommand(props); + return props; + } +); +var X5NMLKT6_Button = forwardRef2(function Button2(props) { + const htmlProps = useButton(props); + return LMDWO4NN_createElement(X5NMLKT6_TagName, htmlProps); +}); + + + +;// ./node_modules/@ariakit/react-core/esm/__chunks/P4IRICAX.js +"use client"; + + + + + + +// src/disclosure/disclosure.tsx + + +var P4IRICAX_TagName = "button"; +var P4IRICAX_symbol = Symbol("disclosure"); +var useDisclosure = createHook( + function useDisclosure2(_a) { + var _b = _a, { store, toggleOnClick = true } = _b, props = __objRest(_b, ["store", "toggleOnClick"]); + const context = useDisclosureProviderContext(); + store = store || context; + invariant( + store, + false && 0 + ); + const ref = (0,external_React_.useRef)(null); + const [expanded, setExpanded] = (0,external_React_.useState)(false); + const disclosureElement = store.useState("disclosureElement"); + const open = store.useState("open"); + (0,external_React_.useEffect)(() => { + let isCurrentDisclosure = disclosureElement === ref.current; + if (!(disclosureElement == null ? void 0 : disclosureElement.isConnected)) { + store == null ? void 0 : store.setDisclosureElement(ref.current); + isCurrentDisclosure = true; + } + setExpanded(open && isCurrentDisclosure); + }, [disclosureElement, store, open]); + const onClickProp = props.onClick; + const toggleOnClickProp = useBooleanEvent(toggleOnClick); + const [isDuplicate, metadataProps] = useMetadataProps(props, P4IRICAX_symbol, true); + const onClick = useEvent((event) => { + onClickProp == null ? void 0 : onClickProp(event); + if (event.defaultPrevented) return; + if (isDuplicate) return; + if (!toggleOnClickProp(event)) return; + store == null ? void 0 : store.setDisclosureElement(event.currentTarget); + store == null ? void 0 : store.toggle(); + }); + const contentElement = store.useState("contentElement"); + props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues(_3YLGPPWQ_spreadValues({ + "aria-expanded": expanded, + "aria-controls": contentElement == null ? void 0 : contentElement.id + }, metadataProps), props), { + ref: useMergeRefs(ref, props.ref), + onClick + }); + props = useButton(props); + return props; + } +); +var Disclosure = forwardRef2(function Disclosure2(props) { + const htmlProps = useDisclosure(props); + return LMDWO4NN_createElement(P4IRICAX_TagName, htmlProps); +}); + + + +;// ./node_modules/@ariakit/react-core/esm/__chunks/AXB53BZF.js +"use client"; + + + + + +// src/dialog/dialog-disclosure.tsx + + +var AXB53BZF_TagName = "button"; +var useDialogDisclosure = createHook( + function useDialogDisclosure2(_a) { + var _b = _a, { store } = _b, props = __objRest(_b, ["store"]); + const context = useDialogProviderContext(); + store = store || context; + invariant( + store, + false && 0 + ); + const contentElement = store.useState("contentElement"); + props = _3YLGPPWQ_spreadValues({ + "aria-haspopup": getPopupRole(contentElement, "dialog") + }, props); + props = useDisclosure(_3YLGPPWQ_spreadValues({ store }, props)); + return props; + } +); +var DialogDisclosure = forwardRef2(function DialogDisclosure2(props) { + const htmlProps = useDialogDisclosure(props); + return LMDWO4NN_createElement(AXB53BZF_TagName, htmlProps); +}); + + + +;// ./node_modules/@ariakit/react-core/esm/__chunks/OMU7RWRV.js +"use client"; + + + + + +// src/popover/popover-anchor.tsx +var OMU7RWRV_TagName = "div"; +var usePopoverAnchor = createHook( + function usePopoverAnchor2(_a) { + var _b = _a, { store } = _b, props = __objRest(_b, ["store"]); + const context = usePopoverProviderContext(); + store = store || context; + props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, props), { + ref: useMergeRefs(store == null ? void 0 : store.setAnchorElement, props.ref) + }); + return props; + } +); +var PopoverAnchor = forwardRef2(function PopoverAnchor2(props) { + const htmlProps = usePopoverAnchor(props); + return LMDWO4NN_createElement(OMU7RWRV_TagName, htmlProps); +}); + + + +;// ./node_modules/@ariakit/react-core/esm/__chunks/QYJ6MIDR.js +"use client"; + + + + + + + +// src/popover/popover-disclosure.tsx + + +var QYJ6MIDR_TagName = "button"; +var usePopoverDisclosure = createHook(function usePopoverDisclosure2(_a) { + var _b = _a, { store } = _b, props = __objRest(_b, ["store"]); + const context = usePopoverProviderContext(); + store = store || context; + invariant( + store, + false && 0 + ); + const onClickProp = props.onClick; + const onClick = useEvent((event) => { + store == null ? void 0 : store.setAnchorElement(event.currentTarget); + onClickProp == null ? void 0 : onClickProp(event); + }); + props = useWrapElement( + props, + (element) => /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(PopoverScopedContextProvider, { value: store, children: element }), + [store] + ); + props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, props), { + onClick + }); + props = usePopoverAnchor(_3YLGPPWQ_spreadValues({ store }, props)); + props = useDialogDisclosure(_3YLGPPWQ_spreadValues({ store }, props)); + return props; +}); +var PopoverDisclosure = forwardRef2(function PopoverDisclosure2(props) { + const htmlProps = usePopoverDisclosure(props); + return LMDWO4NN_createElement(QYJ6MIDR_TagName, htmlProps); +}); + + + +;// ./node_modules/@ariakit/react-core/esm/__chunks/DR55NYVS.js +"use client"; + + + + +// src/popover/popover-disclosure-arrow.tsx + + + +var DR55NYVS_TagName = "span"; +var pointsMap = { + top: "4,10 8,6 12,10", + right: "6,4 10,8 6,12", + bottom: "4,6 8,10 12,6", + left: "10,4 6,8 10,12" +}; +var usePopoverDisclosureArrow = createHook(function usePopoverDisclosureArrow2(_a) { + var _b = _a, { store, placement } = _b, props = __objRest(_b, ["store", "placement"]); + const context = usePopoverContext(); + store = store || context; + invariant( + store, + false && 0 + ); + const position = store.useState((state) => placement || state.placement); + const dir = position.split("-")[0]; + const points = pointsMap[dir]; + const children = (0,external_React_.useMemo)( + () => /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)( + "svg", + { + display: "block", + fill: "none", + stroke: "currentColor", + strokeLinecap: "round", + strokeLinejoin: "round", + strokeWidth: 1.5, + viewBox: "0 0 16 16", + height: "1em", + width: "1em", + children: /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)("polyline", { points }) + } + ), + [points] + ); + props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({ + children, + "aria-hidden": true + }, props), { + style: _3YLGPPWQ_spreadValues({ + width: "1em", + height: "1em", + pointerEvents: "none" + }, props.style) + }); + return removeUndefinedValues(props); +}); +var PopoverDisclosureArrow = forwardRef2( + function PopoverDisclosureArrow2(props) { + const htmlProps = usePopoverDisclosureArrow(props); + return LMDWO4NN_createElement(DR55NYVS_TagName, htmlProps); + } +); + + + +;// ./node_modules/@ariakit/react-core/esm/__chunks/UD53QJDV.js +"use client"; + + + + + +// src/select/select-arrow.tsx +var UD53QJDV_TagName = "span"; +var useSelectArrow = createHook( + function useSelectArrow2(_a) { + var _b = _a, { store } = _b, props = __objRest(_b, ["store"]); + const context = useSelectContext(); + store = store || context; + props = usePopoverDisclosureArrow(_3YLGPPWQ_spreadValues({ store }, props)); + return props; + } +); +var SelectArrow = forwardRef2(function SelectArrow2(props) { + const htmlProps = useSelectArrow(props); + return LMDWO4NN_createElement(UD53QJDV_TagName, htmlProps); +}); + + + +;// ./node_modules/@ariakit/react-core/esm/select/select.js +"use client"; + + + + + + + + + + + + + + + + + + + + + + + +// src/select/select.tsx + + + + + + +var select_TagName = "button"; +function getSelectedValues(select) { + return Array.from(select.selectedOptions).map((option) => option.value); +} +function nextWithValue(store, next) { + return () => { + const nextId = next(); + if (!nextId) return; + let i = 0; + let nextItem = store.item(nextId); + const firstItem = nextItem; + while (nextItem && nextItem.value == null) { + const nextId2 = next(++i); + if (!nextId2) return; + nextItem = store.item(nextId2); + if (nextItem === firstItem) break; + } + return nextItem == null ? void 0 : nextItem.id; + }; +} +var useSelect = createHook(function useSelect2(_a) { + var _b = _a, { + store, + name, + form, + required, + showOnKeyDown = true, + moveOnKeyDown = true, + toggleOnPress = true, + toggleOnClick = toggleOnPress + } = _b, props = __objRest(_b, [ + "store", + "name", + "form", + "required", + "showOnKeyDown", + "moveOnKeyDown", + "toggleOnPress", + "toggleOnClick" + ]); + const context = useSelectProviderContext(); + store = store || context; + invariant( + store, + false && 0 + ); + const onKeyDownProp = props.onKeyDown; + const showOnKeyDownProp = useBooleanEvent(showOnKeyDown); + const moveOnKeyDownProp = useBooleanEvent(moveOnKeyDown); + const placement = store.useState("placement"); + const dir = placement.split("-")[0]; + const value = store.useState("value"); + const multiSelectable = Array.isArray(value); + const onKeyDown = useEvent((event) => { + var _a2; + onKeyDownProp == null ? void 0 : onKeyDownProp(event); + if (event.defaultPrevented) return; + if (!store) return; + const { orientation, items: items2, activeId } = store.getState(); + const isVertical = orientation !== "horizontal"; + const isHorizontal = orientation !== "vertical"; + const isGrid = !!((_a2 = items2.find((item) => !item.disabled && item.value != null)) == null ? void 0 : _a2.rowId); + const moveKeyMap = { + ArrowUp: (isGrid || isVertical) && nextWithValue(store, store.up), + ArrowRight: (isGrid || isHorizontal) && nextWithValue(store, store.next), + ArrowDown: (isGrid || isVertical) && nextWithValue(store, store.down), + ArrowLeft: (isGrid || isHorizontal) && nextWithValue(store, store.previous) + }; + const getId = moveKeyMap[event.key]; + if (getId && moveOnKeyDownProp(event)) { + event.preventDefault(); + store.move(getId()); + } + const isTopOrBottom = dir === "top" || dir === "bottom"; + const isLeft = dir === "left"; + const isRight = dir === "right"; + const canShowKeyMap = { + ArrowDown: isTopOrBottom, + ArrowUp: isTopOrBottom, + ArrowLeft: isLeft, + ArrowRight: isRight + }; + const canShow = canShowKeyMap[event.key]; + if (canShow && showOnKeyDownProp(event)) { + event.preventDefault(); + store.move(activeId); + queueBeforeEvent(event.currentTarget, "keyup", store.show); + } + }); + props = useWrapElement( + props, + (element) => /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(SelectScopedContextProvider, { value: store, children: element }), + [store] + ); + const [autofill, setAutofill] = (0,external_React_.useState)(false); + const nativeSelectChangedRef = (0,external_React_.useRef)(false); + (0,external_React_.useEffect)(() => { + const nativeSelectChanged = nativeSelectChangedRef.current; + nativeSelectChangedRef.current = false; + if (nativeSelectChanged) return; + setAutofill(false); + }, [value]); + const labelId = store.useState((state) => { + var _a2; + return (_a2 = state.labelElement) == null ? void 0 : _a2.id; + }); + const label = props["aria-label"]; + const labelledBy = props["aria-labelledby"] || labelId; + const items = store.useState((state) => { + if (!name) return; + return state.items; + }); + const values = (0,external_React_.useMemo)(() => { + return [...new Set(items == null ? void 0 : items.map((i) => i.value).filter((v) => v != null))]; + }, [items]); + props = useWrapElement( + props, + (element) => { + if (!name) return element; + return /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { children: [ + /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsxs)( + "select", + { + style: { + border: 0, + clip: "rect(0 0 0 0)", + height: "1px", + margin: "-1px", + overflow: "hidden", + padding: 0, + position: "absolute", + whiteSpace: "nowrap", + width: "1px" + }, + tabIndex: -1, + "aria-hidden": true, + "aria-label": label, + "aria-labelledby": labelledBy, + name, + form, + required, + value, + multiple: multiSelectable, + onFocus: () => { + var _a2; + return (_a2 = store == null ? void 0 : store.getState().selectElement) == null ? void 0 : _a2.focus(); + }, + onChange: (event) => { + nativeSelectChangedRef.current = true; + setAutofill(true); + store == null ? void 0 : store.setValue( + multiSelectable ? getSelectedValues(event.target) : event.target.value + ); + }, + children: [ + toArray(value).map((value2) => { + if (value2 == null) return null; + if (values.includes(value2)) return null; + return /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)("option", { value: value2, children: value2 }, value2); + }), + values.map((value2) => /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)("option", { value: value2, children: value2 }, value2)) + ] } - }); - }; - - this.getLabelProps = props => { - return { - htmlFor: this.inputId, - id: this.labelId, - ...props - }; - }; - - this.getInputProps = function (_temp4) { - let { - onKeyDown, - onBlur, - onChange, - onInput, - onChangeText, - ...rest - } = _temp4 === void 0 ? {} : _temp4; - let onChangeKey; - let eventHandlers = {}; - /* istanbul ignore next (preact) */ - - { - onChangeKey = 'onChange'; - } - - const { - inputValue, - isOpen, - highlightedIndex - } = _this.getState(); - - if (!rest.disabled) { - eventHandlers = { - [onChangeKey]: callAllEventHandlers(onChange, onInput, _this.inputHandleChange), - onKeyDown: callAllEventHandlers(onKeyDown, _this.inputHandleKeyDown), - onBlur: callAllEventHandlers(onBlur, _this.inputHandleBlur) - }; - } - - return { - 'aria-autocomplete': 'list', - 'aria-activedescendant': isOpen && typeof highlightedIndex === 'number' && highlightedIndex >= 0 ? _this.getItemId(highlightedIndex) : null, - 'aria-controls': isOpen ? _this.menuId : null, - 'aria-labelledby': _this.labelId, - // https://developer.mozilla.org/en-US/docs/Web/Security/Securing_your_site/Turning_off_form_autocompletion - // revert back since autocomplete="nope" is ignored on latest Chrome and Opera - autoComplete: 'off', - value: inputValue, - id: _this.inputId, - ...eventHandlers, - ...rest - }; - }; - - this.inputHandleKeyDown = event => { - const key = normalizeArrowKey(event); - - if (key && this.inputKeyDownHandlers[key]) { - this.inputKeyDownHandlers[key].call(this, event); - } - }; - - this.inputHandleChange = event => { - this.internalSetState({ - type: changeInput, - isOpen: true, - inputValue: event.target.value, - highlightedIndex: this.props.defaultHighlightedIndex - }); - }; - - this.inputHandleBlur = () => { - // Need setTimeout, so that when the user presses Tab, the activeElement is the next focused element, not the body element - this.internalSetTimeout(() => { - const downshiftButtonIsActive = this.props.environment.document && !!this.props.environment.document.activeElement && !!this.props.environment.document.activeElement.dataset && this.props.environment.document.activeElement.dataset.toggle && this._rootNode && this._rootNode.contains(this.props.environment.document.activeElement); - - if (!this.isMouseDown && !downshiftButtonIsActive) { - this.reset({ - type: blurInput - }); - } - }); - }; - - this.menuRef = node => { - this._menuNode = node; - }; - - this.getMenuProps = function (_temp5, _temp6) { - let { - refKey = 'ref', - ref, - ...props - } = _temp5 === void 0 ? {} : _temp5; - let { - suppressRefError = false - } = _temp6 === void 0 ? {} : _temp6; - _this.getMenuProps.called = true; - _this.getMenuProps.refKey = refKey; - _this.getMenuProps.suppressRefError = suppressRefError; - return { - [refKey]: handleRefs(ref, _this.menuRef), - role: 'listbox', - 'aria-labelledby': props && props['aria-label'] ? null : _this.labelId, - id: _this.menuId, - ...props - }; - }; - - this.getItemProps = function (_temp7) { - let { - onMouseMove, - onMouseDown, - onClick, - onPress, - index, - item = true ? - /* istanbul ignore next */ - undefined : 0, - ...rest - } = _temp7 === void 0 ? {} : _temp7; - - if (index === undefined) { - _this.items.push(item); - - index = _this.items.indexOf(item); - } else { - _this.items[index] = item; - } - - const onSelectKey = 'onClick'; - const customClickHandler = onClick; - const enabledEventHandlers = { - // onMouseMove is used over onMouseEnter here. onMouseMove - // is only triggered on actual mouse movement while onMouseEnter - // can fire on DOM changes, interrupting keyboard navigation - onMouseMove: callAllEventHandlers(onMouseMove, () => { - if (index === _this.getState().highlightedIndex) { - return; - } - - _this.setHighlightedIndex(index, { - type: itemMouseEnter - }); // We never want to manually scroll when changing state based - // on `onMouseMove` because we will be moving the element out - // from under the user which is currently scrolling/moving the - // cursor - - - _this.avoidScrolling = true; - - _this.internalSetTimeout(() => _this.avoidScrolling = false, 250); - }), - onMouseDown: callAllEventHandlers(onMouseDown, event => { - // This prevents the activeElement from being changed - // to the item so it can remain with the current activeElement - // which is a more common use case. - event.preventDefault(); - }), - [onSelectKey]: callAllEventHandlers(customClickHandler, () => { - _this.selectItemAtIndex(index, { - type: clickItem - }); - }) - }; // Passing down the onMouseDown handler to prevent redirect - // of the activeElement if clicking on disabled items - - const eventHandlers = rest.disabled ? { - onMouseDown: enabledEventHandlers.onMouseDown - } : enabledEventHandlers; - return { - id: _this.getItemId(index), - role: 'option', - 'aria-selected': _this.getState().highlightedIndex === index, - ...eventHandlers, - ...rest - }; - }; - - this.clearItems = () => { - this.items = []; - }; - - this.reset = function (otherStateToSet, cb) { - if (otherStateToSet === void 0) { - otherStateToSet = {}; - } - - otherStateToSet = pickState(otherStateToSet); - - _this.internalSetState(_ref => { - let { - selectedItem - } = _ref; - return { - isOpen: _this.props.defaultIsOpen, - highlightedIndex: _this.props.defaultHighlightedIndex, - inputValue: _this.props.itemToString(selectedItem), - ...otherStateToSet - }; - }, cb); - }; - - this.toggleMenu = function (otherStateToSet, cb) { - if (otherStateToSet === void 0) { - otherStateToSet = {}; - } - - otherStateToSet = pickState(otherStateToSet); - - _this.internalSetState(_ref2 => { - let { - isOpen - } = _ref2; - return { - isOpen: !isOpen, - ...(isOpen && { - highlightedIndex: _this.props.defaultHighlightedIndex - }), - ...otherStateToSet - }; - }, () => { - const { - isOpen, - highlightedIndex - } = _this.getState(); - - if (isOpen) { - if (_this.getItemCount() > 0 && typeof highlightedIndex === 'number') { - _this.setHighlightedIndex(highlightedIndex, otherStateToSet); - } - } - - cbToCb(cb)(); - }); - }; - - this.openMenu = cb => { - this.internalSetState({ - isOpen: true - }, cb); - }; - - this.closeMenu = cb => { - this.internalSetState({ - isOpen: false - }, cb); - }; - - this.updateStatus = debounce(() => { - const state = this.getState(); - const item = this.items[state.highlightedIndex]; - const resultCount = this.getItemCount(); - const status = this.props.getA11yStatusMessage({ - itemToString: this.props.itemToString, - previousResultCount: this.previousResultCount, - resultCount, - highlightedItem: item, - ...state - }); - this.previousResultCount = resultCount; - setStatus(status, this.props.environment.document); - }, 200); - // fancy destructuring + defaults + aliases - // this basically says each value of state should either be set to - // the initial value or the default value if the initial value is not provided - const { - defaultHighlightedIndex, - initialHighlightedIndex: _highlightedIndex = defaultHighlightedIndex, - defaultIsOpen, - initialIsOpen: _isOpen = defaultIsOpen, - initialInputValue: _inputValue = '', - initialSelectedItem: _selectedItem = null - } = this.props; - - const _state = this.getState({ - highlightedIndex: _highlightedIndex, - isOpen: _isOpen, - inputValue: _inputValue, - selectedItem: _selectedItem - }); - - if (_state.selectedItem != null && this.props.initialInputValue === undefined) { - _state.inputValue = this.props.itemToString(_state.selectedItem); - } - - this.state = _state; - } - - /** - * Clear all running timeouts - */ - internalClearTimeouts() { - this.timeoutIds.forEach(id => { - clearTimeout(id); - }); - this.timeoutIds = []; - } - /** - * Gets the state based on internal state or props - * If a state value is passed via props, then that - * is the value given, otherwise it's retrieved from - * stateToMerge - * - * @param {Object} stateToMerge defaults to this.state - * @return {Object} the state - */ - - - getState(stateToMerge) { - if (stateToMerge === void 0) { - stateToMerge = this.state; - } - - return getState(stateToMerge, this.props); - } - - getItemCount() { - // things read better this way. They're in priority order: - // 1. `this.itemCount` - // 2. `this.props.itemCount` - // 3. `this.items.length` - let itemCount = this.items.length; - - if (this.itemCount != null) { - itemCount = this.itemCount; - } else if (this.props.itemCount !== undefined) { - itemCount = this.props.itemCount; - } - - return itemCount; - } - - getItemNodeFromIndex(index) { - return this.props.environment.document.getElementById(this.getItemId(index)); - } - - scrollHighlightedItemIntoView() { - /* istanbul ignore else (react-native) */ - { - const node = this.getItemNodeFromIndex(this.getState().highlightedIndex); - this.props.scrollIntoView(node, this._menuNode); - } - } - - moveHighlightedIndex(amount, otherStateToSet) { - const itemCount = this.getItemCount(); - const { - highlightedIndex - } = this.getState(); - - if (itemCount > 0) { - const nextHighlightedIndex = getNextWrappingIndex(amount, highlightedIndex, itemCount, index => this.getItemNodeFromIndex(index)); - this.setHighlightedIndex(nextHighlightedIndex, otherStateToSet); - } - } - - getStateAndHelpers() { - const { - highlightedIndex, - inputValue, - selectedItem, - isOpen - } = this.getState(); - const { - itemToString - } = this.props; - const { - id - } = this; - const { - getRootProps, - getToggleButtonProps, - getLabelProps, - getMenuProps, - getInputProps, - getItemProps, - openMenu, - closeMenu, - toggleMenu, - selectItem, - selectItemAtIndex, - selectHighlightedItem, - setHighlightedIndex, - clearSelection, - clearItems, - reset, - setItemCount, - unsetItemCount, - internalSetState: setState - } = this; - return { - // prop getters - getRootProps, - getToggleButtonProps, - getLabelProps, - getMenuProps, - getInputProps, - getItemProps, - // actions - reset, - openMenu, - closeMenu, - toggleMenu, - selectItem, - selectItemAtIndex, - selectHighlightedItem, - setHighlightedIndex, - clearSelection, - clearItems, - setItemCount, - unsetItemCount, - setState, - // props - itemToString, - // derived - id, - // state - highlightedIndex, - inputValue, - isOpen, - selectedItem - }; - } //////////////////////////// ROOT - - - componentDidMount() { - /* istanbul ignore if (react-native) */ - if (false) {} - /* istanbul ignore if (react-native) */ - - - { - // this.isMouseDown helps us track whether the mouse is currently held down. - // This is useful when the user clicks on an item in the list, but holds the mouse - // down long enough for the list to disappear (because the blur event fires on the input) - // this.isMouseDown is used in the blur handler on the input to determine whether the blur event should - // trigger hiding the menu. - const onMouseDown = () => { - this.isMouseDown = true; - }; - - const onMouseUp = event => { - this.isMouseDown = false; // if the target element or the activeElement is within a downshift node - // then we don't want to reset downshift - - const contextWithinDownshift = targetWithinDownshift(event.target, [this._rootNode, this._menuNode], this.props.environment); - - if (!contextWithinDownshift && this.getState().isOpen) { - this.reset({ - type: mouseUp - }, () => this.props.onOuterClick(this.getStateAndHelpers())); - } - }; // Touching an element in iOS gives focus and hover states, but touching out of - // the element will remove hover, and persist the focus state, resulting in the - // blur event not being triggered. - // this.isTouchMove helps us track whether the user is tapping or swiping on a touch screen. - // If the user taps outside of Downshift, the component should be reset, - // but not if the user is swiping - - - const onTouchStart = () => { - this.isTouchMove = false; - }; - - const onTouchMove = () => { - this.isTouchMove = true; - }; - - const onTouchEnd = event => { - const contextWithinDownshift = targetWithinDownshift(event.target, [this._rootNode, this._menuNode], this.props.environment, false); - - if (!this.isTouchMove && !contextWithinDownshift && this.getState().isOpen) { - this.reset({ - type: touchEnd - }, () => this.props.onOuterClick(this.getStateAndHelpers())); + ), + element + ] }); + }, + [ + store, + label, + labelledBy, + name, + form, + required, + value, + multiSelectable, + values + ] + ); + const children = /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { children: [ + value, + /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(SelectArrow, {}) + ] }); + const contentElement = store.useState("contentElement"); + props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({ + role: "combobox", + "aria-autocomplete": "none", + "aria-labelledby": labelId, + "aria-haspopup": getPopupRole(contentElement, "listbox"), + "data-autofill": autofill || void 0, + "data-name": name, + children + }, props), { + ref: useMergeRefs(store.setSelectElement, props.ref), + onKeyDown + }); + props = usePopoverDisclosure(_3YLGPPWQ_spreadValues({ store, toggleOnClick }, props)); + props = useCompositeTypeahead(_3YLGPPWQ_spreadValues({ store }, props)); + return props; +}); +var select_Select = forwardRef2(function Select2(props) { + const htmlProps = useSelect(props); + return LMDWO4NN_createElement(select_TagName, htmlProps); +}); + + +;// ./node_modules/@ariakit/react-core/esm/__chunks/XRBJGF7I.js +"use client"; + + + + + + + + +// src/select/select-list.tsx + + + + +var XRBJGF7I_TagName = "div"; +var SelectListContext = (0,external_React_.createContext)(null); +var useSelectList = createHook( + function useSelectList2(_a) { + var _b = _a, { + store, + resetOnEscape = true, + hideOnEnter = true, + focusOnMove = true, + composite, + alwaysVisible + } = _b, props = __objRest(_b, [ + "store", + "resetOnEscape", + "hideOnEnter", + "focusOnMove", + "composite", + "alwaysVisible" + ]); + const context = useSelectContext(); + store = store || context; + invariant( + store, + false && 0 + ); + const id = useId(props.id); + const value = store.useState("value"); + const multiSelectable = Array.isArray(value); + const [defaultValue, setDefaultValue] = (0,external_React_.useState)(value); + const mounted = store.useState("mounted"); + (0,external_React_.useEffect)(() => { + if (mounted) return; + setDefaultValue(value); + }, [mounted, value]); + resetOnEscape = resetOnEscape && !multiSelectable; + const onKeyDownProp = props.onKeyDown; + const resetOnEscapeProp = useBooleanEvent(resetOnEscape); + const hideOnEnterProp = useBooleanEvent(hideOnEnter); + const onKeyDown = useEvent((event) => { + onKeyDownProp == null ? void 0 : onKeyDownProp(event); + if (event.defaultPrevented) return; + if (event.key === "Escape" && resetOnEscapeProp(event)) { + store == null ? void 0 : store.setValue(defaultValue); + } + if (event.key === " " || event.key === "Enter") { + if (isSelfTarget(event) && hideOnEnterProp(event)) { + event.preventDefault(); + store == null ? void 0 : store.hide(); + } + } + }); + const headingContext = (0,external_React_.useContext)(SelectHeadingContext); + const headingState = (0,external_React_.useState)(); + const [headingId, setHeadingId] = headingContext || headingState; + const headingContextValue = (0,external_React_.useMemo)( + () => [headingId, setHeadingId], + [headingId] + ); + const [childStore, setChildStore] = (0,external_React_.useState)(null); + const setStore = (0,external_React_.useContext)(SelectListContext); + (0,external_React_.useEffect)(() => { + if (!setStore) return; + setStore(store); + return () => setStore(null); + }, [setStore, store]); + props = useWrapElement( + props, + (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 }) }) }), + [store, headingContextValue] + ); + const hasCombobox = !!store.combobox; + composite = composite != null ? composite : !hasCombobox && childStore !== store; + const [element, setElement] = useTransactionState( + composite ? store.setListElement : null + ); + const role = useAttribute(element, "role", props.role); + const isCompositeRole = role === "listbox" || role === "menu" || role === "tree" || role === "grid"; + const ariaMultiSelectable = composite || isCompositeRole ? multiSelectable || void 0 : void 0; + const hidden = isHidden(mounted, props.hidden, alwaysVisible); + const style = hidden ? _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, props.style), { display: "none" }) : props.style; + if (composite) { + props = _3YLGPPWQ_spreadValues({ + role: "listbox", + "aria-multiselectable": ariaMultiSelectable + }, props); + } + const labelId = store.useState( + (state) => { + var _a2; + return headingId || ((_a2 = state.labelElement) == null ? void 0 : _a2.id); + } + ); + props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({ + id, + "aria-labelledby": labelId, + hidden + }, props), { + ref: useMergeRefs(setElement, props.ref), + style, + onKeyDown + }); + props = useComposite(_3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({ store }, props), { composite })); + props = useCompositeTypeahead(_3YLGPPWQ_spreadValues({ store, typeahead: !hasCombobox }, props)); + return props; + } +); +var SelectList = forwardRef2(function SelectList2(props) { + const htmlProps = useSelectList(props); + return LMDWO4NN_createElement(XRBJGF7I_TagName, htmlProps); +}); + + + +;// ./node_modules/@ariakit/react-core/esm/select/select-popover.js +"use client"; + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +// src/select/select-popover.tsx +var select_popover_TagName = "div"; +var useSelectPopover = createHook( + function useSelectPopover2(_a) { + var _b = _a, { store, alwaysVisible } = _b, props = __objRest(_b, ["store", "alwaysVisible"]); + const context = useSelectProviderContext(); + store = store || context; + props = useSelectList(_3YLGPPWQ_spreadValues({ store, alwaysVisible }, props)); + props = usePopover(_3YLGPPWQ_spreadValues({ store, alwaysVisible }, props)); + return props; + } +); +var SelectPopover = createDialogComponent( + forwardRef2(function SelectPopover2(props) { + const htmlProps = useSelectPopover(props); + return LMDWO4NN_createElement(select_popover_TagName, htmlProps); + }), + useSelectProviderContext +); + + +;// ./node_modules/@ariakit/react-core/esm/__chunks/YF2ICFG4.js +"use client"; + + + + + + + + +// src/select/select-item.tsx + + + + + +var YF2ICFG4_TagName = "div"; +function isSelected(storeValue, itemValue) { + if (itemValue == null) return; + if (storeValue == null) return false; + if (Array.isArray(storeValue)) { + return storeValue.includes(itemValue); + } + return storeValue === itemValue; +} +var useSelectItem = createHook( + function useSelectItem2(_a) { + var _b = _a, { + store, + value, + getItem: getItemProp, + hideOnClick, + setValueOnClick = value != null, + preventScrollOnKeyDown = true, + focusOnHover = true + } = _b, props = __objRest(_b, [ + "store", + "value", + "getItem", + "hideOnClick", + "setValueOnClick", + "preventScrollOnKeyDown", + "focusOnHover" + ]); + var _a2; + const context = useSelectScopedContext(); + store = store || context; + invariant( + store, + false && 0 + ); + const id = useId(props.id); + const disabled = disabledFromProps(props); + const { listElement, multiSelectable, selected, autoFocus } = useStoreStateObject(store, { + listElement: "listElement", + multiSelectable(state) { + return Array.isArray(state.value); + }, + selected(state) { + return isSelected(state.value, value); + }, + autoFocus(state) { + if (value == null) return false; + if (state.value == null) return false; + if (state.activeId !== id && (store == null ? void 0 : store.item(state.activeId))) { + return false; + } + if (Array.isArray(state.value)) { + return state.value[state.value.length - 1] === value; + } + return state.value === value; + } + }); + const getItem = (0,external_React_.useCallback)( + (item) => { + const nextItem = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, item), { + value: disabled ? void 0 : value, + children: value + }); + if (getItemProp) { + return getItemProp(nextItem); + } + return nextItem; + }, + [disabled, value, getItemProp] + ); + hideOnClick = hideOnClick != null ? hideOnClick : value != null && !multiSelectable; + const onClickProp = props.onClick; + const setValueOnClickProp = useBooleanEvent(setValueOnClick); + const hideOnClickProp = useBooleanEvent(hideOnClick); + const onClick = useEvent((event) => { + onClickProp == null ? void 0 : onClickProp(event); + if (event.defaultPrevented) return; + if (isDownloading(event)) return; + if (isOpeningInNewTab(event)) return; + if (setValueOnClickProp(event) && value != null) { + store == null ? void 0 : store.setValue((prevValue) => { + if (!Array.isArray(prevValue)) return value; + if (prevValue.includes(value)) { + return prevValue.filter((v) => v !== value); } - }; - - const { - environment - } = this.props; - environment.addEventListener('mousedown', onMouseDown); - environment.addEventListener('mouseup', onMouseUp); - environment.addEventListener('touchstart', onTouchStart); - environment.addEventListener('touchmove', onTouchMove); - environment.addEventListener('touchend', onTouchEnd); - - this.cleanup = () => { - this.internalClearTimeouts(); - this.updateStatus.cancel(); - environment.removeEventListener('mousedown', onMouseDown); - environment.removeEventListener('mouseup', onMouseUp); - environment.removeEventListener('touchstart', onTouchStart); - environment.removeEventListener('touchmove', onTouchMove); - environment.removeEventListener('touchend', onTouchEnd); - }; - } - } - - shouldScroll(prevState, prevProps) { - const { - highlightedIndex: currentHighlightedIndex - } = this.props.highlightedIndex === undefined ? this.getState() : this.props; - const { - highlightedIndex: prevHighlightedIndex - } = prevProps.highlightedIndex === undefined ? prevState : prevProps; - const scrollWhenOpen = currentHighlightedIndex && this.getState().isOpen && !prevState.isOpen; - const scrollWhenNavigating = currentHighlightedIndex !== prevHighlightedIndex; - return scrollWhenOpen || scrollWhenNavigating; - } - - componentDidUpdate(prevProps, prevState) { - if (false) {} - - if (isControlledProp(this.props, 'selectedItem') && this.props.selectedItemChanged(prevProps.selectedItem, this.props.selectedItem)) { - this.internalSetState({ - type: controlledPropUpdatedSelectedItem, - inputValue: this.props.itemToString(this.props.selectedItem) - }); - } - - if (!this.avoidScrolling && this.shouldScroll(prevState, prevProps)) { - this.scrollHighlightedItemIntoView(); - } - /* istanbul ignore else (react-native) */ - - - { - this.updateStatus(); - } - } - - componentWillUnmount() { - this.cleanup(); // avoids memory leak - } - - render() { - const children = unwrapArray(this.props.children, downshift_esm_noop); // because the items are rerendered every time we call the children - // we clear this out each render and it will be populated again as - // getItemProps is called. - - this.clearItems(); // we reset this so we know whether the user calls getRootProps during - // this render. If they do then we don't need to do anything, - // if they don't then we need to clone the element they return and - // apply the props for them. - - this.getRootProps.called = false; - this.getRootProps.refKey = undefined; - this.getRootProps.suppressRefError = undefined; // we do something similar for getMenuProps - - this.getMenuProps.called = false; - this.getMenuProps.refKey = undefined; - this.getMenuProps.suppressRefError = undefined; // we do something similar for getLabelProps - - this.getLabelProps.called = false; // and something similar for getInputProps - - this.getInputProps.called = false; - const element = unwrapArray(children(this.getStateAndHelpers())); - - if (!element) { - return null; - } - - if (this.getRootProps.called || this.props.suppressRefError) { - if (false) {} - - return element; - } else if (isDOMElement(element)) { - // they didn't apply the root props, but we can clone - // this and apply the props ourselves - return /*#__PURE__*/cloneElement(element, this.getRootProps(getElementProps(element))); - } - /* istanbul ignore else */ - - - if (false) {} - /* istanbul ignore next */ - - - return undefined; - } - - } - - Downshift.defaultProps = { - defaultHighlightedIndex: null, - defaultIsOpen: false, - getA11yStatusMessage: getA11yStatusMessage$1, - itemToString: i => { - if (i == null) { - return ''; - } - - if (false) {} - - return String(i); - }, - onStateChange: downshift_esm_noop, - onInputValueChange: downshift_esm_noop, - onUserAction: downshift_esm_noop, - onChange: downshift_esm_noop, - onSelect: downshift_esm_noop, - onOuterClick: downshift_esm_noop, - selectedItemChanged: (prevItem, item) => prevItem !== item, - environment: - /* istanbul ignore next (ssr) */ - typeof window === 'undefined' ? {} : window, - stateReducer: (state, stateToSet) => stateToSet, - suppressRefError: false, - scrollIntoView - }; - Downshift.stateChangeTypes = stateChangeTypes$3; - return Downshift; -})())); - - false ? 0 : void 0; -var Downshift$1 = (/* unused pure expression or super */ null && (Downshift)); - -function validateGetMenuPropsCalledCorrectly(node, _ref3) { - let { - refKey - } = _ref3; - - if (!node) { - // eslint-disable-next-line no-console - console.error(`downshift: The ref prop "${refKey}" from getMenuProps was not applied correctly on your menu element.`); - } -} - -function validateGetRootPropsCalledCorrectly(element, _ref4) { - let { - refKey - } = _ref4; - const refKeySpecified = refKey !== 'ref'; - const isComposite = !isDOMElement(element); - - if (isComposite && !refKeySpecified && !isForwardRef(element)) { - // eslint-disable-next-line no-console - console.error('downshift: You returned a non-DOM element. You must specify a refKey in getRootProps'); - } else if (!isComposite && refKeySpecified) { - // eslint-disable-next-line no-console - console.error(`downshift: You returned a DOM element. You should not specify a refKey in getRootProps. You specified "${refKey}"`); - } - - if (!isForwardRef(element) && !getElementProps(element)[refKey]) { - // eslint-disable-next-line no-console - console.error(`downshift: You must apply the ref prop "${refKey}" from getRootProps onto your root element.`); - } -} - -const dropdownDefaultStateValues = { - highlightedIndex: -1, - isOpen: false, - selectedItem: null, - inputValue: '' -}; - -function callOnChangeProps(action, state, newState) { - const { - props, - type - } = action; - const changes = {}; - Object.keys(state).forEach(key => { - invokeOnChangeHandler(key, action, state, newState); - - if (newState[key] !== state[key]) { - changes[key] = newState[key]; - } - }); - - if (props.onStateChange && Object.keys(changes).length) { - props.onStateChange({ - type, - ...changes - }); - } -} - -function invokeOnChangeHandler(key, action, state, newState) { - const { - props, - type - } = action; - const handler = `on${capitalizeString(key)}Change`; - - if (props[handler] && newState[key] !== undefined && newState[key] !== state[key]) { - props[handler]({ - type, - ...newState - }); - } -} -/** - * Default state reducer that returns the changes. - * - * @param {Object} s state. - * @param {Object} a action with changes. - * @returns {Object} changes. - */ - - -function stateReducer(s, a) { - return a.changes; -} -/** - * Returns a message to be added to aria-live region when item is selected. - * - * @param {Object} selectionParameters Parameters required to build the message. - * @returns {string} The a11y message. - */ - - -function getA11ySelectionMessage(selectionParameters) { - const { - selectedItem, - itemToString: itemToStringLocal - } = selectionParameters; - return selectedItem ? `${itemToStringLocal(selectedItem)} has been selected.` : ''; -} -/** - * Debounced call for updating the a11y message. - */ - - -const updateA11yStatus = debounce((getA11yMessage, document) => { - setStatus(getA11yMessage(), document); -}, 200); // istanbul ignore next - -const downshift_esm_useIsomorphicLayoutEffect = typeof window !== 'undefined' && typeof window.document !== 'undefined' && typeof window.document.createElement !== 'undefined' ? external_React_.useLayoutEffect : external_React_.useEffect; - -function useElementIds(_ref) { - let { - id = `downshift-${generateId()}`, - labelId, - menuId, - getItemId, - toggleButtonId, - inputId - } = _ref; - const elementIdsRef = (0,external_React_.useRef)({ - labelId: labelId || `${id}-label`, - menuId: menuId || `${id}-menu`, - getItemId: getItemId || (index => `${id}-item-${index}`), - toggleButtonId: toggleButtonId || `${id}-toggle-button`, - inputId: inputId || `${id}-input` - }); - return elementIdsRef.current; -} - -function getItemIndex(index, item, items) { - if (index !== undefined) { - return index; - } - - if (items.length === 0) { - return -1; - } - - return items.indexOf(item); -} - -function itemToString(item) { - return item ? String(item) : ''; -} - -function isAcceptedCharacterKey(key) { - return /^\S{1}$/.test(key); -} - -function capitalizeString(string) { - return `${string.slice(0, 1).toUpperCase()}${string.slice(1)}`; -} - -function downshift_esm_useLatestRef(val) { - const ref = (0,external_React_.useRef)(val); // technically this is not "concurrent mode safe" because we're manipulating - // the value during render (so it's not idempotent). However, the places this - // hook is used is to support memoizing callbacks which will be called - // *during* render, so we need the latest values *during* render. - // If not for this, then we'd probably want to use useLayoutEffect instead. - - ref.current = val; - return ref; -} -/** - * Computes the controlled state using a the previous state, props, - * two reducers, one from downshift and an optional one from the user. - * Also calls the onChange handlers for state values that have changed. - * - * @param {Function} reducer Reducer function from downshift. - * @param {Object} initialState Initial state of the hook. - * @param {Object} props The hook props. - * @returns {Array} An array with the state and an action dispatcher. - */ - - -function useEnhancedReducer(reducer, initialState, props) { - const prevStateRef = (0,external_React_.useRef)(); - const actionRef = (0,external_React_.useRef)(); - const enhancedReducer = (0,external_React_.useCallback)((state, action) => { - actionRef.current = action; - state = getState(state, action.props); - const changes = reducer(state, action); - const newState = action.props.stateReducer(state, { ...action, - changes - }); - return newState; - }, [reducer]); - const [state, dispatch] = (0,external_React_.useReducer)(enhancedReducer, initialState); - const propsRef = downshift_esm_useLatestRef(props); - const dispatchWithProps = (0,external_React_.useCallback)(action => dispatch({ - props: propsRef.current, - ...action - }), [propsRef]); - const action = actionRef.current; - (0,external_React_.useEffect)(() => { - if (action && prevStateRef.current && prevStateRef.current !== state) { - callOnChangeProps(action, getState(prevStateRef.current, action.props), state); - } - - prevStateRef.current = state; - }, [state, props, action]); - return [state, dispatchWithProps]; -} -/** - * Wraps the useEnhancedReducer and applies the controlled prop values before - * returning the new state. - * - * @param {Function} reducer Reducer function from downshift. - * @param {Object} initialState Initial state of the hook. - * @param {Object} props The hook props. - * @returns {Array} An array with the state and an action dispatcher. - */ - - -function useControlledReducer$1(reducer, initialState, props) { - const [state, dispatch] = useEnhancedReducer(reducer, initialState, props); - return [getState(state, props), dispatch]; -} - -const defaultProps$3 = { - itemToString, - stateReducer, - getA11ySelectionMessage, - scrollIntoView, - circularNavigation: false, - environment: - /* istanbul ignore next (ssr) */ - typeof window === 'undefined' ? {} : window -}; - -function getDefaultValue$1(props, propKey, defaultStateValues) { - if (defaultStateValues === void 0) { - defaultStateValues = dropdownDefaultStateValues; - } - - const defaultValue = props[`default${capitalizeString(propKey)}`]; - - if (defaultValue !== undefined) { - return defaultValue; - } - - return defaultStateValues[propKey]; -} - -function getInitialValue$1(props, propKey, defaultStateValues) { - if (defaultStateValues === void 0) { - defaultStateValues = dropdownDefaultStateValues; - } - - const value = props[propKey]; - - if (value !== undefined) { - return value; - } - - const initialValue = props[`initial${capitalizeString(propKey)}`]; - - if (initialValue !== undefined) { - return initialValue; - } - - return getDefaultValue$1(props, propKey, defaultStateValues); -} - -function getInitialState$2(props) { - const selectedItem = getInitialValue$1(props, 'selectedItem'); - const isOpen = getInitialValue$1(props, 'isOpen'); - const highlightedIndex = getInitialValue$1(props, 'highlightedIndex'); - const inputValue = getInitialValue$1(props, 'inputValue'); - return { - highlightedIndex: highlightedIndex < 0 && selectedItem && isOpen ? props.items.indexOf(selectedItem) : highlightedIndex, - isOpen, - selectedItem, - inputValue - }; -} - -function getHighlightedIndexOnOpen(props, state, offset, getItemNodeFromIndex) { - const { - items, - initialHighlightedIndex, - defaultHighlightedIndex + return [...prevValue, value]; + }); + } + if (hideOnClickProp(event)) { + store == null ? void 0 : store.hide(); + } + }); + props = useWrapElement( + props, + (element) => /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(SelectItemCheckedContext.Provider, { value: selected != null ? selected : false, children: element }), + [selected] + ); + props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({ + id, + role: getPopupItemRole(listElement), + "aria-selected": selected, + children: value + }, props), { + autoFocus: (_a2 = props.autoFocus) != null ? _a2 : autoFocus, + onClick + }); + props = useCompositeItem(_3YLGPPWQ_spreadValues({ + store, + getItem, + preventScrollOnKeyDown + }, props)); + const focusOnHoverProp = useBooleanEvent(focusOnHover); + props = useCompositeHover(_3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({ + store + }, props), { + // We have to disable focusOnHover when the popup is closed, otherwise + // the active item will change to null (the container) when the popup is + // closed by clicking on an item. + focusOnHover(event) { + if (!focusOnHoverProp(event)) return false; + const state = store == null ? void 0 : store.getState(); + return !!(state == null ? void 0 : state.open); + } + })); + return props; + } +); +var SelectItem = memo2( + forwardRef2(function SelectItem2(props) { + const htmlProps = useSelectItem(props); + return LMDWO4NN_createElement(YF2ICFG4_TagName, htmlProps); + }) +); + + + +;// ./node_modules/@ariakit/react-core/esm/__chunks/EYKMH5G5.js +"use client"; + +// src/checkbox/checkbox-checked-context.tsx + +var CheckboxCheckedContext = (0,external_React_.createContext)(false); + + + +;// ./node_modules/@ariakit/react-core/esm/__chunks/5JCRYSSV.js +"use client"; + + + + +// src/checkbox/checkbox-check.tsx + + + +var _5JCRYSSV_TagName = "span"; +var checkmark = /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)( + "svg", + { + display: "block", + fill: "none", + stroke: "currentColor", + strokeLinecap: "round", + strokeLinejoin: "round", + strokeWidth: 1.5, + viewBox: "0 0 16 16", + height: "1em", + width: "1em", + children: /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)("polyline", { points: "4,8 7,12 12,4" }) + } +); +function getChildren(props) { + if (props.checked) { + return props.children || checkmark; + } + if (typeof props.children === "function") { + return props.children; + } + return null; +} +var useCheckboxCheck = createHook( + function useCheckboxCheck2(_a) { + var _b = _a, { store, checked } = _b, props = __objRest(_b, ["store", "checked"]); + const context = (0,external_React_.useContext)(CheckboxCheckedContext); + checked = checked != null ? checked : context; + const children = getChildren({ checked, children: props.children }); + props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({ + "aria-hidden": true + }, props), { + children, + style: _3YLGPPWQ_spreadValues({ + width: "1em", + height: "1em", + pointerEvents: "none" + }, props.style) + }); + return removeUndefinedValues(props); + } +); +var CheckboxCheck = forwardRef2(function CheckboxCheck2(props) { + const htmlProps = useCheckboxCheck(props); + return LMDWO4NN_createElement(_5JCRYSSV_TagName, htmlProps); +}); + + + +;// ./node_modules/@ariakit/react-core/esm/select/select-item-check.js +"use client"; + + + + + + + + + + + + + +// src/select/select-item-check.tsx + +var select_item_check_TagName = "span"; +var useSelectItemCheck = createHook( + function useSelectItemCheck2(_a) { + var _b = _a, { store, checked } = _b, props = __objRest(_b, ["store", "checked"]); + const context = (0,external_React_.useContext)(SelectItemCheckedContext); + checked = checked != null ? checked : context; + props = useCheckboxCheck(_3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, props), { checked })); + return props; + } +); +var SelectItemCheck = forwardRef2(function SelectItemCheck2(props) { + const htmlProps = useSelectItemCheck(props); + return LMDWO4NN_createElement(select_item_check_TagName, htmlProps); +}); + + +;// ./node_modules/@wordpress/components/build-module/custom-select-control-v2/styles.js + +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)."; } +/** + * External dependencies + */ + + +/** + * Internal dependencies + */ + + + + +// TODO: extract to common utils and apply to relevant components +const ANIMATION_PARAMS = { + SLIDE_AMOUNT: '2px', + DURATION: '400ms', + EASING: 'cubic-bezier( 0.16, 1, 0.3, 1 )' +}; +const INLINE_PADDING = { + compact: config_values.controlPaddingXSmall, + small: config_values.controlPaddingXSmall, + default: config_values.controlPaddingX +}; +const getSelectSize = (size, heightProperty) => { + const sizes = { + compact: { + [heightProperty]: 32, + paddingInlineStart: INLINE_PADDING.compact, + paddingInlineEnd: INLINE_PADDING.compact + chevronIconSize + }, + default: { + [heightProperty]: 40, + paddingInlineStart: INLINE_PADDING.default, + paddingInlineEnd: INLINE_PADDING.default + chevronIconSize + }, + small: { + [heightProperty]: 24, + paddingInlineStart: INLINE_PADDING.small, + paddingInlineEnd: INLINE_PADDING.small + chevronIconSize + } + }; + return sizes[size] || sizes.default; +}; +const getSelectItemSize = size => { + // Used to visually align the checkmark with the chevron + const checkmarkCorrection = 6; + const sizes = { + compact: { + paddingInlineStart: INLINE_PADDING.compact, + paddingInlineEnd: INLINE_PADDING.compact - checkmarkCorrection + }, + default: { + paddingInlineStart: INLINE_PADDING.default, + paddingInlineEnd: INLINE_PADDING.default - checkmarkCorrection + }, + small: { + paddingInlineStart: INLINE_PADDING.small, + paddingInlineEnd: INLINE_PADDING.small - checkmarkCorrection + } + }; + return sizes[size] || sizes.default; +}; +const styles_Select = /*#__PURE__*/emotion_styled_base_browser_esm(select_Select, true ? { + // Do not forward `hasCustomRenderProp` to the underlying Ariakit.Select component + shouldForwardProp: prop => prop !== 'hasCustomRenderProp', + target: "e1p3eej77" +} : 0)(({ + size, + hasCustomRenderProp +}) => /*#__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({ + inputSize: size +}), ";" + ( true ? "" : 0), true ? "" : 0), true ? "" : 0); +const slideDownAndFade = emotion_react_browser_esm_keyframes({ + '0%': { + opacity: 0, + transform: `translateY(-${ANIMATION_PARAMS.SLIDE_AMOUNT})` + }, + '100%': { + opacity: 1, + transform: 'translateY(0)' + } +}); +const styles_SelectPopover = /*#__PURE__*/emotion_styled_base_browser_esm(SelectPopover, true ? { + target: "e1p3eej76" +} : 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)); +const styles_SelectItem = /*#__PURE__*/emotion_styled_base_browser_esm(SelectItem, true ? { + target: "e1p3eej75" +} : 0)(({ + size +}) => /*#__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); +const truncateStyles = true ? { + name: "1h52dri", + styles: "overflow:hidden;text-overflow:ellipsis;white-space:nowrap" +} : 0; +const SelectedExperimentalHintWrapper = /*#__PURE__*/emotion_styled_base_browser_esm("div", true ? { + target: "e1p3eej74" +} : 0)(truncateStyles, ";" + ( true ? "" : 0)); +const SelectedExperimentalHintItem = /*#__PURE__*/emotion_styled_base_browser_esm("span", true ? { + target: "e1p3eej73" +} : 0)("color:", COLORS.theme.gray[600], ";margin-inline-start:", space(2), ";" + ( true ? "" : 0)); +const WithHintItemWrapper = /*#__PURE__*/emotion_styled_base_browser_esm("div", true ? { + target: "e1p3eej72" +} : 0)("display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;flex:1;column-gap:", space(4), ";" + ( true ? "" : 0)); +const WithHintItemHint = /*#__PURE__*/emotion_styled_base_browser_esm("span", true ? { + target: "e1p3eej71" +} : 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)); +const SelectedItemCheck = /*#__PURE__*/emotion_styled_base_browser_esm(SelectItemCheck, true ? { + target: "e1p3eej70" +} : 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)); + +;// ./node_modules/@wordpress/components/build-module/custom-select-control-v2/custom-select.js +/** + * External dependencies + */ + + +/** + * WordPress dependencies + */ + + + +/** + * Internal dependencies + */ + + + + + + +const CustomSelectContext = (0,external_wp_element_namespaceObject.createContext)(undefined); +function defaultRenderSelectedValue(value) { + const isValueEmpty = Array.isArray(value) ? value.length === 0 : value === undefined || value === null; + if (isValueEmpty) { + return (0,external_wp_i18n_namespaceObject.__)('Select an item'); + } + if (Array.isArray(value)) { + return value.length === 1 ? value[0] : + // translators: %s: number of items selected (it will always be 2 or more items) + (0,external_wp_i18n_namespaceObject.sprintf)((0,external_wp_i18n_namespaceObject.__)('%s items selected'), value.length); + } + return value; +} +const CustomSelectButton = ({ + renderSelectedValue, + size = 'default', + store, + ...restProps +}) => { + const { + value: currentValue + } = useStoreState(store); + const computedRenderSelectedValue = (0,external_wp_element_namespaceObject.useMemo)(() => renderSelectedValue !== null && renderSelectedValue !== void 0 ? renderSelectedValue : defaultRenderSelectedValue, [renderSelectedValue]); + return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(styles_Select, { + ...restProps, + size: size, + hasCustomRenderProp: !!renderSelectedValue, + store: store, + children: computedRenderSelectedValue(currentValue) + }); +}; +function _CustomSelect(props) { + const { + children, + hideLabelFromVision = false, + label, + size, + store, + className, + isLegacy = false, + ...restProps } = props; - const { - selectedItem, - highlightedIndex - } = state; - - if (items.length === 0) { - return -1; - } // initialHighlightedIndex will give value to highlightedIndex on initial state only. - - - if (initialHighlightedIndex !== undefined && highlightedIndex === initialHighlightedIndex) { - return initialHighlightedIndex; - } - - if (defaultHighlightedIndex !== undefined) { - return defaultHighlightedIndex; - } - - if (selectedItem) { - if (offset === 0) { - return items.indexOf(selectedItem); - } - - return getNextWrappingIndex(offset, items.indexOf(selectedItem), items.length, getItemNodeFromIndex, false); - } - - if (offset === 0) { - return -1; - } - - return offset < 0 ? items.length - 1 : 0; -} -/** - * Reuse the movement tracking of mouse and touch events. - * - * @param {boolean} isOpen Whether the dropdown is open or not. - * @param {Array} downshiftElementRefs Downshift element refs to track movement (toggleButton, menu etc.) - * @param {Object} environment Environment where component/hook exists. - * @param {Function} handleBlur Handler on blur from mouse or touch. - * @returns {Object} Ref containing whether mouseDown or touchMove event is happening - */ - - -function useMouseAndTouchTracker(isOpen, downshiftElementRefs, environment, handleBlur) { - const mouseAndTouchTrackersRef = (0,external_React_.useRef)({ - isMouseDown: false, - isTouchMove: false - }); - (0,external_React_.useEffect)(() => { - // The same strategy for checking if a click occurred inside or outside downsift - // as in downshift.js. - const onMouseDown = () => { - mouseAndTouchTrackersRef.current.isMouseDown = true; - }; - - const onMouseUp = event => { - mouseAndTouchTrackersRef.current.isMouseDown = false; - - if (isOpen && !targetWithinDownshift(event.target, downshiftElementRefs.map(ref => ref.current), environment)) { - handleBlur(); - } - }; - - const onTouchStart = () => { - mouseAndTouchTrackersRef.current.isTouchMove = false; - }; - - const onTouchMove = () => { - mouseAndTouchTrackersRef.current.isTouchMove = true; - }; - - const onTouchEnd = event => { - if (isOpen && !mouseAndTouchTrackersRef.current.isTouchMove && !targetWithinDownshift(event.target, downshiftElementRefs.map(ref => ref.current), environment, false)) { - handleBlur(); - } - }; - - environment.addEventListener('mousedown', onMouseDown); - environment.addEventListener('mouseup', onMouseUp); - environment.addEventListener('touchstart', onTouchStart); - environment.addEventListener('touchmove', onTouchMove); - environment.addEventListener('touchend', onTouchEnd); - return function cleanup() { - environment.removeEventListener('mousedown', onMouseDown); - environment.removeEventListener('mouseup', onMouseUp); - environment.removeEventListener('touchstart', onTouchStart); - environment.removeEventListener('touchmove', onTouchMove); - environment.removeEventListener('touchend', onTouchEnd); - }; // eslint-disable-next-line react-hooks/exhaustive-deps - }, [isOpen, environment]); - return mouseAndTouchTrackersRef; -} -/* istanbul ignore next */ -// eslint-disable-next-line import/no-mutable-exports - - -let useGetterPropsCalledChecker = () => downshift_esm_noop; -/** - * Custom hook that checks if getter props are called correctly. - * - * @param {...any} propKeys Getter prop names to be handled. - * @returns {Function} Setter function called inside getter props to set call information. - */ - -/* istanbul ignore next */ - - -if (false) {} - -function useA11yMessageSetter(getA11yMessage, dependencyArray, _ref2) { - let { - isInitialMount, - highlightedIndex, - items, - environment, + const onSelectPopoverKeyDown = (0,external_wp_element_namespaceObject.useCallback)(e => { + if (isLegacy) { + e.stopPropagation(); + } + }, [isLegacy]); + const contextValue = (0,external_wp_element_namespaceObject.useMemo)(() => ({ + store, + size + }), [store, size]); + return ( + /*#__PURE__*/ + // Where should `restProps` be forwarded to? + (0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { + className: className, + children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(SelectLabel, { + store: store, + render: hideLabelFromVision ? + /*#__PURE__*/ + // @ts-expect-error `children` are passed via the render prop + (0,external_ReactJSXRuntime_namespaceObject.jsx)(visually_hidden_component, {}) : + /*#__PURE__*/ + // @ts-expect-error `children` are passed via the render prop + (0,external_ReactJSXRuntime_namespaceObject.jsx)(base_control.VisualLabel, { + as: "div" + }), + children: label + }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(input_base, { + __next40pxDefaultSize: true, + size: size, + suffix: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(select_control_chevron_down, {}), + children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(CustomSelectButton, { + ...restProps, + size: size, + store: store + // Match legacy behavior (move selection rather than open the popover) + , + showOnKeyDown: !isLegacy + }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(styles_SelectPopover, { + gutter: 12, + store: store, + sameWidth: true, + slide: false, + onKeyDown: onSelectPopoverKeyDown + // Match legacy behavior + , + flip: !isLegacy, + children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(CustomSelectContext.Provider, { + value: contextValue, + children: children + }) + })] + })] + }) + ); +} +/* harmony default export */ const custom_select = (_CustomSelect); + +;// ./node_modules/@wordpress/components/build-module/custom-select-control-v2/item.js +/** + * WordPress dependencies + */ + + +/** + * Internal dependencies + */ + + + + +function CustomSelectItem({ + children, + ...props +}) { + var _customSelectContext$; + const customSelectContext = (0,external_wp_element_namespaceObject.useContext)(CustomSelectContext); + return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(styles_SelectItem, { + store: customSelectContext?.store, + size: (_customSelectContext$ = customSelectContext?.size) !== null && _customSelectContext$ !== void 0 ? _customSelectContext$ : 'default', + ...props, + children: [children !== null && children !== void 0 ? children : props.value, /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(SelectedItemCheck, { + children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(icons_build_module_icon, { + icon: library_check + }) + })] + }); +} +CustomSelectItem.displayName = 'CustomSelectControlV2.Item'; +/* harmony default export */ const custom_select_control_v2_item = (CustomSelectItem); + +;// ./node_modules/@wordpress/components/build-module/custom-select-control/index.js +/** + * External dependencies + */ + + + +/** + * WordPress dependencies + */ + + + +/** + * Internal dependencies + */ + + + + + + +function custom_select_control_useDeprecatedProps({ + __experimentalShowSelectedHint, + ...otherProps +}) { + return { + showSelectedHint: __experimentalShowSelectedHint, + ...otherProps + }; +} + +// The removal of `__experimentalHint` in favour of `hint` doesn't happen in +// the `useDeprecatedProps` hook in order not to break consumers that rely +// on object identity (see https://github.com/WordPress/gutenberg/pull/63248#discussion_r1672213131) +function applyOptionDeprecations({ + __experimentalHint, + ...rest +}) { + return { + hint: __experimentalHint, ...rest - } = _ref2; - // Sets a11y status message on changes in state. - (0,external_React_.useEffect)(() => { - if (isInitialMount || false) { - return; - } - - updateA11yStatus(() => getA11yMessage({ - highlightedIndex, - highlightedItem: items[highlightedIndex], - resultCount: items.length, - ...rest - }), environment.document); // eslint-disable-next-line react-hooks/exhaustive-deps - }, dependencyArray); -} - -function useScrollIntoView(_ref3) { - let { - highlightedIndex, - isOpen, - itemRefs, - getItemNodeFromIndex, - menuElement, - scrollIntoView: scrollIntoViewProp - } = _ref3; - // used not to scroll on highlight by mouse. - const shouldScrollRef = (0,external_React_.useRef)(true); // Scroll on highlighted item if change comes from keyboard. - - downshift_esm_useIsomorphicLayoutEffect(() => { - if (highlightedIndex < 0 || !isOpen || !Object.keys(itemRefs.current).length) { - return; - } - - if (shouldScrollRef.current === false) { - shouldScrollRef.current = true; - } else { - scrollIntoViewProp(getItemNodeFromIndex(highlightedIndex), menuElement); - } // eslint-disable-next-line react-hooks/exhaustive-deps - - }, [highlightedIndex]); - return shouldScrollRef; -} // eslint-disable-next-line import/no-mutable-exports - - -let useControlPropsValidator = downshift_esm_noop; -/* istanbul ignore next */ - -if (false) {} - -/* eslint-disable complexity */ - -function downshiftCommonReducer(state, action, stateChangeTypes) { - const { - type, - props - } = action; - let changes; - - switch (type) { - case stateChangeTypes.ItemMouseMove: - changes = { - highlightedIndex: action.disabled ? -1 : action.index - }; - break; - - case stateChangeTypes.MenuMouseLeave: - changes = { - highlightedIndex: -1 - }; - break; - - case stateChangeTypes.ToggleButtonClick: - case stateChangeTypes.FunctionToggleMenu: - changes = { - isOpen: !state.isOpen, - highlightedIndex: state.isOpen ? -1 : getHighlightedIndexOnOpen(props, state, 0) - }; - break; - - case stateChangeTypes.FunctionOpenMenu: - changes = { - isOpen: true, - highlightedIndex: getHighlightedIndexOnOpen(props, state, 0) - }; - break; - - case stateChangeTypes.FunctionCloseMenu: - changes = { - isOpen: false - }; - break; - - case stateChangeTypes.FunctionSetHighlightedIndex: - changes = { - highlightedIndex: action.highlightedIndex - }; - break; - - case stateChangeTypes.FunctionSetInputValue: - changes = { - inputValue: action.inputValue - }; - break; - - case stateChangeTypes.FunctionReset: - changes = { - highlightedIndex: getDefaultValue$1(props, 'highlightedIndex'), - isOpen: getDefaultValue$1(props, 'isOpen'), - selectedItem: getDefaultValue$1(props, 'selectedItem'), - inputValue: getDefaultValue$1(props, 'inputValue') + }; +} +function getDescribedBy(currentValue, describedBy) { + if (describedBy) { + return describedBy; + } + + // translators: %s: The selected option. + return (0,external_wp_i18n_namespaceObject.sprintf)((0,external_wp_i18n_namespaceObject.__)('Currently selected: %s'), currentValue); +} +function CustomSelectControl(props) { + const { + __next40pxDefaultSize = false, + __shouldNotWarnDeprecated36pxSize, + describedBy, + options, + onChange, + size = 'default', + value, + className: classNameProp, + showSelectedHint = false, + ...restProps + } = custom_select_control_useDeprecatedProps(props); + maybeWarnDeprecated36pxSize({ + componentName: 'CustomSelectControl', + __next40pxDefaultSize, + size, + __shouldNotWarnDeprecated36pxSize + }); + const descriptionId = (0,external_wp_compose_namespaceObject.useInstanceId)(CustomSelectControl, 'custom-select-control__description'); + + // Forward props + store from v2 implementation + const store = useSelectStore({ + async setValue(nextValue) { + const nextOption = options.find(item => item.name === nextValue); + if (!onChange || !nextOption) { + return; + } + + // Executes the logic in a microtask after the popup is closed. + // This is simply to ensure the isOpen state matches the one from the + // previous legacy implementation. + await Promise.resolve(); + const state = store.getState(); + const changeObject = { + highlightedIndex: state.renderedItems.findIndex(item => item.value === nextValue), + inputValue: '', + isOpen: state.open, + selectedItem: nextOption, + type: '' }; - break; - - default: - throw new Error('Reducer called without proper action type.'); - } - - return { ...state, - ...changes - }; -} -/* eslint-enable complexity */ - -function getItemIndexByCharacterKey(_a) { - var keysSoFar = _a.keysSoFar, highlightedIndex = _a.highlightedIndex, items = _a.items, itemToString = _a.itemToString, getItemNodeFromIndex = _a.getItemNodeFromIndex; - var lowerCasedKeysSoFar = keysSoFar.toLowerCase(); - for (var index = 0; index < items.length; index++) { - var offsetIndex = (index + highlightedIndex + 1) % items.length; - var item = items[offsetIndex]; - if (item !== undefined && - itemToString(item) - .toLowerCase() - .startsWith(lowerCasedKeysSoFar)) { - var element = getItemNodeFromIndex(offsetIndex); - if (!(element === null || element === void 0 ? void 0 : element.hasAttribute('disabled'))) { - return offsetIndex; - } - } - } - return highlightedIndex; -} -var propTypes$2 = { - items: (prop_types_default()).array.isRequired, - itemToString: (prop_types_default()).func, - getA11yStatusMessage: (prop_types_default()).func, - getA11ySelectionMessage: (prop_types_default()).func, - circularNavigation: (prop_types_default()).bool, - highlightedIndex: (prop_types_default()).number, - defaultHighlightedIndex: (prop_types_default()).number, - initialHighlightedIndex: (prop_types_default()).number, - isOpen: (prop_types_default()).bool, - defaultIsOpen: (prop_types_default()).bool, - initialIsOpen: (prop_types_default()).bool, - selectedItem: (prop_types_default()).any, - initialSelectedItem: (prop_types_default()).any, - defaultSelectedItem: (prop_types_default()).any, - id: (prop_types_default()).string, - labelId: (prop_types_default()).string, - menuId: (prop_types_default()).string, - getItemId: (prop_types_default()).func, - toggleButtonId: (prop_types_default()).string, - stateReducer: (prop_types_default()).func, - onSelectedItemChange: (prop_types_default()).func, - onHighlightedIndexChange: (prop_types_default()).func, - onStateChange: (prop_types_default()).func, - onIsOpenChange: (prop_types_default()).func, - environment: prop_types_default().shape({ - addEventListener: (prop_types_default()).func, - removeEventListener: (prop_types_default()).func, - document: prop_types_default().shape({ - getElementById: (prop_types_default()).func, - activeElement: (prop_types_default()).any, - body: (prop_types_default()).any - }) - }) -}; -/** - * Default implementation for status message. Only added when menu is open. - * Will specift if there are results in the list, and if so, how many, - * and what keys are relevant. - * - * @param {Object} param the downshift state and other relevant properties - * @return {String} the a11y status message - */ -function getA11yStatusMessage(_a) { - var isOpen = _a.isOpen, resultCount = _a.resultCount, previousResultCount = _a.previousResultCount; - if (!isOpen) { - return ''; - } - if (!resultCount) { - return 'No results are available.'; - } - if (resultCount !== previousResultCount) { - return "".concat(resultCount, " result").concat(resultCount === 1 ? ' is' : 's are', " available, use up and down arrow keys to navigate. Press Enter or Space Bar keys to select."); - } - return ''; -} -var defaultProps$2 = __assign(__assign({}, defaultProps$3), { getA11yStatusMessage: getA11yStatusMessage }); -// eslint-disable-next-line import/no-mutable-exports -var validatePropTypes$2 = downshift_esm_noop; -/* istanbul ignore next */ -if (false) {} - -const MenuKeyDownArrowDown = false ? 0 : 0; -const MenuKeyDownArrowUp = false ? 0 : 1; -const MenuKeyDownEscape = false ? 0 : 2; -const MenuKeyDownHome = false ? 0 : 3; -const MenuKeyDownEnd = false ? 0 : 4; -const MenuKeyDownEnter = false ? 0 : 5; -const MenuKeyDownSpaceButton = false ? 0 : 6; -const MenuKeyDownCharacter = false ? 0 : 7; -const MenuBlur = false ? 0 : 8; -const MenuMouseLeave$1 = false ? 0 : 9; -const ItemMouseMove$1 = false ? 0 : 10; -const ItemClick$1 = false ? 0 : 11; -const ToggleButtonClick$1 = false ? 0 : 12; -const ToggleButtonKeyDownArrowDown = false ? 0 : 13; -const ToggleButtonKeyDownArrowUp = false ? 0 : 14; -const ToggleButtonKeyDownCharacter = false ? 0 : 15; -const FunctionToggleMenu$1 = false ? 0 : 16; -const FunctionOpenMenu$1 = false ? 0 : 17; -const FunctionCloseMenu$1 = false ? 0 : 18; -const FunctionSetHighlightedIndex$1 = false ? 0 : 19; -const FunctionSelectItem$1 = false ? 0 : 20; -const FunctionSetInputValue$1 = false ? 0 : 21; -const FunctionReset$2 = false ? 0 : 22; - -var stateChangeTypes$2 = /*#__PURE__*/Object.freeze({ - __proto__: null, - MenuKeyDownArrowDown: MenuKeyDownArrowDown, - MenuKeyDownArrowUp: MenuKeyDownArrowUp, - MenuKeyDownEscape: MenuKeyDownEscape, - MenuKeyDownHome: MenuKeyDownHome, - MenuKeyDownEnd: MenuKeyDownEnd, - MenuKeyDownEnter: MenuKeyDownEnter, - MenuKeyDownSpaceButton: MenuKeyDownSpaceButton, - MenuKeyDownCharacter: MenuKeyDownCharacter, - MenuBlur: MenuBlur, - MenuMouseLeave: MenuMouseLeave$1, - ItemMouseMove: ItemMouseMove$1, - ItemClick: ItemClick$1, - ToggleButtonClick: ToggleButtonClick$1, - ToggleButtonKeyDownArrowDown: ToggleButtonKeyDownArrowDown, - ToggleButtonKeyDownArrowUp: ToggleButtonKeyDownArrowUp, - ToggleButtonKeyDownCharacter: ToggleButtonKeyDownCharacter, - FunctionToggleMenu: FunctionToggleMenu$1, - FunctionOpenMenu: FunctionOpenMenu$1, - FunctionCloseMenu: FunctionCloseMenu$1, - FunctionSetHighlightedIndex: FunctionSetHighlightedIndex$1, - FunctionSelectItem: FunctionSelectItem$1, - FunctionSetInputValue: FunctionSetInputValue$1, - FunctionReset: FunctionReset$2 -}); - -/* eslint-disable complexity */ - -function downshiftSelectReducer(state, action) { - const { - type, - props, - shiftKey - } = action; - let changes; - - switch (type) { - case ItemClick$1: - changes = { - isOpen: getDefaultValue$1(props, 'isOpen'), - highlightedIndex: getDefaultValue$1(props, 'highlightedIndex'), - selectedItem: props.items[action.index] - }; - break; - - case ToggleButtonKeyDownCharacter: - { - const lowercasedKey = action.key; - const inputValue = `${state.inputValue}${lowercasedKey}`; - const itemIndex = getItemIndexByCharacterKey({ - keysSoFar: inputValue, - highlightedIndex: state.selectedItem ? props.items.indexOf(state.selectedItem) : -1, - items: props.items, - itemToString: props.itemToString, - getItemNodeFromIndex: action.getItemNodeFromIndex - }); - changes = { - inputValue, - ...(itemIndex >= 0 && { - selectedItem: props.items[itemIndex] - }) - }; - } - break; - - case ToggleButtonKeyDownArrowDown: - changes = { - highlightedIndex: getHighlightedIndexOnOpen(props, state, 1, action.getItemNodeFromIndex), - isOpen: true - }; - break; - - case ToggleButtonKeyDownArrowUp: - changes = { - highlightedIndex: getHighlightedIndexOnOpen(props, state, -1, action.getItemNodeFromIndex), - isOpen: true - }; - break; - - case MenuKeyDownEnter: - case MenuKeyDownSpaceButton: - changes = { - isOpen: getDefaultValue$1(props, 'isOpen'), - highlightedIndex: getDefaultValue$1(props, 'highlightedIndex'), - ...(state.highlightedIndex >= 0 && { - selectedItem: props.items[state.highlightedIndex] - }) - }; - break; - - case MenuKeyDownHome: - changes = { - highlightedIndex: getNextNonDisabledIndex(1, 0, props.items.length, action.getItemNodeFromIndex, false) - }; - break; - - case MenuKeyDownEnd: - changes = { - highlightedIndex: getNextNonDisabledIndex(-1, props.items.length - 1, props.items.length, action.getItemNodeFromIndex, false) - }; - break; - - case MenuKeyDownEscape: - changes = { - isOpen: false, - highlightedIndex: -1 - }; - break; - - case MenuBlur: - changes = { - isOpen: false, - highlightedIndex: -1 - }; - break; - - case MenuKeyDownCharacter: - { - const lowercasedKey = action.key; - const inputValue = `${state.inputValue}${lowercasedKey}`; - const highlightedIndex = getItemIndexByCharacterKey({ - keysSoFar: inputValue, - highlightedIndex: state.highlightedIndex, - items: props.items, - itemToString: props.itemToString, - getItemNodeFromIndex: action.getItemNodeFromIndex - }); - changes = { - inputValue, - ...(highlightedIndex >= 0 && { - highlightedIndex - }) - }; - } - break; - - case MenuKeyDownArrowDown: - changes = { - highlightedIndex: getNextWrappingIndex(shiftKey ? 5 : 1, state.highlightedIndex, props.items.length, action.getItemNodeFromIndex, props.circularNavigation) - }; - break; - - case MenuKeyDownArrowUp: - changes = { - highlightedIndex: getNextWrappingIndex(shiftKey ? -5 : -1, state.highlightedIndex, props.items.length, action.getItemNodeFromIndex, props.circularNavigation) - }; - break; - - case FunctionSelectItem$1: - changes = { - selectedItem: action.selectedItem - }; - break; - - default: - return downshiftCommonReducer(state, action, stateChangeTypes$2); - } - - return { ...state, - ...changes - }; -} -/* eslint-enable complexity */ - -/* eslint-disable max-statements */ -useSelect.stateChangeTypes = stateChangeTypes$2; - -function useSelect(userProps) { - if (userProps === void 0) { - userProps = {}; - } - - validatePropTypes$2(userProps, useSelect); // Props defaults and destructuring. - - const props = { ...defaultProps$2, - ...userProps - }; - const { - items, - scrollIntoView, - environment, - initialIsOpen, - defaultIsOpen, - itemToString, - getA11ySelectionMessage, - getA11yStatusMessage - } = props; // Initial state depending on controlled props. - - const initialState = getInitialState$2(props); - const [state, dispatch] = useControlledReducer$1(downshiftSelectReducer, initialState, props); - const { - isOpen, - highlightedIndex, - selectedItem, - inputValue - } = state; // Element efs. - - const toggleButtonRef = (0,external_React_.useRef)(null); - const menuRef = (0,external_React_.useRef)(null); - const itemRefs = (0,external_React_.useRef)({}); // used not to trigger menu blur action in some scenarios. - - const shouldBlurRef = (0,external_React_.useRef)(true); // used to keep the inputValue clearTimeout object between renders. - - const clearTimeoutRef = (0,external_React_.useRef)(null); // prevent id re-generation between renders. - - const elementIds = useElementIds(props); // used to keep track of how many items we had on previous cycle. - - const previousResultCountRef = (0,external_React_.useRef)(); - const isInitialMountRef = (0,external_React_.useRef)(true); // utility callback to get item element. - - const latest = downshift_esm_useLatestRef({ - state, - props - }); // Some utils. - - const getItemNodeFromIndex = (0,external_React_.useCallback)(index => itemRefs.current[elementIds.getItemId(index)], [elementIds]); // Effects. - // Sets a11y status message on changes in state. - - useA11yMessageSetter(getA11yStatusMessage, [isOpen, highlightedIndex, inputValue, items], { - isInitialMount: isInitialMountRef.current, - previousResultCount: previousResultCountRef.current, - items, - environment, - itemToString, - ...state - }); // Sets a11y status message on changes in selectedItem. - - useA11yMessageSetter(getA11ySelectionMessage, [selectedItem], { - isInitialMount: isInitialMountRef.current, - previousResultCount: previousResultCountRef.current, - items, - environment, - itemToString, - ...state - }); // Scroll on highlighted item if change comes from keyboard. - - const shouldScrollRef = useScrollIntoView({ - menuElement: menuRef.current, - highlightedIndex, - isOpen, - itemRefs, - scrollIntoView, - getItemNodeFromIndex - }); // Sets cleanup for the keysSoFar callback, debounded after 500ms. - - (0,external_React_.useEffect)(() => { - // init the clean function here as we need access to dispatch. - clearTimeoutRef.current = debounce(outerDispatch => { - outerDispatch({ - type: FunctionSetInputValue$1, - inputValue: '' - }); - }, 500); // Cancel any pending debounced calls on mount - - return () => { - clearTimeoutRef.current.cancel(); - }; - }, []); // Invokes the keysSoFar callback set up above. - - (0,external_React_.useEffect)(() => { - if (!inputValue) { - return; - } - - clearTimeoutRef.current(dispatch); - }, [dispatch, inputValue]); - useControlPropsValidator({ - isInitialMount: isInitialMountRef.current, - props, - state - }); - /* Controls the focus on the menu or the toggle button. */ - - (0,external_React_.useEffect)(() => { - // Don't focus menu on first render. - if (isInitialMountRef.current) { - // Unless it was initialised as open. - if ((initialIsOpen || defaultIsOpen || isOpen) && menuRef.current) { - menuRef.current.focus(); - } - - return; - } // Focus menu on open. - - - if (isOpen) { - // istanbul ignore else - if (menuRef.current) { - menuRef.current.focus(); - } - - return; - } // Focus toggleButton on close, but not if it was closed with (Shift+)Tab. - - - if (environment.document.activeElement === menuRef.current) { - // istanbul ignore else - if (toggleButtonRef.current) { - shouldBlurRef.current = false; - toggleButtonRef.current.focus(); - } - } // eslint-disable-next-line react-hooks/exhaustive-deps - - }, [isOpen]); - (0,external_React_.useEffect)(() => { - if (isInitialMountRef.current) { - return; - } - - previousResultCountRef.current = items.length; - }); // Add mouse/touch events to document. - - const mouseAndTouchTrackersRef = useMouseAndTouchTracker(isOpen, [menuRef, toggleButtonRef], environment, () => { - dispatch({ - type: MenuBlur - }); - }); - const setGetterPropCallInfo = useGetterPropsCalledChecker('getMenuProps', 'getToggleButtonProps'); // Make initial ref false. - - (0,external_React_.useEffect)(() => { - isInitialMountRef.current = false; - }, []); // Reset itemRefs on close. - - (0,external_React_.useEffect)(() => { - if (!isOpen) { - itemRefs.current = {}; - } - }, [isOpen]); // Event handler functions. - - const toggleButtonKeyDownHandlers = (0,external_React_.useMemo)(() => ({ - ArrowDown(event) { - event.preventDefault(); - dispatch({ - type: ToggleButtonKeyDownArrowDown, - getItemNodeFromIndex, - shiftKey: event.shiftKey - }); - }, - - ArrowUp(event) { - event.preventDefault(); - dispatch({ - type: ToggleButtonKeyDownArrowUp, - getItemNodeFromIndex, - shiftKey: event.shiftKey - }); - } - - }), [dispatch, getItemNodeFromIndex]); - const menuKeyDownHandlers = (0,external_React_.useMemo)(() => ({ - ArrowDown(event) { - event.preventDefault(); - dispatch({ - type: MenuKeyDownArrowDown, - getItemNodeFromIndex, - shiftKey: event.shiftKey - }); - }, - - ArrowUp(event) { - event.preventDefault(); - dispatch({ - type: MenuKeyDownArrowUp, - getItemNodeFromIndex, - shiftKey: event.shiftKey - }); - }, - - Home(event) { - event.preventDefault(); - dispatch({ - type: MenuKeyDownHome, - getItemNodeFromIndex - }); - }, - - End(event) { - event.preventDefault(); - dispatch({ - type: MenuKeyDownEnd, - getItemNodeFromIndex - }); - }, - - Escape() { - dispatch({ - type: MenuKeyDownEscape - }); - }, - - Enter(event) { - event.preventDefault(); - dispatch({ - type: MenuKeyDownEnter - }); - }, - - ' '(event) { - event.preventDefault(); - dispatch({ - type: MenuKeyDownSpaceButton - }); - } - - }), [dispatch, getItemNodeFromIndex]); // Action functions. - - const toggleMenu = (0,external_React_.useCallback)(() => { - dispatch({ - type: FunctionToggleMenu$1 - }); - }, [dispatch]); - const closeMenu = (0,external_React_.useCallback)(() => { - dispatch({ - type: FunctionCloseMenu$1 - }); - }, [dispatch]); - const openMenu = (0,external_React_.useCallback)(() => { - dispatch({ - type: FunctionOpenMenu$1 - }); - }, [dispatch]); - const setHighlightedIndex = (0,external_React_.useCallback)(newHighlightedIndex => { - dispatch({ - type: FunctionSetHighlightedIndex$1, - highlightedIndex: newHighlightedIndex - }); - }, [dispatch]); - const selectItem = (0,external_React_.useCallback)(newSelectedItem => { - dispatch({ - type: FunctionSelectItem$1, - selectedItem: newSelectedItem - }); - }, [dispatch]); - const reset = (0,external_React_.useCallback)(() => { - dispatch({ - type: FunctionReset$2 - }); - }, [dispatch]); - const setInputValue = (0,external_React_.useCallback)(newInputValue => { - dispatch({ - type: FunctionSetInputValue$1, - inputValue: newInputValue - }); - }, [dispatch]); // Getter functions. - - const getLabelProps = (0,external_React_.useCallback)(labelProps => ({ - id: elementIds.labelId, - htmlFor: elementIds.toggleButtonId, - ...labelProps - }), [elementIds]); - const getMenuProps = (0,external_React_.useCallback)(function (_temp, _temp2) { - let { - onMouseLeave, - refKey = 'ref', - onKeyDown, - onBlur, - ref, - ...rest - } = _temp === void 0 ? {} : _temp; - let { - suppressRefError = false - } = _temp2 === void 0 ? {} : _temp2; - const latestState = latest.current.state; - - const menuHandleKeyDown = event => { - const key = normalizeArrowKey(event); - - if (key && menuKeyDownHandlers[key]) { - menuKeyDownHandlers[key](event); - } else if (isAcceptedCharacterKey(key)) { - dispatch({ - type: MenuKeyDownCharacter, - key, - getItemNodeFromIndex - }); - } - }; - - const menuHandleBlur = () => { - // if the blur was a result of selection, we don't trigger this action. - if (shouldBlurRef.current === false) { - shouldBlurRef.current = true; - return; - } - - const shouldBlur = !mouseAndTouchTrackersRef.current.isMouseDown; - /* istanbul ignore else */ - - if (shouldBlur) { - dispatch({ - type: MenuBlur - }); - } - }; - - const menuHandleMouseLeave = () => { - dispatch({ - type: MenuMouseLeave$1 - }); - }; - - setGetterPropCallInfo('getMenuProps', suppressRefError, refKey, menuRef); - return { - [refKey]: handleRefs(ref, menuNode => { - menuRef.current = menuNode; - }), - id: elementIds.menuId, - role: 'listbox', - 'aria-labelledby': elementIds.labelId, - tabIndex: -1, - ...(latestState.isOpen && latestState.highlightedIndex > -1 && { - 'aria-activedescendant': elementIds.getItemId(latestState.highlightedIndex) - }), - onMouseLeave: callAllEventHandlers(onMouseLeave, menuHandleMouseLeave), - onKeyDown: callAllEventHandlers(onKeyDown, menuHandleKeyDown), - onBlur: callAllEventHandlers(onBlur, menuHandleBlur), - ...rest - }; - }, [dispatch, latest, menuKeyDownHandlers, mouseAndTouchTrackersRef, setGetterPropCallInfo, elementIds, getItemNodeFromIndex]); - const getToggleButtonProps = (0,external_React_.useCallback)(function (_temp3, _temp4) { - let { - onClick, - onKeyDown, - refKey = 'ref', - ref, - ...rest - } = _temp3 === void 0 ? {} : _temp3; - let { - suppressRefError = false - } = _temp4 === void 0 ? {} : _temp4; - - const toggleButtonHandleClick = () => { - dispatch({ - type: ToggleButtonClick$1 - }); - }; - - const toggleButtonHandleKeyDown = event => { - const key = normalizeArrowKey(event); - - if (key && toggleButtonKeyDownHandlers[key]) { - toggleButtonKeyDownHandlers[key](event); - } else if (isAcceptedCharacterKey(key)) { - dispatch({ - type: ToggleButtonKeyDownCharacter, - key, - getItemNodeFromIndex - }); - } - }; - - const toggleProps = { - [refKey]: handleRefs(ref, toggleButtonNode => { - toggleButtonRef.current = toggleButtonNode; - }), - id: elementIds.toggleButtonId, - 'aria-haspopup': 'listbox', - 'aria-expanded': latest.current.state.isOpen, - 'aria-labelledby': `${elementIds.labelId} ${elementIds.toggleButtonId}`, - ...rest - }; - - if (!rest.disabled) { - toggleProps.onClick = callAllEventHandlers(onClick, toggleButtonHandleClick); - toggleProps.onKeyDown = callAllEventHandlers(onKeyDown, toggleButtonHandleKeyDown); - } - - setGetterPropCallInfo('getToggleButtonProps', suppressRefError, refKey, toggleButtonRef); - return toggleProps; - }, [dispatch, latest, toggleButtonKeyDownHandlers, setGetterPropCallInfo, elementIds, getItemNodeFromIndex]); - const getItemProps = (0,external_React_.useCallback)(function (_temp5) { - let { - item, - index, - onMouseMove, - onClick, - refKey = 'ref', - ref, - disabled, - ...rest - } = _temp5 === void 0 ? {} : _temp5; - const { - state: latestState, - props: latestProps - } = latest.current; - - const itemHandleMouseMove = () => { - if (index === latestState.highlightedIndex) { - return; - } - - shouldScrollRef.current = false; - dispatch({ - type: ItemMouseMove$1, - index, - disabled - }); - }; - - const itemHandleClick = () => { - dispatch({ - type: ItemClick$1, - index - }); - }; - - const itemIndex = getItemIndex(index, item, latestProps.items); - - if (itemIndex < 0) { - throw new Error('Pass either item or item index in getItemProps!'); - } - - const itemProps = { - disabled, - role: 'option', - 'aria-selected': `${itemIndex === latestState.highlightedIndex}`, - id: elementIds.getItemId(itemIndex), - [refKey]: handleRefs(ref, itemNode => { - if (itemNode) { - itemRefs.current[elementIds.getItemId(itemIndex)] = itemNode; - } - }), - ...rest - }; - - if (!disabled) { - itemProps.onClick = callAllEventHandlers(onClick, itemHandleClick); - } - - itemProps.onMouseMove = callAllEventHandlers(onMouseMove, itemHandleMouseMove); - return itemProps; - }, [dispatch, latest, shouldScrollRef, elementIds]); - return { - // prop getters. - getToggleButtonProps, - getLabelProps, - getMenuProps, - getItemProps, - // actions. - toggleMenu, - openMenu, - closeMenu, - setHighlightedIndex, - selectItem, - reset, - setInputValue, - // state. - highlightedIndex, - isOpen, - selectedItem, - inputValue - }; -} - -const InputKeyDownArrowDown = false ? 0 : 0; -const InputKeyDownArrowUp = false ? 0 : 1; -const InputKeyDownEscape = false ? 0 : 2; -const InputKeyDownHome = false ? 0 : 3; -const InputKeyDownEnd = false ? 0 : 4; -const InputKeyDownEnter = false ? 0 : 5; -const InputChange = false ? 0 : 6; -const InputBlur = false ? 0 : 7; -const MenuMouseLeave = false ? 0 : 8; -const ItemMouseMove = false ? 0 : 9; -const ItemClick = false ? 0 : 10; -const ToggleButtonClick = false ? 0 : 11; -const FunctionToggleMenu = false ? 0 : 12; -const FunctionOpenMenu = false ? 0 : 13; -const FunctionCloseMenu = false ? 0 : 14; -const FunctionSetHighlightedIndex = false ? 0 : 15; -const FunctionSelectItem = false ? 0 : 16; -const FunctionSetInputValue = false ? 0 : 17; -const FunctionReset$1 = false ? 0 : 18; -const ControlledPropUpdatedSelectedItem = false ? 0 : 19; - -var stateChangeTypes$1 = /*#__PURE__*/Object.freeze({ - __proto__: null, - InputKeyDownArrowDown: InputKeyDownArrowDown, - InputKeyDownArrowUp: InputKeyDownArrowUp, - InputKeyDownEscape: InputKeyDownEscape, - InputKeyDownHome: InputKeyDownHome, - InputKeyDownEnd: InputKeyDownEnd, - InputKeyDownEnter: InputKeyDownEnter, - InputChange: InputChange, - InputBlur: InputBlur, - MenuMouseLeave: MenuMouseLeave, - ItemMouseMove: ItemMouseMove, - ItemClick: ItemClick, - ToggleButtonClick: ToggleButtonClick, - FunctionToggleMenu: FunctionToggleMenu, - FunctionOpenMenu: FunctionOpenMenu, - FunctionCloseMenu: FunctionCloseMenu, - FunctionSetHighlightedIndex: FunctionSetHighlightedIndex, - FunctionSelectItem: FunctionSelectItem, - FunctionSetInputValue: FunctionSetInputValue, - FunctionReset: FunctionReset$1, - ControlledPropUpdatedSelectedItem: ControlledPropUpdatedSelectedItem -}); - -function getInitialState$1(props) { - const initialState = getInitialState$2(props); - const { - selectedItem - } = initialState; - let { - inputValue - } = initialState; - - if (inputValue === '' && selectedItem && props.defaultInputValue === undefined && props.initialInputValue === undefined && props.inputValue === undefined) { - inputValue = props.itemToString(selectedItem); - } - - return { ...initialState, - inputValue - }; -} - -const propTypes$1 = { - items: (prop_types_default()).array.isRequired, - itemToString: (prop_types_default()).func, - getA11yStatusMessage: (prop_types_default()).func, - getA11ySelectionMessage: (prop_types_default()).func, - circularNavigation: (prop_types_default()).bool, - highlightedIndex: (prop_types_default()).number, - defaultHighlightedIndex: (prop_types_default()).number, - initialHighlightedIndex: (prop_types_default()).number, - isOpen: (prop_types_default()).bool, - defaultIsOpen: (prop_types_default()).bool, - initialIsOpen: (prop_types_default()).bool, - selectedItem: (prop_types_default()).any, - initialSelectedItem: (prop_types_default()).any, - defaultSelectedItem: (prop_types_default()).any, - inputValue: (prop_types_default()).string, - defaultInputValue: (prop_types_default()).string, - initialInputValue: (prop_types_default()).string, - id: (prop_types_default()).string, - labelId: (prop_types_default()).string, - menuId: (prop_types_default()).string, - getItemId: (prop_types_default()).func, - inputId: (prop_types_default()).string, - toggleButtonId: (prop_types_default()).string, - stateReducer: (prop_types_default()).func, - onSelectedItemChange: (prop_types_default()).func, - onHighlightedIndexChange: (prop_types_default()).func, - onStateChange: (prop_types_default()).func, - onIsOpenChange: (prop_types_default()).func, - onInputValueChange: (prop_types_default()).func, - environment: prop_types_default().shape({ - addEventListener: (prop_types_default()).func, - removeEventListener: (prop_types_default()).func, - document: prop_types_default().shape({ - getElementById: (prop_types_default()).func, - activeElement: (prop_types_default()).any, - body: (prop_types_default()).any - }) - }) -}; -/** - * The useCombobox version of useControlledReducer, which also - * checks if the controlled prop selectedItem changed between - * renders. If so, it will also update inputValue with its - * string equivalent. It uses the common useEnhancedReducer to - * compute the rest of the state. - * - * @param {Function} reducer Reducer function from downshift. - * @param {Object} initialState Initial state of the hook. - * @param {Object} props The hook props. - * @returns {Array} An array with the state and an action dispatcher. - */ - -function useControlledReducer(reducer, initialState, props) { - const previousSelectedItemRef = (0,external_React_.useRef)(); - const [state, dispatch] = useEnhancedReducer(reducer, initialState, props); // ToDo: if needed, make same approach as selectedItemChanged from Downshift. - - (0,external_React_.useEffect)(() => { - if (isControlledProp(props, 'selectedItem')) { - if (previousSelectedItemRef.current !== props.selectedItem) { - dispatch({ - type: ControlledPropUpdatedSelectedItem, - inputValue: props.itemToString(props.selectedItem) - }); - } - - previousSelectedItemRef.current = state.selectedItem === previousSelectedItemRef.current ? props.selectedItem : state.selectedItem; - } - }); - return [getState(state, props), dispatch]; -} // eslint-disable-next-line import/no-mutable-exports - - -let validatePropTypes$1 = downshift_esm_noop; -/* istanbul ignore next */ - -if (false) {} - -const defaultProps$1 = { ...defaultProps$3, - getA11yStatusMessage: getA11yStatusMessage$1, - circularNavigation: true -}; - -/* eslint-disable complexity */ - -function downshiftUseComboboxReducer(state, action) { - const { - type, - props, - shiftKey - } = action; - let changes; - - switch (type) { - case ItemClick: - changes = { - isOpen: getDefaultValue$1(props, 'isOpen'), - highlightedIndex: getDefaultValue$1(props, 'highlightedIndex'), - selectedItem: props.items[action.index], - inputValue: props.itemToString(props.items[action.index]) - }; - break; - - case InputKeyDownArrowDown: - if (state.isOpen) { - changes = { - highlightedIndex: getNextWrappingIndex(shiftKey ? 5 : 1, state.highlightedIndex, props.items.length, action.getItemNodeFromIndex, props.circularNavigation) - }; - } else { - changes = { - highlightedIndex: getHighlightedIndexOnOpen(props, state, 1, action.getItemNodeFromIndex), - isOpen: props.items.length >= 0 - }; - } - - break; - - case InputKeyDownArrowUp: - if (state.isOpen) { - changes = { - highlightedIndex: getNextWrappingIndex(shiftKey ? -5 : -1, state.highlightedIndex, props.items.length, action.getItemNodeFromIndex, props.circularNavigation) - }; - } else { - changes = { - highlightedIndex: getHighlightedIndexOnOpen(props, state, -1, action.getItemNodeFromIndex), - isOpen: props.items.length >= 0 - }; - } - - break; - - case InputKeyDownEnter: - changes = { ...(state.isOpen && state.highlightedIndex >= 0 && { - selectedItem: props.items[state.highlightedIndex], - isOpen: getDefaultValue$1(props, 'isOpen'), - highlightedIndex: getDefaultValue$1(props, 'highlightedIndex'), - inputValue: props.itemToString(props.items[state.highlightedIndex]) - }) - }; - break; - - case InputKeyDownEscape: - changes = { - isOpen: false, - highlightedIndex: -1, - ...(!state.isOpen && { - selectedItem: null, - inputValue: '' - }) - }; - break; - - case InputKeyDownHome: - changes = { - highlightedIndex: getNextNonDisabledIndex(1, 0, props.items.length, action.getItemNodeFromIndex, false) - }; - break; - - case InputKeyDownEnd: - changes = { - highlightedIndex: getNextNonDisabledIndex(-1, props.items.length - 1, props.items.length, action.getItemNodeFromIndex, false) - }; - break; - - case InputBlur: - changes = { - isOpen: false, - highlightedIndex: -1, - ...(state.highlightedIndex >= 0 && action.selectItem && { - selectedItem: props.items[state.highlightedIndex], - inputValue: props.itemToString(props.items[state.highlightedIndex]) - }) - }; - break; - - case InputChange: - changes = { - isOpen: true, - highlightedIndex: getDefaultValue$1(props, 'highlightedIndex'), - inputValue: action.inputValue - }; - break; - - case FunctionSelectItem: - changes = { - selectedItem: action.selectedItem, - inputValue: props.itemToString(action.selectedItem) - }; - break; - - case ControlledPropUpdatedSelectedItem: - changes = { - inputValue: action.inputValue - }; - break; - - default: - return downshiftCommonReducer(state, action, stateChangeTypes$1); - } - - return { ...state, - ...changes - }; -} -/* eslint-enable complexity */ - -/* eslint-disable max-statements */ -useCombobox.stateChangeTypes = stateChangeTypes$1; - -function useCombobox(userProps) { - if (userProps === void 0) { - userProps = {}; - } - - validatePropTypes$1(userProps, useCombobox); // Props defaults and destructuring. - - const props = { ...defaultProps$1, - ...userProps - }; - const { - initialIsOpen, - defaultIsOpen, - items, - scrollIntoView, - environment, - getA11yStatusMessage, - getA11ySelectionMessage, - itemToString - } = props; // Initial state depending on controlled props. - - const initialState = getInitialState$1(props); - const [state, dispatch] = useControlledReducer(downshiftUseComboboxReducer, initialState, props); - const { - isOpen, - highlightedIndex, - selectedItem, - inputValue - } = state; // Element refs. - - const menuRef = (0,external_React_.useRef)(null); - const itemRefs = (0,external_React_.useRef)({}); - const inputRef = (0,external_React_.useRef)(null); - const toggleButtonRef = (0,external_React_.useRef)(null); - const comboboxRef = (0,external_React_.useRef)(null); - const isInitialMountRef = (0,external_React_.useRef)(true); // prevent id re-generation between renders. - - const elementIds = useElementIds(props); // used to keep track of how many items we had on previous cycle. - - const previousResultCountRef = (0,external_React_.useRef)(); // utility callback to get item element. - - const latest = downshift_esm_useLatestRef({ - state, - props - }); - const getItemNodeFromIndex = (0,external_React_.useCallback)(index => itemRefs.current[elementIds.getItemId(index)], [elementIds]); // Effects. - // Sets a11y status message on changes in state. - - useA11yMessageSetter(getA11yStatusMessage, [isOpen, highlightedIndex, inputValue, items], { - isInitialMount: isInitialMountRef.current, - previousResultCount: previousResultCountRef.current, - items, - environment, - itemToString, - ...state - }); // Sets a11y status message on changes in selectedItem. - - useA11yMessageSetter(getA11ySelectionMessage, [selectedItem], { - isInitialMount: isInitialMountRef.current, - previousResultCount: previousResultCountRef.current, - items, - environment, - itemToString, - ...state - }); // Scroll on highlighted item if change comes from keyboard. - - const shouldScrollRef = useScrollIntoView({ - menuElement: menuRef.current, - highlightedIndex, - isOpen, - itemRefs, - scrollIntoView, - getItemNodeFromIndex - }); - useControlPropsValidator({ - isInitialMount: isInitialMountRef.current, - props, - state - }); // Focus the input on first render if required. - - (0,external_React_.useEffect)(() => { - const focusOnOpen = initialIsOpen || defaultIsOpen || isOpen; - - if (focusOnOpen && inputRef.current) { - inputRef.current.focus(); - } // eslint-disable-next-line react-hooks/exhaustive-deps - - }, []); - (0,external_React_.useEffect)(() => { - if (isInitialMountRef.current) { - return; - } - - previousResultCountRef.current = items.length; - }); // Add mouse/touch events to document. - - const mouseAndTouchTrackersRef = useMouseAndTouchTracker(isOpen, [comboboxRef, menuRef, toggleButtonRef], environment, () => { - dispatch({ - type: InputBlur, - selectItem: false - }); - }); - const setGetterPropCallInfo = useGetterPropsCalledChecker('getInputProps', 'getComboboxProps', 'getMenuProps'); // Make initial ref false. - - (0,external_React_.useEffect)(() => { - isInitialMountRef.current = false; - }, []); // Reset itemRefs on close. - - (0,external_React_.useEffect)(() => { - if (!isOpen) { - itemRefs.current = {}; - } - }, [isOpen]); - /* Event handler functions */ - - const inputKeyDownHandlers = (0,external_React_.useMemo)(() => ({ - ArrowDown(event) { - event.preventDefault(); - dispatch({ - type: InputKeyDownArrowDown, - shiftKey: event.shiftKey, - getItemNodeFromIndex - }); - }, - - ArrowUp(event) { - event.preventDefault(); - dispatch({ - type: InputKeyDownArrowUp, - shiftKey: event.shiftKey, - getItemNodeFromIndex - }); - }, - - Home(event) { - if (!latest.current.state.isOpen) { - return; - } - - event.preventDefault(); - dispatch({ - type: InputKeyDownHome, - getItemNodeFromIndex - }); - }, - - End(event) { - if (!latest.current.state.isOpen) { - return; - } - - event.preventDefault(); - dispatch({ - type: InputKeyDownEnd, - getItemNodeFromIndex - }); - }, - - Escape(event) { - const latestState = latest.current.state; - - if (latestState.isOpen || latestState.inputValue || latestState.selectedItem || latestState.highlightedIndex > -1) { - event.preventDefault(); - dispatch({ - type: InputKeyDownEscape - }); - } - }, - - Enter(event) { - const latestState = latest.current.state; // if closed or no highlighted index, do nothing. - - if (!latestState.isOpen || latestState.highlightedIndex < 0 || event.which === 229 // if IME composing, wait for next Enter keydown event. - ) { - return; - } - - event.preventDefault(); - dispatch({ - type: InputKeyDownEnter, - getItemNodeFromIndex - }); - } - - }), [dispatch, latest, getItemNodeFromIndex]); // Getter props. - - const getLabelProps = (0,external_React_.useCallback)(labelProps => ({ - id: elementIds.labelId, - htmlFor: elementIds.inputId, - ...labelProps - }), [elementIds]); - const getMenuProps = (0,external_React_.useCallback)(function (_temp, _temp2) { - let { - onMouseLeave, - refKey = 'ref', - ref, - ...rest - } = _temp === void 0 ? {} : _temp; - let { - suppressRefError = false - } = _temp2 === void 0 ? {} : _temp2; - setGetterPropCallInfo('getMenuProps', suppressRefError, refKey, menuRef); - return { - [refKey]: handleRefs(ref, menuNode => { - menuRef.current = menuNode; - }), - id: elementIds.menuId, - role: 'listbox', - 'aria-labelledby': elementIds.labelId, - onMouseLeave: callAllEventHandlers(onMouseLeave, () => { - dispatch({ - type: MenuMouseLeave - }); - }), - ...rest - }; - }, [dispatch, setGetterPropCallInfo, elementIds]); - const getItemProps = (0,external_React_.useCallback)(function (_temp3) { - let { - item, - index, - refKey = 'ref', - ref, - onMouseMove, - onMouseDown, - onClick, - onPress, - disabled, - ...rest - } = _temp3 === void 0 ? {} : _temp3; - const { - props: latestProps, - state: latestState - } = latest.current; - const itemIndex = getItemIndex(index, item, latestProps.items); - - if (itemIndex < 0) { - throw new Error('Pass either item or item index in getItemProps!'); - } - - const onSelectKey = 'onClick'; - const customClickHandler = onClick; - - const itemHandleMouseMove = () => { - if (index === latestState.highlightedIndex) { - return; - } - - shouldScrollRef.current = false; - dispatch({ - type: ItemMouseMove, - index, - disabled - }); - }; - - const itemHandleClick = () => { - dispatch({ - type: ItemClick, - index - }); - }; - - const itemHandleMouseDown = e => e.preventDefault(); - - return { - [refKey]: handleRefs(ref, itemNode => { - if (itemNode) { - itemRefs.current[elementIds.getItemId(itemIndex)] = itemNode; - } - }), - disabled, - role: 'option', - 'aria-selected': `${itemIndex === latestState.highlightedIndex}`, - id: elementIds.getItemId(itemIndex), - ...(!disabled && { - [onSelectKey]: callAllEventHandlers(customClickHandler, itemHandleClick) - }), - onMouseMove: callAllEventHandlers(onMouseMove, itemHandleMouseMove), - onMouseDown: callAllEventHandlers(onMouseDown, itemHandleMouseDown), - ...rest - }; - }, [dispatch, latest, shouldScrollRef, elementIds]); - const getToggleButtonProps = (0,external_React_.useCallback)(function (_temp4) { - let { - onClick, - onPress, - refKey = 'ref', - ref, - ...rest - } = _temp4 === void 0 ? {} : _temp4; - - const toggleButtonHandleClick = () => { - dispatch({ - type: ToggleButtonClick - }); - - if (!latest.current.state.isOpen && inputRef.current) { - inputRef.current.focus(); - } - }; - - return { - [refKey]: handleRefs(ref, toggleButtonNode => { - toggleButtonRef.current = toggleButtonNode; - }), - id: elementIds.toggleButtonId, - tabIndex: -1, - ...(!rest.disabled && { ...({ - onClick: callAllEventHandlers(onClick, toggleButtonHandleClick) - }) - }), - ...rest - }; - }, [dispatch, latest, elementIds]); - const getInputProps = (0,external_React_.useCallback)(function (_temp5, _temp6) { - let { - onKeyDown, - onChange, - onInput, - onBlur, - onChangeText, - refKey = 'ref', - ref, - ...rest - } = _temp5 === void 0 ? {} : _temp5; - let { - suppressRefError = false - } = _temp6 === void 0 ? {} : _temp6; - setGetterPropCallInfo('getInputProps', suppressRefError, refKey, inputRef); - const latestState = latest.current.state; - - const inputHandleKeyDown = event => { - const key = normalizeArrowKey(event); - - if (key && inputKeyDownHandlers[key]) { - inputKeyDownHandlers[key](event); - } - }; - - const inputHandleChange = event => { - dispatch({ - type: InputChange, - inputValue: event.target.value - }); - }; - - const inputHandleBlur = () => { - /* istanbul ignore else */ - if (latestState.isOpen && !mouseAndTouchTrackersRef.current.isMouseDown) { - dispatch({ - type: InputBlur, - selectItem: true - }); - } - }; - /* istanbul ignore next (preact) */ - - - const onChangeKey = 'onChange'; - let eventHandlers = {}; - - if (!rest.disabled) { - eventHandlers = { - [onChangeKey]: callAllEventHandlers(onChange, onInput, inputHandleChange), - onKeyDown: callAllEventHandlers(onKeyDown, inputHandleKeyDown), - onBlur: callAllEventHandlers(onBlur, inputHandleBlur) - }; - } - - return { - [refKey]: handleRefs(ref, inputNode => { - inputRef.current = inputNode; - }), - id: elementIds.inputId, - 'aria-autocomplete': 'list', - 'aria-controls': elementIds.menuId, - ...(latestState.isOpen && latestState.highlightedIndex > -1 && { - 'aria-activedescendant': elementIds.getItemId(latestState.highlightedIndex) - }), - 'aria-labelledby': elementIds.labelId, - // https://developer.mozilla.org/en-US/docs/Web/Security/Securing_your_site/Turning_off_form_autocompletion - // revert back since autocomplete="nope" is ignored on latest Chrome and Opera - autoComplete: 'off', - value: latestState.inputValue, - ...eventHandlers, - ...rest - }; - }, [dispatch, inputKeyDownHandlers, latest, mouseAndTouchTrackersRef, setGetterPropCallInfo, elementIds]); - const getComboboxProps = (0,external_React_.useCallback)(function (_temp7, _temp8) { - let { - refKey = 'ref', - ref, - ...rest - } = _temp7 === void 0 ? {} : _temp7; - let { - suppressRefError = false - } = _temp8 === void 0 ? {} : _temp8; - setGetterPropCallInfo('getComboboxProps', suppressRefError, refKey, comboboxRef); - return { - [refKey]: handleRefs(ref, comboboxNode => { - comboboxRef.current = comboboxNode; - }), - role: 'combobox', - 'aria-haspopup': 'listbox', - 'aria-owns': elementIds.menuId, - 'aria-expanded': latest.current.state.isOpen, - ...rest - }; - }, [latest, setGetterPropCallInfo, elementIds]); // returns - - const toggleMenu = (0,external_React_.useCallback)(() => { - dispatch({ - type: FunctionToggleMenu - }); - }, [dispatch]); - const closeMenu = (0,external_React_.useCallback)(() => { - dispatch({ - type: FunctionCloseMenu - }); - }, [dispatch]); - const openMenu = (0,external_React_.useCallback)(() => { - dispatch({ - type: FunctionOpenMenu - }); - }, [dispatch]); - const setHighlightedIndex = (0,external_React_.useCallback)(newHighlightedIndex => { - dispatch({ - type: FunctionSetHighlightedIndex, - highlightedIndex: newHighlightedIndex - }); - }, [dispatch]); - const selectItem = (0,external_React_.useCallback)(newSelectedItem => { - dispatch({ - type: FunctionSelectItem, - selectedItem: newSelectedItem - }); - }, [dispatch]); - const setInputValue = (0,external_React_.useCallback)(newInputValue => { - dispatch({ - type: FunctionSetInputValue, - inputValue: newInputValue - }); - }, [dispatch]); - const reset = (0,external_React_.useCallback)(() => { - dispatch({ - type: FunctionReset$1 - }); - }, [dispatch]); - return { - // prop getters. - getItemProps, - getLabelProps, - getMenuProps, - getInputProps, - getComboboxProps, - getToggleButtonProps, - // actions. - toggleMenu, - openMenu, - closeMenu, - setHighlightedIndex, - setInputValue, - selectItem, - reset, - // state. - highlightedIndex, - isOpen, - selectedItem, - inputValue - }; -} - -const defaultStateValues = { - activeIndex: -1, - selectedItems: [] -}; -/** - * Returns the initial value for a state key in the following order: - * 1. controlled prop, 2. initial prop, 3. default prop, 4. default - * value from Downshift. - * - * @param {Object} props Props passed to the hook. - * @param {string} propKey Props key to generate the value for. - * @returns {any} The initial value for that prop. - */ - -function getInitialValue(props, propKey) { - return getInitialValue$1(props, propKey, defaultStateValues); -} -/** - * Returns the default value for a state key in the following order: - * 1. controlled prop, 2. default prop, 3. default value from Downshift. - * - * @param {Object} props Props passed to the hook. - * @param {string} propKey Props key to generate the value for. - * @returns {any} The initial value for that prop. - */ - - -function getDefaultValue(props, propKey) { - return getDefaultValue$1(props, propKey, defaultStateValues); -} -/** - * Gets the initial state based on the provided props. It uses initial, default - * and controlled props related to state in order to compute the initial value. - * - * @param {Object} props Props passed to the hook. - * @returns {Object} The initial state. - */ - - -function getInitialState(props) { - const activeIndex = getInitialValue(props, 'activeIndex'); - const selectedItems = getInitialValue(props, 'selectedItems'); - return { - activeIndex, - selectedItems - }; -} -/** - * Returns true if dropdown keydown operation is permitted. Should not be - * allowed on keydown with modifier keys (ctrl, alt, shift, meta), on - * input element with text content that is either highlighted or selection - * cursor is not at the starting position. - * - * @param {KeyboardEvent} event The event from keydown. - * @returns {boolean} Whether the operation is allowed. - */ - - -function isKeyDownOperationPermitted(event) { - if (event.shiftKey || event.metaKey || event.ctrlKey || event.altKey) { - return false; - } - - const element = event.target; - - if (element instanceof HTMLInputElement && // if element is a text input - element.value !== '' && ( // and we have text in it - // and cursor is either not at the start or is currently highlighting text. - element.selectionStart !== 0 || element.selectionEnd !== 0)) { - return false; - } - - return true; -} -/** - * Returns a message to be added to aria-live region when item is removed. - * - * @param {Object} selectionParameters Parameters required to build the message. - * @returns {string} The a11y message. - */ - - -function getA11yRemovalMessage(selectionParameters) { - const { - removedSelectedItem, - itemToString: itemToStringLocal - } = selectionParameters; - return `${itemToStringLocal(removedSelectedItem)} has been removed.`; -} - -const propTypes = { - selectedItems: (prop_types_default()).array, - initialSelectedItems: (prop_types_default()).array, - defaultSelectedItems: (prop_types_default()).array, - itemToString: (prop_types_default()).func, - getA11yRemovalMessage: (prop_types_default()).func, - stateReducer: (prop_types_default()).func, - activeIndex: (prop_types_default()).number, - initialActiveIndex: (prop_types_default()).number, - defaultActiveIndex: (prop_types_default()).number, - onActiveIndexChange: (prop_types_default()).func, - onSelectedItemsChange: (prop_types_default()).func, - keyNavigationNext: (prop_types_default()).string, - keyNavigationPrevious: (prop_types_default()).string, - environment: prop_types_default().shape({ - addEventListener: (prop_types_default()).func, - removeEventListener: (prop_types_default()).func, - document: prop_types_default().shape({ - getElementById: (prop_types_default()).func, - activeElement: (prop_types_default()).any, - body: (prop_types_default()).any - }) - }) -}; -const defaultProps = { - itemToString: defaultProps$3.itemToString, - stateReducer: defaultProps$3.stateReducer, - environment: defaultProps$3.environment, - getA11yRemovalMessage, - keyNavigationNext: 'ArrowRight', - keyNavigationPrevious: 'ArrowLeft' -}; // eslint-disable-next-line import/no-mutable-exports - -let validatePropTypes = downshift_esm_noop; -/* istanbul ignore next */ - -if (false) {} - -const SelectedItemClick = false ? 0 : 0; -const SelectedItemKeyDownDelete = false ? 0 : 1; -const SelectedItemKeyDownBackspace = false ? 0 : 2; -const SelectedItemKeyDownNavigationNext = false ? 0 : 3; -const SelectedItemKeyDownNavigationPrevious = false ? 0 : 4; -const DropdownKeyDownNavigationPrevious = false ? 0 : 5; -const DropdownKeyDownBackspace = false ? 0 : 6; -const DropdownClick = false ? 0 : 7; -const FunctionAddSelectedItem = false ? 0 : 8; -const FunctionRemoveSelectedItem = false ? 0 : 9; -const FunctionSetSelectedItems = false ? 0 : 10; -const FunctionSetActiveIndex = false ? 0 : 11; -const FunctionReset = false ? 0 : 12; - -var stateChangeTypes = /*#__PURE__*/Object.freeze({ - __proto__: null, - SelectedItemClick: SelectedItemClick, - SelectedItemKeyDownDelete: SelectedItemKeyDownDelete, - SelectedItemKeyDownBackspace: SelectedItemKeyDownBackspace, - SelectedItemKeyDownNavigationNext: SelectedItemKeyDownNavigationNext, - SelectedItemKeyDownNavigationPrevious: SelectedItemKeyDownNavigationPrevious, - DropdownKeyDownNavigationPrevious: DropdownKeyDownNavigationPrevious, - DropdownKeyDownBackspace: DropdownKeyDownBackspace, - DropdownClick: DropdownClick, - FunctionAddSelectedItem: FunctionAddSelectedItem, - FunctionRemoveSelectedItem: FunctionRemoveSelectedItem, - FunctionSetSelectedItems: FunctionSetSelectedItems, - FunctionSetActiveIndex: FunctionSetActiveIndex, - FunctionReset: FunctionReset -}); - -/* eslint-disable complexity */ - -function downshiftMultipleSelectionReducer(state, action) { - const { - type, - index, - props, - selectedItem - } = action; - const { - activeIndex, - selectedItems - } = state; - let changes; - - switch (type) { - case SelectedItemClick: - changes = { - activeIndex: index - }; - break; - - case SelectedItemKeyDownNavigationPrevious: - changes = { - activeIndex: activeIndex - 1 < 0 ? 0 : activeIndex - 1 - }; - break; - - case SelectedItemKeyDownNavigationNext: - changes = { - activeIndex: activeIndex + 1 >= selectedItems.length ? -1 : activeIndex + 1 - }; - break; - - case SelectedItemKeyDownBackspace: - case SelectedItemKeyDownDelete: - { - let newActiveIndex = activeIndex; - - if (selectedItems.length === 1) { - newActiveIndex = -1; - } else if (activeIndex === selectedItems.length - 1) { - newActiveIndex = selectedItems.length - 2; - } - - changes = { - selectedItems: [...selectedItems.slice(0, activeIndex), ...selectedItems.slice(activeIndex + 1)], - ...{ - activeIndex: newActiveIndex - } - }; - break; - } - - case DropdownKeyDownNavigationPrevious: - changes = { - activeIndex: selectedItems.length - 1 - }; - break; - - case DropdownKeyDownBackspace: - changes = { - selectedItems: selectedItems.slice(0, selectedItems.length - 1) - }; - break; - - case FunctionAddSelectedItem: - changes = { - selectedItems: [...selectedItems, selectedItem] - }; - break; - - case DropdownClick: - changes = { - activeIndex: -1 - }; - break; - - case FunctionRemoveSelectedItem: - { - let newActiveIndex = activeIndex; - const selectedItemIndex = selectedItems.indexOf(selectedItem); - - if (selectedItemIndex >= 0) { - if (selectedItems.length === 1) { - newActiveIndex = -1; - } else if (selectedItemIndex === selectedItems.length - 1) { - newActiveIndex = selectedItems.length - 2; - } - - changes = { - selectedItems: [...selectedItems.slice(0, selectedItemIndex), ...selectedItems.slice(selectedItemIndex + 1)], - activeIndex: newActiveIndex - }; - } - - break; - } - - case FunctionSetSelectedItems: - { - const { - selectedItems: newSelectedItems - } = action; - changes = { - selectedItems: newSelectedItems - }; - break; - } - - case FunctionSetActiveIndex: - { - const { - activeIndex: newActiveIndex - } = action; - changes = { - activeIndex: newActiveIndex - }; - break; - } - - case FunctionReset: - changes = { - activeIndex: getDefaultValue(props, 'activeIndex'), - selectedItems: getDefaultValue(props, 'selectedItems') - }; - break; - - default: - throw new Error('Reducer called without proper action type.'); - } - - return { ...state, - ...changes - }; -} - -useMultipleSelection.stateChangeTypes = stateChangeTypes; - -function useMultipleSelection(userProps) { - if (userProps === void 0) { - userProps = {}; - } - - validatePropTypes(userProps, useMultipleSelection); // Props defaults and destructuring. - - const props = { ...defaultProps, - ...userProps - }; - const { - getA11yRemovalMessage, - itemToString, - environment, - keyNavigationNext, - keyNavigationPrevious - } = props; // Reducer init. - - const [state, dispatch] = useControlledReducer$1(downshiftMultipleSelectionReducer, getInitialState(props), props); - const { - activeIndex, - selectedItems - } = state; // Refs. - - const isInitialMountRef = (0,external_React_.useRef)(true); - const dropdownRef = (0,external_React_.useRef)(null); - const previousSelectedItemsRef = (0,external_React_.useRef)(selectedItems); - const selectedItemRefs = (0,external_React_.useRef)(); - selectedItemRefs.current = []; - const latest = downshift_esm_useLatestRef({ - state, - props - }); // Effects. - - /* Sets a11y status message on changes in selectedItem. */ - - (0,external_React_.useEffect)(() => { - if (isInitialMountRef.current) { - return; - } - - if (selectedItems.length < previousSelectedItemsRef.current.length) { - const removedSelectedItem = previousSelectedItemsRef.current.find(item => selectedItems.indexOf(item) < 0); - setStatus(getA11yRemovalMessage({ - itemToString, - resultCount: selectedItems.length, - removedSelectedItem, - activeIndex, - activeSelectedItem: selectedItems[activeIndex] - }), environment.document); - } - - previousSelectedItemsRef.current = selectedItems; // eslint-disable-next-line react-hooks/exhaustive-deps - }, [selectedItems.length]); // Sets focus on active item. - - (0,external_React_.useEffect)(() => { - if (isInitialMountRef.current) { - return; - } - - if (activeIndex === -1 && dropdownRef.current) { - dropdownRef.current.focus(); - } else if (selectedItemRefs.current[activeIndex]) { - selectedItemRefs.current[activeIndex].focus(); - } - }, [activeIndex]); - useControlPropsValidator({ - isInitialMount: isInitialMountRef.current, - props, - state - }); - const setGetterPropCallInfo = useGetterPropsCalledChecker('getDropdownProps'); // Make initial ref false. - - (0,external_React_.useEffect)(() => { - isInitialMountRef.current = false; - }, []); // Event handler functions. - - const selectedItemKeyDownHandlers = (0,external_React_.useMemo)(() => ({ - [keyNavigationPrevious]() { - dispatch({ - type: SelectedItemKeyDownNavigationPrevious - }); - }, - - [keyNavigationNext]() { - dispatch({ - type: SelectedItemKeyDownNavigationNext - }); - }, - - Delete() { - dispatch({ - type: SelectedItemKeyDownDelete - }); - }, - - Backspace() { - dispatch({ - type: SelectedItemKeyDownBackspace - }); - } - - }), [dispatch, keyNavigationNext, keyNavigationPrevious]); - const dropdownKeyDownHandlers = (0,external_React_.useMemo)(() => ({ - [keyNavigationPrevious](event) { - if (isKeyDownOperationPermitted(event)) { - dispatch({ - type: DropdownKeyDownNavigationPrevious - }); - } - }, - - Backspace(event) { - if (isKeyDownOperationPermitted(event)) { - dispatch({ - type: DropdownKeyDownBackspace - }); - } - } - - }), [dispatch, keyNavigationPrevious]); // Getter props. - - const getSelectedItemProps = (0,external_React_.useCallback)(function (_temp) { - let { - refKey = 'ref', - ref, - onClick, - onKeyDown, - selectedItem, - index, - ...rest - } = _temp === void 0 ? {} : _temp; - const { - state: latestState - } = latest.current; - const itemIndex = getItemIndex(index, selectedItem, latestState.selectedItems); - - if (itemIndex < 0) { - throw new Error('Pass either selectedItem or index in getSelectedItemProps!'); - } - - const selectedItemHandleClick = () => { - dispatch({ - type: SelectedItemClick, - index - }); - }; - - const selectedItemHandleKeyDown = event => { - const key = normalizeArrowKey(event); - - if (key && selectedItemKeyDownHandlers[key]) { - selectedItemKeyDownHandlers[key](event); - } - }; - - return { - [refKey]: handleRefs(ref, selectedItemNode => { - if (selectedItemNode) { - selectedItemRefs.current.push(selectedItemNode); - } - }), - tabIndex: index === latestState.activeIndex ? 0 : -1, - onClick: callAllEventHandlers(onClick, selectedItemHandleClick), - onKeyDown: callAllEventHandlers(onKeyDown, selectedItemHandleKeyDown), - ...rest - }; - }, [dispatch, latest, selectedItemKeyDownHandlers]); - const getDropdownProps = (0,external_React_.useCallback)(function (_temp2, _temp3) { - let { - refKey = 'ref', - ref, - onKeyDown, - onClick, - preventKeyAction = false, - ...rest - } = _temp2 === void 0 ? {} : _temp2; - let { - suppressRefError = false - } = _temp3 === void 0 ? {} : _temp3; - setGetterPropCallInfo('getDropdownProps', suppressRefError, refKey, dropdownRef); - - const dropdownHandleKeyDown = event => { - const key = normalizeArrowKey(event); - - if (key && dropdownKeyDownHandlers[key]) { - dropdownKeyDownHandlers[key](event); - } - }; - - const dropdownHandleClick = () => { - dispatch({ - type: DropdownClick - }); - }; - - return { - [refKey]: handleRefs(ref, dropdownNode => { - if (dropdownNode) { - dropdownRef.current = dropdownNode; - } - }), - ...(!preventKeyAction && { - onKeyDown: callAllEventHandlers(onKeyDown, dropdownHandleKeyDown), - onClick: callAllEventHandlers(onClick, dropdownHandleClick) - }), - ...rest - }; - }, [dispatch, dropdownKeyDownHandlers, setGetterPropCallInfo]); // returns - - const addSelectedItem = (0,external_React_.useCallback)(selectedItem => { - dispatch({ - type: FunctionAddSelectedItem, - selectedItem - }); - }, [dispatch]); - const removeSelectedItem = (0,external_React_.useCallback)(selectedItem => { - dispatch({ - type: FunctionRemoveSelectedItem, - selectedItem - }); - }, [dispatch]); - const setSelectedItems = (0,external_React_.useCallback)(newSelectedItems => { - dispatch({ - type: FunctionSetSelectedItems, - selectedItems: newSelectedItems - }); - }, [dispatch]); - const setActiveIndex = (0,external_React_.useCallback)(newActiveIndex => { - dispatch({ - type: FunctionSetActiveIndex, - activeIndex: newActiveIndex - }); - }, [dispatch]); - const reset = (0,external_React_.useCallback)(() => { - dispatch({ - type: FunctionReset - }); - }, [dispatch]); - return { - getSelectedItemProps, - getDropdownProps, - addSelectedItem, - removeSelectedItem, - setSelectedItems, - setActiveIndex, - reset, - selectedItems, - activeIndex - }; -} - - - -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/custom-select-control/index.js -// @ts-nocheck -/** - * External dependencies - */ - - - -/** - * WordPress dependencies - */ - - - - -/** - * Internal dependencies - */ - - - - - - - - -const custom_select_control_itemToString = item => item?.name; -// This is needed so that in Windows, where -// the menu does not necessarily open on -// key up/down, you can still switch between -// options with the menu closed. -const custom_select_control_stateReducer = ({ - selectedItem -}, { - type, - changes, - props: { - items - } -}) => { - switch (type) { - case useSelect.stateChangeTypes.ToggleButtonKeyDownArrowDown: - // If we already have a selected item, try to select the next one, - // without circular navigation. Otherwise, select the first item. - return { - selectedItem: items[selectedItem ? Math.min(items.indexOf(selectedItem) + 1, items.length - 1) : 0] - }; - case useSelect.stateChangeTypes.ToggleButtonKeyDownArrowUp: - // If we already have a selected item, try to select the previous one, - // without circular navigation. Otherwise, select the last item. - return { - selectedItem: items[selectedItem ? Math.max(items.indexOf(selectedItem) - 1, 0) : items.length - 1] - }; - default: - return changes; - } -}; -function CustomSelectControl(props) { - const { - /** Start opting into the larger default height that will become the default size in a future version. */ - __next40pxDefaultSize = false, - className, - hideLabelFromVision, - label, - describedBy, - options: items, - onChange: onSelectedItemChange, - /** @type {import('../select-control/types').SelectControlProps.size} */ - size = 'default', - value: _selectedItem, - onMouseOver, - onMouseOut, - onFocus, - onBlur, - __experimentalShowSelectedHint = false - } = useDeprecated36pxDefaultSizeProp(props); - const { - getLabelProps, - getToggleButtonProps, - getMenuProps, - getItemProps, - isOpen, - highlightedIndex, - selectedItem - } = useSelect({ - initialSelectedItem: items[0], - items, - itemToString: custom_select_control_itemToString, - onSelectedItemChange, - ...(typeof _selectedItem !== 'undefined' && _selectedItem !== null ? { - selectedItem: _selectedItem - } : undefined), - stateReducer: custom_select_control_stateReducer - }); - function getDescribedBy() { - if (describedBy) { - return describedBy; - } - if (!selectedItem) { - return (0,external_wp_i18n_namespaceObject.__)('No selection'); - } - - // translators: %s: The selected option. - return (0,external_wp_i18n_namespaceObject.sprintf)((0,external_wp_i18n_namespaceObject.__)('Currently selected: %s'), selectedItem.name); - } - let menuProps = getMenuProps({ - className: 'components-custom-select-control__menu', - 'aria-hidden': !isOpen - }); - const onKeyDownHandler = (0,external_wp_element_namespaceObject.useCallback)(e => { - e.stopPropagation(); - menuProps?.onKeyDown?.(e); - }, [menuProps]); - - // We need this here, because the null active descendant is not fully ARIA compliant. - if (menuProps['aria-activedescendant']?.startsWith('downshift-null')) { - const { - 'aria-activedescendant': ariaActivedescendant, - ...restMenuProps - } = menuProps; - menuProps = restMenuProps; - } - return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { - className: dist_clsx('components-custom-select-control', className), - children: [hideLabelFromVision ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(visually_hidden_component, { - as: "label", - ...getLabelProps(), - children: label - }) : - /*#__PURE__*/ - /* eslint-disable-next-line jsx-a11y/label-has-associated-control, jsx-a11y/label-has-for */ - (0,external_ReactJSXRuntime_namespaceObject.jsx)(StyledLabel, { - ...getLabelProps({ - className: 'components-custom-select-control__label' - }), - children: label - }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(input_base, { - __next40pxDefaultSize: __next40pxDefaultSize, - size: size, - suffix: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(select_control_chevron_down, {}), - children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(Select, { - onMouseOver: onMouseOver, - onMouseOut: onMouseOut, - as: "button", - onFocus: onFocus, - onBlur: onBlur, - selectSize: size, - __next40pxDefaultSize: __next40pxDefaultSize, - ...getToggleButtonProps({ - // This is needed because some speech recognition software don't support `aria-labelledby`. - 'aria-label': label, - 'aria-labelledby': undefined, - className: 'components-custom-select-control__button', - describedBy: getDescribedBy() - }), - children: [custom_select_control_itemToString(selectedItem), __experimentalShowSelectedHint && selectedItem.__experimentalHint && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", { - className: "components-custom-select-control__hint", - children: selectedItem.__experimentalHint - })] - }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { - className: "components-custom-select-control__menu-wrapper", - children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("ul", { - ...menuProps, - onKeyDown: onKeyDownHandler, - children: isOpen && items.map((item, index) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("li", { - ...getItemProps({ - item, - index, - className: dist_clsx(item.className, 'components-custom-select-control__item', { - 'is-highlighted': index === highlightedIndex, - 'has-hint': !!item.__experimentalHint, - 'is-next-40px-default-size': __next40pxDefaultSize - }), - style: item.style - }), - children: [item.name, item.__experimentalHint && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", { - className: "components-custom-select-control__item-hint", - children: item.__experimentalHint - }), item === selectedItem && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(icons_build_module_icon, { - icon: library_check, - className: "components-custom-select-control__item-icon" - })] - }, item.key)) - }) + onChange(changeObject); + }, + value: value?.name, + // Setting the first option as a default value when no value is provided + // is already done natively by the underlying Ariakit component, + // but doing this explicitly avoids the `onChange` callback from firing + // on initial render, thus making this implementation closer to the v1. + defaultValue: options[0]?.name + }); + const children = options.map(applyOptionDeprecations).map(({ + name, + key, + hint, + style, + className + }) => { + const withHint = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(WithHintItemWrapper, { + children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", { + children: name + }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(WithHintItemHint, { + // Keeping the classname for legacy reasons + className: "components-custom-select-control__item-hint", + children: hint })] + }); + return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(custom_select_control_v2_item, { + value: name, + children: hint ? withHint : name, + style: style, + className: dist_clsx(className, + // Keeping the classnames for legacy reasons + 'components-custom-select-control__item', { + 'has-hint': hint + }) + }, key); + }); + const currentValue = useStoreState(store, 'value'); + const renderSelectedValueHint = () => { + const selectedOptionHint = options?.map(applyOptionDeprecations)?.find(({ + name + }) => currentValue === name)?.hint; + return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(SelectedExperimentalHintWrapper, { + children: [currentValue, selectedOptionHint && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(SelectedExperimentalHintItem, { + // Keeping the classname for legacy reasons + className: "components-custom-select-control__hint", + children: selectedOptionHint + })] + }); + }; + const translatedSize = (() => { + if (__next40pxDefaultSize && size === 'default' || size === '__unstable-large') { + return 'default'; + } + if (!__next40pxDefaultSize && size === 'default') { + return 'compact'; + } + return size; + })(); + return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { + children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(custom_select, { + "aria-describedby": descriptionId, + renderSelectedValue: showSelectedHint ? renderSelectedValueHint : undefined, + size: translatedSize, + store: store, + className: dist_clsx( + // Keeping the classname for legacy reasons + 'components-custom-select-control', classNameProp), + isLegacy: true, + ...restProps, + children: children + }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(visually_hidden_component, { + children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", { + id: descriptionId, + children: getDescribedBy(currentValue, describedBy) + }) })] }); } -function StableCustomSelectControl(props) { - return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(CustomSelectControl, { - ...props, - __experimentalShowSelectedHint: false - }); -} - -;// CONCATENATED MODULE: ./node_modules/use-lilius/build/index.es.js - - +/* harmony default export */ const custom_select_control = (CustomSelectControl); + +;// ./node_modules/date-fns/toDate.mjs /** * @name toDate * @category Common Helpers @@ -51873,6 +50166,42 @@ } } +// Fallback for modularized imports: +/* harmony default export */ const date_fns_toDate = ((/* unused pure expression or super */ null && (toDate))); + +;// ./node_modules/date-fns/startOfDay.mjs + + +/** + * @name startOfDay + * @category Day Helpers + * @summary Return the start of a day for the given date. + * + * @description + * Return the start of a day for the given date. + * The result will be in the local timezone. + * + * @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). + * + * @param date - The original date + * + * @returns The start of a day + * + * @example + * // The start of a day for 2 September 2014 11:55:00: + * const result = startOfDay(new Date(2014, 8, 2, 11, 55, 0)) + * //=> Tue Sep 02 2014 00:00:00 + */ +function startOfDay(date) { + const _date = toDate(date); + _date.setHours(0, 0, 0, 0); + return _date; +} + +// Fallback for modularized imports: +/* harmony default export */ const date_fns_startOfDay = ((/* unused pure expression or super */ null && (startOfDay))); + +;// ./node_modules/date-fns/constructFrom.mjs /** * @name constructFrom * @category Generic Helpers @@ -51911,36 +50240,12 @@ } } -/** - * @name addDays - * @category Day Helpers - * @summary Add the specified number of days to the given date. - * - * @description - * Add the specified number of days to the given date. - * - * @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). - * - * @param date - The date to be changed - * @param amount - The amount of days to be added. - * - * @returns The new date with the days added - * - * @example - * // Add 10 days to 1 September 2014: - * const result = addDays(new Date(2014, 8, 1), 10) - * //=> Thu Sep 11 2014 00:00:00 - */ -function addDays(date, amount) { - const _date = toDate(date); - if (isNaN(amount)) return constructFrom(date, NaN); - if (!amount) { - // If 0 days, no-op to avoid changing times in the hour before end of DST - return _date; - } - _date.setDate(_date.getDate() + amount); - return _date; -} +// Fallback for modularized imports: +/* harmony default export */ const date_fns_constructFrom = ((/* unused pure expression or super */ null && (constructFrom))); + +;// ./node_modules/date-fns/addMonths.mjs + + /** * @name addMonths @@ -52007,701 +50312,11 @@ } } -let index_es_defaultOptions = {}; - -function getDefaultOptions() { - return index_es_defaultOptions; -} - -/** - * The {@link startOfWeek} function options. - */ - -/** - * @name startOfWeek - * @category Week Helpers - * @summary Return the start of a week for the given date. - * - * @description - * Return the start of a week for the given date. - * The result will be in the local timezone. - * - * @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). - * - * @param date - The original date - * @param options - An object with options - * - * @returns The start of a week - * - * @example - * // The start of a week for 2 September 2014 11:55:00: - * const result = startOfWeek(new Date(2014, 8, 2, 11, 55, 0)) - * //=> Sun Aug 31 2014 00:00:00 - * - * @example - * // If the week starts on Monday, the start of the week for 2 September 2014 11:55:00: - * const result = startOfWeek(new Date(2014, 8, 2, 11, 55, 0), { weekStartsOn: 1 }) - * //=> Mon Sep 01 2014 00:00:00 - */ -function startOfWeek(date, options) { - const defaultOptions = getDefaultOptions(); - const weekStartsOn = - options?.weekStartsOn ?? - options?.locale?.options?.weekStartsOn ?? - defaultOptions.weekStartsOn ?? - defaultOptions.locale?.options?.weekStartsOn ?? - 0; - - const _date = toDate(date); - const day = _date.getDay(); - const diff = (day < weekStartsOn ? 7 : 0) + day - weekStartsOn; - - _date.setDate(_date.getDate() - diff); - _date.setHours(0, 0, 0, 0); - return _date; -} - -/** - * @name startOfDay - * @category Day Helpers - * @summary Return the start of a day for the given date. - * - * @description - * Return the start of a day for the given date. - * The result will be in the local timezone. - * - * @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). - * - * @param date - The original date - * - * @returns The start of a day - * - * @example - * // The start of a day for 2 September 2014 11:55:00: - * const result = startOfDay(new Date(2014, 8, 2, 11, 55, 0)) - * //=> Tue Sep 02 2014 00:00:00 - */ -function startOfDay(date) { - const _date = toDate(date); - _date.setHours(0, 0, 0, 0); - return _date; -} - -/** - * @name addWeeks - * @category Week Helpers - * @summary Add the specified number of weeks to the given date. - * - * @description - * Add the specified number of week to the given date. - * - * @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). - * - * @param date - The date to be changed - * @param amount - The amount of weeks to be added. - * - * @returns The new date with the weeks added - * - * @example - * // Add 4 weeks to 1 September 2014: - * const result = addWeeks(new Date(2014, 8, 1), 4) - * //=> Mon Sep 29 2014 00:00:00 - */ -function addWeeks(date, amount) { - const days = amount * 7; - return addDays(date, days); -} - -/** - * @name addYears - * @category Year Helpers - * @summary Add the specified number of years to the given date. - * - * @description - * Add the specified number of years to the given date. - * - * @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). - * - * @param date - The date to be changed - * @param amount - The amount of years to be added. - * - * @returns The new date with the years added - * - * @example - * // Add 5 years to 1 September 2014: - * const result = addYears(new Date(2014, 8, 1), 5) - * //=> Sun Sep 01 2019 00:00:00 - */ -function addYears(date, amount) { - return addMonths(date, amount * 12); -} - -/** - * @name endOfMonth - * @category Month Helpers - * @summary Return the end of a month for the given date. - * - * @description - * Return the end of a month for the given date. - * The result will be in the local timezone. - * - * @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). - * - * @param date - The original date - * - * @returns The end of a month - * - * @example - * // The end of a month for 2 September 2014 11:55:00: - * const result = endOfMonth(new Date(2014, 8, 2, 11, 55, 0)) - * //=> Tue Sep 30 2014 23:59:59.999 - */ -function endOfMonth(date) { - const _date = toDate(date); - const month = _date.getMonth(); - _date.setFullYear(_date.getFullYear(), month + 1, 0); - _date.setHours(23, 59, 59, 999); - return _date; -} - -/** - * The {@link eachDayOfInterval} function options. - */ - -/** - * @name eachDayOfInterval - * @category Interval Helpers - * @summary Return the array of dates within the specified time interval. - * - * @description - * Return the array of dates within the specified time interval. - * - * @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). - * - * @param interval - The interval. - * @param options - An object with options. - * - * @returns The array with starts of days from the day of the interval start to the day of the interval end - * - * @example - * // Each day between 6 October 2014 and 10 October 2014: - * const result = eachDayOfInterval({ - * start: new Date(2014, 9, 6), - * end: new Date(2014, 9, 10) - * }) - * //=> [ - * // Mon Oct 06 2014 00:00:00, - * // Tue Oct 07 2014 00:00:00, - * // Wed Oct 08 2014 00:00:00, - * // Thu Oct 09 2014 00:00:00, - * // Fri Oct 10 2014 00:00:00 - * // ] - */ -function eachDayOfInterval(interval, options) { - const startDate = toDate(interval.start); - const endDate = toDate(interval.end); - - let reversed = +startDate > +endDate; - const endTime = reversed ? +startDate : +endDate; - const currentDate = reversed ? endDate : startDate; - currentDate.setHours(0, 0, 0, 0); - - let step = options?.step ?? 1; - if (!step) return []; - if (step < 0) { - step = -step; - reversed = !reversed; - } - - const dates = []; - - while (+currentDate <= endTime) { - dates.push(toDate(currentDate)); - currentDate.setDate(currentDate.getDate() + step); - currentDate.setHours(0, 0, 0, 0); - } - - return reversed ? dates.reverse() : dates; -} - -/** - * The {@link eachMonthOfInterval} function options. - */ - -/** - * @name eachMonthOfInterval - * @category Interval Helpers - * @summary Return the array of months within the specified time interval. - * - * @description - * Return the array of months within the specified time interval. - * - * @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). - * - * @param interval - The interval - * - * @returns The array with starts of months from the month of the interval start to the month of the interval end - * - * @example - * // Each month between 6 February 2014 and 10 August 2014: - * const result = eachMonthOfInterval({ - * start: new Date(2014, 1, 6), - * end: new Date(2014, 7, 10) - * }) - * //=> [ - * // Sat Feb 01 2014 00:00:00, - * // Sat Mar 01 2014 00:00:00, - * // Tue Apr 01 2014 00:00:00, - * // Thu May 01 2014 00:00:00, - * // Sun Jun 01 2014 00:00:00, - * // Tue Jul 01 2014 00:00:00, - * // Fri Aug 01 2014 00:00:00 - * // ] - */ -function eachMonthOfInterval(interval, options) { - const startDate = toDate(interval.start); - const endDate = toDate(interval.end); - - let reversed = +startDate > +endDate; - const endTime = reversed ? +startDate : +endDate; - const currentDate = reversed ? endDate : startDate; - currentDate.setHours(0, 0, 0, 0); - currentDate.setDate(1); - - let step = options?.step ?? 1; - if (!step) return []; - if (step < 0) { - step = -step; - reversed = !reversed; - } - - const dates = []; - - while (+currentDate <= endTime) { - dates.push(toDate(currentDate)); - currentDate.setMonth(currentDate.getMonth() + step); - } - - return reversed ? dates.reverse() : dates; -} - -/** - * The {@link eachWeekOfInterval} function options. - */ - -/** - * @name eachWeekOfInterval - * @category Interval Helpers - * @summary Return the array of weeks within the specified time interval. - * - * @description - * Return the array of weeks within the specified time interval. - * - * @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). - * - * @param interval - The interval. - * @param options - An object with options. - * - * @returns The array with starts of weeks from the week of the interval start to the week of the interval end - * - * @example - * // Each week within interval 6 October 2014 - 23 November 2014: - * const result = eachWeekOfInterval({ - * start: new Date(2014, 9, 6), - * end: new Date(2014, 10, 23) - * }) - * //=> [ - * // Sun Oct 05 2014 00:00:00, - * // Sun Oct 12 2014 00:00:00, - * // Sun Oct 19 2014 00:00:00, - * // Sun Oct 26 2014 00:00:00, - * // Sun Nov 02 2014 00:00:00, - * // Sun Nov 09 2014 00:00:00, - * // Sun Nov 16 2014 00:00:00, - * // Sun Nov 23 2014 00:00:00 - * // ] - */ -function eachWeekOfInterval(interval, options) { - const startDate = toDate(interval.start); - const endDate = toDate(interval.end); - - let reversed = +startDate > +endDate; - const startDateWeek = reversed - ? startOfWeek(endDate, options) - : startOfWeek(startDate, options); - const endDateWeek = reversed - ? startOfWeek(startDate, options) - : startOfWeek(endDate, options); - - // Some timezones switch DST at midnight, making start of day unreliable in these timezones, 3pm is a safe bet - startDateWeek.setHours(15); - endDateWeek.setHours(15); - - const endTime = +endDateWeek.getTime(); - let currentDate = startDateWeek; - - let step = options?.step ?? 1; - if (!step) return []; - if (step < 0) { - step = -step; - reversed = !reversed; - } - - const dates = []; - - while (+currentDate <= endTime) { - currentDate.setHours(0); - dates.push(toDate(currentDate)); - currentDate = addWeeks(currentDate, step); - currentDate.setHours(15); - } - - return reversed ? dates.reverse() : dates; -} - -/** - * @name startOfMonth - * @category Month Helpers - * @summary Return the start of a month for the given date. - * - * @description - * Return the start of a month for the given date. - * The result will be in the local timezone. - * - * @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). - * - * @param date - The original date - * - * @returns The start of a month - * - * @example - * // The start of a month for 2 September 2014 11:55:00: - * const result = startOfMonth(new Date(2014, 8, 2, 11, 55, 0)) - * //=> Mon Sep 01 2014 00:00:00 - */ -function startOfMonth(date) { - const _date = toDate(date); - _date.setDate(1); - _date.setHours(0, 0, 0, 0); - return _date; -} - -/** - * The {@link endOfWeek} function options. - */ - -/** - * @name endOfWeek - * @category Week Helpers - * @summary Return the end of a week for the given date. - * - * @description - * Return the end of a week for the given date. - * The result will be in the local timezone. - * - * @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). - * - * @param date - The original date - * @param options - An object with options - * - * @returns The end of a week - * - * @example - * // The end of a week for 2 September 2014 11:55:00: - * const result = endOfWeek(new Date(2014, 8, 2, 11, 55, 0)) - * //=> Sat Sep 06 2014 23:59:59.999 - * - * @example - * // If the week starts on Monday, the end of the week for 2 September 2014 11:55:00: - * const result = endOfWeek(new Date(2014, 8, 2, 11, 55, 0), { weekStartsOn: 1 }) - * //=> Sun Sep 07 2014 23:59:59.999 - */ -function endOfWeek(date, options) { - const defaultOptions = getDefaultOptions(); - const weekStartsOn = - options?.weekStartsOn ?? - options?.locale?.options?.weekStartsOn ?? - defaultOptions.weekStartsOn ?? - defaultOptions.locale?.options?.weekStartsOn ?? - 0; - - const _date = toDate(date); - const day = _date.getDay(); - const diff = (day < weekStartsOn ? -7 : 0) + 6 - (day - weekStartsOn); - - _date.setDate(_date.getDate() + diff); - _date.setHours(23, 59, 59, 999); - return _date; -} - -/** - * @name getDaysInMonth - * @category Month Helpers - * @summary Get the number of days in a month of the given date. - * - * @description - * Get the number of days in a month of the given date. - * - * @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). - * - * @param date - The given date - * - * @returns The number of days in a month - * - * @example - * // How many days are in February 2000? - * const result = getDaysInMonth(new Date(2000, 1)) - * //=> 29 - */ -function getDaysInMonth(date) { - const _date = toDate(date); - const year = _date.getFullYear(); - const monthIndex = _date.getMonth(); - const lastDayOfMonth = constructFrom(date, 0); - lastDayOfMonth.setFullYear(year, monthIndex + 1, 0); - lastDayOfMonth.setHours(0, 0, 0, 0); - return lastDayOfMonth.getDate(); -} - -/** - * @name isAfter - * @category Common Helpers - * @summary Is the first date after the second one? - * - * @description - * Is the first date after the second one? - * - * @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). - * - * @param date - The date that should be after the other one to return true - * @param dateToCompare - The date to compare with - * - * @returns The first date is after the second date - * - * @example - * // Is 10 July 1989 after 11 February 1987? - * const result = isAfter(new Date(1989, 6, 10), new Date(1987, 1, 11)) - * //=> true - */ -function isAfter(date, dateToCompare) { - const _date = toDate(date); - const _dateToCompare = toDate(dateToCompare); - return _date.getTime() > _dateToCompare.getTime(); -} - -/** - * @name isBefore - * @category Common Helpers - * @summary Is the first date before the second one? - * - * @description - * Is the first date before the second one? - * - * @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). - * - * @param date - The date that should be before the other one to return true - * @param dateToCompare - The date to compare with - * - * @returns The first date is before the second date - * - * @example - * // Is 10 July 1989 before 11 February 1987? - * const result = isBefore(new Date(1989, 6, 10), new Date(1987, 1, 11)) - * //=> false - */ -function isBefore(date, dateToCompare) { - const _date = toDate(date); - const _dateToCompare = toDate(dateToCompare); - return +_date < +_dateToCompare; -} - -/** - * @name isEqual - * @category Common Helpers - * @summary Are the given dates equal? - * - * @description - * Are the given dates equal? - * - * @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). - * - * @param dateLeft - The first date to compare - * @param dateRight - The second date to compare - * - * @returns The dates are equal - * - * @example - * // Are 2 July 2014 06:30:45.000 and 2 July 2014 06:30:45.500 equal? - * const result = isEqual( - * new Date(2014, 6, 2, 6, 30, 45, 0), - * new Date(2014, 6, 2, 6, 30, 45, 500) - * ) - * //=> false - */ -function isEqual(leftDate, rightDate) { - const _dateLeft = toDate(leftDate); - const _dateRight = toDate(rightDate); - return +_dateLeft === +_dateRight; -} - -/** - * @name setMonth - * @category Month Helpers - * @summary Set the month to the given date. - * - * @description - * Set the month to the given date. - * - * @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). - * - * @param date - The date to be changed - * @param month - The month index to set (0-11) - * - * @returns The new date with the month set - * - * @example - * // Set February to 1 September 2014: - * const result = setMonth(new Date(2014, 8, 1), 1) - * //=> Sat Feb 01 2014 00:00:00 - */ -function setMonth(date, month) { - const _date = toDate(date); - const year = _date.getFullYear(); - const day = _date.getDate(); - - const dateWithDesiredMonth = constructFrom(date, 0); - dateWithDesiredMonth.setFullYear(year, month, 15); - dateWithDesiredMonth.setHours(0, 0, 0, 0); - const daysInMonth = getDaysInMonth(dateWithDesiredMonth); - // Set the last day of the new month - // if the original date was the last day of the longer month - _date.setMonth(month, Math.min(day, daysInMonth)); - return _date; -} - -/** - * @name set - * @category Common Helpers - * @summary Set date values to a given date. - * - * @description - * Set date values to a given date. - * - * Sets time values to date from object `values`. - * A value is not set if it is undefined or null or doesn't exist in `values`. - * - * Note about bundle size: `set` does not internally use `setX` functions from date-fns but instead opts - * to use native `Date#setX` methods. If you use this function, you may not want to include the - * other `setX` functions that date-fns provides if you are concerned about the bundle size. - * - * @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). - * - * @param date - The date to be changed - * @param values - The date values to be set - * - * @returns The new date with options set - * - * @example - * // Transform 1 September 2014 into 20 October 2015 in a single line: - * const result = set(new Date(2014, 8, 20), { year: 2015, month: 9, date: 20 }) - * //=> Tue Oct 20 2015 00:00:00 - * - * @example - * // Set 12 PM to 1 September 2014 01:23:45 to 1 September 2014 12:00:00: - * const result = set(new Date(2014, 8, 1, 1, 23, 45), { hours: 12 }) - * //=> Mon Sep 01 2014 12:23:45 - */ - -function set(date, values) { - let _date = toDate(date); - - // Check if date is Invalid Date because Date.prototype.setFullYear ignores the value of Invalid Date - if (isNaN(+_date)) { - return constructFrom(date, NaN); - } - - if (values.year != null) { - _date.setFullYear(values.year); - } - - if (values.month != null) { - _date = setMonth(_date, values.month); - } - - if (values.date != null) { - _date.setDate(values.date); - } - - if (values.hours != null) { - _date.setHours(values.hours); - } - - if (values.minutes != null) { - _date.setMinutes(values.minutes); - } - - if (values.seconds != null) { - _date.setSeconds(values.seconds); - } - - if (values.milliseconds != null) { - _date.setMilliseconds(values.milliseconds); - } - - return _date; -} - -/** - * @name setYear - * @category Year Helpers - * @summary Set the year to the given date. - * - * @description - * Set the year to the given date. - * - * @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). - * - * @param date - The date to be changed - * @param year - The year of the new date - * - * @returns The new date with the year set - * - * @example - * // Set year 2013 to 1 September 2014: - * const result = setYear(new Date(2014, 8, 1), 2013) - * //=> Sun Sep 01 2013 00:00:00 - */ -function setYear(date, year) { - const _date = toDate(date); - - // Check if date is Invalid Date because Date.prototype.setFullYear ignores the value of Invalid Date - if (isNaN(+_date)) { - return constructFrom(date, NaN); - } - - _date.setFullYear(year); - return _date; -} - -/** - * @name startOfToday - * @category Day Helpers - * @summary Return the start of today. - * @pure false - * - * @description - * Return the start of today. - * - * @returns The start of today - * - * @example - * // If today is 6 October 2014: - * const result = startOfToday() - * //=> Mon Oct 6 2014 00:00:00 - */ -function startOfToday() { - return startOfDay(Date.now()); -} +// Fallback for modularized imports: +/* harmony default export */ const date_fns_addMonths = ((/* unused pure expression or super */ null && (addMonths))); + +;// ./node_modules/date-fns/subMonths.mjs + /** * @name subMonths @@ -52727,385 +50342,10 @@ return addMonths(date, -amount); } -/** - * @name subYears - * @category Year Helpers - * @summary Subtract the specified number of years from the given date. - * - * @description - * Subtract the specified number of years from the given date. - * - * @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). - * - * @param date - The date to be changed - * @param amount - The amount of years to be subtracted. - * - * @returns The new date with the years subtracted - * - * @example - * // Subtract 5 years from 1 September 2014: - * const result = subYears(new Date(2014, 8, 1), 5) - * //=> Tue Sep 01 2009 00:00:00 - */ -function subYears(date, amount) { - return addYears(date, -amount); -} - -var Month; -(function (Month) { - Month[Month["JANUARY"] = 0] = "JANUARY"; - Month[Month["FEBRUARY"] = 1] = "FEBRUARY"; - Month[Month["MARCH"] = 2] = "MARCH"; - Month[Month["APRIL"] = 3] = "APRIL"; - Month[Month["MAY"] = 4] = "MAY"; - Month[Month["JUNE"] = 5] = "JUNE"; - Month[Month["JULY"] = 6] = "JULY"; - Month[Month["AUGUST"] = 7] = "AUGUST"; - Month[Month["SEPTEMBER"] = 8] = "SEPTEMBER"; - Month[Month["OCTOBER"] = 9] = "OCTOBER"; - Month[Month["NOVEMBER"] = 10] = "NOVEMBER"; - Month[Month["DECEMBER"] = 11] = "DECEMBER"; -})(Month || (Month = {})); -var Day; -(function (Day) { - Day[Day["SUNDAY"] = 0] = "SUNDAY"; - Day[Day["MONDAY"] = 1] = "MONDAY"; - Day[Day["TUESDAY"] = 2] = "TUESDAY"; - Day[Day["WEDNESDAY"] = 3] = "WEDNESDAY"; - Day[Day["THURSDAY"] = 4] = "THURSDAY"; - Day[Day["FRIDAY"] = 5] = "FRIDAY"; - Day[Day["SATURDAY"] = 6] = "SATURDAY"; -})(Day || (Day = {})); -var inRange = function (date, min, max) { - return (isEqual(date, min) || isAfter(date, min)) && (isEqual(date, max) || isBefore(date, max)); -}; -var index_es_clearTime = function (date) { return set(date, { hours: 0, minutes: 0, seconds: 0, milliseconds: 0 }); }; -var useLilius = function (_a) { - var _b = _a === void 0 ? {} : _a, _c = _b.weekStartsOn, weekStartsOn = _c === void 0 ? Day.SUNDAY : _c, _d = _b.viewing, initialViewing = _d === void 0 ? new Date() : _d, _e = _b.selected, initialSelected = _e === void 0 ? [] : _e, _f = _b.numberOfMonths, numberOfMonths = _f === void 0 ? 1 : _f; - var _g = (0,external_React_.useState)(initialViewing), viewing = _g[0], setViewing = _g[1]; - var viewToday = (0,external_React_.useCallback)(function () { return setViewing(startOfToday()); }, [setViewing]); - var viewMonth = (0,external_React_.useCallback)(function (month) { return setViewing(function (v) { return setMonth(v, month); }); }, []); - var viewPreviousMonth = (0,external_React_.useCallback)(function () { return setViewing(function (v) { return subMonths(v, 1); }); }, []); - var viewNextMonth = (0,external_React_.useCallback)(function () { return setViewing(function (v) { return addMonths(v, 1); }); }, []); - var viewYear = (0,external_React_.useCallback)(function (year) { return setViewing(function (v) { return setYear(v, year); }); }, []); - var viewPreviousYear = (0,external_React_.useCallback)(function () { return setViewing(function (v) { return subYears(v, 1); }); }, []); - var viewNextYear = (0,external_React_.useCallback)(function () { return setViewing(function (v) { return addYears(v, 1); }); }, []); - var _h = (0,external_React_.useState)(initialSelected.map(index_es_clearTime)), selected = _h[0], setSelected = _h[1]; - var clearSelected = function () { return setSelected([]); }; - var isSelected = (0,external_React_.useCallback)(function (date) { return selected.findIndex(function (s) { return isEqual(s, date); }) > -1; }, [selected]); - var select = (0,external_React_.useCallback)(function (date, replaceExisting) { - if (replaceExisting) { - setSelected(Array.isArray(date) ? date : [date]); - } - else { - setSelected(function (selectedItems) { return selectedItems.concat(Array.isArray(date) ? date : [date]); }); - } - }, []); - var deselect = (0,external_React_.useCallback)(function (date) { - return setSelected(function (selectedItems) { - return Array.isArray(date) - ? selectedItems.filter(function (s) { return !date.map(function (d) { return d.getTime(); }).includes(s.getTime()); }) - : selectedItems.filter(function (s) { return !isEqual(s, date); }); - }); - }, []); - var toggle = (0,external_React_.useCallback)(function (date, replaceExisting) { return (isSelected(date) ? deselect(date) : select(date, replaceExisting)); }, [deselect, isSelected, select]); - var selectRange = (0,external_React_.useCallback)(function (start, end, replaceExisting) { - if (replaceExisting) { - setSelected(eachDayOfInterval({ start: start, end: end })); - } - else { - setSelected(function (selectedItems) { return selectedItems.concat(eachDayOfInterval({ start: start, end: end })); }); - } - }, []); - var deselectRange = (0,external_React_.useCallback)(function (start, end) { - setSelected(function (selectedItems) { - return selectedItems.filter(function (s) { - return !eachDayOfInterval({ start: start, end: end }) - .map(function (d) { return d.getTime(); }) - .includes(s.getTime()); - }); - }); - }, []); - var calendar = (0,external_React_.useMemo)(function () { - return eachMonthOfInterval({ - start: startOfMonth(viewing), - end: endOfMonth(addMonths(viewing, numberOfMonths - 1)), - }).map(function (month) { - return eachWeekOfInterval({ - start: startOfMonth(month), - end: endOfMonth(month), - }, { weekStartsOn: weekStartsOn }).map(function (week) { - return eachDayOfInterval({ - start: startOfWeek(week, { weekStartsOn: weekStartsOn }), - end: endOfWeek(week, { weekStartsOn: weekStartsOn }), - }); - }); - }); - }, [viewing, weekStartsOn, numberOfMonths]); - return { - clearTime: index_es_clearTime, - inRange: inRange, - viewing: viewing, - setViewing: setViewing, - viewToday: viewToday, - viewMonth: viewMonth, - viewPreviousMonth: viewPreviousMonth, - viewNextMonth: viewNextMonth, - viewYear: viewYear, - viewPreviousYear: viewPreviousYear, - viewNextYear: viewNextYear, - selected: selected, - setSelected: setSelected, - clearSelected: clearSelected, - isSelected: isSelected, - select: select, - deselect: deselect, - toggle: toggle, - selectRange: selectRange, - deselectRange: deselectRange, - calendar: calendar, - }; -}; - - - -;// CONCATENATED MODULE: ./node_modules/date-fns/toDate.mjs -/** - * @name toDate - * @category Common Helpers - * @summary Convert the given argument to an instance of Date. - * - * @description - * Convert the given argument to an instance of Date. - * - * If the argument is an instance of Date, the function returns its clone. - * - * If the argument is a number, it is treated as a timestamp. - * - * If the argument is none of the above, the function returns Invalid Date. - * - * **Note**: *all* Date arguments passed to any *date-fns* function is processed by `toDate`. - * - * @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). - * - * @param argument - The value to convert - * - * @returns The parsed date in the local time zone - * - * @example - * // Clone the date: - * const result = toDate(new Date(2014, 1, 11, 11, 30, 30)) - * //=> Tue Feb 11 2014 11:30:30 - * - * @example - * // Convert the timestamp to date: - * const result = toDate(1392098430000) - * //=> Tue Feb 11 2014 11:30:30 - */ -function toDate_toDate(argument) { - const argStr = Object.prototype.toString.call(argument); - - // Clone the date - if ( - argument instanceof Date || - (typeof argument === "object" && argStr === "[object Date]") - ) { - // Prevent the date to lose the milliseconds when passed to new Date() in IE10 - return new argument.constructor(+argument); - } else if ( - typeof argument === "number" || - argStr === "[object Number]" || - typeof argument === "string" || - argStr === "[object String]" - ) { - // TODO: Can we get rid of as? - return new Date(argument); - } else { - // TODO: Can we get rid of as? - return new Date(NaN); - } -} - // Fallback for modularized imports: -/* harmony default export */ const date_fns_toDate = ((/* unused pure expression or super */ null && (toDate_toDate))); - -;// CONCATENATED MODULE: ./node_modules/date-fns/startOfDay.mjs - - -/** - * @name startOfDay - * @category Day Helpers - * @summary Return the start of a day for the given date. - * - * @description - * Return the start of a day for the given date. - * The result will be in the local timezone. - * - * @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). - * - * @param date - The original date - * - * @returns The start of a day - * - * @example - * // The start of a day for 2 September 2014 11:55:00: - * const result = startOfDay(new Date(2014, 8, 2, 11, 55, 0)) - * //=> Tue Sep 02 2014 00:00:00 - */ -function startOfDay_startOfDay(date) { - const _date = toDate_toDate(date); - _date.setHours(0, 0, 0, 0); - return _date; -} - -// Fallback for modularized imports: -/* harmony default export */ const date_fns_startOfDay = ((/* unused pure expression or super */ null && (startOfDay_startOfDay))); - -;// CONCATENATED MODULE: ./node_modules/date-fns/constructFrom.mjs -/** - * @name constructFrom - * @category Generic Helpers - * @summary Constructs a date using the reference date and the value - * - * @description - * The function constructs a new date using the constructor from the reference - * date and the given value. It helps to build generic functions that accept - * date extensions. - * - * It defaults to `Date` if the passed reference date is a number or a string. - * - * @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). - * - * @param date - The reference date to take constructor from - * @param value - The value to create the date - * - * @returns Date initialized using the given date and value - * - * @example - * import { constructFrom } from 'date-fns' - * - * // A function that clones a date preserving the original type - * function cloneDate Sun Feb 01 2015 00:00:00 - * - * // Add one month to 30 January 2023: - * const result = addMonths(new Date(2023, 0, 30), 1) - * //=> Tue Feb 28 2023 00:00:00 - */ -function addMonths_addMonths(date, amount) { - const _date = toDate_toDate(date); - if (isNaN(amount)) return constructFrom_constructFrom(date, NaN); - if (!amount) { - // If 0 months, no-op to avoid changing times in the hour before end of DST - return _date; - } - const dayOfMonth = _date.getDate(); - - // The JS Date object supports date math by accepting out-of-bounds values for - // month, day, etc. For example, new Date(2020, 0, 0) returns 31 Dec 2019 and - // new Date(2020, 13, 1) returns 1 Feb 2021. This is *almost* the behavior we - // want except that dates will wrap around the end of a month, meaning that - // new Date(2020, 13, 31) will return 3 Mar 2021 not 28 Feb 2021 as desired. So - // we'll default to the end of the desired month by adding 1 to the desired - // month and using a date of 0 to back up one day to the end of the desired - // month. - const endOfDesiredMonth = constructFrom_constructFrom(date, _date.getTime()); - endOfDesiredMonth.setMonth(_date.getMonth() + amount + 1, 0); - const daysInMonth = endOfDesiredMonth.getDate(); - if (dayOfMonth >= daysInMonth) { - // If we're already at the end of the month, then this is the correct date - // and we're done. - return endOfDesiredMonth; - } else { - // Otherwise, we now know that setting the original day-of-month value won't - // cause an overflow, so set the desired day-of-month. Note that we can't - // just set the date of `endOfDesiredMonth` because that object may have had - // its time changed in the unusual case where where a DST transition was on - // the last day of the month and its local time was in the hour skipped or - // repeated next to a DST transition. So we use `date` instead which is - // guaranteed to still have the original time. - _date.setFullYear( - endOfDesiredMonth.getFullYear(), - endOfDesiredMonth.getMonth(), - dayOfMonth, - ); - return _date; - } -} - -// Fallback for modularized imports: -/* harmony default export */ const date_fns_addMonths = ((/* unused pure expression or super */ null && (addMonths_addMonths))); - -;// CONCATENATED MODULE: ./node_modules/date-fns/subMonths.mjs - - -/** - * @name subMonths - * @category Month Helpers - * @summary Subtract the specified number of months from the given date. - * - * @description - * Subtract the specified number of months from the given date. - * - * @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). - * - * @param date - The date to be changed - * @param amount - The amount of months to be subtracted. - * - * @returns The new date with the months subtracted - * - * @example - * // Subtract 5 months from 1 February 2015: - * const result = subMonths(new Date(2015, 1, 1), 5) - * //=> Mon Sep 01 2014 00:00:00 - */ -function subMonths_subMonths(date, amount) { - return addMonths_addMonths(date, -amount); -} - -// Fallback for modularized imports: -/* harmony default export */ const date_fns_subMonths = ((/* unused pure expression or super */ null && (subMonths_subMonths))); - -;// CONCATENATED MODULE: ./node_modules/date-fns/locale/en-US/_lib/formatDistance.mjs +/* harmony default export */ const date_fns_subMonths = ((/* unused pure expression or super */ null && (subMonths))); + +;// ./node_modules/date-fns/locale/en-US/_lib/formatDistance.mjs const formatDistanceLocale = { lessThanXSeconds: { one: "less than a second", @@ -53208,7 +50448,7 @@ return result; }; -;// CONCATENATED MODULE: ./node_modules/date-fns/locale/_lib/buildFormatLongFn.mjs +;// ./node_modules/date-fns/locale/_lib/buildFormatLongFn.mjs function buildFormatLongFn(args) { return (options = {}) => { // TODO: Remove String() @@ -53218,7 +50458,7 @@ }; } -;// CONCATENATED MODULE: ./node_modules/date-fns/locale/en-US/_lib/formatLong.mjs +;// ./node_modules/date-fns/locale/en-US/_lib/formatLong.mjs const dateFormats = { @@ -53259,7 +50499,7 @@ }), }; -;// CONCATENATED MODULE: ./node_modules/date-fns/locale/en-US/_lib/formatRelative.mjs +;// ./node_modules/date-fns/locale/en-US/_lib/formatRelative.mjs const formatRelativeLocale = { lastWeek: "'last' eeee 'at' p", yesterday: "'yesterday at' p", @@ -53272,7 +50512,7 @@ const formatRelative = (token, _date, _baseDate, _options) => formatRelativeLocale[token]; -;// CONCATENATED MODULE: ./node_modules/date-fns/locale/_lib/buildLocalizeFn.mjs +;// ./node_modules/date-fns/locale/_lib/buildLocalizeFn.mjs /* eslint-disable no-unused-vars */ /** @@ -53338,7 +50578,7 @@ }; } -;// CONCATENATED MODULE: ./node_modules/date-fns/locale/en-US/_lib/localize.mjs +;// ./node_modules/date-fns/locale/en-US/_lib/localize.mjs const eraValues = { @@ -53527,7 +50767,7 @@ }), }; -;// CONCATENATED MODULE: ./node_modules/date-fns/locale/_lib/buildMatchFn.mjs +;// ./node_modules/date-fns/locale/_lib/buildMatchFn.mjs function buildMatchFn(args) { return (string, options = {}) => { const width = options.width; @@ -53586,7 +50826,7 @@ return undefined; } -;// CONCATENATED MODULE: ./node_modules/date-fns/locale/_lib/buildMatchPatternFn.mjs +;// ./node_modules/date-fns/locale/_lib/buildMatchPatternFn.mjs function buildMatchPatternFn(args) { return (string, options = {}) => { const matchResult = string.match(args.matchPattern); @@ -53608,7 +50848,7 @@ }; } -;// CONCATENATED MODULE: ./node_modules/date-fns/locale/en-US/_lib/match.mjs +;// ./node_modules/date-fns/locale/en-US/_lib/match.mjs @@ -53742,7 +50982,7 @@ }), }; -;// CONCATENATED MODULE: ./node_modules/date-fns/locale/en-US.mjs +;// ./node_modules/date-fns/locale/en-US.mjs @@ -53773,10 +51013,10 @@ // Fallback for modularized imports: /* harmony default export */ const en_US = ((/* unused pure expression or super */ null && (enUS))); -;// CONCATENATED MODULE: ./node_modules/date-fns/_lib/defaultOptions.mjs +;// ./node_modules/date-fns/_lib/defaultOptions.mjs let defaultOptions_defaultOptions = {}; -function defaultOptions_getDefaultOptions() { +function getDefaultOptions() { return defaultOptions_defaultOptions; } @@ -53784,7 +51024,7 @@ defaultOptions_defaultOptions = newOptions; } -;// CONCATENATED MODULE: ./node_modules/date-fns/constants.mjs +;// ./node_modules/date-fns/constants.mjs /** * @module constants * @summary Useful constants @@ -53989,7 +51229,7 @@ */ const secondsInQuarter = secondsInMonth * 3; -;// CONCATENATED MODULE: ./node_modules/date-fns/_lib/getTimezoneOffsetInMilliseconds.mjs +;// ./node_modules/date-fns/_lib/getTimezoneOffsetInMilliseconds.mjs /** @@ -54004,7 +51244,7 @@ * This function returns the timezone offset in milliseconds that takes seconds in account. */ function getTimezoneOffsetInMilliseconds(date) { - const _date = toDate_toDate(date); + const _date = toDate(date); const utcDate = new Date( Date.UTC( _date.getFullYear(), @@ -54020,7 +51260,7 @@ return +date - +utcDate; } -;// CONCATENATED MODULE: ./node_modules/date-fns/differenceInCalendarDays.mjs +;// ./node_modules/date-fns/differenceInCalendarDays.mjs @@ -54058,8 +51298,8 @@ * //=> 1 */ function differenceInCalendarDays(dateLeft, dateRight) { - const startOfDayLeft = startOfDay_startOfDay(dateLeft); - const startOfDayRight = startOfDay_startOfDay(dateRight); + const startOfDayLeft = startOfDay(dateLeft); + const startOfDayRight = startOfDay(dateRight); const timestampLeft = +startOfDayLeft - getTimezoneOffsetInMilliseconds(startOfDayLeft); @@ -54075,7 +51315,7 @@ // Fallback for modularized imports: /* harmony default export */ const date_fns_differenceInCalendarDays = ((/* unused pure expression or super */ null && (differenceInCalendarDays))); -;// CONCATENATED MODULE: ./node_modules/date-fns/startOfYear.mjs +;// ./node_modules/date-fns/startOfYear.mjs @@ -54100,8 +51340,8 @@ * //=> Wed Jan 01 2014 00:00:00 */ function startOfYear(date) { - const cleanDate = toDate_toDate(date); - const _date = constructFrom_constructFrom(date, 0); + const cleanDate = toDate(date); + const _date = constructFrom(date, 0); _date.setFullYear(cleanDate.getFullYear(), 0, 1); _date.setHours(0, 0, 0, 0); return _date; @@ -54110,7 +51350,7 @@ // Fallback for modularized imports: /* harmony default export */ const date_fns_startOfYear = ((/* unused pure expression or super */ null && (startOfYear))); -;// CONCATENATED MODULE: ./node_modules/date-fns/getDayOfYear.mjs +;// ./node_modules/date-fns/getDayOfYear.mjs @@ -54135,7 +51375,7 @@ * //=> 183 */ function getDayOfYear(date) { - const _date = toDate_toDate(date); + const _date = toDate(date); const diff = differenceInCalendarDays(_date, startOfYear(_date)); const dayOfYear = diff + 1; return dayOfYear; @@ -54144,7 +51384,7 @@ // Fallback for modularized imports: /* harmony default export */ const date_fns_getDayOfYear = ((/* unused pure expression or super */ null && (getDayOfYear))); -;// CONCATENATED MODULE: ./node_modules/date-fns/startOfWeek.mjs +;// ./node_modules/date-fns/startOfWeek.mjs @@ -54178,8 +51418,8 @@ * const result = startOfWeek(new Date(2014, 8, 2, 11, 55, 0), { weekStartsOn: 1 }) * //=> Mon Sep 01 2014 00:00:00 */ -function startOfWeek_startOfWeek(date, options) { - const defaultOptions = defaultOptions_getDefaultOptions(); +function startOfWeek(date, options) { + const defaultOptions = getDefaultOptions(); const weekStartsOn = options?.weekStartsOn ?? options?.locale?.options?.weekStartsOn ?? @@ -54187,7 +51427,7 @@ defaultOptions.locale?.options?.weekStartsOn ?? 0; - const _date = toDate_toDate(date); + const _date = toDate(date); const day = _date.getDay(); const diff = (day < weekStartsOn ? 7 : 0) + day - weekStartsOn; @@ -54197,9 +51437,9 @@ } // Fallback for modularized imports: -/* harmony default export */ const date_fns_startOfWeek = ((/* unused pure expression or super */ null && (startOfWeek_startOfWeek))); - -;// CONCATENATED MODULE: ./node_modules/date-fns/startOfISOWeek.mjs +/* harmony default export */ const date_fns_startOfWeek = ((/* unused pure expression or super */ null && (startOfWeek))); + +;// ./node_modules/date-fns/startOfISOWeek.mjs /** @@ -54225,13 +51465,13 @@ * //=> Mon Sep 01 2014 00:00:00 */ function startOfISOWeek(date) { - return startOfWeek_startOfWeek(date, { weekStartsOn: 1 }); + return startOfWeek(date, { weekStartsOn: 1 }); } // Fallback for modularized imports: /* harmony default export */ const date_fns_startOfISOWeek = ((/* unused pure expression or super */ null && (startOfISOWeek))); -;// CONCATENATED MODULE: ./node_modules/date-fns/getISOWeekYear.mjs +;// ./node_modules/date-fns/getISOWeekYear.mjs @@ -54259,15 +51499,15 @@ * //=> 2004 */ function getISOWeekYear(date) { - const _date = toDate_toDate(date); + const _date = toDate(date); const year = _date.getFullYear(); - const fourthOfJanuaryOfNextYear = constructFrom_constructFrom(date, 0); + const fourthOfJanuaryOfNextYear = constructFrom(date, 0); fourthOfJanuaryOfNextYear.setFullYear(year + 1, 0, 4); fourthOfJanuaryOfNextYear.setHours(0, 0, 0, 0); const startOfNextYear = startOfISOWeek(fourthOfJanuaryOfNextYear); - const fourthOfJanuaryOfThisYear = constructFrom_constructFrom(date, 0); + const fourthOfJanuaryOfThisYear = constructFrom(date, 0); fourthOfJanuaryOfThisYear.setFullYear(year, 0, 4); fourthOfJanuaryOfThisYear.setHours(0, 0, 0, 0); const startOfThisYear = startOfISOWeek(fourthOfJanuaryOfThisYear); @@ -54284,7 +51524,7 @@ // Fallback for modularized imports: /* harmony default export */ const date_fns_getISOWeekYear = ((/* unused pure expression or super */ null && (getISOWeekYear))); -;// CONCATENATED MODULE: ./node_modules/date-fns/startOfISOWeekYear.mjs +;// ./node_modules/date-fns/startOfISOWeekYear.mjs @@ -54314,7 +51554,7 @@ */ function startOfISOWeekYear(date) { const year = getISOWeekYear(date); - const fourthOfJanuary = constructFrom_constructFrom(date, 0); + const fourthOfJanuary = constructFrom(date, 0); fourthOfJanuary.setFullYear(year, 0, 4); fourthOfJanuary.setHours(0, 0, 0, 0); return startOfISOWeek(fourthOfJanuary); @@ -54323,7 +51563,7 @@ // Fallback for modularized imports: /* harmony default export */ const date_fns_startOfISOWeekYear = ((/* unused pure expression or super */ null && (startOfISOWeekYear))); -;// CONCATENATED MODULE: ./node_modules/date-fns/getISOWeek.mjs +;// ./node_modules/date-fns/getISOWeek.mjs @@ -54351,7 +51591,7 @@ * //=> 53 */ function getISOWeek(date) { - const _date = toDate_toDate(date); + const _date = toDate(date); const diff = +startOfISOWeek(_date) - +startOfISOWeekYear(_date); // Round the number of weeks to the nearest integer because the number of @@ -54363,7 +51603,7 @@ // Fallback for modularized imports: /* harmony default export */ const date_fns_getISOWeek = ((/* unused pure expression or super */ null && (getISOWeek))); -;// CONCATENATED MODULE: ./node_modules/date-fns/getWeekYear.mjs +;// ./node_modules/date-fns/getWeekYear.mjs @@ -54410,10 +51650,10 @@ * //=> 2004 */ function getWeekYear(date, options) { - const _date = toDate_toDate(date); + const _date = toDate(date); const year = _date.getFullYear(); - const defaultOptions = defaultOptions_getDefaultOptions(); + const defaultOptions = getDefaultOptions(); const firstWeekContainsDate = options?.firstWeekContainsDate ?? options?.locale?.options?.firstWeekContainsDate ?? @@ -54421,15 +51661,15 @@ defaultOptions.locale?.options?.firstWeekContainsDate ?? 1; - const firstWeekOfNextYear = constructFrom_constructFrom(date, 0); + const firstWeekOfNextYear = constructFrom(date, 0); firstWeekOfNextYear.setFullYear(year + 1, 0, firstWeekContainsDate); firstWeekOfNextYear.setHours(0, 0, 0, 0); - const startOfNextYear = startOfWeek_startOfWeek(firstWeekOfNextYear, options); - - const firstWeekOfThisYear = constructFrom_constructFrom(date, 0); + const startOfNextYear = startOfWeek(firstWeekOfNextYear, options); + + const firstWeekOfThisYear = constructFrom(date, 0); firstWeekOfThisYear.setFullYear(year, 0, firstWeekContainsDate); firstWeekOfThisYear.setHours(0, 0, 0, 0); - const startOfThisYear = startOfWeek_startOfWeek(firstWeekOfThisYear, options); + const startOfThisYear = startOfWeek(firstWeekOfThisYear, options); if (_date.getTime() >= startOfNextYear.getTime()) { return year + 1; @@ -54443,7 +51683,7 @@ // Fallback for modularized imports: /* harmony default export */ const date_fns_getWeekYear = ((/* unused pure expression or super */ null && (getWeekYear))); -;// CONCATENATED MODULE: ./node_modules/date-fns/startOfWeekYear.mjs +;// ./node_modules/date-fns/startOfWeekYear.mjs @@ -54490,7 +51730,7 @@ * //=> Mon Jan 03 2005 00:00:00 */ function startOfWeekYear(date, options) { - const defaultOptions = defaultOptions_getDefaultOptions(); + const defaultOptions = getDefaultOptions(); const firstWeekContainsDate = options?.firstWeekContainsDate ?? options?.locale?.options?.firstWeekContainsDate ?? @@ -54499,17 +51739,17 @@ 1; const year = getWeekYear(date, options); - const firstWeek = constructFrom_constructFrom(date, 0); + const firstWeek = constructFrom(date, 0); firstWeek.setFullYear(year, 0, firstWeekContainsDate); firstWeek.setHours(0, 0, 0, 0); - const _date = startOfWeek_startOfWeek(firstWeek, options); + const _date = startOfWeek(firstWeek, options); return _date; } // Fallback for modularized imports: /* harmony default export */ const date_fns_startOfWeekYear = ((/* unused pure expression or super */ null && (startOfWeekYear))); -;// CONCATENATED MODULE: ./node_modules/date-fns/getWeek.mjs +;// ./node_modules/date-fns/getWeek.mjs @@ -54557,8 +51797,8 @@ */ function getWeek(date, options) { - const _date = toDate_toDate(date); - const diff = +startOfWeek_startOfWeek(_date, options) - +startOfWeekYear(_date, options); + const _date = toDate(date); + const diff = +startOfWeek(_date, options) - +startOfWeekYear(_date, options); // Round the number of weeks to the nearest integer because the number of // milliseconds in a week is not constant (e.g. it's different in the week of @@ -54569,14 +51809,14 @@ // Fallback for modularized imports: /* harmony default export */ const date_fns_getWeek = ((/* unused pure expression or super */ null && (getWeek))); -;// CONCATENATED MODULE: ./node_modules/date-fns/_lib/addLeadingZeros.mjs +;// ./node_modules/date-fns/_lib/addLeadingZeros.mjs function addLeadingZeros(number, targetLength) { const sign = number < 0 ? "-" : ""; const output = Math.abs(number).toString().padStart(targetLength, "0"); return sign + output; } -;// CONCATENATED MODULE: ./node_modules/date-fns/_lib/format/lightFormatters.mjs +;// ./node_modules/date-fns/_lib/format/lightFormatters.mjs /* @@ -54670,7 +51910,7 @@ }, }; -;// CONCATENATED MODULE: ./node_modules/date-fns/_lib/format/formatters.mjs +;// ./node_modules/date-fns/_lib/format/formatters.mjs @@ -55448,7 +52688,7 @@ return sign + hours + delimiter + minutes; } -;// CONCATENATED MODULE: ./node_modules/date-fns/_lib/format/longFormatters.mjs +;// ./node_modules/date-fns/_lib/format/longFormatters.mjs const dateLongFormatter = (pattern, formatLong) => { switch (pattern) { case "P": @@ -55514,7 +52754,7 @@ P: dateTimeLongFormatter, }; -;// CONCATENATED MODULE: ./node_modules/date-fns/_lib/protectedTokens.mjs +;// ./node_modules/date-fns/_lib/protectedTokens.mjs const dayOfYearTokenRE = /^D+$/; const weekYearTokenRE = /^Y+$/; @@ -55539,7 +52779,7 @@ 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`; } -;// CONCATENATED MODULE: ./node_modules/date-fns/isDate.mjs +;// ./node_modules/date-fns/isDate.mjs /** * @name isDate * @category Common Helpers @@ -55583,7 +52823,7 @@ // Fallback for modularized imports: /* harmony default export */ const date_fns_isDate = ((/* unused pure expression or super */ null && (isDate))); -;// CONCATENATED MODULE: ./node_modules/date-fns/isValid.mjs +;// ./node_modules/date-fns/isValid.mjs @@ -55624,14 +52864,14 @@ if (!isDate(date) && typeof date !== "number") { return false; } - const _date = toDate_toDate(date); + const _date = toDate(date); return !isNaN(Number(_date)); } // Fallback for modularized imports: /* harmony default export */ const date_fns_isValid = ((/* unused pure expression or super */ null && (isValid))); -;// CONCATENATED MODULE: ./node_modules/date-fns/format.mjs +;// ./node_modules/date-fns/format.mjs @@ -55959,7 +53199,7 @@ * //=> "3 o'clock" */ function format(date, formatStr, options) { - const defaultOptions = defaultOptions_getDefaultOptions(); + const defaultOptions = getDefaultOptions(); const locale = options?.locale ?? defaultOptions.locale ?? enUS; const firstWeekContainsDate = @@ -55976,7 +53216,7 @@ defaultOptions.locale?.options?.weekStartsOn ?? 0; - const originalDate = toDate_toDate(date); + const originalDate = toDate(date); if (!isValid(originalDate)) { throw new RangeError("Invalid time value"); @@ -56065,7 +53305,7 @@ // Fallback for modularized imports: /* harmony default export */ const date_fns_format = ((/* unused pure expression or super */ null && (format))); -;// CONCATENATED MODULE: ./node_modules/date-fns/isSameMonth.mjs +;// ./node_modules/date-fns/isSameMonth.mjs /** @@ -56094,8 +53334,8 @@ * //=> false */ function isSameMonth(dateLeft, dateRight) { - const _dateLeft = toDate_toDate(dateLeft); - const _dateRight = toDate_toDate(dateRight); + const _dateLeft = toDate(dateLeft); + const _dateRight = toDate(dateRight); return ( _dateLeft.getFullYear() === _dateRight.getFullYear() && _dateLeft.getMonth() === _dateRight.getMonth() @@ -56105,7 +53345,7 @@ // Fallback for modularized imports: /* harmony default export */ const date_fns_isSameMonth = ((/* unused pure expression or super */ null && (isSameMonth))); -;// CONCATENATED MODULE: ./node_modules/date-fns/isEqual.mjs +;// ./node_modules/date-fns/isEqual.mjs /** @@ -56131,16 +53371,16 @@ * ) * //=> false */ -function isEqual_isEqual(leftDate, rightDate) { - const _dateLeft = toDate_toDate(leftDate); - const _dateRight = toDate_toDate(rightDate); +function isEqual(leftDate, rightDate) { + const _dateLeft = toDate(leftDate); + const _dateRight = toDate(rightDate); return +_dateLeft === +_dateRight; } // Fallback for modularized imports: -/* harmony default export */ const date_fns_isEqual = ((/* unused pure expression or super */ null && (isEqual_isEqual))); - -;// CONCATENATED MODULE: ./node_modules/date-fns/isSameDay.mjs +/* harmony default export */ const date_fns_isEqual = ((/* unused pure expression or super */ null && (isEqual))); + +;// ./node_modules/date-fns/isSameDay.mjs /** @@ -56174,8 +53414,8 @@ * //=> false */ function isSameDay(dateLeft, dateRight) { - const dateLeftStartOfDay = startOfDay_startOfDay(dateLeft); - const dateRightStartOfDay = startOfDay_startOfDay(dateRight); + const dateLeftStartOfDay = startOfDay(dateLeft); + const dateRightStartOfDay = startOfDay(dateRight); return +dateLeftStartOfDay === +dateRightStartOfDay; } @@ -56183,7 +53423,7 @@ // Fallback for modularized imports: /* harmony default export */ const date_fns_isSameDay = ((/* unused pure expression or super */ null && (isSameDay))); -;// CONCATENATED MODULE: ./node_modules/date-fns/addDays.mjs +;// ./node_modules/date-fns/addDays.mjs @@ -56207,9 +53447,9 @@ * const result = addDays(new Date(2014, 8, 1), 10) * //=> Thu Sep 11 2014 00:00:00 */ -function addDays_addDays(date, amount) { - const _date = toDate_toDate(date); - if (isNaN(amount)) return constructFrom_constructFrom(date, NaN); +function addDays(date, amount) { + const _date = toDate(date); + if (isNaN(amount)) return constructFrom(date, NaN); if (!amount) { // If 0 days, no-op to avoid changing times in the hour before end of DST return _date; @@ -56219,9 +53459,9 @@ } // Fallback for modularized imports: -/* harmony default export */ const date_fns_addDays = ((/* unused pure expression or super */ null && (addDays_addDays))); - -;// CONCATENATED MODULE: ./node_modules/date-fns/addWeeks.mjs +/* harmony default export */ const date_fns_addDays = ((/* unused pure expression or super */ null && (addDays))); + +;// ./node_modules/date-fns/addWeeks.mjs /** @@ -56244,15 +53484,15 @@ * const result = addWeeks(new Date(2014, 8, 1), 4) * //=> Mon Sep 29 2014 00:00:00 */ -function addWeeks_addWeeks(date, amount) { +function addWeeks(date, amount) { const days = amount * 7; - return addDays_addDays(date, days); + return addDays(date, days); } // Fallback for modularized imports: -/* harmony default export */ const date_fns_addWeeks = ((/* unused pure expression or super */ null && (addWeeks_addWeeks))); - -;// CONCATENATED MODULE: ./node_modules/date-fns/subWeeks.mjs +/* harmony default export */ const date_fns_addWeeks = ((/* unused pure expression or super */ null && (addWeeks))); + +;// ./node_modules/date-fns/subWeeks.mjs /** @@ -56276,13 +53516,13 @@ * //=> Mon Aug 04 2014 00:00:00 */ function subWeeks(date, amount) { - return addWeeks_addWeeks(date, -amount); + return addWeeks(date, -amount); } // Fallback for modularized imports: /* harmony default export */ const date_fns_subWeeks = ((/* unused pure expression or super */ null && (subWeeks))); -;// CONCATENATED MODULE: ./node_modules/date-fns/endOfWeek.mjs +;// ./node_modules/date-fns/endOfWeek.mjs @@ -56316,8 +53556,8 @@ * const result = endOfWeek(new Date(2014, 8, 2, 11, 55, 0), { weekStartsOn: 1 }) * //=> Sun Sep 07 2014 23:59:59.999 */ -function endOfWeek_endOfWeek(date, options) { - const defaultOptions = defaultOptions_getDefaultOptions(); +function endOfWeek(date, options) { + const defaultOptions = getDefaultOptions(); const weekStartsOn = options?.weekStartsOn ?? options?.locale?.options?.weekStartsOn ?? @@ -56325,7 +53565,7 @@ defaultOptions.locale?.options?.weekStartsOn ?? 0; - const _date = toDate_toDate(date); + const _date = toDate(date); const day = _date.getDay(); const diff = (day < weekStartsOn ? -7 : 0) + 6 - (day - weekStartsOn); @@ -56335,9 +53575,9 @@ } // Fallback for modularized imports: -/* harmony default export */ const date_fns_endOfWeek = ((/* unused pure expression or super */ null && (endOfWeek_endOfWeek))); - -;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/arrow-right.js +/* harmony default export */ const date_fns_endOfWeek = ((/* unused pure expression or super */ null && (endOfWeek))); + +;// ./node_modules/@wordpress/icons/build-module/library/arrow-right.js /** * WordPress dependencies */ @@ -56352,7 +53592,7 @@ }); /* harmony default export */ const arrow_right = (arrowRight); -;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/arrow-left.js +;// ./node_modules/@wordpress/icons/build-module/library/arrow-left.js /** * WordPress dependencies */ @@ -56367,11 +53607,799 @@ }); /* harmony default export */ const arrow_left = (arrowLeft); -;// CONCATENATED MODULE: external ["wp","date"] +;// external ["wp","date"] const external_wp_date_namespaceObject = window["wp"]["date"]; -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/date-time/date/styles.js - -function date_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)."; } +;// ./node_modules/date-fns/isAfter.mjs + + +/** + * @name isAfter + * @category Common Helpers + * @summary Is the first date after the second one? + * + * @description + * Is the first date after the second one? + * + * @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). + * + * @param date - The date that should be after the other one to return true + * @param dateToCompare - The date to compare with + * + * @returns The first date is after the second date + * + * @example + * // Is 10 July 1989 after 11 February 1987? + * const result = isAfter(new Date(1989, 6, 10), new Date(1987, 1, 11)) + * //=> true + */ +function isAfter(date, dateToCompare) { + const _date = toDate(date); + const _dateToCompare = toDate(dateToCompare); + return _date.getTime() > _dateToCompare.getTime(); +} + +// Fallback for modularized imports: +/* harmony default export */ const date_fns_isAfter = ((/* unused pure expression or super */ null && (isAfter))); + +;// ./node_modules/date-fns/isBefore.mjs + + +/** + * @name isBefore + * @category Common Helpers + * @summary Is the first date before the second one? + * + * @description + * Is the first date before the second one? + * + * @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). + * + * @param date - The date that should be before the other one to return true + * @param dateToCompare - The date to compare with + * + * @returns The first date is before the second date + * + * @example + * // Is 10 July 1989 before 11 February 1987? + * const result = isBefore(new Date(1989, 6, 10), new Date(1987, 1, 11)) + * //=> false + */ +function isBefore(date, dateToCompare) { + const _date = toDate(date); + const _dateToCompare = toDate(dateToCompare); + return +_date < +_dateToCompare; +} + +// Fallback for modularized imports: +/* harmony default export */ const date_fns_isBefore = ((/* unused pure expression or super */ null && (isBefore))); + +;// ./node_modules/date-fns/getDaysInMonth.mjs + + + +/** + * @name getDaysInMonth + * @category Month Helpers + * @summary Get the number of days in a month of the given date. + * + * @description + * Get the number of days in a month of the given date. + * + * @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). + * + * @param date - The given date + * + * @returns The number of days in a month + * + * @example + * // How many days are in February 2000? + * const result = getDaysInMonth(new Date(2000, 1)) + * //=> 29 + */ +function getDaysInMonth(date) { + const _date = toDate(date); + const year = _date.getFullYear(); + const monthIndex = _date.getMonth(); + const lastDayOfMonth = constructFrom(date, 0); + lastDayOfMonth.setFullYear(year, monthIndex + 1, 0); + lastDayOfMonth.setHours(0, 0, 0, 0); + return lastDayOfMonth.getDate(); +} + +// Fallback for modularized imports: +/* harmony default export */ const date_fns_getDaysInMonth = ((/* unused pure expression or super */ null && (getDaysInMonth))); + +;// ./node_modules/date-fns/setMonth.mjs + + + + +/** + * @name setMonth + * @category Month Helpers + * @summary Set the month to the given date. + * + * @description + * Set the month to the given date. + * + * @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). + * + * @param date - The date to be changed + * @param month - The month index to set (0-11) + * + * @returns The new date with the month set + * + * @example + * // Set February to 1 September 2014: + * const result = setMonth(new Date(2014, 8, 1), 1) + * //=> Sat Feb 01 2014 00:00:00 + */ +function setMonth(date, month) { + const _date = toDate(date); + const year = _date.getFullYear(); + const day = _date.getDate(); + + const dateWithDesiredMonth = constructFrom(date, 0); + dateWithDesiredMonth.setFullYear(year, month, 15); + dateWithDesiredMonth.setHours(0, 0, 0, 0); + const daysInMonth = getDaysInMonth(dateWithDesiredMonth); + // Set the last day of the new month + // if the original date was the last day of the longer month + _date.setMonth(month, Math.min(day, daysInMonth)); + return _date; +} + +// Fallback for modularized imports: +/* harmony default export */ const date_fns_setMonth = ((/* unused pure expression or super */ null && (setMonth))); + +;// ./node_modules/date-fns/set.mjs + + + + +/** + * @name set + * @category Common Helpers + * @summary Set date values to a given date. + * + * @description + * Set date values to a given date. + * + * Sets time values to date from object `values`. + * A value is not set if it is undefined or null or doesn't exist in `values`. + * + * Note about bundle size: `set` does not internally use `setX` functions from date-fns but instead opts + * to use native `Date#setX` methods. If you use this function, you may not want to include the + * other `setX` functions that date-fns provides if you are concerned about the bundle size. + * + * @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). + * + * @param date - The date to be changed + * @param values - The date values to be set + * + * @returns The new date with options set + * + * @example + * // Transform 1 September 2014 into 20 October 2015 in a single line: + * const result = set(new Date(2014, 8, 20), { year: 2015, month: 9, date: 20 }) + * //=> Tue Oct 20 2015 00:00:00 + * + * @example + * // Set 12 PM to 1 September 2014 01:23:45 to 1 September 2014 12:00:00: + * const result = set(new Date(2014, 8, 1, 1, 23, 45), { hours: 12 }) + * //=> Mon Sep 01 2014 12:23:45 + */ + +function set(date, values) { + let _date = toDate(date); + + // Check if date is Invalid Date because Date.prototype.setFullYear ignores the value of Invalid Date + if (isNaN(+_date)) { + return constructFrom(date, NaN); + } + + if (values.year != null) { + _date.setFullYear(values.year); + } + + if (values.month != null) { + _date = setMonth(_date, values.month); + } + + if (values.date != null) { + _date.setDate(values.date); + } + + if (values.hours != null) { + _date.setHours(values.hours); + } + + if (values.minutes != null) { + _date.setMinutes(values.minutes); + } + + if (values.seconds != null) { + _date.setSeconds(values.seconds); + } + + if (values.milliseconds != null) { + _date.setMilliseconds(values.milliseconds); + } + + return _date; +} + +// Fallback for modularized imports: +/* harmony default export */ const date_fns_set = ((/* unused pure expression or super */ null && (set))); + +;// ./node_modules/date-fns/startOfToday.mjs + + +/** + * @name startOfToday + * @category Day Helpers + * @summary Return the start of today. + * @pure false + * + * @description + * Return the start of today. + * + * @returns The start of today + * + * @example + * // If today is 6 October 2014: + * const result = startOfToday() + * //=> Mon Oct 6 2014 00:00:00 + */ +function startOfToday() { + return startOfDay(Date.now()); +} + +// Fallback for modularized imports: +/* harmony default export */ const date_fns_startOfToday = ((/* unused pure expression or super */ null && (startOfToday))); + +;// ./node_modules/date-fns/setYear.mjs + + + +/** + * @name setYear + * @category Year Helpers + * @summary Set the year to the given date. + * + * @description + * Set the year to the given date. + * + * @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). + * + * @param date - The date to be changed + * @param year - The year of the new date + * + * @returns The new date with the year set + * + * @example + * // Set year 2013 to 1 September 2014: + * const result = setYear(new Date(2014, 8, 1), 2013) + * //=> Sun Sep 01 2013 00:00:00 + */ +function setYear(date, year) { + const _date = toDate(date); + + // Check if date is Invalid Date because Date.prototype.setFullYear ignores the value of Invalid Date + if (isNaN(+_date)) { + return constructFrom(date, NaN); + } + + _date.setFullYear(year); + return _date; +} + +// Fallback for modularized imports: +/* harmony default export */ const date_fns_setYear = ((/* unused pure expression or super */ null && (setYear))); + +;// ./node_modules/date-fns/addYears.mjs + + +/** + * @name addYears + * @category Year Helpers + * @summary Add the specified number of years to the given date. + * + * @description + * Add the specified number of years to the given date. + * + * @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). + * + * @param date - The date to be changed + * @param amount - The amount of years to be added. + * + * @returns The new date with the years added + * + * @example + * // Add 5 years to 1 September 2014: + * const result = addYears(new Date(2014, 8, 1), 5) + * //=> Sun Sep 01 2019 00:00:00 + */ +function addYears(date, amount) { + return addMonths(date, amount * 12); +} + +// Fallback for modularized imports: +/* harmony default export */ const date_fns_addYears = ((/* unused pure expression or super */ null && (addYears))); + +;// ./node_modules/date-fns/subYears.mjs + + +/** + * @name subYears + * @category Year Helpers + * @summary Subtract the specified number of years from the given date. + * + * @description + * Subtract the specified number of years from the given date. + * + * @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). + * + * @param date - The date to be changed + * @param amount - The amount of years to be subtracted. + * + * @returns The new date with the years subtracted + * + * @example + * // Subtract 5 years from 1 September 2014: + * const result = subYears(new Date(2014, 8, 1), 5) + * //=> Tue Sep 01 2009 00:00:00 + */ +function subYears(date, amount) { + return addYears(date, -amount); +} + +// Fallback for modularized imports: +/* harmony default export */ const date_fns_subYears = ((/* unused pure expression or super */ null && (subYears))); + +;// ./node_modules/date-fns/eachDayOfInterval.mjs + + +/** + * The {@link eachDayOfInterval} function options. + */ + +/** + * @name eachDayOfInterval + * @category Interval Helpers + * @summary Return the array of dates within the specified time interval. + * + * @description + * Return the array of dates within the specified time interval. + * + * @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). + * + * @param interval - The interval. + * @param options - An object with options. + * + * @returns The array with starts of days from the day of the interval start to the day of the interval end + * + * @example + * // Each day between 6 October 2014 and 10 October 2014: + * const result = eachDayOfInterval({ + * start: new Date(2014, 9, 6), + * end: new Date(2014, 9, 10) + * }) + * //=> [ + * // Mon Oct 06 2014 00:00:00, + * // Tue Oct 07 2014 00:00:00, + * // Wed Oct 08 2014 00:00:00, + * // Thu Oct 09 2014 00:00:00, + * // Fri Oct 10 2014 00:00:00 + * // ] + */ +function eachDayOfInterval(interval, options) { + const startDate = toDate(interval.start); + const endDate = toDate(interval.end); + + let reversed = +startDate > +endDate; + const endTime = reversed ? +startDate : +endDate; + const currentDate = reversed ? endDate : startDate; + currentDate.setHours(0, 0, 0, 0); + + let step = options?.step ?? 1; + if (!step) return []; + if (step < 0) { + step = -step; + reversed = !reversed; + } + + const dates = []; + + while (+currentDate <= endTime) { + dates.push(toDate(currentDate)); + currentDate.setDate(currentDate.getDate() + step); + currentDate.setHours(0, 0, 0, 0); + } + + return reversed ? dates.reverse() : dates; +} + +// Fallback for modularized imports: +/* harmony default export */ const date_fns_eachDayOfInterval = ((/* unused pure expression or super */ null && (eachDayOfInterval))); + +;// ./node_modules/date-fns/eachMonthOfInterval.mjs + + +/** + * The {@link eachMonthOfInterval} function options. + */ + +/** + * @name eachMonthOfInterval + * @category Interval Helpers + * @summary Return the array of months within the specified time interval. + * + * @description + * Return the array of months within the specified time interval. + * + * @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). + * + * @param interval - The interval + * + * @returns The array with starts of months from the month of the interval start to the month of the interval end + * + * @example + * // Each month between 6 February 2014 and 10 August 2014: + * const result = eachMonthOfInterval({ + * start: new Date(2014, 1, 6), + * end: new Date(2014, 7, 10) + * }) + * //=> [ + * // Sat Feb 01 2014 00:00:00, + * // Sat Mar 01 2014 00:00:00, + * // Tue Apr 01 2014 00:00:00, + * // Thu May 01 2014 00:00:00, + * // Sun Jun 01 2014 00:00:00, + * // Tue Jul 01 2014 00:00:00, + * // Fri Aug 01 2014 00:00:00 + * // ] + */ +function eachMonthOfInterval(interval, options) { + const startDate = toDate(interval.start); + const endDate = toDate(interval.end); + + let reversed = +startDate > +endDate; + const endTime = reversed ? +startDate : +endDate; + const currentDate = reversed ? endDate : startDate; + currentDate.setHours(0, 0, 0, 0); + currentDate.setDate(1); + + let step = options?.step ?? 1; + if (!step) return []; + if (step < 0) { + step = -step; + reversed = !reversed; + } + + const dates = []; + + while (+currentDate <= endTime) { + dates.push(toDate(currentDate)); + currentDate.setMonth(currentDate.getMonth() + step); + } + + return reversed ? dates.reverse() : dates; +} + +// Fallback for modularized imports: +/* harmony default export */ const date_fns_eachMonthOfInterval = ((/* unused pure expression or super */ null && (eachMonthOfInterval))); + +;// ./node_modules/date-fns/startOfMonth.mjs + + +/** + * @name startOfMonth + * @category Month Helpers + * @summary Return the start of a month for the given date. + * + * @description + * Return the start of a month for the given date. + * The result will be in the local timezone. + * + * @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). + * + * @param date - The original date + * + * @returns The start of a month + * + * @example + * // The start of a month for 2 September 2014 11:55:00: + * const result = startOfMonth(new Date(2014, 8, 2, 11, 55, 0)) + * //=> Mon Sep 01 2014 00:00:00 + */ +function startOfMonth(date) { + const _date = toDate(date); + _date.setDate(1); + _date.setHours(0, 0, 0, 0); + return _date; +} + +// Fallback for modularized imports: +/* harmony default export */ const date_fns_startOfMonth = ((/* unused pure expression or super */ null && (startOfMonth))); + +;// ./node_modules/date-fns/endOfMonth.mjs + + +/** + * @name endOfMonth + * @category Month Helpers + * @summary Return the end of a month for the given date. + * + * @description + * Return the end of a month for the given date. + * The result will be in the local timezone. + * + * @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). + * + * @param date - The original date + * + * @returns The end of a month + * + * @example + * // The end of a month for 2 September 2014 11:55:00: + * const result = endOfMonth(new Date(2014, 8, 2, 11, 55, 0)) + * //=> Tue Sep 30 2014 23:59:59.999 + */ +function endOfMonth(date) { + const _date = toDate(date); + const month = _date.getMonth(); + _date.setFullYear(_date.getFullYear(), month + 1, 0); + _date.setHours(23, 59, 59, 999); + return _date; +} + +// Fallback for modularized imports: +/* harmony default export */ const date_fns_endOfMonth = ((/* unused pure expression or super */ null && (endOfMonth))); + +;// ./node_modules/date-fns/eachWeekOfInterval.mjs + + + + +/** + * The {@link eachWeekOfInterval} function options. + */ + +/** + * @name eachWeekOfInterval + * @category Interval Helpers + * @summary Return the array of weeks within the specified time interval. + * + * @description + * Return the array of weeks within the specified time interval. + * + * @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). + * + * @param interval - The interval. + * @param options - An object with options. + * + * @returns The array with starts of weeks from the week of the interval start to the week of the interval end + * + * @example + * // Each week within interval 6 October 2014 - 23 November 2014: + * const result = eachWeekOfInterval({ + * start: new Date(2014, 9, 6), + * end: new Date(2014, 10, 23) + * }) + * //=> [ + * // Sun Oct 05 2014 00:00:00, + * // Sun Oct 12 2014 00:00:00, + * // Sun Oct 19 2014 00:00:00, + * // Sun Oct 26 2014 00:00:00, + * // Sun Nov 02 2014 00:00:00, + * // Sun Nov 09 2014 00:00:00, + * // Sun Nov 16 2014 00:00:00, + * // Sun Nov 23 2014 00:00:00 + * // ] + */ +function eachWeekOfInterval(interval, options) { + const startDate = toDate(interval.start); + const endDate = toDate(interval.end); + + let reversed = +startDate > +endDate; + const startDateWeek = reversed + ? startOfWeek(endDate, options) + : startOfWeek(startDate, options); + const endDateWeek = reversed + ? startOfWeek(startDate, options) + : startOfWeek(endDate, options); + + // Some timezones switch DST at midnight, making start of day unreliable in these timezones, 3pm is a safe bet + startDateWeek.setHours(15); + endDateWeek.setHours(15); + + const endTime = +endDateWeek.getTime(); + let currentDate = startDateWeek; + + let step = options?.step ?? 1; + if (!step) return []; + if (step < 0) { + step = -step; + reversed = !reversed; + } + + const dates = []; + + while (+currentDate <= endTime) { + currentDate.setHours(0); + dates.push(toDate(currentDate)); + currentDate = addWeeks(currentDate, step); + currentDate.setHours(15); + } + + return reversed ? dates.reverse() : dates; +} + +// Fallback for modularized imports: +/* harmony default export */ const date_fns_eachWeekOfInterval = ((/* unused pure expression or super */ null && (eachWeekOfInterval))); + +;// ./node_modules/@wordpress/components/build-module/date-time/date/use-lilius/index.js +/** + * This source is a local copy of the use-lilius library, since the original + * library is not actively maintained. + * @see https://github.com/WordPress/gutenberg/discussions/64968 + * + * use-lilius@2.0.5 + * https://github.com/Avarios/use-lilius + * + * The MIT License (MIT) + * + * Copyright (c) 2021-Present Danny Tatom + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + */ + +/** + * External dependencies + */ + + +/** + * WordPress dependencies + */ + +let Month = /*#__PURE__*/function (Month) { + Month[Month["JANUARY"] = 0] = "JANUARY"; + Month[Month["FEBRUARY"] = 1] = "FEBRUARY"; + Month[Month["MARCH"] = 2] = "MARCH"; + Month[Month["APRIL"] = 3] = "APRIL"; + Month[Month["MAY"] = 4] = "MAY"; + Month[Month["JUNE"] = 5] = "JUNE"; + Month[Month["JULY"] = 6] = "JULY"; + Month[Month["AUGUST"] = 7] = "AUGUST"; + Month[Month["SEPTEMBER"] = 8] = "SEPTEMBER"; + Month[Month["OCTOBER"] = 9] = "OCTOBER"; + Month[Month["NOVEMBER"] = 10] = "NOVEMBER"; + Month[Month["DECEMBER"] = 11] = "DECEMBER"; + return Month; +}({}); +let Day = /*#__PURE__*/function (Day) { + Day[Day["SUNDAY"] = 0] = "SUNDAY"; + Day[Day["MONDAY"] = 1] = "MONDAY"; + Day[Day["TUESDAY"] = 2] = "TUESDAY"; + Day[Day["WEDNESDAY"] = 3] = "WEDNESDAY"; + Day[Day["THURSDAY"] = 4] = "THURSDAY"; + Day[Day["FRIDAY"] = 5] = "FRIDAY"; + Day[Day["SATURDAY"] = 6] = "SATURDAY"; + return Day; +}({}); +const inRange = (date, min, max) => (isEqual(date, min) || isAfter(date, min)) && (isEqual(date, max) || isBefore(date, max)); +const use_lilius_clearTime = date => set(date, { + hours: 0, + minutes: 0, + seconds: 0, + milliseconds: 0 +}); +const useLilius = ({ + weekStartsOn = Day.SUNDAY, + viewing: initialViewing = new Date(), + selected: initialSelected = [], + numberOfMonths = 1 +} = {}) => { + const [viewing, setViewing] = (0,external_wp_element_namespaceObject.useState)(initialViewing); + const viewToday = (0,external_wp_element_namespaceObject.useCallback)(() => setViewing(startOfToday()), [setViewing]); + const viewMonth = (0,external_wp_element_namespaceObject.useCallback)(month => setViewing(v => setMonth(v, month)), []); + const viewPreviousMonth = (0,external_wp_element_namespaceObject.useCallback)(() => setViewing(v => subMonths(v, 1)), []); + const viewNextMonth = (0,external_wp_element_namespaceObject.useCallback)(() => setViewing(v => addMonths(v, 1)), []); + const viewYear = (0,external_wp_element_namespaceObject.useCallback)(year => setViewing(v => setYear(v, year)), []); + const viewPreviousYear = (0,external_wp_element_namespaceObject.useCallback)(() => setViewing(v => subYears(v, 1)), []); + const viewNextYear = (0,external_wp_element_namespaceObject.useCallback)(() => setViewing(v => addYears(v, 1)), []); + const [selected, setSelected] = (0,external_wp_element_namespaceObject.useState)(initialSelected.map(use_lilius_clearTime)); + const clearSelected = () => setSelected([]); + const isSelected = (0,external_wp_element_namespaceObject.useCallback)(date => selected.findIndex(s => isEqual(s, date)) > -1, [selected]); + const select = (0,external_wp_element_namespaceObject.useCallback)((date, replaceExisting) => { + if (replaceExisting) { + setSelected(Array.isArray(date) ? date : [date]); + } else { + setSelected(selectedItems => selectedItems.concat(Array.isArray(date) ? date : [date])); + } + }, []); + 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))), []); + const toggle = (0,external_wp_element_namespaceObject.useCallback)((date, replaceExisting) => isSelected(date) ? deselect(date) : select(date, replaceExisting), [deselect, isSelected, select]); + const selectRange = (0,external_wp_element_namespaceObject.useCallback)((start, end, replaceExisting) => { + if (replaceExisting) { + setSelected(eachDayOfInterval({ + start, + end + })); + } else { + setSelected(selectedItems => selectedItems.concat(eachDayOfInterval({ + start, + end + }))); + } + }, []); + const deselectRange = (0,external_wp_element_namespaceObject.useCallback)((start, end) => { + setSelected(selectedItems => selectedItems.filter(s => !eachDayOfInterval({ + start, + end + }).map(d => d.getTime()).includes(s.getTime()))); + }, []); + const calendar = (0,external_wp_element_namespaceObject.useMemo)(() => eachMonthOfInterval({ + start: startOfMonth(viewing), + end: endOfMonth(addMonths(viewing, numberOfMonths - 1)) + }).map(month => eachWeekOfInterval({ + start: startOfMonth(month), + end: endOfMonth(month) + }, { + weekStartsOn + }).map(week => eachDayOfInterval({ + start: startOfWeek(week, { + weekStartsOn + }), + end: endOfWeek(week, { + weekStartsOn + }) + }))), [viewing, weekStartsOn, numberOfMonths]); + return { + clearTime: use_lilius_clearTime, + inRange, + viewing, + setViewing, + viewToday, + viewMonth, + viewPreviousMonth, + viewNextMonth, + viewYear, + viewPreviousYear, + viewNextYear, + selected, + setSelected, + clearSelected, + isSelected, + select, + deselect, + toggle, + selectRange, + deselectRange, + calendar + }; +}; + +;// ./node_modules/@wordpress/components/build-module/date-time/date/styles.js + /** * External dependencies */ @@ -56386,10 +54414,7 @@ const styles_Wrapper = /*#__PURE__*/emotion_styled_base_browser_esm("div", true ? { target: "e105ri6r5" -} : 0)( true ? { - name: "1khn195", - styles: "box-sizing:border-box" -} : 0); +} : 0)(boxSizingReset, ";" + ( true ? "" : 0)); const Navigator = /*#__PURE__*/emotion_styled_base_browser_esm(h_stack_component, true ? { target: "e105ri6r4" } : 0)("margin-bottom:", space(4), ";" + ( true ? "" : 0)); @@ -56401,7 +54426,7 @@ } : 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)); const DayOfWeek = /*#__PURE__*/emotion_styled_base_browser_esm("div", true ? { target: "e105ri6r1" -} : 0)("color:", COLORS.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)); +} : 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)); const DayButton = /*#__PURE__*/emotion_styled_base_browser_esm(build_module_button, true ? { shouldForwardProp: prop => !['column', 'isSelected', 'isToday', 'hasEvents'].includes(prop), target: "e105ri6r0" @@ -56411,29 +54436,51 @@ justify-self: end; `, " ", props => props.disabled && ` pointer-events: none; - `, " &&&{border-radius:100%;height:", space(7), ";width:", space(7), ";", props => props.isSelected && ` - background: ${COLORS.theme.accent}; - color: ${COLORS.white}; + `, " &&&{border-radius:", config_values.radiusRound, ";height:", space(7), ";width:", space(7), ";", props => props.isSelected && ` + background: ${COLORS.theme.accent}; + + &, + &:hover:not(:disabled, [aria-disabled=true]) { + color: ${COLORS.theme.accentInverted}; + } + + &:focus:not(:disabled), + &:focus:not(:disabled) { + border: ${config_values.borderWidthFocus} solid currentColor; + } + + /* Highlight the selected day for high-contrast mode */ + &::after { + content: ''; + position: absolute; + pointer-events: none; + inset: 0; + border-radius: inherit; + border: 1px solid transparent; + } `, " ", props => !props.isSelected && props.isToday && ` - background: ${COLORS.gray[200]}; + background: ${COLORS.theme.gray[200]}; `, ";}", props => props.hasEvents && ` ::before { - background: ${props.isSelected ? COLORS.white : COLORS.theme.accent}; - border-radius: 2px; - bottom: 2px; + border: 2px solid ${props.isSelected ? COLORS.theme.accentInverted : COLORS.theme.accent}; + border-radius: ${config_values.radiusRound}; content: " "; - height: 4px; left: 50%; - margin-left: -2px; position: absolute; - width: 4px; + transform: translate(-50%, 9px); } `, ";" + ( true ? "" : 0)); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/date-time/utils.js -/** - * External dependencies - */ +;// ./node_modules/@wordpress/components/build-module/date-time/utils.js +/** + * External dependencies + */ + + +/** + * Internal dependencies + */ + /** @@ -56446,17 +54493,71 @@ if (typeof input === 'string') { return new Date(input); } - return toDate_toDate(input); -} - -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/date-time/constants.js + return toDate(input); +} + +/** + * Converts a 12-hour time to a 24-hour time. + * @param hours + * @param isPm + */ +function from12hTo24h(hours, isPm) { + return isPm ? (hours % 12 + 12) % 24 : hours % 12; +} + +/** + * Converts a 24-hour time to a 12-hour time. + * @param hours + */ +function from24hTo12h(hours) { + return hours % 12 || 12; +} + +/** + * Creates an InputControl reducer used to pad an input so that it is always a + * given width. For example, the hours and minutes inputs are padded to 2 so + * that '4' appears as '04'. + * + * @param pad How many digits the value should be. + */ +function buildPadInputStateReducer(pad) { + return (state, action) => { + const nextState = { + ...state + }; + if (action.type === COMMIT || action.type === PRESS_UP || action.type === PRESS_DOWN) { + if (nextState.value !== undefined) { + nextState.value = nextState.value.toString().padStart(pad, '0'); + } + } + return nextState; + }; +} + +/** + * Validates the target of a React event to ensure it is an input element and + * that the input is valid. + * @param event + */ +function validateInputElementTarget(event) { + var _ownerDocument$defaul; + // `instanceof` checks need to get the instance definition from the + // corresponding window object — therefore, the following logic makes + // the component work correctly even when rendered inside an iframe. + const HTMLInputElementInstance = (_ownerDocument$defaul = event.target?.ownerDocument.defaultView?.HTMLInputElement) !== null && _ownerDocument$defaul !== void 0 ? _ownerDocument$defaul : HTMLInputElement; + if (!(event.target instanceof HTMLInputElementInstance)) { + return false; + } + return event.target.validity.valid; +} + +;// ./node_modules/@wordpress/components/build-module/date-time/constants.js const TIMEZONELESS_FORMAT = "yyyy-MM-dd'T'HH:mm:ss"; -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/date-time/date/index.js -/** - * External dependencies - */ - +;// ./node_modules/@wordpress/components/build-module/date-time/date/index.js +/** + * External dependencies + */ /** * WordPress dependencies @@ -56495,7 +54596,6 @@ * ``` */ - function DatePicker({ currentDate, onChange, @@ -56514,14 +54614,14 @@ viewPreviousMonth, viewNextMonth } = useLilius({ - selected: [startOfDay_startOfDay(date)], - viewing: startOfDay_startOfDay(date), + selected: [startOfDay(date)], + viewing: startOfDay(date), weekStartsOn }); // Used to implement a roving tab index. Tracks the day that receives focus // when the user tabs into the calendar. - const [focusable, setFocusable] = (0,external_wp_element_namespaceObject.useState)(startOfDay_startOfDay(date)); + const [focusable, setFocusable] = (0,external_wp_element_namespaceObject.useState)(startOfDay(date)); // Allows us to only programmatically focus() a day when focus was already // within the calendar. This stops us stealing focus from e.g. a TimePicker @@ -56532,9 +54632,9 @@ const [prevCurrentDate, setPrevCurrentDate] = (0,external_wp_element_namespaceObject.useState)(currentDate); if (currentDate !== prevCurrentDate) { setPrevCurrentDate(currentDate); - setSelected([startOfDay_startOfDay(date)]); - setViewing(startOfDay_startOfDay(date)); - setFocusable(startOfDay_startOfDay(date)); + setSelected([startOfDay(date)]); + setViewing(startOfDay(date)); + setFocusable(startOfDay(date)); } return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(styles_Wrapper, { className: "components-datetime__date", @@ -56547,9 +54647,10 @@ "aria-label": (0,external_wp_i18n_namespaceObject.__)('View previous month'), onClick: () => { viewPreviousMonth(); - setFocusable(subMonths_subMonths(focusable, 1)); - onMonthPreviewed?.(format(subMonths_subMonths(viewing, 1), TIMEZONELESS_FORMAT)); - } + setFocusable(subMonths(focusable, 1)); + onMonthPreviewed?.(format(subMonths(viewing, 1), TIMEZONELESS_FORMAT)); + }, + size: "compact" }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(NavigatorHeading, { level: 3, children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("strong", { @@ -56561,9 +54662,10 @@ "aria-label": (0,external_wp_i18n_namespaceObject.__)('View next month'), onClick: () => { viewNextMonth(); - setFocusable(addMonths_addMonths(focusable, 1)); - onMonthPreviewed?.(format(addMonths_addMonths(viewing, 1), TIMEZONELESS_FORMAT)); - } + setFocusable(addMonths(focusable, 1)); + onMonthPreviewed?.(format(addMonths(viewing, 1), TIMEZONELESS_FORMAT)); + }, + size: "compact" })] }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(Calendar, { onFocus: () => setIsFocusWithinCalendar(true), @@ -56578,7 +54680,7 @@ day: day, column: index + 1, isSelected: isSelected(day), - isFocusable: isEqual_isEqual(day, focusable), + isFocusable: isEqual(day, focusable), isFocusAllowed: isFocusWithinCalendar, isToday: isSameDay(day, new Date()), isInvalid: isInvalidDate ? isInvalidDate(day) : false, @@ -56593,28 +54695,28 @@ onKeyDown: event => { let nextFocusable; if (event.key === 'ArrowLeft') { - nextFocusable = addDays_addDays(day, (0,external_wp_i18n_namespaceObject.isRTL)() ? 1 : -1); + nextFocusable = addDays(day, (0,external_wp_i18n_namespaceObject.isRTL)() ? 1 : -1); } if (event.key === 'ArrowRight') { - nextFocusable = addDays_addDays(day, (0,external_wp_i18n_namespaceObject.isRTL)() ? -1 : 1); + nextFocusable = addDays(day, (0,external_wp_i18n_namespaceObject.isRTL)() ? -1 : 1); } if (event.key === 'ArrowUp') { nextFocusable = subWeeks(day, 1); } if (event.key === 'ArrowDown') { - nextFocusable = addWeeks_addWeeks(day, 1); + nextFocusable = addWeeks(day, 1); } if (event.key === 'PageUp') { - nextFocusable = subMonths_subMonths(day, 1); + nextFocusable = subMonths(day, 1); } if (event.key === 'PageDown') { - nextFocusable = addMonths_addMonths(day, 1); + nextFocusable = addMonths(day, 1); } if (event.key === 'Home') { - nextFocusable = startOfWeek_startOfWeek(day); + nextFocusable = startOfWeek(day); } if (event.key === 'End') { - nextFocusable = startOfDay_startOfDay(endOfWeek_endOfWeek(day)); + nextFocusable = startOfDay(endOfWeek(day)); } if (nextFocusable) { event.preventDefault(); @@ -56653,9 +54755,9 @@ } // isFocusAllowed is not a dep as there is no point calling focus() on // an already focused element. - // eslint-disable-next-line react-hooks/exhaustive-deps }, [isFocusable]); return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(DayButton, { + __next40pxDefaultSize: true, ref: ref, className: "components-datetime__date__day" // Unused, for backwards compatibility. , @@ -56693,7 +54795,7 @@ } /* harmony default export */ const date = (DatePicker); -;// CONCATENATED MODULE: ./node_modules/date-fns/startOfMinute.mjs +;// ./node_modules/date-fns/startOfMinute.mjs /** @@ -56717,7 +54819,7 @@ * //=> Mon Dec 01 2014 22:15:00 */ function startOfMinute(date) { - const _date = toDate_toDate(date); + const _date = toDate(date); _date.setSeconds(0, 0); return _date; } @@ -56725,198 +54827,7 @@ // Fallback for modularized imports: /* harmony default export */ const date_fns_startOfMinute = ((/* unused pure expression or super */ null && (startOfMinute))); -;// CONCATENATED MODULE: ./node_modules/date-fns/getDaysInMonth.mjs - - - -/** - * @name getDaysInMonth - * @category Month Helpers - * @summary Get the number of days in a month of the given date. - * - * @description - * Get the number of days in a month of the given date. - * - * @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). - * - * @param date - The given date - * - * @returns The number of days in a month - * - * @example - * // How many days are in February 2000? - * const result = getDaysInMonth(new Date(2000, 1)) - * //=> 29 - */ -function getDaysInMonth_getDaysInMonth(date) { - const _date = toDate_toDate(date); - const year = _date.getFullYear(); - const monthIndex = _date.getMonth(); - const lastDayOfMonth = constructFrom_constructFrom(date, 0); - lastDayOfMonth.setFullYear(year, monthIndex + 1, 0); - lastDayOfMonth.setHours(0, 0, 0, 0); - return lastDayOfMonth.getDate(); -} - -// Fallback for modularized imports: -/* harmony default export */ const date_fns_getDaysInMonth = ((/* unused pure expression or super */ null && (getDaysInMonth_getDaysInMonth))); - -;// CONCATENATED MODULE: ./node_modules/date-fns/setMonth.mjs - - - - -/** - * @name setMonth - * @category Month Helpers - * @summary Set the month to the given date. - * - * @description - * Set the month to the given date. - * - * @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). - * - * @param date - The date to be changed - * @param month - The month index to set (0-11) - * - * @returns The new date with the month set - * - * @example - * // Set February to 1 September 2014: - * const result = setMonth(new Date(2014, 8, 1), 1) - * //=> Sat Feb 01 2014 00:00:00 - */ -function setMonth_setMonth(date, month) { - const _date = toDate_toDate(date); - const year = _date.getFullYear(); - const day = _date.getDate(); - - const dateWithDesiredMonth = constructFrom_constructFrom(date, 0); - dateWithDesiredMonth.setFullYear(year, month, 15); - dateWithDesiredMonth.setHours(0, 0, 0, 0); - const daysInMonth = getDaysInMonth_getDaysInMonth(dateWithDesiredMonth); - // Set the last day of the new month - // if the original date was the last day of the longer month - _date.setMonth(month, Math.min(day, daysInMonth)); - return _date; -} - -// Fallback for modularized imports: -/* harmony default export */ const date_fns_setMonth = ((/* unused pure expression or super */ null && (setMonth_setMonth))); - -;// CONCATENATED MODULE: ./node_modules/date-fns/set.mjs - - - - -/** - * @name set - * @category Common Helpers - * @summary Set date values to a given date. - * - * @description - * Set date values to a given date. - * - * Sets time values to date from object `values`. - * A value is not set if it is undefined or null or doesn't exist in `values`. - * - * Note about bundle size: `set` does not internally use `setX` functions from date-fns but instead opts - * to use native `Date#setX` methods. If you use this function, you may not want to include the - * other `setX` functions that date-fns provides if you are concerned about the bundle size. - * - * @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). - * - * @param date - The date to be changed - * @param values - The date values to be set - * - * @returns The new date with options set - * - * @example - * // Transform 1 September 2014 into 20 October 2015 in a single line: - * const result = set(new Date(2014, 8, 20), { year: 2015, month: 9, date: 20 }) - * //=> Tue Oct 20 2015 00:00:00 - * - * @example - * // Set 12 PM to 1 September 2014 01:23:45 to 1 September 2014 12:00:00: - * const result = set(new Date(2014, 8, 1, 1, 23, 45), { hours: 12 }) - * //=> Mon Sep 01 2014 12:23:45 - */ - -function set_set(date, values) { - let _date = toDate_toDate(date); - - // Check if date is Invalid Date because Date.prototype.setFullYear ignores the value of Invalid Date - if (isNaN(+_date)) { - return constructFrom_constructFrom(date, NaN); - } - - if (values.year != null) { - _date.setFullYear(values.year); - } - - if (values.month != null) { - _date = setMonth_setMonth(_date, values.month); - } - - if (values.date != null) { - _date.setDate(values.date); - } - - if (values.hours != null) { - _date.setHours(values.hours); - } - - if (values.minutes != null) { - _date.setMinutes(values.minutes); - } - - if (values.seconds != null) { - _date.setSeconds(values.seconds); - } - - if (values.milliseconds != null) { - _date.setMilliseconds(values.milliseconds); - } - - return _date; -} - -// Fallback for modularized imports: -/* harmony default export */ const date_fns_set = ((/* unused pure expression or super */ null && (set_set))); - -;// CONCATENATED MODULE: ./node_modules/date-fns/setHours.mjs - - -/** - * @name setHours - * @category Hour Helpers - * @summary Set the hours to the given date. - * - * @description - * Set the hours to the given date. - * - * @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). - * - * @param date - The date to be changed - * @param hours - The hours of the new date - * - * @returns The new date with the hours set - * - * @example - * // Set 4 hours to 1 September 2014 11:30:00: - * const result = setHours(new Date(2014, 8, 1, 11, 30), 4) - * //=> Mon Sep 01 2014 04:30:00 - */ -function setHours(date, hours) { - const _date = toDate_toDate(date); - _date.setHours(hours); - return _date; -} - -// Fallback for modularized imports: -/* harmony default export */ const date_fns_setHours = ((/* unused pure expression or super */ null && (setHours))); - -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/date-time/time/styles.js +;// ./node_modules/@wordpress/components/build-module/date-time/time/styles.js 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)."; } /** @@ -56950,7 +54861,7 @@ } : 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)); const TimeSeparator = /*#__PURE__*/emotion_styled_base_browser_esm("span", true ? { target: "evcr2315" -} : 0)("border-top:", config_values.borderWidth, " solid ", COLORS.gray[700], ";border-bottom:", config_values.borderWidth, " solid ", COLORS.gray[700], ";line-height:calc(\n\t\t", config_values.controlHeight, " - ", config_values.borderWidth, " * 2\n\t);display:inline-block;" + ( true ? "" : 0)); +} : 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)); const MinutesInput = /*#__PURE__*/emotion_styled_base_browser_esm(number_control, true ? { target: "evcr2314" } : 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)); @@ -56976,7 +54887,7 @@ styles: "text-decoration:underline dotted" } : 0); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/date-time/time/timezone.js +;// ./node_modules/@wordpress/components/build-module/date-time/time/timezone.js /** * WordPress dependencies */ @@ -57031,59 +54942,241 @@ }; /* harmony default export */ const timezone = (timezone_TimeZone); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/date-time/time/index.js -/** - * External dependencies - */ - - -/** - * WordPress dependencies - */ - - - -/** - * Internal dependencies - */ - - - - - - - - - - - - - - -function from12hTo24h(hours, isPm) { - return isPm ? (hours % 12 + 12) % 24 : hours % 12; -} - -/** - * Creates an InputControl reducer used to pad an input so that it is always a - * given width. For example, the hours and minutes inputs are padded to 2 so - * that '4' appears as '04'. - * - * @param pad How many digits the value should be. - */ -function buildPadInputStateReducer(pad) { - return (state, action) => { - const nextState = { - ...state - }; - if (action.type === COMMIT || action.type === PRESS_UP || action.type === PRESS_DOWN) { - if (nextState.value !== undefined) { - nextState.value = nextState.value.toString().padStart(pad, '0'); - } - } - return nextState; - }; -} +;// ./node_modules/@wordpress/components/build-module/toggle-group-control/toggle-group-control-option/component.js +/** + * External dependencies + */ + +/** + * WordPress dependencies + */ + + +/** + * Internal dependencies + */ + + + +function UnforwardedToggleGroupControlOption(props, ref) { + const { + label, + ...restProps + } = props; + const optionLabel = restProps['aria-label'] || label; + return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(toggle_group_control_option_base_component, { + ...restProps, + "aria-label": optionLabel, + ref: ref, + children: label + }); +} + +/** + * `ToggleGroupControlOption` is a form component and is meant to be used as a + * child of `ToggleGroupControl`. + * + * ```jsx + * import { + * __experimentalToggleGroupControl as ToggleGroupControl, + * __experimentalToggleGroupControlOption as ToggleGroupControlOption, + * } from '@wordpress/components'; + * + * function Example() { + * return ( + * + * + * + * + * ); + * } + * ``` + */ +const ToggleGroupControlOption = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedToggleGroupControlOption); +/* harmony default export */ const toggle_group_control_option_component = (ToggleGroupControlOption); + +;// ./node_modules/@wordpress/components/build-module/date-time/time/time-input/index.js +/** + * External dependencies + */ + + +/** + * WordPress dependencies + */ + + + +/** + * Internal dependencies + */ + + + + + + + +function TimeInput({ + value: valueProp, + defaultValue, + is12Hour, + label, + minutesProps, + onChange +}) { + const [value = { + hours: new Date().getHours(), + minutes: new Date().getMinutes() + }, setValue] = useControlledValue({ + value: valueProp, + onChange, + defaultValue + }); + const dayPeriod = parseDayPeriod(value.hours); + const hours12Format = from24hTo12h(value.hours); + const buildNumberControlChangeCallback = method => { + return (_value, { + event + }) => { + if (!validateInputElementTarget(event)) { + return; + } + + // We can safely assume value is a number if target is valid. + const numberValue = Number(_value); + setValue({ + ...value, + [method]: method === 'hours' && is12Hour ? from12hTo24h(numberValue, dayPeriod === 'PM') : numberValue + }); + }; + }; + const buildAmPmChangeCallback = _value => { + return () => { + if (dayPeriod === _value) { + return; + } + setValue({ + ...value, + hours: from12hTo24h(hours12Format, _value === 'PM') + }); + }; + }; + function parseDayPeriod(_hours) { + return _hours < 12 ? 'AM' : 'PM'; + } + const Wrapper = label ? Fieldset : external_wp_element_namespaceObject.Fragment; + return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(Wrapper, { + children: [label && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(base_control.VisualLabel, { + as: "legend", + children: label + }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(h_stack_component, { + alignment: "left", + expanded: false, + children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(TimeWrapper, { + className: "components-datetime__time-field components-datetime__time-field-time" // Unused, for backwards compatibility. + , + children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(HoursInput, { + className: "components-datetime__time-field-hours-input" // Unused, for backwards compatibility. + , + label: (0,external_wp_i18n_namespaceObject.__)('Hours'), + hideLabelFromVision: true, + __next40pxDefaultSize: true, + value: String(is12Hour ? hours12Format : value.hours).padStart(2, '0'), + step: 1, + min: is12Hour ? 1 : 0, + max: is12Hour ? 12 : 23, + required: true, + spinControls: "none", + isPressEnterToChange: true, + isDragEnabled: false, + isShiftStepEnabled: false, + onChange: buildNumberControlChangeCallback('hours'), + __unstableStateReducer: buildPadInputStateReducer(2) + }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(TimeSeparator, { + className: "components-datetime__time-separator" // Unused, for backwards compatibility. + , + "aria-hidden": "true", + children: ":" + }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(MinutesInput, { + className: dist_clsx('components-datetime__time-field-minutes-input', + // Unused, for backwards compatibility. + minutesProps?.className), + label: (0,external_wp_i18n_namespaceObject.__)('Minutes'), + hideLabelFromVision: true, + __next40pxDefaultSize: true, + value: String(value.minutes).padStart(2, '0'), + step: 1, + min: 0, + max: 59, + required: true, + spinControls: "none", + isPressEnterToChange: true, + isDragEnabled: false, + isShiftStepEnabled: false, + onChange: (...args) => { + buildNumberControlChangeCallback('minutes')(...args); + minutesProps?.onChange?.(...args); + }, + __unstableStateReducer: buildPadInputStateReducer(2), + ...minutesProps + })] + }), is12Hour && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(toggle_group_control_component, { + __next40pxDefaultSize: true, + __nextHasNoMarginBottom: true, + isBlock: true, + label: (0,external_wp_i18n_namespaceObject.__)('Select AM or PM'), + hideLabelFromVision: true, + value: dayPeriod, + onChange: newValue => { + buildAmPmChangeCallback(newValue)(); + }, + children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(toggle_group_control_option_component, { + value: "AM", + label: (0,external_wp_i18n_namespaceObject.__)('AM') + }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(toggle_group_control_option_component, { + value: "PM", + label: (0,external_wp_i18n_namespaceObject.__)('PM') + })] + })] + })] + }); +} +/* harmony default export */ const time_input = ((/* unused pure expression or super */ null && (TimeInput))); + +;// ./node_modules/@wordpress/components/build-module/date-time/time/index.js +/** + * External dependencies + */ + + +/** + * WordPress dependencies + */ + + + +/** + * Internal dependencies + */ + + + + + + + + + + + +const VALID_DATE_ORDERS = ['dmy', 'mdy', 'ymd']; /** * TimePicker is a React component that renders a clock for time selection. @@ -57108,7 +55201,9 @@ function TimePicker({ is12Hour, currentTime, - onChange + onChange, + dateOrder: dateOrderProp, + hideLabelFromVision = false }) { const [date, setDate] = (0,external_wp_element_namespaceObject.useState)(() => // Truncate the date at the minutes, see: #15495. @@ -57119,47 +55214,68 @@ (0,external_wp_element_namespaceObject.useEffect)(() => { setDate(currentTime ? startOfMinute(inputToDate(currentTime)) : new Date()); }, [currentTime]); + const monthOptions = [{ + value: '01', + label: (0,external_wp_i18n_namespaceObject.__)('January') + }, { + value: '02', + label: (0,external_wp_i18n_namespaceObject.__)('February') + }, { + value: '03', + label: (0,external_wp_i18n_namespaceObject.__)('March') + }, { + value: '04', + label: (0,external_wp_i18n_namespaceObject.__)('April') + }, { + value: '05', + label: (0,external_wp_i18n_namespaceObject.__)('May') + }, { + value: '06', + label: (0,external_wp_i18n_namespaceObject.__)('June') + }, { + value: '07', + label: (0,external_wp_i18n_namespaceObject.__)('July') + }, { + value: '08', + label: (0,external_wp_i18n_namespaceObject.__)('August') + }, { + value: '09', + label: (0,external_wp_i18n_namespaceObject.__)('September') + }, { + value: '10', + label: (0,external_wp_i18n_namespaceObject.__)('October') + }, { + value: '11', + label: (0,external_wp_i18n_namespaceObject.__)('November') + }, { + value: '12', + label: (0,external_wp_i18n_namespaceObject.__)('December') + }]; const { day, month, year, minutes, - hours, - am + hours } = (0,external_wp_element_namespaceObject.useMemo)(() => ({ day: format(date, 'dd'), month: format(date, 'MM'), year: format(date, 'yyyy'), minutes: format(date, 'mm'), - hours: format(date, is12Hour ? 'hh' : 'HH'), + hours: format(date, 'HH'), am: format(date, 'a') - }), [date, is12Hour]); + }), [date]); const buildNumberControlChangeCallback = method => { const callback = (value, { event }) => { - var _ownerDocument$defaul; - // `instanceof` checks need to get the instance definition from the - // corresponding window object — therefore, the following logic makes - // the component work correctly even when rendered inside an iframe. - const HTMLInputElementInstance = (_ownerDocument$defaul = event.target?.ownerDocument.defaultView?.HTMLInputElement) !== null && _ownerDocument$defaul !== void 0 ? _ownerDocument$defaul : HTMLInputElement; - if (!(event.target instanceof HTMLInputElementInstance)) { - return; - } - if (!event.target.validity.valid) { + if (!validateInputElementTarget(event)) { return; } // We can safely assume value is a number if target is valid. - let numberValue = Number(value); - - // If the 12-hour format is being used and the 'PM' period is - // selected, then the incoming value (which ranges 1-12) should be - // increased by 12 to match the expected 24-hour format. - if (method === 'hours' && is12Hour) { - numberValue = from12hTo24h(numberValue, am === 'PM'); - } - const newDate = set_set(date, { + const numberValue = Number(value); + const newDate = set(date, { [method]: numberValue }); setDate(newDate); @@ -57167,17 +55283,17 @@ }; return callback; }; - function buildAmPmChangeCallback(value) { - return () => { - if (am === value) { - return; - } - const parsedHours = parseInt(hours, 10); - const newDate = setHours(date, from12hTo24h(parsedHours, value === 'PM')); - setDate(newDate); - onChange?.(format(newDate, TIMEZONELESS_FORMAT)); - }; - } + const onTimeInputChangeCallback = ({ + hours: newHours, + minutes: newMinutes + }) => { + const newDate = set(date, { + hours: newHours, + minutes: newMinutes + }); + setDate(newDate); + onChange?.(format(newDate, TIMEZONELESS_FORMAT)); + }; const dayField = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(DayInput, { className: "components-datetime__time-field components-datetime__time-field-day" // Unused, for backwards compatibility. , @@ -57194,7 +55310,7 @@ isDragEnabled: false, isShiftStepEnabled: false, onChange: buildNumberControlChangeCallback('date') - }); + }, "day"); const monthField = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(MonthSelectWrapper, { children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(select_control, { className: "components-datetime__time-field components-datetime__time-field-month" // Unused, for backwards compatibility. @@ -57204,55 +55320,54 @@ __next40pxDefaultSize: true, __nextHasNoMarginBottom: true, value: month, - options: [{ - value: '01', - label: (0,external_wp_i18n_namespaceObject.__)('January') - }, { - value: '02', - label: (0,external_wp_i18n_namespaceObject.__)('February') - }, { - value: '03', - label: (0,external_wp_i18n_namespaceObject.__)('March') - }, { - value: '04', - label: (0,external_wp_i18n_namespaceObject.__)('April') - }, { - value: '05', - label: (0,external_wp_i18n_namespaceObject.__)('May') - }, { - value: '06', - label: (0,external_wp_i18n_namespaceObject.__)('June') - }, { - value: '07', - label: (0,external_wp_i18n_namespaceObject.__)('July') - }, { - value: '08', - label: (0,external_wp_i18n_namespaceObject.__)('August') - }, { - value: '09', - label: (0,external_wp_i18n_namespaceObject.__)('September') - }, { - value: '10', - label: (0,external_wp_i18n_namespaceObject.__)('October') - }, { - value: '11', - label: (0,external_wp_i18n_namespaceObject.__)('November') - }, { - value: '12', - label: (0,external_wp_i18n_namespaceObject.__)('December') - }], + options: monthOptions, onChange: value => { - const newDate = setMonth_setMonth(date, Number(value) - 1); + const newDate = setMonth(date, Number(value) - 1); setDate(newDate); onChange?.(format(newDate, TIMEZONELESS_FORMAT)); } }) + }, "month"); + const yearField = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(YearInput, { + className: "components-datetime__time-field components-datetime__time-field-year" // Unused, for backwards compatibility. + , + label: (0,external_wp_i18n_namespaceObject.__)('Year'), + hideLabelFromVision: true, + __next40pxDefaultSize: true, + value: year, + step: 1, + min: 1, + max: 9999, + required: true, + spinControls: "none", + isPressEnterToChange: true, + isDragEnabled: false, + isShiftStepEnabled: false, + onChange: buildNumberControlChangeCallback('year'), + __unstableStateReducer: buildPadInputStateReducer(4) + }, "year"); + const defaultDateOrder = is12Hour ? 'mdy' : 'dmy'; + const dateOrder = dateOrderProp && VALID_DATE_ORDERS.includes(dateOrderProp) ? dateOrderProp : defaultDateOrder; + const fields = dateOrder.split('').map(field => { + switch (field) { + case 'd': + return dayField; + case 'm': + return monthField; + case 'y': + return yearField; + default: + return null; + } }); return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(time_styles_Wrapper, { className: "components-datetime__time" // Unused, for backwards compatibility. , children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(Fieldset, { - children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(base_control.VisualLabel, { + children: [hideLabelFromVision ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(visually_hidden_component, { + as: "legend", + children: (0,external_wp_i18n_namespaceObject.__)('Time') + }) : /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(base_control.VisualLabel, { as: "legend", className: "components-datetime__time-legend" // Unused, for backwards compatibility. , @@ -57260,107 +55375,62 @@ }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(h_stack_component, { className: "components-datetime__time-wrapper" // Unused, for backwards compatibility. , - children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(TimeWrapper, { - className: "components-datetime__time-field components-datetime__time-field-time" // Unused, for backwards compatibility. - , - children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(HoursInput, { - className: "components-datetime__time-field-hours-input" // Unused, for backwards compatibility. - , - label: (0,external_wp_i18n_namespaceObject.__)('Hours'), - hideLabelFromVision: true, - __next40pxDefaultSize: true, - value: hours, - step: 1, - min: is12Hour ? 1 : 0, - max: is12Hour ? 12 : 23, - required: true, - spinControls: "none", - isPressEnterToChange: true, - isDragEnabled: false, - isShiftStepEnabled: false, - onChange: buildNumberControlChangeCallback('hours'), - __unstableStateReducer: buildPadInputStateReducer(2) - }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(TimeSeparator, { - className: "components-datetime__time-separator" // Unused, for backwards compatibility. - , - "aria-hidden": "true", - children: ":" - }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(MinutesInput, { - className: "components-datetime__time-field-minutes-input" // Unused, for backwards compatibility. - , - label: (0,external_wp_i18n_namespaceObject.__)('Minutes'), - hideLabelFromVision: true, - __next40pxDefaultSize: true, - value: minutes, - step: 1, - min: 0, - max: 59, - required: true, - spinControls: "none", - isPressEnterToChange: true, - isDragEnabled: false, - isShiftStepEnabled: false, - onChange: buildNumberControlChangeCallback('minutes'), - __unstableStateReducer: buildPadInputStateReducer(2) - })] - }), is12Hour && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(button_group, { - className: "components-datetime__time-field components-datetime__time-field-am-pm" // Unused, for backwards compatibility. - , - children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, { - className: "components-datetime__time-am-button" // Unused, for backwards compatibility. - , - variant: am === 'AM' ? 'primary' : 'secondary', - __next40pxDefaultSize: true, - onClick: buildAmPmChangeCallback('AM'), - children: (0,external_wp_i18n_namespaceObject.__)('AM') - }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, { - className: "components-datetime__time-pm-button" // Unused, for backwards compatibility. - , - variant: am === 'PM' ? 'primary' : 'secondary', - __next40pxDefaultSize: true, - onClick: buildAmPmChangeCallback('PM'), - children: (0,external_wp_i18n_namespaceObject.__)('PM') - })] + children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(TimeInput, { + value: { + hours: Number(hours), + minutes: Number(minutes) + }, + is12Hour: is12Hour, + onChange: onTimeInputChangeCallback }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(spacer_component, {}), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(timezone, {})] })] }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(Fieldset, { - children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(base_control.VisualLabel, { + children: [hideLabelFromVision ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(visually_hidden_component, { + as: "legend", + children: (0,external_wp_i18n_namespaceObject.__)('Date') + }) : /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(base_control.VisualLabel, { as: "legend", className: "components-datetime__time-legend" // Unused, for backwards compatibility. , children: (0,external_wp_i18n_namespaceObject.__)('Date') - }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(h_stack_component, { + }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(h_stack_component, { className: "components-datetime__time-wrapper" // Unused, for backwards compatibility. , - children: [is12Hour ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { - children: [monthField, dayField] - }) : /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { - children: [dayField, monthField] - }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(YearInput, { - className: "components-datetime__time-field components-datetime__time-field-year" // Unused, for backwards compatibility. - , - label: (0,external_wp_i18n_namespaceObject.__)('Year'), - hideLabelFromVision: true, - __next40pxDefaultSize: true, - value: year, - step: 1, - min: 1, - max: 9999, - required: true, - spinControls: "none", - isPressEnterToChange: true, - isDragEnabled: false, - isShiftStepEnabled: false, - onChange: buildNumberControlChangeCallback('year'), - __unstableStateReducer: buildPadInputStateReducer(4) - })] + children: fields })] })] }); } + +/** + * A component to input a time. + * + * Values are passed as an object in 24-hour format (`{ hours: number, minutes: number }`). + * + * ```jsx + * import { TimePicker } from '@wordpress/components'; + * import { useState } from '@wordpress/element'; + * + * const MyTimeInput = () => { + * const [ time, setTime ] = useState( { hours: 13, minutes: 30 } ); + * + * return ( + * + * ); + * }; + * ``` + */ +TimePicker.TimeInput = TimeInput; +Object.assign(TimePicker.TimeInput, { + displayName: 'TimePicker.TimeInput' +}); /* harmony default export */ const date_time_time = (TimePicker); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/date-time/date-time/styles.js +;// ./node_modules/@wordpress/components/build-module/date-time/date-time/styles.js 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)."; } /** @@ -57378,20 +55448,19 @@ styles: "box-sizing:border-box" } : 0); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/date-time/date-time/index.js -/** - * External dependencies - */ - -/** - * WordPress dependencies - */ - -/** - * Internal dependencies - */ - - +;// ./node_modules/@wordpress/components/build-module/date-time/date-time/index.js +/** + * External dependencies + */ + +/** + * WordPress dependencies + */ + + +/** + * Internal dependencies + */ @@ -57401,6 +55470,7 @@ function UnforwardedDateTimePicker({ currentDate, is12Hour, + dateOrder, isInvalidDate, onMonthPreviewed = date_time_noop, onChange, @@ -57415,7 +55485,8 @@ children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(date_time_time, { currentTime: currentDate, onChange: onChange, - is12Hour: is12Hour + is12Hour: is12Hour, + dateOrder: dateOrder }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(date, { currentDate: currentDate, onChange: onChange, @@ -57453,7 +55524,7 @@ const DateTimePicker = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedDateTimePicker); /* harmony default export */ const date_time = (DateTimePicker); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/date-time/index.js +;// ./node_modules/@wordpress/components/build-module/date-time/index.js /** * Internal dependencies */ @@ -57463,7 +55534,7 @@ /* harmony default export */ const build_module_date_time = (date_time); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/dimension-control/sizes.js +;// ./node_modules/@wordpress/components/build-module/dimension-control/sizes.js /** * Sizes * @@ -57507,30 +55578,41 @@ slug: 'xlarge' }]); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/dimension-control/index.js -/** - * External dependencies - */ - - -/** - * WordPress dependencies - */ - - -/** - * Internal dependencies - */ - - - - - +;// ./node_modules/@wordpress/components/build-module/dimension-control/index.js +/** + * External dependencies + */ + + +/** + * WordPress dependencies + */ + + +/** + * Internal dependencies + */ + + + + + + + +const dimension_control_CONTEXT_VALUE = { + BaseControl: { + // Temporary during deprecation grace period: Overrides the underlying `__associatedWPComponentName` + // via the context system to override the value set by SelectControl. + _overrides: { + __associatedWPComponentName: 'DimensionControl' + } + } +}; /** * `DimensionControl` is a component designed to provide a UI to control spacing and/or dimensions. * - * This feature is still experimental. “Experimental” means this is an early implementation subject to drastic and breaking changes. + * @deprecated * * ```jsx * import { __experimentalDimensionControl as DimensionControl } from '@wordpress/components'; @@ -57541,6 +55623,8 @@ * * return ( * setPaddingSize( value ) } @@ -57553,6 +55637,7 @@ function DimensionControl(props) { const { __next40pxDefaultSize = false, + __nextHasNoMarginBottom = false, label, value, sizes = dimension_control_sizes, @@ -57560,6 +55645,15 @@ onChange, className = '' } = props; + external_wp_deprecated_default()('wp.components.DimensionControl', { + since: '6.7', + version: '7.0' + }); + maybeWarnDeprecated36pxSize({ + componentName: 'DimensionControl', + __next40pxDefaultSize, + size: undefined + }); const onChangeSpacingSize = val => { const theSize = findSizeBySlug(sizes, val); if (!theSize || value === theSize.slug) { @@ -57586,19 +55680,24 @@ icon: icon }), label] }); - return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(select_control, { - __next40pxDefaultSize: __next40pxDefaultSize, - className: dist_clsx(className, 'block-editor-dimension-control'), - label: selectLabel, - hideLabelFromVision: false, - value: value, - onChange: onChangeSpacingSize, - options: formatSizesAsOptions(sizes) + return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ContextSystemProvider, { + value: dimension_control_CONTEXT_VALUE, + children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(select_control, { + __next40pxDefaultSize: __next40pxDefaultSize, + __shouldNotWarnDeprecated36pxSize: true, + __nextHasNoMarginBottom: __nextHasNoMarginBottom, + className: dist_clsx(className, 'block-editor-dimension-control'), + label: selectLabel, + hideLabelFromVision: false, + value: value, + onChange: onChangeSpacingSize, + options: formatSizesAsOptions(sizes) + }) }); } /* harmony default export */ const dimension_control = (DimensionControl); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/disabled/styles/disabled-styles.js +;// ./node_modules/@wordpress/components/build-module/disabled/styles/disabled-styles.js 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)."; } /** * External dependencies @@ -57609,7 +55708,7 @@ styles: "position:relative;pointer-events:none;&::after{content:'';position:absolute;top:0;right:0;bottom:0;left:0;}*{pointer-events:none;}" } : 0; -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/disabled/index.js +;// ./node_modules/@wordpress/components/build-module/disabled/index.js /** * WordPress dependencies */ @@ -57644,7 +55743,14 @@ * const MyDisabled = () => { * const [ isDisabled, setIsDisabled ] = useState( true ); * - * let input = {} } />; + * let input = ( + * {} } + * /> + * ); * if ( isDisabled ) { * input = { input }; * } @@ -57686,11 +55792,10 @@ Disabled.Consumer = Consumer; /* harmony default export */ const disabled = (Disabled); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/disclosure/index.js -/** - * External dependencies - */ -// eslint-disable-next-line no-restricted-imports +;// ./node_modules/@wordpress/components/build-module/disclosure/index.js +/** + * External dependencies + */ /** @@ -57724,22 +55829,20 @@ const disclosure_DisclosureContent = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedDisclosureContent); /* harmony default export */ const disclosure = ((/* unused pure expression or super */ null && (disclosure_DisclosureContent))); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/draggable/index.js -/** - * External dependencies - */ - -/** - * WordPress dependencies - */ - - - -/** - * Internal dependencies - */ - - +;// ./node_modules/@wordpress/components/build-module/draggable/index.js +/** + * External dependencies + */ + +/** + * WordPress dependencies + */ + + + +/** + * Internal dependencies + */ const dragImageClass = 'components-draggable__invisible-drag-image'; const cloneWrapperClass = 'components-draggable__clone'; @@ -57798,7 +55901,7 @@ __experimentalDragComponent: dragComponent }) { const dragComponentRef = (0,external_wp_element_namespaceObject.useRef)(null); - const cleanup = (0,external_wp_element_namespaceObject.useRef)(() => {}); + const cleanupRef = (0,external_wp_element_namespaceObject.useRef)(() => {}); /** * Removes the element clone, resets cursor, and removes drag listener. @@ -57807,7 +55910,7 @@ */ function end(event) { event.preventDefault(); - cleanup.current(); + cleanupRef.current(); if (onDragEnd) { onDragEnd(event); } @@ -57921,7 +56024,7 @@ if (onDragStart) { onDragStart(event); } - cleanup.current = () => { + cleanupRef.current = () => { // Remove drag clone. if (cloneWrapper && cloneWrapper.parentNode) { cloneWrapper.parentNode.removeChild(cloneWrapper); @@ -57936,7 +56039,7 @@ }; } (0,external_wp_element_namespaceObject.useEffect)(() => () => { - cleanup.current(); + cleanupRef.current(); }, []); return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { children: [children({ @@ -57954,7 +56057,7 @@ } /* harmony default export */ const draggable = (Draggable); -;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/upload.js +;// ./node_modules/@wordpress/icons/build-module/library/upload.js /** * WordPress dependencies */ @@ -57969,100 +56072,24 @@ }); /* harmony default export */ const library_upload = (upload); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/drop-zone/index.js -/** - * External dependencies - */ - - -/** - * WordPress dependencies - */ - - - - - - -/** - * Internal dependencies - */ - - - -const drop_zone_backdrop = { - hidden: { - opacity: 0 - }, - show: { - opacity: 1, - transition: { - type: 'tween', - duration: 0.2, - delay: 0, - delayChildren: 0.1 - } - }, - exit: { - opacity: 0, - transition: { - duration: 0.2, - delayChildren: 0 - } - } -}; -const foreground = { - hidden: { - opacity: 0, - scale: 0.9 - }, - show: { - opacity: 1, - scale: 1, - transition: { - duration: 0.1 - } - }, - exit: { - opacity: 0, - scale: 0.9 - } -}; -function DropIndicator({ - label -}) { - const disableMotion = (0,external_wp_compose_namespaceObject.useReducedMotion)(); - const children = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(motion.div, { - variants: drop_zone_backdrop, - initial: disableMotion ? 'show' : 'hidden', - animate: "show", - exit: disableMotion ? 'show' : 'exit', - className: "components-drop-zone__content" - // Without this, when this div is shown, - // Safari calls a onDropZoneLeave causing a loop because of this bug - // https://bugs.webkit.org/show_bug.cgi?id=66547 - , - style: { - pointerEvents: 'none' - }, - children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(motion.div, { - variants: foreground, - children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(icons_build_module_icon, { - icon: library_upload, - className: "components-drop-zone__content-icon" - }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", { - className: "components-drop-zone__content-text", - children: label ? label : (0,external_wp_i18n_namespaceObject.__)('Drop files to upload') - })] - }) - }); - if (disableMotion) { - return children; - } - return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(AnimatePresence, { - children: children - }); -} +;// ./node_modules/@wordpress/components/build-module/drop-zone/index.js +/** + * External dependencies + */ + + +/** + * WordPress dependencies + */ + + + + + + +/** + * Internal dependencies + */ /** * `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. @@ -58093,19 +56120,23 @@ onFilesDrop, onHTMLDrop, onDrop, + isEligible = () => true, ...restProps }) { const [isDraggingOverDocument, setIsDraggingOverDocument] = (0,external_wp_element_namespaceObject.useState)(); const [isDraggingOverElement, setIsDraggingOverElement] = (0,external_wp_element_namespaceObject.useState)(); - const [type, setType] = (0,external_wp_element_namespaceObject.useState)(); + const [isActive, setIsActive] = (0,external_wp_element_namespaceObject.useState)(); const ref = (0,external_wp_compose_namespaceObject.__experimentalUseDropZone)({ onDrop(event) { - const files = event.dataTransfer ? (0,external_wp_dom_namespaceObject.getFilesFromDataTransfer)(event.dataTransfer) : []; - const html = event.dataTransfer?.getData('text/html'); + if (!event.dataTransfer) { + return; + } + const files = (0,external_wp_dom_namespaceObject.getFilesFromDataTransfer)(event.dataTransfer); + const html = event.dataTransfer.getData('text/html'); /** * From Windows Chrome 96, the `event.dataTransfer` returns both file object and HTML. - * The order of the checks is important to recognise the HTML drop. + * The order of the checks is important to recognize the HTML drop. */ if (html && onHTMLDrop) { onHTMLDrop(html); @@ -58117,25 +56148,29 @@ }, onDragStart(event) { setIsDraggingOverDocument(true); - let _type = 'default'; + if (!event.dataTransfer) { + return; + } /** * From Windows Chrome 96, the `event.dataTransfer` returns both file object and HTML. - * The order of the checks is important to recognise the HTML drop. + * The order of the checks is important to recognize the HTML drop. */ - if (event.dataTransfer?.types.includes('text/html')) { - _type = 'html'; + if (event.dataTransfer.types.includes('text/html')) { + setIsActive(!!onHTMLDrop); } else if ( // Check for the types because sometimes the files themselves // are only available on drop. - event.dataTransfer?.types.includes('Files') || (event.dataTransfer ? (0,external_wp_dom_namespaceObject.getFilesFromDataTransfer)(event.dataTransfer) : []).length > 0) { - _type = 'file'; - } - setType(_type); + event.dataTransfer.types.includes('Files') || (0,external_wp_dom_namespaceObject.getFilesFromDataTransfer)(event.dataTransfer).length > 0) { + setIsActive(!!onFilesDrop); + } else { + setIsActive(!!onDrop && isEligible(event.dataTransfer)); + } }, onDragEnd() { + setIsDraggingOverElement(false); setIsDraggingOverDocument(false); - setType(undefined); + setIsActive(undefined); }, onDragEnter() { setIsDraggingOverElement(true); @@ -58145,23 +56180,32 @@ } }); const classes = dist_clsx('components-drop-zone', className, { - 'is-active': (isDraggingOverDocument || isDraggingOverElement) && (type === 'file' && onFilesDrop || type === 'html' && onHTMLDrop || type === 'default' && onDrop), + 'is-active': isActive, 'is-dragging-over-document': isDraggingOverDocument, - 'is-dragging-over-element': isDraggingOverElement, - [`is-dragging-${type}`]: !!type + 'is-dragging-over-element': isDraggingOverElement }); return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { ...restProps, ref: ref, className: classes, - children: isDraggingOverElement && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(DropIndicator, { - label: label + children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { + className: "components-drop-zone__content", + children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { + className: "components-drop-zone__content-inner", + children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(icons_build_module_icon, { + icon: library_upload, + className: "components-drop-zone__content-icon" + }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", { + className: "components-drop-zone__content-text", + children: label ? label : (0,external_wp_i18n_namespaceObject.__)('Drop files to upload') + })] + }) }) }); } /* harmony default export */ const drop_zone = (DropZoneComponent); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/drop-zone/provider.js +;// ./node_modules/@wordpress/components/build-module/drop-zone/provider.js /** * WordPress dependencies */ @@ -58176,7 +56220,7 @@ return children; } -;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/swatch.js +;// ./node_modules/@wordpress/icons/build-module/library/swatch.js /** * WordPress dependencies */ @@ -58191,7 +56235,7 @@ }); /* harmony default export */ const library_swatch = (swatch); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/duotone-picker/utils.js +;// ./node_modules/@wordpress/components/build-module/duotone-picker/utils.js /** * External dependencies */ @@ -58284,7 +56328,7 @@ }) => color); } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/duotone-picker/duotone-swatch.js +;// ./node_modules/@wordpress/components/build-module/duotone-picker/duotone-swatch.js /** * WordPress dependencies */ @@ -58308,20 +56352,17 @@ } /* harmony default export */ const duotone_swatch = (DuotoneSwatch); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/duotone-picker/color-list-picker/index.js -/** - * WordPress dependencies - */ - - - - -/** - * Internal dependencies - */ - - - +;// ./node_modules/@wordpress/components/build-module/duotone-picker/color-list-picker/index.js +/** + * WordPress dependencies + */ + + + + +/** + * Internal dependencies + */ @@ -58342,23 +56383,19 @@ const contentId = `${idRoot}__content`; return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, { + __next40pxDefaultSize: true, className: "components-color-list-picker__swatch-button", + id: labelId, onClick: () => setIsOpen(prev => !prev), "aria-expanded": isOpen, "aria-controls": contentId, - children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(h_stack_component, { - justify: "flex-start", - spacing: 2, - children: [value ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(color_indicator, { - colorValue: value, - className: "components-color-list-picker__swatch-color" - }) : /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_icon, { - icon: library_swatch - }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", { - id: labelId, - children: label - })] - }) + icon: value ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(color_indicator, { + colorValue: value, + className: "components-color-list-picker__swatch-color" + }) : /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_icon, { + icon: library_swatch + }), + text: label }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { role: "group", id: contentId, @@ -58403,7 +56440,7 @@ } /* harmony default export */ const color_list_picker = (ColorListPicker); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/duotone-picker/custom-duotone-bar.js +;// ./node_modules/@wordpress/components/build-module/duotone-picker/custom-duotone-bar.js /** * Internal dependencies */ @@ -58431,22 +56468,21 @@ }); } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/duotone-picker/duotone-picker.js -/** - * External dependencies - */ - - -/** - * WordPress dependencies - */ - - - -/** - * Internal dependencies - */ - +;// ./node_modules/@wordpress/components/build-module/duotone-picker/duotone-picker.js +/** + * External dependencies + */ + + +/** + * WordPress dependencies + */ + + + +/** + * Internal dependencies + */ @@ -58542,40 +56578,20 @@ } }, slug); }); - let metaProps; - if (asButtons) { - metaProps = { - asButtons: true - }; - } else { - const _metaProps = { - asButtons: false, - loop - }; - if (ariaLabel) { - metaProps = { - ..._metaProps, - 'aria-label': ariaLabel - }; - } else if (ariaLabelledby) { - metaProps = { - ..._metaProps, - 'aria-labelledby': ariaLabelledby - }; - } else { - metaProps = { - ..._metaProps, - 'aria-label': (0,external_wp_i18n_namespaceObject.__)('Custom color picker.') - }; - } - } + const { + metaProps, + labelProps + } = getComputeCircularOptionPickerCommonProps(asButtons, loop, ariaLabel, ariaLabelledby); const options = unsetable ? [unsetOption, ...duotoneOptions] : duotoneOptions; return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_circular_option_picker, { ...otherProps, ...metaProps, + ...labelProps, options: options, actions: !!clearable && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_circular_option_picker.ButtonAction, { onClick: () => onChange(undefined), + accessibleWhenDisabled: true, + disabled: !value, children: (0,external_wp_i18n_namespaceObject.__)('Clear') }), children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(spacer_component, { @@ -58611,21 +56627,20 @@ } /* harmony default export */ const duotone_picker = (DuotonePicker); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/external-link/index.js -/** - * External dependencies - */ - -/** - * WordPress dependencies - */ - - - -/** - * Internal dependencies - */ - +;// ./node_modules/@wordpress/components/build-module/external-link/index.js +/** + * External dependencies + */ + +/** + * WordPress dependencies + */ + + + +/** + * Internal dependencies + */ function UnforwardedExternalLink(props, ref) { const { @@ -58649,29 +56664,25 @@ props.onClick(event); } }; - return ( - /*#__PURE__*/ - /* eslint-disable react/jsx-no-target-blank */ - (0,external_ReactJSXRuntime_namespaceObject.jsxs)("a", { - ...additionalProps, - className: classes, - href: href, - onClick: onClickHandler, - target: "_blank", - rel: optimizedRel, - ref: ref, - children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", { - className: "components-external-link__contents", - children: children - }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", { - className: "components-external-link__icon", - "aria-label": /* translators: accessibility text */ - (0,external_wp_i18n_namespaceObject.__)('(opens in a new tab)'), - children: "\u2197" - })] - }) - /* eslint-enable react/jsx-no-target-blank */ - ); + return /*#__PURE__*/ /* eslint-disable react/jsx-no-target-blank */(0,external_ReactJSXRuntime_namespaceObject.jsxs)("a", { + ...additionalProps, + className: classes, + href: href, + onClick: onClickHandler, + target: "_blank", + rel: optimizedRel, + ref: ref, + children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", { + className: "components-external-link__contents", + children: children + }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", { + className: "components-external-link__icon", + "aria-label": /* translators: accessibility text */ + (0,external_wp_i18n_namespaceObject.__)('(opens in a new tab)'), + children: "\u2197" + })] + }) + /* eslint-enable react/jsx-no-target-blank */; } /** @@ -58688,7 +56699,7 @@ const ExternalLink = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedExternalLink); /* harmony default export */ const external_link = (ExternalLink); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/focal-point-picker/utils.js +;// ./node_modules/@wordpress/components/build-module/focal-point-picker/utils.js const INITIAL_BOUNDS = { width: 200, height: 170 @@ -58729,7 +56740,7 @@ return Math.round(fraction * 100); } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/focal-point-picker/styles/focal-point-picker-style.js +;// ./node_modules/@wordpress/components/build-module/focal-point-picker/styles/focal-point-picker-style.js 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)."; } /** @@ -58751,7 +56762,7 @@ } : 0); const MediaContainer = /*#__PURE__*/emotion_styled_base_browser_esm("div", true ? { target: "eeew7dm7" -} : 0)("align-items:center;border-radius:", config_values.radiusBlockUi, ";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)); +} : 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)); const MediaPlaceholder = /*#__PURE__*/emotion_styled_base_browser_esm("div", true ? { target: "eeew7dm6" } : 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)); @@ -58806,16 +56817,15 @@ styles: "width:1px;top:1px;bottom:1px" } : 0); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/focal-point-picker/controls.js -/** - * WordPress dependencies - */ - - -/** - * Internal dependencies - */ - +;// ./node_modules/@wordpress/components/build-module/focal-point-picker/controls.js +/** + * WordPress dependencies + */ + + +/** + * Internal dependencies + */ @@ -58824,7 +56834,6 @@ const controls_noop = () => {}; function FocalPointPickerControls({ __nextHasNoMarginBottom, - __next40pxDefaultSize, hasHelpText, onChange = controls_noop, point = { @@ -58852,14 +56861,12 @@ hasHelpText: hasHelpText, gap: 4, children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(FocalPointUnitControl, { - __next40pxDefaultSize: __next40pxDefaultSize, label: (0,external_wp_i18n_namespaceObject.__)('Left'), "aria-label": (0,external_wp_i18n_namespaceObject.__)('Focal point left position'), value: [valueX, '%'].join(''), onChange: next => handleChange(next, 'x'), dragDirection: "e" }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(FocalPointUnitControl, { - __next40pxDefaultSize: __next40pxDefaultSize, label: (0,external_wp_i18n_namespaceObject.__)('Top'), "aria-label": (0,external_wp_i18n_namespaceObject.__)('Focal point top position'), value: [valueY, '%'].join(''), @@ -58870,6 +56877,7 @@ } function FocalPointUnitControl(props) { return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(focal_point_picker_style_StyledUnitControl, { + __next40pxDefaultSize: true, className: "focal-point-picker__controls-position-unit-control", labelPosition: "top", max: TEXTCONTROL_MAX, @@ -58882,15 +56890,19 @@ }); } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/focal-point-picker/styles/focal-point-style.js - -/** - * External dependencies +;// ./node_modules/@wordpress/components/build-module/focal-point-picker/styles/focal-point-style.js + +/** + * External dependencies + */ + +/** + * Internal dependencies */ const PointerCircle = /*#__PURE__*/emotion_styled_base_browser_esm("div", true ? { target: "e19snlhg0" -} : 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:50%;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;}", ({ +} : 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;}", ({ isDragging }) => isDragging && ` box-shadow: rgb( 0 0 0 / 12% ) 0px 0px 10px; @@ -58898,7 +56910,7 @@ cursor: grabbing; `, ";" + ( true ? "" : 0)); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/focal-point-picker/focal-point.js +;// ./node_modules/@wordpress/components/build-module/focal-point-picker/focal-point.js /** * Internal dependencies */ @@ -58924,11 +56936,10 @@ }); } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/focal-point-picker/grid.js -/** - * Internal dependencies - */ - +;// ./node_modules/@wordpress/components/build-module/focal-point-picker/grid.js +/** + * Internal dependencies + */ function FocalPointPickerGrid({ @@ -58962,7 +56973,7 @@ }); } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/focal-point-picker/media.js +;// ./node_modules/@wordpress/components/build-module/focal-point-picker/media.js /** * External dependencies */ @@ -59011,23 +57022,22 @@ }); } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/focal-point-picker/index.js -/** - * External dependencies - */ - - -/** - * WordPress dependencies - */ - - - - -/** - * Internal dependencies - */ - +;// ./node_modules/@wordpress/components/build-module/focal-point-picker/index.js +/** + * External dependencies + */ + + +/** + * WordPress dependencies + */ + + + + +/** + * Internal dependencies + */ @@ -59072,6 +57082,7 @@ * return ( * <> * { var _options$find; const { __next40pxDefaultSize, fontSizes, value, - disableCustomFontSizes, size, - onChange, - onSelectCustom + onChange } = props; const areAllSizesSameUnit = !!getCommonSizeUnit(fontSizes); const options = [DEFAULT_OPTION, ...fontSizes.map(fontSize => { @@ -59470,12 +57452,13 @@ key: fontSize.slug, name: fontSize.name || fontSize.slug, value: fontSize.size, - __experimentalHint: hint - }; - }), ...(disableCustomFontSizes ? [] : [CUSTOM_OPTION])]; - const selectedOption = value ? (_options$find = options.find(option => option.value === value)) !== null && _options$find !== void 0 ? _options$find : CUSTOM_OPTION : DEFAULT_OPTION; - return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(CustomSelectControl, { + hint + }; + })]; + const selectedOption = (_options$find = options.find(option => option.value === value)) !== null && _options$find !== void 0 ? _options$find : DEFAULT_OPTION; + return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(custom_select_control, { __next40pxDefaultSize: __next40pxDefaultSize, + __shouldNotWarnDeprecated36pxSize: true, className: "components-font-size-picker__select", label: (0,external_wp_i18n_namespaceObject.__)('Font size'), hideLabelFromVision: true, @@ -59484,75 +57467,18 @@ (0,external_wp_i18n_namespaceObject.__)('Currently selected font size: %s'), selectedOption.name), options: options, value: selectedOption, - __experimentalShowSelectedHint: true, + showSelectedHint: true, onChange: ({ selectedItem }) => { - if (selectedItem === CUSTOM_OPTION) { - onSelectCustom(); - } else { - onChange(selectedItem.value); - } + onChange(selectedItem.value); }, size: size }); }; /* harmony default export */ const font_size_picker_select = (FontSizePickerSelect); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/toggle-group-control/toggle-group-control-option/component.js -/** - * External dependencies - */ - -/** - * WordPress dependencies - */ - - -/** - * Internal dependencies - */ - - - -function UnforwardedToggleGroupControlOption(props, ref) { - const { - label, - ...restProps - } = props; - const optionLabel = restProps['aria-label'] || label; - return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(toggle_group_control_option_base_component, { - ...restProps, - "aria-label": optionLabel, - ref: ref, - children: label - }); -} - -/** - * `ToggleGroupControlOption` is a form component and is meant to be used as a - * child of `ToggleGroupControl`. - * - * ```jsx - * import { - * __experimentalToggleGroupControl as ToggleGroupControl, - * __experimentalToggleGroupControlOption as ToggleGroupControlOption, - * } from '@wordpress/components'; - * - * function Example() { - * return ( - * - * - * - * - * ); - * } - * ``` - */ -const ToggleGroupControlOption = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedToggleGroupControlOption); -/* harmony default export */ const toggle_group_control_option_component = (ToggleGroupControlOption); - -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/font-size-picker/constants.js +;// ./node_modules/@wordpress/components/build-module/font-size-picker/constants.js /** * WordPress dependencies */ @@ -59579,7 +57505,7 @@ */ 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')]; -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/font-size-picker/font-size-picker-toggle-group.js +;// ./node_modules/@wordpress/components/build-module/font-size-picker/font-size-picker-toggle-group.js /** * WordPress dependencies */ @@ -59602,6 +57528,7 @@ return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(toggle_group_control_component, { __nextHasNoMarginBottom: true, __next40pxDefaultSize: __next40pxDefaultSize, + __shouldNotWarnDeprecated36pxSize: true, label: (0,external_wp_i18n_namespaceObject.__)('Font size'), hideLabelFromVision: true, value: value, @@ -59618,7 +57545,7 @@ }; /* harmony default export */ const font_size_picker_toggle_group = (FontSizePickerToggleGroup); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/font-size-picker/index.js +;// ./node_modules/@wordpress/components/build-module/font-size-picker/index.js /** * External dependencies */ @@ -59647,6 +57574,7 @@ const DEFAULT_UNITS = ['px', 'em', 'rem', 'vw', 'vh']; +const MAX_TOGGLE_GROUP_SIZES = 5; const UnforwardedFontSizePicker = (props, ref) => { const { __next40pxDefaultSize = false, @@ -59663,26 +57591,37 @@ const units = useCustomUnits({ availableUnits: unitsProp }); - const shouldUseSelectControl = fontSizes.length > 5; const selectedFontSize = fontSizes.find(fontSize => fontSize.size === value); const isCustomValue = !!value && !selectedFontSize; - const [showCustomValueControl, setShowCustomValueControl] = (0,external_wp_element_namespaceObject.useState)(!disableCustomFontSizes && isCustomValue); + + // Initially request a custom picker if the value is not from the predef list. + const [userRequestedCustom, setUserRequestedCustom] = (0,external_wp_element_namespaceObject.useState)(isCustomValue); + let currentPickerType; + if (!disableCustomFontSizes && userRequestedCustom) { + // While showing the custom value picker, switch back to predef only if + // `disableCustomFontSizes` is set to `true`. + currentPickerType = 'custom'; + } else { + currentPickerType = fontSizes.length > MAX_TOGGLE_GROUP_SIZES ? 'select' : 'togglegroup'; + } const headerHint = (0,external_wp_element_namespaceObject.useMemo)(() => { - if (showCustomValueControl) { - return (0,external_wp_i18n_namespaceObject.__)('Custom'); - } - if (!shouldUseSelectControl) { - if (selectedFontSize) { - return selectedFontSize.name || T_SHIRT_NAMES[fontSizes.indexOf(selectedFontSize)]; - } - return ''; - } - const commonUnit = getCommonSizeUnit(fontSizes); - if (commonUnit) { - return `(${commonUnit})`; + switch (currentPickerType) { + case 'custom': + return (0,external_wp_i18n_namespaceObject.__)('Custom'); + case 'togglegroup': + if (selectedFontSize) { + return selectedFontSize.name || T_SHIRT_NAMES[fontSizes.indexOf(selectedFontSize)]; + } + break; + case 'select': + const commonUnit = getCommonSizeUnit(fontSizes); + if (commonUnit) { + return `(${commonUnit})`; + } + break; } return ''; - }, [showCustomValueControl, shouldUseSelectControl, selectedFontSize, fontSizes]); + }, [currentPickerType, selectedFontSize, fontSizes]); if (fontSizes.length === 0 && disableCustomFontSizes) { return null; } @@ -59694,6 +57633,11 @@ const [valueQuantity, valueUnit] = parseQuantityAndUnitFromRawValue(value, units); const isValueUnitRelative = !!valueUnit && ['em', 'rem', 'vw', 'vh'].includes(valueUnit); const isDisabled = value === undefined; + maybeWarnDeprecated36pxSize({ + componentName: 'FontSizePicker', + __next40pxDefaultSize, + size + }); return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(styles_Container, { ref: ref, className: "components-font-size-picker", @@ -59710,17 +57654,15 @@ children: headerHint })] }), !disableCustomFontSizes && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(HeaderToggle, { - label: showCustomValueControl ? (0,external_wp_i18n_namespaceObject.__)('Use size preset') : (0,external_wp_i18n_namespaceObject.__)('Set custom size'), + label: currentPickerType === 'custom' ? (0,external_wp_i18n_namespaceObject.__)('Use size preset') : (0,external_wp_i18n_namespaceObject.__)('Set custom size'), icon: library_settings, - onClick: () => { - setShowCustomValueControl(!showCustomValueControl); - }, - isPressed: showCustomValueControl, + onClick: () => setUserRequestedCustom(!userRequestedCustom), + isPressed: currentPickerType === 'custom', size: "small" })] }) }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { - children: [!!fontSizes.length && shouldUseSelectControl && !showCustomValueControl && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(font_size_picker_select, { + children: [currentPickerType === 'select' && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(font_size_picker_select, { __next40pxDefaultSize: __next40pxDefaultSize, fontSizes: fontSizes, value: value, @@ -59733,8 +57675,8 @@ onChange?.(hasUnits ? newValue : Number(newValue), fontSizes.find(fontSize => fontSize.size === newValue)); } }, - onSelectCustom: () => setShowCustomValueControl(true) - }), !shouldUseSelectControl && !showCustomValueControl && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(font_size_picker_toggle_group, { + onSelectCustom: () => setUserRequestedCustom(true) + }), currentPickerType === 'togglegroup' && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(font_size_picker_toggle_group, { fontSizes: fontSizes, value: value, __next40pxDefaultSize: __next40pxDefaultSize, @@ -59746,17 +57688,19 @@ onChange?.(hasUnits ? newValue : Number(newValue), fontSizes.find(fontSize => fontSize.size === newValue)); } } - }), !disableCustomFontSizes && showCustomValueControl && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(flex_component, { + }), currentPickerType === 'custom' && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(flex_component, { className: "components-font-size-picker__custom-size-control", children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(flex_item_component, { isBlock: true, children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(unit_control, { __next40pxDefaultSize: __next40pxDefaultSize, + __shouldNotWarnDeprecated36pxSize: true, label: (0,external_wp_i18n_namespaceObject.__)('Custom'), labelPosition: "top", hideLabelFromVision: true, value: value, onChange: newValue => { + setUserRequestedCustom(true); if (newValue === undefined) { onChange?.(undefined); } else { @@ -59775,6 +57719,7 @@ children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(range_control, { __nextHasNoMarginBottom: true, __next40pxDefaultSize: __next40pxDefaultSize, + __shouldNotWarnDeprecated36pxSize: true, className: "components-font-size-picker__custom-input", label: (0,external_wp_i18n_namespaceObject.__)('Custom Size'), hideLabelFromVision: true, @@ -59782,6 +57727,7 @@ initialPosition: fallbackFontSize, withInputField: false, onChange: newValue => { + setUserRequestedCustom(true); if (newValue === undefined) { onChange?.(undefined); } else if (hasUnits) { @@ -59798,7 +57744,7 @@ }), withReset && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(flex_item_component, { children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Button, { disabled: isDisabled, - __experimentalIsFocusable: true, + accessibleWhenDisabled: true, onClick: () => { onChange?.(undefined); }, @@ -59815,26 +57761,27 @@ const FontSizePicker = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedFontSizePicker); /* harmony default export */ const font_size_picker = (FontSizePicker); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/form-file-upload/index.js -/** - * WordPress dependencies - */ - - -/** - * Internal dependencies - */ - - - -/** - * FormFileUpload is a component that allows users to select files from their local device. +;// ./node_modules/@wordpress/components/build-module/form-file-upload/index.js +/** + * WordPress dependencies + */ + + +/** + * Internal dependencies + */ + + + +/** + * FormFileUpload allows users to select files from their local device. * * ```jsx * import { FormFileUpload } from '@wordpress/components'; * * const MyFormFileUpload = () => ( * console.log( event.currentTarget.files ) } * > @@ -59843,6 +57790,7 @@ * ); * ``` */ + function FormFileUpload({ accept, children, @@ -59856,6 +57804,14 @@ const openFileDialog = () => { ref.current?.click(); }; + if (!render) { + maybeWarnDeprecated36pxSize({ + componentName: 'FormFileUpload', + __next40pxDefaultSize: props.__next40pxDefaultSize, + // @ts-expect-error - We don't "officially" support all Button props but this likely happens. + size: props.size + }); + } const ui = render ? render({ openFileDialog }) : /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, { @@ -59863,6 +57819,12 @@ ...props, children: children }); + // @todo: Temporary fix a bug that prevents Chromium browsers from selecting ".heic" files + // from the file upload. See https://core.trac.wordpress.org/ticket/62268#comment:4. + // This can be removed once the Chromium fix is in the stable channel. + // Prevent Safari from adding "image/heic" and "image/heif" to the accept attribute. + const isSafari = globalThis.window?.navigator.userAgent.includes('Safari') && !globalThis.window?.navigator.userAgent.includes('Chrome') && !globalThis.window?.navigator.userAgent.includes('Chromium'); + const compatAccept = !isSafari && !!accept?.includes('image/*') ? `${accept}, image/heic, image/heif` : accept; return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { className: "components-form-file-upload", children: [ui, /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("input", { @@ -59872,7 +57834,7 @@ style: { display: 'none' }, - accept: accept, + accept: compatAccept, onChange: onChange, onClick: onClick, "data-testid": "form-file-upload-input" @@ -59881,43 +57843,22 @@ } /* harmony default export */ const form_file_upload = (FormFileUpload); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/form-toggle/index.js -/** - * External dependencies - */ - -/** - * WordPress dependencies - */ - - -/** - * Internal dependencies - */ - +;// ./node_modules/@wordpress/components/build-module/form-toggle/index.js +/** + * External dependencies + */ + +/** + * WordPress dependencies + */ + + +/** + * Internal dependencies + */ const form_toggle_noop = () => {}; - -/** - * FormToggle switches a single setting on or off. - * - * ```jsx - * import { FormToggle } from '@wordpress/components'; - * import { useState } from '@wordpress/element'; - * - * const MyFormToggle = () => { - * const [ isChecked, setChecked ] = useState( true ); - * - * return ( - * setChecked( ( state ) => ! state ) } - * /> - * ); - * }; - * ``` - */ -function FormToggle(props, ref) { +function UnforwardedFormToggle(props, ref) { const { className, checked, @@ -59948,25 +57889,45 @@ })] }); } -/* harmony default export */ const form_toggle = ((0,external_wp_element_namespaceObject.forwardRef)(FormToggle)); - -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/form-token-field/token.js -/** - * External dependencies - */ - - -/** - * WordPress dependencies - */ - - - - -/** - * Internal dependencies - */ - + +/** + * FormToggle switches a single setting on or off. + * + * ```jsx + * import { FormToggle } from '@wordpress/components'; + * import { useState } from '@wordpress/element'; + * + * const MyFormToggle = () => { + * const [ isChecked, setChecked ] = useState( true ); + * + * return ( + * setChecked( ( state ) => ! state ) } + * /> + * ); + * }; + * ``` + */ +const FormToggle = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedFormToggle); +/* harmony default export */ const form_toggle = (FormToggle); + +;// ./node_modules/@wordpress/components/build-module/form-token-field/token.js +/** + * External dependencies + */ + + +/** + * WordPress dependencies + */ + + + + +/** + * Internal dependencies + */ @@ -59997,7 +57958,7 @@ value }); const transformedValue = displayTransform(value); - 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. */ + 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. */ (0,external_wp_i18n_namespaceObject.__)('%1$s (%2$s of %3$s)'), transformedValue, termPosition, termsCount); return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("span", { className: tokenClasses, @@ -60016,8 +57977,12 @@ })] }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, { className: "components-form-token-field__remove-token", + size: "small", icon: close_small, - onClick: !disabled ? onClick : undefined, + onClick: !disabled ? onClick : undefined + // Disable reason: Even when FormTokenField itself is accessibly disabled, token reset buttons shouldn't be in the tab sequence. + // eslint-disable-next-line no-restricted-syntax + , disabled: disabled, label: messages.remove, "aria-describedby": `components-form-token-field__token-text-${instanceId}` @@ -60025,7 +57990,7 @@ }); } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/form-token-field/styles.js +;// ./node_modules/@wordpress/components/build-module/form-token-field/styles.js /** * External dependencies @@ -60047,14 +58012,15 @@ target: "ehq8nmi0" } : 0)("padding:7px;", boxSizingReset, " ", deprecatedPaddings, ";" + ( true ? "" : 0)); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/form-token-field/index.js -/** - * External dependencies - */ - -/** - * WordPress dependencies - */ +;// ./node_modules/@wordpress/components/build-module/form-token-field/index.js +/** + * External dependencies + */ + +/** + * WordPress dependencies + */ + @@ -60121,6 +58087,18 @@ __nextHasNoMarginBottom = false, tokenizeOnBlur = false } = useDeprecated36pxDefaultSizeProp(props); + if (!__nextHasNoMarginBottom) { + external_wp_deprecated_default()('Bottom margin styles for wp.components.FormTokenField', { + since: '6.7', + version: '7.0', + hint: 'Set the `__nextHasNoMarginBottom` prop to true to start opting into the new styles, which will become the default in a future version.' + }); + } + maybeWarnDeprecated36pxSize({ + componentName: 'FormTokenField', + size: undefined, + __next40pxDefaultSize + }); const instanceId = (0,external_wp_compose_namespaceObject.useInstanceId)(FormTokenField); // We reset to these initial values again in the onBlur @@ -60148,15 +58126,12 @@ } // TODO: updateSuggestions() should first be refactored so its actual deps are clearer. - // eslint-disable-next-line react-hooks/exhaustive-deps }, [suggestions, prevSuggestions, value, prevValue]); (0,external_wp_element_namespaceObject.useEffect)(() => { updateSuggestions(); - // eslint-disable-next-line react-hooks/exhaustive-deps }, [incompleteTokenValue]); (0,external_wp_element_namespaceObject.useEffect)(() => { updateSuggestions(); - // eslint-disable-next-line react-hooks/exhaustive-deps }, [__experimentalAutoSelectFirstMatch]); if (disabled && isActive) { setIsActive(false); @@ -60489,7 +58464,7 @@ } } if (inputHasMinimumChars) { - const message = hasMatchingSuggestions ? (0,external_wp_i18n_namespaceObject.sprintf)( /* translators: %d: number of results. */ + const message = hasMatchingSuggestions ? (0,external_wp_i18n_namespaceObject.sprintf)(/* translators: %d: number of results. */ (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.'); debouncedSpeak(message, 'assertive'); } @@ -60604,7 +58579,7 @@ } /* harmony default export */ const form_token_field = (FormTokenField); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/guide/icons.js +;// ./node_modules/@wordpress/components/build-module/guide/icons.js /** * WordPress dependencies */ @@ -60622,7 +58597,7 @@ }) }); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/guide/page-control.js +;// ./node_modules/@wordpress/components/build-module/guide/page-control.js /** * WordPress dependencies */ @@ -60648,8 +58623,9 @@ // Set aria-current="step" on the active page, see https://www.w3.org/TR/wai-aria-1.1/#aria-current "aria-current": page === currentPage ? 'step' : undefined, children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, { + size: "small", icon: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(PageControlIcon, {}), - "aria-label": (0,external_wp_i18n_namespaceObject.sprintf)( /* translators: 1: current page number 2: total number of pages */ + "aria-label": (0,external_wp_i18n_namespaceObject.sprintf)(/* translators: 1: current page number 2: total number of pages */ (0,external_wp_i18n_namespaceObject.__)('Page %1$d of %2$d'), page + 1, numberOfPages), onClick: () => setCurrentPage(page) }, page) @@ -60657,23 +58633,22 @@ }); } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/guide/index.js -/** - * External dependencies - */ - - -/** - * WordPress dependencies - */ - - - - -/** - * Internal dependencies - */ - +;// ./node_modules/@wordpress/components/build-module/guide/index.js +/** + * External dependencies + */ + + +/** + * WordPress dependencies + */ + + + + +/** + * Internal dependencies + */ @@ -60788,16 +58763,19 @@ className: "components-guide__back-button", variant: "tertiary", onClick: goBack, + __next40pxDefaultSize: true, children: (0,external_wp_i18n_namespaceObject.__)('Previous') }), canGoForward && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, { className: "components-guide__forward-button", variant: "primary", onClick: goForward, + __next40pxDefaultSize: true, children: (0,external_wp_i18n_namespaceObject.__)('Next') }), !canGoForward && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, { className: "components-guide__finish-button", variant: "primary", onClick: onFinish, + __next40pxDefaultSize: true, children: finishButtonText })] })] @@ -60806,7 +58784,7 @@ } /* harmony default export */ const guide = (Guide); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/guide/page.js +;// ./node_modules/@wordpress/components/build-module/guide/page.js /** * WordPress dependencies */ @@ -60829,7 +58807,7 @@ }); } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/button/deprecated.js +;// ./node_modules/@wordpress/components/build-module/button/deprecated.js /** * External dependencies */ @@ -60868,151 +58846,16 @@ } /* harmony default export */ const deprecated = ((0,external_wp_element_namespaceObject.forwardRef)(UnforwardedIconButton)); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/item-group/item/hook.js -/** - * WordPress dependencies - */ - - -/** - * Internal dependencies - */ - - - - - -function useItem(props) { - const { - as: asProp, - className, - onClick, - role = 'listitem', - size: sizeProp, - ...otherProps - } = useContextSystem(props, 'Item'); - const { - spacedAround, - size: contextSize - } = useItemGroupContext(); - const size = sizeProp || contextSize; - const as = asProp || (typeof onClick !== 'undefined' ? 'button' : 'div'); - const cx = useCx(); - 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]); - const wrapperClassName = cx(itemWrapper); - return { - as, - className: classes, - onClick, - wrapperClassName, - role, - ...otherProps - }; -} - -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/item-group/item/component.js -/** - * External dependencies - */ - -/** - * Internal dependencies - */ - - - - - -function UnconnectedItem(props, forwardedRef) { - const { - role, - wrapperClassName, - ...otherProps - } = useItem(props); - return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { - role: role, - className: wrapperClassName, - children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(component, { - ...otherProps, - ref: forwardedRef - }) - }); -} - -/** - * `Item` is used in combination with `ItemGroup` to display a list of items - * grouped and styled together. - * - * ```jsx - * import { - * __experimentalItemGroup as ItemGroup, - * __experimentalItem as Item, - * } from '@wordpress/components'; - * - * function Example() { - * return ( - * - * Code - * is - * Poetry - * - * ); - * } - * ``` - */ -const component_Item = contextConnect(UnconnectedItem, 'Item'); -/* harmony default export */ const item_component = (component_Item); - -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/input-control/input-prefix-wrapper.js -/** - * External dependencies - */ - -/** - * Internal dependencies - */ - - - -function UnconnectedInputControlPrefixWrapper(props, forwardedRef) { - const derivedProps = useContextSystem(props, 'InputControlPrefixWrapper'); - return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(spacer_component, { - marginBottom: 0, - ...derivedProps, - ref: forwardedRef - }); -} - -/** - * A convenience wrapper for the `prefix` when you want to apply - * standard padding in accordance with the size variant. - * - * ```jsx - * import { - * __experimentalInputControl as InputControl, - * __experimentalInputControlPrefixWrapper as InputControlPrefixWrapper, - * } from '@wordpress/components'; - * - * @} - * /> - * ``` - */ -const InputControlPrefixWrapper = contextConnect(UnconnectedInputControlPrefixWrapper, 'InputControlPrefixWrapper'); -/* harmony default export */ const input_prefix_wrapper = (InputControlPrefixWrapper); - -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/keyboard-shortcuts/index.js -/** - * WordPress dependencies - */ - - - -/** - * Internal dependencies - */ - - +;// ./node_modules/@wordpress/components/build-module/keyboard-shortcuts/index.js +/** + * WordPress dependencies + */ + + + +/** + * Internal dependencies + */ function KeyboardShortcut({ target, @@ -61088,22 +58931,21 @@ } /* harmony default export */ const keyboard_shortcuts = (KeyboardShortcuts); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/menu-group/index.js -/** - * External dependencies - */ - - -/** - * WordPress dependencies - */ - - - -/** - * Internal dependencies - */ - +;// ./node_modules/@wordpress/components/build-module/menu-group/index.js +/** + * External dependencies + */ + + +/** + * WordPress dependencies + */ + + + +/** + * Internal dependencies + */ /** * `MenuGroup` wraps a series of related `MenuItem` components into a common @@ -61151,22 +58993,21 @@ } /* harmony default export */ const menu_group = (MenuGroup); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/menu-item/index.js -/** - * External dependencies - */ - - - -/** - * WordPress dependencies - */ - - -/** - * Internal dependencies - */ - +;// ./node_modules/@wordpress/components/build-module/menu-item/index.js +/** + * External dependencies + */ + + + +/** + * WordPress dependencies + */ + + +/** + * Internal dependencies + */ @@ -61205,6 +59046,7 @@ }); } return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(build_module_button, { + __next40pxDefaultSize: true, ref: ref // Make sure aria-checked matches spec https://www.w3.org/TR/wai-aria-1.1/#aria-checked , @@ -61251,16 +59093,15 @@ const MenuItem = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedMenuItem); /* harmony default export */ const menu_item = (MenuItem); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/menu-items-choice/index.js -/** - * WordPress dependencies - */ - - -/** - * Internal dependencies - */ - +;// ./node_modules/@wordpress/components/build-module/menu-items-choice/index.js +/** + * WordPress dependencies + */ + + +/** + * Internal dependencies + */ const menu_items_choice_noop = () => {}; @@ -61330,7 +59171,7 @@ } /* harmony default export */ const menu_items_choice = (MenuItemsChoice); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/navigable-container/tabbable.js +;// ./node_modules/@wordpress/components/build-module/navigable-container/tabbable.js /** * External dependencies */ @@ -61420,11 +59261,11 @@ const TabbableContainer = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedTabbableContainer); /* harmony default export */ const tabbable = (TabbableContainer); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/navigation/constants.js +;// ./node_modules/@wordpress/components/build-module/navigation/constants.js const ROOT_MENU = 'root'; const SEARCH_FOCUS_DELAY = 100; -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/navigation/context.js +;// ./node_modules/@wordpress/components/build-module/navigation/context.js /** * WordPress dependencies */ @@ -61457,7 +59298,7 @@ }); const useNavigationContext = () => (0,external_wp_element_namespaceObject.useContext)(NavigationContext); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/navigation/styles/navigation-styles.js +;// ./node_modules/@wordpress/components/build-module/navigation/styles/navigation-styles.js 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)."; } /** @@ -61510,11 +59351,11 @@ } : 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)); const ItemBaseUI = /*#__PURE__*/emotion_styled_base_browser_esm("li", true ? { target: "eeiismy4" -} : 0)("border-radius:2px;color:inherit;margin-bottom:0;>button,>a.components-button,>a{width:100%;color:inherit;opacity:0.7;padding:", space(2), " ", space(4), ";", rtl({ +} : 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({ textAlign: 'left' }, { textAlign: 'right' -}), " &: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)); +}), " &: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.theme.accentInverted, ";>button,.components-button:hover,>a{color:", COLORS.theme.accentInverted, ";opacity:1;}}>svg path{color:", COLORS.gray[600], ";}" + ( true ? "" : 0)); const ItemUI = /*#__PURE__*/emotion_styled_base_browser_esm("div", true ? { target: "eeiismy3" } : 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)); @@ -61523,12 +59364,12 @@ } : 0)("display:flex;margin-right:", space(2), ";" + ( true ? "" : 0)); const ItemBadgeUI = /*#__PURE__*/emotion_styled_base_browser_esm("span", true ? { target: "eeiismy1" -} : 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:2px;@keyframes fade-in{from{opacity:0;}to{opacity:1;}}@media not ( prefers-reduced-motion ){animation:fade-in 250ms ease-out;}" + ( true ? "" : 0)); +} : 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)); const ItemTitleUI = /*#__PURE__*/emotion_styled_base_browser_esm(text_component, true ? { target: "eeiismy0" } : 0)(() => (0,external_wp_i18n_namespaceObject.isRTL)() ? 'margin-left: auto;' : 'margin-right: auto;', " font-size:14px;line-height:20px;color:inherit;" + ( true ? "" : 0)); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/navigation/use-navigation-tree-nodes.js +;// ./node_modules/@wordpress/components/build-module/navigation/use-navigation-tree-nodes.js /** * WordPress dependencies */ @@ -61563,7 +59404,7 @@ }; } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/navigation/use-create-navigation-tree.js +;// ./node_modules/@wordpress/components/build-module/navigation/use-create-navigation-tree.js /** * WordPress dependencies */ @@ -61654,15 +59495,16 @@ }; }; -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/navigation/index.js -/** - * External dependencies - */ - - -/** - * WordPress dependencies - */ +;// ./node_modules/@wordpress/components/build-module/navigation/index.js +/** + * External dependencies + */ + + +/** + * WordPress dependencies + */ + @@ -61730,6 +59572,11 @@ const [slideOrigin, setSlideOrigin] = (0,external_wp_element_namespaceObject.useState)(); const navigationTree = useCreateNavigationTree(); const defaultSlideOrigin = (0,external_wp_i18n_namespaceObject.isRTL)() ? 'right' : 'left'; + external_wp_deprecated_default()('wp.components.Navigation (and all subcomponents)', { + since: '6.8', + version: '7.1', + alternative: 'wp.components.Navigator' + }); const setActiveMenu = (menuId, slideInOrigin = defaultSlideOrigin) => { if (!navigationTree.getMenu(menuId)) { return; @@ -61740,19 +59587,18 @@ }; // Used to prevent the sliding animation on mount - const isMounted = (0,external_wp_element_namespaceObject.useRef)(false); + const isMountedRef = (0,external_wp_element_namespaceObject.useRef)(false); (0,external_wp_element_namespaceObject.useEffect)(() => { - if (!isMounted.current) { - isMounted.current = true; + if (!isMountedRef.current) { + isMountedRef.current = true; } }, []); (0,external_wp_element_namespaceObject.useEffect)(() => { if (activeMenu !== menu) { setActiveMenu(activeMenu); } - // Ignore exhaustive-deps here, as it would require either a larger refactor or some questionable workarounds. + // Not adding deps for now, as it would require either a larger refactor or some questionable workarounds. // See https://github.com/WordPress/gutenberg/pull/41612 for context. - // eslint-disable-next-line react-hooks/exhaustive-deps }, [activeMenu]); const context = { activeItem, @@ -61769,7 +59615,7 @@ className: classes, children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { className: animateClassName ? dist_clsx({ - [animateClassName]: isMounted.current && slideOrigin + [animateClassName]: isMountedRef.current && slideOrigin }) : undefined, children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(NavigationContext.Provider, { value: context, @@ -61780,7 +59626,7 @@ } /* harmony default export */ const navigation = (Navigation); -;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/chevron-right.js +;// ./node_modules/@wordpress/icons/build-module/library/chevron-right.js /** * WordPress dependencies */ @@ -61795,7 +59641,7 @@ }); /* harmony default export */ const chevron_right = (chevronRight); -;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/chevron-left.js +;// ./node_modules/@wordpress/icons/build-module/library/chevron-left.js /** * WordPress dependencies */ @@ -61810,22 +59656,21 @@ }); /* harmony default export */ const chevron_left = (chevronLeft); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/navigation/back-button/index.js -/** - * External dependencies - */ - -/** - * WordPress dependencies - */ - - - - -/** - * Internal dependencies - */ - +;// ./node_modules/@wordpress/components/build-module/navigation/back-button/index.js +/** + * External dependencies + */ + +/** + * WordPress dependencies + */ + + + + +/** + * Internal dependencies + */ @@ -61853,6 +59698,7 @@ }; const icon = (0,external_wp_i18n_namespaceObject.isRTL)() ? chevron_right : chevron_left; return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(MenuBackButtonUI, { + __next40pxDefaultSize: true, className: classes, href: href, variant: "tertiary", @@ -61870,7 +59716,7 @@ const NavigationBackButton = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedNavigationBackButton); /* harmony default export */ const back_button = (NavigationBackButton); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/navigation/group/context.js +;// ./node_modules/@wordpress/components/build-module/navigation/group/context.js /** * WordPress dependencies */ @@ -61885,21 +59731,20 @@ }); const useNavigationGroupContext = () => (0,external_wp_element_namespaceObject.useContext)(NavigationGroupContext); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/navigation/group/index.js -/** - * External dependencies - */ - - -/** - * WordPress dependencies - */ - - -/** - * Internal dependencies - */ - +;// ./node_modules/@wordpress/components/build-module/navigation/group/index.js +/** + * External dependencies + */ + + +/** + * WordPress dependencies + */ + + +/** + * Internal dependencies + */ @@ -61952,12 +59797,10 @@ } /* harmony default export */ const group = (NavigationGroup); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/navigation/item/base-content.js -/** - * Internal dependencies - */ - - +;// ./node_modules/@wordpress/components/build-module/navigation/item/base-content.js +/** + * Internal dependencies + */ function NavigationItemBaseContent(props) { @@ -61977,7 +59820,7 @@ }); } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/navigation/menu/context.js +;// ./node_modules/@wordpress/components/build-module/navigation/menu/context.js /** * WordPress dependencies */ @@ -61993,7 +59836,7 @@ }); const useNavigationMenuContext = () => (0,external_wp_element_namespaceObject.useContext)(NavigationMenuContext); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/navigation/utils.js +;// ./node_modules/@wordpress/components/build-module/navigation/utils.js /** * External dependencies */ @@ -62003,7 +59846,7 @@ const normalizeInput = input => remove_accents_default()(input).replace(/^\//, '').toLowerCase(); const normalizedSearch = (title, search) => -1 !== normalizeInput(title).indexOf(normalizeInput(search)); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/navigation/item/use-navigation-tree-item.js +;// ./node_modules/@wordpress/components/build-module/navigation/item/use-navigation-tree-item.js /** * WordPress dependencies */ @@ -62043,12 +59886,12 @@ return () => { removeItem(itemId); }; - // Ignore exhaustive-deps rule for now. See https://github.com/WordPress/gutenberg/pull/41639 - // eslint-disable-next-line react-hooks/exhaustive-deps + // Not adding deps for now, as it would require either a larger refactor. + // See https://github.com/WordPress/gutenberg/pull/41639 }, [activeMenu, search]); }; -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/navigation/item/base.js +;// ./node_modules/@wordpress/components/build-module/navigation/item/base.js /** * External dependencies */ @@ -62092,22 +59935,21 @@ }); } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/navigation/item/index.js -/** - * External dependencies - */ - - -/** - * WordPress dependencies - */ - - - -/** - * Internal dependencies - */ - +;// ./node_modules/@wordpress/components/build-module/navigation/item/index.js +/** + * External dependencies + */ + + +/** + * WordPress dependencies + */ + + + +/** + * Internal dependencies + */ @@ -62165,6 +60007,7 @@ }; const itemProps = isText ? restProps : { as: build_module_button, + __next40pxDefaultSize: 'as' in restProps ? restProps.as === undefined : true, href, onClick: onItemClick, 'aria-current': isActive ? 'page' : undefined, @@ -62190,7 +60033,7 @@ } /* harmony default export */ const navigation_item = (NavigationItem); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/navigation/menu/use-navigation-tree-menu.js +;// ./node_modules/@wordpress/components/build-module/navigation/menu/use-navigation-tree-menu.js /** * WordPress dependencies */ @@ -62217,12 +60060,12 @@ return () => { removeMenu(key); }; - // Ignore exhaustive-deps rule for now. See https://github.com/WordPress/gutenberg/pull/44090 - // eslint-disable-next-line react-hooks/exhaustive-deps + // Not adding deps for now, as it would require either a larger refactor + // See https://github.com/WordPress/gutenberg/pull/44090 }, []); }; -;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/search.js +;// ./node_modules/@wordpress/icons/build-module/library/search.js /** * WordPress dependencies */ @@ -62237,7 +60080,7 @@ }); /* harmony default export */ const library_search = (search); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/higher-order/with-spoken-messages/index.js +;// ./node_modules/@wordpress/components/build-module/higher-order/with-spoken-messages/index.js /** * WordPress dependencies */ @@ -62247,8 +60090,7 @@ /** @typedef {import('react').ComponentType} ComponentType */ /** - * A Higher Order Component used to be provide speak and debounced speak - * functions. + * A Higher Order Component used to provide speak and debounced speak functions. * * @see https://developer.wordpress.org/block-editor/packages/packages-a11y/#speak * @@ -62263,7 +60105,7 @@ debouncedSpeak: (0,external_wp_compose_namespaceObject.useDebounce)(external_wp_a11y_namespaceObject.speak, 500) }), 'withSpokenMessages')); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/search-control/styles.js +;// ./node_modules/@wordpress/components/build-module/search-control/styles.js /** * External dependencies @@ -62287,15 +60129,16 @@ target: "effl84m0" } : 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)); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/search-control/index.js -/** - * External dependencies - */ - - -/** - * WordPress dependencies - */ +;// ./node_modules/@wordpress/components/build-module/search-control/index.js +/** + * External dependencies + */ + + +/** + * WordPress dependencies + */ + @@ -62319,6 +60162,11 @@ icon: library_search }); } + if (onClose) { + external_wp_deprecated_default()('`onClose` prop in wp.components.SearchControl', { + since: '6.8' + }); + } const onReset = () => { onChange(''); searchRef.current?.focus(); @@ -62344,17 +60192,21 @@ }, forwardedRef) { // @ts-expect-error The `disabled` prop is not yet supported in the SearchControl component. // Work with the design team (@WordPress/gutenberg-design) if you need this feature. - delete restProps.disabled; + const { + disabled, + ...filteredRestProps + } = restProps; const searchRef = (0,external_wp_element_namespaceObject.useRef)(null); const instanceId = (0,external_wp_compose_namespaceObject.useInstanceId)(SearchControl, 'components-search-control'); const contextValue = (0,external_wp_element_namespaceObject.useMemo)(() => ({ - // Overrides the underlying BaseControl `__nextHasNoMarginBottom` via the context system - // to provide backwards compatibile margin for SearchControl. - // (In a standard InputControl, the BaseControl `__nextHasNoMarginBottom` is always set to true.) BaseControl: { + // Overrides the underlying BaseControl `__nextHasNoMarginBottom` via the context system + // to provide backwards compatible margin for SearchControl. + // (In a standard InputControl, the BaseControl `__nextHasNoMarginBottom` is always set to true.) _overrides: { __nextHasNoMarginBottom - } + }, + __associatedWPComponentName: 'SearchControl' }, // `isBorderless` is still experimental and not a public prop for InputControl yet. InputBase: { @@ -62385,7 +60237,7 @@ onClose: onClose }) }), - ...restProps + ...filteredRestProps }) }); } @@ -62413,7 +60265,7 @@ const SearchControl = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedSearchControl); /* harmony default export */ const search_control = (SearchControl); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/navigation/menu/menu-title-search.js +;// ./node_modules/@wordpress/components/build-module/navigation/menu/menu-title-search.js /** * WordPress dependencies */ @@ -62462,11 +60314,11 @@ return; } const count = Object.values(items).filter(item => item._isVisible).length; - const resultsFoundMessage = (0,external_wp_i18n_namespaceObject.sprintf)( /* translators: %d: number of results. */ + const resultsFoundMessage = (0,external_wp_i18n_namespaceObject.sprintf)(/* translators: %d: number of results. */ (0,external_wp_i18n_namespaceObject._n)('%d result found.', '%d results found.', count), count); debouncedSpeak(resultsFoundMessage); - // Ignore exhaustive-deps rule for now. See https://github.com/WordPress/gutenberg/pull/44090 - // eslint-disable-next-line react-hooks/exhaustive-deps + // Not adding deps for now, as it would require either a larger refactor. + // See https://github.com/WordPress/gutenberg/pull/44090 }, [items, search]); const onClose = () => { onSearch?.(''); @@ -62479,7 +60331,7 @@ } }; const inputId = `components-navigation__menu-title-search-${menu}`; - const placeholder = (0,external_wp_i18n_namespaceObject.sprintf)( /* translators: placeholder for menu search box. %s: menu title */ + const placeholder = (0,external_wp_i18n_namespaceObject.sprintf)(/* translators: placeholder for menu search box. %s: menu title */ (0,external_wp_i18n_namespaceObject.__)('Search %s'), title?.toLowerCase()).trim(); return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(MenuTitleSearchControlWrapper, { children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(search_control, { @@ -62497,18 +60349,17 @@ } /* harmony default export */ const menu_title_search = (with_spoken_messages(MenuTitleSearch)); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/navigation/menu/menu-title.js -/** - * WordPress dependencies - */ - - - - -/** - * Internal dependencies - */ - +;// ./node_modules/@wordpress/components/build-module/navigation/menu/menu-title.js +/** + * WordPress dependencies + */ + + + + +/** + * Internal dependencies + */ @@ -62579,16 +60430,15 @@ }); } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/navigation/menu/search-no-results-found.js -/** - * WordPress dependencies - */ - - -/** - * Internal dependencies - */ - +;// ./node_modules/@wordpress/components/build-module/navigation/menu/search-no-results-found.js +/** + * WordPress dependencies + */ + + +/** + * Internal dependencies + */ @@ -62611,21 +60461,20 @@ }); } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/navigation/menu/index.js -/** - * External dependencies - */ - - -/** - * WordPress dependencies - */ - - -/** - * Internal dependencies - */ - +;// ./node_modules/@wordpress/components/build-module/navigation/menu/index.js +/** + * External dependencies + */ + + +/** + * WordPress dependencies + */ + + +/** + * Internal dependencies + */ @@ -62703,7 +60552,7 @@ } /* harmony default export */ const navigation_menu = (NavigationMenu); -;// CONCATENATED MODULE: ./node_modules/path-to-regexp/dist.es2015/index.js +;// ./node_modules/path-to-regexp/dist.es2015/index.js /** * Tokenize input string. */ @@ -62799,8 +60648,7 @@ function dist_es2015_parse(str, options) { if (options === void 0) { options = {}; } var tokens = lexer(str); - var _a = options.prefixes, prefixes = _a === void 0 ? "./" : _a; - var defaultPattern = "[^".concat(escapeString(options.delimiter || "/#?"), "]+?"); + var _a = options.prefixes, prefixes = _a === void 0 ? "./" : _a, _b = options.delimiter, delimiter = _b === void 0 ? "/#?" : _b; var result = []; var key = 0; var i = 0; @@ -62824,6 +60672,24 @@ } return result; }; + var isSafe = function (value) { + for (var _i = 0, delimiter_1 = delimiter; _i < delimiter_1.length; _i++) { + var char = delimiter_1[_i]; + if (value.indexOf(char) > -1) + return true; + } + return false; + }; + var safePattern = function (prefix) { + var prev = result[result.length - 1]; + var prevText = prefix || (prev && typeof prev === "string" ? prev : ""); + if (prev && !prevText) { + throw new TypeError("Must have text between two parameters, missing text after \"".concat(prev.name, "\"")); + } + if (!prevText || isSafe(prevText)) + return "[^".concat(escapeString(delimiter), "]+?"); + return "(?:(?!".concat(escapeString(prevText), ")[^").concat(escapeString(delimiter), "])+?"); + }; while (i < tokens.length) { var char = tryConsume("CHAR"); var name = tryConsume("NAME"); @@ -62842,7 +60708,7 @@ name: name || key++, prefix: prefix, suffix: "", - pattern: pattern || defaultPattern, + pattern: pattern || safePattern(prefix), modifier: tryConsume("MODIFIER") || "", }); continue; @@ -62865,7 +60731,7 @@ mustConsume("CLOSE"); result.push({ name: name_1 || (pattern_1 ? key++ : ""), - pattern: name_1 && !pattern_1 ? defaultPattern : pattern_1, + pattern: name_1 && !pattern_1 ? safePattern(prefix) : pattern_1, prefix: prefix, suffix: suffix, modifier: tryConsume("MODIFIER") || "", @@ -63058,11 +60924,9 @@ } else { if (token.modifier === "+" || token.modifier === "*") { - route += "((?:".concat(token.pattern, ")").concat(token.modifier, ")"); + throw new TypeError("Can not repeat \"".concat(token.name, "\" without a prefix and suffix")); } - else { - route += "(".concat(token.pattern, ")").concat(token.modifier); - } + route += "(".concat(token.pattern, ")").concat(token.modifier); } } else { @@ -63104,7 +60968,7 @@ return stringToRegexp(path, keys, options); } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/navigator/utils/router.js +;// ./node_modules/@wordpress/components/build-module/navigator/utils/router.js /** * External dependencies */ @@ -63150,7 +61014,7 @@ return parentPath; } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/navigator/context.js +;// ./node_modules/@wordpress/components/build-module/navigator/context.js /** * WordPress dependencies */ @@ -63171,75 +61035,120 @@ }; const NavigatorContext = (0,external_wp_element_namespaceObject.createContext)(context_initialContextValue); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/navigator/styles.js +;// ./node_modules/@wordpress/components/build-module/navigator/styles.js 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)."; } /** * External dependencies */ -const navigatorProviderWrapper = true ? { - name: "xpkswc", - styles: "overflow-x:hidden;contain:content" +const navigatorWrapper = true ? { + name: "1br0vvk", + styles: "position:relative;overflow-x:clip;contain:layout;display:grid;grid-template-columns:1fr;grid-template-rows:1fr;align-items:start" } : 0; -const fadeInFromRight = emotion_react_browser_esm_keyframes({ - '0%': { - opacity: 0, - transform: `translateX( 50px )` - }, - '100%': { - opacity: 1, - transform: 'none' - } -}); -const fadeInFromLeft = emotion_react_browser_esm_keyframes({ - '0%': { - opacity: 0, - transform: `translateX( -50px )` - }, - '100%': { - opacity: 1, - transform: 'none' - } -}); -const navigatorScreenAnimation = ({ - isInitial, - isBack, - isRTL -}) => { - if (isInitial && !isBack) { - return; - } - const animationName = isRTL && isBack || !isRTL && !isBack ? fadeInFromRight : fadeInFromLeft; - 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); -}; -const navigatorScreen = props => /*#__PURE__*/emotion_react_browser_esm_css("overflow-x:auto;max-height:100%;", navigatorScreenAnimation(props), ";" + ( true ? "" : 0), true ? "" : 0); - -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/navigator/navigator-provider/component.js -/** - * External dependencies - */ - -/** - * WordPress dependencies - */ - - - -/** - * Internal dependencies - */ - - - - - - - - -const MAX_HISTORY_LENGTH = 50; +const fadeIn = emotion_react_browser_esm_keyframes({ + from: { + opacity: 0 + } +}); +const fadeOut = emotion_react_browser_esm_keyframes({ + to: { + opacity: 0 + } +}); +const slideFromRight = emotion_react_browser_esm_keyframes({ + from: { + transform: 'translateX(100px)' + } +}); +const slideToLeft = emotion_react_browser_esm_keyframes({ + to: { + transform: 'translateX(-80px)' + } +}); +const slideFromLeft = emotion_react_browser_esm_keyframes({ + from: { + transform: 'translateX(-100px)' + } +}); +const slideToRight = emotion_react_browser_esm_keyframes({ + to: { + transform: 'translateX(80px)' + } +}); +const FADE = { + DURATION: 70, + EASING: 'linear', + DELAY: { + IN: 70, + OUT: 40 + } +}; +const SLIDE = { + DURATION: 300, + EASING: 'cubic-bezier(0.33, 0, 0, 1)' +}; +const TOTAL_ANIMATION_DURATION = { + IN: Math.max(FADE.DURATION + FADE.DELAY.IN, SLIDE.DURATION), + OUT: Math.max(FADE.DURATION + FADE.DELAY.OUT, SLIDE.DURATION) +}; +const ANIMATION_END_NAMES = { + end: { + in: slideFromRight.name, + out: slideToLeft.name + }, + start: { + in: slideFromLeft.name, + out: slideToRight.name + } +}; +const ANIMATION = { + end: { + in: /*#__PURE__*/emotion_react_browser_esm_css(FADE.DURATION, "ms ", FADE.EASING, " ", FADE.DELAY.IN, "ms both ", fadeIn, ",", SLIDE.DURATION, "ms ", SLIDE.EASING, " both ", slideFromRight, ";" + ( true ? "" : 0), true ? "" : 0), + out: /*#__PURE__*/emotion_react_browser_esm_css(FADE.DURATION, "ms ", FADE.EASING, " ", FADE.DELAY.OUT, "ms both ", fadeOut, ",", SLIDE.DURATION, "ms ", SLIDE.EASING, " both ", slideToLeft, ";" + ( true ? "" : 0), true ? "" : 0) + }, + start: { + in: /*#__PURE__*/emotion_react_browser_esm_css(FADE.DURATION, "ms ", FADE.EASING, " ", FADE.DELAY.IN, "ms both ", fadeIn, ",", SLIDE.DURATION, "ms ", SLIDE.EASING, " both ", slideFromLeft, ";" + ( true ? "" : 0), true ? "" : 0), + out: /*#__PURE__*/emotion_react_browser_esm_css(FADE.DURATION, "ms ", FADE.EASING, " ", FADE.DELAY.OUT, "ms both ", fadeOut, ",", SLIDE.DURATION, "ms ", SLIDE.EASING, " both ", slideToRight, ";" + ( true ? "" : 0), true ? "" : 0) + } +}; +const navigatorScreenAnimation = /*#__PURE__*/emotion_react_browser_esm_css("z-index:1;&[data-animation-type='out']{z-index:0;}@media not ( prefers-reduced-motion ){&:not( [data-skip-animation] ){", ['start', 'end'].map(direction => ['in', 'out'].map(type => /*#__PURE__*/emotion_react_browser_esm_css("&[data-animation-direction='", direction, "'][data-animation-type='", type, "']{animation:", ANIMATION[direction][type], ";}" + ( true ? "" : 0), true ? "" : 0))), ";}}" + ( true ? "" : 0), true ? "" : 0); +const navigatorScreen = true ? { + name: "14di7zd", + styles: "overflow-x:auto;max-height:100%;box-sizing:border-box;position:relative;grid-column:1/-1;grid-row:1/-1" +} : 0; + +;// ./node_modules/@wordpress/components/build-module/navigator/navigator/component.js +/** + * External dependencies + */ + +/** + * WordPress dependencies + */ + + + + +/** + * Internal dependencies + */ + + + + + + + + + function addScreen({ screens }, screen) { + if (screens.some(s => s.path === screen.path)) { + true ? external_wp_warning_default()(`Navigator: a screen with path ${screen.path} already exists. +The screen with id ${screen.id} will not be added.`) : 0; + return screens; + } return [...screens, screen]; } function removeScreen({ @@ -63247,72 +61156,88 @@ }, screen) { return screens.filter(s => s.id !== screen.id); } -function goBack({ - locationHistory -}) { - if (locationHistory.length <= 1) { - return locationHistory; - } - return [...locationHistory.slice(0, -2), { - ...locationHistory[locationHistory.length - 2], - isBack: true, - hasRestoredFocus: false - }]; -} function goTo(state, path, options = {}) { - const { - locationHistory + var _focusSelectorsCopy2; + const { + focusSelectors } = state; - const { - focusTargetSelector, + const currentLocation = { + ...state.currentLocation + }; + const { + // Default assignments isBack = false, skipFocus = false, - replace = false, + // Extract to avoid forwarding + replace, + focusTargetSelector, + // Rest ...restOptions } = options; - const isNavigatingToSamePath = locationHistory.length > 0 && locationHistory[locationHistory.length - 1].path === path; - if (isNavigatingToSamePath) { - return locationHistory; - } - const isNavigatingToPreviousPath = isBack && locationHistory.length > 1 && locationHistory[locationHistory.length - 2].path === path; - if (isNavigatingToPreviousPath) { - return goBack(state); - } - const newLocation = { - ...restOptions, - path, - isBack, - hasRestoredFocus: false, - skipFocus - }; - if (locationHistory.length === 0) { - return replace ? [] : [newLocation]; - } - const newLocationHistory = locationHistory.slice(locationHistory.length > MAX_HISTORY_LENGTH - 1 ? 1 : 0, -1); - if (!replace) { - newLocationHistory.push( - // Assign `focusTargetSelector` to the previous location in history - // (the one we just navigated from). - { - ...locationHistory[locationHistory.length - 1], - focusTargetSelector - }); - } - newLocationHistory.push(newLocation); - return newLocationHistory; + if (currentLocation.path === path) { + return { + currentLocation, + focusSelectors + }; + } + let focusSelectorsCopy; + function getFocusSelectorsCopy() { + var _focusSelectorsCopy; + focusSelectorsCopy = (_focusSelectorsCopy = focusSelectorsCopy) !== null && _focusSelectorsCopy !== void 0 ? _focusSelectorsCopy : new Map(state.focusSelectors); + return focusSelectorsCopy; + } + + // Set a focus selector that will be used when navigating + // back to the current location. + if (focusTargetSelector && currentLocation.path) { + getFocusSelectorsCopy().set(currentLocation.path, focusTargetSelector); + } + + // Get the focus selector for the new location. + let currentFocusSelector; + if (focusSelectors.get(path)) { + if (isBack) { + // Use the found focus selector only when navigating back. + currentFocusSelector = focusSelectors.get(path); + } + // Make a copy of the focusSelectors map to remove the focus selector + // only if necessary (ie. a focus selector was found). + getFocusSelectorsCopy().delete(path); + } + return { + currentLocation: { + ...restOptions, + isInitial: false, + path, + isBack, + hasRestoredFocus: false, + focusTargetSelector: currentFocusSelector, + skipFocus + }, + focusSelectors: (_focusSelectorsCopy2 = focusSelectorsCopy) !== null && _focusSelectorsCopy2 !== void 0 ? _focusSelectorsCopy2 : focusSelectors + }; } function goToParent(state, options = {}) { const { - locationHistory, - screens + screens, + focusSelectors } = state; - const currentPath = locationHistory[locationHistory.length - 1].path; + const currentLocation = { + ...state.currentLocation + }; + const currentPath = currentLocation.path; if (currentPath === undefined) { - return locationHistory; + return { + currentLocation, + focusSelectors + }; } const parentPath = findParent(currentPath, screens); if (parentPath === undefined) { - return locationHistory; + return { + currentLocation, + focusSelectors + }; } return goTo(state, parentPath, { ...options, @@ -63322,8 +61247,10 @@ function routerReducer(state, action) { let { screens, - locationHistory, - matchedPath + currentLocation, + matchedPath, + focusSelectors, + ...restState } = state; switch (action.type) { case 'add': @@ -63332,24 +61259,27 @@ case 'remove': screens = removeScreen(state, action.screen); break; - case 'goback': - locationHistory = goBack(state); - break; case 'goto': - locationHistory = goTo(state, action.path, action.options); + ({ + currentLocation, + focusSelectors + } = goTo(state, action.path, action.options)); break; case 'gotoparent': - locationHistory = goToParent(state, action.options); + ({ + currentLocation, + focusSelectors + } = goToParent(state, action.options)); break; } // Return early in case there is no change - if (screens === state.screens && locationHistory === state.locationHistory) { + if (screens === state.screens && currentLocation === state.currentLocation) { return state; } // Compute the matchedPath - const currentPath = locationHistory.length > 0 ? locationHistory[locationHistory.length - 1].path : undefined; + const currentPath = currentLocation.path; matchedPath = currentPath !== undefined ? patternMatch(currentPath, screens) : undefined; // If the new match is the same as the previous match, @@ -63358,40 +61288,55 @@ matchedPath = state.matchedPath; } return { + ...restState, screens, - locationHistory, - matchedPath - }; -} -function UnconnectedNavigatorProvider(props, forwardedRef) { - const { - initialPath, + currentLocation, + matchedPath, + focusSelectors + }; +} +function UnconnectedNavigator(props, forwardedRef) { + const { + initialPath: initialPathProp, children, className, ...otherProps - } = useContextSystem(props, 'NavigatorProvider'); - const [routerState, dispatch] = (0,external_wp_element_namespaceObject.useReducer)(routerReducer, initialPath, path => ({ + } = useContextSystem(props, 'Navigator'); + const [routerState, dispatch] = (0,external_wp_element_namespaceObject.useReducer)(routerReducer, initialPathProp, path => ({ screens: [], - locationHistory: [{ - path - }], - matchedPath: undefined + currentLocation: { + path, + isInitial: true + }, + matchedPath: undefined, + focusSelectors: new Map(), + initialPath: initialPathProp })); // The methods are constant forever, create stable references to them. const methods = (0,external_wp_element_namespaceObject.useMemo)(() => ({ - goBack: () => dispatch({ - type: 'goback' + // Note: calling goBack calls `goToParent` internally, as it was established + // that `goBack` should behave like `goToParent`, and `goToParent` should + // be marked as deprecated. + goBack: options => dispatch({ + type: 'gotoparent', + options }), goTo: (path, options) => dispatch({ type: 'goto', path, options }), - goToParent: options => dispatch({ - type: 'gotoparent', - options - }), + goToParent: options => { + external_wp_deprecated_default()(`wp.components.useNavigator().goToParent`, { + since: '6.7', + alternative: 'wp.components.useNavigator().goBack' + }); + dispatch({ + type: 'gotoparent', + options + }); + }, addScreen: screen => dispatch({ type: 'add', screen @@ -63402,23 +61347,20 @@ }) }), []); const { - locationHistory, + currentLocation, matchedPath } = routerState; const navigatorContextValue = (0,external_wp_element_namespaceObject.useMemo)(() => { var _matchedPath$params; return { - location: { - ...locationHistory[locationHistory.length - 1], - isInitial: locationHistory.length === 1 - }, + location: currentLocation, params: (_matchedPath$params = matchedPath?.params) !== null && _matchedPath$params !== void 0 ? _matchedPath$params : {}, match: matchedPath?.id, ...methods }; - }, [locationHistory, matchedPath, methods]); + }, [currentLocation, matchedPath, methods]); const cx = useCx(); - const classes = (0,external_wp_element_namespaceObject.useMemo)(() => cx(navigatorProviderWrapper, className), [className, cx]); + const classes = (0,external_wp_element_namespaceObject.useMemo)(() => cx(navigatorWrapper, className), [className, cx]); return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(component, { ref: forwardedRef, className: classes, @@ -63429,12 +61371,441 @@ }) }); } +const component_Navigator = contextConnect(UnconnectedNavigator, 'Navigator'); + +;// external ["wp","escapeHtml"] +const external_wp_escapeHtml_namespaceObject = window["wp"]["escapeHtml"]; +;// ./node_modules/@wordpress/components/build-module/navigator/navigator-screen/use-screen-animate-presence.js +/** + * WordPress dependencies + */ + + + + +/** + * Internal dependencies + */ + + +// Possible values: +// - 'INITIAL': the initial state +// - 'ANIMATING_IN': start enter animation +// - 'IN': enter animation has ended +// - 'ANIMATING_OUT': start exit animation +// - 'OUT': the exit animation has ended + +// Allow an extra 20% of the total animation duration to account for potential +// event loop delays. +const ANIMATION_TIMEOUT_MARGIN = 1.2; +const isEnterAnimation = (animationDirection, animationStatus, animationName) => animationStatus === 'ANIMATING_IN' && animationName === ANIMATION_END_NAMES[animationDirection].in; +const isExitAnimation = (animationDirection, animationStatus, animationName) => animationStatus === 'ANIMATING_OUT' && animationName === ANIMATION_END_NAMES[animationDirection].out; +function useScreenAnimatePresence({ + isMatch, + skipAnimation, + isBack, + onAnimationEnd +}) { + const isRTL = (0,external_wp_i18n_namespaceObject.isRTL)(); + const prefersReducedMotion = (0,external_wp_compose_namespaceObject.useReducedMotion)(); + const [animationStatus, setAnimationStatus] = (0,external_wp_element_namespaceObject.useState)('INITIAL'); + + // Start enter and exit animations when the screen is selected or deselected. + // The animation status is set to `IN` or `OUT` immediately if the animation + // should be skipped. + const becameSelected = animationStatus !== 'ANIMATING_IN' && animationStatus !== 'IN' && isMatch; + const becameUnselected = animationStatus !== 'ANIMATING_OUT' && animationStatus !== 'OUT' && !isMatch; + (0,external_wp_element_namespaceObject.useLayoutEffect)(() => { + if (becameSelected) { + setAnimationStatus(skipAnimation || prefersReducedMotion ? 'IN' : 'ANIMATING_IN'); + } else if (becameUnselected) { + setAnimationStatus(skipAnimation || prefersReducedMotion ? 'OUT' : 'ANIMATING_OUT'); + } + }, [becameSelected, becameUnselected, skipAnimation, prefersReducedMotion]); + + // Animation attributes (derived state). + const animationDirection = isRTL && isBack || !isRTL && !isBack ? 'end' : 'start'; + const isAnimatingIn = animationStatus === 'ANIMATING_IN'; + const isAnimatingOut = animationStatus === 'ANIMATING_OUT'; + let animationType; + if (isAnimatingIn) { + animationType = 'in'; + } else if (isAnimatingOut) { + animationType = 'out'; + } + const onScreenAnimationEnd = (0,external_wp_element_namespaceObject.useCallback)(e => { + onAnimationEnd?.(e); + if (isExitAnimation(animationDirection, animationStatus, e.animationName)) { + // When the exit animation ends on an unselected screen, set the + // status to 'OUT' to remove the screen contents from the DOM. + setAnimationStatus('OUT'); + } else if (isEnterAnimation(animationDirection, animationStatus, e.animationName)) { + // When the enter animation ends on a selected screen, set the + // status to 'IN' to ensure the screen is rendered in the DOM. + setAnimationStatus('IN'); + } + }, [onAnimationEnd, animationStatus, animationDirection]); + + // Fallback timeout to ensure that the logic is applied even if the + // `animationend` event is not triggered. + (0,external_wp_element_namespaceObject.useEffect)(() => { + let animationTimeout; + if (isAnimatingOut) { + animationTimeout = window.setTimeout(() => { + setAnimationStatus('OUT'); + animationTimeout = undefined; + }, TOTAL_ANIMATION_DURATION.OUT * ANIMATION_TIMEOUT_MARGIN); + } else if (isAnimatingIn) { + animationTimeout = window.setTimeout(() => { + setAnimationStatus('IN'); + animationTimeout = undefined; + }, TOTAL_ANIMATION_DURATION.IN * ANIMATION_TIMEOUT_MARGIN); + } + return () => { + if (animationTimeout) { + window.clearTimeout(animationTimeout); + animationTimeout = undefined; + } + }; + }, [isAnimatingOut, isAnimatingIn]); + return { + animationStyles: navigatorScreenAnimation, + // Render the screen's contents in the DOM not only when the screen is + // selected, but also while it is animating out. + shouldRenderScreen: isMatch || animationStatus === 'IN' || animationStatus === 'ANIMATING_OUT', + screenProps: { + onAnimationEnd: onScreenAnimationEnd, + 'data-animation-direction': animationDirection, + 'data-animation-type': animationType, + 'data-skip-animation': skipAnimation || undefined + } + }; +} + +;// ./node_modules/@wordpress/components/build-module/navigator/navigator-screen/component.js +/** + * External dependencies + */ + +/** + * WordPress dependencies + */ + + + + + + +/** + * Internal dependencies + */ + + + + + + + + +function UnconnectedNavigatorScreen(props, forwardedRef) { + if (!/^\//.test(props.path)) { + true ? external_wp_warning_default()('wp.components.Navigator.Screen: the `path` should follow a URL-like scheme; it should start with and be separated by the `/` character.') : 0; + } + const screenId = (0,external_wp_element_namespaceObject.useId)(); + const { + children, + className, + path, + onAnimationEnd: onAnimationEndProp, + ...otherProps + } = useContextSystem(props, 'Navigator.Screen'); + const { + location, + match, + addScreen, + removeScreen + } = (0,external_wp_element_namespaceObject.useContext)(NavigatorContext); + const { + isInitial, + isBack, + focusTargetSelector, + skipFocus + } = location; + const isMatch = match === screenId; + const wrapperRef = (0,external_wp_element_namespaceObject.useRef)(null); + const skipAnimationAndFocusRestoration = !!isInitial && !isBack; + + // Register / unregister screen with the navigator context. + (0,external_wp_element_namespaceObject.useEffect)(() => { + const screen = { + id: screenId, + path: (0,external_wp_escapeHtml_namespaceObject.escapeAttribute)(path) + }; + addScreen(screen); + return () => removeScreen(screen); + }, [screenId, path, addScreen, removeScreen]); + + // Animation. + const { + animationStyles, + shouldRenderScreen, + screenProps + } = useScreenAnimatePresence({ + isMatch, + isBack, + onAnimationEnd: onAnimationEndProp, + skipAnimation: skipAnimationAndFocusRestoration + }); + const cx = useCx(); + const classes = (0,external_wp_element_namespaceObject.useMemo)(() => cx(navigatorScreen, animationStyles, className), [className, cx, animationStyles]); + + // Focus restoration + const locationRef = (0,external_wp_element_namespaceObject.useRef)(location); + (0,external_wp_element_namespaceObject.useEffect)(() => { + locationRef.current = location; + }, [location]); + (0,external_wp_element_namespaceObject.useEffect)(() => { + const wrapperEl = wrapperRef.current; + // Only attempt to restore focus: + // - if the current location is not the initial one (to avoid moving focus on page load) + // - when the screen becomes visible + // - if the wrapper ref has been assigned + // - if focus hasn't already been restored for the current location + // - if the `skipFocus` option is not set to `true`. This is useful when we trigger the navigation outside of NavigatorScreen. + if (skipAnimationAndFocusRestoration || !isMatch || !wrapperEl || locationRef.current.hasRestoredFocus || skipFocus) { + return; + } + const activeElement = wrapperEl.ownerDocument.activeElement; + + // If an element is already focused within the wrapper do not focus the + // element. This prevents inputs or buttons from losing focus unnecessarily. + if (wrapperEl.contains(activeElement)) { + return; + } + let elementToFocus = null; + + // When navigating back, if a selector is provided, use it to look for the + // target element (assumed to be a node inside the current NavigatorScreen) + if (isBack && focusTargetSelector) { + elementToFocus = wrapperEl.querySelector(focusTargetSelector); + } + + // If the previous query didn't run or find any element to focus, fallback + // to the first tabbable element in the screen (or the screen itself). + if (!elementToFocus) { + const [firstTabbable] = external_wp_dom_namespaceObject.focus.tabbable.find(wrapperEl); + elementToFocus = firstTabbable !== null && firstTabbable !== void 0 ? firstTabbable : wrapperEl; + } + locationRef.current.hasRestoredFocus = true; + elementToFocus.focus(); + }, [skipAnimationAndFocusRestoration, isMatch, isBack, focusTargetSelector, skipFocus]); + const mergedWrapperRef = (0,external_wp_compose_namespaceObject.useMergeRefs)([forwardedRef, wrapperRef]); + return shouldRenderScreen ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(component, { + ref: mergedWrapperRef, + className: classes, + ...screenProps, + ...otherProps, + children: children + }) : null; +} +const NavigatorScreen = contextConnect(UnconnectedNavigatorScreen, 'Navigator.Screen'); + +;// ./node_modules/@wordpress/components/build-module/navigator/use-navigator.js +/** + * WordPress dependencies + */ + + +/** + * Internal dependencies + */ + +/** + * Retrieves a `navigator` instance. This hook provides advanced functionality, + * such as imperatively navigating to a new location (with options like + * navigating back or skipping focus restoration) and accessing the current + * location and path parameters. + */ +function useNavigator() { + const { + location, + params, + goTo, + goBack, + goToParent + } = (0,external_wp_element_namespaceObject.useContext)(NavigatorContext); + return { + location, + goTo, + goBack, + goToParent, + params + }; +} + +;// ./node_modules/@wordpress/components/build-module/navigator/navigator-button/hook.js +/** + * WordPress dependencies + */ + + + +/** + * Internal dependencies + */ + + + + +const cssSelectorForAttribute = (attrName, attrValue) => `[${attrName}="${attrValue}"]`; +function useNavigatorButton(props) { + const { + path, + onClick, + as = build_module_button, + attributeName = 'id', + ...otherProps + } = useContextSystem(props, 'Navigator.Button'); + const escapedPath = (0,external_wp_escapeHtml_namespaceObject.escapeAttribute)(path); + const { + goTo + } = useNavigator(); + const handleClick = (0,external_wp_element_namespaceObject.useCallback)(e => { + e.preventDefault(); + goTo(escapedPath, { + focusTargetSelector: cssSelectorForAttribute(attributeName, escapedPath) + }); + onClick?.(e); + }, [goTo, onClick, attributeName, escapedPath]); + return { + as, + onClick: handleClick, + ...otherProps, + [attributeName]: escapedPath + }; +} + +;// ./node_modules/@wordpress/components/build-module/navigator/navigator-button/component.js +/** + * External dependencies + */ + +/** + * Internal dependencies + */ + + + + + +function UnconnectedNavigatorButton(props, forwardedRef) { + const navigatorButtonProps = useNavigatorButton(props); + return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(component, { + ref: forwardedRef, + ...navigatorButtonProps + }); +} +const NavigatorButton = contextConnect(UnconnectedNavigatorButton, 'Navigator.Button'); + +;// ./node_modules/@wordpress/components/build-module/navigator/navigator-back-button/hook.js +/** + * WordPress dependencies + */ + + +/** + * Internal dependencies + */ + + + + +function useNavigatorBackButton(props) { + const { + onClick, + as = build_module_button, + ...otherProps + } = useContextSystem(props, 'Navigator.BackButton'); + const { + goBack + } = useNavigator(); + const handleClick = (0,external_wp_element_namespaceObject.useCallback)(e => { + e.preventDefault(); + goBack(); + onClick?.(e); + }, [goBack, onClick]); + return { + as, + onClick: handleClick, + ...otherProps + }; +} + +;// ./node_modules/@wordpress/components/build-module/navigator/navigator-back-button/component.js +/** + * External dependencies + */ + +/** + * Internal dependencies + */ + + + + + +function UnconnectedNavigatorBackButton(props, forwardedRef) { + const navigatorBackButtonProps = useNavigatorBackButton(props); + return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(component, { + ref: forwardedRef, + ...navigatorBackButtonProps + }); +} +const NavigatorBackButton = contextConnect(UnconnectedNavigatorBackButton, 'Navigator.BackButton'); + +;// ./node_modules/@wordpress/components/build-module/navigator/navigator-to-parent-button/component.js +/** + * WordPress dependencies + */ + + +/** + * Internal dependencies + */ + + + +function UnconnectedNavigatorToParentButton(props, forwardedRef) { + external_wp_deprecated_default()('wp.components.NavigatorToParentButton', { + since: '6.7', + alternative: 'wp.components.Navigator.BackButton' + }); + return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(NavigatorBackButton, { + ref: forwardedRef, + ...props + }); +} + +/** + * @deprecated + */ +const NavigatorToParentButton = contextConnect(UnconnectedNavigatorToParentButton, 'Navigator.ToParentButton'); + +;// ./node_modules/@wordpress/components/build-module/navigator/legacy.js +/** + * Internal dependencies + */ + + + + + + /** * The `NavigatorProvider` component allows rendering nested views/panels/menus - * (via the `NavigatorScreen` component and navigate between these different - * view (via the `NavigatorButton` and `NavigatorBackButton` components or the - * `useNavigator` hook). + * (via the `NavigatorScreen` component and navigate between them + * (via the `NavigatorButton` and `NavigatorBackButton` components). * * ```jsx * import { @@ -63463,125 +61834,14 @@ * ); * ``` */ -const NavigatorProvider = contextConnect(UnconnectedNavigatorProvider, 'NavigatorProvider'); -/* harmony default export */ const navigator_provider_component = (NavigatorProvider); - -;// CONCATENATED MODULE: external ["wp","escapeHtml"] -const external_wp_escapeHtml_namespaceObject = window["wp"]["escapeHtml"]; -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/navigator/navigator-screen/component.js -/** - * External dependencies - */ - -/** - * WordPress dependencies - */ - - - - - - -/** - * Internal dependencies - */ - - - - - - - -function UnconnectedNavigatorScreen(props, forwardedRef) { - const screenId = (0,external_wp_element_namespaceObject.useId)(); - const { - children, - className, - path, - ...otherProps - } = useContextSystem(props, 'NavigatorScreen'); - const { - location, - match, - addScreen, - removeScreen - } = (0,external_wp_element_namespaceObject.useContext)(NavigatorContext); - const isMatch = match === screenId; - const wrapperRef = (0,external_wp_element_namespaceObject.useRef)(null); - (0,external_wp_element_namespaceObject.useEffect)(() => { - const screen = { - id: screenId, - path: (0,external_wp_escapeHtml_namespaceObject.escapeAttribute)(path) - }; - addScreen(screen); - return () => removeScreen(screen); - }, [screenId, path, addScreen, removeScreen]); - const isRTL = (0,external_wp_i18n_namespaceObject.isRTL)(); - const { - isInitial, - isBack - } = location; - const cx = useCx(); - const classes = (0,external_wp_element_namespaceObject.useMemo)(() => cx(navigatorScreen({ - isInitial, - isBack, - isRTL - }), className), [className, cx, isInitial, isBack, isRTL]); - const locationRef = (0,external_wp_element_namespaceObject.useRef)(location); - (0,external_wp_element_namespaceObject.useEffect)(() => { - locationRef.current = location; - }, [location]); - - // Focus restoration - const isInitialLocation = location.isInitial && !location.isBack; - (0,external_wp_element_namespaceObject.useEffect)(() => { - // Only attempt to restore focus: - // - if the current location is not the initial one (to avoid moving focus on page load) - // - when the screen becomes visible - // - if the wrapper ref has been assigned - // - if focus hasn't already been restored for the current location - // - if the `skipFocus` option is not set to `true`. This is useful when we trigger the navigation outside of NavigatorScreen. - if (isInitialLocation || !isMatch || !wrapperRef.current || locationRef.current.hasRestoredFocus || location.skipFocus) { - return; - } - const activeElement = wrapperRef.current.ownerDocument.activeElement; - - // If an element is already focused within the wrapper do not focus the - // element. This prevents inputs or buttons from losing focus unnecessarily. - if (wrapperRef.current.contains(activeElement)) { - return; - } - let elementToFocus = null; - - // When navigating back, if a selector is provided, use it to look for the - // target element (assumed to be a node inside the current NavigatorScreen) - if (location.isBack && location.focusTargetSelector) { - elementToFocus = wrapperRef.current.querySelector(location.focusTargetSelector); - } - - // If the previous query didn't run or find any element to focus, fallback - // to the first tabbable element in the screen (or the screen itself). - if (!elementToFocus) { - const [firstTabbable] = external_wp_dom_namespaceObject.focus.tabbable.find(wrapperRef.current); - elementToFocus = firstTabbable !== null && firstTabbable !== void 0 ? firstTabbable : wrapperRef.current; - } - locationRef.current.hasRestoredFocus = true; - elementToFocus.focus(); - }, [isInitialLocation, isMatch, location.isBack, location.focusTargetSelector, location.skipFocus]); - const mergedWrapperRef = (0,external_wp_compose_namespaceObject.useMergeRefs)([forwardedRef, wrapperRef]); - return isMatch ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(component, { - ref: mergedWrapperRef, - className: classes, - ...otherProps, - children: children - }) : null; -} +const NavigatorProvider = Object.assign(component_Navigator, { + displayName: 'NavigatorProvider' +}); /** * The `NavigatorScreen` component represents a single view/screen/panel and * should be used in combination with the `NavigatorProvider`, the - * `NavigatorButton` and the `NavigatorBackButton` components (or the `useNavigator` - * hook). + * `NavigatorButton` and the `NavigatorBackButton` components. * * @example * ```jsx @@ -63611,107 +61871,14 @@ * ); * ``` */ -const NavigatorScreen = contextConnect(UnconnectedNavigatorScreen, 'NavigatorScreen'); -/* harmony default export */ const navigator_screen_component = (NavigatorScreen); - -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/navigator/use-navigator.js -/** - * WordPress dependencies - */ - - -/** - * Internal dependencies - */ - -/** - * Retrieves a `navigator` instance. - */ -function useNavigator() { - const { - location, - params, - goTo, - goBack, - goToParent - } = (0,external_wp_element_namespaceObject.useContext)(NavigatorContext); - return { - location, - goTo, - goBack, - goToParent, - params - }; -} -/* harmony default export */ const use_navigator = (useNavigator); - -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/navigator/navigator-button/hook.js -/** - * WordPress dependencies - */ - - - -/** - * Internal dependencies - */ - - - - -const cssSelectorForAttribute = (attrName, attrValue) => `[${attrName}="${attrValue}"]`; -function useNavigatorButton(props) { - const { - path, - onClick, - as = build_module_button, - attributeName = 'id', - ...otherProps - } = useContextSystem(props, 'NavigatorButton'); - const escapedPath = (0,external_wp_escapeHtml_namespaceObject.escapeAttribute)(path); - const { - goTo - } = use_navigator(); - const handleClick = (0,external_wp_element_namespaceObject.useCallback)(e => { - e.preventDefault(); - goTo(escapedPath, { - focusTargetSelector: cssSelectorForAttribute(attributeName, escapedPath) - }); - onClick?.(e); - }, [goTo, onClick, attributeName, escapedPath]); - return { - as, - onClick: handleClick, - ...otherProps, - [attributeName]: escapedPath - }; -} - -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/navigator/navigator-button/component.js -/** - * External dependencies - */ - -/** - * Internal dependencies - */ - - - - - -function UnconnectedNavigatorButton(props, forwardedRef) { - const navigatorButtonProps = useNavigatorButton(props); - return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(component, { - ref: forwardedRef, - ...navigatorButtonProps - }); -} +const legacy_NavigatorScreen = Object.assign(NavigatorScreen, { + displayName: 'NavigatorScreen' +}); /** * The `NavigatorButton` component can be used to navigate to a screen and should * be used in combination with the `NavigatorProvider`, the `NavigatorScreen` - * and the `NavigatorBackButton` components (or the `useNavigator` hook). + * and the `NavigatorBackButton` components. * * @example * ```jsx @@ -63741,75 +61908,14 @@ * ); * ``` */ -const NavigatorButton = contextConnect(UnconnectedNavigatorButton, 'NavigatorButton'); -/* harmony default export */ const navigator_button_component = (NavigatorButton); - -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/navigator/navigator-back-button/hook.js -/** - * WordPress dependencies - */ - - -/** - * Internal dependencies - */ - - - - -function useNavigatorBackButton(props) { - const { - onClick, - as = build_module_button, - goToParent: goToParentProp = false, - ...otherProps - } = useContextSystem(props, 'NavigatorBackButton'); - const { - goBack, - goToParent - } = use_navigator(); - const handleClick = (0,external_wp_element_namespaceObject.useCallback)(e => { - e.preventDefault(); - if (goToParentProp) { - goToParent(); - } else { - goBack(); - } - onClick?.(e); - }, [goToParentProp, goToParent, goBack, onClick]); - return { - as, - onClick: handleClick, - ...otherProps - }; -} - -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/navigator/navigator-back-button/component.js -/** - * External dependencies - */ - -/** - * Internal dependencies - */ - - - - - -function UnconnectedNavigatorBackButton(props, forwardedRef) { - const navigatorBackButtonProps = useNavigatorBackButton(props); - return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(component, { - ref: forwardedRef, - ...navigatorBackButtonProps - }); -} +const legacy_NavigatorButton = Object.assign(NavigatorButton, { + displayName: 'NavigatorButton' +}); /** * The `NavigatorBackButton` component can be used to navigate to a screen and * should be used in combination with the `NavigatorProvider`, the - * `NavigatorScreen` and the `NavigatorButton` components (or the `useNavigator` - * hook). + * `NavigatorScreen` and the `NavigatorButton` components. * * @example * ```jsx @@ -63832,95 +61938,177 @@ * *

This is the child screen.

* - * Go back + * Go back (to parent) * * * * ); * ``` */ -const NavigatorBackButton = contextConnect(UnconnectedNavigatorBackButton, 'NavigatorBackButton'); -/* harmony default export */ const navigator_back_button_component = (NavigatorBackButton); - -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/navigator/navigator-to-parent-button/component.js -/** - * External dependencies - */ - -/** - * Internal dependencies - */ - - - - - -function UnconnectedNavigatorToParentButton(props, forwardedRef) { - const navigatorToParentButtonProps = useNavigatorBackButton({ - ...props, - goToParent: true - }); - return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(component, { - ref: forwardedRef, - ...navigatorToParentButtonProps - }); -} - -/* - * The `NavigatorToParentButton` component can be used to navigate to a screen and - * should be used in combination with the `NavigatorProvider`, the - * `NavigatorScreen` and the `NavigatorButton` components (or the `useNavigator` - * hook). - * - * @example - * ```jsx - * import { - * __experimentalNavigatorProvider as NavigatorProvider, - * __experimentalNavigatorScreen as NavigatorScreen, - * __experimentalNavigatorButton as NavigatorButton, - * __experimentalNavigatorToParentButton as NavigatorToParentButton, - * } from '@wordpress/components'; +const legacy_NavigatorBackButton = Object.assign(NavigatorBackButton, { + displayName: 'NavigatorBackButton' +}); + +/** + * _Note: this component is deprecated. Please use the `NavigatorBackButton` + * component instead._ + * + * @deprecated + */ +const legacy_NavigatorToParentButton = Object.assign(NavigatorToParentButton, { + displayName: 'NavigatorToParentButton' +}); + +;// ./node_modules/@wordpress/components/build-module/navigator/index.js +/** + * Internal dependencies + */ + + + + + + +/** + * The `Navigator` component allows rendering nested views/panels/menus + * (via the `Navigator.Screen` component) and navigate between them + * (via the `Navigator.Button` and `Navigator.BackButton` components). + * + * ```jsx + * import { Navigator } from '@wordpress/components'; * * const MyNavigation = () => ( - * - * + * + * *

This is the home screen.

- * + * * Navigate to child screen. - * - * - * - * + * + * + * + * *

This is the child screen.

- * - * Go to parent - * - * - * + * + * Go back + * + * + * * ); * ``` */ -const NavigatorToParentButton = contextConnect(UnconnectedNavigatorToParentButton, 'NavigatorToParentButton'); -/* harmony default export */ const navigator_to_parent_button_component = (NavigatorToParentButton); - -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/notice/index.js -/** - * External dependencies - */ - - -/** - * WordPress dependencies - */ - - - - - -/** - * Internal dependencies - */ - +const navigator_Navigator = Object.assign(component_Navigator, { + /** + * The `Navigator.Screen` component represents a single view/screen/panel and + * should be used in combination with the `Navigator`, the `Navigator.Button` + * and the `Navigator.BackButton` components. + * + * @example + * ```jsx + * import { Navigator } from '@wordpress/components'; + * + * const MyNavigation = () => ( + * + * + *

This is the home screen.

+ * + * Navigate to child screen. + * + * + * + * + *

This is the child screen.

+ * + * Go back + * + * + * + * ); + * ``` + */ + Screen: Object.assign(NavigatorScreen, { + displayName: 'Navigator.Screen' + }), + /** + * The `Navigator.Button` component can be used to navigate to a screen and + * should be used in combination with the `Navigator`, the `Navigator.Screen` + * and the `Navigator.BackButton` components. + * + * @example + * ```jsx + * import { Navigator } from '@wordpress/components'; + * + * const MyNavigation = () => ( + * + * + *

This is the home screen.

+ * + * Navigate to child screen. + * + * + * + * + *

This is the child screen.

+ * + * Go back + * + * + * + * ); + * ``` + */ + Button: Object.assign(NavigatorButton, { + displayName: 'Navigator.Button' + }), + /** + * The `Navigator.BackButton` component can be used to navigate to a screen and + * should be used in combination with the `Navigator`, the `Navigator.Screen` + * and the `Navigator.Button` components. + * + * @example + * ```jsx + * import { Navigator } from '@wordpress/components'; + * + * const MyNavigation = () => ( + * + * + *

This is the home screen.

+ * + * Navigate to child screen. + * + * + * + * + *

This is the child screen.

+ * + * Go back + * + * + * + * ); + * ``` + */ + BackButton: Object.assign(NavigatorBackButton, { + displayName: 'Navigator.BackButton' + }) +}); + +;// ./node_modules/@wordpress/components/build-module/notice/index.js +/** + * External dependencies + */ + + +/** + * WordPress dependencies + */ + + + + + +/** + * Internal dependencies + */ @@ -64027,6 +62215,7 @@ computedVariant = 'primary'; } return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, { + __next40pxDefaultSize: true, href: url, variant: computedVariant, onClick: url ? undefined : onClick, @@ -64036,6 +62225,7 @@ }) })] }), isDismissible && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, { + size: "small", className: "components-notice__dismiss", icon: library_close, label: (0,external_wp_i18n_namespaceObject.__)('Close'), @@ -64045,7 +62235,7 @@ } /* harmony default export */ const build_module_notice = (Notice); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/notice/list.js +;// ./node_modules/@wordpress/components/build-module/notice/list.js /** * External dependencies */ @@ -64110,8 +62300,7 @@ } /* harmony default export */ const list = (NoticeList); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/panel/header.js - +;// ./node_modules/@wordpress/components/build-module/panel/header.js /** * Internal dependencies @@ -64135,21 +62324,20 @@ } /* harmony default export */ const panel_header = (PanelHeader); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/panel/index.js -/** - * External dependencies - */ - - -/** - * WordPress dependencies - */ - - -/** - * Internal dependencies - */ - +;// ./node_modules/@wordpress/components/build-module/panel/index.js +/** + * External dependencies + */ + + +/** + * WordPress dependencies + */ + + +/** + * Internal dependencies + */ function UnforwardedPanel({ @@ -64186,7 +62374,7 @@ const Panel = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedPanel); /* harmony default export */ const panel = (Panel); -;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/chevron-up.js +;// ./node_modules/@wordpress/icons/build-module/library/chevron-up.js /** * WordPress dependencies */ @@ -64201,23 +62389,22 @@ }); /* harmony default export */ const chevron_up = (chevronUp); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/panel/body.js -/** - * External dependencies - */ - - -/** - * WordPress dependencies - */ - - - - -/** - * Internal dependencies - */ - +;// ./node_modules/@wordpress/components/build-module/panel/body.js +/** + * External dependencies + */ + + +/** + * WordPress dependencies + */ + + + + +/** + * Internal dependencies + */ @@ -64299,6 +62486,7 @@ return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("h2", { className: "components-panel__body-title", children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(build_module_button, { + __next40pxDefaultSize: true, className: "components-panel__body-toggle", "aria-expanded": isOpened, ref: ref, @@ -64320,7 +62508,7 @@ const PanelBody = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedPanelBody); /* harmony default export */ const body = (PanelBody); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/panel/row.js +;// ./node_modules/@wordpress/components/build-module/panel/row.js /** * External dependencies */ @@ -64353,24 +62541,23 @@ const PanelRow = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedPanelRow); /* harmony default export */ const row = (PanelRow); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/placeholder/index.js -/** - * External dependencies - */ - - -/** - * WordPress dependencies - */ - - - - - -/** - * Internal dependencies - */ - +;// ./node_modules/@wordpress/components/build-module/placeholder/index.js +/** + * External dependencies + */ + + +/** + * WordPress dependencies + */ + + + + + +/** + * Internal dependencies + */ const PlaceholderIllustration = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { @@ -64453,7 +62640,7 @@ } /* harmony default export */ const placeholder = (Placeholder); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/progress-bar/styles.js +;// ./node_modules/@wordpress/components/build-module/progress-bar/styles.js 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)."; } /** @@ -64463,36 +62650,44 @@ /** - * Internal dependencies - */ - -const animateProgressBar = emotion_react_browser_esm_keyframes({ - '0%': { - left: '-50%' - }, - '100%': { - left: '100%' - } -}); + * WordPress dependencies + */ + + +/** + * Internal dependencies + */ + +function animateProgressBar(isRtl = false) { + const animationDirection = isRtl ? 'right' : 'left'; + return emotion_react_browser_esm_keyframes({ + '0%': { + [animationDirection]: '-50%' + }, + '100%': { + [animationDirection]: '100%' + } + }); +} // Width of the indicator for the indeterminate progress bar const INDETERMINATE_TRACK_WIDTH = 50; const styles_Track = /*#__PURE__*/emotion_styled_base_browser_esm("div", true ? { target: "e15u147w2" -} : 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.radiusBlockUi, ";outline:2px solid transparent;outline-offset:2px;:where( & ){width:160px;}" + ( true ? "" : 0)); +} : 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)); var progress_bar_styles_ref = true ? { name: "152sa26", styles: "width:var(--indicator-width);transition:width 0.4s ease-in-out" } : 0; const Indicator = /*#__PURE__*/emotion_styled_base_browser_esm("div", true ? { target: "e15u147w1" -} : 0)("display:inline-block;position:absolute;top:0;height:100%;border-radius:", config_values.radiusBlockUi, ";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;", ({ +} : 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;", ({ isIndeterminate }) => isIndeterminate ? /*#__PURE__*/emotion_react_browser_esm_css({ animationDuration: '1.5s', animationTimingFunction: 'ease-in-out', animationIterationCount: 'infinite', - animationName: animateProgressBar, + animationName: animateProgressBar((0,external_wp_i18n_namespaceObject.isRTL)()), width: `${INDETERMINATE_TRACK_WIDTH}%` }, true ? "" : 0, true ? "" : 0) : progress_bar_styles_ref, ";" + ( true ? "" : 0)); const ProgressElement = /*#__PURE__*/emotion_styled_base_browser_esm("progress", true ? { @@ -64502,21 +62697,20 @@ styles: "position:absolute;top:0;left:0;opacity:0;width:100%;height:100%" } : 0); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/progress-bar/index.js -/** - * External dependencies - */ - -/** - * WordPress dependencies - */ - - - -/** - * Internal dependencies - */ - +;// ./node_modules/@wordpress/components/build-module/progress-bar/index.js +/** + * External dependencies + */ + +/** + * WordPress dependencies + */ + + + +/** + * Internal dependencies + */ function UnforwardedProgressBar(props, ref) { @@ -64561,7 +62755,7 @@ const ProgressBar = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedProgressBar); /* harmony default export */ const progress_bar = (ProgressBar); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/query-controls/terms.js +;// ./node_modules/@wordpress/components/build-module/query-controls/terms.js /** * Internal dependencies */ @@ -64613,21 +62807,32 @@ return fillWithChildren(termsByParent['0'] || []); } -;// CONCATENATED MODULE: external ["wp","htmlEntities"] +;// external ["wp","htmlEntities"] const external_wp_htmlEntities_namespaceObject = window["wp"]["htmlEntities"]; -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/tree-select/index.js -/** - * WordPress dependencies - */ - - - -/** - * Internal dependencies - */ - - - +;// ./node_modules/@wordpress/components/build-module/tree-select/index.js +/** + * WordPress dependencies + */ + + + +/** + * Internal dependencies + */ + + + + + +const tree_select_CONTEXT_VALUE = { + BaseControl: { + // Temporary during deprecation grace period: Overrides the underlying `__associatedWPComponentName` + // via the context system to override the value set by SelectControl. + _overrides: { + __associatedWPComponentName: 'TreeSelect' + } + } +}; function getSelectOptions(tree, level = 0) { return tree.flatMap(treeNode => [{ value: treeNode.id, @@ -64636,17 +62841,19 @@ } /** - * TreeSelect component is used to generate select input fields. - * - * ```jsx + * Generates a hierarchical select input. + * + * ```jsx + * import { useState } from 'react'; * import { TreeSelect } from '@wordpress/components'; - * import { useState } from '@wordpress/element'; * * const MyTreeSelect = () => { * const [ page, setPage ] = useState( 'p21' ); * * return ( * setPage( newPage ) } @@ -64682,7 +62889,6 @@ * } * ``` */ - function TreeSelect(props) { const { label, @@ -64698,17 +62904,26 @@ label: noOptionLabel }, ...getSelectOptions(tree)].filter(option => !!option); }, [noOptionLabel, tree]); - return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(SelectControl, { - label, - options, - onChange, - value: selectedId, - ...restProps + maybeWarnDeprecated36pxSize({ + componentName: 'TreeSelect', + size: restProps.size, + __next40pxDefaultSize: restProps.__next40pxDefaultSize + }); + return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ContextSystemProvider, { + value: tree_select_CONTEXT_VALUE, + children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(SelectControl, { + __shouldNotWarnDeprecated36pxSize: true, + label, + options, + onChange, + value: selectedId, + ...restProps + }) }); } /* harmony default export */ const tree_select = (TreeSelect); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/query-controls/author-select.js +;// ./node_modules/@wordpress/components/build-module/query-controls/author-select.js /** * Internal dependencies */ @@ -64738,7 +62953,7 @@ }); } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/query-controls/category-select.js +;// ./node_modules/@wordpress/components/build-module/query-controls/category-select.js /** * Internal dependencies */ @@ -64774,7 +62989,7 @@ }); } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/query-controls/index.js +;// ./node_modules/@wordpress/components/build-module/query-controls/index.js /** * WordPress dependencies */ @@ -64799,6 +63014,21 @@ function isMultipleCategorySelection(props) { return 'categorySuggestions' in props; } +const defaultOrderByOptions = [{ + label: (0,external_wp_i18n_namespaceObject.__)('Newest to oldest'), + value: 'date/desc' +}, { + label: (0,external_wp_i18n_namespaceObject.__)('Oldest to newest'), + value: 'date/asc' +}, { + /* translators: Label for ordering posts by title in ascending order. */ + label: (0,external_wp_i18n_namespaceObject.__)('A → Z'), + value: 'title/asc' +}, { + /* translators: Label for ordering posts by title in descending order. */ + label: (0,external_wp_i18n_namespaceObject.__)('Z → A'), + value: 'title/desc' +}]; /** * Controls to query for posts. @@ -64806,7 +63036,7 @@ * ```jsx * const MyQueryControls = () => ( * { * updateQuery( { orderBy: newOrderBy } ) * } @@ -64826,12 +63056,12 @@ * ``` */ function QueryControls({ - __next40pxDefaultSize = false, authorList, selectedAuthorId, numberOfItems, order, orderBy, + orderByOptions = defaultOrderByOptions, maxItems = DEFAULT_MAX_ITEMS, minItems = DEFAULT_MIN_ITEMS, onAuthorChange, @@ -64847,24 +63077,10 @@ className: "components-query-controls", children: [onOrderChange && onOrderByChange && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(select_control, { __nextHasNoMarginBottom: true, - __next40pxDefaultSize: __next40pxDefaultSize, + __next40pxDefaultSize: true, label: (0,external_wp_i18n_namespaceObject.__)('Order by'), - value: `${orderBy}/${order}`, - options: [{ - label: (0,external_wp_i18n_namespaceObject.__)('Newest to oldest'), - value: 'date/desc' - }, { - label: (0,external_wp_i18n_namespaceObject.__)('Oldest to newest'), - value: 'date/asc' - }, { - /* translators: Label for ordering posts by title in ascending order. */ - label: (0,external_wp_i18n_namespaceObject.__)('A → Z'), - value: 'title/asc' - }, { - /* translators: Label for ordering posts by title in descending order. */ - label: (0,external_wp_i18n_namespaceObject.__)('Z → A'), - value: 'title/desc' - }], + value: orderBy === undefined || order === undefined ? undefined : `${orderBy}/${order}`, + options: orderByOptions, onChange: value => { if (typeof value !== 'string') { return; @@ -64878,14 +63094,14 @@ } } }, "query-controls-order-select"), isSingleCategorySelection(props) && props.categoriesList && props.onCategoryChange && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(CategorySelect, { - __next40pxDefaultSize: __next40pxDefaultSize, + __next40pxDefaultSize: true, categoriesList: props.categoriesList, label: (0,external_wp_i18n_namespaceObject.__)('Category'), noOptionLabel: (0,external_wp_i18n_namespaceObject._x)('All', 'categories'), selectedCategoryId: props.selectedCategoryId, onChange: props.onCategoryChange }, "query-controls-category-select"), isMultipleCategorySelection(props) && props.categorySuggestions && props.onCategoryChange && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(form_token_field, { - __next40pxDefaultSize: __next40pxDefaultSize, + __next40pxDefaultSize: true, __nextHasNoMarginBottom: true, label: (0,external_wp_i18n_namespaceObject.__)('Categories'), value: props.selectedCategories && props.selectedCategories.map(item => ({ @@ -64900,7 +63116,7 @@ onChange: props.onCategoryChange, maxSuggestions: MAX_CATEGORIES_SUGGESTIONS }, "query-controls-categories-select"), onAuthorChange && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(AuthorSelect, { - __next40pxDefaultSize: __next40pxDefaultSize, + __next40pxDefaultSize: true, authorList: authorList, label: (0,external_wp_i18n_namespaceObject.__)('Author'), noOptionLabel: (0,external_wp_i18n_namespaceObject._x)('All', 'authors'), @@ -64908,7 +63124,7 @@ onChange: onAuthorChange }, "query-controls-author-select"), onNumberOfItemsChange && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(range_control, { __nextHasNoMarginBottom: true, - __next40pxDefaultSize: __next40pxDefaultSize, + __next40pxDefaultSize: true, label: (0,external_wp_i18n_namespaceObject.__)('Number of items'), value: numberOfItems, onChange: onNumberOfItemsChange, @@ -64920,11 +63136,10 @@ } /* harmony default export */ const query_controls = (QueryControls); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/radio-group/context.js -/** - * External dependencies - */ -// eslint-disable-next-line no-restricted-imports +;// ./node_modules/@wordpress/components/build-module/radio-group/context.js +/** + * External dependencies + */ /** * WordPress dependencies @@ -64935,21 +63150,21 @@ disabled: undefined }); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/radio-group/radio.js -/** - * WordPress dependencies - */ - - -/** - * External dependencies - */ -// eslint-disable-next-line no-restricted-imports - - -/** - * Internal dependencies - */ +;// ./node_modules/@wordpress/components/build-module/radio-group/radio.js +/** + * WordPress dependencies + */ + + +/** + * External dependencies + */ + + +/** + * Internal dependencies + */ + @@ -64962,8 +63177,13 @@ store, disabled } = (0,external_wp_element_namespaceObject.useContext)(RadioGroupContext); - const selectedValue = store?.useState('value'); + const selectedValue = useStoreState(store, 'value'); const isChecked = selectedValue !== undefined && selectedValue === value; + maybeWarnDeprecated36pxSize({ + componentName: 'Radio', + size: undefined, + __next40pxDefaultSize: props.__next40pxDefaultSize + }); return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Radio, { disabled: disabled, store: store, @@ -64983,16 +63203,17 @@ const radio_Radio = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedRadio); /* harmony default export */ const radio_group_radio = (radio_Radio); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/radio-group/index.js -/** - * External dependencies - */ -// eslint-disable-next-line no-restricted-imports - - -/** - * WordPress dependencies - */ +;// ./node_modules/@wordpress/components/build-module/radio-group/index.js +/** + * External dependencies + */ + + +/** + * WordPress dependencies + */ + + /** @@ -65015,17 +63236,23 @@ defaultValue: defaultChecked, setValue: newValue => { onChange?.(newValue !== null && newValue !== void 0 ? newValue : undefined); - } + }, + rtl: (0,external_wp_i18n_namespaceObject.isRTL)() }); const contextValue = (0,external_wp_element_namespaceObject.useMemo)(() => ({ store: radioStore, disabled }), [radioStore, disabled]); + external_wp_deprecated_default()('wp.components.__experimentalRadioGroup', { + alternative: 'wp.components.RadioControl or wp.components.__experimentalToggleGroupControl', + since: '6.8' + }); return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(RadioGroupContext.Provider, { value: contextValue, children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(RadioGroup, { store: radioStore, render: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(button_group, { + __shouldNotWarnDeprecated: true, children: children }), "aria-label": label, @@ -65041,21 +63268,33 @@ const radio_group_RadioGroup = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedRadioGroup); /* harmony default export */ const radio_group = (radio_group_RadioGroup); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/radio-control/index.js -/** - * External dependencies - */ - -/** - * WordPress dependencies - */ - - -/** - * Internal dependencies - */ - - +;// ./node_modules/@wordpress/components/build-module/radio-control/index.js +/** + * External dependencies + */ + +/** + * WordPress dependencies + */ + + +/** + * Internal dependencies + */ + + + + + +function generateOptionDescriptionId(radioGroupId, index) { + return `${radioGroupId}-${index}-option-description`; +} +function generateOptionId(radioGroupId, index) { + return `${radioGroupId}-${index}`; +} +function generateHelpId(radioGroupId) { + return `${radioGroupId}__help`; +} /** * Render a user interface to select the user type using radio inputs. @@ -65082,8 +63321,6 @@ * }; * ``` */ - - function RadioControl(props) { const { label, @@ -65093,47 +63330,63 @@ onChange, hideLabelFromVision, options = [], + id: preferredId, ...additionalProps } = props; - const instanceId = (0,external_wp_compose_namespaceObject.useInstanceId)(RadioControl); - const id = `inspector-radio-control-${instanceId}`; + const id = (0,external_wp_compose_namespaceObject.useInstanceId)(RadioControl, 'inspector-radio-control', preferredId); const onChangeValue = event => onChange(event.target.value); if (!options?.length) { return null; } - return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(base_control, { - __nextHasNoMarginBottom: true, - label: label, + return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("fieldset", { id: id, - hideLabelFromVision: hideLabelFromVision, - help: help, className: dist_clsx(className, 'components-radio-control'), - children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(v_stack_component, { - spacing: 1, + "aria-describedby": !!help ? generateHelpId(id) : undefined, + children: [hideLabelFromVision ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(visually_hidden_component, { + as: "legend", + children: label + }) : /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(base_control.VisualLabel, { + as: "legend", + children: label + }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(v_stack_component, { + spacing: 3, + className: dist_clsx('components-radio-control__group-wrapper', { + 'has-help': !!help + }), children: options.map((option, index) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { className: "components-radio-control__option", children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("input", { - id: `${id}-${index}`, + id: generateOptionId(id, index), className: "components-radio-control__input", type: "radio", name: id, value: option.value, onChange: onChangeValue, checked: option.value === selected, - "aria-describedby": !!help ? `${id}__help` : undefined, + "aria-describedby": !!option.description ? generateOptionDescriptionId(id, index) : undefined, ...additionalProps }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("label", { className: "components-radio-control__label", - htmlFor: `${id}-${index}`, + htmlFor: generateOptionId(id, index), children: option.label - })] - }, `${id}-${index}`)) - }) + }), !!option.description ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(StyledHelp, { + __nextHasNoMarginBottom: true, + id: generateOptionDescriptionId(id, index), + className: "components-radio-control__option-description", + children: option.description + }) : null] + }, generateOptionId(id, index))) + }), !!help && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(StyledHelp, { + __nextHasNoMarginBottom: true, + id: generateHelpId(id), + className: "components-base-control__help", + children: help + })] }); } /* harmony default export */ const radio_control = (RadioControl); -;// CONCATENATED MODULE: ./node_modules/re-resizable/lib/resizer.js +;// ./node_modules/re-resizable/lib/resizer.js var resizer_extends = (undefined && undefined.__extends) || (function () { var extendStatics = function (d, b) { extendStatics = Object.setPrototypeOf || @@ -65207,7 +63460,7 @@ }(external_React_.PureComponent)); -;// CONCATENATED MODULE: ./node_modules/re-resizable/lib/index.js +;// ./node_modules/re-resizable/lib/index.js var lib_extends = (undefined && undefined.__extends) || (function () { var extendStatics = function (d, b) { extendStatics = Object.setPrototypeOf || @@ -65965,7 +64218,7 @@ }(external_React_.PureComponent)); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/resizable-box/resize-tooltip/utils.js +;// ./node_modules/@wordpress/components/build-module/resizable-box/resize-tooltip/utils.js /** * WordPress dependencies */ @@ -66171,7 +64424,7 @@ return undefined; } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/resizable-box/resize-tooltip/styles/resize-tooltip.styles.js +;// ./node_modules/@wordpress/components/build-module/resizable-box/resize-tooltip/styles/resize-tooltip.styles.js 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)."; } /** @@ -66197,7 +64450,7 @@ } : 0); const resize_tooltip_styles_Tooltip = /*#__PURE__*/emotion_styled_base_browser_esm("div", true ? { target: "e1wq7y4k1" -} : 0)("background:", COLORS.theme.foreground, ";border-radius:2px;box-sizing:border-box;font-family:", font('default.fontFamily'), ";font-size:12px;color:", COLORS.theme.foregroundInverted, ";padding:4px 8px;position:relative;" + ( true ? "" : 0)); +} : 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)); // TODO: Resolve need to use &&& to increase specificity // https://github.com/WordPress/gutenberg/issues/18483 @@ -66206,7 +64459,7 @@ target: "e1wq7y4k0" } : 0)("&&&{color:", COLORS.theme.foregroundInverted, ";display:block;font-size:13px;line-height:1.4;white-space:nowrap;}" + ( true ? "" : 0)); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/resizable-box/resize-tooltip/label.js +;// ./node_modules/@wordpress/components/build-module/resizable-box/resize-tooltip/label.js /** * External dependencies */ @@ -66283,20 +64536,19 @@ const label_ForwardedComponent = (0,external_wp_element_namespaceObject.forwardRef)(resize_tooltip_label_Label); /* harmony default export */ const resize_tooltip_label = (label_ForwardedComponent); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/resizable-box/resize-tooltip/index.js -/** - * External dependencies - */ - -/** - * WordPress dependencies - */ - - -/** - * Internal dependencies - */ - +;// ./node_modules/@wordpress/components/build-module/resizable-box/resize-tooltip/index.js +/** + * External dependencies + */ + +/** + * WordPress dependencies + */ + + +/** + * Internal dependencies + */ @@ -66345,21 +64597,20 @@ const resize_tooltip_ForwardedComponent = (0,external_wp_element_namespaceObject.forwardRef)(ResizeTooltip); /* harmony default export */ const resize_tooltip = (resize_tooltip_ForwardedComponent); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/resizable-box/index.js -/** - * WordPress dependencies - */ - - -/** - * External dependencies - */ - - -/** - * Internal dependencies - */ - +;// ./node_modules/@wordpress/components/build-module/resizable-box/index.js +/** + * WordPress dependencies + */ + + +/** + * External dependencies + */ + + +/** + * Internal dependencies + */ const HANDLE_CLASS_NAME = 'components-resizable-box__handle'; @@ -66404,7 +64655,15 @@ ...props }, ref) { return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(Resizable, { - className: dist_clsx('components-resizable-box__container', showHandle && 'has-show-handle', className), + className: dist_clsx('components-resizable-box__container', showHandle && 'has-show-handle', className) + // Add a focusable element within the drag handle. Unfortunately, + // `re-resizable` does not make them properly focusable by default, + // causing focus to move the the block wrapper which triggers block + // drag. + , + handleComponent: Object.fromEntries(Object.keys(HANDLE_CLASSES).map(key => [key, /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { + tabIndex: -1 + }, key)])), handleClasses: HANDLE_CLASSES, handleStyles: HANDLE_STYLES, ref: ref, @@ -66417,7 +64676,7 @@ const ResizableBox = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedResizableBox); /* harmony default export */ const resizable_box = (ResizableBox); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/responsive-wrapper/index.js +;// ./node_modules/@wordpress/components/build-module/responsive-wrapper/index.js /** * External dependencies */ @@ -66477,17 +64736,16 @@ } /* harmony default export */ const responsive_wrapper = (ResponsiveWrapper); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/sandbox/index.js -/** - * WordPress dependencies - */ - - - -/** - * Internal dependencies - */ - +;// ./node_modules/@wordpress/components/build-module/sandbox/index.js +/** + * WordPress dependencies + */ + + + +/** + * Internal dependencies + */ const observeAndResizeJS = function () { const { @@ -66693,21 +64951,18 @@ iframe?.removeEventListener('load', tryNoForceSandBox, false); defaultView?.removeEventListener('message', checkMessageForResize); }; - // Ignore reason: passing `exhaustive-deps` will likely involve a more detailed refactor. + // Passing `exhaustive-deps` will likely involve a more detailed refactor. // See https://github.com/WordPress/gutenberg/pull/44378 - // eslint-disable-next-line react-hooks/exhaustive-deps }, []); (0,external_wp_element_namespaceObject.useEffect)(() => { trySandBox(); - // Ignore reason: passing `exhaustive-deps` will likely involve a more detailed refactor. + // Passing `exhaustive-deps` will likely involve a more detailed refactor. // See https://github.com/WordPress/gutenberg/pull/44378 - // eslint-disable-next-line react-hooks/exhaustive-deps }, [title, styles, scripts]); (0,external_wp_element_namespaceObject.useEffect)(() => { trySandBox(true); - // Ignore reason: passing `exhaustive-deps` will likely involve a more detailed refactor. + // Passing `exhaustive-deps` will likely involve a more detailed refactor. // See https://github.com/WordPress/gutenberg/pull/44378 - // eslint-disable-next-line react-hooks/exhaustive-deps }, [html, type]); return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("iframe", { ref: (0,external_wp_compose_namespaceObject.useMergeRefs)([ref, (0,external_wp_compose_namespaceObject.useFocusableIframe)()]), @@ -66722,25 +64977,24 @@ } /* harmony default export */ const sandbox = (SandBox); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/snackbar/index.js -/** - * External dependencies - */ - - - -/** - * WordPress dependencies - */ - - - - - -/** - * Internal dependencies - */ - +;// ./node_modules/@wordpress/components/build-module/snackbar/index.js +/** + * External dependencies + */ + + + +/** + * WordPress dependencies + */ + + + + + +/** + * Internal dependencies + */ const NOTICE_TIMEOUT = 10000; @@ -66796,12 +65050,12 @@ // The `onDismiss/onRemove` can have unstable references, // trigger side-effect cleanup, and reset timers. - const callbackRefs = (0,external_wp_element_namespaceObject.useRef)({ + const callbacksRef = (0,external_wp_element_namespaceObject.useRef)({ onDismiss, onRemove }); (0,external_wp_element_namespaceObject.useLayoutEffect)(() => { - callbackRefs.current = { + callbacksRef.current = { onDismiss, onRemove }; @@ -66810,8 +65064,8 @@ // Only set up the timeout dismiss if we're not explicitly dismissing. const timeoutHandle = setTimeout(() => { if (!explicitDismiss) { - callbackRefs.current.onDismiss?.(); - callbackRefs.current.onRemove?.(); + callbacksRef.current.onDismiss?.(); + callbacksRef.current.onRemove?.(); } }, NOTICE_TIMEOUT); return () => clearTimeout(timeoutHandle); @@ -66848,8 +65102,9 @@ url }, index) => { return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, { + __next40pxDefaultSize: true, href: url, - variant: "tertiary", + variant: "link", onClick: event => onActionClick(event, onClick), className: "components-snackbar__action", children: label @@ -66882,22 +65137,21 @@ const Snackbar = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedSnackbar); /* harmony default export */ const snackbar = (Snackbar); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/snackbar/list.js -/** - * External dependencies - */ - - -/** - * WordPress dependencies - */ - - - -/** - * Internal dependencies - */ - +;// ./node_modules/@wordpress/components/build-module/snackbar/list.js +/** + * External dependencies + */ + + +/** + * WordPress dependencies + */ + + + +/** + * Internal dependencies + */ @@ -66989,96 +65243,7 @@ } /* harmony default export */ const snackbar_list = (SnackbarList); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/spinner/styles.js - -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)."; } -/** - * External dependencies - */ - - - -/** - * Internal dependencies - */ - -const spinAnimation = emotion_react_browser_esm_keyframes` - from { - transform: rotate(0deg); - } - to { - transform: rotate(360deg); - } - `; -const StyledSpinner = /*#__PURE__*/emotion_styled_base_browser_esm("svg", true ? { - target: "ea4tfvq2" -} : 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)); -const commonPathProps = true ? { - name: "9s4963", - styles: "fill:transparent;stroke-width:1.5px" -} : 0; -const SpinnerTrack = /*#__PURE__*/emotion_styled_base_browser_esm("circle", true ? { - target: "ea4tfvq1" -} : 0)(commonPathProps, ";stroke:", COLORS.gray[300], ";" + ( true ? "" : 0)); -const SpinnerIndicator = /*#__PURE__*/emotion_styled_base_browser_esm("path", true ? { - target: "ea4tfvq0" -} : 0)(commonPathProps, ";stroke:currentColor;stroke-linecap:round;transform-origin:50% 50%;animation:1.4s linear infinite both ", spinAnimation, ";" + ( true ? "" : 0)); - -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/spinner/index.js -/** - * External dependencies - */ - -/** - * Internal dependencies - */ - -/** - * WordPress dependencies - */ - - - -function UnforwardedSpinner({ - className, - ...props -}, forwardedRef) { - return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(StyledSpinner, { - className: dist_clsx('components-spinner', className), - viewBox: "0 0 100 100", - width: "16", - height: "16", - xmlns: "http://www.w3.org/2000/svg", - role: "presentation", - focusable: "false", - ...props, - ref: forwardedRef, - children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(SpinnerTrack, { - cx: "50", - cy: "50", - r: "50", - vectorEffect: "non-scaling-stroke" - }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(SpinnerIndicator, { - d: "m 50 0 a 50 50 0 0 1 50 50", - vectorEffect: "non-scaling-stroke" - })] - }); -} -/** - * `Spinner` is a component used to notify users that their action is being processed. - * - * ```js - * import { Spinner } from '@wordpress/components'; - * - * function Example() { - * return ; - * } - * ``` - */ -const Spinner = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedSpinner); -/* harmony default export */ const spinner = (Spinner); - -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/surface/component.js +;// ./node_modules/@wordpress/components/build-module/surface/component.js /** * External dependencies */ @@ -67121,7 +65286,7 @@ const component_Surface = contextConnect(UnconnectedSurface, 'Surface'); /* harmony default export */ const surface_component = (component_Surface); -;// CONCATENATED MODULE: ./node_modules/@ariakit/core/esm/tab/tab-store.js +;// ./node_modules/@ariakit/core/esm/tab/tab-store.js "use client"; @@ -67132,10 +65297,43 @@ // src/tab/tab-store.ts -function createTabStore(props = {}) { - var _a; - const syncState = (_a = props.store) == null ? void 0 : _a.getState(); - const composite = createCompositeStore(_chunks_4R3V3JGP_spreadProps(_chunks_4R3V3JGP_spreadValues({}, props), { +function createTabStore(_a = {}) { + var _b = _a, { + composite: parentComposite, + combobox + } = _b, props = _3YLGPPWQ_objRest(_b, [ + "composite", + "combobox" + ]); + const independentKeys = [ + "items", + "renderedItems", + "moves", + "orientation", + "virtualFocus", + "includesBaseElement", + "baseElement", + "focusLoop", + "focusShift", + "focusWrap" + ]; + const store = mergeStore( + props.store, + omit2(parentComposite, independentKeys), + omit2(combobox, independentKeys) + ); + const syncState = store == null ? void 0 : store.getState(); + const composite = createCompositeStore(_chunks_3YLGPPWQ_spreadProps(_chunks_3YLGPPWQ_spreadValues({}, props), { + store, + // We need to explicitly set the default value of `includesBaseElement` to + // `false` since we don't want the composite store to default it to `true` + // when the activeId state is null, which could be the case when rendering + // combobox with tab. + includesBaseElement: defaultValue( + props.includesBaseElement, + syncState == null ? void 0 : syncState.includesBaseElement, + false + ), orientation: defaultValue( props.orientation, syncState == null ? void 0 : syncState.orientation, @@ -67144,12 +65342,11 @@ focusLoop: defaultValue(props.focusLoop, syncState == null ? void 0 : syncState.focusLoop, true) })); const panels = createCollectionStore(); - const initialState = _chunks_4R3V3JGP_spreadProps(_chunks_4R3V3JGP_spreadValues({}, composite.getState()), { + const initialState = _chunks_3YLGPPWQ_spreadProps(_chunks_3YLGPPWQ_spreadValues({}, composite.getState()), { selectedId: defaultValue( props.selectedId, syncState == null ? void 0 : syncState.selectedId, - props.defaultSelectedId, - void 0 + props.defaultSelectedId ), selectOnMove: defaultValue( props.selectOnMove, @@ -67157,38 +65354,36 @@ true ) }); - const tab = createStore(initialState, composite, props.store); + const tab = createStore(initialState, composite, store); setup( tab, () => sync(tab, ["moves"], () => { const { activeId, selectOnMove } = tab.getState(); - if (!selectOnMove) - return; - if (!activeId) - return; + if (!selectOnMove) return; + if (!activeId) return; const tabItem = composite.item(activeId); - if (!tabItem) - return; - if (tabItem.dimmed) + if (!tabItem) return; + if (tabItem.dimmed) return; + if (tabItem.disabled) return; + tab.setState("selectedId", tabItem.id); + }) + ); + let syncActiveId = true; + setup( + tab, + () => batch(tab, ["selectedId"], (state, prev) => { + if (!syncActiveId) { + syncActiveId = true; return; - if (tabItem.disabled) - return; - tab.setState("selectedId", tabItem.id); + } + if (parentComposite && state.selectedId === prev.selectedId) return; + tab.setState("activeId", state.selectedId); }) ); setup( tab, - () => batch( - tab, - ["selectedId"], - (state) => tab.setState("activeId", state.selectedId) - ) - ); - setup( - tab, () => sync(tab, ["selectedId", "renderedItems"], (state) => { - if (state.selectedId !== void 0) - return; + if (state.selectedId !== void 0) return; const { activeId, renderedItems } = tab.getState(); const tabItem = composite.item(activeId); if (tabItem && !tabItem.disabled && !tabItem.dimmed) { @@ -67205,25 +65400,42 @@ tab, () => sync(tab, ["renderedItems"], (state) => { const tabs = state.renderedItems; - if (!tabs.length) - return; + if (!tabs.length) return; return sync(panels, ["renderedItems"], (state2) => { const items = state2.renderedItems; const hasOrphanPanels = items.some((panel) => !panel.tabId); - if (!hasOrphanPanels) - return; + if (!hasOrphanPanels) return; items.forEach((panel, i) => { - if (panel.tabId) - return; + if (panel.tabId) return; const tabItem = tabs[i]; - if (!tabItem) - return; - panels.renderItem(_chunks_4R3V3JGP_spreadProps(_chunks_4R3V3JGP_spreadValues({}, panel), { tabId: tabItem.id })); - }); - }); - }) - ); - return _chunks_4R3V3JGP_spreadProps(_chunks_4R3V3JGP_spreadValues(_chunks_4R3V3JGP_spreadValues({}, composite), tab), { + if (!tabItem) return; + panels.renderItem(_chunks_3YLGPPWQ_spreadProps(_chunks_3YLGPPWQ_spreadValues({}, panel), { tabId: tabItem.id })); + }); + }); + }) + ); + let selectedIdFromSelectedValue = null; + setup(tab, () => { + const backupSelectedId = () => { + selectedIdFromSelectedValue = tab.getState().selectedId; + }; + const restoreSelectedId = () => { + syncActiveId = false; + tab.setState("selectedId", selectedIdFromSelectedValue); + }; + if (parentComposite && "setSelectElement" in parentComposite) { + return chain( + sync(parentComposite, ["value"], backupSelectedId), + sync(parentComposite, ["mounted"], restoreSelectedId) + ); + } + if (!combobox) return; + return chain( + sync(combobox, ["selectedValue"], backupSelectedId), + sync(combobox, ["mounted"], restoreSelectedId) + ); + }); + return _chunks_3YLGPPWQ_spreadProps(_chunks_3YLGPPWQ_spreadValues(_chunks_3YLGPPWQ_spreadValues({}, composite), tab), { panels, setSelectedId: (id) => tab.setState("selectedId", id), select: (id) => { @@ -67234,8 +65446,10 @@ } -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/CQMDBRG5.js -"use client"; +;// ./node_modules/@ariakit/react-core/esm/__chunks/PY4NZ6HS.js +"use client"; + + @@ -67245,39 +65459,49 @@ function useTabStoreProps(store, update, props) { + useUpdateEffect(update, [props.composite, props.combobox]); store = useCompositeStoreProps(store, update, props); useStoreProps(store, props, "selectedId", "setSelectedId"); useStoreProps(store, props, "selectOnMove"); - const [panels, updatePanels] = EKQEJRUF_useStore(() => store.panels, {}); + const [panels, updatePanels] = YV4JVR4I_useStore(() => store.panels, {}); useUpdateEffect(updatePanels, [store, updatePanels]); - return (0,external_React_.useMemo)(() => _4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues({}, store), { panels }), [store, panels]); + return Object.assign( + (0,external_React_.useMemo)(() => _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, store), { panels }), [store, panels]), + { composite: props.composite, combobox: props.combobox } + ); } function useTabStore(props = {}) { - const [store, update] = EKQEJRUF_useStore(createTabStore, props); + const combobox = useComboboxContext(); + const composite = useSelectContext() || combobox; + props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, props), { + composite: props.composite !== void 0 ? props.composite : composite, + combobox: props.combobox !== void 0 ? props.combobox : combobox + }); + const [store, update] = YV4JVR4I_useStore(createTabStore, props); return useTabStoreProps(store, update, props); } -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/4B73HROV.js +;// ./node_modules/@ariakit/react-core/esm/__chunks/UYGDZTLQ.js "use client"; // src/tab/tab-context.tsx -var _4B73HROV_ctx = createStoreContext( +var UYGDZTLQ_ctx = createStoreContext( [CompositeContextProvider], [CompositeScopedContextProvider] ); -var useTabContext = _4B73HROV_ctx.useContext; -var useTabScopedContext = _4B73HROV_ctx.useScopedContext; -var useTabProviderContext = _4B73HROV_ctx.useProviderContext; -var TabContextProvider = _4B73HROV_ctx.ContextProvider; -var TabScopedContextProvider = _4B73HROV_ctx.ScopedContextProvider; - - - -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/tab/tab-list.js +var useTabContext = UYGDZTLQ_ctx.useContext; +var useTabScopedContext = UYGDZTLQ_ctx.useScopedContext; +var useTabProviderContext = UYGDZTLQ_ctx.useProviderContext; +var TabContextProvider = UYGDZTLQ_ctx.ContextProvider; +var TabScopedContextProvider = UYGDZTLQ_ctx.ScopedContextProvider; + + + +;// ./node_modules/@ariakit/react-core/esm/tab/tab-list.js "use client"; @@ -67294,126 +65518,164 @@ // src/tab/tab-list.tsx -var useTabList = createHook((_a) => { - var _b = _a, { store } = _b, props = __objRest(_b, ["store"]); - const context = useTabProviderContext(); +var tab_list_TagName = "div"; +var useTabList = createHook( + function useTabList2(_a) { + var _b = _a, { store } = _b, props = __objRest(_b, ["store"]); + const context = useTabProviderContext(); + store = store || context; + invariant( + store, + false && 0 + ); + const orientation = store.useState( + (state) => state.orientation === "both" ? void 0 : state.orientation + ); + props = useWrapElement( + props, + (element) => /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(TabScopedContextProvider, { value: store, children: element }), + [store] + ); + if (store.composite) { + props = _3YLGPPWQ_spreadValues({ + focusable: false + }, props); + } + props = _3YLGPPWQ_spreadValues({ + role: "tablist", + "aria-orientation": orientation + }, props); + props = useComposite(_3YLGPPWQ_spreadValues({ store }, props)); + return props; + } +); +var TabList = forwardRef2(function TabList2(props) { + const htmlProps = useTabList(props); + return LMDWO4NN_createElement(tab_list_TagName, htmlProps); +}); + + +;// ./node_modules/@ariakit/react-core/esm/tab/tab.js +"use client"; + + + + + + + + + + + + + + + +// src/tab/tab.tsx + + + +var tab_TagName = "button"; +var useTab = createHook(function useTab2(_a) { + var _b = _a, { + store, + getItem: getItemProp + } = _b, props = __objRest(_b, [ + "store", + "getItem" + ]); + var _a2; + const context = useTabScopedContext(); store = store || context; invariant( store, false && 0 ); - const orientation = store.useState( - (state) => state.orientation === "both" ? void 0 : state.orientation - ); - props = useWrapElement( - props, - (element) => /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(TabScopedContextProvider, { value: store, children: element }), - [store] - ); - props = _4R3V3JGP_spreadValues({ - role: "tablist", - "aria-orientation": orientation - }, props); - props = useComposite(_4R3V3JGP_spreadValues({ store }, props)); + const defaultId = useId(); + const id = props.id || defaultId; + const dimmed = disabledFromProps(props); + const getItem = (0,external_React_.useCallback)( + (item) => { + const nextItem = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, item), { dimmed }); + if (getItemProp) { + return getItemProp(nextItem); + } + return nextItem; + }, + [dimmed, getItemProp] + ); + const onClickProp = props.onClick; + const onClick = useEvent((event) => { + onClickProp == null ? void 0 : onClickProp(event); + if (event.defaultPrevented) return; + store == null ? void 0 : store.setSelectedId(id); + }); + const panelId = store.panels.useState( + (state) => { + var _a3; + return (_a3 = state.items.find((item) => item.tabId === id)) == null ? void 0 : _a3.id; + } + ); + const shouldRegisterItem = defaultId ? props.shouldRegisterItem : false; + const isActive = store.useState((state) => !!id && state.activeId === id); + const selected = store.useState((state) => !!id && state.selectedId === id); + const hasActiveItem = store.useState((state) => !!store.item(state.activeId)); + const canRegisterComposedItem = isActive || selected && !hasActiveItem; + const accessibleWhenDisabled = selected || ((_a2 = props.accessibleWhenDisabled) != null ? _a2 : true); + const isWithinVirtualFocusComposite = useStoreState( + store.combobox || store.composite, + "virtualFocus" + ); + if (isWithinVirtualFocusComposite) { + props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, props), { + tabIndex: -1 + }); + } + props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({ + id, + role: "tab", + "aria-selected": selected, + "aria-controls": panelId || void 0 + }, props), { + onClick + }); + if (store.composite) { + const defaultProps = { + id, + accessibleWhenDisabled, + store: store.composite, + shouldRegisterItem: canRegisterComposedItem && shouldRegisterItem, + rowId: props.rowId, + render: props.render + }; + props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, props), { + render: /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)( + P2CTZE2T_CompositeItem, + _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, defaultProps), { + render: store.combobox && store.composite !== store.combobox ? /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(P2CTZE2T_CompositeItem, _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, defaultProps), { store: store.combobox })) : defaultProps.render + }) + ) + }); + } + props = useCompositeItem(_3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({ + store + }, props), { + accessibleWhenDisabled, + getItem, + shouldRegisterItem + })); return props; }); -var tab_list_TabList = createComponent((props) => { - const htmlProps = useTabList(props); - return _3ORBWXWF_createElement("div", htmlProps); -}); -if (false) {} - - -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/tab/tab.js -"use client"; - - - - - - - - - - - - - - - -// src/tab/tab.ts - - -var useTab = createHook( - (_a) => { - var _b = _a, { - store, - accessibleWhenDisabled = true, - getItem: getItemProp - } = _b, props = __objRest(_b, [ - "store", - "accessibleWhenDisabled", - "getItem" - ]); - const context = useTabScopedContext(); - store = store || context; - invariant( - store, - false && 0 - ); - const defaultId = useId(); - const id = props.id || defaultId; - const dimmed = disabledFromProps(props); - const getItem = (0,external_React_.useCallback)( - (item) => { - const nextItem = _4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues({}, item), { dimmed }); - if (getItemProp) { - return getItemProp(nextItem); - } - return nextItem; - }, - [dimmed, getItemProp] - ); - const onClickProp = props.onClick; - const onClick = useEvent((event) => { - onClickProp == null ? void 0 : onClickProp(event); - if (event.defaultPrevented) - return; - store == null ? void 0 : store.setSelectedId(id); - }); - const panelId = store.panels.useState( - (state) => { - var _a2; - return (_a2 = state.items.find((item) => item.tabId === id)) == null ? void 0 : _a2.id; - } - ); - const selected = store.useState((state) => !!id && state.selectedId === id); - props = _4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues({ - id, - role: "tab", - "aria-selected": selected, - "aria-controls": panelId || void 0 - }, props), { - onClick - }); - props = useCompositeItem(_4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues({ - store - }, props), { - accessibleWhenDisabled, - getItem, - shouldRegisterItem: !!defaultId ? props.shouldRegisterItem : false - })); - return props; - } -); -var Tab = createMemoComponent((props) => { - const htmlProps = useTab(props); - return _3ORBWXWF_createElement("button", htmlProps); -}); -if (false) {} - - -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/tab/tab-panel.js +var Tab = memo2( + forwardRef2(function Tab2(props) { + const htmlProps = useTab(props); + return LMDWO4NN_createElement(tab_TagName, htmlProps); + }) +); + + +;// ./node_modules/@ariakit/react-core/esm/tab/tab-panel.js "use client"; @@ -67436,9 +65698,24 @@ +var tab_panel_TagName = "div"; var useTabPanel = createHook( - (_a) => { - var _b = _a, { store, tabId: tabIdProp, getItem: getItemProp } = _b, props = __objRest(_b, ["store", "tabId", "getItem"]); + function useTabPanel2(_a) { + var _b = _a, { + store, + unmountOnHide, + tabId: tabIdProp, + getItem: getItemProp, + scrollRestoration, + scrollElement + } = _b, props = __objRest(_b, [ + "store", + "unmountOnHide", + "tabId", + "getItem", + "scrollRestoration", + "scrollElement" + ]); const context = useTabProviderContext(); store = store || context; invariant( @@ -67447,17 +65724,68 @@ ); const ref = (0,external_React_.useRef)(null); const id = useId(props.id); + const tabId = useStoreState( + store.panels, + () => { + var _a2; + return tabIdProp || ((_a2 = store == null ? void 0 : store.panels.item(id)) == null ? void 0 : _a2.tabId); + } + ); + const open = useStoreState( + store, + (state) => !!tabId && state.selectedId === tabId + ); + const disclosure = useDisclosureStore({ open }); + const mounted = useStoreState(disclosure, "mounted"); + const scrollPositionRef = (0,external_React_.useRef)( + /* @__PURE__ */ new Map() + ); + const getScrollElement = useEvent(() => { + const panelElement = ref.current; + if (!panelElement) return null; + if (!scrollElement) return panelElement; + if (typeof scrollElement === "function") { + return scrollElement(panelElement); + } + if ("current" in scrollElement) { + return scrollElement.current; + } + return scrollElement; + }); + (0,external_React_.useEffect)(() => { + var _a2, _b2; + if (!scrollRestoration) return; + if (!mounted) return; + const element = getScrollElement(); + if (!element) return; + if (scrollRestoration === "reset") { + element.scroll(0, 0); + return; + } + if (!tabId) return; + const position = scrollPositionRef.current.get(tabId); + element.scroll((_a2 = position == null ? void 0 : position.x) != null ? _a2 : 0, (_b2 = position == null ? void 0 : position.y) != null ? _b2 : 0); + const onScroll = () => { + scrollPositionRef.current.set(tabId, { + x: element.scrollLeft, + y: element.scrollTop + }); + }; + element.addEventListener("scroll", onScroll); + return () => { + element.removeEventListener("scroll", onScroll); + }; + }, [scrollRestoration, mounted, tabId, getScrollElement, store]); const [hasTabbableChildren, setHasTabbableChildren] = (0,external_React_.useState)(false); (0,external_React_.useEffect)(() => { const element = ref.current; - if (!element) - return; + if (!element) return; const tabbable = getAllTabbableIn(element); setHasTabbableChildren(!!tabbable.length); }, []); const getItem = (0,external_React_.useCallback)( (item) => { - const nextItem = _4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues({}, item), { id: id || item.id, tabId: tabIdProp }); + const nextItem = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, item), { id: id || item.id, tabId: tabIdProp }); if (getItemProp) { return getItemProp(nextItem); } @@ -67465,58 +65793,71 @@ }, [id, tabIdProp, getItemProp] ); + const onKeyDownProp = props.onKeyDown; + const onKeyDown = useEvent((event) => { + onKeyDownProp == null ? void 0 : onKeyDownProp(event); + if (event.defaultPrevented) return; + if (!(store == null ? void 0 : store.composite)) return; + const keyMap = { + ArrowLeft: store.previous, + ArrowRight: store.next, + Home: store.first, + End: store.last + }; + const action = keyMap[event.key]; + if (!action) return; + const { selectedId } = store.getState(); + const nextId = action({ activeId: selectedId }); + if (!nextId) return; + event.preventDefault(); + store.move(nextId); + }); props = useWrapElement( props, (element) => /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(TabScopedContextProvider, { value: store, children: element }), [store] ); - const tabId = store.panels.useState( - () => { - var _a2; - return tabIdProp || ((_a2 = store == null ? void 0 : store.panels.item(id)) == null ? void 0 : _a2.tabId); - } - ); - const open = store.useState( - (state) => !!tabId && state.selectedId === tabId - ); - props = _4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues({ + props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({ id, role: "tabpanel", "aria-labelledby": tabId || void 0 }, props), { - ref: useMergeRefs(ref, props.ref) - }); - const disclosure = useDisclosureStore({ open }); - props = useFocusable(_4R3V3JGP_spreadValues({ focusable: !hasTabbableChildren }, props)); - props = useDisclosureContent(_4R3V3JGP_spreadValues({ store: disclosure }, props)); - props = useCollectionItem(_4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues({ store: store.panels }, props), { getItem })); + children: unmountOnHide && !mounted ? null : props.children, + ref: useMergeRefs(ref, props.ref), + onKeyDown + }); + props = useFocusable(_3YLGPPWQ_spreadValues({ + // If the tab panel is rendered as part of another composite widget such + // as combobox, it should not be focusable. + focusable: !store.composite && !hasTabbableChildren + }, props)); + props = useDisclosureContent(_3YLGPPWQ_spreadValues({ store: disclosure }, props)); + props = useCollectionItem(_3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({ store: store.panels }, props), { getItem })); return props; } ); -var TabPanel = createComponent((props) => { +var TabPanel = forwardRef2(function TabPanel2(props) { const htmlProps = useTabPanel(props); - return _3ORBWXWF_createElement("div", htmlProps); -}); -if (false) {} - - -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/tab-panel/index.js -/** - * External dependencies - */ -// eslint-disable-next-line no-restricted-imports - - -/** - * WordPress dependencies - */ - - - -/** - * Internal dependencies - */ - + return LMDWO4NN_createElement(tab_panel_TagName, htmlProps); +}); + + +;// ./node_modules/@wordpress/components/build-module/tab-panel/index.js +/** + * External dependencies + */ + + +/** + * WordPress dependencies + */ + + + + +/** + * Internal dependencies + */ @@ -67601,9 +65942,10 @@ }, orientation, selectOnMove, - defaultSelectedId: prependInstanceId(initialTabName) - }); - const selectedTabName = extractTabName(tabStore.useState('selectedId')); + defaultSelectedId: prependInstanceId(initialTabName), + rtl: (0,external_wp_i18n_namespaceObject.isRTL)() + }); + const selectedTabName = extractTabName(useStoreState(tabStore, 'selectedId')); const setTabStoreSelectedId = (0,external_wp_element_namespaceObject.useCallback)(tabName => { tabStore.setState('selectedId', prependInstanceId(tabName)); }, [prependInstanceId, tabStore]); @@ -67661,7 +66003,7 @@ return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("div", { className: className, ref: ref, - children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(tab_list_TabList, { + children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(TabList, { store: tabStore, className: "components-tab-panel__tabs", children: tabs.map(tab => { @@ -67673,6 +66015,7 @@ disabled: tab.disabled, "aria-controls": `${prependInstanceId(tab.name)}-view`, render: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, { + __next40pxDefaultSize: true, icon: tab.icon, label: tab.icon && tab.title, showTooltip: !!tab.icon @@ -67692,22 +66035,23 @@ const tab_panel_TabPanel = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedTabPanel); /* harmony default export */ const tab_panel = (tab_panel_TabPanel); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/text-control/index.js -/** - * External dependencies - */ - - - -/** - * WordPress dependencies - */ - - - -/** - * Internal dependencies - */ +;// ./node_modules/@wordpress/components/build-module/text-control/index.js +/** + * External dependencies + */ + + + +/** + * WordPress dependencies + */ + + + +/** + * Internal dependencies + */ + function UnforwardedTextControl(props, ref) { @@ -67726,8 +66070,14 @@ } = props; const id = (0,external_wp_compose_namespaceObject.useInstanceId)(TextControl, 'inspector-text-control', idProp); const onChangeValue = event => onChange(event.target.value); + maybeWarnDeprecated36pxSize({ + componentName: 'TextControl', + size: undefined, + __next40pxDefaultSize + }); return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(base_control, { __nextHasNoMarginBottom: __nextHasNoMarginBottom, + __associatedWPComponentName: "TextControl", label: label, hideLabelFromVision: hideLabelFromVision, id: id, @@ -67760,6 +66110,8 @@ * * return ( * setClassName( value ) } @@ -67771,21 +66123,7 @@ const TextControl = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedTextControl); /* harmony default export */ const text_control = (TextControl); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/utils/input/base.js -/** - * External dependencies - */ - - -/** - * Internal dependencies - */ - - -const inputStyleNeutral = /*#__PURE__*/emotion_react_browser_esm_css("box-shadow:0 0 0 transparent;border-radius:", config_values.radiusBlockUi, ";border:", config_values.borderWidth, " solid ", COLORS.ui.border, ";@media not ( prefers-reduced-motion ){transition:box-shadow 0.1s linear;}" + ( true ? "" : 0), true ? "" : 0); -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); - -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/utils/breakpoint-values.js +;// ./node_modules/@wordpress/components/build-module/utils/breakpoint-values.js /* harmony default export */ const breakpoint_values = ({ huge: '1440px', wide: '1280px', @@ -67799,7 +66137,7 @@ 'zoomed-in': '280px' }); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/utils/breakpoint.js +;// ./node_modules/@wordpress/components/build-module/utils/breakpoint.js /** * Internal dependencies */ @@ -67811,36 +66149,28 @@ */ const breakpoint = point => `@media (min-width: ${breakpoint_values[point]})`; -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/utils/input/input-control.js -/** - * External dependencies - */ - - -/** - * Internal dependencies - */ - - - - -const inputControl = /*#__PURE__*/emotion_react_browser_esm_css("display:block;font-family:", font('default.fontFamily'), ";padding:6px 8px;", inputStyleNeutral, ";font-size:", font('mobileTextMinFontSize'), ";line-height:normal;", breakpoint('small'), "{font-size:", font('default.fontSize'), ";line-height:normal;}&: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), true ? "" : 0); - -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/textarea-control/styles/textarea-control-styles.js - -/** - * External dependencies - */ - -/** - * Internal dependencies - */ - +;// ./node_modules/@wordpress/components/build-module/textarea-control/styles/textarea-control-styles.js + +/** + * External dependencies + */ + + + +/** + * Internal dependencies + */ + + + + +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); +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); const StyledTextarea = /*#__PURE__*/emotion_styled_base_browser_esm("textarea", true ? { target: "e1w5nnrk0" -} : 0)("width:100%;", inputControl, ";" + ( true ? "" : 0)); - -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/textarea-control/index.js +} : 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{color:", COLORS.ui.darkGrayPlaceholder, ";}&:-ms-input-placeholder{color:", COLORS.ui.darkGrayPlaceholder, ";}.is-dark-theme &{&::-webkit-input-placeholder{color:", COLORS.ui.lightGrayPlaceholder, ";}&::-moz-placeholder{color:", COLORS.ui.lightGrayPlaceholder, ";}&:-ms-input-placeholder{color:", COLORS.ui.lightGrayPlaceholder, ";}}" + ( true ? "" : 0)); + +;// ./node_modules/@wordpress/components/build-module/textarea-control/index.js /** * WordPress dependencies */ @@ -67870,6 +66200,7 @@ const onChangeValue = event => onChange(event.target.value); return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(base_control, { __nextHasNoMarginBottom: __nextHasNoMarginBottom, + __associatedWPComponentName: "TextareaControl", label: label, hideLabelFromVision: hideLabelFromVision, id: id, @@ -67902,6 +66233,7 @@ * * return ( * { - * const [ value, setValue ] = useState( false ); - * - * return ( - * setValue( ( state ) => ! state ) } - * /> - * ); - * }; - * ``` - */ - - -function ToggleControl({ +;// ./node_modules/@wordpress/components/build-module/toggle-control/index.js +/** + * External dependencies + */ + + + + +/** + * WordPress dependencies + */ + + + + +/** + * Internal dependencies + */ + + + + + + + +function UnforwardedToggleControl({ __nextHasNoMarginBottom, label, checked, @@ -68063,6 +66373,13 @@ const classes = cx('components-toggle-control', className, !__nextHasNoMarginBottom && /*#__PURE__*/emotion_react_browser_esm_css({ marginBottom: space(3) }, true ? "" : 0, true ? "" : 0)); + if (!__nextHasNoMarginBottom) { + external_wp_deprecated_default()('Bottom margin styles for wp.components.ToggleControl', { + since: '6.7', + version: '7.0', + hint: 'Set the `__nextHasNoMarginBottom` prop to true to start opting into the new styles, which will become the default in a future version.' + }); + } let describedBy, helpLabel; if (help) { if (typeof help === 'function') { @@ -68081,12 +66398,15 @@ } return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(base_control, { id: id, - help: helpLabel, + help: helpLabel && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", { + className: "components-toggle-control__help", + children: helpLabel + }), className: classes, __nextHasNoMarginBottom: true, children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(h_stack_component, { justify: "flex-start", - spacing: 3, + spacing: 2, children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(form_toggle, { id: id, checked: checked, @@ -68097,62 +66417,88 @@ }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(flex_block_component, { as: "label", htmlFor: id, - className: "components-toggle-control__label", + className: dist_clsx('components-toggle-control__label', { + 'is-disabled': disabled + }), children: label })] }) }); } -/* harmony default export */ const toggle_control = ((0,external_wp_element_namespaceObject.forwardRef)(ToggleControl)); - -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/SOK7T35T.js + +/** + * ToggleControl is used to generate a toggle user interface. + * + * ```jsx + * import { ToggleControl } from '@wordpress/components'; + * import { useState } from '@wordpress/element'; + * + * const MyToggleControl = () => { + * const [ value, setValue ] = useState( false ); + * + * return ( + * setValue( ( state ) => ! state ) } + * /> + * ); + * }; + * ``` + */ +const ToggleControl = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedToggleControl); +/* harmony default export */ const toggle_control = (ToggleControl); + +;// ./node_modules/@ariakit/react-core/esm/__chunks/A3WPL2ZJ.js "use client"; // src/toolbar/toolbar-context.tsx -var SOK7T35T_ctx = createStoreContext( +var A3WPL2ZJ_ctx = createStoreContext( [CompositeContextProvider], [CompositeScopedContextProvider] ); -var useToolbarContext = SOK7T35T_ctx.useContext; -var useToolbarScopedContext = SOK7T35T_ctx.useScopedContext; -var useToolbarProviderContext = SOK7T35T_ctx.useProviderContext; -var ToolbarContextProvider = SOK7T35T_ctx.ContextProvider; -var ToolbarScopedContextProvider = SOK7T35T_ctx.ScopedContextProvider; - - - -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/7NHUGSTF.js -"use client"; - - - - - -// src/toolbar/toolbar-item.ts +var useToolbarContext = A3WPL2ZJ_ctx.useContext; +var useToolbarScopedContext = A3WPL2ZJ_ctx.useScopedContext; +var useToolbarProviderContext = A3WPL2ZJ_ctx.useProviderContext; +var ToolbarContextProvider = A3WPL2ZJ_ctx.ContextProvider; +var ToolbarScopedContextProvider = A3WPL2ZJ_ctx.ScopedContextProvider; + + + +;// ./node_modules/@ariakit/react-core/esm/__chunks/BOLVLGVE.js +"use client"; + + + + + +// src/toolbar/toolbar-item.tsx +var BOLVLGVE_TagName = "button"; var useToolbarItem = createHook( - (_a) => { + function useToolbarItem2(_a) { var _b = _a, { store } = _b, props = __objRest(_b, ["store"]); const context = useToolbarContext(); store = store || context; - props = useCompositeItem(_4R3V3JGP_spreadValues({ store }, props)); + props = useCompositeItem(_3YLGPPWQ_spreadValues({ store }, props)); return props; } ); -var ToolbarItem = createMemoComponent((props) => { - const htmlProps = useToolbarItem(props); - return _3ORBWXWF_createElement("button", htmlProps); -}); -if (false) {} - - - -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/toolbar/toolbar-context/index.js -/** - * External dependencies - */ -// eslint-disable-next-line no-restricted-imports +var ToolbarItem = memo2( + forwardRef2(function ToolbarItem2(props) { + const htmlProps = useToolbarItem(props); + return LMDWO4NN_createElement(BOLVLGVE_TagName, htmlProps); + }) +); + + + +;// ./node_modules/@wordpress/components/build-module/toolbar/toolbar-context/index.js +/** + * External dependencies + */ /** * WordPress dependencies @@ -68161,11 +66507,10 @@ const ToolbarContext = (0,external_wp_element_namespaceObject.createContext)(undefined); /* harmony default export */ const toolbar_context = (ToolbarContext); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/toolbar/toolbar-item/index.js -/** - * External dependencies - */ -// eslint-disable-next-line no-restricted-imports +;// ./node_modules/@wordpress/components/build-module/toolbar/toolbar-item/index.js +/** + * External dependencies + */ /** * WordPress dependencies @@ -68210,6 +66555,7 @@ children: children }); return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ToolbarItem, { + accessibleWhenDisabled: true, ...allProps, store: accessibleToolbarStore, render: render @@ -68217,7 +66563,7 @@ } /* harmony default export */ const toolbar_item = ((0,external_wp_element_namespaceObject.forwardRef)(toolbar_item_ToolbarItem)); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/toolbar/toolbar-button/toolbar-button-container.js +;// ./node_modules/@wordpress/components/build-module/toolbar/toolbar-button/toolbar-button-container.js /** * Internal dependencies @@ -68232,57 +66578,67 @@ }); /* harmony default export */ const toolbar_button_container = (ToolbarButtonContainer); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/toolbar/toolbar-button/index.js -/** - * External dependencies - */ - -/** - * WordPress dependencies - */ - - -/** - * Internal dependencies - */ - - - - - -function UnforwardedToolbarButton({ - children, - className, - containerClassName, - extraProps, - isActive, +;// ./node_modules/@wordpress/components/build-module/toolbar/toolbar-button/index.js +/** + * External dependencies + */ + +/** + * WordPress dependencies + */ + + +/** + * Internal dependencies + */ + + + + + +function toolbar_button_useDeprecatedProps({ isDisabled, - title, - ...props -}, ref) { + ...otherProps +}) { + return { + disabled: isDisabled, + ...otherProps + }; +} +function UnforwardedToolbarButton(props, ref) { + const { + children, + className, + containerClassName, + extraProps, + isActive, + title, + ...restProps + } = toolbar_button_useDeprecatedProps(props); const accessibleToolbarState = (0,external_wp_element_namespaceObject.useContext)(toolbar_context); if (!accessibleToolbarState) { return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(toolbar_button_container, { className: containerClassName, children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, { ref: ref, - icon: props.icon, + icon: restProps.icon, + size: "compact", label: title, - shortcut: props.shortcut, - "data-subscript": props.subscript, + shortcut: restProps.shortcut, + "data-subscript": restProps.subscript, onClick: event => { event.stopPropagation(); - // TODO: Possible bug; maybe use onClick instead of props.onClick. - if (props.onClick) { - props.onClick(event); + // TODO: Possible bug; maybe use onClick instead of restProps.onClick. + if (restProps.onClick) { + restProps.onClick(event); } }, className: dist_clsx('components-toolbar__control', className), isPressed: isActive, - disabled: isDisabled, + accessibleWhenDisabled: true, "data-toolbar-item": true, ...extraProps, - ...props, + ...restProps, children: children }) }); @@ -68294,12 +66650,12 @@ return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(toolbar_item, { className: dist_clsx('components-toolbar-button', className), ...extraProps, - ...props, + ...restProps, ref: ref, children: toolbarItemProps => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_button, { + size: "compact", label: title, isPressed: isActive, - disabled: isDisabled, ...toolbarItemProps, children: children }) @@ -68330,7 +66686,7 @@ const ToolbarButton = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedToolbarButton); /* harmony default export */ const toolbar_button = (ToolbarButton); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/toolbar/toolbar-group/toolbar-group-container.js +;// ./node_modules/@wordpress/components/build-module/toolbar/toolbar-group/toolbar-group-container.js /** * Internal dependencies @@ -68347,7 +66703,7 @@ }); /* harmony default export */ const toolbar_group_container = (ToolbarGroupContainer); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/toolbar/toolbar-group/toolbar-group-collapsed.js +;// ./node_modules/@wordpress/components/build-module/toolbar/toolbar-group/toolbar-group-collapsed.js /** * WordPress dependencies */ @@ -68386,21 +66742,20 @@ } /* harmony default export */ const toolbar_group_collapsed = (ToolbarGroupCollapsed); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/toolbar/toolbar-group/index.js -/** - * External dependencies - */ - - -/** - * WordPress dependencies - */ - - -/** - * Internal dependencies - */ - +;// ./node_modules/@wordpress/components/build-module/toolbar/toolbar-group/index.js +/** + * External dependencies + */ + + +/** + * WordPress dependencies + */ + + +/** + * Internal dependencies + */ @@ -68486,7 +66841,7 @@ } /* harmony default export */ const toolbar_group = (ToolbarGroup); -;// CONCATENATED MODULE: ./node_modules/@ariakit/core/esm/toolbar/toolbar-store.js +;// ./node_modules/@ariakit/core/esm/toolbar/toolbar-store.js "use client"; @@ -68500,7 +66855,7 @@ function createToolbarStore(props = {}) { var _a; const syncState = (_a = props.store) == null ? void 0 : _a.getState(); - return createCompositeStore(_chunks_4R3V3JGP_spreadProps(_chunks_4R3V3JGP_spreadValues({}, props), { + return createCompositeStore(_chunks_3YLGPPWQ_spreadProps(_chunks_3YLGPPWQ_spreadValues({}, props), { orientation: defaultValue( props.orientation, syncState == null ? void 0 : syncState.orientation, @@ -68511,7 +66866,7 @@ } -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/BPNXFCFY.js +;// ./node_modules/@ariakit/react-core/esm/__chunks/7M5THDKH.js "use client"; @@ -68522,13 +66877,13 @@ return useCompositeStoreProps(store, update, props); } function useToolbarStore(props = {}) { - const [store, update] = EKQEJRUF_useStore(createToolbarStore, props); + const [store, update] = YV4JVR4I_useStore(createToolbarStore, props); return useToolbarStoreProps(store, update, props); } -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/toolbar/toolbar.js +;// ./node_modules/@ariakit/react-core/esm/toolbar/toolbar.js "use client"; @@ -68548,8 +66903,9 @@ // src/toolbar/toolbar.tsx +var toolbar_TagName = "div"; var useToolbar = createHook( - (_a) => { + function useToolbar2(_a) { var _b = _a, { store: storeProp, orientation: orientationProp, @@ -68580,26 +66936,24 @@ (element) => /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(ToolbarScopedContextProvider, { value: store, children: element }), [store] ); - props = _4R3V3JGP_spreadValues({ + props = _3YLGPPWQ_spreadValues({ role: "toolbar", "aria-orientation": orientation }, props); - props = useComposite(_4R3V3JGP_spreadValues({ store }, props)); + props = useComposite(_3YLGPPWQ_spreadValues({ store }, props)); return props; } ); -var Toolbar = createComponent((props) => { +var Toolbar = forwardRef2(function Toolbar2(props) { const htmlProps = useToolbar(props); - return _3ORBWXWF_createElement("div", htmlProps); -}); -if (false) {} - - -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/toolbar/toolbar/toolbar-container.js -/** - * External dependencies - */ -// eslint-disable-next-line no-restricted-imports + return LMDWO4NN_createElement(toolbar_TagName, htmlProps); +}); + + +;// ./node_modules/@wordpress/components/build-module/toolbar/toolbar/toolbar-container.js +/** + * External dependencies + */ /** * WordPress dependencies @@ -68637,7 +66991,7 @@ const ToolbarContainer = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedToolbarContainer); /* harmony default export */ const toolbar_container = (ToolbarContainer); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/toolbar/toolbar/index.js +;// ./node_modules/@wordpress/components/build-module/toolbar/toolbar/index.js /** * External dependencies */ @@ -68672,6 +67026,9 @@ }, Dropdown: { variant: 'toolbar' + }, + Menu: { + variant: 'toolbar' } }; }, [isVariantDefined]); @@ -68728,7 +67085,7 @@ const toolbar_Toolbar = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedToolbar); /* harmony default export */ const toolbar = (toolbar_Toolbar); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/toolbar/toolbar-dropdown-menu/index.js +;// ./node_modules/@wordpress/components/build-module/toolbar/toolbar-dropdown-menu/index.js /** * WordPress dependencies */ @@ -68770,7 +67127,7 @@ } /* harmony default export */ const toolbar_dropdown_menu = ((0,external_wp_element_namespaceObject.forwardRef)(ToolbarDropdownMenu)); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/tools-panel/styles.js +;// ./node_modules/@wordpress/components/build-module/tools-panel/styles.js 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)."; } /** @@ -68788,7 +67145,7 @@ const toolsPanelGrid = { columns: columns => /*#__PURE__*/emotion_react_browser_esm_css("grid-template-columns:", `repeat( ${columns}, minmax(0, 1fr) )`, ";" + ( true ? "" : 0), true ? "" : 0), - spacing: /*#__PURE__*/emotion_react_browser_esm_css("column-gap:", space(2), ";row-gap:", space(4), ";" + ( true ? "" : 0), true ? "" : 0), + spacing: /*#__PURE__*/emotion_react_browser_esm_css("column-gap:", space(4), ";row-gap:", space(4), ";" + ( true ? "" : 0), true ? "" : 0), item: { fullWidth: true ? { name: "18iuzk9", @@ -68816,7 +67173,7 @@ name: "1pmxm02", styles: "font-size:inherit;font-weight:500;line-height:normal;&&{margin:0;}" } : 0; -const ToolsPanelItem = /*#__PURE__*/emotion_react_browser_esm_css(toolsPanelGrid.item.fullWidth, "&>div,&>fieldset{padding-bottom:0;margin-bottom:0;max-width:100%;}&& ", base_control_styles_Wrapper, "{margin-bottom:0;", StyledField, ":last-child{margin-bottom:0;}}", StyledHelp, "{margin-bottom:0;}&& ", LabelWrapper, "{label{line-height:1.4em;}}" + ( true ? "" : 0), true ? "" : 0); +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); const ToolsPanelItemPlaceholder = true ? { name: "eivff4", styles: "display:none" @@ -68832,7 +67189,7 @@ }), " text-transform:uppercase;" + ( true ? "" : 0)); 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); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/tools-panel/context.js +;// ./node_modules/@wordpress/components/build-module/tools-panel/context.js /** * WordPress dependencies */ @@ -68860,7 +67217,7 @@ }); const useToolsPanelContext = () => (0,external_wp_element_namespaceObject.useContext)(ToolsPanelContext); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/tools-panel/tools-panel-header/hook.js +;// ./node_modules/@wordpress/components/build-module/tools-panel/tools-panel-header/hook.js /** * WordPress dependencies */ @@ -68910,23 +67267,21 @@ }; } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/tools-panel/tools-panel-header/component.js -/** - * External dependencies - */ - -/** - * WordPress dependencies - */ - - - - -/** - * Internal dependencies - */ - - +;// ./node_modules/@wordpress/components/build-module/tools-panel/tools-panel-header/component.js +/** + * External dependencies + */ + +/** + * WordPress dependencies + */ + + + + +/** + * Internal dependencies + */ @@ -68991,7 +67346,7 @@ // translators: %s: The name of the control being hidden and reset e.g. "Padding". (0,external_wp_i18n_namespaceObject.__)('Hide and reset %s'), label) : (0,external_wp_i18n_namespaceObject.sprintf)( // translators: %s: The name of the control to display e.g. "Padding". - (0,external_wp_i18n_namespaceObject.__)('Show %s'), label); + (0,external_wp_i18n_namespaceObject._x)('Show %s', 'input control'), label); return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(menu_item, { icon: isSelected ? library_check : null, isSelected: isSelected, @@ -69056,7 +67411,7 @@ }, toggleProps: { size: 'small', - describedBy: dropdownMenuDescriptionText + description: dropdownMenuDescriptionText }, children: () => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(menu_group, { @@ -69093,7 +67448,7 @@ const ConnectedToolsPanelHeader = contextConnect(component_ToolsPanelHeader, 'ToolsPanelHeader'); /* harmony default export */ const tools_panel_header_component = (ConnectedToolsPanelHeader); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/tools-panel/tools-panel/hook.js +;// ./node_modules/@wordpress/components/build-module/tools-panel/tools-panel/hook.js /** * WordPress dependencies */ @@ -69106,20 +67461,27 @@ const DEFAULT_COLUMNS = 2; +function emptyMenuItems() { + return { + default: {}, + optional: {} + }; +} +function emptyState() { + return { + panelItems: [], + menuItemOrder: [], + menuItems: emptyMenuItems() + }; +} const generateMenuItems = ({ panelItems, shouldReset, currentMenuItems, menuItemOrder }) => { - const newMenuItems = { - default: {}, - optional: {} - }; - const menuItems = { - default: {}, - optional: {} - }; + const newMenuItems = emptyMenuItems(); + const menuItems = emptyMenuItems(); panelItems.forEach(({ hasValue, isShownByDefault, @@ -69158,7 +67520,128 @@ }); return menuItems; }; -const isMenuItemTypeEmpty = obj => obj && Object.keys(obj).length === 0; +function panelItemsReducer(panelItems, action) { + switch (action.type) { + case 'REGISTER_PANEL': + { + const newItems = [...panelItems]; + // If an item with this label has already been registered, remove it + // first. This can happen when an item is moved between the default + // and optional groups. + const existingIndex = newItems.findIndex(oldItem => oldItem.label === action.item.label); + if (existingIndex !== -1) { + newItems.splice(existingIndex, 1); + } + newItems.push(action.item); + return newItems; + } + case 'UNREGISTER_PANEL': + { + const index = panelItems.findIndex(item => item.label === action.label); + if (index !== -1) { + const newItems = [...panelItems]; + newItems.splice(index, 1); + return newItems; + } + return panelItems; + } + default: + return panelItems; + } +} +function menuItemOrderReducer(menuItemOrder, action) { + switch (action.type) { + case 'REGISTER_PANEL': + { + // Track the initial order of item registration. This is used for + // maintaining menu item order later. + if (menuItemOrder.includes(action.item.label)) { + return menuItemOrder; + } + return [...menuItemOrder, action.item.label]; + } + default: + return menuItemOrder; + } +} +function menuItemsReducer(state, action) { + switch (action.type) { + case 'REGISTER_PANEL': + case 'UNREGISTER_PANEL': + // generate new menu items from original `menuItems` and updated `panelItems` and `menuItemOrder` + return generateMenuItems({ + currentMenuItems: state.menuItems, + panelItems: state.panelItems, + menuItemOrder: state.menuItemOrder, + shouldReset: false + }); + case 'RESET_ALL': + return generateMenuItems({ + panelItems: state.panelItems, + menuItemOrder: state.menuItemOrder, + shouldReset: true + }); + case 'UPDATE_VALUE': + { + const oldValue = state.menuItems[action.group][action.label]; + if (action.value === oldValue) { + return state.menuItems; + } + return { + ...state.menuItems, + [action.group]: { + ...state.menuItems[action.group], + [action.label]: action.value + } + }; + } + case 'TOGGLE_VALUE': + { + const currentItem = state.panelItems.find(item => item.label === action.label); + if (!currentItem) { + return state.menuItems; + } + const menuGroup = currentItem.isShownByDefault ? 'default' : 'optional'; + const newMenuItems = { + ...state.menuItems, + [menuGroup]: { + ...state.menuItems[menuGroup], + [action.label]: !state.menuItems[menuGroup][action.label] + } + }; + return newMenuItems; + } + default: + return state.menuItems; + } +} +function panelReducer(state, action) { + const panelItems = panelItemsReducer(state.panelItems, action); + const menuItemOrder = menuItemOrderReducer(state.menuItemOrder, action); + // `menuItemsReducer` is a bit unusual because it generates new state from original `menuItems` + // and the updated `panelItems` and `menuItemOrder`. + const menuItems = menuItemsReducer({ + panelItems, + menuItemOrder, + menuItems: state.menuItems + }, action); + return { + panelItems, + menuItemOrder, + menuItems + }; +} +function resetAllFiltersReducer(filters, action) { + switch (action.type) { + case 'REGISTER': + return [...filters, action.filter]; + case 'UNREGISTER': + return filters.filter(f => f !== action.filter); + default: + return filters; + } +} +const isMenuItemTypeEmpty = obj => Object.keys(obj).length === 0; function useToolsPanel(props) { const { className, @@ -69171,46 +67654,32 @@ __experimentalLastVisibleItemClass, ...otherProps } = useContextSystem(props, 'ToolsPanel'); - const isResetting = (0,external_wp_element_namespaceObject.useRef)(false); - const wasResetting = isResetting.current; - - // `isResetting` is cleared via this hook to effectively batch together + const isResettingRef = (0,external_wp_element_namespaceObject.useRef)(false); + const wasResetting = isResettingRef.current; + + // `isResettingRef` is cleared via this hook to effectively batch together // the resetAll task. Without this, the flag is cleared after the first // control updates and forces a rerender with subsequent controls then // believing they need to reset, unfortunately using stale data. (0,external_wp_element_namespaceObject.useEffect)(() => { if (wasResetting) { - isResetting.current = false; + isResettingRef.current = false; } }, [wasResetting]); // Allow panel items to register themselves. - const [panelItems, setPanelItems] = (0,external_wp_element_namespaceObject.useState)([]); - const [menuItemOrder, setMenuItemOrder] = (0,external_wp_element_namespaceObject.useState)([]); - const [resetAllFilters, setResetAllFilters] = (0,external_wp_element_namespaceObject.useState)([]); + const [{ + panelItems, + menuItems + }, panelDispatch] = (0,external_wp_element_namespaceObject.useReducer)(panelReducer, undefined, emptyState); + const [resetAllFilters, dispatchResetAllFilters] = (0,external_wp_element_namespaceObject.useReducer)(resetAllFiltersReducer, []); const registerPanelItem = (0,external_wp_element_namespaceObject.useCallback)(item => { // Add item to panel items. - setPanelItems(items => { - const newItems = [...items]; - // If an item with this label has already been registered, remove it - // first. This can happen when an item is moved between the default - // and optional groups. - const existingIndex = newItems.findIndex(oldItem => oldItem.label === item.label); - if (existingIndex !== -1) { - newItems.splice(existingIndex, 1); - } - return [...newItems, item]; - }); - - // Track the initial order of item registration. This is used for - // maintaining menu item order later. - setMenuItemOrder(items => { - if (items.includes(item.label)) { - return items; - } - return [...items, item.label]; - }); - }, [setPanelItems, setMenuItemOrder]); + panelDispatch({ + type: 'REGISTER_PANEL', + item + }); + }, []); // Panels need to deregister on unmount to avoid orphans in menu state. // This is an issue when panel items are being injected via SlotFills. @@ -69219,130 +67688,90 @@ // controls, e.g. both panels have a "padding" control, the // deregistration of the first panel doesn't occur until after the // registration of the next. - setPanelItems(items => { - const newItems = [...items]; - const index = newItems.findIndex(item => item.label === label); - if (index !== -1) { - newItems.splice(index, 1); - } - return newItems; - }); - }, [setPanelItems]); - const registerResetAllFilter = (0,external_wp_element_namespaceObject.useCallback)(newFilter => { - setResetAllFilters(filters => { - return [...filters, newFilter]; - }); - }, [setResetAllFilters]); - const deregisterResetAllFilter = (0,external_wp_element_namespaceObject.useCallback)(filterToRemove => { - setResetAllFilters(filters => { - return filters.filter(filter => filter !== filterToRemove); - }); - }, [setResetAllFilters]); - - // Manage and share display state of menu items representing child controls. - const [menuItems, setMenuItems] = (0,external_wp_element_namespaceObject.useState)({ - default: {}, - optional: {} - }); - - // Setup menuItems state as panel items register themselves. - (0,external_wp_element_namespaceObject.useEffect)(() => { - setMenuItems(prevState => { - const items = generateMenuItems({ - panelItems, - shouldReset: false, - currentMenuItems: prevState, - menuItemOrder - }); - return items; - }); - }, [panelItems, setMenuItems, menuItemOrder]); + panelDispatch({ + type: 'UNREGISTER_PANEL', + label + }); + }, []); + const registerResetAllFilter = (0,external_wp_element_namespaceObject.useCallback)(filter => { + dispatchResetAllFilters({ + type: 'REGISTER', + filter + }); + }, []); + const deregisterResetAllFilter = (0,external_wp_element_namespaceObject.useCallback)(filter => { + dispatchResetAllFilters({ + type: 'UNREGISTER', + filter + }); + }, []); // Updates the status of the panel’s menu items. For default items the // value represents whether it differs from the default and for optional // items whether the item is shown. const flagItemCustomization = (0,external_wp_element_namespaceObject.useCallback)((value, label, group = 'default') => { - setMenuItems(items => { - const newState = { - ...items, - [group]: { - ...items[group], - [label]: value - } - }; - return newState; - }); - }, [setMenuItems]); + panelDispatch({ + type: 'UPDATE_VALUE', + group, + label, + value + }); + }, []); // Whether all optional menu items are hidden or not must be tracked // in order to later determine if the panel display is empty and handle // conditional display of a plus icon to indicate the presence of further // menu items. - const [areAllOptionalControlsHidden, setAreAllOptionalControlsHidden] = (0,external_wp_element_namespaceObject.useState)(false); - (0,external_wp_element_namespaceObject.useEffect)(() => { - if (isMenuItemTypeEmpty(menuItems?.default) && !isMenuItemTypeEmpty(menuItems?.optional)) { - const allControlsHidden = !Object.entries(menuItems.optional).some(([, isSelected]) => isSelected); - setAreAllOptionalControlsHidden(allControlsHidden); - } - }, [menuItems, setAreAllOptionalControlsHidden]); + const areAllOptionalControlsHidden = (0,external_wp_element_namespaceObject.useMemo)(() => { + return isMenuItemTypeEmpty(menuItems.default) && !isMenuItemTypeEmpty(menuItems.optional) && Object.values(menuItems.optional).every(isSelected => !isSelected); + }, [menuItems]); const cx = useCx(); const classes = (0,external_wp_element_namespaceObject.useMemo)(() => { const wrapperStyle = hasInnerWrapper && ToolsPanelWithInnerWrapper(DEFAULT_COLUMNS); - const emptyStyle = isMenuItemTypeEmpty(menuItems?.default) && areAllOptionalControlsHidden && ToolsPanelHiddenInnerWrapper; + const emptyStyle = areAllOptionalControlsHidden && ToolsPanelHiddenInnerWrapper; return cx(ToolsPanel(DEFAULT_COLUMNS), wrapperStyle, emptyStyle, className); - }, [areAllOptionalControlsHidden, className, cx, hasInnerWrapper, menuItems]); + }, [areAllOptionalControlsHidden, className, cx, hasInnerWrapper]); // Toggle the checked state of a menu item which is then used to determine // display of the item within the panel. const toggleItem = (0,external_wp_element_namespaceObject.useCallback)(label => { - const currentItem = panelItems.find(item => item.label === label); - if (!currentItem) { - return; - } - const menuGroup = currentItem.isShownByDefault ? 'default' : 'optional'; - const newMenuItems = { - ...menuItems, - [menuGroup]: { - ...menuItems[menuGroup], - [label]: !menuItems[menuGroup][label] - } - }; - setMenuItems(newMenuItems); - }, [menuItems, panelItems, setMenuItems]); + panelDispatch({ + type: 'TOGGLE_VALUE', + label + }); + }, []); // Resets display of children and executes resetAll callback if available. const resetAllItems = (0,external_wp_element_namespaceObject.useCallback)(() => { if (typeof resetAll === 'function') { - isResetting.current = true; + isResettingRef.current = true; resetAll(resetAllFilters); } // Turn off display of all non-default items. - const resetMenuItems = generateMenuItems({ - panelItems, - menuItemOrder, - shouldReset: true - }); - setMenuItems(resetMenuItems); - }, [panelItems, resetAllFilters, resetAll, setMenuItems, menuItemOrder]); + panelDispatch({ + type: 'RESET_ALL' + }); + }, [resetAllFilters, resetAll]); // Assist ItemGroup styling when there are potentially hidden placeholder // items by identifying first & last items that are toggled on for display. const getFirstVisibleItemLabel = items => { const optionalItems = menuItems.optional || {}; - const firstItem = items.find(item => item.isShownByDefault || !!optionalItems[item.label]); + const firstItem = items.find(item => item.isShownByDefault || optionalItems[item.label]); return firstItem?.label; }; const firstDisplayedItem = getFirstVisibleItemLabel(panelItems); const lastDisplayedItem = getFirstVisibleItemLabel([...panelItems].reverse()); + const hasMenuItems = panelItems.length > 0; const panelContext = (0,external_wp_element_namespaceObject.useMemo)(() => ({ areAllOptionalControlsHidden, deregisterPanelItem, deregisterResetAllFilter, firstDisplayedItem, flagItemCustomization, - hasMenuItems: !!panelItems.length, - isResetting: isResetting.current, + hasMenuItems, + isResetting: isResettingRef.current, lastDisplayedItem, menuItems, panelId, @@ -69351,7 +67780,7 @@ shouldRenderPlaceholderItems, __experimentalFirstVisibleItemClass, __experimentalLastVisibleItemClass - }), [areAllOptionalControlsHidden, deregisterPanelItem, deregisterResetAllFilter, firstDisplayedItem, flagItemCustomization, lastDisplayedItem, menuItems, panelId, panelItems, registerResetAllFilter, registerPanelItem, shouldRenderPlaceholderItems, __experimentalFirstVisibleItemClass, __experimentalLastVisibleItemClass]); + }), [areAllOptionalControlsHidden, deregisterPanelItem, deregisterResetAllFilter, firstDisplayedItem, flagItemCustomization, lastDisplayedItem, menuItems, panelId, hasMenuItems, registerResetAllFilter, registerPanelItem, shouldRenderPlaceholderItems, __experimentalFirstVisibleItemClass, __experimentalLastVisibleItemClass]); return { ...otherProps, headingLevel, @@ -69362,15 +67791,14 @@ }; } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/tools-panel/tools-panel/component.js -/** - * External dependencies - */ - -/** - * Internal dependencies - */ - +;// ./node_modules/@wordpress/components/build-module/tools-panel/tools-panel/component.js +/** + * External dependencies + */ + +/** + * Internal dependencies + */ @@ -69435,6 +67863,7 @@ * onDeselect={ () => setHeight() } * > * setWidth() } * > * (0,external_wp_element_namespaceObject.useContext)(RovingTabIndexContext); const RovingTabIndexProvider = RovingTabIndexContext.Provider; -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/tree-grid/roving-tab-index.js +;// ./node_modules/@wordpress/components/build-module/tree-grid/roving-tab-index.js /** * WordPress dependencies */ @@ -69677,7 +68105,7 @@ }); } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/tree-grid/index.js +;// ./node_modules/@wordpress/components/build-module/tree-grid/index.js /** * WordPress dependencies */ @@ -69997,7 +68425,7 @@ -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/tree-grid/row.js +;// ./node_modules/@wordpress/components/build-module/tree-grid/row.js /** * WordPress dependencies */ @@ -70037,7 +68465,7 @@ const TreeGridRow = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedTreeGridRow); /* harmony default export */ const tree_grid_row = (TreeGridRow); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/tree-grid/roving-tab-index-item.js +;// ./node_modules/@wordpress/components/build-module/tree-grid/roving-tab-index-item.js /** * WordPress dependencies */ @@ -70089,7 +68517,7 @@ }); /* harmony default export */ const roving_tab_index_item = (RovingTabIndexItem); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/tree-grid/item.js +;// ./node_modules/@wordpress/components/build-module/tree-grid/item.js /** * WordPress dependencies */ @@ -70121,16 +68549,15 @@ const TreeGridItem = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedTreeGridItem); /* harmony default export */ const tree_grid_item = (TreeGridItem); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/tree-grid/cell.js -/** - * WordPress dependencies - */ - - -/** - * Internal dependencies - */ - +;// ./node_modules/@wordpress/components/build-module/tree-grid/cell.js +/** + * WordPress dependencies + */ + + +/** + * Internal dependencies + */ function UnforwardedTreeGridCell({ @@ -70142,7 +68569,10 @@ ...props, role: "gridcell", children: withoutGridItem ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_ReactJSXRuntime_namespaceObject.Fragment, { - children: children + children: typeof children === 'function' ? children({ + ...props, + ref + }) : children }) : /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(tree_grid_item, { ref: ref, children: children @@ -70160,7 +68590,7 @@ const TreeGridCell = (0,external_wp_element_namespaceObject.forwardRef)(UnforwardedTreeGridCell); /* harmony default export */ const cell = (TreeGridCell); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/isolated-event-container/index.js +;// ./node_modules/@wordpress/components/build-module/isolated-event-container/index.js /** * External dependencies */ @@ -70191,7 +68621,7 @@ }); /* harmony default export */ const isolated_event_container = (IsolatedEventContainer); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/slot-fill/bubbles-virtually/use-slot-fills.js +;// ./node_modules/@wordpress/components/build-module/slot-fill/bubbles-virtually/use-slot-fills.js /** * WordPress dependencies */ @@ -70207,7 +68637,7 @@ return (0,external_wp_compose_namespaceObject.useObservableValue)(registry.fills, name); } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/z-stack/styles.js +;// ./node_modules/@wordpress/components/build-module/z-stack/styles.js 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)."; } /** @@ -70236,7 +68666,7 @@ }) => isLayered ? // When `isLayered` is true, all items overlap in the same grid cell z_stack_styles_ref : undefined, ";}" + ( true ? "" : 0)); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/z-stack/component.js +;// ./node_modules/@wordpress/components/build-module/z-stack/component.js /** * External dependencies */ @@ -70305,7 +68735,7 @@ const ZStack = contextConnect(UnconnectedZStack, 'ZStack'); /* harmony default export */ const z_stack_component = (ZStack); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/higher-order/navigate-regions/index.js +;// ./node_modules/@wordpress/components/build-module/higher-order/navigate-regions/index.js /** * WordPress dependencies */ @@ -70422,7 +68852,7 @@ }) }), 'navigateRegions')); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/higher-order/with-constrained-tabbing/index.js +;// ./node_modules/@wordpress/components/build-module/higher-order/with-constrained-tabbing/index.js /** * WordPress dependencies */ @@ -70449,16 +68879,15 @@ }, 'withConstrainedTabbing'); /* harmony default export */ const with_constrained_tabbing = (withConstrainedTabbing); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/higher-order/with-fallback-styles/index.js -/** - * External dependencies - */ - - -/** - * WordPress dependencies - */ - +;// ./node_modules/@wordpress/components/build-module/higher-order/with-fallback-styles/index.js +/** + * External dependencies + */ + + +/** + * WordPress dependencies + */ @@ -70513,9 +68942,9 @@ }; }, 'withFallbackStyles')); -;// CONCATENATED MODULE: external ["wp","hooks"] +;// external ["wp","hooks"] const external_wp_hooks_namespaceObject = window["wp"]["hooks"]; -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/higher-order/with-filters/index.js +;// ./node_modules/@wordpress/components/build-module/higher-order/with-filters/index.js /** * WordPress dependencies */ @@ -70645,7 +69074,7 @@ }, 'withFilters'); } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/higher-order/with-focus-return/index.js +;// ./node_modules/@wordpress/components/build-module/higher-order/with-focus-return/index.js /** * WordPress dependencies */ @@ -70676,7 +69105,7 @@ * describing the component and the * focus return characteristics. * - * @return Higher Order Component with the focus restauration behaviour. + * @return Higher Order Component with the focus restoration behaviour. */ /* harmony default export */ const with_focus_return = ((0,external_wp_compose_namespaceObject.createHigherOrderComponent)( // @ts-expect-error TODO: Reconcile with intended `createHigherOrderComponent` types @@ -70711,7 +69140,7 @@ return children; }; -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/higher-order/with-notices/index.js +;// ./node_modules/@wordpress/components/build-module/higher-order/with-notices/index.js /** * External dependencies */ @@ -70815,24 +69244,24 @@ return Component; }, 'withNotices')); -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/YGMEBI3A.js -"use client"; - - - - - -// src/menu/menu-context.ts - -var YGMEBI3A_menu = createStoreContext( +;// ./node_modules/@ariakit/react-core/esm/__chunks/B2J376ND.js +"use client"; + + + + + +// src/menu/menu-context.tsx + +var B2J376ND_menu = createStoreContext( [CompositeContextProvider, HovercardContextProvider], [CompositeScopedContextProvider, HovercardScopedContextProvider] ); -var useMenuContext = YGMEBI3A_menu.useContext; -var useMenuScopedContext = YGMEBI3A_menu.useScopedContext; -var useMenuProviderContext = YGMEBI3A_menu.useProviderContext; -var MenuContextProvider = YGMEBI3A_menu.ContextProvider; -var MenuScopedContextProvider = YGMEBI3A_menu.ScopedContextProvider; +var useMenuContext = B2J376ND_menu.useContext; +var useMenuScopedContext = B2J376ND_menu.useScopedContext; +var useMenuProviderContext = B2J376ND_menu.useProviderContext; +var MenuContextProvider = B2J376ND_menu.ContextProvider; +var MenuScopedContextProvider = B2J376ND_menu.ScopedContextProvider; var useMenuBarContext = (/* unused pure expression or super */ null && (useMenubarContext)); var useMenuBarScopedContext = (/* unused pure expression or super */ null && (useMenubarScopedContext)); var useMenuBarProviderContext = (/* unused pure expression or super */ null && (useMenubarProviderContext)); @@ -70844,157 +69273,29 @@ -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/6XBVQI3K.js -"use client"; - -// src/checkbox/checkbox-checked-context.ts - -var CheckboxCheckedContext = (0,external_React_.createContext)(false); - - - -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/MW2F7SEA.js -"use client"; - - - - -// src/checkbox/checkbox-check.tsx - - -var checkmark = /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)( - "svg", - { - display: "block", - fill: "none", - stroke: "currentColor", - strokeLinecap: "round", - strokeLinejoin: "round", - strokeWidth: "1.5pt", - viewBox: "0 0 16 16", - height: "1em", - width: "1em", - children: /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)("polyline", { points: "4,8 7,12 12,4" }) - } -); -function getChildren(props) { - if (props.checked) { - return props.children || checkmark; - } - if (typeof props.children === "function") { - return props.children; - } - return null; -} -var useCheckboxCheck = createHook( - (_a) => { - var _b = _a, { store, checked } = _b, props = __objRest(_b, ["store", "checked"]); - const context = (0,external_React_.useContext)(CheckboxCheckedContext); - checked = checked != null ? checked : context; - const children = getChildren({ checked, children: props.children }); - props = _4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues({ - "aria-hidden": true - }, props), { - children, - style: _4R3V3JGP_spreadValues({ - width: "1em", - height: "1em", - pointerEvents: "none" - }, props.style) - }); - return props; - } -); -var CheckboxCheck = createComponent((props) => { - const htmlProps = useCheckboxCheck(props); - return _3ORBWXWF_createElement("span", htmlProps); -}); -if (false) {} - - - -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/menu/menu-item-check.js -"use client"; - - - - - - - - - - - - - - - -// src/menu/menu-item-check.ts - -var useMenuItemCheck = createHook( - (_a) => { - var _b = _a, { store, checked } = _b, props = __objRest(_b, ["store", "checked"]); - const context = (0,external_React_.useContext)(MenuItemCheckedContext); - checked = checked != null ? checked : context; - props = useCheckboxCheck(_4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues({}, props), { checked })); - return props; - } -); -var MenuItemCheck = createComponent((props) => { - const htmlProps = useMenuItemCheck(props); - return _3ORBWXWF_createElement("span", htmlProps); -}); -if (false) {} - - -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/KA4GX64Z.js -"use client"; - - - -// src/menubar/menubar-context.ts +;// ./node_modules/@ariakit/react-core/esm/__chunks/62UHHO2X.js +"use client"; + + + +// src/menubar/menubar-context.tsx var menubar = createStoreContext( [CompositeContextProvider], [CompositeScopedContextProvider] ); -var KA4GX64Z_useMenubarContext = menubar.useContext; -var KA4GX64Z_useMenubarScopedContext = menubar.useScopedContext; -var KA4GX64Z_useMenubarProviderContext = menubar.useProviderContext; -var KA4GX64Z_MenubarContextProvider = menubar.ContextProvider; -var KA4GX64Z_MenubarScopedContextProvider = menubar.ScopedContextProvider; -var KA4GX64Z_MenuItemCheckedContext = (0,external_React_.createContext)( +var _62UHHO2X_useMenubarContext = menubar.useContext; +var _62UHHO2X_useMenubarScopedContext = menubar.useScopedContext; +var _62UHHO2X_useMenubarProviderContext = menubar.useProviderContext; +var _62UHHO2X_MenubarContextProvider = menubar.ContextProvider; +var _62UHHO2X_MenubarScopedContextProvider = menubar.ScopedContextProvider; +var _62UHHO2X_MenuItemCheckedContext = (0,external_React_.createContext)( void 0 ); -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/W76OTZCC.js -"use client"; - - - - -// src/combobox/combobox-context.tsx - -var W76OTZCC_ctx = createStoreContext( - [PopoverContextProvider, CompositeContextProvider], - [PopoverScopedContextProvider, CompositeScopedContextProvider] -); -var useComboboxContext = W76OTZCC_ctx.useContext; -var useComboboxScopedContext = W76OTZCC_ctx.useScopedContext; -var useComboboxProviderContext = W76OTZCC_ctx.useProviderContext; -var ComboboxContextProvider = W76OTZCC_ctx.ContextProvider; -var ComboboxScopedContextProvider = W76OTZCC_ctx.ScopedContextProvider; -var ComboboxItemValueContext = (0,external_React_.createContext)( - void 0 -); -var ComboboxItemCheckedContext = (0,external_React_.createContext)(false); - - - -;// CONCATENATED MODULE: ./node_modules/@ariakit/core/esm/menu/menu-store.js +;// ./node_modules/@ariakit/core/esm/menu/menu-store.js "use client"; @@ -71014,7 +69315,7 @@ combobox, parent, menubar - } = _b, props = _4R3V3JGP_objRest(_b, [ + } = _b, props = _3YLGPPWQ_objRest(_b, [ "combobox", "parent", "menubar" @@ -71033,7 +69334,7 @@ ); throwOnConflictingProps(props, store); const syncState = store.getState(); - const composite = createCompositeStore(_chunks_4R3V3JGP_spreadProps(_chunks_4R3V3JGP_spreadValues({}, props), { + const composite = createCompositeStore(_chunks_3YLGPPWQ_spreadProps(_chunks_3YLGPPWQ_spreadValues({}, props), { store, orientation: defaultValue( props.orientation, @@ -71041,7 +69342,7 @@ "vertical" ) })); - const hovercard = createHovercardStore(_chunks_4R3V3JGP_spreadProps(_chunks_4R3V3JGP_spreadValues({}, props), { + const hovercard = createHovercardStore(_chunks_3YLGPPWQ_spreadProps(_chunks_3YLGPPWQ_spreadValues({}, props), { store, placement: defaultValue( props.placement, @@ -71055,7 +69356,7 @@ ), hideTimeout: defaultValue(props.hideTimeout, syncState.hideTimeout, 0) })); - const initialState = _chunks_4R3V3JGP_spreadProps(_chunks_4R3V3JGP_spreadValues(_chunks_4R3V3JGP_spreadValues({}, composite.getState()), hovercard.getState()), { + const initialState = _chunks_3YLGPPWQ_spreadProps(_chunks_3YLGPPWQ_spreadValues(_chunks_3YLGPPWQ_spreadValues({}, composite.getState()), hovercard.getState()), { initialFocus: defaultValue(syncState.initialFocus, "container"), values: defaultValue( props.values, @@ -71068,8 +69369,7 @@ setup( menu, () => sync(menu, ["mounted"], (state) => { - if (state.mounted) - return; + if (state.mounted) return; menu.setState("activeId", null); }) ); @@ -71082,7 +69382,7 @@ ); }) ); - return _chunks_4R3V3JGP_spreadProps(_chunks_4R3V3JGP_spreadValues(_chunks_4R3V3JGP_spreadValues(_chunks_4R3V3JGP_spreadValues({}, composite), hovercard), menu), { + return _chunks_3YLGPPWQ_spreadProps(_chunks_3YLGPPWQ_spreadValues(_chunks_3YLGPPWQ_spreadValues(_chunks_3YLGPPWQ_spreadValues({}, composite), hovercard), menu), { combobox, parent, menubar, @@ -71093,18 +69393,14 @@ setInitialFocus: (value) => menu.setState("initialFocus", value), setValues: (values) => menu.setState("values", values), setValue: (name, value) => { - if (name === "__proto__") - return; - if (name === "constructor") - return; - if (Array.isArray(name)) - return; + if (name === "__proto__") return; + if (name === "constructor") return; + if (Array.isArray(name)) return; menu.setState("values", (values) => { const prevValue = values[name]; - const nextValue = Y3OOHFCN_applyState(value, prevValue); - if (nextValue === prevValue) - return values; - return _chunks_4R3V3JGP_spreadProps(_chunks_4R3V3JGP_spreadValues({}, values), { + const nextValue = applyState(value, prevValue); + if (nextValue === prevValue) return values; + return _chunks_3YLGPPWQ_spreadProps(_chunks_3YLGPPWQ_spreadValues({}, values), { [name]: nextValue !== void 0 && nextValue }); }); @@ -71113,7 +69409,7 @@ } -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/XJXP7ZSQ.js +;// ./node_modules/@ariakit/react-core/esm/__chunks/MRTXKBQF.js "use client"; @@ -71128,368 +69424,1177 @@ function useMenuStoreProps(store, update, props) { useUpdateEffect(update, [props.combobox, props.parent, props.menubar]); - store = useCompositeStoreProps(store, update, props); - store = useHovercardStoreProps(store, update, props); useStoreProps(store, props, "values", "setValues"); - return Object.assign(store, { - combobox: props.combobox, - parent: props.parent, - menubar: props.menubar - }); + return Object.assign( + useHovercardStoreProps( + useCompositeStoreProps(store, update, props), + update, + props + ), + { + combobox: props.combobox, + parent: props.parent, + menubar: props.menubar + } + ); } function useMenuStore(props = {}) { const parent = useMenuContext(); - const menubar = KA4GX64Z_useMenubarContext(); + const menubar = _62UHHO2X_useMenubarContext(); const combobox = useComboboxProviderContext(); - props = _4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues({}, props), { + props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, props), { parent: props.parent !== void 0 ? props.parent : parent, menubar: props.menubar !== void 0 ? props.menubar : menubar, combobox: props.combobox !== void 0 ? props.combobox : combobox }); - const [store, update] = EKQEJRUF_useStore(createMenuStore, props); + const [store, update] = YV4JVR4I_useStore(createMenuStore, props); return useMenuStoreProps(store, update, props); } -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/VDNZBO4W.js -"use client"; - - - - - -// src/button/button.ts - - -var useButton = createHook((props) => { - const ref = (0,external_React_.useRef)(null); - const tagName = useTagName(ref, props.as || "button"); - const [isNativeButton, setIsNativeButton] = (0,external_React_.useState)( - () => !!tagName && isButton({ tagName, type: props.type }) - ); - (0,external_React_.useEffect)(() => { - if (!ref.current) - return; - setIsNativeButton(isButton(ref.current)); - }, []); - props = _4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues({ - role: !isNativeButton && tagName !== "a" ? "button" : void 0 - }, props), { - ref: useMergeRefs(ref, props.ref) - }); - props = useCommand(props); - return props; -}); -var VDNZBO4W_Button = createComponent((props) => { - const htmlProps = useButton(props); - return _3ORBWXWF_createElement("button", htmlProps); -}); -if (false) {} - - - -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/BHEJ6NUH.js -"use client"; - - - - - - -// src/disclosure/disclosure.ts - - -var BHEJ6NUH_symbol = Symbol("disclosure"); -var useDisclosure = createHook( - (_a) => { - var _b = _a, { store, toggleOnClick = true } = _b, props = __objRest(_b, ["store", "toggleOnClick"]); - const context = useDisclosureProviderContext(); - store = store || context; - invariant( +;// ./node_modules/@wordpress/components/build-module/menu/context.js +/** + * WordPress dependencies + */ + + +/** + * Internal dependencies + */ + +const context_Context = (0,external_wp_element_namespaceObject.createContext)(undefined); + +;// ./node_modules/@ariakit/react-core/esm/__chunks/MVIULMNR.js +"use client"; + + + + + + + + + +// src/menu/menu-item.tsx + + + + +var MVIULMNR_TagName = "div"; +function menuHasFocus(baseElement, items, currentTarget) { + var _a; + if (!baseElement) return false; + if (hasFocusWithin(baseElement)) return true; + const expandedItem = items == null ? void 0 : items.find((item) => { + var _a2; + if (item.element === currentTarget) return false; + return ((_a2 = item.element) == null ? void 0 : _a2.getAttribute("aria-expanded")) === "true"; + }); + const expandedMenuId = (_a = expandedItem == null ? void 0 : expandedItem.element) == null ? void 0 : _a.getAttribute("aria-controls"); + if (!expandedMenuId) return false; + const doc = getDocument(baseElement); + const expandedMenu = doc.getElementById(expandedMenuId); + if (!expandedMenu) return false; + if (hasFocusWithin(expandedMenu)) return true; + return !!expandedMenu.querySelector("[role=menuitem][aria-expanded=true]"); +} +var useMenuItem = createHook( + function useMenuItem2(_a) { + var _b = _a, { store, - false && 0 - ); - const ref = (0,external_React_.useRef)(null); - const [expanded, setExpanded] = (0,external_React_.useState)(false); - const disclosureElement = store.useState("disclosureElement"); - const open = store.useState("open"); - (0,external_React_.useEffect)(() => { - let isCurrentDisclosure = disclosureElement === ref.current; - if (!(disclosureElement == null ? void 0 : disclosureElement.isConnected)) { - store == null ? void 0 : store.setDisclosureElement(ref.current); - isCurrentDisclosure = true; - } - setExpanded(open && isCurrentDisclosure); - }, [disclosureElement, store, open]); - const onClickProp = props.onClick; - const toggleOnClickProp = useBooleanEvent(toggleOnClick); - const [isDuplicate, metadataProps] = useMetadataProps(props, BHEJ6NUH_symbol, true); - const onClick = useEvent((event) => { - onClickProp == null ? void 0 : onClickProp(event); - if (event.defaultPrevented) - return; - if (isDuplicate) - return; - if (!toggleOnClickProp(event)) - return; - store == null ? void 0 : store.setDisclosureElement(event.currentTarget); - store == null ? void 0 : store.toggle(); - }); - const contentElement = store.useState("contentElement"); - props = _4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues(_4R3V3JGP_spreadValues({ - "aria-expanded": expanded, - "aria-controls": contentElement == null ? void 0 : contentElement.id - }, metadataProps), props), { - ref: useMergeRefs(ref, props.ref), - onClick - }); - props = useButton(props); - return props; - } -); -var Disclosure = createComponent((props) => { - const htmlProps = useDisclosure(props); - return _3ORBWXWF_createElement("button", htmlProps); -}); -if (false) {} - - - -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/H3TG2CZP.js -"use client"; - - - - - -// src/dialog/dialog-disclosure.ts - - -var useDialogDisclosure = createHook( - (_a) => { - var _b = _a, { store } = _b, props = __objRest(_b, ["store"]); - const context = useDialogProviderContext(); - store = store || context; - invariant( - store, - false && 0 - ); - const contentElement = store.useState("contentElement"); - props = _4R3V3JGP_spreadValues({ - "aria-haspopup": getPopupRole(contentElement, "dialog") - }, props); - props = useDisclosure(_4R3V3JGP_spreadValues({ store }, props)); - return props; - } -); -var DialogDisclosure = createComponent( - (props) => { - const htmlProps = useDialogDisclosure(props); - return _3ORBWXWF_createElement("button", htmlProps); - } -); -if (false) {} - - - -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/JCH6MLL2.js -"use client"; - - - - - -// src/popover/popover-anchor.ts -var usePopoverAnchor = createHook( - (_a) => { - var _b = _a, { store } = _b, props = __objRest(_b, ["store"]); - const context = usePopoverProviderContext(); - store = store || context; - props = _4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues({}, props), { - ref: useMergeRefs(store == null ? void 0 : store.setAnchorElement, props.ref) - }); - return props; - } -); -var PopoverAnchor = createComponent((props) => { - const htmlProps = usePopoverAnchor(props); - return _3ORBWXWF_createElement("div", htmlProps); -}); -if (false) {} - - - -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/4ZEZYKUR.js -"use client"; - - - - - - - -// src/popover/popover-disclosure.tsx - - -var usePopoverDisclosure = createHook( - (_a) => { - var _b = _a, { store } = _b, props = __objRest(_b, ["store"]); - const context = usePopoverProviderContext(); - store = store || context; + hideOnClick = true, + preventScrollOnKeyDown = true, + focusOnHover, + blurOnHoverEnd + } = _b, props = __objRest(_b, [ + "store", + "hideOnClick", + "preventScrollOnKeyDown", + "focusOnHover", + "blurOnHoverEnd" + ]); + const menuContext = useMenuScopedContext(true); + const menubarContext = _62UHHO2X_useMenubarScopedContext(); + store = store || menuContext || menubarContext; invariant( store, false && 0 ); const onClickProp = props.onClick; + const hideOnClickProp = useBooleanEvent(hideOnClick); + const hideMenu = "hideAll" in store ? store.hideAll : void 0; + const isWithinMenu = !!hideMenu; const onClick = useEvent((event) => { - store == null ? void 0 : store.setAnchorElement(event.currentTarget); onClickProp == null ? void 0 : onClickProp(event); + if (event.defaultPrevented) return; + if (isDownloading(event)) return; + if (isOpeningInNewTab(event)) return; + if (!hideMenu) return; + const popupType = event.currentTarget.getAttribute("aria-haspopup"); + if (popupType === "menu") return; + if (!hideOnClickProp(event)) return; + hideMenu(); + }); + const contentElement = useStoreState( + store, + (state) => "contentElement" in state ? state.contentElement : null + ); + const role = getPopupItemRole(contentElement, "menuitem"); + props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({ + role + }, props), { + onClick + }); + props = useCompositeItem(_3YLGPPWQ_spreadValues({ + store, + preventScrollOnKeyDown + }, props)); + props = useCompositeHover(_3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({ + store + }, props), { + focusOnHover(event) { + const getFocusOnHover = () => { + if (typeof focusOnHover === "function") return focusOnHover(event); + if (focusOnHover != null) return focusOnHover; + return true; + }; + if (!store) return false; + if (!getFocusOnHover()) return false; + const { baseElement, items } = store.getState(); + if (isWithinMenu) { + if (event.currentTarget.hasAttribute("aria-expanded")) { + event.currentTarget.focus(); + } + return true; + } + if (menuHasFocus(baseElement, items, event.currentTarget)) { + event.currentTarget.focus(); + return true; + } + return false; + }, + blurOnHoverEnd(event) { + if (typeof blurOnHoverEnd === "function") return blurOnHoverEnd(event); + if (blurOnHoverEnd != null) return blurOnHoverEnd; + return isWithinMenu; + } + })); + return props; + } +); +var MVIULMNR_MenuItem = memo2( + forwardRef2(function MenuItem2(props) { + const htmlProps = useMenuItem(props); + return LMDWO4NN_createElement(MVIULMNR_TagName, htmlProps); + }) +); + + + +;// ./node_modules/@ariakit/react-core/esm/__chunks/RNCDFVMF.js +"use client"; + + +// src/checkbox/checkbox-context.tsx +var RNCDFVMF_ctx = createStoreContext(); +var useCheckboxContext = RNCDFVMF_ctx.useContext; +var useCheckboxScopedContext = RNCDFVMF_ctx.useScopedContext; +var useCheckboxProviderContext = RNCDFVMF_ctx.useProviderContext; +var CheckboxContextProvider = RNCDFVMF_ctx.ContextProvider; +var CheckboxScopedContextProvider = RNCDFVMF_ctx.ScopedContextProvider; + + + +;// ./node_modules/@ariakit/react-core/esm/__chunks/ASMQKSDT.js +"use client"; + + + + + + + + +// src/checkbox/checkbox.tsx + + + +var ASMQKSDT_TagName = "input"; +function setMixed(element, mixed) { + if (mixed) { + element.indeterminate = true; + } else if (element.indeterminate) { + element.indeterminate = false; + } +} +function isNativeCheckbox(tagName, type) { + return tagName === "input" && (!type || type === "checkbox"); +} +function getPrimitiveValue(value) { + if (Array.isArray(value)) { + return value.toString(); + } + return value; +} +var useCheckbox = createHook( + function useCheckbox2(_a) { + var _b = _a, { + store, + name, + value: valueProp, + checked: checkedProp, + defaultChecked + } = _b, props = __objRest(_b, [ + "store", + "name", + "value", + "checked", + "defaultChecked" + ]); + const context = useCheckboxContext(); + store = store || context; + const [_checked, setChecked] = (0,external_React_.useState)(defaultChecked != null ? defaultChecked : false); + const checked = useStoreState(store, (state) => { + if (checkedProp !== void 0) return checkedProp; + if ((state == null ? void 0 : state.value) === void 0) return _checked; + if (valueProp != null) { + if (Array.isArray(state.value)) { + const primitiveValue = getPrimitiveValue(valueProp); + return state.value.includes(primitiveValue); + } + return state.value === valueProp; + } + if (Array.isArray(state.value)) return false; + if (typeof state.value === "boolean") return state.value; + return false; + }); + const ref = (0,external_React_.useRef)(null); + const tagName = useTagName(ref, ASMQKSDT_TagName); + const nativeCheckbox = isNativeCheckbox(tagName, props.type); + const mixed = checked ? checked === "mixed" : void 0; + const isChecked = checked === "mixed" ? false : checked; + const disabled = disabledFromProps(props); + const [propertyUpdated, schedulePropertyUpdate] = useForceUpdate(); + (0,external_React_.useEffect)(() => { + const element = ref.current; + if (!element) return; + setMixed(element, mixed); + if (nativeCheckbox) return; + element.checked = isChecked; + if (name !== void 0) { + element.name = name; + } + if (valueProp !== void 0) { + element.value = `${valueProp}`; + } + }, [propertyUpdated, mixed, nativeCheckbox, isChecked, name, valueProp]); + const onChangeProp = props.onChange; + const onChange = useEvent((event) => { + if (disabled) { + event.stopPropagation(); + event.preventDefault(); + return; + } + setMixed(event.currentTarget, mixed); + if (!nativeCheckbox) { + event.currentTarget.checked = !event.currentTarget.checked; + schedulePropertyUpdate(); + } + onChangeProp == null ? void 0 : onChangeProp(event); + if (event.defaultPrevented) return; + const elementChecked = event.currentTarget.checked; + setChecked(elementChecked); + store == null ? void 0 : store.setValue((prevValue) => { + if (valueProp == null) return elementChecked; + const primitiveValue = getPrimitiveValue(valueProp); + if (!Array.isArray(prevValue)) { + return prevValue === primitiveValue ? false : primitiveValue; + } + if (elementChecked) { + if (prevValue.includes(primitiveValue)) { + return prevValue; + } + return [...prevValue, primitiveValue]; + } + return prevValue.filter((v) => v !== primitiveValue); + }); + }); + const onClickProp = props.onClick; + const onClick = useEvent((event) => { + onClickProp == null ? void 0 : onClickProp(event); + if (event.defaultPrevented) return; + if (nativeCheckbox) return; + onChange(event); }); props = useWrapElement( props, - (element) => /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(PopoverScopedContextProvider, { value: store, children: element }), - [store] - ); - props = _4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues({}, props), { + (element) => /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(CheckboxCheckedContext.Provider, { value: isChecked, children: element }), + [isChecked] + ); + props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({ + role: !nativeCheckbox ? "checkbox" : void 0, + type: nativeCheckbox ? "checkbox" : void 0, + "aria-checked": checked + }, props), { + ref: useMergeRefs(ref, props.ref), + onChange, onClick }); - props = usePopoverAnchor(_4R3V3JGP_spreadValues({ store }, props)); - props = useDialogDisclosure(_4R3V3JGP_spreadValues({ store }, props)); + props = useCommand(_3YLGPPWQ_spreadValues({ clickOnEnter: !nativeCheckbox }, props)); + return removeUndefinedValues(_3YLGPPWQ_spreadValues({ + name: nativeCheckbox ? name : void 0, + value: nativeCheckbox ? valueProp : void 0, + checked: isChecked + }, props)); + } +); +var Checkbox = forwardRef2(function Checkbox2(props) { + const htmlProps = useCheckbox(props); + return LMDWO4NN_createElement(ASMQKSDT_TagName, htmlProps); +}); + + + +;// ./node_modules/@ariakit/core/esm/checkbox/checkbox-store.js +"use client"; + + + + +// src/checkbox/checkbox-store.ts +function createCheckboxStore(props = {}) { + var _a; + throwOnConflictingProps(props, props.store); + const syncState = (_a = props.store) == null ? void 0 : _a.getState(); + const initialState = { + value: defaultValue( + props.value, + syncState == null ? void 0 : syncState.value, + props.defaultValue, + false + ) + }; + const checkbox = createStore(initialState, props.store); + return _chunks_3YLGPPWQ_spreadProps(_chunks_3YLGPPWQ_spreadValues({}, checkbox), { + setValue: (value) => checkbox.setState("value", value) + }); +} + + +;// ./node_modules/@ariakit/react-core/esm/__chunks/HAVBGUA3.js +"use client"; + + + +// src/checkbox/checkbox-store.ts + +function useCheckboxStoreProps(store, update, props) { + useUpdateEffect(update, [props.store]); + useStoreProps(store, props, "value", "setValue"); + return store; +} +function useCheckboxStore(props = {}) { + const [store, update] = YV4JVR4I_useStore(createCheckboxStore, props); + return useCheckboxStoreProps(store, update, props); +} + + + +;// ./node_modules/@ariakit/react-core/esm/menu/menu-item-checkbox.js +"use client"; + + + + + + + + + + + + + + + + + + + + + + + + + + +// src/menu/menu-item-checkbox.tsx + + +var menu_item_checkbox_TagName = "div"; +function menu_item_checkbox_getPrimitiveValue(value) { + if (Array.isArray(value)) { + return value.toString(); + } + return value; +} +function getValue(storeValue, value, checked) { + if (value === void 0) { + if (Array.isArray(storeValue)) return storeValue; + return !!checked; + } + const primitiveValue = menu_item_checkbox_getPrimitiveValue(value); + if (!Array.isArray(storeValue)) { + if (checked) { + return primitiveValue; + } + return storeValue === primitiveValue ? false : storeValue; + } + if (checked) { + if (storeValue.includes(primitiveValue)) { + return storeValue; + } + return [...storeValue, primitiveValue]; + } + return storeValue.filter((v) => v !== primitiveValue); +} +var useMenuItemCheckbox = createHook( + function useMenuItemCheckbox2(_a) { + var _b = _a, { + store, + name, + value, + checked, + defaultChecked: defaultCheckedProp, + hideOnClick = false + } = _b, props = __objRest(_b, [ + "store", + "name", + "value", + "checked", + "defaultChecked", + "hideOnClick" + ]); + const context = useMenuScopedContext(); + store = store || context; + invariant( + store, + false && 0 + ); + const defaultChecked = useInitialValue(defaultCheckedProp); + (0,external_React_.useEffect)(() => { + store == null ? void 0 : store.setValue(name, (prevValue = []) => { + if (!defaultChecked) return prevValue; + return getValue(prevValue, value, true); + }); + }, [store, name, value, defaultChecked]); + (0,external_React_.useEffect)(() => { + if (checked === void 0) return; + store == null ? void 0 : store.setValue(name, (prevValue) => { + return getValue(prevValue, value, checked); + }); + }, [store, name, value, checked]); + const checkboxStore = useCheckboxStore({ + value: store.useState((state) => state.values[name]), + setValue(internalValue) { + store == null ? void 0 : store.setValue(name, () => { + if (checked === void 0) return internalValue; + const nextValue = getValue(internalValue, value, checked); + if (!Array.isArray(nextValue)) return nextValue; + if (!Array.isArray(internalValue)) return nextValue; + if (shallowEqual(internalValue, nextValue)) return internalValue; + return nextValue; + }); + } + }); + props = _3YLGPPWQ_spreadValues({ + role: "menuitemcheckbox" + }, props); + props = useCheckbox(_3YLGPPWQ_spreadValues({ + store: checkboxStore, + name, + value, + checked + }, props)); + props = useMenuItem(_3YLGPPWQ_spreadValues({ store, hideOnClick }, props)); return props; } ); -var PopoverDisclosure = createComponent( - (props) => { - const htmlProps = usePopoverDisclosure(props); - return _3ORBWXWF_createElement("button", htmlProps); - } -); -if (false) {} - - - -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/346FK57L.js -"use client"; - - - - - - -// src/composite/composite-typeahead.ts - - - - -var chars = ""; -function clearChars() { - chars = ""; -} -function isValidTypeaheadEvent(event) { - const target = event.target; - if (target && DLOEKDPY_isTextField(target)) - return false; - if (event.key === " " && chars.length) - return true; - return event.key.length === 1 && !event.ctrlKey && !event.altKey && !event.metaKey && /^[\p{Letter}\p{Number}]$/u.test(event.key); -} -function isSelfTargetOrItem(event, items) { - if (isSelfTarget(event)) - return true; - const target = event.target; - if (!target) - return false; - const isItem = items.some((item) => item.element === target); - return isItem; -} -function _346FK57L_getEnabledItems(items) { - return items.filter((item) => !item.disabled); -} -function itemTextStartsWith(item, text) { - var _a; - const itemText = ((_a = item.element) == null ? void 0 : _a.textContent) || item.children; - if (!itemText) - return false; - return normalizeString(itemText).trim().toLowerCase().startsWith(text.toLowerCase()); -} -function getSameInitialItems(items, char, activeId) { - if (!activeId) - return items; - const activeItem = items.find((item) => item.id === activeId); - if (!activeItem) - return items; - if (!itemTextStartsWith(activeItem, char)) - return items; - if (chars !== char && itemTextStartsWith(activeItem, chars)) - return items; - chars = char; - return flipItems( - items.filter((item) => itemTextStartsWith(item, chars)), - activeId - ).filter((item) => item.id !== activeId); -} -var useCompositeTypeahead = createHook( - (_a) => { - var _b = _a, { store, typeahead = true } = _b, props = __objRest(_b, ["store", "typeahead"]); - const context = useCompositeContext(); +var MenuItemCheckbox = memo2( + forwardRef2(function MenuItemCheckbox2(props) { + const htmlProps = useMenuItemCheckbox(props); + return LMDWO4NN_createElement(menu_item_checkbox_TagName, htmlProps); + }) +); + + +;// ./node_modules/@ariakit/react-core/esm/menu/menu-item-radio.js +"use client"; + + + + + + + + + + + + + + + + + + + + + + + + +// src/menu/menu-item-radio.tsx + + + +var menu_item_radio_TagName = "div"; +function menu_item_radio_getValue(prevValue, value, checked) { + if (checked === void 0) return prevValue; + if (checked) return value; + return prevValue; +} +var useMenuItemRadio = createHook( + function useMenuItemRadio2(_a) { + var _b = _a, { + store, + name, + value, + checked, + onChange: onChangeProp, + hideOnClick = false + } = _b, props = __objRest(_b, [ + "store", + "name", + "value", + "checked", + "onChange", + "hideOnClick" + ]); + const context = useMenuScopedContext(); store = store || context; invariant( store, false && 0 ); - const onKeyDownCaptureProp = props.onKeyDownCapture; - const cleanupTimeoutRef = (0,external_React_.useRef)(0); - const onKeyDownCapture = useEvent( - (event) => { - onKeyDownCaptureProp == null ? void 0 : onKeyDownCaptureProp(event); - if (event.defaultPrevented) - return; - if (!typeahead) - return; - if (!store) - return; - const { items, activeId } = store.getState(); - if (!isValidTypeaheadEvent(event)) - return clearChars(); - let enabledItems = _346FK57L_getEnabledItems(items); - if (!isSelfTargetOrItem(event, enabledItems)) - return clearChars(); - event.preventDefault(); - window.clearTimeout(cleanupTimeoutRef.current); - cleanupTimeoutRef.current = window.setTimeout(() => { - chars = ""; - }, 500); - const char = event.key.toLowerCase(); - chars += char; - enabledItems = getSameInitialItems(enabledItems, char, activeId); - const item = enabledItems.find( - (item2) => itemTextStartsWith(item2, chars) - ); - if (item) { - store.move(item.id); - } else { - clearChars(); - } - } - ); - props = _4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues({}, props), { - onKeyDownCapture - }); + const defaultChecked = useInitialValue(props.defaultChecked); + (0,external_React_.useEffect)(() => { + store == null ? void 0 : store.setValue(name, (prevValue = false) => { + return menu_item_radio_getValue(prevValue, value, defaultChecked); + }); + }, [store, name, value, defaultChecked]); + (0,external_React_.useEffect)(() => { + if (checked === void 0) return; + store == null ? void 0 : store.setValue(name, (prevValue) => { + return menu_item_radio_getValue(prevValue, value, checked); + }); + }, [store, name, value, checked]); + const isChecked = store.useState((state) => state.values[name] === value); + props = useWrapElement( + props, + (element) => /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(MenuItemCheckedContext.Provider, { value: !!isChecked, children: element }), + [isChecked] + ); + props = _3YLGPPWQ_spreadValues({ + role: "menuitemradio" + }, props); + props = useRadio(_3YLGPPWQ_spreadValues({ + name, + value, + checked: isChecked, + onChange(event) { + onChangeProp == null ? void 0 : onChangeProp(event); + if (event.defaultPrevented) return; + const element = event.currentTarget; + store == null ? void 0 : store.setValue(name, (prevValue) => { + return menu_item_radio_getValue(prevValue, value, checked != null ? checked : element.checked); + }); + } + }, props)); + props = useMenuItem(_3YLGPPWQ_spreadValues({ store, hideOnClick }, props)); + return props; + } +); +var MenuItemRadio = memo2( + forwardRef2(function MenuItemRadio2(props) { + const htmlProps = useMenuItemRadio(props); + return LMDWO4NN_createElement(menu_item_radio_TagName, htmlProps); + }) +); + + +;// ./node_modules/@ariakit/react-core/esm/menu/menu-group.js +"use client"; + + + + + + + + +// src/menu/menu-group.tsx +var menu_group_TagName = "div"; +var useMenuGroup = createHook( + function useMenuGroup2(props) { + props = useCompositeGroup(props); + return props; + } +); +var menu_group_MenuGroup = forwardRef2(function MenuGroup2(props) { + const htmlProps = useMenuGroup(props); + return LMDWO4NN_createElement(menu_group_TagName, htmlProps); +}); + + +;// ./node_modules/@ariakit/react-core/esm/menu/menu-group-label.js +"use client"; + + + + + + + + +// src/menu/menu-group-label.tsx +var menu_group_label_TagName = "div"; +var useMenuGroupLabel = createHook( + function useMenuGroupLabel2(props) { + props = useCompositeGroupLabel(props); + return props; + } +); +var MenuGroupLabel = forwardRef2(function MenuGroupLabel2(props) { + const htmlProps = useMenuGroupLabel(props); + return LMDWO4NN_createElement(menu_group_label_TagName, htmlProps); +}); + + +;// ./node_modules/@ariakit/react-core/esm/__chunks/TP7N7UIH.js +"use client"; + + + + + +// src/composite/composite-separator.tsx + +var TP7N7UIH_TagName = "hr"; +var useCompositeSeparator = createHook(function useCompositeSeparator2(_a) { + var _b = _a, { store } = _b, props = __objRest(_b, ["store"]); + const context = useCompositeContext(); + store = store || context; + invariant( + store, + false && 0 + ); + const orientation = store.useState( + (state) => state.orientation === "horizontal" ? "vertical" : "horizontal" + ); + props = useSeparator(_3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, props), { orientation })); + return props; +}); +var CompositeSeparator = forwardRef2(function CompositeSeparator2(props) { + const htmlProps = useCompositeSeparator(props); + return LMDWO4NN_createElement(TP7N7UIH_TagName, htmlProps); +}); + + + +;// ./node_modules/@ariakit/react-core/esm/menu/menu-separator.js +"use client"; + + + + + + + + + + + + + + + +// src/menu/menu-separator.tsx +var menu_separator_TagName = "hr"; +var useMenuSeparator = createHook( + function useMenuSeparator2(_a) { + var _b = _a, { store } = _b, props = __objRest(_b, ["store"]); + const context = useMenuContext(); + store = store || context; + props = useCompositeSeparator(_3YLGPPWQ_spreadValues({ store }, props)); return props; } ); -var CompositeTypeahead = createComponent( - (props) => { - const htmlProps = useCompositeTypeahead(props); - return _3ORBWXWF_createElement("div", htmlProps); - } -); -if (false) {} - - - -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/menu/menu-button.js +var MenuSeparator = forwardRef2(function MenuSeparator2(props) { + const htmlProps = useMenuSeparator(props); + return LMDWO4NN_createElement(menu_separator_TagName, htmlProps); +}); + + +;// ./node_modules/@wordpress/components/build-module/menu/styles.js + +function menu_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)."; } +/** + * External dependencies + */ + + +/** + * Internal dependencies + */ + + + + +const styles_ANIMATION_PARAMS = { + SCALE_AMOUNT_OUTER: 0.82, + SCALE_AMOUNT_CONTENT: 0.9, + DURATION: { + IN: '400ms', + OUT: '200ms' + }, + EASING: 'cubic-bezier(0.33, 0, 0, 1)' +}; +const CONTENT_WRAPPER_PADDING = space(1); +const ITEM_PADDING_BLOCK = space(2); +const ITEM_PADDING_INLINE = space(3); + +// TODO: +// - border color and divider color are different from COLORS.theme variables +// - lighter text color is not defined in COLORS.theme, should it be? +// - lighter background color is not defined in COLORS.theme, should it be? +const DEFAULT_BORDER_COLOR = COLORS.theme.gray[300]; +const DIVIDER_COLOR = COLORS.theme.gray[200]; +const LIGHTER_TEXT_COLOR = COLORS.theme.gray[700]; +const LIGHT_BACKGROUND_COLOR = COLORS.theme.gray[100]; +const TOOLBAR_VARIANT_BORDER_COLOR = COLORS.theme.foreground; +const DEFAULT_BOX_SHADOW = `0 0 0 ${config_values.borderWidth} ${DEFAULT_BORDER_COLOR}, ${config_values.elevationMedium}`; +const TOOLBAR_VARIANT_BOX_SHADOW = `0 0 0 ${config_values.borderWidth} ${TOOLBAR_VARIANT_BORDER_COLOR}`; +const GRID_TEMPLATE_COLS = 'minmax( 0, max-content ) 1fr'; +const PopoverOuterWrapper = /*#__PURE__*/emotion_styled_base_browser_esm("div", true ? { + target: "e1wg7tti14" +} : 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)); +const PopoverInnerWrapper = /*#__PURE__*/emotion_styled_base_browser_esm("div", true ? { + target: "e1wg7tti13" +} : 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)); +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.theme.accentInverted, ";}&[data-focus-visible]{box-shadow:0 0 0 1.5px ", COLORS.theme.accent, ";outline:2px solid transparent;}&:active,&[data-active]{}", PopoverInnerWrapper, ":not(:focus) &:not(:focus)[aria-expanded=\"true\"]{background-color:", LIGHT_BACKGROUND_COLOR, ";color:", COLORS.theme.foreground, ";}svg{fill:currentColor;}" + ( true ? "" : 0), true ? "" : 0); +const styles_Item = /*#__PURE__*/emotion_styled_base_browser_esm(MVIULMNR_MenuItem, true ? { + target: "e1wg7tti12" +} : 0)(baseItem, ";" + ( true ? "" : 0)); +const styles_CheckboxItem = /*#__PURE__*/emotion_styled_base_browser_esm(MenuItemCheckbox, true ? { + target: "e1wg7tti11" +} : 0)(baseItem, ";" + ( true ? "" : 0)); +const styles_RadioItem = /*#__PURE__*/emotion_styled_base_browser_esm(MenuItemRadio, true ? { + target: "e1wg7tti10" +} : 0)(baseItem, ";" + ( true ? "" : 0)); +const ItemPrefixWrapper = /*#__PURE__*/emotion_styled_base_browser_esm("span", true ? { + target: "e1wg7tti9" +} : 0)("grid-column:1;", styles_CheckboxItem, ">&,", styles_RadioItem, ">&{min-width:", space(6), ";}", styles_CheckboxItem, ">&,", styles_RadioItem, ">&,&: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)); +const ItemContentWrapper = /*#__PURE__*/emotion_styled_base_browser_esm("div", true ? { + target: "e1wg7tti8" +} : 0)("grid-column:2;display:flex;align-items:center;justify-content:space-between;gap:", space(3), ";pointer-events:none;" + ( true ? "" : 0)); +const ItemChildrenWrapper = /*#__PURE__*/emotion_styled_base_browser_esm("div", true ? { + target: "e1wg7tti7" +} : 0)("flex:1;display:inline-flex;flex-direction:column;gap:", space(1), ";" + ( true ? "" : 0)); +const ItemSuffixWrapper = /*#__PURE__*/emotion_styled_base_browser_esm("span", true ? { + target: "e1wg7tti6" +} : 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(", PopoverInnerWrapper, ") &,[aria-disabled='true'] *:not(", PopoverInnerWrapper, ") &{color:inherit;}" + ( true ? "" : 0)); +const styles_Group = /*#__PURE__*/emotion_styled_base_browser_esm(menu_group_MenuGroup, true ? { + target: "e1wg7tti5" +} : 0)( true ? { + name: "49aokf", + styles: "display:contents" +} : 0); +const styles_GroupLabel = /*#__PURE__*/emotion_styled_base_browser_esm(MenuGroupLabel, true ? { + target: "e1wg7tti4" +} : 0)("grid-column:1/-1;padding-block-start:", space(3), ";padding-block-end:", space(2), ";padding-inline:", ITEM_PADDING_INLINE, ";" + ( true ? "" : 0)); +const styles_Separator = /*#__PURE__*/emotion_styled_base_browser_esm(MenuSeparator, true ? { + target: "e1wg7tti3" +} : 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)); +const SubmenuChevronIcon = /*#__PURE__*/emotion_styled_base_browser_esm(build_module_icon, true ? { + target: "e1wg7tti2" +} : 0)("width:", space(1.5), ";", rtl({ + transform: `scaleX(1)` +}, { + transform: `scaleX(-1)` +}), ";" + ( true ? "" : 0)); +const styles_ItemLabel = /*#__PURE__*/emotion_styled_base_browser_esm(truncate_component, true ? { + target: "e1wg7tti1" +} : 0)("font-size:", font('default.fontSize'), ";line-height:20px;color:inherit;" + ( true ? "" : 0)); +const styles_ItemHelpText = /*#__PURE__*/emotion_styled_base_browser_esm(truncate_component, true ? { + target: "e1wg7tti0" +} : 0)("font-size:", font('helpText.fontSize'), ";line-height:16px;color:", LIGHTER_TEXT_COLOR, ";overflow-wrap:anywhere;[data-active-item]:not( [data-focus-visible] ) *:not( ", PopoverInnerWrapper, " ) &,[aria-disabled='true'] *:not( ", PopoverInnerWrapper, " ) &{color:inherit;}" + ( true ? "" : 0)); + +;// ./node_modules/@wordpress/components/build-module/menu/item.js +/** + * WordPress dependencies + */ + + +/** + * Internal dependencies + */ + + + + +const item_Item = (0,external_wp_element_namespaceObject.forwardRef)(function Item({ + prefix, + suffix, + children, + disabled = false, + hideOnClick = true, + store, + ...props +}, ref) { + const menuContext = (0,external_wp_element_namespaceObject.useContext)(context_Context); + if (!menuContext?.store) { + throw new Error('Menu.Item can only be rendered inside a Menu component'); + } + + // In most cases, the menu store will be retrieved from context (ie. the store + // created by the top-level menu component). But in rare cases (ie. + // `Menu.SubmenuTriggerItem`), the context store wouldn't be correct. This is + // why the component accepts a `store` prop to override the context store. + const computedStore = store !== null && store !== void 0 ? store : menuContext.store; + return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(styles_Item, { + ref: ref, + ...props, + accessibleWhenDisabled: true, + disabled: disabled, + hideOnClick: hideOnClick, + store: computedStore, + children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ItemPrefixWrapper, { + children: prefix + }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(ItemContentWrapper, { + children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ItemChildrenWrapper, { + children: children + }), suffix && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ItemSuffixWrapper, { + children: suffix + })] + })] + }); +}); + +;// ./node_modules/@ariakit/react-core/esm/menu/menu-item-check.js +"use client"; + + + + + + + + + + + + + + + +// src/menu/menu-item-check.tsx + +var menu_item_check_TagName = "span"; +var useMenuItemCheck = createHook( + function useMenuItemCheck2(_a) { + var _b = _a, { store, checked } = _b, props = __objRest(_b, ["store", "checked"]); + const context = (0,external_React_.useContext)(MenuItemCheckedContext); + checked = checked != null ? checked : context; + props = useCheckboxCheck(_3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, props), { checked })); + return props; + } +); +var MenuItemCheck = forwardRef2(function MenuItemCheck2(props) { + const htmlProps = useMenuItemCheck(props); + return LMDWO4NN_createElement(menu_item_check_TagName, htmlProps); +}); + + +;// ./node_modules/@wordpress/components/build-module/menu/checkbox-item.js +/** + * External dependencies + */ + + +/** + * WordPress dependencies + */ + + + +/** + * Internal dependencies + */ + + + + +const CheckboxItem = (0,external_wp_element_namespaceObject.forwardRef)(function CheckboxItem({ + suffix, + children, + disabled = false, + hideOnClick = false, + ...props +}, ref) { + const menuContext = (0,external_wp_element_namespaceObject.useContext)(context_Context); + if (!menuContext?.store) { + throw new Error('Menu.CheckboxItem can only be rendered inside a Menu component'); + } + return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(styles_CheckboxItem, { + ref: ref, + ...props, + accessibleWhenDisabled: true, + disabled: disabled, + hideOnClick: hideOnClick, + store: menuContext.store, + children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(MenuItemCheck, { + store: menuContext.store, + render: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ItemPrefixWrapper, {}) + // Override some ariakit inline styles + , + style: { + width: 'auto', + height: 'auto' + }, + children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(icons_build_module_icon, { + icon: library_check, + size: 24 + }) + }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(ItemContentWrapper, { + children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ItemChildrenWrapper, { + children: children + }), suffix && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ItemSuffixWrapper, { + children: suffix + })] + })] + }); +}); + +;// ./node_modules/@wordpress/components/build-module/menu/radio-item.js +/** + * External dependencies + */ + + +/** + * WordPress dependencies + */ + + + +/** + * Internal dependencies + */ + + + + + +const radioCheck = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { + xmlns: "http://www.w3.org/2000/svg", + viewBox: "0 0 24 24", + children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Circle, { + cx: 12, + cy: 12, + r: 3 + }) +}); +const RadioItem = (0,external_wp_element_namespaceObject.forwardRef)(function RadioItem({ + suffix, + children, + disabled = false, + hideOnClick = false, + ...props +}, ref) { + const menuContext = (0,external_wp_element_namespaceObject.useContext)(context_Context); + if (!menuContext?.store) { + throw new Error('Menu.RadioItem can only be rendered inside a Menu component'); + } + return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(styles_RadioItem, { + ref: ref, + ...props, + accessibleWhenDisabled: true, + disabled: disabled, + hideOnClick: hideOnClick, + store: menuContext.store, + children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(MenuItemCheck, { + store: menuContext.store, + render: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ItemPrefixWrapper, {}) + // Override some ariakit inline styles + , + style: { + width: 'auto', + height: 'auto' + }, + children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(icons_build_module_icon, { + icon: radioCheck, + size: 24 + }) + }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(ItemContentWrapper, { + children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ItemChildrenWrapper, { + children: children + }), suffix && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ItemSuffixWrapper, { + children: suffix + })] + })] + }); +}); + +;// ./node_modules/@wordpress/components/build-module/menu/group.js +/** + * WordPress dependencies + */ + + +/** + * Internal dependencies + */ + + + + +const group_Group = (0,external_wp_element_namespaceObject.forwardRef)(function Group(props, ref) { + const menuContext = (0,external_wp_element_namespaceObject.useContext)(context_Context); + if (!menuContext?.store) { + throw new Error('Menu.Group can only be rendered inside a Menu component'); + } + return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(styles_Group, { + ref: ref, + ...props, + store: menuContext.store + }); +}); + +;// ./node_modules/@wordpress/components/build-module/menu/group-label.js +/** + * WordPress dependencies + */ + + +/** + * Internal dependencies + */ + + + + + +const group_label_GroupLabel = (0,external_wp_element_namespaceObject.forwardRef)(function Group(props, ref) { + const menuContext = (0,external_wp_element_namespaceObject.useContext)(context_Context); + if (!menuContext?.store) { + throw new Error('Menu.GroupLabel can only be rendered inside a Menu component'); + } + return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(styles_GroupLabel, { + ref: ref, + render: + /*#__PURE__*/ + // @ts-expect-error The `children` prop is passed + (0,external_ReactJSXRuntime_namespaceObject.jsx)(text_component, { + upperCase: true, + variant: "muted", + size: "11px", + weight: 500, + lineHeight: "16px" + }), + ...props, + store: menuContext.store + }); +}); + +;// ./node_modules/@wordpress/components/build-module/menu/separator.js +/** + * WordPress dependencies + */ + + +/** + * Internal dependencies + */ + + + + +const separator_Separator = (0,external_wp_element_namespaceObject.forwardRef)(function Separator(props, ref) { + const menuContext = (0,external_wp_element_namespaceObject.useContext)(context_Context); + if (!menuContext?.store) { + throw new Error('Menu.Separator can only be rendered inside a Menu component'); + } + return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(styles_Separator, { + ref: ref, + ...props, + store: menuContext.store, + variant: menuContext.variant + }); +}); + +;// ./node_modules/@wordpress/components/build-module/menu/item-label.js +/** + * WordPress dependencies + */ + + +/** + * Internal dependencies + */ + + + + +const ItemLabel = (0,external_wp_element_namespaceObject.forwardRef)(function ItemLabel(props, ref) { + const menuContext = (0,external_wp_element_namespaceObject.useContext)(context_Context); + if (!menuContext?.store) { + throw new Error('Menu.ItemLabel can only be rendered inside a Menu component'); + } + return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(styles_ItemLabel, { + numberOfLines: 1, + ref: ref, + ...props + }); +}); + +;// ./node_modules/@wordpress/components/build-module/menu/item-help-text.js +/** + * WordPress dependencies + */ + + +/** + * Internal dependencies + */ + + + + +const ItemHelpText = (0,external_wp_element_namespaceObject.forwardRef)(function ItemHelpText(props, ref) { + const menuContext = (0,external_wp_element_namespaceObject.useContext)(context_Context); + if (!menuContext?.store) { + throw new Error('Menu.ItemHelpText can only be rendered inside a Menu component'); + } + return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(styles_ItemHelpText, { + numberOfLines: 2, + ref: ref, + ...props + }); +}); + +;// ./node_modules/@ariakit/react-core/esm/menu/menu-button.js "use client"; @@ -71522,6 +70627,7 @@ +var menu_button_TagName = "button"; function getInitialFocus(event, dir) { const keyMap = { ArrowDown: dir === "bottom" || dir === "top" ? "first" : false, @@ -71533,16 +70639,24 @@ } function hasActiveItem(items, excludeElement) { return !!(items == null ? void 0 : items.some((item) => { - if (!item.element) - return false; - if (item.element === excludeElement) - return false; + if (!item.element) return false; + if (item.element === excludeElement) return false; return item.element.getAttribute("aria-expanded") === "true"; })); } var useMenuButton = createHook( - (_a) => { - var _b = _a, { store, focusable, accessibleWhenDisabled, showOnHover } = _b, props = __objRest(_b, ["store", "focusable", "accessibleWhenDisabled", "showOnHover"]); + function useMenuButton2(_a) { + var _b = _a, { + store, + focusable, + accessibleWhenDisabled, + showOnHover + } = _b, props = __objRest(_b, [ + "store", + "focusable", + "accessibleWhenDisabled", + "showOnHover" + ]); const context = useMenuProviderContext(); store = store || context; invariant( @@ -71557,8 +70671,7 @@ const disabled = disabledFromProps(props); const showMenu = () => { const trigger = ref.current; - if (!trigger) - return; + if (!trigger) return; store == null ? void 0 : store.setDisclosureElement(trigger); store == null ? void 0 : store.setAnchorElement(trigger); store == null ? void 0 : store.show(); @@ -71566,31 +70679,26 @@ const onFocusProp = props.onFocus; const onFocus = useEvent((event) => { onFocusProp == null ? void 0 : onFocusProp(event); - if (disabled) - return; - if (event.defaultPrevented) - return; + if (disabled) return; + if (event.defaultPrevented) return; store == null ? void 0 : store.setAutoFocusOnShow(false); store == null ? void 0 : store.setActiveId(null); - if (!parentMenubar) - return; - if (!parentIsMenubar) - return; + if (!parentMenubar) return; + if (!parentIsMenubar) return; const { items } = parentMenubar.getState(); if (hasActiveItem(items, event.currentTarget)) { showMenu(); } }); - const dir = store.useState( + const dir = useStoreState( + store, (state) => state.placement.split("-")[0] ); const onKeyDownProp = props.onKeyDown; const onKeyDown = useEvent((event) => { onKeyDownProp == null ? void 0 : onKeyDownProp(event); - if (disabled) - return; - if (event.defaultPrevented) - return; + if (disabled) return; + if (event.defaultPrevented) return; const initialFocus = getInitialFocus(event, dir); if (initialFocus) { event.preventDefault(); @@ -71602,10 +70710,8 @@ const onClickProp = props.onClick; const onClick = useEvent((event) => { onClickProp == null ? void 0 : onClickProp(event); - if (event.defaultPrevented) - return; - if (!store) - return; + if (event.defaultPrevented) return; + if (!store) return; const isKeyboardClick = !event.detail; const { open } = store.getState(); if (!open || isKeyboardClick) { @@ -71624,7 +70730,7 @@ [store] ); if (hasParentMenu) { - props = _4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues({}, props), { + props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, props), { render: /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(Role.div, { render: props.render }) }); } @@ -71635,7 +70741,7 @@ ); const role = hasParentMenu || parentIsMenubar ? getPopupItemRole(parentContentElement, "menuitem") : void 0; const contentElement = store.useState("contentElement"); - props = _4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues({ + props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({ id, role, "aria-haspopup": getPopupRole(contentElement, "menu") @@ -71645,55 +70751,86 @@ onKeyDown, onClick }); - props = useHovercardAnchor(_4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues({ + props = useHovercardAnchor(_3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({ store, focusable, accessibleWhenDisabled }, props), { showOnHover: (event) => { const getShowOnHover = () => { - if (typeof showOnHover === "function") - return showOnHover(event); - if (showOnHover != null) - return showOnHover; - if (hasParentMenu) - return true; - if (!parentMenubar) - return false; + if (typeof showOnHover === "function") return showOnHover(event); + if (showOnHover != null) return showOnHover; + if (hasParentMenu) return true; + if (!parentMenubar) return false; const { items } = parentMenubar.getState(); return parentIsMenubar && hasActiveItem(items); }; const canShowOnHover = getShowOnHover(); - if (!canShowOnHover) - return false; + if (!canShowOnHover) return false; const parent = parentIsMenubar ? parentMenubar : parentMenu; - if (!parent) - return true; + if (!parent) return true; parent.setActiveId(event.currentTarget.id); return true; } })); - props = usePopoverDisclosure(_4R3V3JGP_spreadValues({ + props = usePopoverDisclosure(_3YLGPPWQ_spreadValues({ store, toggleOnClick: !hasParentMenu, focusable, accessibleWhenDisabled }, props)); - props = useCompositeTypeahead(_4R3V3JGP_spreadValues({ + props = useCompositeTypeahead(_3YLGPPWQ_spreadValues({ store, typeahead: parentIsMenubar }, props)); return props; } ); -var MenuButton = createComponent((props) => { +var MenuButton = forwardRef2(function MenuButton2(props) { const htmlProps = useMenuButton(props); - return _3ORBWXWF_createElement("button", htmlProps); -}); -if (false) {} - - -;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/chevron-right-small.js + return LMDWO4NN_createElement(menu_button_TagName, htmlProps); +}); + + +;// ./node_modules/@wordpress/components/build-module/menu/trigger-button.js +/** + * External dependencies + */ + + +/** + * WordPress dependencies + */ + + +/** + * Internal dependencies + */ + + + +const TriggerButton = (0,external_wp_element_namespaceObject.forwardRef)(function TriggerButton({ + children, + disabled = false, + ...props +}, ref) { + const menuContext = (0,external_wp_element_namespaceObject.useContext)(context_Context); + if (!menuContext?.store) { + throw new Error('Menu.TriggerButton can only be rendered inside a Menu component'); + } + if (menuContext.store.parent) { + throw new Error('Menu.TriggerButton should not be rendered inside a nested Menu component. Use Menu.SubmenuTriggerItem instead.'); + } + return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(MenuButton, { + ref: ref, + ...props, + disabled: disabled, + store: menuContext.store, + children: children + }); +}); + +;// ./node_modules/@wordpress/icons/build-module/library/chevron-right-small.js /** * WordPress dependencies */ @@ -71708,7 +70845,58 @@ }); /* harmony default export */ const chevron_right_small = (chevronRightSmall); -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/HHNFDKU2.js +;// ./node_modules/@wordpress/components/build-module/menu/submenu-trigger-item.js +/** + * External dependencies + */ + + +/** + * WordPress dependencies + */ + + + +/** + * Internal dependencies + */ + + + + + +const SubmenuTriggerItem = (0,external_wp_element_namespaceObject.forwardRef)(function SubmenuTriggerItem({ + suffix, + ...otherProps +}, ref) { + const menuContext = (0,external_wp_element_namespaceObject.useContext)(context_Context); + if (!menuContext?.store.parent) { + throw new Error('Menu.SubmenuTriggerItem can only be rendered inside a nested Menu component'); + } + return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(MenuButton, { + ref: ref, + accessibleWhenDisabled: true, + store: menuContext.store, + render: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(item_Item, { + ...otherProps, + // The menu item needs to register and be part of the parent menu. + // Without specifying the store explicitly, the `Item` component + // would otherwise read the store via context and pick up the one from + // the sub-menu `Menu` component. + store: menuContext.store.parent, + suffix: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { + children: [suffix, /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(SubmenuChevronIcon, { + "aria-hidden": "true", + icon: chevron_right_small, + size: 24, + preserveAspectRatio: "xMidYMid slice" + })] + }) + }) + }); +}); + +;// ./node_modules/@ariakit/react-core/esm/__chunks/ASGALOAX.js "use client"; @@ -71723,6 +70911,7 @@ +var ASGALOAX_TagName = "div"; function useAriaLabelledBy(_a) { var _b = _a, { store } = _b, props = __objRest(_b, ["store"]); const [id, setId] = (0,external_React_.useState)(void 0); @@ -71731,11 +70920,9 @@ const contentElement = useStoreState(store, "contentElement"); (0,external_React_.useEffect)(() => { const disclosure = disclosureElement; - if (!disclosure) - return; + if (!disclosure) return; const menu = contentElement; - if (!menu) - return; + if (!menu) return; const menuLabel = label || menu.hasAttribute("aria-label"); if (menuLabel) { setId(void 0); @@ -71746,7 +70933,7 @@ return id; } var useMenuList = createHook( - (_a) => { + function useMenuList2(_a) { var _b = _a, { store, alwaysVisible, composite } = _b, props = __objRest(_b, ["store", "alwaysVisible", "composite"]); const context = useMenuProviderContext(); store = store || context; @@ -71772,8 +70959,7 @@ ); const onKeyDown = useEvent((event) => { onKeyDownProp == null ? void 0 : onKeyDownProp(event); - if (event.defaultPrevented) - return; + if (event.defaultPrevented) return; if (hasParentMenu || parentMenubar && !isHorizontal) { const hideMap = { ArrowRight: () => dir === "left" && !isHorizontal, @@ -71791,23 +70977,19 @@ if (parentMenubar) { const keyMap = { ArrowRight: () => { - if (!isMenubarHorizontal) - return; + if (!isMenubarHorizontal) return; return parentMenubar.next(); }, ArrowLeft: () => { - if (!isMenubarHorizontal) - return; + if (!isMenubarHorizontal) return; return parentMenubar.previous(); }, ArrowDown: () => { - if (isMenubarHorizontal) - return; + if (isMenubarHorizontal) return; return parentMenubar.next(); }, ArrowUp: () => { - if (isMenubarHorizontal) - return; + if (isMenubarHorizontal) return; return parentMenubar.previous(); } }; @@ -71825,11 +71007,11 @@ (element) => /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(MenuScopedContextProvider, { value: store, children: element }), [store] ); - const ariaLabelledBy = useAriaLabelledBy(_4R3V3JGP_spreadValues({ store }, props)); + const ariaLabelledBy = useAriaLabelledBy(_3YLGPPWQ_spreadValues({ store }, props)); const mounted = store.useState("mounted"); const hidden = isHidden(mounted, props.hidden, alwaysVisible); - const style = hidden ? _4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues({}, props.style), { display: "none" }) : props.style; - props = _4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues({ + const style = hidden ? _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, props.style), { display: "none" }) : props.style; + props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({ id, "aria-labelledby": ariaLabelledBy, hidden @@ -71841,26 +71023,26 @@ const hasCombobox = !!store.combobox; composite = composite != null ? composite : !hasCombobox; if (composite) { - props = _4R3V3JGP_spreadValues({ + props = _3YLGPPWQ_spreadValues({ role: "menu", "aria-orientation": orientation }, props); } - props = useComposite(_4R3V3JGP_spreadValues({ store, composite }, props)); - props = useCompositeTypeahead(_4R3V3JGP_spreadValues({ store, typeahead: !hasCombobox }, props)); + props = useComposite(_3YLGPPWQ_spreadValues({ store, composite }, props)); + props = useCompositeTypeahead(_3YLGPPWQ_spreadValues({ store, typeahead: !hasCombobox }, props)); return props; } ); -var MenuList = createComponent((props) => { +var MenuList = forwardRef2(function MenuList2(props) { const htmlProps = useMenuList(props); - return _3ORBWXWF_createElement("div", htmlProps); -}); -if (false) {} - - - -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/menu/menu.js -"use client"; + return LMDWO4NN_createElement(ASGALOAX_TagName, htmlProps); +}); + + + +;// ./node_modules/@ariakit/react-core/esm/menu/menu.js +"use client"; + @@ -71915,1277 +71097,289 @@ -var useMenu = createHook( - (_a) => { - var _b = _a, { - store, - modal: modalProp = false, - portal = !!modalProp, - hideOnEscape = true, - autoFocusOnShow = true, - hideOnHoverOutside, - alwaysVisible - } = _b, props = __objRest(_b, [ - "store", - "modal", - "portal", - "hideOnEscape", - "autoFocusOnShow", - "hideOnHoverOutside", - "alwaysVisible" - ]); - const context = useMenuProviderContext(); - store = store || context; - invariant( - store, - false && 0 - ); - const ref = (0,external_React_.useRef)(null); - const parentMenu = store.parent; - const parentMenubar = store.menubar; - const hasParentMenu = !!parentMenu; - const parentIsMenubar = !!parentMenubar && !hasParentMenu; - props = _4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues({}, props), { - ref: useMergeRefs(ref, props.ref) - }); - const _a2 = useMenuList( - _4R3V3JGP_spreadValues({ store, alwaysVisible }, props) - ), { "aria-labelledby": ariaLabelledBy } = _a2, menuListProps = __objRest(_a2, ["aria-labelledby"]); - props = menuListProps; - const [initialFocusRef, setInitialFocusRef] = (0,external_React_.useState)(); - const autoFocusOnShowState = store.useState("autoFocusOnShow"); - const initialFocus = store.useState("initialFocus"); - const baseElement = store.useState("baseElement"); - const items = store.useState("renderedItems"); - (0,external_React_.useEffect)(() => { - let cleaning = false; - setInitialFocusRef((prevInitialFocusRef) => { - var _a3, _b2, _c; - if (cleaning) - return; - if (!autoFocusOnShowState) - return; - if ((_a3 = prevInitialFocusRef == null ? void 0 : prevInitialFocusRef.current) == null ? void 0 : _a3.isConnected) - return prevInitialFocusRef; - const ref2 = (0,external_React_.createRef)(); - switch (initialFocus) { - case "first": - ref2.current = ((_b2 = items.find((item) => !item.disabled && item.element)) == null ? void 0 : _b2.element) || null; - break; - case "last": - ref2.current = ((_c = [...items].reverse().find((item) => !item.disabled && item.element)) == null ? void 0 : _c.element) || null; - break; - default: - ref2.current = baseElement; - } - return ref2; - }); - return () => { - cleaning = true; +var menu_TagName = "div"; +var useMenu = createHook(function useMenu2(_a) { + var _b = _a, { + store, + modal: modalProp = false, + portal = !!modalProp, + hideOnEscape = true, + autoFocusOnShow = true, + hideOnHoverOutside, + alwaysVisible + } = _b, props = __objRest(_b, [ + "store", + "modal", + "portal", + "hideOnEscape", + "autoFocusOnShow", + "hideOnHoverOutside", + "alwaysVisible" + ]); + const context = useMenuProviderContext(); + store = store || context; + invariant( + store, + false && 0 + ); + const ref = (0,external_React_.useRef)(null); + const parentMenu = store.parent; + const parentMenubar = store.menubar; + const hasParentMenu = !!parentMenu; + const parentIsMenubar = !!parentMenubar && !hasParentMenu; + props = _3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({}, props), { + ref: useMergeRefs(ref, props.ref) + }); + const _a2 = useMenuList(_3YLGPPWQ_spreadValues({ + store, + alwaysVisible + }, props)), { "aria-labelledby": ariaLabelledBy } = _a2, menuListProps = __objRest(_a2, ["aria-labelledby"]); + props = menuListProps; + const [initialFocusRef, setInitialFocusRef] = (0,external_React_.useState)(); + const autoFocusOnShowState = store.useState("autoFocusOnShow"); + const initialFocus = store.useState("initialFocus"); + const baseElement = store.useState("baseElement"); + const items = store.useState("renderedItems"); + (0,external_React_.useEffect)(() => { + let cleaning = false; + setInitialFocusRef((prevInitialFocusRef) => { + var _a3, _b2, _c; + if (cleaning) return; + if (!autoFocusOnShowState) return; + if ((_a3 = prevInitialFocusRef == null ? void 0 : prevInitialFocusRef.current) == null ? void 0 : _a3.isConnected) return prevInitialFocusRef; + const ref2 = (0,external_React_.createRef)(); + switch (initialFocus) { + case "first": + ref2.current = ((_b2 = items.find((item) => !item.disabled && item.element)) == null ? void 0 : _b2.element) || null; + break; + case "last": + ref2.current = ((_c = [...items].reverse().find((item) => !item.disabled && item.element)) == null ? void 0 : _c.element) || null; + break; + default: + ref2.current = baseElement; + } + return ref2; + }); + return () => { + cleaning = true; + }; + }, [store, autoFocusOnShowState, initialFocus, items, baseElement]); + const modal = hasParentMenu ? false : modalProp; + const mayAutoFocusOnShow = !!autoFocusOnShow; + const canAutoFocusOnShow = !!initialFocusRef || !!props.initialFocus || !!modal; + const contentElement = useStoreState( + store.combobox || store, + "contentElement" + ); + const parentContentElement = useStoreState( + (parentMenu == null ? void 0 : parentMenu.combobox) || parentMenu, + "contentElement" + ); + const preserveTabOrderAnchor = (0,external_React_.useMemo)(() => { + if (!parentContentElement) return; + if (!contentElement) return; + const role = contentElement.getAttribute("role"); + const parentRole = parentContentElement.getAttribute("role"); + const parentIsMenuOrMenubar = parentRole === "menu" || parentRole === "menubar"; + if (parentIsMenuOrMenubar && role === "menu") return; + return parentContentElement; + }, [contentElement, parentContentElement]); + if (preserveTabOrderAnchor !== void 0) { + props = _3YLGPPWQ_spreadValues({ + preserveTabOrderAnchor + }, props); + } + props = useHovercard(_3YLGPPWQ_spreadProps(_3YLGPPWQ_spreadValues({ + store, + alwaysVisible, + initialFocus: initialFocusRef, + autoFocusOnShow: mayAutoFocusOnShow ? canAutoFocusOnShow && autoFocusOnShow : autoFocusOnShowState || !!modal + }, props), { + hideOnEscape(event) { + if (isFalsyBooleanCallback(hideOnEscape, event)) return false; + store == null ? void 0 : store.hideAll(); + return true; + }, + hideOnHoverOutside(event) { + const disclosureElement = store == null ? void 0 : store.getState().disclosureElement; + const getHideOnHoverOutside = () => { + if (typeof hideOnHoverOutside === "function") { + return hideOnHoverOutside(event); + } + if (hideOnHoverOutside != null) return hideOnHoverOutside; + if (hasParentMenu) return true; + if (!parentIsMenubar) return false; + if (!disclosureElement) return true; + if (hasFocusWithin(disclosureElement)) return false; + return true; }; - }, [store, autoFocusOnShowState, initialFocus, items, baseElement]); - const modal = hasParentMenu ? false : modalProp; - const mayAutoFocusOnShow = !!autoFocusOnShow; - const canAutoFocusOnShow = !!initialFocusRef || !!props.initialFocus || !!modal; - const contentElement = useStoreState( - store.combobox || store, - "contentElement" - ); - const parentContentElement = useStoreState( - (parentMenu == null ? void 0 : parentMenu.combobox) || parentMenu, - "contentElement" - ); - const preserveTabOrderAnchor = (0,external_React_.useMemo)(() => { - if (!parentContentElement) - return; - if (!contentElement) - return; - const role = contentElement.getAttribute("role"); - const parentRole = parentContentElement.getAttribute("role"); - const parentIsMenuOrMenubar = parentRole === "menu" || parentRole === "menubar"; - if (parentIsMenuOrMenubar && role === "menu") - return; - return parentContentElement; - }, [contentElement, parentContentElement]); - if (preserveTabOrderAnchor !== void 0) { - props = _4R3V3JGP_spreadValues({ - preserveTabOrderAnchor - }, props); - } - props = useHovercard(_4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues({ - store, - alwaysVisible, - initialFocus: initialFocusRef, - autoFocusOnShow: mayAutoFocusOnShow ? canAutoFocusOnShow && autoFocusOnShow : autoFocusOnShowState || !!modal - }, props), { - hideOnEscape: (event) => { - if (isFalsyBooleanCallback(hideOnEscape, event)) - return false; - store == null ? void 0 : store.hideAll(); - return true; - }, - hideOnHoverOutside: (event) => { - const disclosureElement = store == null ? void 0 : store.getState().disclosureElement; - const getHideOnHoverOutside = () => { - if (typeof hideOnHoverOutside === "function") { - return hideOnHoverOutside(event); - } - if (hideOnHoverOutside != null) - return hideOnHoverOutside; - if (hasParentMenu) - return true; - if (!parentIsMenubar) - return false; - if (!disclosureElement) - return true; - if (hasFocusWithin(disclosureElement)) - return false; - return true; - }; - if (!getHideOnHoverOutside()) - return false; - if (event.defaultPrevented) - return true; - if (!hasParentMenu) - return true; - if (!disclosureElement) - return true; - fireEvent(disclosureElement, "mouseout", event); - if (!hasFocusWithin(disclosureElement)) - return true; - requestAnimationFrame(() => { - if (hasFocusWithin(disclosureElement)) - return; - store == null ? void 0 : store.hide(); - }); - return false; - }, - modal, - portal, - backdrop: hasParentMenu ? false : props.backdrop - })); - props = _4R3V3JGP_spreadValues({ - "aria-labelledby": ariaLabelledBy - }, props); - return props; - } -); + if (!getHideOnHoverOutside()) return false; + if (event.defaultPrevented) return true; + if (!hasParentMenu) return true; + if (!disclosureElement) return true; + fireEvent(disclosureElement, "mouseout", event); + if (!hasFocusWithin(disclosureElement)) return true; + requestAnimationFrame(() => { + if (hasFocusWithin(disclosureElement)) return; + store == null ? void 0 : store.hide(); + }); + return false; + }, + modal, + portal, + backdrop: hasParentMenu ? false : props.backdrop + })); + props = _3YLGPPWQ_spreadValues({ + "aria-labelledby": ariaLabelledBy + }, props); + return props; +}); var Menu = createDialogComponent( - createComponent((props) => { + forwardRef2(function Menu2(props) { const htmlProps = useMenu(props); - return _3ORBWXWF_createElement("div", htmlProps); + return LMDWO4NN_createElement(menu_TagName, htmlProps); }), useMenuProviderContext ); -if (false) {} - - -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/G6ONQ5EH.js -"use client"; - - - - - -// src/composite/composite-hover.ts - - - - -function getMouseDestination(event) { - const relatedTarget = event.relatedTarget; - if ((relatedTarget == null ? void 0 : relatedTarget.nodeType) === Node.ELEMENT_NODE) { - return relatedTarget; - } - return null; -} -function hoveringInside(event) { - const nextElement = getMouseDestination(event); - if (!nextElement) - return false; - return contains(event.currentTarget, nextElement); -} -var G6ONQ5EH_symbol = Symbol("composite-hover"); -function movingToAnotherItem(event) { - let dest = getMouseDestination(event); - if (!dest) - return false; - do { - if (Y3OOHFCN_hasOwnProperty(dest, G6ONQ5EH_symbol) && dest[G6ONQ5EH_symbol]) - return true; - dest = dest.parentElement; - } while (dest); - return false; -} -var useCompositeHover = createHook( - (_a) => { - var _b = _a, { - store, - focusOnHover = true, - blurOnHoverEnd = !!focusOnHover - } = _b, props = __objRest(_b, [ - "store", - "focusOnHover", - "blurOnHoverEnd" - ]); - const context = useCompositeContext(); - store = store || context; - invariant( - store, - false && 0 - ); - const isMouseMoving = useIsMouseMoving(); - const onMouseMoveProp = props.onMouseMove; - const focusOnHoverProp = useBooleanEvent(focusOnHover); - const onMouseMove = useEvent((event) => { - onMouseMoveProp == null ? void 0 : onMouseMoveProp(event); - if (event.defaultPrevented) - return; - if (!isMouseMoving()) - return; - if (!focusOnHoverProp(event)) - return; - if (!hasFocusWithin(event.currentTarget)) { - const baseElement = store == null ? void 0 : store.getState().baseElement; - if (baseElement && !hasFocus(baseElement)) { - baseElement.focus(); - } - } - store == null ? void 0 : store.setActiveId(event.currentTarget.id); - }); - const onMouseLeaveProp = props.onMouseLeave; - const blurOnHoverEndProp = useBooleanEvent(blurOnHoverEnd); - const onMouseLeave = useEvent((event) => { - var _a2; - onMouseLeaveProp == null ? void 0 : onMouseLeaveProp(event); - if (event.defaultPrevented) - return; - if (!isMouseMoving()) - return; - if (hoveringInside(event)) - return; - if (movingToAnotherItem(event)) - return; - if (!focusOnHoverProp(event)) - return; - if (!blurOnHoverEndProp(event)) - return; - store == null ? void 0 : store.setActiveId(null); - (_a2 = store == null ? void 0 : store.getState().baseElement) == null ? void 0 : _a2.focus(); - }); - const ref = (0,external_React_.useCallback)((element) => { - if (!element) - return; - element[G6ONQ5EH_symbol] = true; - }, []); - props = _4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues({}, props), { - ref: useMergeRefs(ref, props.ref), - onMouseMove, - onMouseLeave - }); - return props; - } -); -var CompositeHover = createMemoComponent( - (props) => { - const htmlProps = useCompositeHover(props); - return _3ORBWXWF_createElement("div", htmlProps); - } -); -if (false) {} - - - -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/Y6467XPW.js -"use client"; - - - - - - - - - -// src/menu/menu-item.ts - - - - -function menuHasFocus(baseElement, items, currentTarget) { - var _a; - if (!baseElement) - return false; - if (hasFocusWithin(baseElement)) - return true; - const expandedItem = items == null ? void 0 : items.find((item) => { - var _a2; - if (item.element === currentTarget) - return false; - return ((_a2 = item.element) == null ? void 0 : _a2.getAttribute("aria-expanded")) === "true"; - }); - const expandedMenuId = (_a = expandedItem == null ? void 0 : expandedItem.element) == null ? void 0 : _a.getAttribute("aria-controls"); - if (!expandedMenuId) - return false; - const doc = DLOEKDPY_getDocument(baseElement); - const expandedMenu = doc.getElementById(expandedMenuId); - if (!expandedMenu) - return false; - if (hasFocusWithin(expandedMenu)) + + +;// ./node_modules/@wordpress/components/build-module/menu/popover.js +/** + * External dependencies + */ + + +/** + * WordPress dependencies + */ + + +/** + * Internal dependencies + */ + + + + +const menu_popover_Popover = (0,external_wp_element_namespaceObject.forwardRef)(function Popover({ + gutter, + children, + shift, + modal = true, + ...otherProps +}, ref) { + const menuContext = (0,external_wp_element_namespaceObject.useContext)(context_Context); + + // Extract the side from the applied placement — useful for animations. + // Using `currentPlacement` instead of `placement` to make sure that we + // use the final computed placement (including "flips" etc). + const appliedPlacementSide = useStoreState(menuContext?.store, 'currentPlacement')?.split('-')[0]; + const hideOnEscape = (0,external_wp_element_namespaceObject.useCallback)(event => { + // Pressing Escape can cause unexpected consequences (ie. exiting + // full screen mode on MacOs, close parent modals...). + event.preventDefault(); + // Returning `true` causes the menu to hide. return true; - return !!expandedMenu.querySelector("[role=menuitem][aria-expanded=true]"); -} -var useMenuItem = createHook( - (_a) => { - var _b = _a, { - store, - hideOnClick = true, - preventScrollOnKeyDown = true, - focusOnHover, - blurOnHoverEnd - } = _b, props = __objRest(_b, [ - "store", - "hideOnClick", - "preventScrollOnKeyDown", - "focusOnHover", - "blurOnHoverEnd" - ]); - const menuContext = useMenuScopedContext(true); - const menubarContext = KA4GX64Z_useMenubarScopedContext(); - store = store || menuContext || menubarContext; - invariant( - store, - false && 0 - ); - const onClickProp = props.onClick; - const hideOnClickProp = useBooleanEvent(hideOnClick); - const hideMenu = "hideAll" in store ? store.hideAll : void 0; - const isWithinMenu = !!hideMenu; - const onClick = useEvent((event) => { - onClickProp == null ? void 0 : onClickProp(event); - if (event.defaultPrevented) - return; - if (isDownloading(event)) - return; - if (isOpeningInNewTab(event)) - return; - if (!hideMenu) - return; - const popupType = event.currentTarget.getAttribute("aria-haspopup"); - if (popupType === "menu") - return; - if (!hideOnClickProp(event)) - return; - hideMenu(); - }); - const contentElement = useStoreState( - store, - (state) => "contentElement" in state ? state.contentElement : null - ); - const role = getPopupItemRole(contentElement, "menuitem"); - props = _4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues({ - role - }, props), { - onClick - }); - props = useCompositeItem(_4R3V3JGP_spreadValues({ store, preventScrollOnKeyDown }, props)); - props = useCompositeHover(_4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues({ - store - }, props), { - focusOnHover(event) { - const getFocusOnHover = () => { - if (typeof focusOnHover === "function") - return focusOnHover(event); - if (focusOnHover != null) - return focusOnHover; - return true; - }; - if (!store) - return false; - if (!getFocusOnHover()) - return false; - const { baseElement, items } = store.getState(); - if (isWithinMenu) { - if (event.currentTarget.hasAttribute("aria-expanded")) { - event.currentTarget.focus(); - } - return true; - } - if (menuHasFocus(baseElement, items, event.currentTarget)) { - event.currentTarget.focus(); - return true; - } - return false; - }, - blurOnHoverEnd(event) { - if (typeof blurOnHoverEnd === "function") - return blurOnHoverEnd(event); - if (blurOnHoverEnd != null) - return blurOnHoverEnd; - return isWithinMenu; - } - })); - return props; - } -); -var Y6467XPW_MenuItem = createMemoComponent((props) => { - const htmlProps = useMenuItem(props); - return _3ORBWXWF_createElement("div", htmlProps); -}); -if (false) {} - - - -;// CONCATENATED MODULE: ./node_modules/@ariakit/core/esm/checkbox/checkbox-store.js -"use client"; - - - - -// src/checkbox/checkbox-store.ts -function createCheckboxStore(props = {}) { - var _a; - throwOnConflictingProps(props, props.store); - const syncState = (_a = props.store) == null ? void 0 : _a.getState(); - const initialState = { - value: defaultValue( - props.value, - syncState == null ? void 0 : syncState.value, - props.defaultValue, - false - ) - }; - const checkbox = createStore(initialState, props.store); - return _chunks_4R3V3JGP_spreadProps(_chunks_4R3V3JGP_spreadValues({}, checkbox), { - setValue: (value) => checkbox.setState("value", value) - }); -} - - -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/JIZ5C2JK.js -"use client"; - - - -// src/checkbox/checkbox-store.ts - -function useCheckboxStoreProps(store, update, props) { - useUpdateEffect(update, [props.store]); - useStoreProps(store, props, "value", "setValue"); - return store; -} -function useCheckboxStore(props = {}) { - const [store, update] = EKQEJRUF_useStore(createCheckboxStore, props); - return useCheckboxStoreProps(store, update, props); -} - - - -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/VPR2WHQV.js -"use client"; - - -// src/checkbox/checkbox-context.tsx -var VPR2WHQV_ctx = createStoreContext(); -var useCheckboxContext = VPR2WHQV_ctx.useContext; -var useCheckboxScopedContext = VPR2WHQV_ctx.useScopedContext; -var useCheckboxProviderContext = VPR2WHQV_ctx.useProviderContext; -var CheckboxContextProvider = VPR2WHQV_ctx.ContextProvider; -var CheckboxScopedContextProvider = VPR2WHQV_ctx.ScopedContextProvider; - - - -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/3AHQ6JCP.js -"use client"; - - - - - - - - -// src/checkbox/checkbox.tsx - - - -function setMixed(element, mixed) { - if (mixed) { - element.indeterminate = true; - } else if (element.indeterminate) { - element.indeterminate = false; - } -} -function isNativeCheckbox(tagName, type) { - return tagName === "input" && (!type || type === "checkbox"); -} -function getPrimitiveValue(value) { - if (Array.isArray(value)) { - return value.toString(); - } - return value; -} -var useCheckbox = createHook( - (_a) => { - var _b = _a, { - store, - name, - value: valueProp, - checked: checkedProp, - defaultChecked - } = _b, props = __objRest(_b, [ - "store", - "name", - "value", - "checked", - "defaultChecked" - ]); - const context = useCheckboxContext(); - store = store || context; - const [_checked, setChecked] = (0,external_React_.useState)(defaultChecked != null ? defaultChecked : false); - const checked = useStoreState(store, (state) => { - if (checkedProp !== void 0) - return checkedProp; - if ((state == null ? void 0 : state.value) === void 0) - return _checked; - if (valueProp != null) { - if (Array.isArray(state.value)) { - const primitiveValue = getPrimitiveValue(valueProp); - return state.value.includes(primitiveValue); - } - return state.value === valueProp; - } - if (Array.isArray(state.value)) - return false; - if (typeof state.value === "boolean") - return state.value; - return false; - }); - const ref = (0,external_React_.useRef)(null); - const tagName = useTagName(ref, props.as || "input"); - const nativeCheckbox = isNativeCheckbox(tagName, props.type); - const mixed = checked ? checked === "mixed" : void 0; - const isChecked = checked === "mixed" ? false : checked; - const disabled = disabledFromProps(props); - const [propertyUpdated, schedulePropertyUpdate] = useForceUpdate(); - (0,external_React_.useEffect)(() => { - const element = ref.current; - if (!element) - return; - setMixed(element, mixed); - if (nativeCheckbox) - return; - element.checked = isChecked; - if (name !== void 0) { - element.name = name; - } - if (valueProp !== void 0) { - element.value = `${valueProp}`; - } - }, [propertyUpdated, mixed, nativeCheckbox, isChecked, name, valueProp]); - const onChangeProp = props.onChange; - const onChange = useEvent((event) => { - if (disabled) { - event.stopPropagation(); - event.preventDefault(); - return; - } - setMixed(event.currentTarget, mixed); - if (!nativeCheckbox) { - event.currentTarget.checked = !event.currentTarget.checked; - schedulePropertyUpdate(); - } - onChangeProp == null ? void 0 : onChangeProp(event); - if (event.defaultPrevented) - return; - const elementChecked = event.currentTarget.checked; - setChecked(elementChecked); - store == null ? void 0 : store.setValue((prevValue) => { - if (valueProp == null) - return elementChecked; - const primitiveValue = getPrimitiveValue(valueProp); - if (!Array.isArray(prevValue)) { - return prevValue === primitiveValue ? false : primitiveValue; - } - if (elementChecked) { - if (prevValue.includes(primitiveValue)) { - return prevValue; - } - return [...prevValue, primitiveValue]; - } - return prevValue.filter((v) => v !== primitiveValue); - }); - }); - const onClickProp = props.onClick; - const onClick = useEvent((event) => { - onClickProp == null ? void 0 : onClickProp(event); - if (event.defaultPrevented) - return; - if (nativeCheckbox) - return; - onChange(event); - }); - props = useWrapElement( - props, - (element) => /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(CheckboxCheckedContext.Provider, { value: isChecked, children: element }), - [isChecked] - ); - props = _4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues({ - role: !nativeCheckbox ? "checkbox" : void 0, - type: nativeCheckbox ? "checkbox" : void 0, - "aria-checked": checked - }, props), { - ref: useMergeRefs(ref, props.ref), - onChange, - onClick - }); - props = useCommand(_4R3V3JGP_spreadValues({ clickOnEnter: !nativeCheckbox }, props)); - return _4R3V3JGP_spreadValues({ - name: nativeCheckbox ? name : void 0, - value: nativeCheckbox ? valueProp : void 0, - checked: isChecked - }, props); - } -); -var Checkbox = createComponent((props) => { - const htmlProps = useCheckbox(props); - return _3ORBWXWF_createElement("input", htmlProps); -}); -if (false) {} - - - -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/menu/menu-item-checkbox.js -"use client"; - - - - - - - - - - - - - - - - - - - - - - - - - - -// src/menu/menu-item-checkbox.ts - - -function menu_item_checkbox_getPrimitiveValue(value) { - if (Array.isArray(value)) { - return value.toString(); - } - return value; -} -function getValue(storeValue, value, checked) { - if (value === void 0) { - if (Array.isArray(storeValue)) - return storeValue; - return !!checked; - } - const primitiveValue = menu_item_checkbox_getPrimitiveValue(value); - if (!Array.isArray(storeValue)) { - if (checked) { - return primitiveValue; - } - return storeValue === primitiveValue ? false : storeValue; - } - if (checked) { - if (storeValue.includes(primitiveValue)) { - return storeValue; - } - return [...storeValue, primitiveValue]; - } - return storeValue.filter((v) => v !== primitiveValue); -} -var useMenuItemCheckbox = createHook( - (_a) => { - var _b = _a, { - store, - name, - value, - checked, - defaultChecked: defaultCheckedProp, - hideOnClick = false - } = _b, props = __objRest(_b, [ - "store", - "name", - "value", - "checked", - "defaultChecked", - "hideOnClick" - ]); - const context = useMenuScopedContext(); - store = store || context; - invariant( - store, - false && 0 - ); - const defaultChecked = useInitialValue(defaultCheckedProp); - (0,external_React_.useEffect)(() => { - store == null ? void 0 : store.setValue(name, (prevValue = []) => { - if (!defaultChecked) - return prevValue; - return getValue(prevValue, value, true); - }); - }, [store, name, value, defaultChecked]); - (0,external_React_.useEffect)(() => { - if (checked === void 0) - return; - store == null ? void 0 : store.setValue(name, (prevValue) => { - return getValue(prevValue, value, checked); - }); - }, [store, name, value, checked]); - const checkboxStore = useCheckboxStore({ - value: store.useState((state) => state.values[name]), - setValue(internalValue) { - store == null ? void 0 : store.setValue(name, () => { - if (checked === void 0) - return internalValue; - const nextValue = getValue(internalValue, value, checked); - if (!Array.isArray(nextValue)) - return nextValue; - if (!Array.isArray(internalValue)) - return nextValue; - if (shallowEqual(internalValue, nextValue)) - return internalValue; - return nextValue; - }); - } - }); - props = _4R3V3JGP_spreadValues({ - role: "menuitemcheckbox" - }, props); - props = useCheckbox(_4R3V3JGP_spreadValues({ - store: checkboxStore, - name, - value, - checked - }, props)); - props = useMenuItem(_4R3V3JGP_spreadValues({ store, hideOnClick }, props)); - return props; - } -); -var MenuItemCheckbox = createMemoComponent( - (props) => { - const htmlProps = useMenuItemCheckbox(props); - return _3ORBWXWF_createElement("div", htmlProps); - } -); -if (false) {} - - -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/menu/menu-item-radio.js -"use client"; - - - - - - - - - - - - - - - - - - - - - - - - -// src/menu/menu-item-radio.tsx - - - -function menu_item_radio_getValue(prevValue, value, checked) { - if (checked === void 0) - return prevValue; - if (checked) - return value; - return prevValue; -} -var useMenuItemRadio = createHook( - (_a) => { - var _b = _a, { - store, - name, - value, - checked, - onChange: onChangeProp, - hideOnClick = false - } = _b, props = __objRest(_b, [ - "store", - "name", - "value", - "checked", - "onChange", - "hideOnClick" - ]); - const context = useMenuScopedContext(); - store = store || context; - invariant( - store, - false && 0 - ); - const defaultChecked = useInitialValue(props.defaultChecked); - (0,external_React_.useEffect)(() => { - store == null ? void 0 : store.setValue(name, (prevValue = false) => { - return menu_item_radio_getValue(prevValue, value, defaultChecked); - }); - }, [store, name, value, defaultChecked]); - (0,external_React_.useEffect)(() => { - if (checked === void 0) - return; - store == null ? void 0 : store.setValue(name, (prevValue) => { - return menu_item_radio_getValue(prevValue, value, checked); - }); - }, [store, name, value, checked]); - const isChecked = store.useState((state) => state.values[name] === value); - props = useWrapElement( - props, - (element) => /* @__PURE__ */ (0,external_ReactJSXRuntime_namespaceObject.jsx)(MenuItemCheckedContext.Provider, { value: !!isChecked, children: element }), - [isChecked] - ); - props = _4R3V3JGP_spreadValues({ - role: "menuitemradio" - }, props); - props = useRadio(_4R3V3JGP_spreadValues({ - name, - value, - checked: isChecked, - onChange: (event) => { - onChangeProp == null ? void 0 : onChangeProp(event); - if (event.defaultPrevented) - return; - const element = event.currentTarget; - store == null ? void 0 : store.setValue(name, (prevValue) => { - return menu_item_radio_getValue(prevValue, value, checked != null ? checked : element.checked); - }); - } - }, props)); - props = useMenuItem(_4R3V3JGP_spreadValues({ store, hideOnClick }, props)); - return props; - } -); -var MenuItemRadio = createMemoComponent( - (props) => { - const htmlProps = useMenuItemRadio(props); - return _3ORBWXWF_createElement("div", htmlProps); - } -); -if (false) {} - - -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/menu/menu-group.js -"use client"; - - - - - - - - -// src/menu/menu-group.ts -var useMenuGroup = createHook((props) => { - props = useCompositeGroup(props); - return props; -}); -var menu_group_MenuGroup = createComponent((props) => { - const htmlProps = useMenuGroup(props); - return _3ORBWXWF_createElement("div", htmlProps); -}); -if (false) {} - - -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/__chunks/ENRQQ6LK.js -"use client"; - - - - - -// src/composite/composite-separator.ts - -var useCompositeSeparator = createHook( - (_a) => { - var _b = _a, { store } = _b, props = __objRest(_b, ["store"]); - const context = useCompositeContext(); - store = store || context; - invariant( - store, - false && 0 - ); - const orientation = store.useState( - (state) => state.orientation === "horizontal" ? "vertical" : "horizontal" - ); - props = useSeparator(_4R3V3JGP_spreadProps(_4R3V3JGP_spreadValues({}, props), { orientation })); - return props; - } -); -var CompositeSeparator = createComponent( - (props) => { - const htmlProps = useCompositeSeparator(props); - return _3ORBWXWF_createElement("hr", htmlProps); - } -); -if (false) {} - - - -;// CONCATENATED MODULE: ./node_modules/@ariakit/react-core/esm/menu/menu-separator.js -"use client"; - - - - - - - - - - - - - - - -// src/menu/menu-separator.ts -var useMenuSeparator = createHook( - (_a) => { - var _b = _a, { store } = _b, props = __objRest(_b, ["store"]); - const context = useMenuContext(); - store = store || context; - props = useCompositeSeparator(_4R3V3JGP_spreadValues({ store }, props)); - return props; - } -); -var MenuSeparator = createComponent((props) => { - const htmlProps = useMenuSeparator(props); - return _3ORBWXWF_createElement("hr", htmlProps); -}); -if (false) {} - - -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/dropdown-menu-v2/styles.js - -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)."; } -/** - * External dependencies - */ -// eslint-disable-next-line no-restricted-imports - - -/** - * Internal dependencies - */ - - - - -const ANIMATION_PARAMS = { - SLIDE_AMOUNT: '2px', - DURATION: '400ms', - EASING: 'cubic-bezier( 0.16, 1, 0.3, 1 )' -}; -const CONTENT_WRAPPER_PADDING = space(1); -const ITEM_PADDING_BLOCK = space(2); -const ITEM_PADDING_INLINE = space(3); - -// TODO: -// - those values are different from saved variables? -// - should bring this into the config, and make themeable -// - border color and divider color are different? -const DEFAULT_BORDER_COLOR = COLORS.gray[300]; -const DIVIDER_COLOR = COLORS.gray[200]; -const TOOLBAR_VARIANT_BORDER_COLOR = COLORS.gray['900']; -const DEFAULT_BOX_SHADOW = `0 0 0 ${config_values.borderWidth} ${DEFAULT_BORDER_COLOR}, ${config_values.popoverShadow}`; -const TOOLBAR_VARIANT_BOX_SHADOW = `0 0 0 ${config_values.borderWidth} ${TOOLBAR_VARIANT_BORDER_COLOR}`; -const GRID_TEMPLATE_COLS = 'minmax( 0, max-content ) 1fr'; -const slideUpAndFade = emotion_react_browser_esm_keyframes({ - '0%': { - opacity: 0, - transform: `translateY(${ANIMATION_PARAMS.SLIDE_AMOUNT})` - }, - '100%': { - opacity: 1, - transform: 'translateY(0)' - } -}); -const slideRightAndFade = emotion_react_browser_esm_keyframes({ - '0%': { - opacity: 0, - transform: `translateX(-${ANIMATION_PARAMS.SLIDE_AMOUNT})` - }, - '100%': { - opacity: 1, - transform: 'translateX(0)' - } -}); -const slideDownAndFade = emotion_react_browser_esm_keyframes({ - '0%': { - opacity: 0, - transform: `translateY(-${ANIMATION_PARAMS.SLIDE_AMOUNT})` - }, - '100%': { - opacity: 1, - transform: 'translateY(0)' - } -}); -const slideLeftAndFade = emotion_react_browser_esm_keyframes({ - '0%': { - opacity: 0, - transform: `translateX(${ANIMATION_PARAMS.SLIDE_AMOUNT})` - }, - '100%': { - opacity: 1, - transform: 'translateX(0)' - } -}); -const dropdown_menu_v2_styles_DropdownMenu = /*#__PURE__*/emotion_styled_base_browser_esm(Menu, true ? { - target: "e1kdzosf12" -} : 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, ";background-color:", COLORS.ui.background, ";border-radius:4px;", props => /*#__PURE__*/emotion_react_browser_esm_css("box-shadow:", props.variant === 'toolbar' ? TOOLBAR_VARIANT_BOX_SHADOW : DEFAULT_BOX_SHADOW, ";" + ( true ? "" : 0), true ? "" : 0), " overscroll-behavior:contain;overflow:auto;outline:2px solid transparent!important;animation-duration:", ANIMATION_PARAMS.DURATION, ";animation-timing-function:", ANIMATION_PARAMS.EASING, ";will-change:transform,opacity;animation-name:", slideDownAndFade, ";&[data-side='right']{animation-name:", slideLeftAndFade, ";}&[data-side='bottom']{animation-name:", slideUpAndFade, ";}&[data-side='left']{animation-name:", slideRightAndFade, ";}@media ( prefers-reduced-motion ){animation-duration:0s;}" + ( true ? "" : 0)); -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.gray[900], ";border-radius:", config_values.radiusBlockUi, ";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]{}", dropdown_menu_v2_styles_DropdownMenu, ":not(:focus) &:not(:focus)[aria-expanded=\"true\"]{background-color:", COLORS.gray[100], ";color:", COLORS.gray[900], ";}svg{fill:currentColor;}" + ( true ? "" : 0), true ? "" : 0); -const styles_DropdownMenuItem = /*#__PURE__*/emotion_styled_base_browser_esm(Y6467XPW_MenuItem, true ? { - target: "e1kdzosf11" -} : 0)(baseItem, ";" + ( true ? "" : 0)); -const styles_DropdownMenuCheckboxItem = /*#__PURE__*/emotion_styled_base_browser_esm(MenuItemCheckbox, true ? { - target: "e1kdzosf10" -} : 0)(baseItem, ";" + ( true ? "" : 0)); -const styles_DropdownMenuRadioItem = /*#__PURE__*/emotion_styled_base_browser_esm(MenuItemRadio, true ? { - target: "e1kdzosf9" -} : 0)(baseItem, ";" + ( true ? "" : 0)); -const ItemPrefixWrapper = /*#__PURE__*/emotion_styled_base_browser_esm("span", true ? { - target: "e1kdzosf8" -} : 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:", COLORS.gray['700'], ";[data-active-item]:not( [data-focus-visible] )>&,[aria-disabled='true']>&{color:inherit;}" + ( true ? "" : 0)); -const DropdownMenuItemContentWrapper = /*#__PURE__*/emotion_styled_base_browser_esm("div", true ? { - target: "e1kdzosf7" -} : 0)("grid-column:2;display:flex;align-items:center;justify-content:space-between;gap:", space(3), ";pointer-events:none;" + ( true ? "" : 0)); -const DropdownMenuItemChildrenWrapper = /*#__PURE__*/emotion_styled_base_browser_esm("div", true ? { - target: "e1kdzosf6" -} : 0)("flex:1;display:inline-flex;flex-direction:column;gap:", space(1), ";" + ( true ? "" : 0)); -const ItemSuffixWrapper = /*#__PURE__*/emotion_styled_base_browser_esm("span", true ? { - target: "e1kdzosf5" -} : 0)("flex:0 1 fit-content;min-width:0;width:fit-content;display:flex;align-items:center;justify-content:center;gap:", space(3), ";color:", COLORS.gray['700'], ";[data-active-item]:not( [data-focus-visible] ) *:not(", dropdown_menu_v2_styles_DropdownMenu, ") &,[aria-disabled='true'] *:not(", dropdown_menu_v2_styles_DropdownMenu, ") &{color:inherit;}" + ( true ? "" : 0)); -const styles_DropdownMenuGroup = /*#__PURE__*/emotion_styled_base_browser_esm(menu_group_MenuGroup, true ? { - target: "e1kdzosf4" -} : 0)( true ? { - name: "49aokf", - styles: "display:contents" -} : 0); -const styles_DropdownMenuSeparator = /*#__PURE__*/emotion_styled_base_browser_esm(MenuSeparator, true ? { - target: "e1kdzosf3" -} : 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)); -const SubmenuChevronIcon = /*#__PURE__*/emotion_styled_base_browser_esm(build_module_icon, true ? { - target: "e1kdzosf2" -} : 0)("width:", space(1.5), ";", rtl({ - transform: `scaleX(1)` -}, { - transform: `scaleX(-1)` -}), ";" + ( true ? "" : 0)); -const styles_DropdownMenuItemLabel = /*#__PURE__*/emotion_styled_base_browser_esm(truncate_component, true ? { - target: "e1kdzosf1" -} : 0)("font-size:", font('default.fontSize'), ";line-height:20px;color:inherit;" + ( true ? "" : 0)); -const styles_DropdownMenuItemHelpText = /*#__PURE__*/emotion_styled_base_browser_esm(truncate_component, true ? { - target: "e1kdzosf0" -} : 0)("font-size:", font('helpText.fontSize'), ";line-height:16px;color:", COLORS.gray['700'], ";[data-active-item]:not( [data-focus-visible] ) *:not( ", dropdown_menu_v2_styles_DropdownMenu, " ) &,[aria-disabled='true'] *:not( ", dropdown_menu_v2_styles_DropdownMenu, " ) &{color:inherit;}" + ( true ? "" : 0)); - -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/dropdown-menu-v2/index.js -/** - * External dependencies - */ -// eslint-disable-next-line no-restricted-imports - - -/** - * WordPress dependencies - */ - - - - - -/** - * Internal dependencies - */ - - - - - - -const DropdownMenuContext = (0,external_wp_element_namespaceObject.createContext)(undefined); -const DropdownMenuItem = (0,external_wp_element_namespaceObject.forwardRef)(function DropdownMenuItem({ - prefix, - suffix, - children, - hideOnClick = true, - ...props -}, ref) { - const dropdownMenuContext = (0,external_wp_element_namespaceObject.useContext)(DropdownMenuContext); - return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(styles_DropdownMenuItem, { + }, []); + const computedDirection = useStoreState(menuContext?.store, 'rtl') ? 'rtl' : 'ltr'; + const wrapperProps = (0,external_wp_element_namespaceObject.useMemo)(() => ({ + dir: computedDirection, + style: { + direction: computedDirection + } + }), [computedDirection]); + if (!menuContext?.store) { + throw new Error('Menu.Popover can only be rendered inside a Menu component'); + } + return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Menu, { + ...otherProps, ref: ref, - ...props, - accessibleWhenDisabled: true, - hideOnClick: hideOnClick, - store: dropdownMenuContext?.store, - children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ItemPrefixWrapper, { - children: prefix - }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(DropdownMenuItemContentWrapper, { - children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(DropdownMenuItemChildrenWrapper, { - children: children - }), suffix && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ItemSuffixWrapper, { - children: suffix - })] - })] - }); -}); -const DropdownMenuCheckboxItem = (0,external_wp_element_namespaceObject.forwardRef)(function DropdownMenuCheckboxItem({ - suffix, - children, - hideOnClick = false, - ...props -}, ref) { - const dropdownMenuContext = (0,external_wp_element_namespaceObject.useContext)(DropdownMenuContext); - return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(styles_DropdownMenuCheckboxItem, { - ref: ref, - ...props, - accessibleWhenDisabled: true, - hideOnClick: hideOnClick, - store: dropdownMenuContext?.store, - children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(MenuItemCheck, { - store: dropdownMenuContext?.store, - render: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ItemPrefixWrapper, {}) - // Override some ariakit inline styles - , - style: { - width: 'auto', - height: 'auto' - }, - children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_icon, { - icon: library_check, - size: 24 + modal: modal, + store: menuContext.store + // Root menu has an 8px distance from its trigger, + // otherwise 0 (which causes the submenu to slightly overlap) + , + gutter: gutter !== null && gutter !== void 0 ? gutter : menuContext.store.parent ? 0 : 8 + // Align nested menu by the same (but opposite) amount + // as the menu container's padding. + , + shift: shift !== null && shift !== void 0 ? shift : menuContext.store.parent ? -4 : 0, + hideOnHoverOutside: false, + "data-side": appliedPlacementSide, + wrapperProps: wrapperProps, + hideOnEscape: hideOnEscape, + unmountOnHide: true, + render: renderProps => + /*#__PURE__*/ + // Two wrappers are needed for the entry animation, where the menu + // container scales with a different factor than its contents. + // The {...renderProps} are passed to the inner wrapper, so that the + // menu element is the direct parent of the menu item elements. + (0,external_ReactJSXRuntime_namespaceObject.jsx)(PopoverOuterWrapper, { + variant: menuContext.variant, + children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(PopoverInnerWrapper, { + ...renderProps }) - }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(DropdownMenuItemContentWrapper, { - children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(DropdownMenuItemChildrenWrapper, { - children: children - }), suffix && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ItemSuffixWrapper, { - children: suffix - })] - })] - }); -}); -const radioCheck = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { - xmlns: "http://www.w3.org/2000/svg", - viewBox: "0 0 24 24", - children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Circle, { - cx: 12, - cy: 12, - r: 3 - }) -}); -const DropdownMenuRadioItem = (0,external_wp_element_namespaceObject.forwardRef)(function DropdownMenuRadioItem({ - suffix, - children, - hideOnClick = false, - ...props -}, ref) { - const dropdownMenuContext = (0,external_wp_element_namespaceObject.useContext)(DropdownMenuContext); - return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(styles_DropdownMenuRadioItem, { - ref: ref, - ...props, - accessibleWhenDisabled: true, - hideOnClick: hideOnClick, - store: dropdownMenuContext?.store, - children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(MenuItemCheck, { - store: dropdownMenuContext?.store, - render: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ItemPrefixWrapper, {}) - // Override some ariakit inline styles - , - style: { - width: 'auto', - height: 'auto' - }, - children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_icon, { - icon: radioCheck, - size: 24 - }) - }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(DropdownMenuItemContentWrapper, { - children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(DropdownMenuItemChildrenWrapper, { - children: children - }), suffix && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(ItemSuffixWrapper, { - children: suffix - })] - })] - }); -}); -const DropdownMenuGroup = (0,external_wp_element_namespaceObject.forwardRef)(function DropdownMenuGroup(props, ref) { - const dropdownMenuContext = (0,external_wp_element_namespaceObject.useContext)(DropdownMenuContext); - return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(styles_DropdownMenuGroup, { - ref: ref, - ...props, - store: dropdownMenuContext?.store - }); -}); -const dropdown_menu_v2_UnconnectedDropdownMenu = (props, ref) => { - var _props$placement; - const { - // Store props + }), + children: children + }); +}); + +;// ./node_modules/@wordpress/components/build-module/menu/index.js +/** + * External dependencies + */ + + +/** + * WordPress dependencies + */ + + + +/** + * Internal dependencies + */ + + + + + + + + + + + + + + +const UnconnectedMenu = props => { + const { + children, + defaultOpen = false, open, - defaultOpen = false, onOpenChange, placement, - // Menu trigger props - trigger, - // Menu props - gutter, - children, - shift, - modal = true, // From internal components context - variant, - // Rest - ...otherProps - } = useContextSystem(props, 'DropdownMenu'); - const parentContext = (0,external_wp_element_namespaceObject.useContext)(DropdownMenuContext); - const computedDirection = (0,external_wp_i18n_namespaceObject.isRTL)() ? 'rtl' : 'ltr'; + variant + } = useContextSystem(props, 'Menu'); + const parentContext = (0,external_wp_element_namespaceObject.useContext)(context_Context); + const rtl = (0,external_wp_i18n_namespaceObject.isRTL)(); // If an explicit value for the `placement` prop is not passed, - // apply a default placement of `bottom-start` for the root dropdown, - // and of `right-start` for nested dropdowns. - let computedPlacement = (_props$placement = props.placement) !== null && _props$placement !== void 0 ? _props$placement : parentContext?.store ? 'right-start' : 'bottom-start'; + // apply a default placement of `bottom-start` for the root menu popover, + // and of `right-start` for nested menu popovers. + let computedPlacement = placement !== null && placement !== void 0 ? placement : parentContext?.store ? 'right-start' : 'bottom-start'; // Swap left/right in case of RTL direction - if (computedDirection === 'rtl') { + if (rtl) { if (/right/.test(computedPlacement)) { computedPlacement = computedPlacement.replace('right', 'left'); } else if (/left/.test(computedPlacement)) { computedPlacement = computedPlacement.replace('left', 'right'); } } - const dropdownMenuStore = useMenuStore({ + const menuStore = useMenuStore({ parent: parentContext?.store, open, defaultOpen, @@ -73194,98 +71388,131 @@ setOpen(willBeOpen) { onOpenChange?.(willBeOpen); }, - rtl: computedDirection === 'rtl' + rtl }); const contextValue = (0,external_wp_element_namespaceObject.useMemo)(() => ({ - store: dropdownMenuStore, + store: menuStore, variant - }), [dropdownMenuStore, variant]); - - // Extract the side from the applied placement — useful for animations. - const appliedPlacementSide = dropdownMenuStore.useState('placement').split('-')[0]; - if (dropdownMenuStore.parent && !((0,external_wp_element_namespaceObject.isValidElement)(trigger) && DropdownMenuItem === trigger.type)) { - // eslint-disable-next-line no-console - console.warn('For nested DropdownMenus, the `trigger` should always be a `DropdownMenuItem`.'); - } - const hideOnEscape = (0,external_wp_element_namespaceObject.useCallback)(event => { - // Pressing Escape can cause unexpected consequences (ie. exiting - // full screen mode on MacOs, close parent modals...). - event.preventDefault(); - // Returning `true` causes the menu to hide. - return true; - }, []); - const wrapperProps = (0,external_wp_element_namespaceObject.useMemo)(() => ({ - dir: computedDirection, - style: { - direction: computedDirection - } - }), [computedDirection]); - return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { - children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(MenuButton, { - ref: ref, - store: dropdownMenuStore, - render: dropdownMenuStore.parent ? (0,external_wp_element_namespaceObject.cloneElement)(trigger, { - // Add submenu arrow, unless a `suffix` is explicitly specified - suffix: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, { - children: [trigger.props.suffix, /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(SubmenuChevronIcon, { - "aria-hidden": "true", - icon: chevron_right_small, - size: 24, - preserveAspectRatio: "xMidYMid slice" - })] - }) - }) : trigger - }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(dropdown_menu_v2_styles_DropdownMenu, { - ...otherProps, - modal: modal, - store: dropdownMenuStore - // Root menu has an 8px distance from its trigger, - // otherwise 0 (which causes the submenu to slightly overlap) - , - gutter: gutter !== null && gutter !== void 0 ? gutter : dropdownMenuStore.parent ? 0 : 8 - // Align nested menu by the same (but opposite) amount - // as the menu container's padding. - , - shift: shift !== null && shift !== void 0 ? shift : dropdownMenuStore.parent ? -4 : 0, - hideOnHoverOutside: false, - "data-side": appliedPlacementSide, - variant: variant, - wrapperProps: wrapperProps, - hideOnEscape: hideOnEscape, - unmountOnHide: true, - children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(DropdownMenuContext.Provider, { - value: contextValue, - children: children - }) - })] - }); -}; -const dropdown_menu_v2_DropdownMenu = contextConnect(dropdown_menu_v2_UnconnectedDropdownMenu, 'DropdownMenu'); -const DropdownMenuSeparator = (0,external_wp_element_namespaceObject.forwardRef)(function DropdownMenuSeparator(props, ref) { - const dropdownMenuContext = (0,external_wp_element_namespaceObject.useContext)(DropdownMenuContext); - return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(styles_DropdownMenuSeparator, { - ref: ref, - ...props, - store: dropdownMenuContext?.store, - variant: dropdownMenuContext?.variant - }); -}); -const DropdownMenuItemLabel = (0,external_wp_element_namespaceObject.forwardRef)(function DropdownMenuItemLabel(props, ref) { - return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(styles_DropdownMenuItemLabel, { - numberOfLines: 1, - ref: ref, - ...props - }); -}); -const DropdownMenuItemHelpText = (0,external_wp_element_namespaceObject.forwardRef)(function DropdownMenuItemHelpText(props, ref) { - return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(styles_DropdownMenuItemHelpText, { - numberOfLines: 2, - ref: ref, - ...props - }); -}); - -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/theme/styles.js + }), [menuStore, variant]); + return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(context_Context.Provider, { + value: contextValue, + children: children + }); +}; + +/** + * Menu is a collection of React components that combine to render + * ARIA-compliant [menu](https://www.w3.org/WAI/ARIA/apg/patterns/menu/) and + * [menu button](https://www.w3.org/WAI/ARIA/apg/patterns/menubutton/) patterns. + * + * `Menu` itself is a wrapper component and context provider. + * It is responsible for managing the state of the menu and its items, and for + * rendering the `Menu.TriggerButton` (or the `Menu.SubmenuTriggerItem`) + * component, and the `Menu.Popover` component. + */ +const menu_Menu = Object.assign(contextConnectWithoutRef(UnconnectedMenu, 'Menu'), { + Context: Object.assign(context_Context, { + displayName: 'Menu.Context' + }), + /** + * Renders a menu item inside the `Menu.Popover` or `Menu.Group` components. + * + * It can optionally contain one instance of the `Menu.ItemLabel` component + * and one instance of the `Menu.ItemHelpText` component. + */ + Item: Object.assign(item_Item, { + displayName: 'Menu.Item' + }), + /** + * Renders a radio menu item inside the `Menu.Popover` or `Menu.Group` + * components. + * + * It can optionally contain one instance of the `Menu.ItemLabel` component + * and one instance of the `Menu.ItemHelpText` component. + */ + RadioItem: Object.assign(RadioItem, { + displayName: 'Menu.RadioItem' + }), + /** + * Renders a checkbox menu item inside the `Menu.Popover` or `Menu.Group` + * components. + * + * It can optionally contain one instance of the `Menu.ItemLabel` component + * and one instance of the `Menu.ItemHelpText` component. + */ + CheckboxItem: Object.assign(CheckboxItem, { + displayName: 'Menu.CheckboxItem' + }), + /** + * Renders a group for menu items. + * + * It should contain one instance of `Menu.GroupLabel` and one or more + * instances of `Menu.Item`, `Menu.RadioItem`, or `Menu.CheckboxItem`. + */ + Group: Object.assign(group_Group, { + displayName: 'Menu.Group' + }), + /** + * Renders a label in a menu group. + * + * This component should be wrapped with `Menu.Group` so the + * `aria-labelledby` is correctly set on the group element. + */ + GroupLabel: Object.assign(group_label_GroupLabel, { + displayName: 'Menu.GroupLabel' + }), + /** + * Renders a divider between menu items or menu groups. + */ + Separator: Object.assign(separator_Separator, { + displayName: 'Menu.Separator' + }), + /** + * Renders a menu item's label text. It should be wrapped with `Menu.Item`, + * `Menu.RadioItem`, or `Menu.CheckboxItem`. + */ + ItemLabel: Object.assign(ItemLabel, { + displayName: 'Menu.ItemLabel' + }), + /** + * Renders a menu item's help text. It should be wrapped with `Menu.Item`, + * `Menu.RadioItem`, or `Menu.CheckboxItem`. + */ + ItemHelpText: Object.assign(ItemHelpText, { + displayName: 'Menu.ItemHelpText' + }), + /** + * Renders a dropdown menu element that's controlled by a sibling + * `Menu.TriggerButton` component. It renders a popover and automatically + * focuses on items when the menu is shown. + * + * The only valid children of `Menu.Popover` are `Menu.Item`, + * `Menu.RadioItem`, `Menu.CheckboxItem`, `Menu.Group`, `Menu.Separator`, + * and `Menu` (for nested dropdown menus). + */ + Popover: Object.assign(menu_popover_Popover, { + displayName: 'Menu.Popover' + }), + /** + * Renders a menu button that toggles the visibility of a sibling + * `Menu.Popover` component when clicked or when using arrow keys. + */ + TriggerButton: Object.assign(TriggerButton, { + displayName: 'Menu.TriggerButton' + }), + /** + * Renders a menu item that toggles the visibility of a sibling + * `Menu.Popover` component when clicked or when using arrow keys. + * + * This component is used to create a nested dropdown menu. + */ + SubmenuTriggerItem: Object.assign(SubmenuTriggerItem, { + displayName: 'Menu.SubmenuTriggerItem' + }) +}); +/* harmony default export */ const build_module_menu = ((/* unused pure expression or super */ null && (menu_Menu))); + +;// ./node_modules/@wordpress/components/build-module/theme/styles.js 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)."; } /** @@ -73311,7 +71538,7 @@ styles: "color:var( --wp-components-color-foreground, currentColor )" } : 0); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/theme/color-algorithms.js +;// ./node_modules/@wordpress/components/build-module/theme/color-algorithms.js /** * External dependencies */ @@ -73417,7 +71644,7 @@ return result; } -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/theme/index.js +;// ./node_modules/@wordpress/components/build-module/theme/index.js /** * WordPress dependencies */ @@ -73469,7 +71696,7 @@ } /* harmony default export */ const theme = (Theme); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/tabs/context.js +;// ./node_modules/@wordpress/components/build-module/tabs/context.js /** * WordPress dependencies */ @@ -73482,40 +71709,51 @@ const TabsContext = (0,external_wp_element_namespaceObject.createContext)(undefined); const useTabsContext = () => (0,external_wp_element_namespaceObject.useContext)(TabsContext); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/tabs/styles.js - -/** - * External dependencies - */ - -// eslint-disable-next-line no-restricted-imports - - -/** - * Internal dependencies - */ - - -const TabListWrapper = /*#__PURE__*/emotion_styled_base_browser_esm("div", true ? { +;// ./node_modules/@wordpress/components/build-module/tabs/styles.js + +function tabs_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)."; } +/** + * External dependencies + */ + + + +/** + * Internal dependencies + */ + + + +const StyledTabList = /*#__PURE__*/emotion_styled_base_browser_esm(TabList, true ? { + target: "enfox0g4" +} : 0)("display:flex;align-items:stretch;overflow-x:auto;&[aria-orientation='vertical']{flex-direction:column;}:where( [aria-orientation='horizontal'] ){width:fit-content;}--direction-factor:1;--direction-start:left;--direction-end:right;--selected-start:var( --selected-left, 0 );&:dir( rtl ){--direction-factor:-1;--direction-start:right;--direction-end:left;--selected-start:var( --selected-right, 0 );}@media not ( prefers-reduced-motion ){&[data-indicator-animated]::before{transition-property:transform,border-radius,border-block;transition-duration:0.2s;transition-timing-function:ease-out;}}position:relative;&::before{content:'';position:absolute;pointer-events:none;transform-origin:var( --direction-start ) top;outline:2px solid transparent;outline-offset:-1px;}--antialiasing-factor:100;&[aria-orientation='horizontal']{--fade-width:4rem;--fade-gradient-base:transparent 0%,black var( --fade-width );--fade-gradient-composed:var( --fade-gradient-base ),black 60%,transparent 50%;&.is-overflowing-first{mask-image:linear-gradient(\n\t\t\t\tto var( --direction-end ),\n\t\t\t\tvar( --fade-gradient-base )\n\t\t\t);}&.is-overflowing-last{mask-image:linear-gradient(\n\t\t\t\tto var( --direction-start ),\n\t\t\t\tvar( --fade-gradient-base )\n\t\t\t);}&.is-overflowing-first.is-overflowing-last{mask-image:linear-gradient(\n\t\t\t\t\tto right,\n\t\t\t\t\tvar( --fade-gradient-composed )\n\t\t\t\t),linear-gradient( to left, var( --fade-gradient-composed ) );}&::before{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( --selected-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( --selected-width, 0 ) /\n\t\t\t\t\t\t\tvar( --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']{&::before{border-radius:", config_values.radiusSmall, "/calc(\n\t\t\t\t\t", config_values.radiusSmall, " /\n\t\t\t\t\t\t(\n\t\t\t\t\t\t\tvar( --selected-height, 0 ) /\n\t\t\t\t\t\t\t\tvar( --antialiasing-factor )\n\t\t\t\t\t\t)\n\t\t\t\t);top:0;left:0;width:100%;height:calc( var( --antialiasing-factor ) * 1px );transform:translateY( calc( var( --selected-top, 0 ) * 1px ) ) scaleY(\n\t\t\t\t\tcalc(\n\t\t\t\t\t\tvar( --selected-height, 0 ) /\n\t\t\t\t\t\t\tvar( --antialiasing-factor )\n\t\t\t\t\t)\n\t\t\t\t);background-color:color-mix(\n\t\t\t\tin srgb,\n\t\t\t\t", COLORS.theme.accent, ",\n\t\t\t\ttransparent 96%\n\t\t\t);}&[data-select-on-move='true']:has(\n\t\t\t\t:is( :focus-visible, [data-focus-visible] )\n\t\t\t)::before{box-sizing:border-box;border:var( --wp-admin-border-width-focus ) solid ", COLORS.theme.accent, ";border-block-width:calc(\n\t\t\t\tvar( --wp-admin-border-width-focus, 1px ) /\n\t\t\t\t\t(\n\t\t\t\t\t\tvar( --selected-height, 0 ) /\n\t\t\t\t\t\t\tvar( --antialiasing-factor )\n\t\t\t\t\t)\n\t\t\t);}}" + ( true ? "" : 0)); +const styles_Tab = /*#__PURE__*/emotion_styled_base_browser_esm(Tab, true ? { + target: "enfox0g3" +} : 0)("&{border-radius:0;background:transparent;border:none;box-shadow:none;flex:1 0 auto;white-space:nowrap;display:flex;align-items:center;cursor:pointer;line-height:1.2;font-weight:400;color:", COLORS.theme.foreground, ";position:relative;&[aria-disabled='true']{cursor:default;color:", COLORS.ui.textDisabled, ";}&:not( [aria-disabled='true'] ):is( :hover, [data-focus-visible] ){color:", COLORS.theme.accent, ";}&:focus:not( :disabled ){box-shadow:none;outline:none;}&::after{position:absolute;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;}}&[data-focus-visible]::after{opacity:1;}}[aria-orientation='horizontal'] &{padding-inline:", space(4), ";height:", space(12), ";scroll-margin:24px;&::after{content:'';inset:", space(3), ";}}[aria-orientation='vertical'] &{padding:", space(2), " ", space(3), ";min-height:", space(10), ";&[aria-selected='true']{color:", COLORS.theme.accent, ";fill:currentColor;}}[aria-orientation='vertical'][data-select-on-move='false'] &::after{content:'';inset:var( --wp-admin-border-width-focus );}" + ( true ? "" : 0)); +const TabChildren = /*#__PURE__*/emotion_styled_base_browser_esm("span", true ? { target: "enfox0g2" -} : 0)("position:relative;display:flex;align-items:stretch;flex-direction:row;&[aria-orientation='vertical']{flex-direction:column;}@media not ( prefers-reduced-motion: reduce ){&.is-animation-enabled::after{transition-property:left,top,width,height;transition-duration:0.2s;transition-timing-function:ease-out;}}&::after{content:'';position:absolute;pointer-events:none;outline:2px solid transparent;outline-offset:-1px;}&:not( [aria-orientation='vertical'] )::after{left:var( --indicator-left );bottom:0;width:var( --indicator-width );height:0;border-bottom:var( --wp-admin-border-width-focus ) solid ", COLORS.theme.accent, ";}&[aria-orientation='vertical']::after{opacity:0;right:0;top:var( --indicator-top );height:var( --indicator-height );border-right:var( --wp-admin-border-width-focus ) solid ", COLORS.theme.accent, ";}" + ( true ? "" : 0)); -const styles_Tab = /*#__PURE__*/emotion_styled_base_browser_esm(Tab, true ? { +} : 0)( true ? { + name: "9at4z3", + styles: "flex-grow:1;display:flex;align-items:center;[aria-orientation='horizontal'] &{justify-content:center;}[aria-orientation='vertical'] &{justify-content:start;}" +} : 0); +const TabChevron = /*#__PURE__*/emotion_styled_base_browser_esm(build_module_icon, true ? { target: "enfox0g1" -} : 0)("&{display:inline-flex;align-items:center;position:relative;border-radius:0;height:", space(12), ";background:transparent;border:none;box-shadow:none;cursor:pointer;padding:3px ", space(4), ";margin-left:0;font-weight:500;&[aria-disabled='true']{cursor:default;opacity:0.3;}&: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;box-shadow:0 0 0 var( --wp-admin-border-width-focus ) ", COLORS.theme.accent, ";border-radius:2px;opacity:0;@media not ( prefers-reduced-motion ){transition:opacity 0.1s linear;}}&:focus-visible::before{opacity:1;outline:2px solid transparent;}}" + ( true ? "" : 0)); +} : 0)("flex-shrink:0;margin-inline-end:", space(-1), ";[aria-orientation='horizontal'] &{display:none;}opacity:0;[role='tab']:is( [aria-selected='true'], [data-focus-visible], :hover ) &{opacity:1;}@media not ( prefers-reduced-motion ){[data-select-on-move='true'] [role='tab']:is( [aria-selected='true'], ) &{transition:opacity 0.15s 0.15s linear;}}&:dir( rtl ){rotate:180deg;}" + ( true ? "" : 0)); const styles_TabPanel = /*#__PURE__*/emotion_styled_base_browser_esm(TabPanel, true ? { target: "enfox0g0" -} : 0)("&:focus{box-shadow:none;outline:none;}&:focus-visible{border-radius:2px;box-shadow:0 0 0 var( --wp-admin-border-width-focus ) ", COLORS.theme.accent, ";outline:2px solid transparent;outline-offset:0;}" + ( true ? "" : 0)); - -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/tabs/tab.js -/** - * WordPress dependencies - */ - - - -/** - * Internal dependencies - */ +} : 0)("&:focus{box-shadow:none;outline:none;}&[data-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)); + +;// ./node_modules/@wordpress/components/build-module/tabs/tab.js +/** + * WordPress dependencies + */ + + + +/** + * Internal dependencies + */ + @@ -73528,148 +71766,204 @@ render, ...otherProps }, ref) { - const context = useTabsContext(); - if (!context) { - true ? external_wp_warning_default()('`Tabs.Tab` must be wrapped in a `Tabs` component.') : 0; - return null; - } + var _useTabsContext; const { store, instanceId - } = context; + } = (_useTabsContext = useTabsContext()) !== null && _useTabsContext !== void 0 ? _useTabsContext : {}; + if (!store) { + true ? external_wp_warning_default()('`Tabs.Tab` must be wrapped in a `Tabs` component.') : 0; + return null; + } const instancedTabId = `${instanceId}-${tabId}`; - return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(styles_Tab, { + return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(styles_Tab, { ref: ref, store: store, id: instancedTabId, disabled: disabled, render: render, ...otherProps, - children: children - }); -}); - -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/tabs/tablist.js -/** - * External dependencies - */ -// eslint-disable-next-line no-restricted-imports - - -/** - * WordPress dependencies - */ - - - -/** - * Internal dependencies - */ - - - - - -function useTrackElementOffset(targetElement, onUpdate) { - const [indicatorPosition, setIndicatorPosition] = (0,external_wp_element_namespaceObject.useState)({ - left: 0, - top: 0, - width: 0, - height: 0 - }); - - // TODO: replace with useEventCallback or similar when officially available. - const updateCallbackRef = (0,external_wp_element_namespaceObject.useRef)(onUpdate); + children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(TabChildren, { + children: children + }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(TabChevron, { + icon: chevron_right + })] + }); +}); + +;// ./node_modules/@wordpress/components/build-module/tabs/use-track-overflow.js +/* eslint-disable jsdoc/require-param */ +/** + * WordPress dependencies + */ + + + +/** + * Tracks if an element contains overflow and on which end by tracking the + * first and last child elements with an `IntersectionObserver` in relation + * to the parent element. + * + * Note that the returned value will only indicate whether the first or last + * element is currently "going out of bounds" but not whether it happens on + * the X or Y axis. + */ +function useTrackOverflow(parent, children) { + const [first, setFirst] = (0,external_wp_element_namespaceObject.useState)(false); + const [last, setLast] = (0,external_wp_element_namespaceObject.useState)(false); + const [observer, setObserver] = (0,external_wp_element_namespaceObject.useState)(); + const callback = (0,external_wp_compose_namespaceObject.useEvent)(entries => { + for (const entry of entries) { + if (entry.target === children.first) { + setFirst(!entry.isIntersecting); + } + if (entry.target === children.last) { + setLast(!entry.isIntersecting); + } + } + }); + (0,external_wp_element_namespaceObject.useEffect)(() => { + if (!parent || !window.IntersectionObserver) { + return; + } + const newObserver = new IntersectionObserver(callback, { + root: parent, + threshold: 0.9 + }); + setObserver(newObserver); + return () => newObserver.disconnect(); + }, [callback, parent]); + (0,external_wp_element_namespaceObject.useEffect)(() => { + if (!observer) { + return; + } + if (children.first) { + observer.observe(children.first); + } + if (children.last) { + observer.observe(children.last); + } + return () => { + if (children.first) { + observer.unobserve(children.first); + } + if (children.last) { + observer.unobserve(children.last); + } + }; + }, [children.first, children.last, observer]); + return { + first, + last + }; +} +/* eslint-enable jsdoc/require-param */ + +;// ./node_modules/@wordpress/components/build-module/tabs/tablist.js +/** + * External dependencies + */ + + + +/** + * WordPress dependencies + */ + + + + +/** + * Internal dependencies + */ + + + + + + + +const DEFAULT_SCROLL_MARGIN = 24; + +/** + * Scrolls a given parent element so that a given rect is visible. + * + * The scroll is updated initially and whenever the rect changes. + */ +function useScrollRectIntoView(parent, rect, { + margin = DEFAULT_SCROLL_MARGIN +} = {}) { (0,external_wp_element_namespaceObject.useLayoutEffect)(() => { - updateCallbackRef.current = onUpdate; - }); - const observedElementRef = (0,external_wp_element_namespaceObject.useRef)(); - const resizeObserverRef = (0,external_wp_element_namespaceObject.useRef)(); - (0,external_wp_element_namespaceObject.useEffect)(() => { - if (targetElement === observedElementRef.current) { - return; - } - observedElementRef.current = targetElement !== null && targetElement !== void 0 ? targetElement : undefined; - function updateIndicator(element) { - setIndicatorPosition({ - // Workaround to prevent unwanted scrollbars, see: - // https://github.com/WordPress/gutenberg/pull/61979 - left: Math.max(element.offsetLeft - 1, 0), - top: Math.max(element.offsetTop - 1, 0), - width: parseFloat(getComputedStyle(element).width), - height: parseFloat(getComputedStyle(element).height) - }); - updateCallbackRef.current?.(); - } - - // Set up a ResizeObserver. - if (!resizeObserverRef.current) { - resizeObserverRef.current = new ResizeObserver(() => { - if (observedElementRef.current) { - updateIndicator(observedElementRef.current); - } - }); + if (!parent || !rect) { + return; } const { - current: resizeObserver - } = resizeObserverRef; - - // Observe new element. - if (targetElement) { - updateIndicator(targetElement); - resizeObserver.observe(targetElement); - } - return () => { - // Unobserve previous element. - if (observedElementRef.current) { - resizeObserver.unobserve(observedElementRef.current); - } - }; - }, [targetElement]); - return indicatorPosition; -} -function useOnValueUpdate(value, onUpdate) { - const previousValueRef = (0,external_wp_element_namespaceObject.useRef)(value); - - // TODO: replace with useEventCallback or similar when officially available. - const updateCallbackRef = (0,external_wp_element_namespaceObject.useRef)(onUpdate); - (0,external_wp_element_namespaceObject.useLayoutEffect)(() => { - updateCallbackRef.current = onUpdate; - }); - (0,external_wp_element_namespaceObject.useEffect)(() => { - if (previousValueRef.current !== value) { - updateCallbackRef.current({ - previousValue: previousValueRef.current - }); - previousValueRef.current = value; - } - }, [value]); -} -const TabList = (0,external_wp_element_namespaceObject.forwardRef)(function TabList({ + scrollLeft: parentScroll + } = parent; + const parentWidth = parent.getBoundingClientRect().width; + const { + left: childLeft, + width: childWidth + } = rect; + const parentRightEdge = parentScroll + parentWidth; + const childRightEdge = childLeft + childWidth; + const rightOverflow = childRightEdge + margin - parentRightEdge; + const leftOverflow = parentScroll - (childLeft - margin); + let scrollLeft = null; + if (leftOverflow > 0) { + scrollLeft = parentScroll - leftOverflow; + } else if (rightOverflow > 0) { + scrollLeft = parentScroll + rightOverflow; + } + if (scrollLeft !== null) { + /** + * The optional chaining is used here to avoid unit test failures. + * It can be removed when JSDOM supports `Element` scroll methods. + * See: https://github.com/WordPress/gutenberg/pull/66498#issuecomment-2441146096 + */ + parent.scroll?.({ + left: scrollLeft + }); + } + }, [margin, parent, rect]); +} +const tablist_TabList = (0,external_wp_element_namespaceObject.forwardRef)(function TabList({ children, ...otherProps }, ref) { - const context = useTabsContext(); - const selectedId = context?.store.useState('selectedId'); - const indicatorPosition = useTrackElementOffset(context?.store.item(selectedId)?.element); - const [animationEnabled, setAnimationEnabled] = (0,external_wp_element_namespaceObject.useState)(false); - useOnValueUpdate(selectedId, ({ - previousValue - }) => previousValue && setAnimationEnabled(true)); - if (!context) { - true ? external_wp_warning_default()('`Tabs.TabList` must be wrapped in a `Tabs` component.') : 0; - return null; - } + var _useTabsContext; const { store - } = context; - const { - activeId, - selectOnMove - } = store.useState(); - const { - setActiveId - } = store; + } = (_useTabsContext = useTabsContext()) !== null && _useTabsContext !== void 0 ? _useTabsContext : {}; + const selectedId = useStoreState(store, 'selectedId'); + const activeId = useStoreState(store, 'activeId'); + const selectOnMove = useStoreState(store, 'selectOnMove'); + const items = useStoreState(store, 'items'); + const [parent, setParent] = (0,external_wp_element_namespaceObject.useState)(); + const refs = (0,external_wp_compose_namespaceObject.useMergeRefs)([ref, setParent]); + const selectedItem = store?.item(selectedId); + const renderedItems = useStoreState(store, 'renderedItems'); + const selectedItemIndex = renderedItems && selectedItem ? renderedItems.indexOf(selectedItem) : -1; + // Use selectedItemIndex as a dependency to force recalculation when the + // selected item index changes (elements are swapped / added / removed). + const selectedRect = useTrackElementOffsetRect(selectedItem?.element, [selectedItemIndex]); + + // Track overflow to show scroll hints. + const overflow = useTrackOverflow(parent, { + first: items?.at(0)?.element, + last: items?.at(-1)?.element + }); + + // Size, position, and animate the indicator. + useAnimatedOffsetRect(parent, selectedRect, { + prefix: 'selected', + dataAttribute: 'indicator-animated', + transitionEndFilter: event => event.pseudoElement === '::before', + roundRect: true + }); + + // Make sure selected tab is scrolled into view. + useScrollRectIntoView(parent, selectedRect); const onBlur = () => { if (!selectOnMove) { return; @@ -73680,38 +71974,42 @@ // that the selected tab will receive keyboard focus when tabbing back into // the tablist. if (selectedId !== activeId) { - setActiveId(selectedId); - } - }; - return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(tab_list_TabList, { - ref: ref, + store?.setActiveId(selectedId); + } + }; + if (!store) { + true ? external_wp_warning_default()('`Tabs.TabList` must be wrapped in a `Tabs` component.') : 0; + return null; + } + return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(StyledTabList, { + ref: refs, store: store, - render: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(TabListWrapper, { - onTransitionEnd: event => { - if (event.pseudoElement === '::after') { - setAnimationEnabled(false); - } - } - }), + render: props => { + var _props$tabIndex; + return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", { + ...props, + // Fallback to -1 to prevent browsers from making the tablist + // tabbable when it is a scrolling container. + tabIndex: (_props$tabIndex = props.tabIndex) !== null && _props$tabIndex !== void 0 ? _props$tabIndex : -1 + }); + }, onBlur: onBlur, + "data-select-on-move": selectOnMove ? 'true' : 'false', ...otherProps, - style: { - '--indicator-left': `${indicatorPosition.left}px`, - '--indicator-top': `${indicatorPosition.top}px`, - '--indicator-width': `${indicatorPosition.width}px`, - '--indicator-height': `${indicatorPosition.height}px`, - ...otherProps.style - }, - className: dist_clsx(animationEnabled ? 'is-animation-enabled' : '', otherProps.className), + className: dist_clsx(overflow.first && 'is-overflowing-first', overflow.last && 'is-overflowing-last', otherProps.className), children: children }); }); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/tabs/tabpanel.js -/** - * WordPress dependencies - */ - +;// ./node_modules/@wordpress/components/build-module/tabs/tabpanel.js +/** + * External dependencies + */ + + +/** + * WordPress dependencies + */ /** @@ -73729,6 +72027,7 @@ ...otherProps }, ref) { const context = useTabsContext(); + const selectedId = useStoreState(context?.store, 'selectedId'); if (!context) { true ? external_wp_warning_default()('`Tabs.TabPanel` must be wrapped in a `Tabs` component.') : 0; return null; @@ -73738,7 +72037,6 @@ instanceId } = context; const instancedTabId = `${instanceId}-${tabId}`; - const selectedId = store.useState(state => state.selectedId); return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(styles_TabPanel, { ref: ref, store: store @@ -73754,150 +72052,80 @@ }); }); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/tabs/index.js -/** - * External dependencies - */ -// eslint-disable-next-line no-restricted-imports - - -/** - * WordPress dependencies - */ - - - -/** - * Internal dependencies - */ - - - - - - -function Tabs({ +;// ./node_modules/@wordpress/components/build-module/tabs/index.js +/** + * External dependencies + */ + + +/** + * WordPress dependencies + */ + + + + +/** + * Internal dependencies + */ + + + + + + +function externalToInternalTabId(externalId, instanceId) { + return externalId && `${instanceId}-${externalId}`; +} +function internalToExternalTabId(internalId, instanceId) { + return typeof internalId === 'string' ? internalId.replace(`${instanceId}-`, '') : internalId; +} + +/** + * Tabs is a collection of React components that combine to render + * an [ARIA-compliant tabs pattern](https://www.w3.org/WAI/ARIA/apg/patterns/tabs/). + * + * Tabs organizes content across different screens, data sets, and interactions. + * It has two sections: a list of tabs, and the view to show when a tab is chosen. + * + * `Tabs` itself is a wrapper component and context provider. + * It is responsible for managing the state of the tabs, and rendering one instance of the `Tabs.TabList` component and one or more instances of the `Tab.TabPanel` component. + */ +const Tabs = Object.assign(function Tabs({ selectOnMove = true, defaultTabId, orientation = 'horizontal', onSelect, children, - selectedTabId + selectedTabId, + activeTabId, + defaultActiveTabId, + onActiveTabIdChange }) { const instanceId = (0,external_wp_compose_namespaceObject.useInstanceId)(Tabs, 'tabs'); const store = useTabStore({ selectOnMove, orientation, - defaultSelectedId: defaultTabId && `${instanceId}-${defaultTabId}`, - setSelectedId: selectedId => { - const strippedDownId = typeof selectedId === 'string' ? selectedId.replace(`${instanceId}-`, '') : selectedId; - onSelect?.(strippedDownId); - }, - selectedId: selectedTabId && `${instanceId}-${selectedTabId}` - }); - const isControlled = selectedTabId !== undefined; + defaultSelectedId: externalToInternalTabId(defaultTabId, instanceId), + setSelectedId: newSelectedId => { + onSelect?.(internalToExternalTabId(newSelectedId, instanceId)); + }, + selectedId: externalToInternalTabId(selectedTabId, instanceId), + defaultActiveId: externalToInternalTabId(defaultActiveTabId, instanceId), + setActiveId: newActiveId => { + onActiveTabIdChange?.(internalToExternalTabId(newActiveId, instanceId)); + }, + activeId: externalToInternalTabId(activeTabId, instanceId), + rtl: (0,external_wp_i18n_namespaceObject.isRTL)() + }); const { items, - selectedId, activeId - } = store.useState(); - const { - setSelectedId, + } = useStoreState(store); + const { setActiveId } = store; - - // Keep track of whether tabs have been populated. This is used to prevent - // certain effects from firing too early while tab data and relevant - // variables are undefined during the initial render. - const tabsHavePopulated = (0,external_wp_element_namespaceObject.useRef)(false); - if (items.length > 0) { - tabsHavePopulated.current = true; - } - const selectedTab = items.find(item => item.id === selectedId); - const firstEnabledTab = items.find(item => { - // Ariakit internally refers to disabled tabs as `dimmed`. - return !item.dimmed; - }); - const initialTab = items.find(item => item.id === `${instanceId}-${defaultTabId}`); - - // Handle selecting the initial tab. - (0,external_wp_element_namespaceObject.useLayoutEffect)(() => { - if (isControlled) { - return; - } - - // Wait for the denoted initial tab to be declared before making a - // selection. This ensures that if a tab is declared lazily it can - // still receive initial selection, as well as ensuring no tab is - // selected if an invalid `defaultTabId` is provided. - if (defaultTabId && !initialTab) { - return; - } - - // If the currently selected tab is missing (i.e. removed from the DOM), - // fall back to the initial tab or the first enabled tab if there is - // one. Otherwise, no tab should be selected. - if (!items.find(item => item.id === selectedId)) { - if (initialTab && !initialTab.dimmed) { - setSelectedId(initialTab?.id); - return; - } - if (firstEnabledTab) { - setSelectedId(firstEnabledTab.id); - } else if (tabsHavePopulated.current) { - setSelectedId(null); - } - } - }, [firstEnabledTab, initialTab, defaultTabId, isControlled, items, selectedId, setSelectedId]); - - // Handle the currently selected tab becoming disabled. - (0,external_wp_element_namespaceObject.useLayoutEffect)(() => { - if (!selectedTab?.dimmed) { - return; - } - - // In controlled mode, we trust that disabling tabs is done - // intentionally, and don't select a new tab automatically. - if (isControlled) { - setSelectedId(null); - return; - } - - // If the currently selected tab becomes disabled, fall back to the - // `defaultTabId` if possible. Otherwise select the first - // enabled tab (if there is one). - if (initialTab && !initialTab.dimmed) { - setSelectedId(initialTab.id); - return; - } - if (firstEnabledTab) { - setSelectedId(firstEnabledTab.id); - } - }, [firstEnabledTab, initialTab, isControlled, selectedTab?.dimmed, setSelectedId]); - - // Clear `selectedId` if the active tab is removed from the DOM in controlled mode. - (0,external_wp_element_namespaceObject.useLayoutEffect)(() => { - if (!isControlled) { - return; - } - - // Once the tabs have populated, if the `selectedTabId` still can't be - // found, clear the selection. - if (tabsHavePopulated.current && !!selectedTabId && !selectedTab) { - setSelectedId(null); - } - }, [isControlled, selectedTab, selectedTabId, setSelectedId]); (0,external_wp_element_namespaceObject.useEffect)(() => { - // If there is no active tab, fallback to place focus on the first enabled tab - // so there is always an active element - if (selectedTabId === null && !activeId && firstEnabledTab?.id) { - setActiveId(firstEnabledTab.id); - } - }, [selectedTabId, activeId, firstEnabledTab?.id, setActiveId]); - (0,external_wp_element_namespaceObject.useEffect)(() => { - if (!isControlled) { - return; - } requestAnimationFrame(() => { const focusedElement = items?.[0]?.element?.ownerDocument.activeElement; if (!focusedElement || !items.some(item => focusedElement === item.element)) { @@ -73912,7 +72140,7 @@ setActiveId(focusedElement.id); } }); - }, [activeId, isControlled, items, setActiveId]); + }, [activeId, items, setActiveId]); const contextValue = (0,external_wp_element_namespaceObject.useMemo)(() => ({ store, instanceId @@ -73921,16 +72149,38 @@ value: contextValue, children: children }); -} -Tabs.TabList = TabList; -Tabs.Tab = tab_Tab; -Tabs.TabPanel = tabpanel_TabPanel; -Tabs.Context = TabsContext; -/* harmony default export */ const tabs = (Tabs); - -;// CONCATENATED MODULE: external ["wp","privateApis"] +}, { + /** + * Renders a single tab. + * + * The currently active tab receives default styling that can be + * overridden with CSS targeting `[aria-selected="true"]`. + */ + Tab: Object.assign(tab_Tab, { + displayName: 'Tabs.Tab' + }), + /** + * A wrapper component for the `Tab` components. + * + * It is responsible for rendering the list of tabs. + */ + TabList: Object.assign(tablist_TabList, { + displayName: 'Tabs.TabList' + }), + /** + * Renders the content to display for a single tab once that tab is selected. + */ + TabPanel: Object.assign(tabpanel_TabPanel, { + displayName: 'Tabs.TabPanel' + }), + Context: Object.assign(TabsContext, { + displayName: 'Tabs.Context' + }) +}); + +;// external ["wp","privateApis"] const external_wp_privateApis_namespaceObject = window["wp"]["privateApis"]; -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/lock-unlock.js +;// ./node_modules/@wordpress/components/build-module/lock-unlock.js /** * WordPress dependencies */ @@ -73940,15 +72190,142 @@ unlock } = (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'); -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/private-apis.js -/** - * WordPress dependencies - */ - -/** - * Internal dependencies - */ - +;// ./node_modules/@wordpress/icons/build-module/library/info.js +/** + * WordPress dependencies + */ + + +const info = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { + viewBox: "0 0 24 24", + xmlns: "http://www.w3.org/2000/svg", + children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { + fillRule: "evenodd", + clipRule: "evenodd", + d: "M5.5 12a6.5 6.5 0 1 0 13 0 6.5 6.5 0 0 0-13 0ZM12 4a8 8 0 1 0 0 16 8 8 0 0 0 0-16Zm.75 4v1.5h-1.5V8h1.5Zm0 8v-5h-1.5v5h1.5Z" + }) +}); +/* harmony default export */ const library_info = (info); + +;// ./node_modules/@wordpress/icons/build-module/library/published.js +/** + * WordPress dependencies + */ + + +const published = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { + xmlns: "http://www.w3.org/2000/svg", + viewBox: "0 0 24 24", + children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { + fillRule: "evenodd", + clipRule: "evenodd", + d: "M12 18.5a6.5 6.5 0 1 1 0-13 6.5 6.5 0 0 1 0 13ZM4 12a8 8 0 1 1 16 0 8 8 0 0 1-16 0Zm11.53-1.47-1.06-1.06L11 12.94l-1.47-1.47-1.06 1.06L11 15.06l4.53-4.53Z" + }) +}); +/* harmony default export */ const library_published = (published); + +;// ./node_modules/@wordpress/icons/build-module/library/caution.js +/** + * WordPress dependencies + */ + + +const caution = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { + viewBox: "0 0 24 24", + xmlns: "http://www.w3.org/2000/svg", + children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { + fillRule: "evenodd", + clipRule: "evenodd", + d: "M5.5 12a6.5 6.5 0 1 0 13 0 6.5 6.5 0 0 0-13 0ZM12 4a8 8 0 1 0 0 16 8 8 0 0 0 0-16Zm-.75 12v-1.5h1.5V16h-1.5Zm0-8v5h1.5V8h-1.5Z" + }) +}); +/* harmony default export */ const library_caution = (caution); + +;// ./node_modules/@wordpress/icons/build-module/library/error.js +/** + * WordPress dependencies + */ + + +const error = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, { + viewBox: "0 0 24 24", + xmlns: "http://www.w3.org/2000/svg", + children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, { + fillRule: "evenodd", + clipRule: "evenodd", + d: "M12.218 5.377a.25.25 0 0 0-.436 0l-7.29 12.96a.25.25 0 0 0 .218.373h14.58a.25.25 0 0 0 .218-.372l-7.29-12.96Zm-1.743-.735c.669-1.19 2.381-1.19 3.05 0l7.29 12.96a1.75 1.75 0 0 1-1.525 2.608H4.71a1.75 1.75 0 0 1-1.525-2.608l7.29-12.96ZM12.75 17.46h-1.5v-1.5h1.5v1.5Zm-1.5-3h1.5v-5h-1.5v5Z" + }) +}); +/* harmony default export */ const library_error = (error); + +;// ./node_modules/@wordpress/components/build-module/badge/index.js +/** + * External dependencies + */ + + +/** + * WordPress dependencies + */ + + +/** + * Internal dependencies + */ + + + +/** + * Returns an icon based on the badge context. + * + * @return The corresponding icon for the provided context. + */ + +function contextBasedIcon(intent = 'default') { + switch (intent) { + case 'info': + return library_info; + case 'success': + return library_published; + case 'warning': + return library_caution; + case 'error': + return library_error; + default: + return null; + } +} +function Badge({ + className, + intent = 'default', + children, + ...props +}) { + const icon = contextBasedIcon(intent); + const hasIcon = !!icon; + return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("span", { + className: dist_clsx('components-badge', className, { + [`is-${intent}`]: intent, + 'has-icon': hasIcon + }), + ...props, + children: [hasIcon && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(build_module_icon, { + icon: icon, + size: 16, + fill: "currentColor", + className: "components-badge__icon" + }), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("span", { + className: "components-badge__content", + children: children + })] + }); +} +/* harmony default export */ const badge = (Badge); + +;// ./node_modules/@wordpress/components/build-module/private-apis.js +/** + * Internal dependencies + */ @@ -73960,29 +72337,17 @@ const privateApis = {}; lock(privateApis, { - CompositeV2: Composite, - CompositeGroupV2: CompositeGroup, - CompositeItemV2: CompositeItem, - CompositeRowV2: CompositeRow, - useCompositeStoreV2: useCompositeStore, - CustomSelectControl: CustomSelectControl, __experimentalPopoverLegacyPositionToPlacement: positionToPlacement, - createPrivateSlotFill: createPrivateSlotFill, ComponentsContext: ComponentsContext, - Tabs: tabs, + Tabs: Tabs, Theme: theme, - DropdownMenuV2: dropdown_menu_v2_DropdownMenu, - DropdownMenuGroupV2: DropdownMenuGroup, - DropdownMenuItemV2: DropdownMenuItem, - DropdownMenuCheckboxItemV2: DropdownMenuCheckboxItem, - DropdownMenuRadioItemV2: DropdownMenuRadioItem, - DropdownMenuSeparatorV2: DropdownMenuSeparator, - DropdownMenuItemLabelV2: DropdownMenuItemLabel, - DropdownMenuItemHelpTextV2: DropdownMenuItemHelpText, - kebabCase: kebabCase -}); - -;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/index.js + Menu: menu_Menu, + kebabCase: kebabCase, + withIgnoreIMEEvents: withIgnoreIMEEvents, + Badge: badge +}); + +;// ./node_modules/@wordpress/components/build-module/index.js // Primitives. @@ -74106,6 +72471,8 @@ + + // Higher-Order Components.