'is-tertiary': isTertiary,
'is-destructive': isDestructive,
'has-text': !!icon && !!children,
var trulyDisabled = disabled && !isFocusable;
var Tag = href !== undefined && !trulyDisabled ? 'a' : 'button';
var tagProps = Tag === 'a' ? {
'aria-pressed': isPressed
if (disabled && isFocusable) {
// In this case, the button will be disabled, but still focusable and
// perceivable by screen reader users.
tagProps['aria-disabled'] = true;
var _iterator = _createForOfIteratorHelper(disabledEventsOnDisabledButton),
for (_iterator.s(); !(_step = _iterator.n()).done;) {
var disabledEvent = _step.value;
additionalProps[disabledEvent] = function (event) {
} // Should show the tooltip if...
var shouldShowTooltip = !trulyDisabled && ( // an explicit tooltip is passed or...
showTooltip && label || // there's a shortcut or...
shortcut || // there's a label and...
!!label && ( // the children are empty and...
!children || Object(lodash__WEBPACK_IMPORTED_MODULE_4__["isArray"])(children) && !children.length) && // the tooltip is not explicitly disabled.
var descriptionId = describedBy ? Object(lodash__WEBPACK_IMPORTED_MODULE_4__["uniqueId"])() : null;
var describedById = additionalProps['aria-describedby'] || descriptionId;
var element = Object(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__["createElement"])(Tag, Object(_babel_runtime_helpers_esm_extends__WEBPACK_IMPORTED_MODULE_0__[/* default */ "a"])({}, tagProps, additionalProps, {
"aria-label": additionalProps['aria-label'] || label,
"aria-describedby": describedById,
}), icon && iconPosition === 'left' && Object(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__["createElement"])(_icon__WEBPACK_IMPORTED_MODULE_7__[/* default */ "a"], {
}), text && Object(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__["createElement"])(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__["Fragment"], null, text), icon && iconPosition === 'right' && Object(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__["createElement"])(_icon__WEBPACK_IMPORTED_MODULE_7__[/* default */ "a"], {
if (!shouldShowTooltip) {
return Object(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__["createElement"])(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__["Fragment"], null, element, describedBy && Object(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__["createElement"])(_visually_hidden__WEBPACK_IMPORTED_MODULE_8__[/* default */ "a"], null, Object(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__["createElement"])("span", {
return Object(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__["createElement"])(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__["Fragment"], null, Object(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__["createElement"])(_tooltip__WEBPACK_IMPORTED_MODULE_6__[/* default */ "a"], {
text: describedBy ? describedBy : label,
position: tooltipPosition
}, element), describedBy && Object(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__["createElement"])(_visually_hidden__WEBPACK_IMPORTED_MODULE_8__[/* default */ "a"], null, Object(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__["createElement"])("span", {
/* harmony default export */ __webpack_exports__["a"] = (Object(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__["forwardRef"])(Button));
/***/ (function(module, exports) {
Object.defineProperty(exports, "__esModule", {
var GLOBAL_CACHE_KEY = 'reactWithStylesInterfaceCSS';
var MAX_SPECIFICITY = 20;
exports.GLOBAL_CACHE_KEY = GLOBAL_CACHE_KEY;
exports.MAX_SPECIFICITY = MAX_SPECIFICITY;
/***/ (function(module, __webpack_exports__, __webpack_require__) {
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return CompositeItem; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return useCompositeItem; });
/* harmony import */ var _rollupPluginBabelHelpers_1f0bf8c2_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("BZp5");
/* harmony import */ var reakit_system_createComponent__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__("dQ10");
/* harmony import */ var reakit_system_createHook__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__("1k9I");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__("cDcd");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var reakit_utils_useForkRef__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__("mFP7");
/* harmony import */ var reakit_warning__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__("FyLM");
/* harmony import */ var reakit_utils_useLiveRef__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__("+LFj");
/* harmony import */ var reakit_utils_isSelfTarget__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__("eXCq");
/* harmony import */ var reakit_utils_hasFocusWithin__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__("yGlB");
/* harmony import */ var reakit_utils_isPortalEvent__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__("s2kj");
/* harmony import */ var _Clickable_Clickable_js__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__("JLmN");
/* harmony import */ var reakit_utils_getDocument__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__("Ccil");
/* harmony import */ var _getCurrentId_5aa9849e_js__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__("iYXd");
/* harmony import */ var _keys_6742f591_js__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__("TFuP");
/* harmony import */ var _userFocus_e16425e3_js__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__("Mih7");
/* harmony import */ var reakit_utils_isTextField__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__("aBWF");
/* harmony import */ var reakit_utils_ensureFocus__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__("oZ/g");
/* harmony import */ var _Id_Id_js__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__("ym77");
/* harmony import */ var _setTextFieldValue_0a221f4e_js__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__("0HL0");
function getWidget(itemElement) {
return itemElement.querySelector("[data-composite-item-widget]");
function useItem(options) {
return Object(react__WEBPACK_IMPORTED_MODULE_3__["useMemo"])(function () {
return (_options$items = options.items) === null || _options$items === void 0 ? void 0 : _options$items.find(function (item) {
return options.id && item.id === options.id;
}, [options.items, options.id]);
function targetIsAnotherItem(event, items) {
if (Object(reakit_utils_isSelfTarget__WEBPACK_IMPORTED_MODULE_7__[/* isSelfTarget */ "a"])(event)) return false;
for (var _iterator = Object(_rollupPluginBabelHelpers_1f0bf8c2_js__WEBPACK_IMPORTED_MODULE_0__[/* b */ "c"])(items), _step; !(_step = _iterator()).done;) {
if (item.ref.current === event.target) {
var useCompositeItem = Object(reakit_system_createHook__WEBPACK_IMPORTED_MODULE_2__[/* createHook */ "a"])({
compose: [_Clickable_Clickable_js__WEBPACK_IMPORTED_MODULE_10__[/* useClickable */ "a"], _Id_Id_js__WEBPACK_IMPORTED_MODULE_17__[/* unstable_useId */ "a"]],
keys: _keys_6742f591_js__WEBPACK_IMPORTED_MODULE_13__[/* b */ "c"],
propsAreEqual: function propsAreEqual(prev, next) {
if (!next.id || prev.id !== next.id) {
return _Clickable_Clickable_js__WEBPACK_IMPORTED_MODULE_10__[/* useClickable */ "a"].unstable_propsAreEqual(prev, next);
var prevCurrentId = prev.currentId,
prevMoves = prev.unstable_moves,
prevProps = Object(_rollupPluginBabelHelpers_1f0bf8c2_js__WEBPACK_IMPORTED_MODULE_0__[/* _ */ "a"])(prev, ["currentId", "unstable_moves"]);
var nextCurrentId = next.currentId,
nextMoves = next.unstable_moves,
nextProps = Object(_rollupPluginBabelHelpers_1f0bf8c2_js__WEBPACK_IMPORTED_MODULE_0__[/* _ */ "a"])(next, ["currentId", "unstable_moves"]);
if (nextCurrentId !== prevCurrentId) {
if (next.id === nextCurrentId || next.id === prevCurrentId) {
} else if (prevMoves !== nextMoves) {
return _Clickable_Clickable_js__WEBPACK_IMPORTED_MODULE_10__[/* useClickable */ "a"].unstable_propsAreEqual(prevProps, nextProps);
useOptions: function useOptions(options) {
return Object(_rollupPluginBabelHelpers_1f0bf8c2_js__WEBPACK_IMPORTED_MODULE_0__[/* a */ "b"])(Object(_rollupPluginBabelHelpers_1f0bf8c2_js__WEBPACK_IMPORTED_MODULE_0__[/* a */ "b"])({}, options), {}, {
currentId: Object(_getCurrentId_5aa9849e_js__WEBPACK_IMPORTED_MODULE_12__[/* g */ "b"])(options),
unstable_clickOnSpace: options.unstable_hasActiveWidget ? false : options.unstable_clickOnSpace
useProps: function useProps(options, _ref) {
_ref$tabIndex = _ref.tabIndex,
htmlTabIndex = _ref$tabIndex === void 0 ? 0 : _ref$tabIndex,
htmlOnMouseDown = _ref.onMouseDown,
htmlOnFocus = _ref.onFocus,
htmlOnBlurCapture = _ref.onBlurCapture,
htmlOnKeyDown = _ref.onKeyDown,
htmlOnClick = _ref.onClick,
htmlProps = Object(_rollupPluginBabelHelpers_1f0bf8c2_js__WEBPACK_IMPORTED_MODULE_0__[/* _ */ "a"])(_ref, ["ref", "tabIndex", "onMouseDown", "onFocus", "onBlurCapture", "onKeyDown", "onClick"]);
var ref = Object(react__WEBPACK_IMPORTED_MODULE_3__["useRef"])(null);
var trulyDisabled = options.disabled && !options.focusable;
var isCurrentItem = options.currentId === id;
var isCurrentItemRef = Object(reakit_utils_useLiveRef__WEBPACK_IMPORTED_MODULE_6__[/* useLiveRef */ "a"])(isCurrentItem);
var hasFocusedComposite = Object(react__WEBPACK_IMPORTED_MODULE_3__["useRef"])(false);
var item = useItem(options);
var onMouseDownRef = Object(reakit_utils_useLiveRef__WEBPACK_IMPORTED_MODULE_6__[/* useLiveRef */ "a"])(htmlOnMouseDown);
var onFocusRef = Object(reakit_utils_useLiveRef__WEBPACK_IMPORTED_MODULE_6__[/* useLiveRef */ "a"])(htmlOnFocus);
var onBlurCaptureRef = Object(reakit_utils_useLiveRef__WEBPACK_IMPORTED_MODULE_6__[/* useLiveRef */ "a"])(htmlOnBlurCapture);
var onKeyDownRef = Object(reakit_utils_useLiveRef__WEBPACK_IMPORTED_MODULE_6__[/* useLiveRef */ "a"])(htmlOnKeyDown);
var onClickRef = Object(reakit_utils_useLiveRef__WEBPACK_IMPORTED_MODULE_6__[/* useLiveRef */ "a"])(htmlOnClick);
var shouldTabIndex = !options.unstable_virtual && !options.unstable_hasActiveWidget && isCurrentItem || // We don't want to set tabIndex="-1" when using CompositeItem as a
// standalone component, without state props.
!((_options$items2 = options.items) !== null && _options$items2 !== void 0 && _options$items2.length);
Object(react__WEBPACK_IMPORTED_MODULE_3__["useEffect"])(function () {
var _options$registerItem;
if (!id) return undefined;
(_options$registerItem = options.registerItem) === null || _options$registerItem === void 0 ? void 0 : _options$registerItem.call(options, {
disabled: !!trulyDisabled
var _options$unregisterIt;
(_options$unregisterIt = options.unregisterItem) === null || _options$unregisterIt === void 0 ? void 0 : _options$unregisterIt.call(options, id);
}, [id, trulyDisabled, options.registerItem, options.unregisterItem]);
Object(react__WEBPACK_IMPORTED_MODULE_3__["useEffect"])(function () {
var element = ref.current;
false ? undefined : void 0;
} // `moves` will be incremented whenever next, previous, up, down, first,
// last or move have been called. This means that the composite item will
// be focused whenever some of these functions are called. We're using
// isCurrentItemRef instead of isCurrentItem because we don't want to
// focus the item if isCurrentItem changes (and options.moves doesn't).
if (options.unstable_moves && isCurrentItemRef.current) {
Object(_userFocus_e16425e3_js__WEBPACK_IMPORTED_MODULE_14__[/* u */ "c"])(element);
}, [options.unstable_moves]);
var onMouseDown = Object(react__WEBPACK_IMPORTED_MODULE_3__["useCallback"])(function (event) {
var _onMouseDownRef$curre;
(_onMouseDownRef$curre = onMouseDownRef.current) === null || _onMouseDownRef$curre === void 0 ? void 0 : _onMouseDownRef$curre.call(onMouseDownRef, event);
Object(_userFocus_e16425e3_js__WEBPACK_IMPORTED_MODULE_14__[/* s */ "b"])(event.currentTarget, true);
var onFocus = Object(react__WEBPACK_IMPORTED_MODULE_3__["useCallback"])(function (event) {
var _onFocusRef$current, _options$setCurrentId;
var shouldFocusComposite = Object(_userFocus_e16425e3_js__WEBPACK_IMPORTED_MODULE_14__[/* h */ "a"])(event.currentTarget);
Object(_userFocus_e16425e3_js__WEBPACK_IMPORTED_MODULE_14__[/* s */ "b"])(event.currentTarget, false);
(_onFocusRef$current = onFocusRef.current) === null || _onFocusRef$current === void 0 ? void 0 : _onFocusRef$current.call(onFocusRef, event);
if (event.defaultPrevented) return;
if (Object(reakit_utils_isPortalEvent__WEBPACK_IMPORTED_MODULE_9__[/* isPortalEvent */ "a"])(event)) return;
if (targetIsAnotherItem(event, options.items)) return;
(_options$setCurrentId = options.setCurrentId) === null || _options$setCurrentId === void 0 ? void 0 : _options$setCurrentId.call(options, id); // When using aria-activedescendant, we want to make sure that the
// composite container receives focus, not the composite item.
// But we don't want to do this if the target is another focusable
// element inside the composite item, such as CompositeItemWidget.
if (shouldFocusComposite && options.unstable_virtual && options.baseId && Object(reakit_utils_isSelfTarget__WEBPACK_IMPORTED_MODULE_7__[/* isSelfTarget */ "a"])(event)) {
var target = event.target;
var composite = Object(reakit_utils_getDocument__WEBPACK_IMPORTED_MODULE_11__[/* getDocument */ "a"])(target).getElementById(options.baseId);
hasFocusedComposite.current = true;
Object(reakit_utils_ensureFocus__WEBPACK_IMPORTED_MODULE_16__[/* ensureFocus */ "a"])(composite);
}, [id, options.items, options.setCurrentId, options.unstable_virtual, options.baseId]);
var onBlurCapture = Object(react__WEBPACK_IMPORTED_MODULE_3__["useCallback"])(function (event) {
var _onBlurCaptureRef$cur;
(_onBlurCaptureRef$cur = onBlurCaptureRef.current) === null || _onBlurCaptureRef$cur === void 0 ? void 0 : _onBlurCaptureRef$cur.call(onBlurCaptureRef, event);
if (event.defaultPrevented) return;
if (options.unstable_virtual && hasFocusedComposite.current) {
// When hasFocusedComposite is true, composite has been focused right
// after focusing this item. This is an intermediate blur event, so
hasFocusedComposite.current = false;
}, [options.unstable_virtual]);
var onKeyDown = Object(react__WEBPACK_IMPORTED_MODULE_3__["useCallback"])(function (event) {
var _onKeyDownRef$current;
if (!Object(reakit_utils_isSelfTarget__WEBPACK_IMPORTED_MODULE_7__[/* isSelfTarget */ "a"])(event)) return;
var isVertical = options.orientation !== "horizontal";
var isHorizontal = options.orientation !== "vertical";
var isGrid = !!(item !== null && item !== void 0 && item.groupId);
ArrowUp: (isGrid || isVertical) && options.up,
ArrowRight: (isGrid || isHorizontal) && options.next,
ArrowDown: (isGrid || isVertical) && options.down,
ArrowLeft: (isGrid || isHorizontal) && options.previous,
if (!isGrid || event.ctrlKey) {
(_options$first = options.first) === null || _options$first === void 0 ? void 0 : _options$first.call(options);
(_options$previous = options.previous) === null || _options$previous === void 0 ? void 0 : _options$previous.call(options, true);
if (!isGrid || event.ctrlKey) {
(_options$last = options.last) === null || _options$last === void 0 ? void 0 : _options$last.call(options);
(_options$next = options.next) === null || _options$next === void 0 ? void 0 : _options$next.call(options, true);
PageUp: function PageUp() {
(_options$up = options.up) === null || _options$up === void 0 ? void 0 : _options$up.call(options, true);
(_options$first2 = options.first) === null || _options$first2 === void 0 ? void 0 : _options$first2.call(options);
PageDown: function PageDown() {
(_options$down = options.down) === null || _options$down === void 0 ? void 0 : _options$down.call(options, true);
(_options$last2 = options.last) === null || _options$last2 === void 0 ? void 0 : _options$last2.call(options);
var action = keyMap[event.key];
(_onKeyDownRef$current = onKeyDownRef.current) === null || _onKeyDownRef$current === void 0 ? void 0 : _onKeyDownRef$current.call(onKeyDownRef, event);
if (event.defaultPrevented) return;
if (event.key.length === 1 && event.key !== " ") {
var widget = getWidget(event.currentTarget);
if (widget && Object(reakit_utils_isTextField__WEBPACK_IMPORTED_MODULE_15__[/* isTextField */ "a"])(widget)) {
Object(_setTextFieldValue_0a221f4e_js__WEBPACK_IMPORTED_MODULE_18__[/* s */ "a"])(widget, "");
} else if (event.key === "Delete" || event.key === "Backspace") {
var _widget = getWidget(event.currentTarget);
if (_widget && Object(reakit_utils_isTextField__WEBPACK_IMPORTED_MODULE_15__[/* isTextField */ "a"])(_widget)) {
Object(_setTextFieldValue_0a221f4e_js__WEBPACK_IMPORTED_MODULE_18__[/* s */ "a"])(_widget, "");
}, [options.orientation, item, options.up, options.next, options.down, options.previous, options.first, options.last]);
var onClick = Object(react__WEBPACK_IMPORTED_MODULE_3__["useCallback"])(function (event) {
(_onClickRef$current = onClickRef.current) === null || _onClickRef$current === void 0 ? void 0 : _onClickRef$current.call(onClickRef, event);
if (event.defaultPrevented) return;
var element = event.currentTarget;
var widget = getWidget(element);
if (widget && !Object(reakit_utils_hasFocusWithin__WEBPACK_IMPORTED_MODULE_8__[/* hasFocusWithin */ "a"])(widget)) {
// If there's a widget inside the composite item, we make sure it's
// focused when pressing enter, space or clicking on the composite item.
return Object(_rollupPluginBabelHelpers_1f0bf8c2_js__WEBPACK_IMPORTED_MODULE_0__[/* a */ "b"])({
ref: Object(reakit_utils_useForkRef__WEBPACK_IMPORTED_MODULE_4__[/* useForkRef */ "a"])(ref, htmlRef),
tabIndex: shouldTabIndex ? htmlTabIndex : -1,
"aria-selected": options.unstable_virtual && isCurrentItem ? true : undefined,
onMouseDown: onMouseDown,
onBlurCapture: onBlurCapture,
var CompositeItem = Object(reakit_system_createComponent__WEBPACK_IMPORTED_MODULE_1__[/* createComponent */ "a"])({
useHook: useCompositeItem
/***/ (function(module, exports, __webpack_require__) {
var GetIntrinsic = __webpack_require__("AM7I");
var $gOPD = __webpack_require__("knm9");
var $TypeError = GetIntrinsic('%TypeError%');
var callBound = __webpack_require__("EXo9");
var $isEnumerable = callBound('Object.prototype.propertyIsEnumerable');
var has = __webpack_require__("oNNP");
var IsArray = __webpack_require__("9cOx");
var IsPropertyKey = __webpack_require__("i10q");
var IsRegExp = __webpack_require__("yy3d");
var ToPropertyDescriptor = __webpack_require__("eBsn");
var Type = __webpack_require__("V1cy");
// https://ecma-international.org/ecma-262/6.0/#sec-ordinarygetownproperty
module.exports = function OrdinaryGetOwnProperty(O, P) {
if (Type(O) !== 'Object') {
throw new $TypeError('Assertion failed: O must be an Object');
throw new $TypeError('Assertion failed: P must be a Property Key');
var arrayLength = IsArray(O) && P === 'length';
var regexLastIndex = IsRegExp(O) && P === 'lastIndex';
'[[Configurable]]': !(arrayLength || regexLastIndex),
'[[Enumerable]]': $isEnumerable(O, P),
return ToPropertyDescriptor($gOPD(O, P));
/***/ (function(module, exports, __webpack_require__) {