if (selectedItems.length < previousSelectedItemsRef.current.length) {
var removedSelectedItem = previousSelectedItemsRef.current.find(function (item) {
return selectedItems.indexOf(item) < 0;
setStatus(getA11yRemovalMessage({
itemToString: itemToString,
resultCount: selectedItems.length,
removedSelectedItem: removedSelectedItem,
activeIndex: activeIndex,
activeSelectedItem: selectedItems[activeIndex]
}), environment.document);
previousSelectedItemsRef.current = selectedItems; // eslint-disable-next-line react-hooks/exhaustive-deps
}, [selectedItems.length]); // Sets focus on active item.
Object(external_React_["useEffect"])(function () {
if (isInitialMountRef.current) {
if (activeIndex === -1 && dropdownRef.current) {
dropdownRef.current.focus();
} else if (selectedItemRefs.current[activeIndex]) {
selectedItemRefs.current[activeIndex].focus();
useControlPropsValidator({
isInitialMount: isInitialMountRef.current,
var setGetterPropCallInfo = useGetterPropsCalledChecker('getDropdownProps'); // Make initial ref false.
Object(external_React_["useEffect"])(function () {
isInitialMountRef.current = false;
}, []); // Event handler functions.
var selectedItemKeyDownHandlers = Object(external_React_["useMemo"])(function () {
return _ref = {}, _ref[keyNavigationPrevious] = function () {
type: SelectedItemKeyDownNavigationPrevious
}, _ref[keyNavigationNext] = function () {
type: SelectedItemKeyDownNavigationNext
}, _ref.Delete = function Delete() {
type: SelectedItemKeyDownDelete
}, _ref.Backspace = function Backspace() {
type: SelectedItemKeyDownBackspace
}, [dispatch, keyNavigationNext, keyNavigationPrevious]);
var dropdownKeyDownHandlers = Object(external_React_["useMemo"])(function () {
return _ref2 = {}, _ref2[keyNavigationPrevious] = function (event) {
if (isKeyDownOperationPermitted(event)) {
type: DropdownKeyDownNavigationPrevious
}, _ref2.Backspace = function Backspace(event) {
if (isKeyDownOperationPermitted(event)) {
type: DropdownKeyDownBackspace
}, [dispatch, keyNavigationPrevious]); // Getter props.
var getSelectedItemProps = Object(external_React_["useCallback"])(function (_temp) {
var _ref3 = _temp === void 0 ? {} : _temp,
_ref3$refKey = _ref3.refKey,
refKey = _ref3$refKey === void 0 ? 'ref' : _ref3$refKey,
onKeyDown = _ref3.onKeyDown,
selectedItem = _ref3.selectedItem,
rest = objectWithoutPropertiesLoose_objectWithoutPropertiesLoose(_ref3, _excluded);
var latestState = latest.current.state;
var itemIndex = getItemIndex(index, selectedItem, latestState.selectedItems);
throw new Error('Pass either selectedItem or index in getSelectedItemProps!');
var selectedItemHandleClick = function selectedItemHandleClick() {
var selectedItemHandleKeyDown = function selectedItemHandleKeyDown(event) {
var key = normalizeArrowKey(event);
if (key && selectedItemKeyDownHandlers[key]) {
selectedItemKeyDownHandlers[key](event);
return extends_extends((_extends2 = {}, _extends2[refKey] = handleRefs(ref, function (selectedItemNode) {
selectedItemRefs.current.push(selectedItemNode);
}), _extends2.tabIndex = index === latestState.activeIndex ? 0 : -1, _extends2.onClick = callAllEventHandlers(onClick, selectedItemHandleClick), _extends2.onKeyDown = callAllEventHandlers(onKeyDown, selectedItemHandleKeyDown), _extends2), rest);
}, [dispatch, latest, selectedItemKeyDownHandlers]);
var getDropdownProps = Object(external_React_["useCallback"])(function (_temp2, _temp3) {
var _ref4 = _temp2 === void 0 ? {} : _temp2,
_ref4$refKey = _ref4.refKey,
refKey = _ref4$refKey === void 0 ? 'ref' : _ref4$refKey,
onKeyDown = _ref4.onKeyDown,
_ref4$preventKeyActio = _ref4.preventKeyAction,
preventKeyAction = _ref4$preventKeyActio === void 0 ? false : _ref4$preventKeyActio,
rest = objectWithoutPropertiesLoose_objectWithoutPropertiesLoose(_ref4, _excluded2);
var _ref5 = _temp3 === void 0 ? {} : _temp3,
_ref5$suppressRefErro = _ref5.suppressRefError,
suppressRefError = _ref5$suppressRefErro === void 0 ? false : _ref5$suppressRefErro;
setGetterPropCallInfo('getDropdownProps', suppressRefError, refKey, dropdownRef);
var dropdownHandleKeyDown = function dropdownHandleKeyDown(event) {
var key = normalizeArrowKey(event);
if (key && dropdownKeyDownHandlers[key]) {
dropdownKeyDownHandlers[key](event);
var dropdownHandleClick = function dropdownHandleClick() {
return extends_extends((_extends3 = {}, _extends3[refKey] = handleRefs(ref, function (dropdownNode) {
dropdownRef.current = dropdownNode;
}), _extends3), !preventKeyAction && {
onKeyDown: callAllEventHandlers(onKeyDown, dropdownHandleKeyDown),
onClick: callAllEventHandlers(onClick, dropdownHandleClick)
}, [dispatch, dropdownKeyDownHandlers, setGetterPropCallInfo]); // returns
var addSelectedItem = Object(external_React_["useCallback"])(function (selectedItem) {
type: FunctionAddSelectedItem,
selectedItem: selectedItem
var removeSelectedItem = Object(external_React_["useCallback"])(function (selectedItem) {
type: FunctionRemoveSelectedItem,
selectedItem: selectedItem
var setSelectedItems = Object(external_React_["useCallback"])(function (newSelectedItems) {
type: FunctionSetSelectedItems,
selectedItems: newSelectedItems
var setActiveIndex = Object(external_React_["useCallback"])(function (newActiveIndex) {
type: FunctionSetActiveIndex,
activeIndex: newActiveIndex
var reset = Object(external_React_["useCallback"])(function () {
getSelectedItemProps: getSelectedItemProps,
getDropdownProps: getDropdownProps,
addSelectedItem: addSelectedItem,
removeSelectedItem: removeSelectedItem,
setSelectedItems: setSelectedItems,
setActiveIndex: setActiveIndex,
selectedItems: selectedItems,
// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/custom-select-control/index.js
var custom_select_control_itemToString = function itemToString(item) {
return 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.
var custom_select_control_stateReducer = function stateReducer(_ref, _ref2) {
var selectedItem = _ref.selectedItem;
items = _ref2.props.items;
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(_ref3) {
var className = _ref3.className,
hideLabelFromVision = _ref3.hideLabelFromVision,
onSelectedItemChange = _ref3.onChange,
_selectedItem = _ref3.value;
var _useSelect = useSelect({
initialSelectedItem: items[0],
itemToString: custom_select_control_itemToString,
onSelectedItemChange: onSelectedItemChange,
selectedItem: _selectedItem,
stateReducer: custom_select_control_stateReducer
getLabelProps = _useSelect.getLabelProps,
getToggleButtonProps = _useSelect.getToggleButtonProps,
getMenuProps = _useSelect.getMenuProps,
getItemProps = _useSelect.getItemProps,
isOpen = _useSelect.isOpen,
highlightedIndex = _useSelect.highlightedIndex,
selectedItem = _useSelect.selectedItem;
var menuProps = getMenuProps({
className: 'components-custom-select-control__menu',
}); // We need this here, because the null active descendant is not
if (menuProps['aria-activedescendant'] && menuProps['aria-activedescendant'].slice(0, 'downshift-null'.length) === 'downshift-null') {
delete menuProps['aria-activedescendant'];
return Object(external_wp_element_["createElement"])("div", {
className: classnames_default()('components-custom-select-control', className)
}, hideLabelFromVision ? Object(external_wp_element_["createElement"])(visually_hidden["a" /* default */], Object(esm_extends["a" /* default */])({
}, getLabelProps()), label) :
/* eslint-disable-next-line jsx-a11y/label-has-associated-control, jsx-a11y/label-has-for */
Object(external_wp_element_["createElement"])("label", getLabelProps({
className: 'components-custom-select-control__label'
}), label), Object(external_wp_element_["createElement"])(build_module_button["a" /* default */], getToggleButtonProps({
// This is needed because some speech recognition software don't support `aria-labelledby`.
'aria-labelledby': undefined,
className: 'components-custom-select-control__button',
}), custom_select_control_itemToString(selectedItem), Object(external_wp_element_["createElement"])(build_module_icon["a" /* default */], {
icon: chevron_down["a" /* default */],
className: "components-custom-select-control__button-icon"
})), Object(external_wp_element_["createElement"])("ul", menuProps, isOpen && items.map(function (item, index) {
return (// eslint-disable-next-line react/jsx-key
Object(external_wp_element_["createElement"])("li", getItemProps({
className: classnames_default()(item.className, 'components-custom-select-control__item', {
'is-highlighted': index === highlightedIndex
}), item.name, item === selectedItem && Object(external_wp_element_["createElement"])(build_module_icon["a" /* default */], {
icon: check["a" /* default */],
className: "components-custom-select-control__item-icon"
// EXTERNAL MODULE: ./node_modules/@wordpress/components/build-module/dashicon/index.js
var dashicon = __webpack_require__("vUUf");
// EXTERNAL MODULE: ./node_modules/react-dates/initialize.js
var initialize = __webpack_require__("GG7f");
// EXTERNAL MODULE: external "moment"
var external_moment_ = __webpack_require__("wy2R");
var external_moment_default = /*#__PURE__*/__webpack_require__.n(external_moment_);
// EXTERNAL MODULE: ./node_modules/react-dates/lib/components/DayPickerSingleDateController.js
var DayPickerSingleDateController = __webpack_require__("Xtko");
var DayPickerSingleDateController_default = /*#__PURE__*/__webpack_require__.n(DayPickerSingleDateController);
// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/date-time/date.js
function date_createSuper(Derived) { var hasNativeReflectConstruct = date_isNativeReflectConstruct(); return function _createSuperInternal() { var Super = Object(getPrototypeOf["a" /* default */])(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = Object(getPrototypeOf["a" /* default */])(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return Object(possibleConstructorReturn["a" /* default */])(this, result); }; }
function date_isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } }
// react-dates doesn't tree-shake correctly, so we import from the individual
// component here, to avoid including too much of the library
var TIMEZONELESS_FORMAT = 'YYYY-MM-DDTHH:mm:ss';
var date_DatePicker = /*#__PURE__*/function (_Component) {
Object(inherits["a" /* default */])(DatePicker, _Component);
var _super = date_createSuper(DatePicker);
Object(classCallCheck["a" /* default */])(this, DatePicker);
_this = _super.apply(this, arguments);
_this.onChangeMoment = _this.onChangeMoment.bind(Object(assertThisInitialized["a" /* default */])(_this));
_this.nodeRef = Object(external_wp_element_["createRef"])();
_this.keepFocusInside = _this.keepFocusInside.bind(Object(assertThisInitialized["a" /* default */])(_this));
_this.isDayHighlighted = _this.isDayHighlighted.bind(Object(assertThisInitialized["a" /* default */])(_this));
* Todo: We should remove this function ASAP.
* It is kept because focus is lost when we click on the previous and next month buttons.
* This focus loss closes the date picker popover.
* Ideally we should add an upstream commit on react-dates to fix this issue.
Object(createClass["a" /* default */])(DatePicker, [{
value: function keepFocusInside() {
if (!this.nodeRef.current) {
var ownerDocument = this.nodeRef.current.ownerDocument;
var activeElement = ownerDocument.activeElement; // If focus was lost.
if (!activeElement || !this.nodeRef.current.contains(ownerDocument.activeElement)) {
// Retrieve the focus region div.
var focusRegion = this.nodeRef.current.querySelector('.DayPicker_focusRegion');
} // Keep the focus on focus region.
value: function onChangeMoment(newDate) {
var _this$props = this.props,
currentDate = _this$props.currentDate,
onChange = _this$props.onChange; // If currentDate is null, use now as momentTime to designate hours, minutes, seconds.
var momentDate = currentDate ? external_moment_default()(currentDate) : external_moment_default()();
hours: momentDate.hours(),
minutes: momentDate.minutes(),
onChange(newDate.set(momentTime).format(TIMEZONELESS_FORMAT));
* Create a Moment object from a date string. With no currentDate supplied, default to a Moment
* object representing now. If a null value is passed, return a null value.
* @param {?string} currentDate Date representing the currently selected date or null to signify no selection.
* @return {?moment.Moment} Moment object for selected date or null.
value: function getMomentDate(currentDate) {
if (null === currentDate) {
return currentDate ? external_moment_default()(currentDate) : external_moment_default()();
} // todo change reference to `isDayHighlighted` every time, `events` prop change
value: function isDayHighlighted(date) {
// Do not highlight when no events.
if (!((_this$props$events = this.props.events) !== null && _this$props$events !== void 0 && _this$props$events.length)) {
if (this.props.onMonthPreviewed) {
this.props.onMonthPreviewed(date.toDate());
} // Compare date against highlighted events.
return this.props.events.some(function (highlighted) {
return date.isSame(highlighted.date, 'day');
value: function render() {
var _this$props2 = this.props,
currentDate = _this$props2.currentDate,
isInvalidDate = _this$props2.isInvalidDate;
var momentDate = this.getMomentDate(currentDate);
return Object(external_wp_element_["createElement"])("div", {
className: "components-datetime__date",
}, Object(external_wp_element_["createElement"])(DayPickerSingleDateController_default.a, {
hideKeyboardShortcutsPanel: true // This is a hack to force the calendar to update on month or year change
// https://github.com/airbnb/react-dates/issues/240#issuecomment-361776665
key: "datepicker-controller-".concat(momentDate ? momentDate.format('MM-YYYY') : 'null'),
onDateChange: this.onChangeMoment,
isRTL: Object(external_wp_i18n_["isRTL"])(),
It is recommended that you Edit text format, this type of Fix handles quite a lot in one request
