: str_replace(): Passing null to parameter #2 ($replace) of type array|string is deprecated in
* getReportUrl: ( { sourceId } ) =>
* `https://wordpress.org/openverse/image/${ sourceId }/report/`,
* isExternalResource: true,
* @typedef {Object} InserterMediaCategory Interface for inserter media category.
* @property {string} name The name of the media category, that should be unique among all media categories.
* @property {Object} labels Labels for the media category.
* @property {string} labels.name General name of the media category. It's used in the inserter media items list.
* @property {string} [labels.search_items='Search'] Label for searching items. Default is ‘Search Posts’ / ‘Search Pages’.
* @property {('image'|'audio'|'video')} mediaType The media type of the media category.
* @property {(InserterMediaRequest) => Promise<InserterMediaItem[]>} fetch The function to fetch media items for the category.
* @property {(InserterMediaItem) => string} [getReportUrl] If the media category supports reporting media items, this function should return
* the report url for the media item. It accepts the `InserterMediaItem` as an argument.
* @property {boolean} [isExternalResource] If the media category is an external resource, this should be set to true.
* This is used to avoid making a request to the external resource when the user
const registerInserterMediaCategory = category => ({
if (!category || typeof category !== 'object') {
console.error('Category should be an `InserterMediaCategory` object.');
console.error('Category should have a `name` that should be unique among all media categories.');
if (!category.labels?.name) {
console.error('Category should have a `labels.name`.');
if (!['image', 'audio', 'video'].includes(category.mediaType)) {
console.error('Category should have `mediaType` property that is one of `image|audio|video`.');
if (!category.fetch || typeof category.fetch !== 'function') {
console.error('Category should have a `fetch` function defined with the following signature `(InserterMediaRequest) => Promise<InserterMediaItem[]>`.');
const registeredInserterMediaCategories = select.getRegisteredInserterMediaCategories();
if (registeredInserterMediaCategories.some(({
}) => name === category.name)) {
console.error(`A category is already registered with the same name: "${category.name}".`);
if (registeredInserterMediaCategories.some(({
}) => name === category.labels?.name)) {
console.error(`A category is already registered with the same labels.name: "${category.labels.name}".`);
// `inserterMediaCategories` is a private block editor setting, which means it cannot
// be updated through the public `updateSettings` action. We preserve this setting as
// private, so extenders can only add new inserter media categories and don't have any
// control over the core media categories.
type: 'REGISTER_INSERTER_MEDIA_CATEGORY',
* @typedef {import('../components/block-editing-mode').BlockEditingMode} BlockEditingMode
* Sets the block editing mode for a given block.
* @see useBlockEditingMode
* @param {string} clientId The block client ID, or `''` for the root container.
* @param {BlockEditingMode} mode The block editing mode. One of `'disabled'`,
* `'contentOnly'`, or `'default'`.
* @return {Object} Action object.
function setBlockEditingMode(clientId = '', mode) {
type: 'SET_BLOCK_EDITING_MODE',
* Clears the block editing mode for a given block.
* @see useBlockEditingMode
* @param {string} clientId The block client ID, or `''` for the root container.
* @return {Object} Action object.
function unsetBlockEditingMode(clientId = '') {
type: 'UNSET_BLOCK_EDITING_MODE',
;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/store/index.js
* Block editor data store configuration.
* @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/data/README.md#registerStore
selectors: selectors_namespaceObject,
actions: actions_namespaceObject
* Store definition for the block editor namespace.
* @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/data/README.md#createReduxStore
const store = (0,external_wp_data_namespaceObject.createReduxStore)(STORE_NAME, {
// We will be able to use the `register` function once we switch
// the "preferences" persistence to use the new preferences package.
const registeredStore = (0,external_wp_data_namespaceObject.registerStore)(STORE_NAME, {
unlock(registeredStore).registerPrivateActions(private_actions_namespaceObject);
unlock(registeredStore).registerPrivateSelectors(private_selectors_namespaceObject);
// TODO: Remove once we switch to the `register` function (see above).
// Until then, private functions also need to be attached to the original
// `store` descriptor in order to avoid unit tests failing, which could happen
// when tests create new registries in which they register stores.
// @see https://github.com/WordPress/gutenberg/pull/51145#discussion_r1239999590
unlock(store).registerPrivateActions(private_actions_namespaceObject);
unlock(store).registerPrivateSelectors(private_selectors_namespaceObject);
;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/use-settings/index.js
* Hook that retrieves the given settings for the block instance in use.
* It looks up the settings first in the block instance hierarchy.
* If none are found, it'll look them up in the block editor settings.
* @param {string[]} paths The paths to the settings.
* @return {any[]} Returns the values defined for the settings.
* const [ fixed, sticky ] = useSettings( 'position.fixed', 'position.sticky' );
function use_settings_useSettings(...paths) {
} = useBlockEditContext();
return (0,external_wp_data_namespaceObject.useSelect)(select => unlock(select(store)).getBlockSettings(clientId, ...paths),
// eslint-disable-next-line react-hooks/exhaustive-deps
* Hook that retrieves the given setting for the block instance in use.
* It looks up the setting first in the block instance hierarchy.
* If none is found, it'll look it up in the block editor settings.
* @param {string} path The path to the setting.
* @return {any} Returns the value defined for the setting.
* @deprecated 6.5.0 Use useSettings instead.
* const isEnabled = useSetting( 'typography.dropCap' );
function useSetting(path) {
external_wp_deprecated_default()('wp.blockEditor.useSetting', {
alternative: 'wp.blockEditor.useSettings',
note: 'The new useSettings function can retrieve multiple settings at once, with better performance.'
const [value] = use_settings_useSettings(path);
;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/font-sizes/fluid-utils.js
* The fluid utilities must match the backend equivalent.
* See: gutenberg_get_typography_font_size_value() in lib/block-supports/typography.php
* ---------------------------------------------------------------
const DEFAULT_MAXIMUM_VIEWPORT_WIDTH = '1600px';
const DEFAULT_MINIMUM_VIEWPORT_WIDTH = '320px';
const DEFAULT_SCALE_FACTOR = 1;
const DEFAULT_MINIMUM_FONT_SIZE_FACTOR_MIN = 0.25;
const DEFAULT_MINIMUM_FONT_SIZE_FACTOR_MAX = 0.75;
const DEFAULT_MINIMUM_FONT_SIZE_LIMIT = '14px';
* Computes a fluid font-size value that uses clamp(). A minimum and maximum
* font size OR a single font size can be specified.
* If a single font size is specified, it is scaled up and down using a logarithmic scale.
* // Calculate fluid font-size value from a minimum and maximum value.
* const fontSize = getComputedFluidTypographyValue( {
* minimumFontSize: '20px',
* maximumFontSize: '45px'
* // Calculate fluid font-size value from a single font size.
* const fontSize = getComputedFluidTypographyValue( {
* @param {?string} args.minimumViewportWidth Minimum viewport size from which type will have fluidity. Optional if fontSize is specified.
* @param {?string} args.maximumViewportWidth Maximum size up to which type will have fluidity. Optional if fontSize is specified.
* @param {string|number} [args.fontSize] Size to derive maximumFontSize and minimumFontSize from, if necessary. Optional if minimumFontSize and maximumFontSize are specified.
* @param {?string} args.maximumFontSize Maximum font size for any clamp() calculation. Optional.
* @param {?string} args.minimumFontSize Minimum font size for any clamp() calculation. Optional.
* @param {?number} args.scaleFactor A scale factor to determine how fast a font scales within boundaries. Optional.
* @param {?string} args.minimumFontSizeLimit The smallest a calculated font size may be. Optional.
* @return {string|null} A font-size value using clamp().
function getComputedFluidTypographyValue({
minimumViewportWidth = DEFAULT_MINIMUM_VIEWPORT_WIDTH,
maximumViewportWidth = DEFAULT_MAXIMUM_VIEWPORT_WIDTH,
scaleFactor = DEFAULT_SCALE_FACTOR,
// Validate incoming settings and set defaults.
minimumFontSizeLimit = !!getTypographyValueAndUnit(minimumFontSizeLimit) ? minimumFontSizeLimit : DEFAULT_MINIMUM_FONT_SIZE_LIMIT;
* Calculates missing minimumFontSize and maximumFontSize from
* defaultFontSize if provided.
// Parses default font size.
const fontSizeParsed = getTypographyValueAndUnit(fontSize);
// Protect against invalid units.
if (!fontSizeParsed?.unit) {
// Parses the minimum font size limit, so we can perform checks using it.
const minimumFontSizeLimitParsed = getTypographyValueAndUnit(minimumFontSizeLimit, {
coerceTo: fontSizeParsed.unit
// Don't enforce minimum font size if a font size has explicitly set a min and max value.
if (!!minimumFontSizeLimitParsed?.value && !minimumFontSize && !maximumFontSize) {
* If a minimum size was not passed to this function
* and the user-defined font size is lower than $minimum_font_size_limit,
* do not calculate a fluid value.
if (fontSizeParsed?.value <= minimumFontSizeLimitParsed?.value) {
// If no fluid max font size is available use the incoming value.
maximumFontSize = `${fontSizeParsed.value}${fontSizeParsed.unit}`;
* If no minimumFontSize is provided, create one using
* the given font size multiplied by the min font size scale factor.
const fontSizeValueInPx = fontSizeParsed.unit === 'px' ? fontSizeParsed.value : fontSizeParsed.value * 16;
* The scale factor is a multiplier that affects how quickly the curve will move towards the minimum,
* that is, how quickly the size factor reaches 0 given increasing font size values.
* For a - b * log2(), lower values of b will make the curve move towards the minimum faster.
* The scale factor is constrained between min and max values.
const minimumFontSizeFactor = Math.min(Math.max(1 - 0.075 * Math.log2(fontSizeValueInPx), DEFAULT_MINIMUM_FONT_SIZE_FACTOR_MIN), DEFAULT_MINIMUM_FONT_SIZE_FACTOR_MAX);
// Calculates the minimum font size.
const calculatedMinimumFontSize = roundToPrecision(fontSizeParsed.value * minimumFontSizeFactor, 3);
// Only use calculated min font size if it's > $minimum_font_size_limit value.
if (!!minimumFontSizeLimitParsed?.value && calculatedMinimumFontSize < minimumFontSizeLimitParsed?.value) {
minimumFontSize = `${minimumFontSizeLimitParsed.value}${minimumFontSizeLimitParsed.unit}`;
minimumFontSize = `${calculatedMinimumFontSize}${fontSizeParsed.unit}`;
// Grab the minimum font size and normalize it in order to use the value for calculations.
const minimumFontSizeParsed = getTypographyValueAndUnit(minimumFontSize);
// We get a 'preferred' unit to keep units consistent when calculating,
// otherwise the result will not be accurate.
const fontSizeUnit = minimumFontSizeParsed?.unit || 'rem';
// Grabs the maximum font size and normalize it in order to use the value for calculations.
const maximumFontSizeParsed = getTypographyValueAndUnit(maximumFontSize, {
// Checks for mandatory min and max sizes, and protects against unsupported units.
if (!minimumFontSizeParsed || !maximumFontSizeParsed) {
// Uses rem for accessible fluid target font scaling.
const minimumFontSizeRem = getTypographyValueAndUnit(minimumFontSize, {
// Viewport widths defined for fluid typography. Normalize units
const maximumViewportWidthParsed = getTypographyValueAndUnit(maximumViewportWidth, {
const minimumViewportWidthParsed = getTypographyValueAndUnit(minimumViewportWidth, {
// Protect against unsupported units.
if (!maximumViewportWidthParsed || !minimumViewportWidthParsed || !minimumFontSizeRem) {
// Calculates the linear factor denominator. If it's 0, we cannot calculate a fluid value.
const linearDenominator = maximumViewportWidthParsed.value - minimumViewportWidthParsed.value;
if (!linearDenominator) {
// Borrowed from https://websemantics.uk/tools/responsive-font-calculator/.
const minViewportWidthOffsetValue = roundToPrecision(minimumViewportWidthParsed.value / 100, 3);
const viewportWidthOffset = roundToPrecision(minViewportWidthOffsetValue, 3) + fontSizeUnit;
const linearFactor = 100 * ((maximumFontSizeParsed.value - minimumFontSizeParsed.value) / linearDenominator);
const linearFactorScaled = roundToPrecision((linearFactor || 1) * scaleFactor, 3);
const fluidTargetFontSize = `${minimumFontSizeRem.value}${minimumFontSizeRem.unit} + ((1vw - ${viewportWidthOffset}) * ${linearFactorScaled})`;
return `clamp(${minimumFontSize}, ${fluidTargetFontSize}, ${maximumFontSize})`;
* Internal method that checks a string for a unit and value and returns an array consisting of `'value'` and `'unit'`, e.g., [ '42', 'rem' ].
* A raw font size of `value + unit` is expected. If the value is an integer, it will convert to `value + 'px'`.
* @param {string|number} rawValue Raw size value from theme.json.
* @param {Object|undefined} options Calculation options.
* @return {{ unit: string, value: number }|null} An object consisting of `'value'` and `'unit'` properties.
function getTypographyValueAndUnit(rawValue, options = {}) {
if (typeof rawValue !== 'string' && typeof rawValue !== 'number') {
// Converts numeric values to pixel values by default.
if (isFinite(rawValue)) {
rawValue = `${rawValue}px`;
// Default browser font size. Later we could inject some JS to compute this `getComputedStyle( document.querySelector( "html" ) ).fontSize`.
acceptableUnits: ['rem', 'px', 'em'],
const acceptableUnitsGroup = acceptableUnits?.join('|');
const regexUnits = new RegExp(`^(\\d*\\.?\\d+)(${acceptableUnitsGroup}){1,1}$`);
const matches = rawValue.match(regexUnits);
// We need a number value and a unit.
if (!matches || matches.length < 3) {
let [, value, unit] = matches;
let returnValue = parseFloat(value);
if ('px' === coerceTo && ('em' === unit || 'rem' === unit)) {
returnValue = returnValue * rootSizeValue;
if ('px' === unit && ('em' === coerceTo || 'rem' === coerceTo)) {
returnValue = returnValue / rootSizeValue;
* No calculation is required if swapping between em and rem yet,
* since we assume a root size value. Later we might like to differentiate between
* :root font size (rem) and parent element font size (em) relativity.
if (('em' === coerceTo || 'rem' === coerceTo) && ('em' === unit || 'rem' === unit)) {
value: roundToPrecision(returnValue, 3),
* Returns a value rounded to defined precision.
* Returns `undefined` if the value is not a valid finite number.
* @param {number} value Raw value.
* @param {number} digits The number of digits to appear after the decimal point
* @return {number|undefined} Value rounded to standard precision.
function roundToPrecision(value, digits = 3) {
const base = Math.pow(10, digits);
return Number.isFinite(value) ? parseFloat(Math.round(value * base) / base) : undefined;
;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/global-styles/typography-utils.js
* The fluid utilities must match the backend equivalent.
* See: gutenberg_get_typography_font_size_value() in lib/block-supports/typography.php
* ---------------------------------------------------------------
* @typedef {Object} FluidPreset
* @property {string|undefined} max A maximum font size value.
* @property {?string|undefined} min A minimum font size value.
* @typedef {Object} Preset
* @property {?string|?number} size A default font size.
* @property {string} name A font size name, displayed in the UI.
* @property {string} slug A font size slug
* @property {boolean|FluidPreset|undefined} fluid Specifies the minimum and maximum font size value of a fluid font size.
* @typedef {Object} TypographySettings
It is recommended that you Edit text format, this type of Fix handles quite a lot in one request
