Edit File by line

const popoverAnchor = (0,external_wp_element_namespaceObject.useMemo)(() => {

[20000] Fix | Delete

if (

[20001] Fix | Delete

// popoverDimensionsRecomputeCounter is by definition always equal or greater

[20002] Fix | Delete

// than 0. This check is only there to satisfy the correctness of the

[20003] Fix | Delete

// exhaustive-deps rule for the `useMemo` hook.

[20004] Fix | Delete

popoverDimensionsRecomputeCounter < 0 || !selectedElement || bottomClientId && !lastSelectedElement) {

[20005] Fix | Delete

return undefined;

[20006] Fix | Delete

}

[20007] Fix | Delete

return {

[20008] Fix | Delete

getBoundingClientRect() {

[20009] Fix | Delete

var _lastSelectedBCR$left, _lastSelectedBCR$top, _lastSelectedBCR$righ, _lastSelectedBCR$bott;

[20010] Fix | Delete

const selectedBCR = selectedElement.getBoundingClientRect();

[20011] Fix | Delete

const lastSelectedBCR = lastSelectedElement?.getBoundingClientRect();

[20012] Fix | Delete

[20013] Fix | Delete

// Get the biggest rectangle that encompasses completely the currently

[20014] Fix | Delete

// selected element and the last selected element:

[20015] Fix | Delete

// - for top/left coordinates, use the smaller numbers

[20016] Fix | Delete

// - for the bottom/right coordinates, use the largest numbers

[20017] Fix | Delete

const left = Math.min(selectedBCR.left, (_lastSelectedBCR$left = lastSelectedBCR?.left) !== null && _lastSelectedBCR$left !== void 0 ? _lastSelectedBCR$left : Infinity);

[20018] Fix | Delete

const top = Math.min(selectedBCR.top, (_lastSelectedBCR$top = lastSelectedBCR?.top) !== null && _lastSelectedBCR$top !== void 0 ? _lastSelectedBCR$top : Infinity);

[20019] Fix | Delete

const right = Math.max(selectedBCR.right, (_lastSelectedBCR$righ = lastSelectedBCR.right) !== null && _lastSelectedBCR$righ !== void 0 ? _lastSelectedBCR$righ : -Infinity);

[20020] Fix | Delete

const bottom = Math.max(selectedBCR.bottom, (_lastSelectedBCR$bott = lastSelectedBCR.bottom) !== null && _lastSelectedBCR$bott !== void 0 ? _lastSelectedBCR$bott : -Infinity);

[20021] Fix | Delete

const width = right - left;

[20022] Fix | Delete

const height = bottom - top;

[20023] Fix | Delete

return new window.DOMRect(left, top, width, height);

[20024] Fix | Delete

[20025] Fix | Delete

contextElement: selectedElement

[20026] Fix | Delete

};

[20027] Fix | Delete

}, [bottomClientId, lastSelectedElement, selectedElement, popoverDimensionsRecomputeCounter]);

[20028] Fix | Delete

if (!selectedElement || bottomClientId && !lastSelectedElement) {

[20029] Fix | Delete

return null;

[20030] Fix | Delete

}

[20031] Fix | Delete

return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.Popover, {

[20032] Fix | Delete

ref: mergedRefs,

[20033] Fix | Delete

animate: false,

[20034] Fix | Delete

focusOnMount: false,

[20035] Fix | Delete

anchor: popoverAnchor

[20036] Fix | Delete

// Render in the old slot if needed for backward compatibility,

[20037] Fix | Delete

// otherwise render in place (not in the default popover slot).

[20038] Fix | Delete

[20039] Fix | Delete

__unstableSlotName: __unstablePopoverSlot,

[20040] Fix | Delete

inline: !__unstablePopoverSlot,

[20041] Fix | Delete

placement: "top-start",

[20042] Fix | Delete

resize: false,

[20043] Fix | Delete

flip: false,

[20044] Fix | Delete

shift: shift,

[20045] Fix | Delete

...props,

[20046] Fix | Delete

className: dist_clsx('block-editor-block-popover', props.className),

[20047] Fix | Delete

variant: "unstyled",

[20048] Fix | Delete

children: children

[20049] Fix | Delete

});

[20050] Fix | Delete

}

[20051] Fix | Delete

