@wordpress/block-editor 15.9.0 → 15.9.1-next.6deb34194.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +12 -0
- package/build/components/block-alignment-matrix-control/index.js +1 -8
- package/build/components/block-alignment-matrix-control/index.js.map +2 -2
- package/build/components/block-bindings/attribute-control.js +172 -0
- package/build/components/block-bindings/attribute-control.js.map +7 -0
- package/build/components/block-bindings/index.js +47 -0
- package/build/components/block-bindings/index.js.map +7 -0
- package/build/components/block-bindings/source-fields-list.js +135 -0
- package/build/components/block-bindings/source-fields-list.js.map +7 -0
- package/build/components/block-bindings/use-block-bindings-utils.js +66 -0
- package/build/components/block-bindings/use-block-bindings-utils.js.map +7 -0
- package/build/components/block-edit/edit.js +1 -3
- package/build/components/block-edit/edit.js.map +2 -2
- package/build/components/block-styles/preview-panel.js +3 -5
- package/build/components/block-styles/preview-panel.js.map +2 -2
- package/build/components/block-styles/use-styles-for-block.js +2 -2
- package/build/components/block-styles/use-styles-for-block.js.map +2 -2
- package/build/components/block-toolbar/index.js +1 -8
- package/build/components/block-toolbar/index.js.map +3 -3
- package/build/components/content-only-controls/index.js +2 -25
- package/build/components/content-only-controls/index.js.map +2 -2
- package/build/components/content-only-controls/link/index.js +3 -3
- package/build/components/content-only-controls/link/index.js.map +2 -2
- package/build/components/content-only-controls/media/index.js +3 -3
- package/build/components/content-only-controls/media/index.js.map +2 -2
- package/build/components/content-only-controls/rich-text/index.js +3 -2
- package/build/components/content-only-controls/rich-text/index.js.map +2 -2
- package/build/components/dimensions-tool/width-height-tool.js +4 -16
- package/build/components/dimensions-tool/width-height-tool.js.map +3 -3
- package/build/components/image-editor/cropper.js +3 -34
- package/build/components/image-editor/cropper.js.map +3 -3
- package/build/components/image-editor/index.js +9 -3
- package/build/components/image-editor/index.js.map +2 -2
- package/build/components/image-editor/use-transform-image.js +62 -32
- package/build/components/image-editor/use-transform-image.js.map +2 -2
- package/build/components/image-editor/zoom-dropdown.js +2 -2
- package/build/components/image-editor/zoom-dropdown.js.map +2 -2
- package/build/components/index.js +10 -3
- package/build/components/index.js.map +2 -2
- package/build/components/inserter-draggable-blocks/index.js +8 -4
- package/build/components/inserter-draggable-blocks/index.js.map +2 -2
- package/build/components/inspector-controls-tabs/content-tab.js +3 -2
- package/build/components/inspector-controls-tabs/content-tab.js.map +2 -2
- package/build/components/tool-selector/index.js +46 -0
- package/build/components/tool-selector/index.js.map +7 -0
- package/build/hooks/block-bindings.js +22 -260
- package/build/hooks/block-bindings.js.map +3 -3
- package/build/layouts/grid.js +23 -28
- package/build/layouts/grid.js.map +2 -2
- package/build/utils/block-bindings.js +2 -44
- package/build/utils/block-bindings.js.map +3 -3
- package/build/utils/index.js +2 -5
- package/build/utils/index.js.map +2 -2
- package/build-module/components/block-alignment-matrix-control/index.js +1 -8
- package/build-module/components/block-alignment-matrix-control/index.js.map +2 -2
- package/build-module/components/block-bindings/attribute-control.js +150 -0
- package/build-module/components/block-bindings/attribute-control.js.map +7 -0
- package/build-module/components/block-bindings/index.js +10 -0
- package/build-module/components/block-bindings/index.js.map +7 -0
- package/build-module/components/block-bindings/source-fields-list.js +104 -0
- package/build-module/components/block-bindings/source-fields-list.js.map +7 -0
- package/build-module/components/block-bindings/use-block-bindings-utils.js +45 -0
- package/build-module/components/block-bindings/use-block-bindings-utils.js.map +7 -0
- package/build-module/components/block-edit/edit.js +1 -3
- package/build-module/components/block-edit/edit.js.map +2 -2
- package/build-module/components/block-styles/preview-panel.js +3 -5
- package/build-module/components/block-styles/preview-panel.js.map +2 -2
- package/build-module/components/block-styles/use-styles-for-block.js +2 -2
- package/build-module/components/block-styles/use-styles-for-block.js.map +2 -2
- package/build-module/components/block-toolbar/index.js +1 -8
- package/build-module/components/block-toolbar/index.js.map +2 -2
- package/build-module/components/content-only-controls/index.js +2 -25
- package/build-module/components/content-only-controls/index.js.map +2 -2
- package/build-module/components/content-only-controls/link/index.js +3 -3
- package/build-module/components/content-only-controls/link/index.js.map +2 -2
- package/build-module/components/content-only-controls/media/index.js +3 -3
- package/build-module/components/content-only-controls/media/index.js.map +2 -2
- package/build-module/components/content-only-controls/rich-text/index.js +3 -2
- package/build-module/components/content-only-controls/rich-text/index.js.map +2 -2
- package/build-module/components/dimensions-tool/width-height-tool.js +4 -6
- package/build-module/components/dimensions-tool/width-height-tool.js.map +2 -2
- package/build-module/components/image-editor/cropper.js +3 -34
- package/build-module/components/image-editor/cropper.js.map +2 -2
- package/build-module/components/image-editor/index.js +9 -3
- package/build-module/components/image-editor/index.js.map +2 -2
- package/build-module/components/image-editor/use-transform-image.js +63 -33
- package/build-module/components/image-editor/use-transform-image.js.map +2 -2
- package/build-module/components/image-editor/zoom-dropdown.js +2 -2
- package/build-module/components/image-editor/zoom-dropdown.js.map +2 -2
- package/build-module/components/index.js +74 -66
- package/build-module/components/index.js.map +2 -2
- package/build-module/components/inserter-draggable-blocks/index.js +8 -4
- package/build-module/components/inserter-draggable-blocks/index.js.map +2 -2
- package/build-module/components/inspector-controls-tabs/content-tab.js +3 -2
- package/build-module/components/inspector-controls-tabs/content-tab.js.map +2 -2
- package/build-module/components/tool-selector/index.js +15 -0
- package/build-module/components/tool-selector/index.js.map +7 -0
- package/build-module/hooks/block-bindings.js +27 -270
- package/build-module/hooks/block-bindings.js.map +2 -2
- package/build-module/layouts/grid.js +23 -28
- package/build-module/layouts/grid.js.map +2 -2
- package/build-module/utils/block-bindings.js +1 -42
- package/build-module/utils/block-bindings.js.map +2 -2
- package/build-module/utils/index.js +1 -3
- package/build-module/utils/index.js.map +2 -2
- package/build-style/style-rtl.css +6 -6
- package/build-style/style.css +6 -6
- package/package.json +39 -40
- package/src/components/block-alignment-matrix-control/index.js +1 -5
- package/src/components/block-bindings/attribute-control.js +174 -0
- package/src/components/block-bindings/index.js +6 -0
- package/src/components/block-bindings/source-fields-list.js +130 -0
- package/src/components/block-bindings/use-block-bindings-utils.js +156 -0
- package/src/components/block-edit/edit.js +1 -3
- package/src/components/block-styles/preview-panel.js +3 -5
- package/src/components/block-styles/use-styles-for-block.js +2 -2
- package/src/components/block-toolbar/index.js +1 -6
- package/src/components/block-toolbar/style.scss +6 -6
- package/src/components/content-only-controls/index.js +2 -27
- package/src/components/content-only-controls/link/index.js +3 -3
- package/src/components/content-only-controls/media/index.js +3 -3
- package/src/components/content-only-controls/rich-text/index.js +3 -2
- package/src/components/dimensions-tool/width-height-tool.js +6 -13
- package/src/components/image-editor/cropper.js +3 -32
- package/src/components/image-editor/index.js +34 -29
- package/src/components/image-editor/use-transform-image.js +80 -34
- package/src/components/image-editor/zoom-dropdown.js +2 -2
- package/src/components/index.js +9 -1
- package/src/components/inserter/style.scss +1 -1
- package/src/components/inserter-draggable-blocks/index.js +19 -8
- package/src/components/inspector-controls-tabs/content-tab.js +6 -2
- package/src/components/tool-selector/index.js +19 -0
- package/src/hooks/block-bindings.js +27 -347
- package/src/layouts/grid.js +40 -72
- package/src/layouts/test/grid.js +14 -0
- package/src/utils/block-bindings.js +0 -157
- package/src/utils/index.js +0 -1
- package/tsconfig.json +1 -0
- package/build/components/block-toolbar/block-name-context.js +0 -30
- package/build/components/block-toolbar/block-name-context.js.map +0 -7
- package/build-module/components/block-toolbar/block-name-context.js +0 -9
- package/build-module/components/block-toolbar/block-name-context.js.map +0 -7
- package/src/components/block-toolbar/block-name-context.js +0 -9
- /package/src/{utils → components/block-bindings}/test/use-block-bindings-utils.js +0 -0
|
@@ -62,10 +62,10 @@ var grid_default = {
|
|
|
62
62
|
layoutBlockSupport = {}
|
|
63
63
|
}) {
|
|
64
64
|
const { allowSizingOnChildren = false } = layoutBlockSupport;
|
|
65
|
-
const showColumnsControl =
|
|
66
|
-
const showMinWidthControl = window.__experimentalEnableGridInteractivity
|
|
65
|
+
const showColumnsControl = true;
|
|
66
|
+
const showMinWidthControl = !layout?.isManualPlacement || window.__experimentalEnableGridInteractivity;
|
|
67
67
|
return /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
68
|
-
/* @__PURE__ */ jsx(
|
|
68
|
+
window.__experimentalEnableGridInteractivity && /* @__PURE__ */ jsx(
|
|
69
69
|
GridLayoutTypeControl,
|
|
70
70
|
{
|
|
71
71
|
layout,
|
|
@@ -193,7 +193,7 @@ function GridLayoutMinimumWidthControl({ layout, onChange }) {
|
|
|
193
193
|
});
|
|
194
194
|
};
|
|
195
195
|
return /* @__PURE__ */ jsxs("fieldset", { className: "block-editor-hooks__grid-layout-minimum-width-control", children: [
|
|
196
|
-
/* @__PURE__ */ jsx(BaseControl.VisualLabel, { as: "legend", children: __("
|
|
196
|
+
/* @__PURE__ */ jsx(BaseControl.VisualLabel, { as: "legend", children: __("Min. column width") }),
|
|
197
197
|
/* @__PURE__ */ jsxs(Flex, { gap: 4, children: [
|
|
198
198
|
/* @__PURE__ */ jsx(FlexItem, { isBlock: true, children: /* @__PURE__ */ jsx(
|
|
199
199
|
UnitControl,
|
|
@@ -227,7 +227,10 @@ function GridLayoutMinimumWidthControl({ layout, onChange }) {
|
|
|
227
227
|
hideLabelFromVision: true
|
|
228
228
|
}
|
|
229
229
|
) })
|
|
230
|
-
] })
|
|
230
|
+
] }),
|
|
231
|
+
/* @__PURE__ */ jsx("p", { className: "components-base-control__help", children: __(
|
|
232
|
+
"Columns will wrap to fewer per row when they can no longer maintain the minimum width."
|
|
233
|
+
) })
|
|
231
234
|
] });
|
|
232
235
|
}
|
|
233
236
|
function GridLayoutColumnsAndRowsControl({
|
|
@@ -235,42 +238,34 @@ function GridLayoutColumnsAndRowsControl({
|
|
|
235
238
|
onChange,
|
|
236
239
|
allowSizingOnChildren
|
|
237
240
|
}) {
|
|
238
|
-
const defaultColumnCount =
|
|
241
|
+
const defaultColumnCount = void 0;
|
|
239
242
|
const {
|
|
240
243
|
columnCount = defaultColumnCount,
|
|
241
244
|
rowCount,
|
|
242
245
|
isManualPlacement
|
|
243
246
|
} = layout;
|
|
244
247
|
return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsxs("fieldset", { className: "block-editor-hooks__grid-layout-columns-and-rows-controls", children: [
|
|
245
|
-
|
|
248
|
+
!isManualPlacement && /* @__PURE__ */ jsx(BaseControl.VisualLabel, { as: "legend", children: __("Max. columns") }),
|
|
246
249
|
/* @__PURE__ */ jsxs(Flex, { gap: 4, children: [
|
|
247
250
|
/* @__PURE__ */ jsx(FlexItem, { isBlock: true, children: /* @__PURE__ */ jsx(
|
|
248
251
|
NumberControl,
|
|
249
252
|
{
|
|
250
253
|
size: "__unstable-large",
|
|
251
254
|
onChange: (value) => {
|
|
252
|
-
|
|
253
|
-
|
|
254
|
-
|
|
255
|
-
|
|
256
|
-
|
|
257
|
-
|
|
258
|
-
});
|
|
259
|
-
} else {
|
|
260
|
-
const newColumnCount = value === "" || value === "0" ? 1 : parseInt(value, 10);
|
|
261
|
-
onChange({
|
|
262
|
-
...layout,
|
|
263
|
-
columnCount: newColumnCount
|
|
264
|
-
});
|
|
265
|
-
}
|
|
255
|
+
const defaultNewColumnCount = isManualPlacement ? 1 : void 0;
|
|
256
|
+
const newColumnCount = value === "" || value === "0" ? defaultNewColumnCount : parseInt(value, 10);
|
|
257
|
+
onChange({
|
|
258
|
+
...layout,
|
|
259
|
+
columnCount: newColumnCount
|
|
260
|
+
});
|
|
266
261
|
},
|
|
267
262
|
value: columnCount,
|
|
268
263
|
min: 1,
|
|
269
264
|
label: __("Columns"),
|
|
270
|
-
hideLabelFromVision: !
|
|
265
|
+
hideLabelFromVision: !isManualPlacement
|
|
271
266
|
}
|
|
272
267
|
) }),
|
|
273
|
-
/* @__PURE__ */ jsx(FlexItem, { isBlock: true, children:
|
|
268
|
+
/* @__PURE__ */ jsx(FlexItem, { isBlock: true, children: allowSizingOnChildren && isManualPlacement ? /* @__PURE__ */ jsx(
|
|
274
269
|
NumberControl,
|
|
275
270
|
{
|
|
276
271
|
size: "__unstable-large",
|
|
@@ -314,7 +309,7 @@ function GridLayoutTypeControl({ layout, onChange }) {
|
|
|
314
309
|
const [tempMinimumColumnWidth, setTempMinimumColumnWidth] = useState(
|
|
315
310
|
minimumColumnWidth || "12rem"
|
|
316
311
|
);
|
|
317
|
-
const gridPlacement = isManualPlacement
|
|
312
|
+
const gridPlacement = isManualPlacement ? "manual" : "auto";
|
|
318
313
|
const onChangeType = (value) => {
|
|
319
314
|
if (value === "manual") {
|
|
320
315
|
setTempMinimumColumnWidth(minimumColumnWidth || "12rem");
|
|
@@ -324,9 +319,9 @@ function GridLayoutTypeControl({ layout, onChange }) {
|
|
|
324
319
|
}
|
|
325
320
|
onChange({
|
|
326
321
|
...layout,
|
|
327
|
-
columnCount: value === "manual" ? tempColumnCount :
|
|
328
|
-
rowCount: value === "manual"
|
|
329
|
-
isManualPlacement: value === "manual"
|
|
322
|
+
columnCount: value === "manual" ? tempColumnCount : tempColumnCount,
|
|
323
|
+
rowCount: value === "manual" ? tempRowCount : void 0,
|
|
324
|
+
isManualPlacement: value === "manual" ? true : void 0,
|
|
330
325
|
minimumColumnWidth: value === "auto" ? tempMinimumColumnWidth : null
|
|
331
326
|
});
|
|
332
327
|
};
|
|
@@ -344,7 +339,7 @@ function GridLayoutTypeControl({ layout, onChange }) {
|
|
|
344
339
|
value: gridPlacement,
|
|
345
340
|
onChange: onChangeType,
|
|
346
341
|
isBlock: true,
|
|
347
|
-
help:
|
|
342
|
+
help: helpText,
|
|
348
343
|
children: [
|
|
349
344
|
/* @__PURE__ */ jsx(
|
|
350
345
|
ToggleGroupControlOption,
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/layouts/grid.js"],
|
|
4
|
-
"sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\n\nimport {\n\tBaseControl,\n\tFlex,\n\tFlexItem,\n\tRangeControl,\n\t__experimentalNumberControl as NumberControl,\n\t__experimentalToggleGroupControl as ToggleGroupControl,\n\t__experimentalToggleGroupControlOption as ToggleGroupControlOption,\n\t__experimentalUnitControl as UnitControl,\n\t__experimentalParseQuantityAndUnitFromRawValue as parseQuantityAndUnitFromRawValue,\n\t__experimentalVStack as VStack,\n} from '@wordpress/components';\nimport { useState } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { appendSelectors, getBlockGapCSS } from './utils';\nimport { getGapCSSValue } from '../hooks/gap';\nimport { shouldSkipSerialization } from '../hooks/utils';\nimport { LAYOUT_DEFINITIONS } from './definitions';\n\nconst RANGE_CONTROL_MAX_VALUES = {\n\tpx: 600,\n\t'%': 100,\n\tvw: 100,\n\tvh: 100,\n\tem: 38,\n\trem: 38,\n\tsvw: 100,\n\tlvw: 100,\n\tdvw: 100,\n\tsvh: 100,\n\tlvh: 100,\n\tdvh: 100,\n\tvi: 100,\n\tsvi: 100,\n\tlvi: 100,\n\tdvi: 100,\n\tvb: 100,\n\tsvb: 100,\n\tlvb: 100,\n\tdvb: 100,\n\tvmin: 100,\n\tsvmin: 100,\n\tlvmin: 100,\n\tdvmin: 100,\n\tvmax: 100,\n\tsvmax: 100,\n\tlvmax: 100,\n\tdvmax: 100,\n};\n\nconst units = [\n\t{ value: 'px', label: 'px', default: 0 },\n\t{ value: 'rem', label: 'rem', default: 0 },\n\t{ value: 'em', label: 'em', default: 0 },\n];\n\nexport default {\n\tname: 'grid',\n\tlabel: __( 'Grid' ),\n\tinspectorControls: function GridLayoutInspectorControls( {\n\t\tlayout = {},\n\t\tonChange,\n\t\tlayoutBlockSupport = {},\n\t} ) {\n\t\tconst { allowSizingOnChildren = false } = layoutBlockSupport;\n\n\t\t// In the experiment we want to also show column control in Auto mode, and\n\t\t// the minimum width control in Manual mode.\n\t\tconst showColumnsControl =\n\t\t\twindow.__experimentalEnableGridInteractivity ||\n\t\t\t!! layout?.columnCount;\n\t\tconst showMinWidthControl =\n\t\t\twindow.__experimentalEnableGridInteractivity ||\n\t\t\t! layout?.columnCount;\n\t\treturn (\n\t\t\t<>\n\t\t\t\t<GridLayoutTypeControl\n\t\t\t\t\tlayout={ layout }\n\t\t\t\t\tonChange={ onChange }\n\t\t\t\t/>\n\t\t\t\t<VStack spacing={ 4 }>\n\t\t\t\t\t{ showColumnsControl && (\n\t\t\t\t\t\t<GridLayoutColumnsAndRowsControl\n\t\t\t\t\t\t\tlayout={ layout }\n\t\t\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\t\t\tallowSizingOnChildren={ allowSizingOnChildren }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t\t{ showMinWidthControl && (\n\t\t\t\t\t\t<GridLayoutMinimumWidthControl\n\t\t\t\t\t\t\tlayout={ layout }\n\t\t\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t</VStack>\n\t\t\t</>\n\t\t);\n\t},\n\ttoolBarControls: function GridLayoutToolbarControls() {\n\t\treturn null;\n\t},\n\tgetLayoutStyle: function getLayoutStyle( {\n\t\tselector,\n\t\tlayout,\n\t\tstyle,\n\t\tblockName,\n\t\thasBlockGapSupport,\n\t\tlayoutDefinitions = LAYOUT_DEFINITIONS,\n\t} ) {\n\t\tconst {\n\t\t\tminimumColumnWidth = null,\n\t\t\tcolumnCount = null,\n\t\t\trowCount = null,\n\t\t} = layout;\n\n\t\t// Check that the grid layout attributes are of the correct type, so that we don't accidentally\n\t\t// write code that stores a string attribute instead of a number.\n\t\tif ( process.env.NODE_ENV === 'development' ) {\n\t\t\tif (\n\t\t\t\tminimumColumnWidth &&\n\t\t\t\ttypeof minimumColumnWidth !== 'string'\n\t\t\t) {\n\t\t\t\tthrow new Error( 'minimumColumnWidth must be a string' );\n\t\t\t}\n\t\t\tif ( columnCount && typeof columnCount !== 'number' ) {\n\t\t\t\tthrow new Error( 'columnCount must be a number' );\n\t\t\t}\n\t\t\tif ( rowCount && typeof rowCount !== 'number' ) {\n\t\t\t\tthrow new Error( 'rowCount must be a number' );\n\t\t\t}\n\t\t}\n\n\t\t// If a block's block.json skips serialization for spacing or spacing.blockGap,\n\t\t// don't apply the user-defined value to the styles.\n\t\tconst blockGapValue =\n\t\t\tstyle?.spacing?.blockGap &&\n\t\t\t! shouldSkipSerialization( blockName, 'spacing', 'blockGap' )\n\t\t\t\t? getGapCSSValue( style?.spacing?.blockGap, '0.5em' )\n\t\t\t\t: undefined;\n\n\t\tlet output = '';\n\t\tconst rules = [];\n\n\t\tif ( minimumColumnWidth && columnCount > 0 ) {\n\t\t\tconst maxValue = `max(${ minimumColumnWidth }, ( 100% - (${\n\t\t\t\tblockGapValue || '1.2rem'\n\t\t\t}*${ columnCount - 1 }) ) / ${ columnCount })`;\n\t\t\trules.push(\n\t\t\t\t`grid-template-columns: repeat(auto-fill, minmax(${ maxValue }, 1fr))`,\n\t\t\t\t`container-type: inline-size`\n\t\t\t);\n\t\t\tif ( rowCount ) {\n\t\t\t\trules.push(\n\t\t\t\t\t`grid-template-rows: repeat(${ rowCount }, minmax(1rem, auto))`\n\t\t\t\t);\n\t\t\t}\n\t\t} else if ( columnCount ) {\n\t\t\trules.push(\n\t\t\t\t`grid-template-columns: repeat(${ columnCount }, minmax(0, 1fr))`\n\t\t\t);\n\t\t\tif ( rowCount ) {\n\t\t\t\trules.push(\n\t\t\t\t\t`grid-template-rows: repeat(${ rowCount }, minmax(1rem, auto))`\n\t\t\t\t);\n\t\t\t}\n\t\t} else {\n\t\t\trules.push(\n\t\t\t\t`grid-template-columns: repeat(auto-fill, minmax(min(${\n\t\t\t\t\tminimumColumnWidth || '12rem'\n\t\t\t\t}, 100%), 1fr))`,\n\t\t\t\t'container-type: inline-size'\n\t\t\t);\n\t\t}\n\n\t\tif ( rules.length ) {\n\t\t\toutput = `${ appendSelectors( selector ) } { ${ rules.join(\n\t\t\t\t'; '\n\t\t\t) }; }`;\n\t\t}\n\n\t\t// Output blockGap styles based on rules contained in layout definitions in theme.json.\n\t\tif ( hasBlockGapSupport && blockGapValue ) {\n\t\t\toutput += getBlockGapCSS(\n\t\t\t\tselector,\n\t\t\t\tlayoutDefinitions,\n\t\t\t\t'grid',\n\t\t\t\tblockGapValue\n\t\t\t);\n\t\t}\n\t\treturn output;\n\t},\n\tgetOrientation() {\n\t\treturn 'horizontal';\n\t},\n\tgetAlignments() {\n\t\treturn [];\n\t},\n};\n\n// Enables setting minimum width of grid items.\nfunction GridLayoutMinimumWidthControl( { layout, onChange } ) {\n\tconst { minimumColumnWidth, columnCount, isManualPlacement } = layout;\n\tconst defaultValue = isManualPlacement || columnCount ? null : '12rem';\n\tconst value = minimumColumnWidth || defaultValue;\n\tconst [ quantity, unit = 'rem' ] =\n\t\tparseQuantityAndUnitFromRawValue( value );\n\n\tconst handleSliderChange = ( next ) => {\n\t\tonChange( {\n\t\t\t...layout,\n\t\t\tminimumColumnWidth: [ next, unit ].join( '' ),\n\t\t} );\n\t};\n\n\t// Mostly copied from HeightControl.\n\tconst handleUnitChange = ( newUnit ) => {\n\t\t// Attempt to smooth over differences between currentUnit and newUnit.\n\t\t// This should slightly improve the experience of switching between unit types.\n\t\tlet newValue;\n\n\t\tif ( [ 'em', 'rem' ].includes( newUnit ) && unit === 'px' ) {\n\t\t\t// Convert pixel value to an approximate of the new unit, assuming a root size of 16px.\n\t\t\tnewValue = ( quantity / 16 ).toFixed( 2 ) + newUnit;\n\t\t} else if ( [ 'em', 'rem' ].includes( unit ) && newUnit === 'px' ) {\n\t\t\t// Convert to pixel value assuming a root size of 16px.\n\t\t\tnewValue = Math.round( quantity * 16 ) + newUnit;\n\t\t}\n\n\t\tonChange( {\n\t\t\t...layout,\n\t\t\tminimumColumnWidth: newValue,\n\t\t} );\n\t};\n\n\treturn (\n\t\t<fieldset className=\"block-editor-hooks__grid-layout-minimum-width-control\">\n\t\t\t<BaseControl.VisualLabel as=\"legend\">\n\t\t\t\t{ __( 'Minimum column width' ) }\n\t\t\t</BaseControl.VisualLabel>\n\t\t\t<Flex gap={ 4 }>\n\t\t\t\t<FlexItem isBlock>\n\t\t\t\t\t<UnitControl\n\t\t\t\t\t\tsize=\"__unstable-large\"\n\t\t\t\t\t\tonChange={ ( newValue ) => {\n\t\t\t\t\t\t\tonChange( {\n\t\t\t\t\t\t\t\t...layout,\n\t\t\t\t\t\t\t\tminimumColumnWidth:\n\t\t\t\t\t\t\t\t\tnewValue === '' ? undefined : newValue,\n\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tonUnitChange={ handleUnitChange }\n\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t\tunits={ units }\n\t\t\t\t\t\tmin={ 0 }\n\t\t\t\t\t\tlabel={ __( 'Minimum column width' ) }\n\t\t\t\t\t\thideLabelFromVision\n\t\t\t\t\t/>\n\t\t\t\t</FlexItem>\n\t\t\t\t<FlexItem isBlock>\n\t\t\t\t\t<RangeControl\n\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\t\t\tonChange={ handleSliderChange }\n\t\t\t\t\t\tvalue={ quantity || 0 }\n\t\t\t\t\t\tmin={ 0 }\n\t\t\t\t\t\tmax={ RANGE_CONTROL_MAX_VALUES[ unit ] || 600 }\n\t\t\t\t\t\twithInputField={ false }\n\t\t\t\t\t\tlabel={ __( 'Minimum column width' ) }\n\t\t\t\t\t\thideLabelFromVision\n\t\t\t\t\t/>\n\t\t\t\t</FlexItem>\n\t\t\t</Flex>\n\t\t</fieldset>\n\t);\n}\n\n// Enables setting number of grid columns\nfunction GridLayoutColumnsAndRowsControl( {\n\tlayout,\n\tonChange,\n\tallowSizingOnChildren,\n} ) {\n\t// If the grid interactivity experiment is enabled, allow unsetting the column count.\n\tconst defaultColumnCount = window.__experimentalEnableGridInteractivity\n\t\t? undefined\n\t\t: 3;\n\tconst {\n\t\tcolumnCount = defaultColumnCount,\n\t\trowCount,\n\t\tisManualPlacement,\n\t} = layout;\n\n\treturn (\n\t\t<>\n\t\t\t<fieldset className=\"block-editor-hooks__grid-layout-columns-and-rows-controls\">\n\t\t\t\t{ ( ! window.__experimentalEnableGridInteractivity ||\n\t\t\t\t\t! isManualPlacement ) && (\n\t\t\t\t\t<BaseControl.VisualLabel as=\"legend\">\n\t\t\t\t\t\t{ __( 'Columns' ) }\n\t\t\t\t\t</BaseControl.VisualLabel>\n\t\t\t\t) }\n\t\t\t\t<Flex gap={ 4 }>\n\t\t\t\t\t<FlexItem isBlock>\n\t\t\t\t\t\t<NumberControl\n\t\t\t\t\t\t\tsize=\"__unstable-large\"\n\t\t\t\t\t\t\tonChange={ ( value ) => {\n\t\t\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t\t\twindow.__experimentalEnableGridInteractivity\n\t\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\t\t// Allow unsetting the column count when in auto mode.\n\t\t\t\t\t\t\t\t\tconst defaultNewColumnCount =\n\t\t\t\t\t\t\t\t\t\tisManualPlacement ? 1 : undefined;\n\t\t\t\t\t\t\t\t\tconst newColumnCount =\n\t\t\t\t\t\t\t\t\t\tvalue === '' || value === '0'\n\t\t\t\t\t\t\t\t\t\t\t? defaultNewColumnCount\n\t\t\t\t\t\t\t\t\t\t\t: parseInt( value, 10 );\n\t\t\t\t\t\t\t\t\tonChange( {\n\t\t\t\t\t\t\t\t\t\t...layout,\n\t\t\t\t\t\t\t\t\t\tcolumnCount: newColumnCount,\n\t\t\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\t// Don't allow unsetting the column count.\n\t\t\t\t\t\t\t\t\tconst newColumnCount =\n\t\t\t\t\t\t\t\t\t\tvalue === '' || value === '0'\n\t\t\t\t\t\t\t\t\t\t\t? 1\n\t\t\t\t\t\t\t\t\t\t\t: parseInt( value, 10 );\n\t\t\t\t\t\t\t\t\tonChange( {\n\t\t\t\t\t\t\t\t\t\t...layout,\n\t\t\t\t\t\t\t\t\t\tcolumnCount: newColumnCount,\n\t\t\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tvalue={ columnCount }\n\t\t\t\t\t\t\tmin={ 1 }\n\t\t\t\t\t\t\tlabel={ __( 'Columns' ) }\n\t\t\t\t\t\t\thideLabelFromVision={\n\t\t\t\t\t\t\t\t! window.__experimentalEnableGridInteractivity ||\n\t\t\t\t\t\t\t\t! isManualPlacement\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</FlexItem>\n\n\t\t\t\t\t<FlexItem isBlock>\n\t\t\t\t\t\t{ window.__experimentalEnableGridInteractivity &&\n\t\t\t\t\t\tallowSizingOnChildren &&\n\t\t\t\t\t\tisManualPlacement ? (\n\t\t\t\t\t\t\t<NumberControl\n\t\t\t\t\t\t\t\tsize=\"__unstable-large\"\n\t\t\t\t\t\t\t\tonChange={ ( value ) => {\n\t\t\t\t\t\t\t\t\t// Don't allow unsetting the row count.\n\t\t\t\t\t\t\t\t\tconst newRowCount =\n\t\t\t\t\t\t\t\t\t\tvalue === '' || value === '0'\n\t\t\t\t\t\t\t\t\t\t\t? 1\n\t\t\t\t\t\t\t\t\t\t\t: parseInt( value, 10 );\n\t\t\t\t\t\t\t\t\tonChange( {\n\t\t\t\t\t\t\t\t\t\t...layout,\n\t\t\t\t\t\t\t\t\t\trowCount: newRowCount,\n\t\t\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\tvalue={ rowCount }\n\t\t\t\t\t\t\t\tmin={ 1 }\n\t\t\t\t\t\t\t\tlabel={ __( 'Rows' ) }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<RangeControl\n\t\t\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\t\t\t\t\tvalue={ columnCount ?? 1 }\n\t\t\t\t\t\t\t\tonChange={ ( value ) =>\n\t\t\t\t\t\t\t\t\tonChange( {\n\t\t\t\t\t\t\t\t\t\t...layout,\n\t\t\t\t\t\t\t\t\t\tcolumnCount:\n\t\t\t\t\t\t\t\t\t\t\tvalue === '' || value === '0'\n\t\t\t\t\t\t\t\t\t\t\t\t? 1\n\t\t\t\t\t\t\t\t\t\t\t\t: value,\n\t\t\t\t\t\t\t\t\t} )\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tmin={ 1 }\n\t\t\t\t\t\t\t\tmax={ 16 }\n\t\t\t\t\t\t\t\twithInputField={ false }\n\t\t\t\t\t\t\t\tlabel={ __( 'Columns' ) }\n\t\t\t\t\t\t\t\thideLabelFromVision\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t) }\n\t\t\t\t\t</FlexItem>\n\t\t\t\t</Flex>\n\t\t\t</fieldset>\n\t\t</>\n\t);\n}\n\n// Enables switching between grid types\nfunction GridLayoutTypeControl( { layout, onChange } ) {\n\tconst { columnCount, rowCount, minimumColumnWidth, isManualPlacement } =\n\t\tlayout;\n\n\t/**\n\t * When switching, temporarily save any custom values set on the\n\t * previous type so we can switch back without loss.\n\t */\n\tconst [ tempColumnCount, setTempColumnCount ] = useState(\n\t\tcolumnCount || 3\n\t);\n\tconst [ tempRowCount, setTempRowCount ] = useState( rowCount );\n\tconst [ tempMinimumColumnWidth, setTempMinimumColumnWidth ] = useState(\n\t\tminimumColumnWidth || '12rem'\n\t);\n\n\tconst gridPlacement =\n\t\tisManualPlacement ||\n\t\t( !! columnCount && ! window.__experimentalEnableGridInteractivity )\n\t\t\t? 'manual'\n\t\t\t: 'auto';\n\n\tconst onChangeType = ( value ) => {\n\t\tif ( value === 'manual' ) {\n\t\t\tsetTempMinimumColumnWidth( minimumColumnWidth || '12rem' );\n\t\t} else {\n\t\t\tsetTempColumnCount( columnCount || 3 );\n\t\t\tsetTempRowCount( rowCount );\n\t\t}\n\t\tonChange( {\n\t\t\t...layout,\n\t\t\tcolumnCount: value === 'manual' ? tempColumnCount : null,\n\t\t\trowCount:\n\t\t\t\tvalue === 'manual' &&\n\t\t\t\twindow.__experimentalEnableGridInteractivity\n\t\t\t\t\t? tempRowCount\n\t\t\t\t\t: undefined,\n\t\t\tisManualPlacement:\n\t\t\t\tvalue === 'manual' &&\n\t\t\t\twindow.__experimentalEnableGridInteractivity\n\t\t\t\t\t? true\n\t\t\t\t\t: undefined,\n\t\t\tminimumColumnWidth:\n\t\t\t\tvalue === 'auto' ? tempMinimumColumnWidth : null,\n\t\t} );\n\t};\n\n\tconst helpText =\n\t\tgridPlacement === 'manual'\n\t\t\t? __(\n\t\t\t\t\t'Grid items can be manually placed in any position on the grid.'\n\t\t\t )\n\t\t\t: __(\n\t\t\t\t\t'Grid items are placed automatically depending on their order.'\n\t\t\t );\n\n\treturn (\n\t\t<ToggleGroupControl\n\t\t\t__next40pxDefaultSize\n\t\t\t__nextHasNoMarginBottom\n\t\t\tlabel={ __( 'Grid item position' ) }\n\t\t\tvalue={ gridPlacement }\n\t\t\tonChange={ onChangeType }\n\t\t\tisBlock\n\t\t\thelp={\n\t\t\t\twindow.__experimentalEnableGridInteractivity\n\t\t\t\t\t? helpText\n\t\t\t\t\t: undefined\n\t\t\t}\n\t\t>\n\t\t\t<ToggleGroupControlOption\n\t\t\t\tkey=\"auto\"\n\t\t\t\tvalue=\"auto\"\n\t\t\t\tlabel={ __( 'Auto' ) }\n\t\t\t/>\n\t\t\t<ToggleGroupControlOption\n\t\t\t\tkey=\"manual\"\n\t\t\t\tvalue=\"manual\"\n\t\t\t\tlabel={ __( 'Manual' ) }\n\t\t\t/>\n\t\t</ToggleGroupControl>\n\t);\n}\n"],
|
|
5
|
-
"mappings": ";AAGA,SAAS,UAAU;AAEnB;AAAA,EACC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,+BAA+B;AAAA,EAC/B,oCAAoC;AAAA,EACpC,0CAA0C;AAAA,EAC1C,6BAA6B;AAAA,EAC7B,kDAAkD;AAAA,EAClD,wBAAwB;AAAA,OAClB;AACP,SAAS,gBAAgB;AAKzB,SAAS,iBAAiB,sBAAsB;AAChD,SAAS,sBAAsB;AAC/B,SAAS,+BAA+B;AACxC,SAAS,0BAA0B;
|
|
4
|
+
"sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\n\nimport {\n\tBaseControl,\n\tFlex,\n\tFlexItem,\n\tRangeControl,\n\t__experimentalNumberControl as NumberControl,\n\t__experimentalToggleGroupControl as ToggleGroupControl,\n\t__experimentalToggleGroupControlOption as ToggleGroupControlOption,\n\t__experimentalUnitControl as UnitControl,\n\t__experimentalParseQuantityAndUnitFromRawValue as parseQuantityAndUnitFromRawValue,\n\t__experimentalVStack as VStack,\n} from '@wordpress/components';\nimport { useState } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { appendSelectors, getBlockGapCSS } from './utils';\nimport { getGapCSSValue } from '../hooks/gap';\nimport { shouldSkipSerialization } from '../hooks/utils';\nimport { LAYOUT_DEFINITIONS } from './definitions';\n\nconst RANGE_CONTROL_MAX_VALUES = {\n\tpx: 600,\n\t'%': 100,\n\tvw: 100,\n\tvh: 100,\n\tem: 38,\n\trem: 38,\n\tsvw: 100,\n\tlvw: 100,\n\tdvw: 100,\n\tsvh: 100,\n\tlvh: 100,\n\tdvh: 100,\n\tvi: 100,\n\tsvi: 100,\n\tlvi: 100,\n\tdvi: 100,\n\tvb: 100,\n\tsvb: 100,\n\tlvb: 100,\n\tdvb: 100,\n\tvmin: 100,\n\tsvmin: 100,\n\tlvmin: 100,\n\tdvmin: 100,\n\tvmax: 100,\n\tsvmax: 100,\n\tlvmax: 100,\n\tdvmax: 100,\n};\n\nconst units = [\n\t{ value: 'px', label: 'px', default: 0 },\n\t{ value: 'rem', label: 'rem', default: 0 },\n\t{ value: 'em', label: 'em', default: 0 },\n];\n\nexport default {\n\tname: 'grid',\n\tlabel: __( 'Grid' ),\n\tinspectorControls: function GridLayoutInspectorControls( {\n\t\tlayout = {},\n\t\tonChange,\n\t\tlayoutBlockSupport = {},\n\t} ) {\n\t\tconst { allowSizingOnChildren = false } = layoutBlockSupport;\n\n\t\t// Always show both column and minimum width controls in Auto mode.\n\t\t// Manual mode (with isManualPlacement) is only available behind the experiment flag.\n\t\tconst showColumnsControl = true;\n\t\tconst showMinWidthControl =\n\t\t\t! layout?.isManualPlacement ||\n\t\t\twindow.__experimentalEnableGridInteractivity;\n\t\treturn (\n\t\t\t<>\n\t\t\t\t{ window.__experimentalEnableGridInteractivity && (\n\t\t\t\t\t<GridLayoutTypeControl\n\t\t\t\t\t\tlayout={ layout }\n\t\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t\t<VStack spacing={ 4 }>\n\t\t\t\t\t{ showColumnsControl && (\n\t\t\t\t\t\t<GridLayoutColumnsAndRowsControl\n\t\t\t\t\t\t\tlayout={ layout }\n\t\t\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\t\t\tallowSizingOnChildren={ allowSizingOnChildren }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t\t{ showMinWidthControl && (\n\t\t\t\t\t\t<GridLayoutMinimumWidthControl\n\t\t\t\t\t\t\tlayout={ layout }\n\t\t\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t</VStack>\n\t\t\t</>\n\t\t);\n\t},\n\ttoolBarControls: function GridLayoutToolbarControls() {\n\t\treturn null;\n\t},\n\tgetLayoutStyle: function getLayoutStyle( {\n\t\tselector,\n\t\tlayout,\n\t\tstyle,\n\t\tblockName,\n\t\thasBlockGapSupport,\n\t\tlayoutDefinitions = LAYOUT_DEFINITIONS,\n\t} ) {\n\t\tconst {\n\t\t\tminimumColumnWidth = null,\n\t\t\tcolumnCount = null,\n\t\t\trowCount = null,\n\t\t} = layout;\n\n\t\t// Check that the grid layout attributes are of the correct type, so that we don't accidentally\n\t\t// write code that stores a string attribute instead of a number.\n\t\tif ( process.env.NODE_ENV === 'development' ) {\n\t\t\tif (\n\t\t\t\tminimumColumnWidth &&\n\t\t\t\ttypeof minimumColumnWidth !== 'string'\n\t\t\t) {\n\t\t\t\tthrow new Error( 'minimumColumnWidth must be a string' );\n\t\t\t}\n\t\t\tif ( columnCount && typeof columnCount !== 'number' ) {\n\t\t\t\tthrow new Error( 'columnCount must be a number' );\n\t\t\t}\n\t\t\tif ( rowCount && typeof rowCount !== 'number' ) {\n\t\t\t\tthrow new Error( 'rowCount must be a number' );\n\t\t\t}\n\t\t}\n\n\t\t// If a block's block.json skips serialization for spacing or spacing.blockGap,\n\t\t// don't apply the user-defined value to the styles.\n\t\tconst blockGapValue =\n\t\t\tstyle?.spacing?.blockGap &&\n\t\t\t! shouldSkipSerialization( blockName, 'spacing', 'blockGap' )\n\t\t\t\t? getGapCSSValue( style?.spacing?.blockGap, '0.5em' )\n\t\t\t\t: undefined;\n\n\t\tlet output = '';\n\t\tconst rules = [];\n\n\t\tif ( minimumColumnWidth && columnCount > 0 ) {\n\t\t\tconst maxValue = `max(${ minimumColumnWidth }, ( 100% - (${\n\t\t\t\tblockGapValue || '1.2rem'\n\t\t\t}*${ columnCount - 1 }) ) / ${ columnCount })`;\n\t\t\trules.push(\n\t\t\t\t`grid-template-columns: repeat(auto-fill, minmax(${ maxValue }, 1fr))`,\n\t\t\t\t`container-type: inline-size`\n\t\t\t);\n\t\t\tif ( rowCount ) {\n\t\t\t\trules.push(\n\t\t\t\t\t`grid-template-rows: repeat(${ rowCount }, minmax(1rem, auto))`\n\t\t\t\t);\n\t\t\t}\n\t\t} else if ( columnCount ) {\n\t\t\trules.push(\n\t\t\t\t`grid-template-columns: repeat(${ columnCount }, minmax(0, 1fr))`\n\t\t\t);\n\t\t\tif ( rowCount ) {\n\t\t\t\trules.push(\n\t\t\t\t\t`grid-template-rows: repeat(${ rowCount }, minmax(1rem, auto))`\n\t\t\t\t);\n\t\t\t}\n\t\t} else {\n\t\t\trules.push(\n\t\t\t\t`grid-template-columns: repeat(auto-fill, minmax(min(${\n\t\t\t\t\tminimumColumnWidth || '12rem'\n\t\t\t\t}, 100%), 1fr))`,\n\t\t\t\t'container-type: inline-size'\n\t\t\t);\n\t\t}\n\n\t\tif ( rules.length ) {\n\t\t\toutput = `${ appendSelectors( selector ) } { ${ rules.join(\n\t\t\t\t'; '\n\t\t\t) }; }`;\n\t\t}\n\n\t\t// Output blockGap styles based on rules contained in layout definitions in theme.json.\n\t\tif ( hasBlockGapSupport && blockGapValue ) {\n\t\t\toutput += getBlockGapCSS(\n\t\t\t\tselector,\n\t\t\t\tlayoutDefinitions,\n\t\t\t\t'grid',\n\t\t\t\tblockGapValue\n\t\t\t);\n\t\t}\n\t\treturn output;\n\t},\n\tgetOrientation() {\n\t\treturn 'horizontal';\n\t},\n\tgetAlignments() {\n\t\treturn [];\n\t},\n};\n\n// Enables setting minimum width of grid items.\nfunction GridLayoutMinimumWidthControl( { layout, onChange } ) {\n\tconst { minimumColumnWidth, columnCount, isManualPlacement } = layout;\n\tconst defaultValue = isManualPlacement || columnCount ? null : '12rem';\n\tconst value = minimumColumnWidth || defaultValue;\n\tconst [ quantity, unit = 'rem' ] =\n\t\tparseQuantityAndUnitFromRawValue( value );\n\n\tconst handleSliderChange = ( next ) => {\n\t\tonChange( {\n\t\t\t...layout,\n\t\t\tminimumColumnWidth: [ next, unit ].join( '' ),\n\t\t} );\n\t};\n\n\t// Mostly copied from HeightControl.\n\tconst handleUnitChange = ( newUnit ) => {\n\t\t// Attempt to smooth over differences between currentUnit and newUnit.\n\t\t// This should slightly improve the experience of switching between unit types.\n\t\tlet newValue;\n\n\t\tif ( [ 'em', 'rem' ].includes( newUnit ) && unit === 'px' ) {\n\t\t\t// Convert pixel value to an approximate of the new unit, assuming a root size of 16px.\n\t\t\tnewValue = ( quantity / 16 ).toFixed( 2 ) + newUnit;\n\t\t} else if ( [ 'em', 'rem' ].includes( unit ) && newUnit === 'px' ) {\n\t\t\t// Convert to pixel value assuming a root size of 16px.\n\t\t\tnewValue = Math.round( quantity * 16 ) + newUnit;\n\t\t}\n\n\t\tonChange( {\n\t\t\t...layout,\n\t\t\tminimumColumnWidth: newValue,\n\t\t} );\n\t};\n\n\treturn (\n\t\t<fieldset className=\"block-editor-hooks__grid-layout-minimum-width-control\">\n\t\t\t<BaseControl.VisualLabel as=\"legend\">\n\t\t\t\t{ __( 'Min. column width' ) }\n\t\t\t</BaseControl.VisualLabel>\n\t\t\t<Flex gap={ 4 }>\n\t\t\t\t<FlexItem isBlock>\n\t\t\t\t\t<UnitControl\n\t\t\t\t\t\tsize=\"__unstable-large\"\n\t\t\t\t\t\tonChange={ ( newValue ) => {\n\t\t\t\t\t\t\tonChange( {\n\t\t\t\t\t\t\t\t...layout,\n\t\t\t\t\t\t\t\tminimumColumnWidth:\n\t\t\t\t\t\t\t\t\tnewValue === '' ? undefined : newValue,\n\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tonUnitChange={ handleUnitChange }\n\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t\tunits={ units }\n\t\t\t\t\t\tmin={ 0 }\n\t\t\t\t\t\tlabel={ __( 'Minimum column width' ) }\n\t\t\t\t\t\thideLabelFromVision\n\t\t\t\t\t/>\n\t\t\t\t</FlexItem>\n\t\t\t\t<FlexItem isBlock>\n\t\t\t\t\t<RangeControl\n\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\t\t\tonChange={ handleSliderChange }\n\t\t\t\t\t\tvalue={ quantity || 0 }\n\t\t\t\t\t\tmin={ 0 }\n\t\t\t\t\t\tmax={ RANGE_CONTROL_MAX_VALUES[ unit ] || 600 }\n\t\t\t\t\t\twithInputField={ false }\n\t\t\t\t\t\tlabel={ __( 'Minimum column width' ) }\n\t\t\t\t\t\thideLabelFromVision\n\t\t\t\t\t/>\n\t\t\t\t</FlexItem>\n\t\t\t</Flex>\n\t\t\t<p className=\"components-base-control__help\">\n\t\t\t\t{ __(\n\t\t\t\t\t'Columns will wrap to fewer per row when they can no longer maintain the minimum width.'\n\t\t\t\t) }\n\t\t\t</p>\n\t\t</fieldset>\n\t);\n}\n\n// Enables setting number of grid columns\nfunction GridLayoutColumnsAndRowsControl( {\n\tlayout,\n\tonChange,\n\tallowSizingOnChildren,\n} ) {\n\t// Allow unsetting the column count in Auto mode.\n\tconst defaultColumnCount = undefined;\n\tconst {\n\t\tcolumnCount = defaultColumnCount,\n\t\trowCount,\n\t\tisManualPlacement,\n\t} = layout;\n\n\treturn (\n\t\t<>\n\t\t\t<fieldset className=\"block-editor-hooks__grid-layout-columns-and-rows-controls\">\n\t\t\t\t{ ! isManualPlacement && (\n\t\t\t\t\t<BaseControl.VisualLabel as=\"legend\">\n\t\t\t\t\t\t{ __( 'Max. columns' ) }\n\t\t\t\t\t</BaseControl.VisualLabel>\n\t\t\t\t) }\n\t\t\t\t<Flex gap={ 4 }>\n\t\t\t\t\t<FlexItem isBlock>\n\t\t\t\t\t\t<NumberControl\n\t\t\t\t\t\t\tsize=\"__unstable-large\"\n\t\t\t\t\t\t\tonChange={ ( value ) => {\n\t\t\t\t\t\t\t\t// Allow unsetting the column count when in auto mode.\n\t\t\t\t\t\t\t\tconst defaultNewColumnCount = isManualPlacement\n\t\t\t\t\t\t\t\t\t? 1\n\t\t\t\t\t\t\t\t\t: undefined;\n\t\t\t\t\t\t\t\tconst newColumnCount =\n\t\t\t\t\t\t\t\t\tvalue === '' || value === '0'\n\t\t\t\t\t\t\t\t\t\t? defaultNewColumnCount\n\t\t\t\t\t\t\t\t\t\t: parseInt( value, 10 );\n\t\t\t\t\t\t\t\tonChange( {\n\t\t\t\t\t\t\t\t\t...layout,\n\t\t\t\t\t\t\t\t\tcolumnCount: newColumnCount,\n\t\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tvalue={ columnCount }\n\t\t\t\t\t\t\tmin={ 1 }\n\t\t\t\t\t\t\tlabel={ __( 'Columns' ) }\n\t\t\t\t\t\t\thideLabelFromVision={ ! isManualPlacement }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</FlexItem>\n\n\t\t\t\t\t<FlexItem isBlock>\n\t\t\t\t\t\t{ allowSizingOnChildren && isManualPlacement ? (\n\t\t\t\t\t\t\t<NumberControl\n\t\t\t\t\t\t\t\tsize=\"__unstable-large\"\n\t\t\t\t\t\t\t\tonChange={ ( value ) => {\n\t\t\t\t\t\t\t\t\t// Don't allow unsetting the row count.\n\t\t\t\t\t\t\t\t\tconst newRowCount =\n\t\t\t\t\t\t\t\t\t\tvalue === '' || value === '0'\n\t\t\t\t\t\t\t\t\t\t\t? 1\n\t\t\t\t\t\t\t\t\t\t\t: parseInt( value, 10 );\n\t\t\t\t\t\t\t\t\tonChange( {\n\t\t\t\t\t\t\t\t\t\t...layout,\n\t\t\t\t\t\t\t\t\t\trowCount: newRowCount,\n\t\t\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\tvalue={ rowCount }\n\t\t\t\t\t\t\t\tmin={ 1 }\n\t\t\t\t\t\t\t\tlabel={ __( 'Rows' ) }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<RangeControl\n\t\t\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\t\t\t\t\tvalue={ columnCount ?? 1 }\n\t\t\t\t\t\t\t\tonChange={ ( value ) =>\n\t\t\t\t\t\t\t\t\tonChange( {\n\t\t\t\t\t\t\t\t\t\t...layout,\n\t\t\t\t\t\t\t\t\t\tcolumnCount:\n\t\t\t\t\t\t\t\t\t\t\tvalue === '' || value === '0'\n\t\t\t\t\t\t\t\t\t\t\t\t? 1\n\t\t\t\t\t\t\t\t\t\t\t\t: value,\n\t\t\t\t\t\t\t\t\t} )\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tmin={ 1 }\n\t\t\t\t\t\t\t\tmax={ 16 }\n\t\t\t\t\t\t\t\twithInputField={ false }\n\t\t\t\t\t\t\t\tlabel={ __( 'Columns' ) }\n\t\t\t\t\t\t\t\thideLabelFromVision\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t) }\n\t\t\t\t\t</FlexItem>\n\t\t\t\t</Flex>\n\t\t\t</fieldset>\n\t\t</>\n\t);\n}\n\n// Enables switching between grid types\nfunction GridLayoutTypeControl( { layout, onChange } ) {\n\tconst { columnCount, rowCount, minimumColumnWidth, isManualPlacement } =\n\t\tlayout;\n\n\t/**\n\t * When switching, temporarily save any custom values set on the\n\t * previous type so we can switch back without loss.\n\t */\n\tconst [ tempColumnCount, setTempColumnCount ] = useState(\n\t\tcolumnCount || 3\n\t);\n\tconst [ tempRowCount, setTempRowCount ] = useState( rowCount );\n\tconst [ tempMinimumColumnWidth, setTempMinimumColumnWidth ] = useState(\n\t\tminimumColumnWidth || '12rem'\n\t);\n\n\tconst gridPlacement = isManualPlacement ? 'manual' : 'auto';\n\n\tconst onChangeType = ( value ) => {\n\t\tif ( value === 'manual' ) {\n\t\t\tsetTempMinimumColumnWidth( minimumColumnWidth || '12rem' );\n\t\t} else {\n\t\t\tsetTempColumnCount( columnCount || 3 );\n\t\t\tsetTempRowCount( rowCount );\n\t\t}\n\t\tonChange( {\n\t\t\t...layout,\n\t\t\tcolumnCount: value === 'manual' ? tempColumnCount : tempColumnCount,\n\t\t\trowCount: value === 'manual' ? tempRowCount : undefined,\n\t\t\tisManualPlacement: value === 'manual' ? true : undefined,\n\t\t\tminimumColumnWidth:\n\t\t\t\tvalue === 'auto' ? tempMinimumColumnWidth : null,\n\t\t} );\n\t};\n\n\tconst helpText =\n\t\tgridPlacement === 'manual'\n\t\t\t? __(\n\t\t\t\t\t'Grid items can be manually placed in any position on the grid.'\n\t\t\t )\n\t\t\t: __(\n\t\t\t\t\t'Grid items are placed automatically depending on their order.'\n\t\t\t );\n\n\treturn (\n\t\t<ToggleGroupControl\n\t\t\t__next40pxDefaultSize\n\t\t\t__nextHasNoMarginBottom\n\t\t\tlabel={ __( 'Grid item position' ) }\n\t\t\tvalue={ gridPlacement }\n\t\t\tonChange={ onChangeType }\n\t\t\tisBlock\n\t\t\thelp={ helpText }\n\t\t>\n\t\t\t<ToggleGroupControlOption\n\t\t\t\tkey=\"auto\"\n\t\t\t\tvalue=\"auto\"\n\t\t\t\tlabel={ __( 'Auto' ) }\n\t\t\t/>\n\t\t\t<ToggleGroupControlOption\n\t\t\t\tkey=\"manual\"\n\t\t\t\tvalue=\"manual\"\n\t\t\t\tlabel={ __( 'Manual' ) }\n\t\t\t/>\n\t\t</ToggleGroupControl>\n\t);\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,12 +1,6 @@
|
|
|
1
1
|
// packages/block-editor/src/utils/block-bindings.js
|
|
2
|
-
import { useDispatch, useRegistry } from "@wordpress/data";
|
|
3
|
-
import { store as blockEditorStore } from "../store";
|
|
4
|
-
import { useBlockEditContext } from "../components/block-edit";
|
|
5
2
|
var DEFAULT_ATTRIBUTE = "__default";
|
|
6
3
|
var PATTERN_OVERRIDES_SOURCE = "core/pattern-overrides";
|
|
7
|
-
function isObjectEmpty(object) {
|
|
8
|
-
return !object || Object.keys(object).length === 0;
|
|
9
|
-
}
|
|
10
4
|
function hasPatternOverridesDefaultBinding(bindings) {
|
|
11
5
|
return bindings?.[DEFAULT_ATTRIBUTE]?.source === PATTERN_OVERRIDES_SOURCE;
|
|
12
6
|
}
|
|
@@ -21,43 +15,8 @@ function replacePatternOverridesDefaultBinding(bindings, supportedAttributes) {
|
|
|
21
15
|
}
|
|
22
16
|
return bindings;
|
|
23
17
|
}
|
|
24
|
-
function useBlockBindingsUtils(clientId) {
|
|
25
|
-
const { clientId: contextClientId } = useBlockEditContext();
|
|
26
|
-
const blockClientId = clientId || contextClientId;
|
|
27
|
-
const { updateBlockAttributes } = useDispatch(blockEditorStore);
|
|
28
|
-
const { getBlockAttributes } = useRegistry().select(blockEditorStore);
|
|
29
|
-
const updateBlockBindings = (bindings) => {
|
|
30
|
-
const { metadata: { bindings: currentBindings, ...metadata } = {} } = getBlockAttributes(blockClientId);
|
|
31
|
-
const newBindings = { ...currentBindings };
|
|
32
|
-
Object.entries(bindings).forEach(([attribute, binding]) => {
|
|
33
|
-
if (!binding && newBindings[attribute]) {
|
|
34
|
-
delete newBindings[attribute];
|
|
35
|
-
return;
|
|
36
|
-
}
|
|
37
|
-
newBindings[attribute] = binding;
|
|
38
|
-
});
|
|
39
|
-
const newMetadata = {
|
|
40
|
-
...metadata,
|
|
41
|
-
bindings: newBindings
|
|
42
|
-
};
|
|
43
|
-
if (isObjectEmpty(newMetadata.bindings)) {
|
|
44
|
-
delete newMetadata.bindings;
|
|
45
|
-
}
|
|
46
|
-
updateBlockAttributes(blockClientId, {
|
|
47
|
-
metadata: isObjectEmpty(newMetadata) ? void 0 : newMetadata
|
|
48
|
-
});
|
|
49
|
-
};
|
|
50
|
-
const removeAllBlockBindings = () => {
|
|
51
|
-
const { metadata: { bindings, ...metadata } = {} } = getBlockAttributes(blockClientId);
|
|
52
|
-
updateBlockAttributes(blockClientId, {
|
|
53
|
-
metadata: isObjectEmpty(metadata) ? void 0 : metadata
|
|
54
|
-
});
|
|
55
|
-
};
|
|
56
|
-
return { updateBlockBindings, removeAllBlockBindings };
|
|
57
|
-
}
|
|
58
18
|
export {
|
|
59
19
|
hasPatternOverridesDefaultBinding,
|
|
60
|
-
replacePatternOverridesDefaultBinding
|
|
61
|
-
useBlockBindingsUtils
|
|
20
|
+
replacePatternOverridesDefaultBinding
|
|
62
21
|
};
|
|
63
22
|
//# sourceMappingURL=block-bindings.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/utils/block-bindings.js"],
|
|
4
|
-
"sourcesContent": ["
|
|
5
|
-
"mappings": ";
|
|
4
|
+
"sourcesContent": ["const DEFAULT_ATTRIBUTE = '__default';\nconst PATTERN_OVERRIDES_SOURCE = 'core/pattern-overrides';\n\n/**\n * Checks if the block has the `__default` binding for pattern overrides.\n *\n * @param {?Record<string, object>} bindings A block's bindings from the metadata attribute.\n *\n * @return {boolean} Whether the block has the `__default` binding for pattern overrides.\n */\nexport function hasPatternOverridesDefaultBinding( bindings ) {\n\treturn bindings?.[ DEFAULT_ATTRIBUTE ]?.source === PATTERN_OVERRIDES_SOURCE;\n}\n\n/**\n * Returns the bindings with the `__default` binding for pattern overrides\n * replaced with the full-set of supported attributes. e.g.:\n *\n * - bindings passed in: `{ __default: { source: 'core/pattern-overrides' } }`\n * - bindings returned: `{ content: { source: 'core/pattern-overrides' } }`\n *\n * @param {?Record<string, object>} bindings A block's bindings from the metadata attribute.\n * @param {string[]} supportedAttributes The block's attributes which are supported by block bindings.\n *\n * @return {Object} The bindings with default replaced for pattern overrides.\n */\nexport function replacePatternOverridesDefaultBinding(\n\tbindings,\n\tsupportedAttributes\n) {\n\t// The `__default` binding currently only works for pattern overrides.\n\tif ( hasPatternOverridesDefaultBinding( bindings ) ) {\n\t\tconst bindingsWithDefaults = {};\n\t\tfor ( const attributeName of supportedAttributes ) {\n\t\t\t// If the block has mixed binding sources, retain any non pattern override bindings.\n\t\t\tconst bindingSource = bindings[ attributeName ]\n\t\t\t\t? bindings[ attributeName ]\n\t\t\t\t: { source: PATTERN_OVERRIDES_SOURCE };\n\t\t\tbindingsWithDefaults[ attributeName ] = bindingSource;\n\t\t}\n\n\t\treturn bindingsWithDefaults;\n\t}\n\n\treturn bindings;\n}\n"],
|
|
5
|
+
"mappings": ";AAAA,IAAM,oBAAoB;AAC1B,IAAM,2BAA2B;AAS1B,SAAS,kCAAmC,UAAW;AAC7D,SAAO,WAAY,iBAAkB,GAAG,WAAW;AACpD;AAcO,SAAS,sCACf,UACA,qBACC;AAED,MAAK,kCAAmC,QAAS,GAAI;AACpD,UAAM,uBAAuB,CAAC;AAC9B,eAAY,iBAAiB,qBAAsB;AAElD,YAAM,gBAAgB,SAAU,aAAc,IAC3C,SAAU,aAAc,IACxB,EAAE,QAAQ,yBAAyB;AACtC,2BAAsB,aAAc,IAAI;AAAA,IACzC;AAEA,WAAO;AAAA,EACR;AAEA,SAAO;AACR;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,10 +1,8 @@
|
|
|
1
1
|
// packages/block-editor/src/utils/index.js
|
|
2
2
|
import { default as default2 } from "./transform-styles";
|
|
3
3
|
import { default as default3 } from "./get-px-from-css-unit";
|
|
4
|
-
import { useBlockBindingsUtils } from "./block-bindings";
|
|
5
4
|
export {
|
|
6
5
|
default3 as getPxFromCssUnit,
|
|
7
|
-
default2 as transformStyles
|
|
8
|
-
useBlockBindingsUtils
|
|
6
|
+
default2 as transformStyles
|
|
9
7
|
};
|
|
10
8
|
//# sourceMappingURL=index.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/utils/index.js"],
|
|
4
|
-
"sourcesContent": ["export { default as transformStyles } from './transform-styles';\nexport { default as getPxFromCssUnit } from './get-px-from-css-unit';\
|
|
5
|
-
"mappings": ";AAAA,SAAoB,WAAXA,gBAAkC;AAC3C,SAAoB,WAAXA,gBAAmC;
|
|
4
|
+
"sourcesContent": ["export { default as transformStyles } from './transform-styles';\nexport { default as getPxFromCssUnit } from './get-px-from-css-unit';\n"],
|
|
5
|
+
"mappings": ";AAAA,SAAoB,WAAXA,gBAAkC;AAC3C,SAAoB,WAAXA,gBAAmC;",
|
|
6
6
|
"names": ["default"]
|
|
7
7
|
}
|
|
@@ -3782,15 +3782,15 @@ div.block-editor-bindings__panel button:hover .block-editor-bindings__item span
|
|
|
3782
3782
|
content: attr(aria-label);
|
|
3783
3783
|
font-size: 12px;
|
|
3784
3784
|
}
|
|
3785
|
-
.show-icon-labels .
|
|
3786
|
-
padding-right: 6px;
|
|
3787
|
-
padding-left: 6px;
|
|
3788
|
-
}
|
|
3789
|
-
.show-icon-labels .block-editor-block-icon {
|
|
3785
|
+
.show-icon-labels .block-editor-block-toolbar .block-editor-block-icon {
|
|
3790
3786
|
width: 0 !important;
|
|
3791
3787
|
height: 0 !important;
|
|
3792
3788
|
min-width: 0 !important;
|
|
3793
3789
|
}
|
|
3790
|
+
.show-icon-labels .components-accessible-toolbar .components-toolbar-group > div:first-child:last-child > .components-button.has-icon {
|
|
3791
|
+
padding-right: 6px;
|
|
3792
|
+
padding-left: 6px;
|
|
3793
|
+
}
|
|
3794
3794
|
.show-icon-labels .block-editor-block-parent-selector .block-editor-block-parent-selector__button {
|
|
3795
3795
|
border-top-left-radius: 0;
|
|
3796
3796
|
border-bottom-left-radius: 0;
|
|
@@ -4219,7 +4219,7 @@ div.block-editor-bindings__panel button:hover .block-editor-bindings__item span
|
|
|
4219
4219
|
right: 0;
|
|
4220
4220
|
bottom: 0;
|
|
4221
4221
|
width: 280px;
|
|
4222
|
-
padding: 24px
|
|
4222
|
+
padding: 24px 24px 24px;
|
|
4223
4223
|
overflow-x: visible;
|
|
4224
4224
|
overflow-y: auto;
|
|
4225
4225
|
}
|
package/build-style/style.css
CHANGED
|
@@ -3784,15 +3784,15 @@ div.block-editor-bindings__panel button:hover .block-editor-bindings__item span
|
|
|
3784
3784
|
content: attr(aria-label);
|
|
3785
3785
|
font-size: 12px;
|
|
3786
3786
|
}
|
|
3787
|
-
.show-icon-labels .
|
|
3788
|
-
padding-left: 6px;
|
|
3789
|
-
padding-right: 6px;
|
|
3790
|
-
}
|
|
3791
|
-
.show-icon-labels .block-editor-block-icon {
|
|
3787
|
+
.show-icon-labels .block-editor-block-toolbar .block-editor-block-icon {
|
|
3792
3788
|
width: 0 !important;
|
|
3793
3789
|
height: 0 !important;
|
|
3794
3790
|
min-width: 0 !important;
|
|
3795
3791
|
}
|
|
3792
|
+
.show-icon-labels .components-accessible-toolbar .components-toolbar-group > div:first-child:last-child > .components-button.has-icon {
|
|
3793
|
+
padding-left: 6px;
|
|
3794
|
+
padding-right: 6px;
|
|
3795
|
+
}
|
|
3796
3796
|
.show-icon-labels .block-editor-block-parent-selector .block-editor-block-parent-selector__button {
|
|
3797
3797
|
border-top-right-radius: 0;
|
|
3798
3798
|
border-bottom-right-radius: 0;
|
|
@@ -4221,7 +4221,7 @@ div.block-editor-bindings__panel button:hover .block-editor-bindings__item span
|
|
|
4221
4221
|
left: 0;
|
|
4222
4222
|
bottom: 0;
|
|
4223
4223
|
width: 280px;
|
|
4224
|
-
padding: 24px
|
|
4224
|
+
padding: 24px 24px 24px;
|
|
4225
4225
|
overflow-x: visible;
|
|
4226
4226
|
overflow-y: auto;
|
|
4227
4227
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@wordpress/block-editor",
|
|
3
|
-
"version": "15.9.0",
|
|
3
|
+
"version": "15.9.1-next.6deb34194.0",
|
|
4
4
|
"description": "Generic block editor.",
|
|
5
5
|
"author": "The WordPress Contributors",
|
|
6
6
|
"license": "GPL-2.0-or-later",
|
|
@@ -52,45 +52,44 @@
|
|
|
52
52
|
"build-module/hooks/**"
|
|
53
53
|
],
|
|
54
54
|
"dependencies": {
|
|
55
|
-
"@emotion/react": "^11.7.1",
|
|
56
|
-
"@emotion/styled": "^11.6.0",
|
|
57
55
|
"@react-spring/web": "^9.4.5",
|
|
58
|
-
"@wordpress/a11y": "^4.36.0",
|
|
59
|
-
"@wordpress/api-fetch": "^7.36.0",
|
|
60
|
-
"@wordpress/base-styles": "^6.12.0",
|
|
61
|
-
"@wordpress/blob": "^4.36.0",
|
|
62
|
-
"@wordpress/block-serialization-default-parser": "^5.36.0",
|
|
63
|
-
"@wordpress/blocks": "^15.9.0",
|
|
64
|
-
"@wordpress/commands": "^1.36.0",
|
|
65
|
-
"@wordpress/components": "^
|
|
66
|
-
"@wordpress/compose": "^7.36.0",
|
|
67
|
-
"@wordpress/data": "^10.36.0",
|
|
68
|
-
"@wordpress/dataviews": "^11.
|
|
69
|
-
"@wordpress/date": "^5.36.0",
|
|
70
|
-
"@wordpress/deprecated": "^4.36.0",
|
|
71
|
-
"@wordpress/dom": "^4.36.0",
|
|
72
|
-
"@wordpress/element": "^6.36.0",
|
|
73
|
-
"@wordpress/escape-html": "^3.36.0",
|
|
74
|
-
"@wordpress/global-styles-engine": "^1.3.0",
|
|
75
|
-
"@wordpress/hooks": "^4.36.0",
|
|
76
|
-
"@wordpress/html-entities": "^4.36.0",
|
|
77
|
-
"@wordpress/i18n": "^6.9.0",
|
|
78
|
-
"@wordpress/icons": "^11.3.0",
|
|
79
|
-
"@wordpress/
|
|
80
|
-
"@wordpress/
|
|
81
|
-
"@wordpress/
|
|
82
|
-
"@wordpress/
|
|
83
|
-
"@wordpress/
|
|
84
|
-
"@wordpress/
|
|
85
|
-
"@wordpress/
|
|
86
|
-
"@wordpress/
|
|
87
|
-
"@wordpress/
|
|
88
|
-
"@wordpress/
|
|
89
|
-
"@wordpress/
|
|
90
|
-
"@wordpress/
|
|
91
|
-
"@wordpress/
|
|
92
|
-
"@wordpress/
|
|
93
|
-
"@wordpress/
|
|
56
|
+
"@wordpress/a11y": "^4.36.1-next.6deb34194.0",
|
|
57
|
+
"@wordpress/api-fetch": "^7.36.1-next.6deb34194.0",
|
|
58
|
+
"@wordpress/base-styles": "^6.12.1-next.6deb34194.0",
|
|
59
|
+
"@wordpress/blob": "^4.36.1-next.6deb34194.0",
|
|
60
|
+
"@wordpress/block-serialization-default-parser": "^5.36.1-next.6deb34194.0",
|
|
61
|
+
"@wordpress/blocks": "^15.9.1-next.6deb34194.0",
|
|
62
|
+
"@wordpress/commands": "^1.36.1-next.6deb34194.0",
|
|
63
|
+
"@wordpress/components": "^31.0.1-next.6deb34194.0",
|
|
64
|
+
"@wordpress/compose": "^7.36.1-next.6deb34194.0",
|
|
65
|
+
"@wordpress/data": "^10.36.1-next.6deb34194.0",
|
|
66
|
+
"@wordpress/dataviews": "^11.1.1-next.6deb34194.0",
|
|
67
|
+
"@wordpress/date": "^5.36.1-next.6deb34194.0",
|
|
68
|
+
"@wordpress/deprecated": "^4.36.1-next.6deb34194.0",
|
|
69
|
+
"@wordpress/dom": "^4.36.1-next.6deb34194.0",
|
|
70
|
+
"@wordpress/element": "^6.36.1-next.6deb34194.0",
|
|
71
|
+
"@wordpress/escape-html": "^3.36.1-next.6deb34194.0",
|
|
72
|
+
"@wordpress/global-styles-engine": "^1.3.1-next.6deb34194.0",
|
|
73
|
+
"@wordpress/hooks": "^4.36.1-next.6deb34194.0",
|
|
74
|
+
"@wordpress/html-entities": "^4.36.1-next.6deb34194.0",
|
|
75
|
+
"@wordpress/i18n": "^6.9.1-next.6deb34194.0",
|
|
76
|
+
"@wordpress/icons": "^11.3.1-next.6deb34194.0",
|
|
77
|
+
"@wordpress/image-cropper": "^1.0.1-next.6deb34194.0",
|
|
78
|
+
"@wordpress/interactivity": "^6.36.1-next.6deb34194.0",
|
|
79
|
+
"@wordpress/is-shallow-equal": "^5.36.1-next.6deb34194.0",
|
|
80
|
+
"@wordpress/keyboard-shortcuts": "^5.36.1-next.6deb34194.0",
|
|
81
|
+
"@wordpress/keycodes": "^4.36.1-next.6deb34194.0",
|
|
82
|
+
"@wordpress/notices": "^5.36.1-next.6deb34194.0",
|
|
83
|
+
"@wordpress/preferences": "^4.36.1-next.6deb34194.0",
|
|
84
|
+
"@wordpress/priority-queue": "^3.36.1-next.6deb34194.0",
|
|
85
|
+
"@wordpress/private-apis": "^1.36.1-next.6deb34194.0",
|
|
86
|
+
"@wordpress/rich-text": "^7.36.1-next.6deb34194.0",
|
|
87
|
+
"@wordpress/style-engine": "^2.36.1-next.6deb34194.0",
|
|
88
|
+
"@wordpress/token-list": "^3.36.1-next.6deb34194.0",
|
|
89
|
+
"@wordpress/upload-media": "^0.21.1-next.6deb34194.0",
|
|
90
|
+
"@wordpress/url": "^4.36.1-next.6deb34194.0",
|
|
91
|
+
"@wordpress/warning": "^3.36.1-next.6deb34194.0",
|
|
92
|
+
"@wordpress/wordcount": "^4.36.1-next.6deb34194.0",
|
|
94
93
|
"change-case": "^4.1.2",
|
|
95
94
|
"clsx": "^2.1.1",
|
|
96
95
|
"colord": "^2.7.0",
|
|
@@ -113,5 +112,5 @@
|
|
|
113
112
|
"publishConfig": {
|
|
114
113
|
"access": "public"
|
|
115
114
|
},
|
|
116
|
-
"gitHead": "
|
|
115
|
+
"gitHead": "457096e9e9b3896d2d4fe54fc19d7fb571ee9a44"
|
|
117
116
|
}
|
|
@@ -77,11 +77,7 @@ function BlockAlignmentMatrixControl( props ) {
|
|
|
77
77
|
);
|
|
78
78
|
} }
|
|
79
79
|
renderContent={ () => (
|
|
80
|
-
<AlignmentMatrixControl
|
|
81
|
-
hasFocusBorder={ false }
|
|
82
|
-
onChange={ onChange }
|
|
83
|
-
value={ value }
|
|
84
|
-
/>
|
|
80
|
+
<AlignmentMatrixControl onChange={ onChange } value={ value } />
|
|
85
81
|
) }
|
|
86
82
|
/>
|
|
87
83
|
);
|