;
* ```
*
* @param predicate Function to test condition.
*
* @return Higher-order component.
*/
const ifCondition = predicate => create_higher_order_component(WrappedComponent => props => {
if (!predicate(props)) {
return null;
}
return Object(external_wp_element_["createElement"])(WrappedComponent, props);
}, 'ifCondition');
/* harmony default export */ var if_condition = (ifCondition);
// EXTERNAL MODULE: external ["wp","isShallowEqual"]
var external_wp_isShallowEqual_ = __webpack_require__("rl8x");
var external_wp_isShallowEqual_default = /*#__PURE__*/__webpack_require__.n(external_wp_isShallowEqual_);
// CONCATENATED MODULE: ./node_modules/@wordpress/compose/build-module/higher-order/pure/index.js
/**
* WordPress dependencies
*/
/**
* Internal dependencies
*/
// eslint-disable-next-line no-duplicate-imports
/**
* Given a component returns the enhanced component augmented with a component
* only rerendering when its props/state change
*/
const pure = create_higher_order_component(Wrapped => {
if (Wrapped.prototype instanceof external_wp_element_["Component"]) {
return class extends Wrapped {
shouldComponentUpdate(nextProps, nextState) {
return !external_wp_isShallowEqual_default()(nextProps, this.props) || !external_wp_isShallowEqual_default()(nextState, this.state);
}
};
}
return class extends external_wp_element_["Component"] {
shouldComponentUpdate(nextProps) {
return !external_wp_isShallowEqual_default()(nextProps, this.props);
}
render() {
return Object(external_wp_element_["createElement"])(Wrapped, this.props);
}
};
}, 'pure');
/* harmony default export */ var higher_order_pure = (pure);
// EXTERNAL MODULE: ./node_modules/@babel/runtime/helpers/esm/extends.js
var esm_extends = __webpack_require__("wx14");
// EXTERNAL MODULE: external ["wp","deprecated"]
var external_wp_deprecated_ = __webpack_require__("NMb1");
var external_wp_deprecated_default = /*#__PURE__*/__webpack_require__.n(external_wp_deprecated_);
// CONCATENATED MODULE: ./node_modules/@wordpress/compose/build-module/higher-order/with-global-events/listener.js
/**
* External dependencies
*/
/**
* Class responsible for orchestrating event handling on the global window,
* binding a single event to be shared across all handling instances, and
* removing the handler when no instances are listening for the event.
*/
class listener_Listener {
constructor() {
this.listeners = {};
this.handleEvent = this.handleEvent.bind(this);
}
add(eventType, instance) {
if (!this.listeners[eventType]) {
// Adding first listener for this type, so bind event.
window.addEventListener(eventType, this.handleEvent);
this.listeners[eventType] = [];
}
this.listeners[eventType].push(instance);
}
remove(eventType, instance) {
this.listeners[eventType] = Object(external_lodash_["without"])(this.listeners[eventType], instance);
if (!this.listeners[eventType].length) {
// Removing last listener for this type, so unbind event.
window.removeEventListener(eventType, this.handleEvent);
delete this.listeners[eventType];
}
}
handleEvent(event) {
Object(external_lodash_["forEach"])(this.listeners[event.type], instance => {
instance.handleEvent(event);
});
}
}
/* harmony default export */ var listener = (listener_Listener);
// CONCATENATED MODULE: ./node_modules/@wordpress/compose/build-module/higher-order/with-global-events/index.js
/**
* External dependencies
*/
/**
* WordPress dependencies
*/
/**
* Internal dependencies
*/
/**
* Listener instance responsible for managing document event handling.
*
* @type {Listener}
*/
const with_global_events_listener = new listener();
/**
* Higher-order component creator which, given an object of DOM event types and
* values corresponding to a callback function name on the component, will
* create or update a window event handler to invoke the callback when an event
* occurs. On behalf of the consuming developer, the higher-order component
* manages unbinding when the component unmounts, and binding at most a single
* event handler for the entire application.
*
* @deprecated
*
* @param {Object} eventTypesToHandlers Object with keys of DOM
* event type, the value a
* name of the function on
* the original component's
* instance which handles
* the event.
*
* @return {Function} Higher-order component.
*/
function withGlobalEvents(eventTypesToHandlers) {
external_wp_deprecated_default()('wp.compose.withGlobalEvents', {
since: '5.7',
alternative: 'useEffect'
});
return create_higher_order_component(WrappedComponent => {
class Wrapper extends external_wp_element_["Component"] {
constructor() {
super(...arguments);
this.handleEvent = this.handleEvent.bind(this);
this.handleRef = this.handleRef.bind(this);
}
componentDidMount() {
Object(external_lodash_["forEach"])(eventTypesToHandlers, (handler, eventType) => {
with_global_events_listener.add(eventType, this);
});
}
componentWillUnmount() {
Object(external_lodash_["forEach"])(eventTypesToHandlers, (handler, eventType) => {
with_global_events_listener.remove(eventType, this);
});
}
handleEvent(event) {
const handler = eventTypesToHandlers[event.type];
if (typeof this.wrappedRef[handler] === 'function') {
this.wrappedRef[handler](event);
}
}
handleRef(el) {
this.wrappedRef = el; // Any component using `withGlobalEvents` that is not setting a `ref`
// will cause `this.props.forwardedRef` to be `null`, so we need this
// check.
if (this.props.forwardedRef) {
this.props.forwardedRef(el);
}
}
render() {
return Object(external_wp_element_["createElement"])(WrappedComponent, Object(esm_extends["a" /* default */])({}, this.props.ownProps, {
ref: this.handleRef
}));
}
}
return Object(external_wp_element_["forwardRef"])((props, ref) => {
return Object(external_wp_element_["createElement"])(Wrapper, {
ownProps: props,
forwardedRef: ref
});
});
}, 'withGlobalEvents');
}
// CONCATENATED MODULE: ./node_modules/@wordpress/compose/build-module/hooks/use-instance-id/index.js
/**
* WordPress dependencies
*/
/**
* @type {WeakMap}
*/
const instanceMap = new WeakMap();
/**
* Creates a new id for a given object.
*
* @param {unknown} object Object reference to create an id for.
* @return {number} The instance id (index).
*/
function createId(object) {
const instances = instanceMap.get(object) || 0;
instanceMap.set(object, instances + 1);
return instances;
}
/**
* Provides a unique instance ID.
*
* @param {Object} object Object reference to create an id for.
* @param {string} prefix Prefix for the unique id.
* @param {string} preferredId Default ID to use.
* @return {string | number} The unique instance id.
*/
function useInstanceId(object, prefix, preferredId = '') {
return Object(external_wp_element_["useMemo"])(() => {
if (preferredId) return preferredId;
const id = createId(object);
return prefix ? `${prefix}-${id}` : id;
}, [object]);
}
// CONCATENATED MODULE: ./node_modules/@wordpress/compose/build-module/higher-order/with-instance-id/index.js
/**
* Internal dependencies
*/
/**
* A Higher Order Component used to be provide a unique instance ID by
* component.
*
* @param {WPComponent} WrappedComponent The wrapped component.
*
* @return {WPComponent} Component with an instanceId prop.
*/
/* harmony default export */ var with_instance_id = (create_higher_order_component(WrappedComponent => {
return props => {
const instanceId = useInstanceId(WrappedComponent);
return Object(external_wp_element_["createElement"])(WrappedComponent, Object(esm_extends["a" /* default */])({}, props, {
instanceId: instanceId
}));
};
}, 'withInstanceId'));
// CONCATENATED MODULE: ./node_modules/@wordpress/compose/build-module/higher-order/with-safe-timeout/index.js
/**
* External dependencies
*/
/**
* WordPress dependencies
*/
/**
* Internal dependencies
*/
/**
* A higher-order component used to provide and manage delayed function calls
* that ought to be bound to a component's lifecycle.
*
* @param {WPComponent} OriginalComponent Component requiring setTimeout
*
* @return {WPComponent} Wrapped component.
*/
const withSafeTimeout = create_higher_order_component(OriginalComponent => {
return class WrappedComponent extends external_wp_element_["Component"] {
constructor() {
super(...arguments);
this.timeouts = [];
this.setTimeout = this.setTimeout.bind(this);
this.clearTimeout = this.clearTimeout.bind(this);
}
componentWillUnmount() {
this.timeouts.forEach(clearTimeout);
}
setTimeout(fn, delay) {
const id = setTimeout(() => {
fn();
this.clearTimeout(id);
}, delay);
this.timeouts.push(id);
return id;
}
clearTimeout(id) {
clearTimeout(id);
this.timeouts = Object(external_lodash_["without"])(this.timeouts, id);
}
render() {
return Object(external_wp_element_["createElement"])(OriginalComponent, Object(esm_extends["a" /* default */])({}, this.props, {
setTimeout: this.setTimeout,
clearTimeout: this.clearTimeout
}));
}
};
}, 'withSafeTimeout');
/* harmony default export */ var with_safe_timeout = (withSafeTimeout);
// CONCATENATED MODULE: ./node_modules/@wordpress/compose/build-module/higher-order/with-state/index.js
/**
* WordPress dependencies
*/
/**
* Internal dependencies
*/
/**
* A Higher Order Component used to provide and manage internal component state
* via props.
*
* @param {?Object} initialState Optional initial state of the component.
*
* @return {WPComponent} Wrapped component.
*/
function withState(initialState = {}) {
return create_higher_order_component(OriginalComponent => {
return class WrappedComponent extends external_wp_element_["Component"] {
constructor() {
super(...arguments);
this.setState = this.setState.bind(this);
this.state = initialState;
}
render() {
return Object(external_wp_element_["createElement"])(OriginalComponent, Object(esm_extends["a" /* default */])({}, this.props, this.state, {
setState: this.setState
}));
}
};
}, 'withState');
}
// EXTERNAL MODULE: external ["wp","keycodes"]
var external_wp_keycodes_ = __webpack_require__("RxS6");
// EXTERNAL MODULE: external ["wp","dom"]
var external_wp_dom_ = __webpack_require__("1CF3");
// CONCATENATED MODULE: ./node_modules/@wordpress/compose/build-module/hooks/use-constrained-tabbing/index.js
/**
* WordPress dependencies
*/
/**
* In Dialogs/modals, the tabbing must be constrained to the content of
* the wrapper element. This hook adds the behavior to the returned ref.
*
* @return {Object|Function} Element Ref.
*
* @example
* ```js
* import { useConstrainedTabbing } from '@wordpress/compose';
*
* const ConstrainedTabbingExample = () => {
* const constrainedTabbingRef = useConstrainedTabbing()
* return (
*
*
*
*
* );
* }
* ```
*/
function useConstrainedTabbing() {
const ref = Object(external_wp_element_["useCallback"])(node => {
if (!node) {
return;
}
node.addEventListener('keydown', event => {
if (event.keyCode !== external_wp_keycodes_["TAB"]) {
return;
}
const tabbables = external_wp_dom_["focus"].tabbable.find(node);
if (!tabbables.length) {
return;
}
const firstTabbable = tabbables[0];
const lastTabbable = tabbables[tabbables.length - 1];
if (event.shiftKey && event.target === firstTabbable) {
event.preventDefault();
lastTabbable.focus();
} else if (!event.shiftKey && event.target === lastTabbable) {
event.preventDefault();
firstTabbable.focus();
/*
* When pressing Tab and none of the tabbables has focus, the keydown
* event happens on the wrapper div: move focus on the first tabbable.
*/
} else if (!tabbables.includes(event.target)) {
event.preventDefault();
firstTabbable.focus();
}
});
}, []);
return ref;
}
/* harmony default export */ var use_constrained_tabbing = (useConstrainedTabbing);
// EXTERNAL MODULE: ./node_modules/clipboard/dist/clipboard.js
var dist_clipboard = __webpack_require__("sxGJ");
var clipboard_default = /*#__PURE__*/__webpack_require__.n(dist_clipboard);
// CONCATENATED MODULE: ./node_modules/@wordpress/compose/build-module/hooks/use-copy-on-click/index.js
/**
* External dependencies
*/
/**
* WordPress dependencies
*/
/**
* Copies the text to the clipboard when the element is clicked.
*
* @deprecated
*
* @param {Object} ref Reference with the element.
* @param {string|Function} text The text to copy.
* @param {number} timeout Optional timeout to reset the returned
* state. 4 seconds by default.
*
* @return {boolean} Whether or not the text has been copied. Resets after the
* timeout.
*/
function useCopyOnClick(ref, text, timeout = 4000) {
external_wp_deprecated_default()('wp.compose.useCopyOnClick', {
since: '10.3',
plugin: 'Gutenberg',
alternative: 'wp.compose.useCopyToClipboard'
});
const clipboard = Object(external_wp_element_["useRef"])();
const [hasCopied, setHasCopied] = Object(external_wp_element_["useState"])(false);
Object(external_wp_element_["useEffect"])(() => {
let timeoutId; // Clipboard listens to click events.
clipboard.current = new clipboard_default.a(ref.current, {
text: () => typeof text === 'function' ? text() : text
});
clipboard.current.on('success', ({
clearSelection,
trigger
}) => {
// Clearing selection will move focus back to the triggering button,
// ensuring that it is not reset to the body, and further that it is
// kept within the rendered node.
clearSelection(); // Handle ClipboardJS focus bug, see https://github.com/zenorocha/clipboard.js/issues/680
if (trigger) {
trigger.focus();
}
if (timeout) {
setHasCopied(true);
clearTimeout(timeoutId);
timeoutId = setTimeout(() => setHasCopied(false), timeout);
}
});
return () => {
clipboard.current.destroy();
clearTimeout(timeoutId);
};
}, [text, timeout, setHasCopied]);
return hasCopied;
}
// CONCATENATED MODULE: ./node_modules/@wordpress/compose/build-module/hooks/use-ref-effect/index.js
/**
* WordPress dependencies
*/
/**
* Effect-like ref callback. Just like with `useEffect`, this allows you to
* return a cleanup function to be run if the ref changes or one of the
* dependencies changes. The ref is provided as an argument to the callback
* functions. The main difference between this and `useEffect` is that
* the `useEffect` callback is not called when the ref changes, but this is.
* Pass the returned ref callback as the component's ref and merge multiple refs
* with `useMergeRefs`.
*
* It's worth noting that if the dependencies array is empty, there's not
* strictly a need to clean up event handlers for example, because the node is
* to be removed. It *is* necessary if you add dependencies because the ref
* callback will be called multiple times for the same node.
*
* @param {Function} callback Callback with ref as argument.
* @param {Array} dependencies Dependencies of the callback.
*
* @return {Function} Ref callback.
*/
function useRefEffect(callback, dependencies) {
const cleanup = Object(external_wp_element_["useRef"])();
return Object(external_wp_element_["useCallback"])(node => {
if (node) {
cleanup.current = callback(node);
} else if (cleanup.current) {
cleanup.current();
}
}, dependencies);
}
// CONCATENATED MODULE: ./node_modules/@wordpress/compose/build-module/hooks/use-copy-to-clipboard/index.js
/**
* External dependencies
*/
/**
* WordPress dependencies
*/
/**
* Internal dependencies
*/
/** @typedef {import('@wordpress/element').RefObject} RefObject */
function useUpdatedRef(value) {
const ref = Object(external_wp_element_["useRef"])(value);
ref.current = value;
return ref;
}
/**
* Copies the given text to the clipboard when the element is clicked.
*
* @param {text|Function} text The text to copy. Use a function if not
* already available and expensive to compute.
* @param {Function} onSuccess Called when to text is copied.
*
* @return {RefObject} A ref to assign to the target element.
*/
function useCopyToClipboard(text, onSuccess) {
// Store the dependencies as refs and continuesly update them so they're
// fresh when the callback is called.
const textRef = useUpdatedRef(text);
const onSuccesRef = useUpdatedRef(onSuccess);
return useRefEffect(node => {
// Clipboard listens to click events.
const clipboard = new clipboard_default.a(node, {
text() {
return typeof textRef.current === 'function' ? textRef.current() : textRef.current;
}
});
clipboard.on('success', ({
clearSelection
}) => {
// Clearing selection will move focus back to the triggering
// button, ensuring that it is not reset to the body, and
// further that it is kept within the rendered node.
clearSelection(); // Handle ClipboardJS focus bug, see
// https://github.com/zenorocha/clipboard.js/issues/680
node.focus();
if (onSuccesRef.current) {
onSuccesRef.current();
}
});
return () => {
clipboard.destroy();
};
}, []);
}
// CONCATENATED MODULE: ./node_modules/@wordpress/compose/build-module/hooks/use-focus-on-mount/index.js
/**
* WordPress dependencies
*/
/**
* Hook used to focus the first tabbable element on mount.
*
* @param {boolean|string} focusOnMount Focus on mount mode.
* @return {Function} Ref callback.
*
* @example
* ```js
* import { useFocusOnMount } from '@wordpress/compose';
*
* const WithFocusOnMount = () => {
* const ref = useFocusOnMount()
* return (
*
*
*
*
* );
* }
* ```
*/
function useFocusOnMount(focusOnMount = 'firstElement') {
const focusOnMountRef = Object(external_wp_element_["useRef"])(focusOnMount);
Object(external_wp_element_["useEffect"])(() => {
focusOnMountRef.current = focusOnMount;
}, [focusOnMount]);
return Object(external_wp_element_["useCallback"])(node => {
if (!node || focusOnMountRef.current === false) {
return;
}
if (node.contains(node.ownerDocument.activeElement)) {
return;
}
let target = node;
if (focusOnMountRef.current === 'firstElement') {
const firstTabbable = external_wp_dom_["focus"].tabbable.find(node)[0];
if (firstTabbable) {
target = firstTabbable;
}
}
target.focus();
}, []);
}
// CONCATENATED MODULE: ./node_modules/@wordpress/compose/build-module/hooks/use-focus-return/index.js
/**
* WordPress dependencies
*/
/**
* When opening modals/sidebars/dialogs, the focus
* must move to the opened area and return to the
* previously focused element when closed.
* The current hook implements the returning behavior.
*
* @param {Function?} onFocusReturn Overrides the default return behavior.
* @return {Function} Element Ref.
*
* @example
* ```js
* import { useFocusReturn } from '@wordpress/compose';
*
* const WithFocusReturn = () => {
* const ref = useFocusReturn()
* return (
*
*
*
*
* );
* }
* ```
*/
function useFocusReturn(onFocusReturn) {
const ref = Object(external_wp_element_["useRef"])();
const focusedBeforeMount = Object(external_wp_element_["useRef"])();
const onFocusReturnRef = Object(external_wp_element_["useRef"])(onFocusReturn);
Object(external_wp_element_["useEffect"])(() => {
onFocusReturnRef.current = onFocusReturn;
}, [onFocusReturn]);
return Object(external_wp_element_["useCallback"])(node => {
if (node) {
// Set ref to be used when unmounting.
ref.current = node; // Only set when the node mounts.
if (focusedBeforeMount.current) {
return;
}
focusedBeforeMount.current = node.ownerDocument.activeElement;
} else if (focusedBeforeMount.current) {
const isFocused = ref.current.contains(ref.current.ownerDocument.activeElement);
if (ref.current.isConnected && !isFocused) {
return;
} // Defer to the component's own explicit focus return behavior, if
// specified. This allows for support that the `onFocusReturn`
// decides to allow the default behavior to occur under some
// conditions.
if (onFocusReturnRef.current) {
onFocusReturnRef.current();
} else {
focusedBeforeMount.current.focus();
}
}
}, []);
}
/* harmony default export */ var use_focus_return = (useFocusReturn);
// CONCATENATED MODULE: ./node_modules/@wordpress/compose/build-module/hooks/use-focus-outside/index.js
/**
* External dependencies
*/
/**
* WordPress dependencies
*/
/**
* Input types which are classified as button types, for use in considering
* whether element is a (focus-normalized) button.
*
* @type {string[]}
*/
const INPUT_BUTTON_TYPES = ['button', 'submit'];
/**
* @typedef {HTMLButtonElement | HTMLLinkElement | HTMLInputElement} FocusNormalizedButton
*/
// Disable reason: Rule doesn't support predicate return types
/* eslint-disable jsdoc/valid-types */
/**
* Returns true if the given element is a button element subject to focus
* normalization, or false otherwise.
*
* @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#Clicking_and_focus
*
* @param {EventTarget} eventTarget The target from a mouse or touch event.
*
* @return {eventTarget is FocusNormalizedButton} Whether element is a button.
*/
function isFocusNormalizedButton(eventTarget) {
if (!(eventTarget instanceof window.HTMLElement)) {
return false;
}
switch (eventTarget.nodeName) {
case 'A':
case 'BUTTON':
return true;
case 'INPUT':
return Object(external_lodash_["includes"])(INPUT_BUTTON_TYPES,
/** @type {HTMLInputElement} */
eventTarget.type);
}
return false;
}
/* eslint-enable jsdoc/valid-types */
/**
* @typedef {import('react').SyntheticEvent} SyntheticEvent
*/
/**
* @callback EventCallback
* @param {SyntheticEvent} event input related event.
*/
/**
* @typedef FocusOutsideReactElement
* @property {EventCallback} handleFocusOutside callback for a focus outside event.
*/
/**
* @typedef {import('react').MutableRefObject} FocusOutsideRef
*/
/**
* @typedef {Object} FocusOutsideReturnValue
* @property {EventCallback} onFocus An event handler for focus events.
* @property {EventCallback} onBlur An event handler for blur events.
* @property {EventCallback} onMouseDown An event handler for mouse down events.
* @property {EventCallback} onMouseUp An event handler for mouse up events.
* @property {EventCallback} onTouchStart An event handler for touch start events.
* @property {EventCallback} onTouchEnd An event handler for touch end events.
*/
/**
* A react hook that can be used to check whether focus has moved outside the
* element the event handlers are bound to.
*
* @param {EventCallback} onFocusOutside A callback triggered when focus moves outside
* the element the event handlers are bound to.
*
* @return {FocusOutsideReturnValue} An object containing event handlers. Bind the event handlers
* to a wrapping element element to capture when focus moves
* outside that element.
*/
function useFocusOutside(onFocusOutside) {
const currentOnFocusOutside = Object(external_wp_element_["useRef"])(onFocusOutside);
Object(external_wp_element_["useEffect"])(() => {
currentOnFocusOutside.current = onFocusOutside;
}, [onFocusOutside]);
const preventBlurCheck = Object(external_wp_element_["useRef"])(false);
/**
* @type {import('react').MutableRefObject}
*/
const blurCheckTimeoutId = Object(external_wp_element_["useRef"])();
/**
* Cancel a blur check timeout.
*/
const cancelBlurCheck = Object(external_wp_element_["useCallback"])(() => {
clearTimeout(blurCheckTimeoutId.current);
}, []); // Cancel blur checks on unmount.
Object(external_wp_element_["useEffect"])(() => {
return () => cancelBlurCheck();
}, []); // Cancel a blur check if the callback or ref is no longer provided.
Object(external_wp_element_["useEffect"])(() => {
if (!onFocusOutside) {
cancelBlurCheck();
}
}, [onFocusOutside, cancelBlurCheck]);
/**
* Handles a mousedown or mouseup event to respectively assign and
* unassign a flag for preventing blur check on button elements. Some
* browsers, namely Firefox and Safari, do not emit a focus event on
* button elements when clicked, while others do. The logic here
* intends to normalize this as treating click on buttons as focus.
*
* @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#Clicking_and_focus
*
* @param {SyntheticEvent} event Event for mousedown or mouseup.
*/
const normalizeButtonFocus = Object(external_wp_element_["useCallback"])(event => {
const {
type,
target
} = event;
const isInteractionEnd = Object(external_lodash_["includes"])(['mouseup', 'touchend'], type);
if (isInteractionEnd) {
preventBlurCheck.current = false;
} else if (isFocusNormalizedButton(target)) {
preventBlurCheck.current = true;
}
}, []);
/**
* A callback triggered when a blur event occurs on the element the handler
* is bound to.
*
* Calls the `onFocusOutside` callback in an immediate timeout if focus has
* move outside the bound element and is still within the document.
*
* @param {SyntheticEvent} event Blur event.
*/
const queueBlurCheck = Object(external_wp_element_["useCallback"])(event => {
// React does not allow using an event reference asynchronously
// due to recycling behavior, except when explicitly persisted.
event.persist(); // Skip blur check if clicking button. See `normalizeButtonFocus`.
if (preventBlurCheck.current) {
return;
}
blurCheckTimeoutId.current = setTimeout(() => {
// If document is not focused then focus should remain
// inside the wrapped component and therefore we cancel
// this blur event thereby leaving focus in place.
// https://developer.mozilla.org/en-US/docs/Web/API/Document/hasFocus.
if (!document.hasFocus()) {
event.preventDefault();
return;
}
if ('function' === typeof currentOnFocusOutside.current) {
currentOnFocusOutside.current(event);
}
}, 0);
}, []);
return {
onFocus: cancelBlurCheck,
onMouseDown: normalizeButtonFocus,
onMouseUp: normalizeButtonFocus,
onTouchStart: normalizeButtonFocus,
onTouchEnd: normalizeButtonFocus,
onBlur: queueBlurCheck
};
}
// CONCATENATED MODULE: ./node_modules/@wordpress/compose/build-module/hooks/use-merge-refs/index.js
/**
* WordPress dependencies
*/
/** @typedef {import('@wordpress/element').RefObject} RefObject */
/** @typedef {import('@wordpress/element').RefCallback} RefCallback */
/**
* Merges refs into one ref callback. Ensures the merged ref callbacks are only
* called when it changes (as a result of a `useCallback` dependency update) or
* when the ref value changes. If you don't wish a ref callback to be called on
* every render, wrap it with `useCallback( ref, [] )`.
* Dependencies can be added, but when a dependency changes, the old ref
* callback will be called with `null` and the new ref callback will be called
* with the same node.
*
* @param {Array} refs The refs to be merged.
*
* @return {RefCallback} The merged ref callback.
*/
function useMergeRefs(refs) {
const element = Object(external_wp_element_["useRef"])(null);
const didElementChange = Object(external_wp_element_["useRef"])(false);
const previousRefs = Object(external_wp_element_["useRef"])(refs);
const currentRefs = Object(external_wp_element_["useRef"])(refs); // Update on render before the ref callback is called, so the ref callback
// always has access to the current refs.
currentRefs.current = refs; // If any of the refs change, call the previous ref with `null` and the new
// ref with the node, except when the element changes in the same cycle, in
// which case the ref callbacks will already have been called.
Object(external_wp_element_["useLayoutEffect"])(() => {
refs.forEach((ref, index) => {
const previousRef = previousRefs.current[index];
if (typeof ref === 'function' && ref !== previousRef && didElementChange.current === false) {
previousRef(null);
ref(element.current);
}
});
previousRefs.current = refs;
}, refs); // No dependencies, must be reset after every render so ref callbacks are
// correctly called after a ref change.
Object(external_wp_element_["useLayoutEffect"])(() => {
didElementChange.current = false;
}); // There should be no dependencies so that `callback` is only called when
// the node changes.
return Object(external_wp_element_["useCallback"])(value => {
// Update the element so it can be used when calling ref callbacks on a
// dependency change.
element.current = value;
didElementChange.current = true; // When an element changes, the current ref callback should be called
// with the new element and the previous one with `null`.
const refsToUpdate = value ? currentRefs.current : previousRefs.current; // Update the latest refs.
refsToUpdate.forEach(ref => {
if (typeof ref === 'function') {
ref(value);
} else if (ref && ref.hasOwnProperty('current')) {
ref.current = value;
}
});
}, []);
}
// CONCATENATED MODULE: ./node_modules/@wordpress/compose/build-module/hooks/use-dialog/index.js
/**
* WordPress dependencies
*/
/**
* Internal dependencies
*/
/**
* Returns a ref and props to apply to a dialog wrapper to enable the following behaviors:
* - constrained tabbing.
* - focus on mount.
* - return focus on unmount.
* - focus outside.
*
* @param {Object} options Dialog Options.
*/
function useDialog(options) {
const onClose = Object(external_wp_element_["useRef"])();
Object(external_wp_element_["useEffect"])(() => {
onClose.current = options.onClose;
}, [options.onClose]);
const constrainedTabbingRef = use_constrained_tabbing();
const focusOnMountRef = useFocusOnMount();
const focusReturnRef = use_focus_return();
const focusOutsideProps = useFocusOutside(options.onClose);
const closeOnEscapeRef = Object(external_wp_element_["useCallback"])(node => {
if (!node) {
return;
}
node.addEventListener('keydown', event => {
// Close on escape
if (event.keyCode === external_wp_keycodes_["ESCAPE"] && onClose.current) {
event.stopPropagation();
onClose.current();
}
});
}, []);
return [useMergeRefs([constrainedTabbingRef, focusReturnRef, focusOnMountRef, closeOnEscapeRef]), { ...focusOutsideProps,
tabIndex: '-1'
}];
}
/* harmony default export */ var use_dialog = (useDialog);
// CONCATENATED MODULE: ./node_modules/@wordpress/compose/build-module/hooks/use-isomorphic-layout-effect/index.js
/**
* WordPress dependencies
*/
/**
* Preferred over direct usage of `useLayoutEffect` when supporting
* server rendered components (SSR) because currently React
* throws a warning when using useLayoutEffect in that environment.
*/
const useIsomorphicLayoutEffect = typeof window !== 'undefined' ? external_wp_element_["useLayoutEffect"] : external_wp_element_["useEffect"];
/* harmony default export */ var use_isomorphic_layout_effect = (useIsomorphicLayoutEffect);
// CONCATENATED MODULE: ./node_modules/@wordpress/compose/build-module/hooks/use-dragging/index.js
/**
* WordPress dependencies
*/
/**
* Internal dependencies
*/
function useDragging({
onDragStart,
onDragMove,
onDragEnd
}) {
const [isDragging, setIsDragging] = Object(external_wp_element_["useState"])(false);
const eventsRef = Object(external_wp_element_["useRef"])({
onDragStart,
onDragMove,
onDragEnd
});
use_isomorphic_layout_effect(() => {
eventsRef.current.onDragStart = onDragStart;
eventsRef.current.onDragMove = onDragMove;
eventsRef.current.onDragEnd = onDragEnd;
}, [onDragStart, onDragMove, onDragEnd]);
const onMouseMove = Object(external_wp_element_["useCallback"])((...args) => eventsRef.current.onDragMove && eventsRef.current.onDragMove(...args), []);
const endDrag = Object(external_wp_element_["useCallback"])((...args) => {
if (eventsRef.current.onDragEnd) {
eventsRef.current.onDragEnd(...args);
}
document.removeEventListener('mousemove', onMouseMove);
document.removeEventListener('mouseup', endDrag);
setIsDragging(false);
}, []);
const startDrag = Object(external_wp_element_["useCallback"])((...args) => {
if (eventsRef.current.onDragStart) {
eventsRef.current.onDragStart(...args);
}
document.addEventListener('mousemove', onMouseMove);
document.addEventListener('mouseup', endDrag);
setIsDragging(true);
}, []); // Remove the global events when unmounting if needed.
Object(external_wp_element_["useEffect"])(() => {
return () => {
if (isDragging) {
document.removeEventListener('mousemove', onMouseMove);
document.removeEventListener('mouseup', endDrag);
}
};
}, [isDragging]);
return {
startDrag,
endDrag,
isDragging
};
}
// EXTERNAL MODULE: ./node_modules/mousetrap/mousetrap.js
var mousetrap_mousetrap = __webpack_require__("imBb");
var mousetrap_default = /*#__PURE__*/__webpack_require__.n(mousetrap_mousetrap);
// EXTERNAL MODULE: ./node_modules/mousetrap/plugins/global-bind/mousetrap-global-bind.js
var mousetrap_global_bind = __webpack_require__("VcSt");
// CONCATENATED MODULE: ./node_modules/@wordpress/compose/build-module/hooks/use-keyboard-shortcut/index.js
/**
* External dependencies
*/
/**
* WordPress dependencies
*/
/**
* A block selection object.
*
* @typedef {Object} WPKeyboardShortcutConfig
*
* @property {boolean} [bindGlobal] Handle keyboard events anywhere including inside textarea/input fields.
* @property {string} [eventName] Event name used to trigger the handler, defaults to keydown.
* @property {boolean} [isDisabled] Disables the keyboard handler if the value is true.
* @property {Object} [target] React reference to the DOM element used to catch the keyboard event.
*/
/**
* Return true if platform is MacOS.
*
* @param {Object} _window window object by default; used for DI testing.
*
* @return {boolean} True if MacOS; false otherwise.
*/
function isAppleOS(_window = window) {
const {
platform
} = _window.navigator;
return platform.indexOf('Mac') !== -1 || Object(external_lodash_["includes"])(['iPad', 'iPhone'], platform);
}
/**
* Attach a keyboard shortcut handler.
*
* @param {string[]|string} shortcuts Keyboard Shortcuts.
* @param {Function} callback Shortcut callback.
* @param {WPKeyboardShortcutConfig} options Shortcut options.
*/
function useKeyboardShortcut(shortcuts, callback, {
bindGlobal = false,
eventName = 'keydown',
isDisabled = false,
// This is important for performance considerations.
target
} = {}) {
const currentCallback = Object(external_wp_element_["useRef"])(callback);
Object(external_wp_element_["useEffect"])(() => {
currentCallback.current = callback;
}, [callback]);
Object(external_wp_element_["useEffect"])(() => {
if (isDisabled) {
return;
}
const mousetrap = new mousetrap_default.a(target ? target.current : document);
Object(external_lodash_["castArray"])(shortcuts).forEach(shortcut => {
const keys = shortcut.split('+'); // Determines whether a key is a modifier by the length of the string.
// E.g. if I add a pass a shortcut Shift+Cmd+M, it'll determine that
// the modifiers are Shift and Cmd because they're not a single character.
const modifiers = new Set(keys.filter(value => value.length > 1));
const hasAlt = modifiers.has('alt');
const hasShift = modifiers.has('shift'); // This should be better moved to the shortcut registration instead.
if (isAppleOS() && (modifiers.size === 1 && hasAlt || modifiers.size === 2 && hasAlt && hasShift)) {
throw new Error(`Cannot bind ${shortcut}. Alt and Shift+Alt modifiers are reserved for character input.`);
}
const bindFn = bindGlobal ? 'bindGlobal' : 'bind';
mousetrap[bindFn](shortcut, (...args) => currentCallback.current(...args), eventName);
});
return () => {
mousetrap.reset();
};
}, [shortcuts, bindGlobal, eventName, target, isDisabled]);
}
/* harmony default export */ var use_keyboard_shortcut = (useKeyboardShortcut);
// CONCATENATED MODULE: ./node_modules/@wordpress/compose/build-module/hooks/use-media-query/index.js
/**
* WordPress dependencies
*/
/**
* Runs a media query and returns its value when it changes.
*
* @param {string} [query] Media Query.
* @return {boolean} return value of the media query.
*/
function useMediaQuery(query) {
const [match, setMatch] = Object(external_wp_element_["useState"])(() => !!(query && typeof window !== 'undefined' && window.matchMedia(query).matches));
Object(external_wp_element_["useEffect"])(() => {
if (!query) {
return;
}
const updateMatch = () => setMatch(window.matchMedia(query).matches);
updateMatch();
const list = window.matchMedia(query);
list.addListener(updateMatch);
return () => {
list.removeListener(updateMatch);
};
}, [query]);
return query && match;
}
// CONCATENATED MODULE: ./node_modules/@wordpress/compose/build-module/hooks/use-previous/index.js
/**
* WordPress dependencies
*/
/**
* Use something's value from the previous render.
* Based on https://usehooks.com/usePrevious/.
*
* @template T
*
* @param {T} value The value to track.
*
* @return {T|undefined} The value from the previous render.
*/
function usePrevious(value) {
// Disable reason: without an explicit type detail, the type of ref will be
// inferred based on the initial useRef argument, which is undefined.
// https://github.com/WordPress/gutenberg/pull/22597#issuecomment-633588366
/* eslint-disable jsdoc/no-undefined-types */
const ref = Object(external_wp_element_["useRef"])(
/** @type {T|undefined} */
undefined);
/* eslint-enable jsdoc/no-undefined-types */
// Store current value in ref.
Object(external_wp_element_["useEffect"])(() => {
ref.current = value;
}, [value]); // Re-run when value changes.
// Return previous value (happens before update in useEffect above).
return ref.current;
}
// CONCATENATED MODULE: ./node_modules/@wordpress/compose/build-module/hooks/use-reduced-motion/index.js
/**
* Internal dependencies
*/
/**
* Whether or not the user agent is Internet Explorer.
*
* @type {boolean}
*/
const IS_IE = typeof window !== 'undefined' && window.navigator.userAgent.indexOf('Trident') >= 0;
/**
* Hook returning whether the user has a preference for reduced motion.
*
* @return {boolean} Reduced motion preference value.
*/
const useReducedMotion = undefined || IS_IE ? () => true : () => useMediaQuery('(prefers-reduced-motion: reduce)');
/* harmony default export */ var use_reduced_motion = (useReducedMotion);
// CONCATENATED MODULE: ./node_modules/@wordpress/compose/build-module/hooks/use-viewport-match/index.js
/**
* WordPress dependencies
*/
/**
* Internal dependencies
*/
/**
* @typedef {"huge"|"wide"|"large"|"medium"|"small"|"mobile"} WPBreakpoint
*/
/**
* Hash of breakpoint names with pixel width at which it becomes effective.
*
* @see _breakpoints.scss
*
* @type {Object}
*/
const BREAKPOINTS = {
huge: 1440,
wide: 1280,
large: 960,
medium: 782,
small: 600,
mobile: 480
};
/**
* @typedef {">="|"<"} WPViewportOperator
*/
/**
* Object mapping media query operators to the condition to be used.
*
* @type {Object}
*/
const CONDITIONS = {
'>=': 'min-width',
'<': 'max-width'
};
/**
* Object mapping media query operators to a function that given a breakpointValue and a width evaluates if the operator matches the values.
*
* @type {Object}
*/
const OPERATOR_EVALUATORS = {
'>=': (breakpointValue, width) => width >= breakpointValue,
'<': (breakpointValue, width) => width < breakpointValue
};
const ViewportMatchWidthContext = Object(external_wp_element_["createContext"])(null);
/**
* Returns true if the viewport matches the given query, or false otherwise.
*
* @param {WPBreakpoint} breakpoint Breakpoint size name.
* @param {WPViewportOperator} [operator=">="] Viewport operator.
*
* @example
*
* ```js
* useViewportMatch( 'huge', '<' );
* useViewportMatch( 'medium' );
* ```
*
* @return {boolean} Whether viewport matches query.
*/
const useViewportMatch = (breakpoint, operator = '>=') => {
const simulatedWidth = Object(external_wp_element_["useContext"])(ViewportMatchWidthContext);
const mediaQuery = !simulatedWidth && `(${CONDITIONS[operator]}: ${BREAKPOINTS[breakpoint]}px)`;
const mediaQueryResult = useMediaQuery(mediaQuery);
if (simulatedWidth) {
return OPERATOR_EVALUATORS[operator](BREAKPOINTS[breakpoint], simulatedWidth);
}
return mediaQueryResult;
};
useViewportMatch.__experimentalWidthProvider = ViewportMatchWidthContext.Provider;
/* harmony default export */ var use_viewport_match = (useViewportMatch);
// EXTERNAL MODULE: ./node_modules/react-resize-aware/dist/index.js
var dist = __webpack_require__("SSiF");
var dist_default = /*#__PURE__*/__webpack_require__.n(dist);
// CONCATENATED MODULE: ./node_modules/@wordpress/compose/build-module/hooks/use-resize-observer/index.js
/**
* External dependencies
*/
/**
* Hook which allows to listen the resize event of any target element when it changes sizes.
* _Note: `useResizeObserver` will report `null` until after first render_
*
* @return {Array} An array of {Element} `resizeListener` and {?Object} `sizes` with properties `width` and `height`
*
* @example
*
* ```js
* const App = () => {
* const [ resizeListener, sizes ] = useResizeObserver();
*
* return (
*