const PrivateBlockPopover = (0,external_wp_element_namespaceObject.forwardRef)(BlockPopover);

[20052] Fix | Delete

const PublicBlockPopover = ({

[20053] Fix | Delete

clientId,

[20054] Fix | Delete

bottomClientId,

[20055] Fix | Delete

children,

[20056] Fix | Delete

...props

[20057] Fix | Delete

}, ref) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(PrivateBlockPopover, {

[20058] Fix | Delete

...props,

[20059] Fix | Delete

bottomClientId: bottomClientId,

[20060] Fix | Delete

clientId: clientId,

[20061] Fix | Delete

__unstableContentRef: undefined,

[20062] Fix | Delete

__unstablePopoverSlot: undefined,

[20063] Fix | Delete

ref: ref,

[20064] Fix | Delete

children: children

[20065] Fix | Delete

});

[20066] Fix | Delete

[20067] Fix | Delete

/**

[20068] Fix | Delete

* @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/block-popover/README.md

[20069] Fix | Delete

[20070] Fix | Delete

/* harmony default export */ const block_popover = ((0,external_wp_element_namespaceObject.forwardRef)(PublicBlockPopover));

[20071] Fix | Delete

[20072] Fix | Delete

;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/block-popover/cover.js

[20073] Fix | Delete

/**

[20074] Fix | Delete

* WordPress dependencies

[20075] Fix | Delete

[20076] Fix | Delete

[20077] Fix | Delete

[20078] Fix | Delete

/**

[20079] Fix | Delete

* Internal dependencies

[20080] Fix | Delete

[20081] Fix | Delete

[20082] Fix | Delete

[20083] Fix | Delete

[20084] Fix | Delete

function BlockPopoverCover({

[20085] Fix | Delete

clientId,

[20086] Fix | Delete

bottomClientId,

[20087] Fix | Delete

children,

[20088] Fix | Delete

shift = false,

[20089] Fix | Delete

additionalStyles,

[20090] Fix | Delete

...props

[20091] Fix | Delete

}, ref) {

[20092] Fix | Delete

var _bottomClientId;

[20093] Fix | Delete

(_bottomClientId = bottomClientId) !== null && _bottomClientId !== void 0 ? _bottomClientId : bottomClientId = clientId;

[20094] Fix | Delete

const selectedElement = useBlockElement(clientId);

[20095] Fix | Delete

return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(PrivateBlockPopover, {

[20096] Fix | Delete

ref: ref,

[20097] Fix | Delete

clientId: clientId,

[20098] Fix | Delete

bottomClientId: bottomClientId,

[20099] Fix | Delete

shift: shift,

[20100] Fix | Delete

...props,

[20101] Fix | Delete

children: selectedElement && clientId === bottomClientId ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(CoverContainer, {

[20102] Fix | Delete

selectedElement: selectedElement,

[20103] Fix | Delete

additionalStyles: additionalStyles,

[20104] Fix | Delete

children: children

[20105] Fix | Delete

}) : children

[20106] Fix | Delete

});

[20107] Fix | Delete

}

[20108] Fix | Delete

function CoverContainer({

[20109] Fix | Delete

selectedElement,

[20110] Fix | Delete

additionalStyles = {},

[20111] Fix | Delete

children

[20112] Fix | Delete

}) {

[20113] Fix | Delete

const [width, setWidth] = (0,external_wp_element_namespaceObject.useState)(selectedElement.offsetWidth);

[20114] Fix | Delete

const [height, setHeight] = (0,external_wp_element_namespaceObject.useState)(selectedElement.offsetHeight);

[20115] Fix | Delete

(0,external_wp_element_namespaceObject.useEffect)(() => {

[20116] Fix | Delete

const observer = new window.ResizeObserver(() => {

[20117] Fix | Delete

setWidth(selectedElement.offsetWidth);

[20118] Fix | Delete

setHeight(selectedElement.offsetHeight);

[20119] Fix | Delete

});

[20120] Fix | Delete

observer.observe(selectedElement, {

[20121] Fix | Delete

box: 'border-box'

[20122] Fix | Delete

});

[20123] Fix | Delete

return () => observer.disconnect();

[20124] Fix | Delete

}, [selectedElement]);

[20125] Fix | Delete

const style = (0,external_wp_element_namespaceObject.useMemo)(() => {

[20126] Fix | Delete

return {

[20127] Fix | Delete

position: 'absolute',

[20128] Fix | Delete

width,

[20129] Fix | Delete

height,

[20130] Fix | Delete

...additionalStyles

[20131] Fix | Delete

};

[20132] Fix | Delete

}, [width, height, additionalStyles]);

[20133] Fix | Delete

return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", {

[20134] Fix | Delete

style: style,

[20135] Fix | Delete

children: children

[20136] Fix | Delete

});

[20137] Fix | Delete

}

[20138] Fix | Delete

/* harmony default export */ const cover = ((0,external_wp_element_namespaceObject.forwardRef)(BlockPopoverCover));

