: str_replace(): Passing null to parameter #2 ($replace) of type array|string is deprecated in
key: `${styleValue}-${weightValue}`,
// Generates select options for font styles only.
const styleOptions = () => {
const combinedOptions = [defaultOption];
// Generates select options for font weights only.
const weightOptions = () => {
const combinedOptions = [defaultOption];
// Map font styles and weights to select options.
const selectOptions = (0,external_wp_element_namespaceObject.useMemo)(() => {
if (hasFontStyles && hasFontWeights) {
return hasFontStyles ? styleOptions() : weightOptions();
// Find current selection by comparing font style & weight against options,
// and fall back to the Default option if there is no matching option.
const currentSelection = selectOptions.find(option => option.style.fontStyle === fontStyle && option.style.fontWeight === fontWeight) || selectOptions[0];
// Adjusts screen reader description based on styles or weights.
const getDescribedBy = () => {
return (0,external_wp_i18n_namespaceObject.__)('No selected font appearance');
return (0,external_wp_i18n_namespaceObject.sprintf)(
// translators: %s: Currently selected font weight.
(0,external_wp_i18n_namespaceObject.__)('Currently selected font weight: %s'), currentSelection.name);
return (0,external_wp_i18n_namespaceObject.sprintf)(
// translators: %s: Currently selected font style.
(0,external_wp_i18n_namespaceObject.__)('Currently selected font style: %s'), currentSelection.name);
return (0,external_wp_i18n_namespaceObject.sprintf)(
// translators: %s: Currently selected font appearance.
(0,external_wp_i18n_namespaceObject.__)('Currently selected font appearance: %s'), currentSelection.name);
return hasStylesOrWeights && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.CustomSelectControl, {
className: "components-font-appearance-control",
describedBy: getDescribedBy(),
}) => onChange(selectedItem.style)
;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/line-height-control/utils.js
const BASE_DEFAULT_VALUE = 1.5;
* A spin factor of 10 allows the spin controls to increment/decrement by 0.1.
* e.g. A line-height value of 1.55 will increment to 1.65.
* There are varying value types within LineHeightControl:
* {undefined} Initial value. No changes from the user.
* {string} Input value. Value consumed/outputted by the input. Empty would be ''.
* {number} Block attribute type. Input value needs to be converted for attribute setting.
* Note: If the value is undefined, the input requires it to be an empty string ('')
* in order to be considered "controlled" by props (rather than internal state).
* Determines if the lineHeight attribute has been properly defined.
* @param {any} lineHeight The value to check.
* @return {boolean} Whether the lineHeight attribute is valid.
function isLineHeightDefined(lineHeight) {
return lineHeight !== undefined && lineHeight !== RESET_VALUE;
;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/line-height-control/index.js
const line_height_control_LineHeightControl = ({
/** Start opting into the new margin-free styles that will become the default in a future version. */
__nextHasNoMarginBottom = false,
__unstableInputWidth = '60px',
const isDefined = isLineHeightDefined(lineHeight);
const adjustNextValue = (nextValue, wasTypedOrPasted) => {
// Set the next value without modification if lineHeight has been defined.
* The following logic handles the initial spin up/down action
* (from an undefined value state) so that the next values are better suited for
* line-height rendering. For example, the first spin up should immediately
* go to 1.6, rather than the normally expected 0.1.
* Spin up/down actions can be triggered by keydowns of the up/down arrow keys,
* dragging the input or by clicking the spin buttons.
const spin = STEP * SPIN_FACTOR;
switch (`${nextValue}`) {
// Increment by spin value.
return BASE_DEFAULT_VALUE + spin;
// This means the user explicitly input '0', rather than using the
// spin down action from an undefined value state.
// Decrement by spin value.
return BASE_DEFAULT_VALUE - spin;
return BASE_DEFAULT_VALUE;
const stateReducer = (state, action) => {
// Be careful when changing this — cross-browser behavior of the
// `inputType` field in `input` events are inconsistent.
// For example, Firefox emits an input event with inputType="insertReplacementText"
// on spin button clicks, while other browsers do not even emit an input event.
const wasTypedOrPasted = ['insertText', 'insertFromPaste'].includes(action.payload.event.nativeEvent?.inputType);
const value = adjustNextValue(state.value, wasTypedOrPasted);
const value = isDefined ? lineHeight : RESET_VALUE;
if (!__nextHasNoMarginBottom) {
external_wp_deprecated_default()('Bottom margin styles for wp.blockEditor.LineHeightControl', {
hint: 'Set the `__nextHasNoMarginBottom` prop to true to start opting into the new styles, which will become the default in a future version'
const deprecatedStyles = __nextHasNoMarginBottom ? undefined : {
const handleOnChange = (nextValue, {
if (event.type === 'click') {
onChange(adjustNextValue(`${nextValue}`, false));
onChange(`${nextValue}`);
return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", {
className: "block-editor-line-height-control",
children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalNumberControl, {
__unstableInputWidth: __unstableInputWidth,
__unstableStateReducer: stateReducer,
onChange: handleOnChange,
label: (0,external_wp_i18n_namespaceObject.__)('Line height'),
placeholder: BASE_DEFAULT_VALUE,
* @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/line-height-control/README.md
/* harmony default export */ const line_height_control = (line_height_control_LineHeightControl);
;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/letter-spacing-control/index.js
* Control for letter-spacing.
* @param {Object} props Component props.
* @param {string} props.value Currently selected letter-spacing.
* @param {Function} props.onChange Handles change in letter-spacing selection.
* @param {string|number|undefined} props.__unstableInputWidth Input width to pass through to inner UnitControl. Should be a valid CSS value.
* @return {Element} Letter-spacing control.
function LetterSpacingControl({
__unstableInputWidth = '60px',
const [availableUnits] = use_settings_useSettings('spacing.units');
const units = (0,external_wp_components_namespaceObject.__experimentalUseCustomUnits)({
availableUnits: availableUnits || ['px', 'em', 'rem'],
return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalUnitControl, {
label: (0,external_wp_i18n_namespaceObject.__)('Letter spacing'),
__unstableInputWidth: __unstableInputWidth,
;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/align-left.js
const alignLeft = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, {
xmlns: "http://www.w3.org/2000/svg",
children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, {
d: "M13 5.5H4V4h9v1.5Zm7 7H4V11h16v1.5Zm-7 7H4V18h9v1.5Z"
/* harmony default export */ const align_left = (alignLeft);
;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/align-center.js
const align_center_alignCenter = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, {
xmlns: "http://www.w3.org/2000/svg",
children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, {
d: "M7.5 5.5h9V4h-9v1.5Zm-3.5 7h16V11H4v1.5Zm3.5 7h9V18h-9v1.5Z"
/* harmony default export */ const align_center = (align_center_alignCenter);
;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/align-right.js
const alignRight = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, {
xmlns: "http://www.w3.org/2000/svg",
children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, {
d: "M11.111 5.5H20V4h-8.889v1.5ZM4 12.5h16V11H4v1.5Zm7.111 7H20V18h-8.889v1.5Z"
/* harmony default export */ const align_right = (alignRight);
;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/align-justify.js
const alignJustify = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, {
xmlns: "http://www.w3.org/2000/svg",
children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, {
d: "M4 12.8h16v-1.5H4v1.5zm0 7h12.4v-1.5H4v1.5zM4 4.3v1.5h16V4.3H4z"
/* harmony default export */ const align_justify = (alignJustify);
;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/segmented-text-control/index.js
* @typedef {Object} Option
* @property {string} label The label of the option.
* @property {string} value The value of the option.
* @property {string} icon The icon of the option.
* Control to facilitate selecting a text style from a set of options.
* @param {Object} props Component props.
* @param {string} props.label A label for the option.
* @param {string} props.value Currently selected value.
* @param {Function} props.onChange Callback to handle onChange.
* @param {Option[]} props.options Array of options to display.
* @param {string} props.className Additional class name to apply.
* @return {Element} Element to render.
function SegmentedTextControl({
return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("fieldset", {
className: dist_clsx('block-editor-segmented-text-control', className),
children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.BaseControl.VisualLabel, {
}), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", {
className: "block-editor-segmented-text-control__buttons",
children: options.map(option => {
return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Button, {
isPressed: option.value === value,
onClick: () => onChange(option.value)
;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/text-alignment-control/index.js
const TEXT_ALIGNMENT_OPTIONS = [{
label: (0,external_wp_i18n_namespaceObject.__)('Align text left'),
label: (0,external_wp_i18n_namespaceObject.__)('Align text center'),
label: (0,external_wp_i18n_namespaceObject.__)('Align text right'),
label: (0,external_wp_i18n_namespaceObject.__)('Justify text'),
const DEFAULT_OPTIONS = ['left', 'center', 'right'];
* Control to facilitate text alignment selections.
* @param {Object} props Component props.
* @param {string} props.className Class name to add to the control.
* @param {string} props.value Currently selected text alignment.
* @param {Function} props.onChange Handles change in text alignment selection.
* @param {string[]} props.options Array of text alignment options to display.
* @return {Element} Text alignment control.
function TextAlignmentControl({
options = DEFAULT_OPTIONS
const validOptions = (0,external_wp_element_namespaceObject.useMemo)(() => TEXT_ALIGNMENT_OPTIONS.filter(option => options.includes(option.value)), [options]);
if (!validOptions.length) {
return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(SegmentedTextControl, {
label: (0,external_wp_i18n_namespaceObject.__)('Text alignment'),
className: dist_clsx('block-editor-text-alignment-control', className),
onChange(newValue === value ? undefined : newValue);
;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/reset.js
const reset_reset = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.SVG, {
xmlns: "http://www.w3.org/2000/svg",
children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_primitives_namespaceObject.Path, {
/* harmony default export */ const library_reset = (reset_reset);
;// CONCATENATED MODULE: ./node_modules/@wordpress/icons/build-module/library/format-uppercase.js