: str_replace(): Passing null to parameter #2 ($replace) of type array|string is deprecated in
* the image's focus point is visible.
if (!!style?.background?.backgroundImage?.id) {
* Next will be null when the input is cleared,
* in which case the value should be 'auto'.
if (!next && currentValueForToggle === 'auto') {
onChange(setImmutably(style, ['background'], {
backgroundPosition: nextPosition,
backgroundRepeat: nextRepeat,
const updateBackgroundPosition = next => {
onChange(setImmutably(style, ['background', 'backgroundPosition'], coordsToBackgroundPosition(next)));
const toggleIsRepeated = () => onChange(setImmutably(style, ['background', 'backgroundRepeat'], repeatCheckedValue === true ? 'no-repeat' : 'repeat'));
const resetBackgroundSize = () => onChange(setImmutably(style, ['background'], {
backgroundPosition: undefined,
backgroundRepeat: undefined,
backgroundSize: undefined
return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.__experimentalVStack, {
as: external_wp_components_namespaceObject.__experimentalToolsPanelItem,
className: "single-column",
hasValue: () => hasValue,
label: (0,external_wp_i18n_namespaceObject.__)('Size'),
onDeselect: resetBackgroundSize,
isShownByDefault: isShownByDefault,
resetAllFilter: resetAllFilter,
children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.FocalPointPicker, {
__next40pxDefaultSize: true,
label: (0,external_wp_i18n_namespaceObject.__)('Position'),
url: getResolvedThemeFilePath(imageValue, themeFileURIs),
value: backgroundPositionToCoords(positionValue),
onChange: updateBackgroundPosition
}), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.__experimentalToggleGroupControl, {
size: "__unstable-large",
label: (0,external_wp_i18n_namespaceObject.__)('Size'),
value: currentValueForToggle,
onChange: updateBackgroundSize,
help: backgroundSizeHelpText(sizeValue || defaultValues?.backgroundSize),
children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalToggleGroupControlOption, {
label: (0,external_wp_i18n_namespaceObject._x)('Cover', 'Size option for background image control')
}, "cover"), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalToggleGroupControlOption, {
label: (0,external_wp_i18n_namespaceObject._x)('Contain', 'Size option for background image control')
}, "contain"), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalToggleGroupControlOption, {
label: (0,external_wp_i18n_namespaceObject._x)('Tile', 'Size option for background image control')
}), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.__experimentalHStack, {
children: [currentValueForToggle !== undefined && currentValueForToggle !== 'cover' && currentValueForToggle !== 'contain' ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalUnitControl, {
"aria-label": (0,external_wp_i18n_namespaceObject.__)('Background image width'),
onChange: updateBackgroundSize,
size: "__unstable-large",
__unstableInputWidth: "100px",
placeholder: (0,external_wp_i18n_namespaceObject.__)('Auto')
}) : null, currentValueForToggle !== 'cover' && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.ToggleControl, {
label: (0,external_wp_i18n_namespaceObject.__)('Repeat'),
checked: repeatCheckedValue,
onChange: toggleIsRepeated
function BackgroundToolsPanel({
const dropdownMenuProps = useToolsPanelDropdownMenuProps();
const updatedValue = resetAllFilter(value);
return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalVStack, {
as: external_wp_components_namespaceObject.__experimentalToolsPanel,
dropdownMenuProps: dropdownMenuProps,
function BackgroundPanel({
as: Wrapper = BackgroundToolsPanel,
defaultControls = background_panel_DEFAULT_CONTROLS,
headerLabel = (0,external_wp_i18n_namespaceObject.__)('Background image'),
const resetAllFilter = (0,external_wp_element_namespaceObject.useCallback)(previousValue => {
const shouldShowBackgroundSizeControls = settings?.background?.backgroundSize;
return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(Wrapper, {
resetAllFilter: resetAllFilter,
headerLabel: headerLabel,
children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BackgroundImageToolsPanelItem, {
isShownByDefault: defaultControls.backgroundImage,
inheritedValue: inheritedValue,
themeFileURIs: themeFileURIs
}), shouldShowBackgroundSizeControls && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BackgroundSizeToolsPanelItem, {
isShownByDefault: defaultControls.backgroundSize,
inheritedValue: inheritedValue,
defaultValues: defaultValues,
themeFileURIs: themeFileURIs
;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/hooks/background.js
const BACKGROUND_SUPPORT_KEY = 'background';
// Initial control values where no block style is set.
const BACKGROUND_DEFAULT_VALUES = {
* Determine whether there is block support for background.
* @param {string} blockName Block name.
* @param {string} feature Background image feature to check for.
* @return {boolean} Whether there is support.
function hasBackgroundSupport(blockName, feature = 'any') {
const support = (0,external_wp_blocks_namespaceObject.getBlockSupport)(blockName, BACKGROUND_SUPPORT_KEY);
return !!support?.backgroundImage || !!support?.backgroundSize || !!support?.backgroundRepeat;
return !!support?.[feature];
function setBackgroundStyleDefaults(backgroundStyle) {
const backgroundImage = backgroundStyle?.backgroundImage;
let backgroundStylesWithDefaults;
// Set block background defaults.
if (!!backgroundImage?.url) {
if (!backgroundStyle?.backgroundSize) {
backgroundStylesWithDefaults = {
if ('contain' === backgroundStyle?.backgroundSize && !backgroundStyle?.backgroundPosition) {
backgroundStylesWithDefaults = {
backgroundPosition: 'center'
return backgroundStylesWithDefaults;
function background_useBlockProps({
if (!hasBackgroundSupport(name) || !style?.background?.backgroundImage) {
const backgroundStyles = setBackgroundStyleDefaults(style?.background);
* Generates a CSS class name if an background image is set.
* @param {Object} style A block's style attribute.
* @return {string} CSS class name.
function getBackgroundImageClasses(style) {
return hasBackgroundImageValue(style) ? 'has-background' : '';
function BackgroundInspectorControl({
const resetAllFilter = (0,external_wp_element_namespaceObject.useCallback)(attributes => {
return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(inspector_controls, {
resetAllFilter: resetAllFilter,
function BackgroundImagePanel({
const style = (0,external_wp_data_namespaceObject.useSelect)(select => select(store).getBlockAttributes(clientId)?.style, [clientId]);
if (!useHasBackgroundPanel(settings) || !hasBackgroundSupport(name, 'backgroundImage')) {
const defaultControls = (0,external_wp_blocks_namespaceObject.getBlockSupport)(name, [BACKGROUND_SUPPORT_KEY, '__experimentalDefaultControls']);
const onChange = newStyle => {
style: utils_cleanEmptyObject(newStyle)
const updatedSettings = {
backgroundSize: settings?.background?.backgroundSize && hasBackgroundSupport(name, 'backgroundSize')
return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(BackgroundPanel, {
as: BackgroundInspectorControl,
defaultControls: defaultControls,
defaultValues: BACKGROUND_DEFAULT_VALUES,
settings: updatedSettings,
/* harmony default export */ const background = ({
useBlockProps: background_useBlockProps,
attributeKeys: ['style'],
hasSupport: hasBackgroundSupport
;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/hooks/lock.js
* Filters registered block settings, extending attributes to include `lock`.
* @param {Object} settings Original block settings.
* @return {Object} Filtered block settings.
function lock_addAttribute(settings) {
var _settings$attributes$;
// Allow blocks to specify their own attribute definition with default values if needed.
if ('type' in ((_settings$attributes$ = settings.attributes?.lock) !== null && _settings$attributes$ !== void 0 ? _settings$attributes$ : {})) {
// Gracefully handle if settings.attributes is undefined.
(0,external_wp_hooks_namespaceObject.addFilter)('blocks.registerBlockType', 'core/lock/addAttribute', lock_addAttribute);
;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/hooks/anchor.js
* Regular expression matching invalid anchor characters for replacement.
const ANCHOR_REGEX = /[\s#]/g;
* Filters registered block settings, extending attributes with anchor using ID
* @param {Object} settings Original block settings.
* @return {Object} Filtered block settings.
function anchor_addAttribute(settings) {
var _settings$attributes$;
// Allow blocks to specify their own attribute definition with default values if needed.
if ('type' in ((_settings$attributes$ = settings.attributes?.anchor) !== null && _settings$attributes$ !== void 0 ? _settings$attributes$ : {})) {
if ((0,external_wp_blocks_namespaceObject.hasBlockSupport)(settings, 'anchor')) {
// Gracefully handle if settings.attributes is undefined.
function BlockEditAnchorControlPure({
const blockEditingMode = useBlockEditingMode();
if (blockEditingMode !== 'default') {
const isWeb = external_wp_element_namespaceObject.Platform.OS === 'web';
return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(inspector_controls, {
children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.TextControl, {
__nextHasNoMarginBottom: true,
__next40pxDefaultSize: true,
className: "html-anchor-control",
label: (0,external_wp_i18n_namespaceObject.__)('HTML anchor'),
help: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, {
children: [(0,external_wp_i18n_namespaceObject.__)('Enter a word or two — without spaces — to make a unique web address just for this block, called an “anchor”. Then, you’ll be able to link directly to this section of your page.'), isWeb && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, {
children: [' ', /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.ExternalLink, {
href: (0,external_wp_i18n_namespaceObject.__)('https://wordpress.org/documentation/article/page-jumps/'),
children: (0,external_wp_i18n_namespaceObject.__)('Learn more about anchors')
placeholder: !isWeb ? (0,external_wp_i18n_namespaceObject.__)('Add an anchor') : null,
nextValue = nextValue.replace(ANCHOR_REGEX, '-');
/* harmony default export */ const hooks_anchor = ({
edit: BlockEditAnchorControlPure,
attributeKeys: ['anchor'],
return (0,external_wp_blocks_namespaceObject.hasBlockSupport)(name, 'anchor');
* Override props assigned to save component to inject anchor ID, if block
* supports anchor. This is only applied if the block's save result is an
* element and not a markup string.
* @param {Object} extraProps Additional props applied to save element.
* @param {Object} blockType Block type.
* @param {Object} attributes Current block attributes.
* @return {Object} Filtered props applied to save element.
function addSaveProps(extraProps, blockType, attributes) {
if ((0,external_wp_blocks_namespaceObject.hasBlockSupport)(blockType, 'anchor')) {
extraProps.id = attributes.anchor === '' ? null : attributes.anchor;
(0,external_wp_hooks_namespaceObject.addFilter)('blocks.registerBlockType', 'core/anchor/attribute', anchor_addAttribute);
;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/hooks/aria-label.js
const ARIA_LABEL_SCHEMA = {
* Filters registered block settings, extending attributes with ariaLabel using aria-label
* @param {Object} settings Original block settings.
* @return {Object} Filtered block settings.
function aria_label_addAttribute(settings) {
// Allow blocks to specify their own attribute definition with default values if needed.
if (settings?.attributes?.ariaLabel?.type) {
if ((0,external_wp_blocks_namespaceObject.hasBlockSupport)(settings, 'ariaLabel')) {
// Gracefully handle if settings.attributes is undefined.
ariaLabel: ARIA_LABEL_SCHEMA
* Override props assigned to save component to inject aria-label, if block
* supports ariaLabel. This is only applied if the block's save result is an
* element and not a markup string.
* @param {Object} extraProps Additional props applied to save element.
* @param {Object} blockType Block type.
* @param {Object} attributes Current block attributes.
* @return {Object} Filtered props applied to save element.
function aria_label_addSaveProps(extraProps, blockType, attributes) {
if ((0,external_wp_blocks_namespaceObject.hasBlockSupport)(blockType, 'ariaLabel')) {
extraProps['aria-label'] = attributes.ariaLabel === '' ? null : attributes.ariaLabel;