[20139] Fix | Delete

[20140] Fix | Delete

;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/grid-visualizer/utils.js

[20141] Fix | Delete

function getComputedCSS(element, property) {

[20142] Fix | Delete

return element.ownerDocument.defaultView.getComputedStyle(element).getPropertyValue(property);

[20143] Fix | Delete

}

[20144] Fix | Delete

[20145] Fix | Delete

;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/components/grid-visualizer/grid-visualizer.js

[20146] Fix | Delete

/**

[20147] Fix | Delete

* WordPress dependencies

[20148] Fix | Delete

[20149] Fix | Delete

[20150] Fix | Delete

[20151] Fix | Delete

[20152] Fix | Delete

/**

[20153] Fix | Delete

* Internal dependencies

[20154] Fix | Delete

[20155] Fix | Delete

[20156] Fix | Delete

[20157] Fix | Delete

[20158] Fix | Delete

[20159] Fix | Delete

[20160] Fix | Delete

function GridVisualizer({

[20161] Fix | Delete

clientId,

[20162] Fix | Delete

contentRef

[20163] Fix | Delete

}) {

[20164] Fix | Delete

const isDistractionFree = (0,external_wp_data_namespaceObject.useSelect)(select => select(store).getSettings().isDistractionFree, []);

[20165] Fix | Delete

const blockElement = useBlockElement(clientId);

[20166] Fix | Delete

if (isDistractionFree || !blockElement) {

[20167] Fix | Delete

return null;

[20168] Fix | Delete

}

[20169] Fix | Delete

return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(cover, {

[20170] Fix | Delete

className: "block-editor-grid-visualizer",

[20171] Fix | Delete

clientId: clientId,

[20172] Fix | Delete

__unstablePopoverSlot: "block-toolbar",

[20173] Fix | Delete

children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(GridVisualizerGrid, {

[20174] Fix | Delete

ref: contentRef,

[20175] Fix | Delete

blockElement: blockElement

[20176] Fix | Delete

})

[20177] Fix | Delete

});

[20178] Fix | Delete

}

[20179] Fix | Delete

const GridVisualizerGrid = (0,external_wp_element_namespaceObject.forwardRef)(({

[20180] Fix | Delete

blockElement

[20181] Fix | Delete

}, ref) => {

[20182] Fix | Delete

const [gridInfo, setGridInfo] = (0,external_wp_element_namespaceObject.useState)(() => getGridInfo(blockElement));

[20183] Fix | Delete

(0,external_wp_element_namespaceObject.useEffect)(() => {

[20184] Fix | Delete

const observers = [];

[20185] Fix | Delete

for (const element of [blockElement, ...blockElement.children]) {

[20186] Fix | Delete

const observer = new window.ResizeObserver(() => {

[20187] Fix | Delete

setGridInfo(getGridInfo(blockElement));

[20188] Fix | Delete

});

[20189] Fix | Delete

observer.observe(element);

[20190] Fix | Delete

observers.push(observer);

[20191] Fix | Delete

}

[20192] Fix | Delete

return () => {

[20193] Fix | Delete

for (const observer of observers) {

[20194] Fix | Delete

observer.disconnect();

[20195] Fix | Delete

}

[20196] Fix | Delete

};

[20197] Fix | Delete

}, [blockElement]);

[20198] Fix | Delete

return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", {

[20199] Fix | Delete

ref: ref,

[20200] Fix | Delete

className: "block-editor-grid-visualizer__grid",

[20201] Fix | Delete

style: gridInfo.style,

[20202] Fix | Delete

children: Array.from({

[20203] Fix | Delete

length: gridInfo.numItems

[20204] Fix | Delete

}, (_, i) => /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", {

[20205] Fix | Delete

className: "block-editor-grid-visualizer__item",

[20206] Fix | Delete

style: {

[20207] Fix | Delete

boxShadow: `inset 0 0 0 1px color-mix(in srgb, ${gridInfo.currentColor} 20%, #0000)`

[20208] Fix | Delete

}

[20209] Fix | Delete

}, i))

[20210] Fix | Delete

});

[20211] Fix | Delete

});

[20212] Fix | Delete

function getGridInfo(blockElement) {

[20213] Fix | Delete

const gridTemplateColumns = getComputedCSS(blockElement, 'grid-template-columns');

[20214] Fix | Delete

const gridTemplateRows = getComputedCSS(blockElement, 'grid-template-rows');

[20215] Fix | Delete

const numColumns = gridTemplateColumns.split(' ').length;

[20216] Fix | Delete

const numRows = gridTemplateRows.split(' ').length;

[20217] Fix | Delete

const numItems = numColumns * numRows;

[20218] Fix | Delete

return {

[20219] Fix | Delete

numItems,

[20220] Fix | Delete

currentColor: getComputedCSS(blockElement, 'color'),

[20221] Fix | Delete

style: {

[20222] Fix | Delete

gridTemplateColumns,

[20223] Fix | Delete

gridTemplateRows,

[20224] Fix | Delete

gap: getComputedCSS(blockElement, 'gap'),

[20225] Fix | Delete

padding: getComputedCSS(blockElement, 'padding')

[20226] Fix | Delete

}

[20227] Fix | Delete

};

[20228] Fix | Delete

}

[20229] Fix | Delete

[20230] Fix | Delete

;// CONCATENATED MODULE: ./node_modules/@wordpress/block-editor/build-module/layouts/grid.js

[20231] Fix | Delete

/**

[20232] Fix | Delete

* WordPress dependencies

[20233] Fix | Delete

[20234] Fix | Delete

[20235] Fix | Delete

[20236] Fix | Delete

[20237] Fix | Delete

[20238] Fix | Delete

/**

[20239] Fix | Delete

* Internal dependencies

[20240] Fix | Delete

[20241] Fix | Delete

[20242] Fix | Delete

[20243] Fix | Delete

[20244] Fix | Delete

[20245] Fix | Delete

[20246] Fix | Delete

[20247] Fix | Delete

[20248] Fix | Delete

[20249] Fix | Delete

const RANGE_CONTROL_MAX_VALUES = {

[20250] Fix | Delete

px: 600,

[20251] Fix | Delete

'%': 100,

[20252] Fix | Delete

vw: 100,

[20253] Fix | Delete

vh: 100,

[20254] Fix | Delete

em: 38,

[20255] Fix | Delete

rem: 38,

[20256] Fix | Delete

svw: 100,

[20257] Fix | Delete

lvw: 100,

[20258] Fix | Delete

dvw: 100,

[20259] Fix | Delete

svh: 100,

[20260] Fix | Delete

lvh: 100,

[20261] Fix | Delete

dvh: 100,

[20262] Fix | Delete

vi: 100,

[20263] Fix | Delete

svi: 100,

[20264] Fix | Delete

lvi: 100,

[20265] Fix | Delete

dvi: 100,

[20266] Fix | Delete

vb: 100,

[20267] Fix | Delete

svb: 100,

[20268] Fix | Delete

lvb: 100,

[20269] Fix | Delete

dvb: 100,

[20270] Fix | Delete

vmin: 100,

[20271] Fix | Delete

svmin: 100,

[20272] Fix | Delete

lvmin: 100,

[20273] Fix | Delete

dvmin: 100,

[20274] Fix | Delete

vmax: 100,

[20275] Fix | Delete

svmax: 100,

[20276] Fix | Delete

lvmax: 100,

[20277] Fix | Delete

dvmax: 100

[20278] Fix | Delete

};

[20279] Fix | Delete

const units = [{

[20280] Fix | Delete

value: 'px',

[20281] Fix | Delete

label: 'px',

[20282] Fix | Delete

default: 0

[20283] Fix | Delete

}, {

[20284] Fix | Delete

value: 'rem',

[20285] Fix | Delete

label: 'rem',

[20286] Fix | Delete

default: 0

[20287] Fix | Delete

}, {

[20288] Fix | Delete

value: 'em',

[20289] Fix | Delete

label: 'em',

[20290] Fix | Delete

default: 0

[20291] Fix | Delete

}];

[20292] Fix | Delete

/* harmony default export */ const grid = ({

[20293] Fix | Delete

[20294] Fix | Delete

label: (0,external_wp_i18n_namespaceObject.__)('Grid'),

[20295] Fix | Delete

inspectorControls: function GridLayoutInspectorControls({

[20296] Fix | Delete

layout = {},

[20297] Fix | Delete

onChange,

[20298] Fix | Delete

layoutBlockSupport = {}

[20299] Fix | Delete

}) {

[20300] Fix | Delete

const {

[20301] Fix | Delete

allowSizingOnChildren = false

[20302] Fix | Delete

} = layoutBlockSupport;

[20303] Fix | Delete

return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, {

[20304] Fix | Delete

children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(GridLayoutTypeControl, {

[20305] Fix | Delete

[20306] Fix | Delete

onChange: onChange

[20307] Fix | Delete

}), layout?.columnCount ? /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(GridLayoutColumnsAndRowsControl, {

[20308] Fix | Delete

[20309] Fix | Delete

onChange: onChange,

[20310] Fix | Delete

allowSizingOnChildren: allowSizingOnChildren

[20311] Fix | Delete

}) : /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(GridLayoutMinimumWidthControl, {

[20312] Fix | Delete

[20313] Fix | Delete

onChange: onChange

[20314] Fix | Delete

})]

[20315] Fix | Delete

});

[20316] Fix | Delete

[20317] Fix | Delete

toolBarControls: function GridLayoutToolbarControls({

[20318] Fix | Delete

clientId

[20319] Fix | Delete

}) {

[20320] Fix | Delete

return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(GridVisualizer, {

[20321] Fix | Delete

clientId: clientId

[20322] Fix | Delete

});

[20323] Fix | Delete

[20324] Fix | Delete

getLayoutStyle: function getLayoutStyle({

[20325] Fix | Delete

selector,

[20326] Fix | Delete

layout,

[20327] Fix | Delete

style,

[20328] Fix | Delete

blockName,

[20329] Fix | Delete

hasBlockGapSupport,

[20330] Fix | Delete

layoutDefinitions = LAYOUT_DEFINITIONS

[20331] Fix | Delete

}) {

[20332] Fix | Delete

const {

[20333] Fix | Delete

minimumColumnWidth = '12rem',

[20334] Fix | Delete

columnCount = null,

[20335] Fix | Delete

rowCount = null

[20336] Fix | Delete

} = layout;

[20337] Fix | Delete

[20338] Fix | Delete

// If a block's block.json skips serialization for spacing or spacing.blockGap,

[20339] Fix | Delete

// don't apply the user-defined value to the styles.

[20340] Fix | Delete

const blockGapValue = style?.spacing?.blockGap && !shouldSkipSerialization(blockName, 'spacing', 'blockGap') ? getGapCSSValue(style?.spacing?.blockGap, '0.5em') : undefined;

[20341] Fix | Delete

let output = '';

[20342] Fix | Delete

const rules = [];

[20343] Fix | Delete

if (columnCount) {

[20344] Fix | Delete

rules.push(`grid-template-columns: repeat(${columnCount}, minmax(0, 1fr))`);

[20345] Fix | Delete

if (rowCount) {

[20346] Fix | Delete

rules.push(`grid-template-rows: repeat(${rowCount}, minmax(0, 1fr))`);

[20347] Fix | Delete

}

[20348] Fix | Delete

} else if (minimumColumnWidth) {

[20349] Fix | Delete

rules.push(`grid-template-columns: repeat(auto-fill, minmax(min(${minimumColumnWidth}, 100%), 1fr))`, 'container-type: inline-size');

[20350] Fix | Delete

}

[20351] Fix | Delete

if (rules.length) {

[20352] Fix | Delete

// Reason to disable: the extra line breaks added by prettier mess with the unit tests.

[20353] Fix | Delete

// eslint-disable-next-line prettier/prettier

[20354] Fix | Delete

output = `${appendSelectors(selector)} { ${rules.join('; ')}; }`;

[20355] Fix | Delete

}

[20356] Fix | Delete

[20357] Fix | Delete

// Output blockGap styles based on rules contained in layout definitions in theme.json.

[20358] Fix | Delete

if (hasBlockGapSupport && blockGapValue) {

[20359] Fix | Delete

output += getBlockGapCSS(selector, layoutDefinitions, 'grid', blockGapValue);

[20360] Fix | Delete

}

[20361] Fix | Delete

return output;

[20362] Fix | Delete

[20363] Fix | Delete

getOrientation() {

[20364] Fix | Delete

return 'horizontal';

[20365] Fix | Delete

[20366] Fix | Delete

getAlignments() {

[20367] Fix | Delete

return [];

[20368] Fix | Delete

}

[20369] Fix | Delete

});

[20370] Fix | Delete

[20371] Fix | Delete

// Enables setting minimum width of grid items.

[20372] Fix | Delete

function GridLayoutMinimumWidthControl({

[20373] Fix | Delete

layout,

[20374] Fix | Delete

onChange

[20375] Fix | Delete

}) {

[20376] Fix | Delete

const {

[20377] Fix | Delete

minimumColumnWidth: value = '12rem'

[20378] Fix | Delete

} = layout;

[20379] Fix | Delete

const [quantity, unit] = (0,external_wp_components_namespaceObject.__experimentalParseQuantityAndUnitFromRawValue)(value);

[20380] Fix | Delete

const handleSliderChange = next => {

[20381] Fix | Delete

onChange({

[20382] Fix | Delete

...layout,

[20383] Fix | Delete

minimumColumnWidth: [next, unit].join('')

[20384] Fix | Delete

});

[20385] Fix | Delete

};

[20386] Fix | Delete

[20387] Fix | Delete

// Mostly copied from HeightControl.

[20388] Fix | Delete

const handleUnitChange = newUnit => {

[20389] Fix | Delete

// Attempt to smooth over differences between currentUnit and newUnit.

[20390] Fix | Delete

// This should slightly improve the experience of switching between unit types.

[20391] Fix | Delete

let newValue;

[20392] Fix | Delete

if (['em', 'rem'].includes(newUnit) && unit === 'px') {

[20393] Fix | Delete

// Convert pixel value to an approximate of the new unit, assuming a root size of 16px.

[20394] Fix | Delete

newValue = (quantity / 16).toFixed(2) + newUnit;

[20395] Fix | Delete

} else if (['em', 'rem'].includes(unit) && newUnit === 'px') {

[20396] Fix | Delete

// Convert to pixel value assuming a root size of 16px.

[20397] Fix | Delete

newValue = Math.round(quantity * 16) + newUnit;

[20398] Fix | Delete

}

[20399] Fix | Delete

onChange({

[20400] Fix | Delete

...layout,

[20401] Fix | Delete

minimumColumnWidth: newValue

[20402] Fix | Delete

});

[20403] Fix | Delete

};

[20404] Fix | Delete

return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("fieldset", {

[20405] Fix | Delete

children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.BaseControl.VisualLabel, {

[20406] Fix | Delete

as: "legend",

[20407] Fix | Delete

children: (0,external_wp_i18n_namespaceObject.__)('Minimum column width')

[20408] Fix | Delete

}), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.Flex, {

[20409] Fix | Delete

gap: 4,

[20410] Fix | Delete

children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.FlexItem, {

[20411] Fix | Delete

isBlock: true,

[20412] Fix | Delete

children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalUnitControl, {

[20413] Fix | Delete

size: "__unstable-large",

[20414] Fix | Delete

onChange: newValue => {

[20415] Fix | Delete

onChange({

[20416] Fix | Delete

...layout,

[20417] Fix | Delete

minimumColumnWidth: newValue

[20418] Fix | Delete

});

[20419] Fix | Delete

[20420] Fix | Delete

onUnitChange: handleUnitChange,

[20421] Fix | Delete

value: value,

[20422] Fix | Delete

units: units,

[20423] Fix | Delete

min: 0,

[20424] Fix | Delete

label: (0,external_wp_i18n_namespaceObject.__)('Minimum column width'),

[20425] Fix | Delete

hideLabelFromVision: true

[20426] Fix | Delete

})

[20427] Fix | Delete

}), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.FlexItem, {

[20428] Fix | Delete

isBlock: true,

[20429] Fix | Delete

children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.RangeControl, {

[20430] Fix | Delete

onChange: handleSliderChange,

[20431] Fix | Delete

value: quantity,

[20432] Fix | Delete

min: 0,

[20433] Fix | Delete

max: RANGE_CONTROL_MAX_VALUES[unit] || 600,

[20434] Fix | Delete

withInputField: false,

[20435] Fix | Delete

label: (0,external_wp_i18n_namespaceObject.__)('Minimum column width'),

[20436] Fix | Delete

hideLabelFromVision: true

[20437] Fix | Delete

})

[20438] Fix | Delete

})]

[20439] Fix | Delete

})]

