function select_control_useUniqueId(idProp) {
var instanceId = Object(external_wp_compose_["useInstanceId"])(SelectControl);
var id = "inspector-select-control-".concat(instanceId);
function SelectControl(_ref, ref) {
var className = _ref.className,
_ref$disabled = _ref.disabled,
disabled = _ref$disabled === void 0 ? false : _ref$disabled,
hideLabelFromVision = _ref.hideLabelFromVision,
_ref$multiple = _ref.multiple,
multiple = _ref$multiple === void 0 ? false : _ref$multiple,
_ref$onBlur = _ref.onBlur,
onBlur = _ref$onBlur === void 0 ? external_lodash_["noop"] : _ref$onBlur,
_ref$onChange = _ref.onChange,
onChange = _ref$onChange === void 0 ? external_lodash_["noop"] : _ref$onChange,
_ref$onFocus = _ref.onFocus,
onFocus = _ref$onFocus === void 0 ? external_lodash_["noop"] : _ref$onFocus,
_ref$options = _ref.options,
options = _ref$options === void 0 ? [] : _ref$options,
size = _ref$size === void 0 ? 'default' : _ref$size,
_ref$labelPosition = _ref.labelPosition,
labelPosition = _ref$labelPosition === void 0 ? 'top' : _ref$labelPosition,
props = Object(objectWithoutProperties["a" /* default */])(_ref, ["className", "disabled", "help", "hideLabelFromVision", "id", "label", "multiple", "onBlur", "onChange", "onFocus", "options", "size", "value", "labelPosition"]);
var _useState = Object(external_wp_element_["useState"])(false),
_useState2 = Object(slicedToArray["a" /* default */])(_useState, 2),
isFocused = _useState2[0],
setIsFocused = _useState2[1];
var id = select_control_useUniqueId(idProp);
var helpId = help ? "".concat(id, "__help") : undefined; // Disable reason: A select with an onchange throws a warning
if (Object(external_lodash_["isEmpty"])(options)) return null;
var handleOnBlur = function handleOnBlur(event) {
var handleOnFocus = function handleOnFocus(event) {
var handleOnChange = function handleOnChange(event) {
var selectedOptions = Object(toConsumableArray["a" /* default */])(event.target.options).filter(function (_ref2) {
var selected = _ref2.selected;
var newValues = selectedOptions.map(function (_ref3) {
onChange(event.target.value, {
var classes = classnames_default()('components-select-control', className);
/* eslint-disable jsx-a11y/no-onchange */
return Object(external_wp_element_["createElement"])(base_control, {
}, Object(external_wp_element_["createElement"])(input_base, {
hideLabelFromVision: hideLabelFromVision,
suffix: Object(external_wp_element_["createElement"])(DownArrowWrapper, null, Object(external_wp_element_["createElement"])(build_module_icon["a" /* default */], {
icon: chevron_down["a" /* default */],
labelPosition: labelPosition
}, Object(external_wp_element_["createElement"])(Select, Object(esm_extends["a" /* default */])({}, props, {
"aria-describedby": helpId,
className: "components-select-control__input",
onChange: handleOnChange,
}), options.map(function (option, index) {
var key = option.id || "".concat(option.label, "-").concat(option.value, "-").concat(index);
return Object(external_wp_element_["createElement"])("option", {
disabled: option.disabled
/* eslint-enable jsx-a11y/no-onchange */
var select_control_ForwardedComponent = Object(external_wp_element_["forwardRef"])(SelectControl);
/* harmony default export */ var select_control = (select_control_ForwardedComponent);
// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/dimension-control/sizes.js
* defines the sizes used in dimension controls
* all hardcoded `size` values are based on the value of
* the Sass variable `$block-padding` from
* `packages/block-editor/src/components/dimension-control/sizes.js`.
* Finds the correct size object from the provided sizes
* table by size slug (eg: `medium`)
* @param {Array} sizes containing objects for each size definition
* @param {string} slug a string representation of the size (eg: `medium`)
* @return {Object} the matching size definition
var findSizeBySlug = function findSizeBySlug(sizes, slug) {
return sizes.find(function (size) {
return slug === size.slug;
/* harmony default export */ var dimension_control_sizes = ([{
name: Object(external_wp_i18n_["__"])('None'),
name: Object(external_wp_i18n_["__"])('Small'),
name: Object(external_wp_i18n_["__"])('Medium'),
name: Object(external_wp_i18n_["__"])('Large'),
name: Object(external_wp_i18n_["__"])('Extra Large'),
// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/dimension-control/index.js
function DimensionControl(props) {
_props$sizes = props.sizes,
sizes = _props$sizes === void 0 ? dimension_control_sizes : _props$sizes,
onChange = props.onChange,
_props$className = props.className,
className = _props$className === void 0 ? '' : _props$className;
var onChangeSpacingSize = function onChangeSpacingSize(val) {
var theSize = findSizeBySlug(sizes, val);
if (!theSize || value === theSize.slug) {
} else if (Object(external_lodash_["isFunction"])(onChange)) {
var formatSizesAsOptions = function formatSizesAsOptions(theSizes) {
var options = theSizes.map(function (_ref) {
label: Object(external_wp_i18n_["__"])('Default'),
var selectLabel = Object(external_wp_element_["createElement"])(external_wp_element_["Fragment"], null, icon && Object(external_wp_element_["createElement"])(components_build_module_icon["a" /* default */], {
return Object(external_wp_element_["createElement"])(select_control, {
className: classnames_default()(className, 'block-editor-dimension-control'),
hideLabelFromVision: false,
onChange: onChangeSpacingSize,
options: formatSizesAsOptions(sizes)
/* harmony default export */ var dimension_control = (DimensionControl);
// EXTERNAL MODULE: external ["wp","dom"]
var external_wp_dom_ = __webpack_require__("1CF3");
// CONCATENATED MODULE: ./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)."; }
var StyledWrapper = styled_base_browser_esm("div", {
styles: "position:relative;pointer-events:none;&::after{content:'';position:absolute;top:0;right:0;bottom:0;left:0;}*{pointer-events:none;}"
// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/disabled/index.js
var _createContext = Object(external_wp_element_["createContext"])(false),
Consumer = _createContext.Consumer,
disabled_Provider = _createContext.Provider;
* Names of control nodes which qualify for disabled behavior.
* See WHATWG HTML Standard: 4.10.18.5: "Enabling and disabling form controls: the disabled attribute".
* @see https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#enabling-and-disabling-form-controls:-the-disabled-attribute
var DISABLED_ELIGIBLE_NODE_NAMES = ['BUTTON', 'FIELDSET', 'INPUT', 'OPTGROUP', 'OPTION', 'SELECT', 'TEXTAREA'];
function Disabled(_ref) {
var className = _ref.className,
children = _ref.children,
_ref$isDisabled = _ref.isDisabled,
isDisabled = _ref$isDisabled === void 0 ? true : _ref$isDisabled,
props = Object(objectWithoutProperties["a" /* default */])(_ref, ["className", "children", "isDisabled"]);
var node = Object(external_wp_element_["useRef"])();
var disable = function disable() {
external_wp_dom_["focus"].focusable.find(node.current).forEach(function (focusable) {
if (Object(external_lodash_["includes"])(DISABLED_ELIGIBLE_NODE_NAMES, focusable.nodeName)) {
focusable.setAttribute('disabled', '');
if (focusable.nodeName === 'A') {
focusable.setAttribute('tabindex', -1);
var tabIndex = focusable.getAttribute('tabindex');
if (tabIndex !== null && tabIndex !== '-1') {
focusable.removeAttribute('tabindex');
if (focusable.hasAttribute('contenteditable')) {
focusable.setAttribute('contenteditable', 'false');
}; // Debounce re-disable since disabling process itself will incur
// additional mutations which should be ignored.
var debouncedDisable = Object(external_wp_element_["useCallback"])(Object(external_lodash_["debounce"])(disable, {
Object(external_wp_element_["useLayoutEffect"])(function () {
var observer = new window.MutationObserver(debouncedDisable);
observer.observe(node.current, {
debouncedDisable.cancel();
return Object(external_wp_element_["createElement"])(disabled_Provider, {
return Object(external_wp_element_["createElement"])(disabled_Provider, {
}, Object(external_wp_element_["createElement"])(StyledWrapper, Object(esm_extends["a" /* default */])({
className: classnames_default()(className, 'components-disabled')
Disabled.Consumer = Consumer;
/* harmony default export */ var build_module_disabled = (Disabled);
// CONCATENATED MODULE: ./node_modules/reakit/es/__keys-e6a5cfbe.js
// Automatically generated
var DISCLOSURE_STATE_KEYS = ["baseId", "unstable_idCountRef", "visible", "animated", "animating", "setBaseId", "show", "hide", "toggle", "setVisible", "setAnimated", "stopAnimation"];
var DISCLOSURE_KEYS = DISCLOSURE_STATE_KEYS;
var DISCLOSURE_CONTENT_KEYS = DISCLOSURE_KEYS;
// CONCATENATED MODULE: ./node_modules/reakit/es/Disclosure/DisclosureContent.js
var useDisclosureContent = Object(createHook["a" /* createHook */])({
name: "DisclosureContent",
compose: Role["a" /* useRole */],
keys: DISCLOSURE_CONTENT_KEYS,
useProps: function useProps(options, _ref) {
var htmlOnTransitionEnd = _ref.onTransitionEnd,
htmlOnAnimationEnd = _ref.onAnimationEnd,
htmlProps = Object(_rollupPluginBabelHelpers_1f0bf8c2["a" /* _ */])(_ref, ["onTransitionEnd", "onAnimationEnd", "style"]);
var animating = options.animated && options.animating;
var _React$useState = Object(external_React_["useState"])(null),
transition = _React$useState[0],
setTransition = _React$useState[1];
var hidden = !options.visible && !animating;
var style = hidden ? Object(_rollupPluginBabelHelpers_1f0bf8c2["b" /* a */])({
}, htmlStyle) : htmlStyle;
var onTransitionEndRef = Object(useLiveRef["a" /* useLiveRef */])(htmlOnTransitionEnd);
var onAnimationEndRef = Object(useLiveRef["a" /* useLiveRef */])(htmlOnAnimationEnd);
var raf = Object(external_React_["useRef"])(0);
Object(external_React_["useEffect"])(function () {
if (!options.animated) return undefined; // Double RAF is needed so the browser has enough time to paint the
// default styles before processing the `data-enter` attribute. Otherwise
// it wouldn't be considered a transition.
// See https://github.com/reakit/reakit/issues/643
raf.current = window.requestAnimationFrame(function () {
raf.current = window.requestAnimationFrame(function () {
return window.cancelAnimationFrame(raf.current);
}, [options.animated, options.visible, animating]);
var onEnd = Object(external_React_["useCallback"])(function (event) {
if (!Object(isSelfTarget["a" /* isSelfTarget */])(event)) return;
if (!animating) return; // Ignores number animated
if (options.animated === true) {
var _options$stopAnimatio;
(_options$stopAnimatio = options.stopAnimation) === null || _options$stopAnimatio === void 0 ? void 0 : _options$stopAnimatio.call(options);
}, [options.animated, animating, options.stopAnimation]);
var onTransitionEnd = Object(external_React_["useCallback"])(function (event) {
var _onTransitionEndRef$c;
(_onTransitionEndRef$c = onTransitionEndRef.current) === null || _onTransitionEndRef$c === void 0 ? void 0 : _onTransitionEndRef$c.call(onTransitionEndRef, event);
var onAnimationEnd = Object(external_React_["useCallback"])(function (event) {
var _onAnimationEndRef$cu;
(_onAnimationEndRef$cu = onAnimationEndRef.current) === null || _onAnimationEndRef$cu === void 0 ? void 0 : _onAnimationEndRef$cu.call(onAnimationEndRef, event);
return Object(_rollupPluginBabelHelpers_1f0bf8c2["b" /* a */])({
"data-enter": transition === "enter" ? "" : undefined,
"data-leave": transition === "leave" ? "" : undefined,
onTransitionEnd: onTransitionEnd,
onAnimationEnd: onAnimationEnd,
var DisclosureContent = Object(createComponent["a" /* createComponent */])({
useHook: useDisclosureContent
// CONCATENATED MODULE: ./node_modules/@wordpress/components/build-module/draggable/index.js
var dragImageClass = 'components-draggable__invisible-drag-image';
var cloneWrapperClass = 'components-draggable__clone';
var cloneHeightTransformationBreakpoint = 700;
var bodyClass = 'is-dragging-components-draggable';
function Draggable(_ref) {
var children = _ref.children,
onDragStart = _ref.onDragStart,
onDragOver = _ref.onDragOver,
onDragEnd = _ref.onDragEnd,
cloneClassname = _ref.cloneClassname,
elementId = _ref.elementId,
transferData = _ref.transferData,