: str_replace(): Passing null to parameter #2 ($replace) of type array|string is deprecated in
const itemIndex = getItemIndex(index, selectedItem, latestState.selectedItems);
throw new Error('Pass either selectedItem or index in getSelectedItemProps!');
const selectedItemHandleClick = () => {
const selectedItemHandleKeyDown = event => {
const key = normalizeArrowKey(event);
if (key && selectedItemKeyDownHandlers[key]) {
selectedItemKeyDownHandlers[key](event);
[refKey]: handleRefs(ref, selectedItemNode => {
selectedItemRefs.current.push(selectedItemNode);
tabIndex: index === latestState.activeIndex ? 0 : -1,
onClick: callAllEventHandlers(onClick, selectedItemHandleClick),
onKeyDown: callAllEventHandlers(onKeyDown, selectedItemHandleKeyDown),
}, [dispatch, latest, selectedItemKeyDownHandlers]);
const getDropdownProps = (0,external_React_.useCallback)(function (_temp2, _temp3) {
preventKeyAction = false,
} = _temp2 === void 0 ? {} : _temp2;
} = _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 = () => {
[refKey]: handleRefs(ref, dropdownNode => {
dropdownRef.current = dropdownNode;
...(!preventKeyAction && {
onKeyDown: callAllEventHandlers(onKeyDown, dropdownHandleKeyDown),
onClick: callAllEventHandlers(onClick, dropdownHandleClick)
}, [dispatch, dropdownKeyDownHandlers, setGetterPropCallInfo]); // returns
const addSelectedItem = (0,external_React_.useCallback)(selectedItem => {
type: FunctionAddSelectedItem,
const removeSelectedItem = (0,external_React_.useCallback)(selectedItem => {
type: FunctionRemoveSelectedItem,
const setSelectedItems = (0,external_React_.useCallback)(newSelectedItems => {
type: FunctionSetSelectedItems,
selectedItems: newSelectedItems
const setActiveIndex = (0,external_React_.useCallback)(newActiveIndex => {
type: FunctionSetActiveIndex,
activeIndex: newActiveIndex
const reset = (0,external_React_.useCallback)(() => {
;// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/custom-select-control/index.js
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 = ({
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.
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.
selectedItem: items[selectedItem ? Math.max(items.indexOf(selectedItem) - 1, 0) : items.length - 1]
function CustomSelectControl(props) {
/** Start opting into the larger default height that will become the default size in a future version. */
__next40pxDefaultSize = false,
onChange: onSelectedItemChange,
/** @type {import('../select-control/types').SelectControlProps.size} */
__experimentalShowSelectedHint = false
} = useDeprecated36pxDefaultSizeProp(props);
initialSelectedItem: items[0],
itemToString: custom_select_control_itemToString,
...(typeof _selectedItem !== 'undefined' && _selectedItem !== null ? {
selectedItem: _selectedItem
stateReducer: custom_select_control_stateReducer
function getDescribedBy() {
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',
const onKeyDownHandler = (0,external_wp_element_namespaceObject.useCallback)(e => {
menuProps?.onKeyDown?.(e);
// We need this here, because the null active descendant is not fully ARIA compliant.
if (menuProps['aria-activedescendant']?.startsWith('downshift-null')) {
'aria-activedescendant': ariaActivedescendant,
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, {
/* eslint-disable-next-line jsx-a11y/label-has-associated-control, jsx-a11y/label-has-for */
(0,external_ReactJSXRuntime_namespaceObject.jsx)(StyledLabel, {
className: 'components-custom-select-control__label'
}), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(input_base, {
__next40pxDefaultSize: __next40pxDefaultSize,
suffix: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(select_control_chevron_down, {}),
children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(Select, {
onMouseOver: onMouseOver,
__next40pxDefaultSize: __next40pxDefaultSize,
...getToggleButtonProps({
// This is needed because some speech recognition software don't support `aria-labelledby`.
'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", {
onKeyDown: onKeyDownHandler,
children: isOpen && items.map((item, index) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("li", {
className: dist_clsx(item.className, 'components-custom-select-control__item', {
'is-highlighted': index === highlightedIndex,
'has-hint': !!item.__experimentalHint,
'is-next-40px-default-size': __next40pxDefaultSize
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, {
className: "components-custom-select-control__item-icon"
function StableCustomSelectControl(props) {
return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(CustomSelectControl, {
__experimentalShowSelectedHint: false
;// CONCATENATED MODULE: ./node_modules/use-lilius/build/index.es.js
* @category Common Helpers
* @summary Convert the given argument to an instance of Date.
* 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
* const result = toDate(new Date(2014, 1, 11, 11, 30, 30))
* //=> Tue Feb 11 2014 11:30:30
* // Convert the timestamp to date:
* const result = toDate(1392098430000)
* //=> Tue Feb 11 2014 11:30:30
function toDate(argument) {
const argStr = Object.prototype.toString.call(argument);
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);
typeof argument === "number" ||
argStr === "[object Number]" ||
typeof argument === "string" ||
argStr === "[object String]"
// TODO: Can we get rid of as?
return new Date(argument);
// TODO: Can we get rid of as?
* @category Generic Helpers
* @summary Constructs a date using the reference date and the value
* 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
* 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
* import { constructFrom } from 'date-fns'
* // A function that clones a date preserving the original type
* function cloneDate<DateType extends Date(date: DateType): DateType {
* date, // Use contrustor from the given date
* date.getTime() // Use the date value to create a new date
function constructFrom(date, value) {
if (date instanceof Date) {
return new date.constructor(value);
* @summary Add the specified number of days to the given date.
* 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
* // 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 0 days, no-op to avoid changing times in the hour before end of DST
_date.setDate(_date.getDate() + amount);
* @category Month Helpers
* @summary Add the specified number of months to the given date.
* Add the specified number of months 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 months to be added.
* @returns The new date with the months added
* // Add 5 months to 1 September 2014:
* const result = addMonths(new Date(2014, 8, 1), 5)
* //=> 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(date, amount) {
const _date = toDate(date);
if (isNaN(amount)) return constructFrom(date, NaN);
// If 0 months, no-op to avoid changing times in the hour before end of DST
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
const endOfDesiredMonth = 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
return endOfDesiredMonth;
// 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.