[20440] Fix | Delete

});

[20441] Fix | Delete

}

[20442] Fix | Delete

[20443] Fix | Delete

// Enables setting number of grid columns

[20444] Fix | Delete

function GridLayoutColumnsAndRowsControl({

[20445] Fix | Delete

layout,

[20446] Fix | Delete

onChange,

[20447] Fix | Delete

allowSizingOnChildren

[20448] Fix | Delete

}) {

[20449] Fix | Delete

const {

[20450] Fix | Delete

columnCount = 3,

[20451] Fix | Delete

rowCount

[20452] Fix | Delete

} = layout;

[20453] Fix | Delete

return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_ReactJSXRuntime_namespaceObject.Fragment, {

[20454] Fix | Delete

children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("fieldset", {

[20455] Fix | Delete

children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.BaseControl.VisualLabel, {

[20456] Fix | Delete

as: "legend",

[20457] Fix | Delete

children: (0,external_wp_i18n_namespaceObject.__)('Columns')

[20458] Fix | Delete

}), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)(external_wp_components_namespaceObject.Flex, {

[20459] Fix | Delete

gap: 4,

[20460] Fix | Delete

children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.FlexItem, {

[20461] Fix | Delete

isBlock: true,

[20462] Fix | Delete

children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.__experimentalNumberControl, {

[20463] Fix | Delete

size: "__unstable-large",

[20464] Fix | Delete

onChange: value => {

[20465] Fix | Delete

/**

[20466] Fix | Delete

* If the input is cleared, avoid switching

[20467] Fix | Delete

* back to "Auto" by setting a value of "1".

[20468] Fix | Delete

[20469] Fix | Delete

const validValue = value !== '' ? value : '1';

[20470] Fix | Delete

onChange({

[20471] Fix | Delete

...layout,

[20472] Fix | Delete

columnCount: validValue

[20473] Fix | Delete

});

[20474] Fix | Delete

[20475] Fix | Delete

value: columnCount,

[20476] Fix | Delete

min: 1,

[20477] Fix | Delete

label: (0,external_wp_i18n_namespaceObject.__)('Columns'),

[20478] Fix | Delete

hideLabelFromVision: true

[20479] Fix | Delete

})

[20480] Fix | Delete

}), /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.FlexItem, {

[20481] Fix | Delete

isBlock: true,

[20482] Fix | Delete

children: /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.RangeControl, {

[20483] Fix | Delete

value: parseInt(columnCount, 10) // RangeControl can't deal with strings.

[20484] Fix | Delete

[20485] Fix | Delete

onChange: value => onChange({

[20486] Fix | Delete

...layout,

[20487] Fix | Delete

columnCount: value

[20488] Fix | Delete

}),

[20489] Fix | Delete

min: 1,

[20490] Fix | Delete

max: 16,

[20491] Fix | Delete

withInputField: false,

[20492] Fix | Delete

label: (0,external_wp_i18n_namespaceObject.__)('Columns'),

[20493] Fix | Delete

hideLabelFromVision: true

[20494] Fix | Delete

})

[20495] Fix | Delete

})]

[20496] Fix | Delete

})]

[20497] Fix | Delete

}), allowSizingOnChildren && window.__experimentalEnableGridInteractivity && /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsxs)("fieldset", {

[20498] Fix | Delete

children: [/*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(external_wp_components_namespaceObject.BaseControl.VisualLabel, {

[20499] Fix | Delete

1 ...39 404142 43 ...144