@wordpress/block-editor 15.5.0 → 15.5.1-next.47f435fc9.0

package/build/components/grid/grid-visualizer.js.map

@@ -1 +1,7 @@
-{"version":3,"names":["_clsx","_interopRequireDefault","require","_element","_data","_compose","_useBlockRefs","_cover","_utils","_store","_useGetNumberOfBlocksBeforeCell","_buttonBlockAppender","_lockUnlock","_jsxRuntime","GridVisualizer","clientId","contentRef","parentLayout","isDistractionFree","useSelect","select","blockEditorStore","getSettings","gridElement","useBlockElement","isManualGrid","isManualPlacement","window","__experimentalEnableGridInteractivity","jsx","GridVisualizerGrid","gridClientId","ref","forwardRef","gridInfo","setGridInfo","useState","getGridInfo","isDroppingAllowed","setIsDroppingAllowed","useEffect","resizeCallback","borderBoxSpy","ResizeObserver","observe","box","contentBoxSpy","disconnect","onGlobalDrag","onGlobalDragEnd","document","addEventListener","removeEventListener","default","className","clsx","__unstablePopoverSlot","children","style","ManualGridVisualizer","Array","from","length","numItems","_","i","GridVisualizerCell","color","currentColor","highlightedRect","setHighlightedRect","gridItemStyles","getBlockOrder","getBlockStyles","unlock","blockOrder","occupiedRects","useMemo","rects","Object","values","_style$layout","columnStart","rowStart","columnSpan","rowSpan","layout","push","GridRect","range","numRows","map","row","numColumns","column","_highlightedRect$cont","isCellOccupied","some","rect","contains","isHighlighted","GridVisualizerDropZone","GridVisualizerAppender","boxShadow","useGridVisualizerDropZone","getBlockAttributes","getBlockRootClientId","canInsertBlockType","getBlockName","updateBlockAttributes","moveBlocksToPosition","__unstableMarkNextChangeAsNotPersistent","useDispatch","getNumberOfBlocksBeforeCell","useGetNumberOfBlocksBeforeCell","useDropZoneWithValidation","validateDrag","srcClientId","blockName","attributes","isInBounds","containsRect","onDragEnter","onDragLeave","prevHighlightedRect","onDrop","rootClientId","onSelect","block","getDraggedBlockClientIds","useDropZone"],"sources":["@wordpress/block-editor/src/components/grid/grid-visualizer.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { useState, useEffect, forwardRef, useMemo } from '@wordpress/element';\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport { __experimentalUseDropZone as useDropZone } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport { useBlockElement } from '../block-list/use-block-props/use-block-refs';\nimport BlockPopoverCover from '../block-popover/cover';\nimport { range, GridRect, getGridInfo } from './utils';\nimport { store as blockEditorStore } from '../../store';\nimport { useGetNumberOfBlocksBeforeCell } from './use-get-number-of-blocks-before-cell';\nimport ButtonBlockAppender from '../button-block-appender';\nimport { unlock } from '../../lock-unlock';\n\nexport function GridVisualizer( { clientId, contentRef, parentLayout } ) {\n\tconst isDistractionFree = useSelect(\n\t\t( select ) =>\n\t\t\tselect( blockEditorStore ).getSettings().isDistractionFree,\n\t\t[]\n\t);\n\tconst gridElement = useBlockElement( clientId );\n\n\tif ( isDistractionFree || ! gridElement ) {\n\t\treturn null;\n\t}\n\n\tconst isManualGrid =\n\t\tparentLayout?.isManualPlacement &&\n\t\twindow.__experimentalEnableGridInteractivity;\n\treturn (\n\t\t<GridVisualizerGrid\n\t\t\tgridClientId={ clientId }\n\t\t\tgridElement={ gridElement }\n\t\t\tisManualGrid={ isManualGrid }\n\t\t\tref={ contentRef }\n\t\t/>\n\t);\n}\n\nconst GridVisualizerGrid = forwardRef(\n\t( { gridClientId, gridElement, isManualGrid }, ref ) => {\n\t\tconst [ gridInfo, setGridInfo ] = useState( () =>\n\t\t\tgetGridInfo( gridElement )\n\t\t);\n\t\tconst [ isDroppingAllowed, setIsDroppingAllowed ] = useState( false );\n\n\t\tuseEffect( () => {\n\t\t\tconst resizeCallback = () =>\n\t\t\t\tsetGridInfo( getGridInfo( gridElement ) );\n\t\t\t// Both border-box and content-box are observed as they may change\n\t\t\t// independently. This requires two observers because a single one\n\t\t\t// can’t be made to monitor both on the same element.\n\t\t\tconst borderBoxSpy = new window.ResizeObserver( resizeCallback );\n\t\t\tborderBoxSpy.observe( gridElement, { box: 'border-box' } );\n\t\t\tconst contentBoxSpy = new window.ResizeObserver( resizeCallback );\n\t\t\tcontentBoxSpy.observe( gridElement );\n\t\t\treturn () => {\n\t\t\t\tborderBoxSpy.disconnect();\n\t\t\t\tcontentBoxSpy.disconnect();\n\t\t\t};\n\t\t}, [ gridElement ] );\n\n\t\tuseEffect( () => {\n\t\t\tfunction onGlobalDrag() {\n\t\t\t\tsetIsDroppingAllowed( true );\n\t\t\t}\n\t\t\tfunction onGlobalDragEnd() {\n\t\t\t\tsetIsDroppingAllowed( false );\n\t\t\t}\n\t\t\tdocument.addEventListener( 'drag', onGlobalDrag );\n\t\t\tdocument.addEventListener( 'dragend', onGlobalDragEnd );\n\t\t\treturn () => {\n\t\t\t\tdocument.removeEventListener( 'drag', onGlobalDrag );\n\t\t\t\tdocument.removeEventListener( 'dragend', onGlobalDragEnd );\n\t\t\t};\n\t\t}, [] );\n\n\t\treturn (\n\t\t\t<BlockPopoverCover\n\t\t\t\tclassName={ clsx( 'block-editor-grid-visualizer', {\n\t\t\t\t\t'is-dropping-allowed': isDroppingAllowed,\n\t\t\t\t} ) }\n\t\t\t\tclientId={ gridClientId }\n\t\t\t\t__unstablePopoverSlot=\"__unstable-block-tools-after\"\n\t\t\t>\n\t\t\t\t<div\n\t\t\t\t\tref={ ref }\n\t\t\t\t\tclassName=\"block-editor-grid-visualizer__grid\"\n\t\t\t\t\tstyle={ gridInfo.style }\n\t\t\t\t>\n\t\t\t\t\t{ isManualGrid ? (\n\t\t\t\t\t\t<ManualGridVisualizer\n\t\t\t\t\t\t\tgridClientId={ gridClientId }\n\t\t\t\t\t\t\tgridInfo={ gridInfo }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) : (\n\t\t\t\t\t\tArray.from( { length: gridInfo.numItems }, ( _, i ) => (\n\t\t\t\t\t\t\t<GridVisualizerCell\n\t\t\t\t\t\t\t\tkey={ i }\n\t\t\t\t\t\t\t\tcolor={ gridInfo.currentColor }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t) )\n\t\t\t\t\t) }\n\t\t\t\t</div>\n\t\t\t</BlockPopoverCover>\n\t\t);\n\t}\n);\n\nfunction ManualGridVisualizer( { gridClientId, gridInfo } ) {\n\tconst [ highlightedRect, setHighlightedRect ] = useState( null );\n\n\tconst gridItemStyles = useSelect(\n\t\t( select ) => {\n\t\t\tconst { getBlockOrder, getBlockStyles } = unlock(\n\t\t\t\tselect( blockEditorStore )\n\t\t\t);\n\t\t\tconst blockOrder = getBlockOrder( gridClientId );\n\t\t\treturn getBlockStyles( blockOrder );\n\t\t},\n\t\t[ gridClientId ]\n\t);\n\tconst occupiedRects = useMemo( () => {\n\t\tconst rects = [];\n\t\tfor ( const style of Object.values( gridItemStyles ) ) {\n\t\t\tconst {\n\t\t\t\tcolumnStart,\n\t\t\t\trowStart,\n\t\t\t\tcolumnSpan = 1,\n\t\t\t\trowSpan = 1,\n\t\t\t} = style?.layout ?? {};\n\t\t\tif ( ! columnStart || ! rowStart ) {\n\t\t\t\tcontinue;\n\t\t\t}\n\t\t\trects.push(\n\t\t\t\tnew GridRect( {\n\t\t\t\t\tcolumnStart,\n\t\t\t\t\trowStart,\n\t\t\t\t\tcolumnSpan,\n\t\t\t\t\trowSpan,\n\t\t\t\t} )\n\t\t\t);\n\t\t}\n\t\treturn rects;\n\t}, [ gridItemStyles ] );\n\n\treturn range( 1, gridInfo.numRows ).map( ( row ) =>\n\t\trange( 1, gridInfo.numColumns ).map( ( column ) => {\n\t\t\tconst isCellOccupied = occupiedRects.some( ( rect ) =>\n\t\t\t\trect.contains( column, row )\n\t\t\t);\n\t\t\tconst isHighlighted =\n\t\t\t\thighlightedRect?.contains( column, row ) ?? false;\n\t\t\treturn (\n\t\t\t\t<GridVisualizerCell\n\t\t\t\t\tkey={ `${ row }-${ column }` }\n\t\t\t\t\tcolor={ gridInfo.currentColor }\n\t\t\t\t\tclassName={ isHighlighted && 'is-highlighted' }\n\t\t\t\t>\n\t\t\t\t\t{ isCellOccupied ? (\n\t\t\t\t\t\t<GridVisualizerDropZone\n\t\t\t\t\t\t\tcolumn={ column }\n\t\t\t\t\t\t\trow={ row }\n\t\t\t\t\t\t\tgridClientId={ gridClientId }\n\t\t\t\t\t\t\tgridInfo={ gridInfo }\n\t\t\t\t\t\t\tsetHighlightedRect={ setHighlightedRect }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<GridVisualizerAppender\n\t\t\t\t\t\t\tcolumn={ column }\n\t\t\t\t\t\t\trow={ row }\n\t\t\t\t\t\t\tgridClientId={ gridClientId }\n\t\t\t\t\t\t\tgridInfo={ gridInfo }\n\t\t\t\t\t\t\tsetHighlightedRect={ setHighlightedRect }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t</GridVisualizerCell>\n\t\t\t);\n\t\t} )\n\t);\n}\n\nfunction GridVisualizerCell( { color, children, className } ) {\n\treturn (\n\t\t<div\n\t\t\tclassName={ clsx(\n\t\t\t\t'block-editor-grid-visualizer__cell',\n\t\t\t\tclassName\n\t\t\t) }\n\t\t\tstyle={ {\n\t\t\t\tboxShadow: `inset 0 0 0 1px color-mix(in srgb, ${ color } 20%, #0000)`,\n\t\t\t\tcolor,\n\t\t\t} }\n\t\t>\n\t\t\t{ children }\n\t\t</div>\n\t);\n}\n\nfunction useGridVisualizerDropZone(\n\tcolumn,\n\trow,\n\tgridClientId,\n\tgridInfo,\n\tsetHighlightedRect\n) {\n\tconst {\n\t\tgetBlockAttributes,\n\t\tgetBlockRootClientId,\n\t\tcanInsertBlockType,\n\t\tgetBlockName,\n\t} = useSelect( blockEditorStore );\n\tconst {\n\t\tupdateBlockAttributes,\n\t\tmoveBlocksToPosition,\n\t\t__unstableMarkNextChangeAsNotPersistent,\n\t} = useDispatch( blockEditorStore );\n\n\tconst getNumberOfBlocksBeforeCell = useGetNumberOfBlocksBeforeCell(\n\t\tgridClientId,\n\t\tgridInfo.numColumns\n\t);\n\n\treturn useDropZoneWithValidation( {\n\t\tvalidateDrag( srcClientId ) {\n\t\t\tconst blockName = getBlockName( srcClientId );\n\t\t\tif ( ! canInsertBlockType( blockName, gridClientId ) ) {\n\t\t\t\treturn false;\n\t\t\t}\n\t\t\tconst attributes = getBlockAttributes( srcClientId );\n\t\t\tconst rect = new GridRect( {\n\t\t\t\tcolumnStart: column,\n\t\t\t\trowStart: row,\n\t\t\t\tcolumnSpan: attributes.style?.layout?.columnSpan,\n\t\t\t\trowSpan: attributes.style?.layout?.rowSpan,\n\t\t\t} );\n\t\t\tconst isInBounds = new GridRect( {\n\t\t\t\tcolumnSpan: gridInfo.numColumns,\n\t\t\t\trowSpan: gridInfo.numRows,\n\t\t\t} ).containsRect( rect );\n\t\t\treturn isInBounds;\n\t\t},\n\t\tonDragEnter( srcClientId ) {\n\t\t\tconst attributes = getBlockAttributes( srcClientId );\n\t\t\tsetHighlightedRect(\n\t\t\t\tnew GridRect( {\n\t\t\t\t\tcolumnStart: column,\n\t\t\t\t\trowStart: row,\n\t\t\t\t\tcolumnSpan: attributes.style?.layout?.columnSpan,\n\t\t\t\t\trowSpan: attributes.style?.layout?.rowSpan,\n\t\t\t\t} )\n\t\t\t);\n\t\t},\n\t\tonDragLeave() {\n\t\t\t// onDragEnter can be called before onDragLeave if the user moves\n\t\t\t// their mouse quickly, so only clear the highlight if it was set\n\t\t\t// by this cell.\n\t\t\tsetHighlightedRect( ( prevHighlightedRect ) =>\n\t\t\t\tprevHighlightedRect?.columnStart === column &&\n\t\t\t\tprevHighlightedRect?.rowStart === row\n\t\t\t\t\t? null\n\t\t\t\t\t: prevHighlightedRect\n\t\t\t);\n\t\t},\n\t\tonDrop( srcClientId ) {\n\t\t\tsetHighlightedRect( null );\n\t\t\tconst attributes = getBlockAttributes( srcClientId );\n\t\t\tupdateBlockAttributes( srcClientId, {\n\t\t\t\tstyle: {\n\t\t\t\t\t...attributes.style,\n\t\t\t\t\tlayout: {\n\t\t\t\t\t\t...attributes.style?.layout,\n\t\t\t\t\t\tcolumnStart: column,\n\t\t\t\t\t\trowStart: row,\n\t\t\t\t\t},\n\t\t\t\t},\n\t\t\t} );\n\t\t\t__unstableMarkNextChangeAsNotPersistent();\n\t\t\tmoveBlocksToPosition(\n\t\t\t\t[ srcClientId ],\n\t\t\t\tgetBlockRootClientId( srcClientId ),\n\t\t\t\tgridClientId,\n\t\t\t\tgetNumberOfBlocksBeforeCell( column, row )\n\t\t\t);\n\t\t},\n\t} );\n}\n\nfunction GridVisualizerDropZone( {\n\tcolumn,\n\trow,\n\tgridClientId,\n\tgridInfo,\n\tsetHighlightedRect,\n} ) {\n\treturn (\n\t\t<div\n\t\t\tclassName=\"block-editor-grid-visualizer__drop-zone\"\n\t\t\tref={ useGridVisualizerDropZone(\n\t\t\t\tcolumn,\n\t\t\t\trow,\n\t\t\t\tgridClientId,\n\t\t\t\tgridInfo,\n\t\t\t\tsetHighlightedRect\n\t\t\t) }\n\t\t/>\n\t);\n}\n\nfunction GridVisualizerAppender( {\n\tcolumn,\n\trow,\n\tgridClientId,\n\tgridInfo,\n\tsetHighlightedRect,\n} ) {\n\tconst {\n\t\tupdateBlockAttributes,\n\t\tmoveBlocksToPosition,\n\t\t__unstableMarkNextChangeAsNotPersistent,\n\t} = useDispatch( blockEditorStore );\n\n\tconst getNumberOfBlocksBeforeCell = useGetNumberOfBlocksBeforeCell(\n\t\tgridClientId,\n\t\tgridInfo.numColumns\n\t);\n\n\treturn (\n\t\t<ButtonBlockAppender\n\t\t\trootClientId={ gridClientId }\n\t\t\tclassName=\"block-editor-grid-visualizer__appender\"\n\t\t\tref={ useGridVisualizerDropZone(\n\t\t\t\tcolumn,\n\t\t\t\trow,\n\t\t\t\tgridClientId,\n\t\t\t\tgridInfo,\n\t\t\t\tsetHighlightedRect\n\t\t\t) }\n\t\t\tstyle={ {\n\t\t\t\tcolor: gridInfo.currentColor,\n\t\t\t} }\n\t\t\tonSelect={ ( block ) => {\n\t\t\t\tif ( ! block ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t\tupdateBlockAttributes( block.clientId, {\n\t\t\t\t\tstyle: {\n\t\t\t\t\t\tlayout: {\n\t\t\t\t\t\t\tcolumnStart: column,\n\t\t\t\t\t\t\trowStart: row,\n\t\t\t\t\t\t},\n\t\t\t\t\t},\n\t\t\t\t} );\n\t\t\t\t__unstableMarkNextChangeAsNotPersistent();\n\t\t\t\tmoveBlocksToPosition(\n\t\t\t\t\t[ block.clientId ],\n\t\t\t\t\tgridClientId,\n\t\t\t\t\tgridClientId,\n\t\t\t\t\tgetNumberOfBlocksBeforeCell( column, row )\n\t\t\t\t);\n\t\t\t} }\n\t\t/>\n\t);\n}\n\nfunction useDropZoneWithValidation( {\n\tvalidateDrag,\n\tonDragEnter,\n\tonDragLeave,\n\tonDrop,\n} ) {\n\tconst { getDraggedBlockClientIds } = useSelect( blockEditorStore );\n\treturn useDropZone( {\n\t\tonDragEnter() {\n\t\t\tconst [ srcClientId ] = getDraggedBlockClientIds();\n\t\t\tif ( srcClientId && validateDrag( srcClientId ) ) {\n\t\t\t\tonDragEnter( srcClientId );\n\t\t\t}\n\t\t},\n\t\tonDragLeave() {\n\t\t\tonDragLeave();\n\t\t},\n\t\tonDrop() {\n\t\t\tconst [ srcClientId ] = getDraggedBlockClientIds();\n\t\t\tif ( srcClientId && validateDrag( srcClientId ) ) {\n\t\t\t\tonDrop( srcClientId );\n\t\t\t}\n\t\t},\n\t} );\n}\n"],"mappings":"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","ignoreList":[]}
+{
+  "version": 3,
+  "sources": ["../../../src/components/grid/grid-visualizer.js"],
+  "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { useState, useEffect, forwardRef, useMemo } from '@wordpress/element';\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport { __experimentalUseDropZone as useDropZone } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport { useBlockElement } from '../block-list/use-block-props/use-block-refs';\nimport BlockPopoverCover from '../block-popover/cover';\nimport { range, GridRect, getGridInfo } from './utils';\nimport { store as blockEditorStore } from '../../store';\nimport { useGetNumberOfBlocksBeforeCell } from './use-get-number-of-blocks-before-cell';\nimport ButtonBlockAppender from '../button-block-appender';\nimport { unlock } from '../../lock-unlock';\n\nexport function GridVisualizer( { clientId, contentRef, parentLayout } ) {\n\tconst isDistractionFree = useSelect(\n\t\t( select ) =>\n\t\t\tselect( blockEditorStore ).getSettings().isDistractionFree,\n\t\t[]\n\t);\n\tconst gridElement = useBlockElement( clientId );\n\n\tif ( isDistractionFree || ! gridElement ) {\n\t\treturn null;\n\t}\n\n\tconst isManualGrid =\n\t\tparentLayout?.isManualPlacement &&\n\t\twindow.__experimentalEnableGridInteractivity;\n\treturn (\n\t\t<GridVisualizerGrid\n\t\t\tgridClientId={ clientId }\n\t\t\tgridElement={ gridElement }\n\t\t\tisManualGrid={ isManualGrid }\n\t\t\tref={ contentRef }\n\t\t/>\n\t);\n}\n\nconst GridVisualizerGrid = forwardRef(\n\t( { gridClientId, gridElement, isManualGrid }, ref ) => {\n\t\tconst [ gridInfo, setGridInfo ] = useState( () =>\n\t\t\tgetGridInfo( gridElement )\n\t\t);\n\t\tconst [ isDroppingAllowed, setIsDroppingAllowed ] = useState( false );\n\n\t\tuseEffect( () => {\n\t\t\tconst resizeCallback = () =>\n\t\t\t\tsetGridInfo( getGridInfo( gridElement ) );\n\t\t\t// Both border-box and content-box are observed as they may change\n\t\t\t// independently. This requires two observers because a single one\n\t\t\t// can\u2019t be made to monitor both on the same element.\n\t\t\tconst borderBoxSpy = new window.ResizeObserver( resizeCallback );\n\t\t\tborderBoxSpy.observe( gridElement, { box: 'border-box' } );\n\t\t\tconst contentBoxSpy = new window.ResizeObserver( resizeCallback );\n\t\t\tcontentBoxSpy.observe( gridElement );\n\t\t\treturn () => {\n\t\t\t\tborderBoxSpy.disconnect();\n\t\t\t\tcontentBoxSpy.disconnect();\n\t\t\t};\n\t\t}, [ gridElement ] );\n\n\t\tuseEffect( () => {\n\t\t\tfunction onGlobalDrag() {\n\t\t\t\tsetIsDroppingAllowed( true );\n\t\t\t}\n\t\t\tfunction onGlobalDragEnd() {\n\t\t\t\tsetIsDroppingAllowed( false );\n\t\t\t}\n\t\t\tdocument.addEventListener( 'drag', onGlobalDrag );\n\t\t\tdocument.addEventListener( 'dragend', onGlobalDragEnd );\n\t\t\treturn () => {\n\t\t\t\tdocument.removeEventListener( 'drag', onGlobalDrag );\n\t\t\t\tdocument.removeEventListener( 'dragend', onGlobalDragEnd );\n\t\t\t};\n\t\t}, [] );\n\n\t\treturn (\n\t\t\t<BlockPopoverCover\n\t\t\t\tclassName={ clsx( 'block-editor-grid-visualizer', {\n\t\t\t\t\t'is-dropping-allowed': isDroppingAllowed,\n\t\t\t\t} ) }\n\t\t\t\tclientId={ gridClientId }\n\t\t\t\t__unstablePopoverSlot=\"__unstable-block-tools-after\"\n\t\t\t>\n\t\t\t\t<div\n\t\t\t\t\tref={ ref }\n\t\t\t\t\tclassName=\"block-editor-grid-visualizer__grid\"\n\t\t\t\t\tstyle={ gridInfo.style }\n\t\t\t\t>\n\t\t\t\t\t{ isManualGrid ? (\n\t\t\t\t\t\t<ManualGridVisualizer\n\t\t\t\t\t\t\tgridClientId={ gridClientId }\n\t\t\t\t\t\t\tgridInfo={ gridInfo }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) : (\n\t\t\t\t\t\tArray.from( { length: gridInfo.numItems }, ( _, i ) => (\n\t\t\t\t\t\t\t<GridVisualizerCell\n\t\t\t\t\t\t\t\tkey={ i }\n\t\t\t\t\t\t\t\tcolor={ gridInfo.currentColor }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t) )\n\t\t\t\t\t) }\n\t\t\t\t</div>\n\t\t\t</BlockPopoverCover>\n\t\t);\n\t}\n);\n\nfunction ManualGridVisualizer( { gridClientId, gridInfo } ) {\n\tconst [ highlightedRect, setHighlightedRect ] = useState( null );\n\n\tconst gridItemStyles = useSelect(\n\t\t( select ) => {\n\t\t\tconst { getBlockOrder, getBlockStyles } = unlock(\n\t\t\t\tselect( blockEditorStore )\n\t\t\t);\n\t\t\tconst blockOrder = getBlockOrder( gridClientId );\n\t\t\treturn getBlockStyles( blockOrder );\n\t\t},\n\t\t[ gridClientId ]\n\t);\n\tconst occupiedRects = useMemo( () => {\n\t\tconst rects = [];\n\t\tfor ( const style of Object.values( gridItemStyles ) ) {\n\t\t\tconst {\n\t\t\t\tcolumnStart,\n\t\t\t\trowStart,\n\t\t\t\tcolumnSpan = 1,\n\t\t\t\trowSpan = 1,\n\t\t\t} = style?.layout ?? {};\n\t\t\tif ( ! columnStart || ! rowStart ) {\n\t\t\t\tcontinue;\n\t\t\t}\n\t\t\trects.push(\n\t\t\t\tnew GridRect( {\n\t\t\t\t\tcolumnStart,\n\t\t\t\t\trowStart,\n\t\t\t\t\tcolumnSpan,\n\t\t\t\t\trowSpan,\n\t\t\t\t} )\n\t\t\t);\n\t\t}\n\t\treturn rects;\n\t}, [ gridItemStyles ] );\n\n\treturn range( 1, gridInfo.numRows ).map( ( row ) =>\n\t\trange( 1, gridInfo.numColumns ).map( ( column ) => {\n\t\t\tconst isCellOccupied = occupiedRects.some( ( rect ) =>\n\t\t\t\trect.contains( column, row )\n\t\t\t);\n\t\t\tconst isHighlighted =\n\t\t\t\thighlightedRect?.contains( column, row ) ?? false;\n\t\t\treturn (\n\t\t\t\t<GridVisualizerCell\n\t\t\t\t\tkey={ `${ row }-${ column }` }\n\t\t\t\t\tcolor={ gridInfo.currentColor }\n\t\t\t\t\tclassName={ isHighlighted && 'is-highlighted' }\n\t\t\t\t>\n\t\t\t\t\t{ isCellOccupied ? (\n\t\t\t\t\t\t<GridVisualizerDropZone\n\t\t\t\t\t\t\tcolumn={ column }\n\t\t\t\t\t\t\trow={ row }\n\t\t\t\t\t\t\tgridClientId={ gridClientId }\n\t\t\t\t\t\t\tgridInfo={ gridInfo }\n\t\t\t\t\t\t\tsetHighlightedRect={ setHighlightedRect }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<GridVisualizerAppender\n\t\t\t\t\t\t\tcolumn={ column }\n\t\t\t\t\t\t\trow={ row }\n\t\t\t\t\t\t\tgridClientId={ gridClientId }\n\t\t\t\t\t\t\tgridInfo={ gridInfo }\n\t\t\t\t\t\t\tsetHighlightedRect={ setHighlightedRect }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t</GridVisualizerCell>\n\t\t\t);\n\t\t} )\n\t);\n}\n\nfunction GridVisualizerCell( { color, children, className } ) {\n\treturn (\n\t\t<div\n\t\t\tclassName={ clsx(\n\t\t\t\t'block-editor-grid-visualizer__cell',\n\t\t\t\tclassName\n\t\t\t) }\n\t\t\tstyle={ {\n\t\t\t\tboxShadow: `inset 0 0 0 1px color-mix(in srgb, ${ color } 20%, #0000)`,\n\t\t\t\tcolor,\n\t\t\t} }\n\t\t>\n\t\t\t{ children }\n\t\t</div>\n\t);\n}\n\nfunction useGridVisualizerDropZone(\n\tcolumn,\n\trow,\n\tgridClientId,\n\tgridInfo,\n\tsetHighlightedRect\n) {\n\tconst {\n\t\tgetBlockAttributes,\n\t\tgetBlockRootClientId,\n\t\tcanInsertBlockType,\n\t\tgetBlockName,\n\t} = useSelect( blockEditorStore );\n\tconst {\n\t\tupdateBlockAttributes,\n\t\tmoveBlocksToPosition,\n\t\t__unstableMarkNextChangeAsNotPersistent,\n\t} = useDispatch( blockEditorStore );\n\n\tconst getNumberOfBlocksBeforeCell = useGetNumberOfBlocksBeforeCell(\n\t\tgridClientId,\n\t\tgridInfo.numColumns\n\t);\n\n\treturn useDropZoneWithValidation( {\n\t\tvalidateDrag( srcClientId ) {\n\t\t\tconst blockName = getBlockName( srcClientId );\n\t\t\tif ( ! canInsertBlockType( blockName, gridClientId ) ) {\n\t\t\t\treturn false;\n\t\t\t}\n\t\t\tconst attributes = getBlockAttributes( srcClientId );\n\t\t\tconst rect = new GridRect( {\n\t\t\t\tcolumnStart: column,\n\t\t\t\trowStart: row,\n\t\t\t\tcolumnSpan: attributes.style?.layout?.columnSpan,\n\t\t\t\trowSpan: attributes.style?.layout?.rowSpan,\n\t\t\t} );\n\t\t\tconst isInBounds = new GridRect( {\n\t\t\t\tcolumnSpan: gridInfo.numColumns,\n\t\t\t\trowSpan: gridInfo.numRows,\n\t\t\t} ).containsRect( rect );\n\t\t\treturn isInBounds;\n\t\t},\n\t\tonDragEnter( srcClientId ) {\n\t\t\tconst attributes = getBlockAttributes( srcClientId );\n\t\t\tsetHighlightedRect(\n\t\t\t\tnew GridRect( {\n\t\t\t\t\tcolumnStart: column,\n\t\t\t\t\trowStart: row,\n\t\t\t\t\tcolumnSpan: attributes.style?.layout?.columnSpan,\n\t\t\t\t\trowSpan: attributes.style?.layout?.rowSpan,\n\t\t\t\t} )\n\t\t\t);\n\t\t},\n\t\tonDragLeave() {\n\t\t\t// onDragEnter can be called before onDragLeave if the user moves\n\t\t\t// their mouse quickly, so only clear the highlight if it was set\n\t\t\t// by this cell.\n\t\t\tsetHighlightedRect( ( prevHighlightedRect ) =>\n\t\t\t\tprevHighlightedRect?.columnStart === column &&\n\t\t\t\tprevHighlightedRect?.rowStart === row\n\t\t\t\t\t? null\n\t\t\t\t\t: prevHighlightedRect\n\t\t\t);\n\t\t},\n\t\tonDrop( srcClientId ) {\n\t\t\tsetHighlightedRect( null );\n\t\t\tconst attributes = getBlockAttributes( srcClientId );\n\t\t\tupdateBlockAttributes( srcClientId, {\n\t\t\t\tstyle: {\n\t\t\t\t\t...attributes.style,\n\t\t\t\t\tlayout: {\n\t\t\t\t\t\t...attributes.style?.layout,\n\t\t\t\t\t\tcolumnStart: column,\n\t\t\t\t\t\trowStart: row,\n\t\t\t\t\t},\n\t\t\t\t},\n\t\t\t} );\n\t\t\t__unstableMarkNextChangeAsNotPersistent();\n\t\t\tmoveBlocksToPosition(\n\t\t\t\t[ srcClientId ],\n\t\t\t\tgetBlockRootClientId( srcClientId ),\n\t\t\t\tgridClientId,\n\t\t\t\tgetNumberOfBlocksBeforeCell( column, row )\n\t\t\t);\n\t\t},\n\t} );\n}\n\nfunction GridVisualizerDropZone( {\n\tcolumn,\n\trow,\n\tgridClientId,\n\tgridInfo,\n\tsetHighlightedRect,\n} ) {\n\treturn (\n\t\t<div\n\t\t\tclassName=\"block-editor-grid-visualizer__drop-zone\"\n\t\t\tref={ useGridVisualizerDropZone(\n\t\t\t\tcolumn,\n\t\t\t\trow,\n\t\t\t\tgridClientId,\n\t\t\t\tgridInfo,\n\t\t\t\tsetHighlightedRect\n\t\t\t) }\n\t\t/>\n\t);\n}\n\nfunction GridVisualizerAppender( {\n\tcolumn,\n\trow,\n\tgridClientId,\n\tgridInfo,\n\tsetHighlightedRect,\n} ) {\n\tconst {\n\t\tupdateBlockAttributes,\n\t\tmoveBlocksToPosition,\n\t\t__unstableMarkNextChangeAsNotPersistent,\n\t} = useDispatch( blockEditorStore );\n\n\tconst getNumberOfBlocksBeforeCell = useGetNumberOfBlocksBeforeCell(\n\t\tgridClientId,\n\t\tgridInfo.numColumns\n\t);\n\n\treturn (\n\t\t<ButtonBlockAppender\n\t\t\trootClientId={ gridClientId }\n\t\t\tclassName=\"block-editor-grid-visualizer__appender\"\n\t\t\tref={ useGridVisualizerDropZone(\n\t\t\t\tcolumn,\n\t\t\t\trow,\n\t\t\t\tgridClientId,\n\t\t\t\tgridInfo,\n\t\t\t\tsetHighlightedRect\n\t\t\t) }\n\t\t\tstyle={ {\n\t\t\t\tcolor: gridInfo.currentColor,\n\t\t\t} }\n\t\t\tonSelect={ ( block ) => {\n\t\t\t\tif ( ! block ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t\tupdateBlockAttributes( block.clientId, {\n\t\t\t\t\tstyle: {\n\t\t\t\t\t\tlayout: {\n\t\t\t\t\t\t\tcolumnStart: column,\n\t\t\t\t\t\t\trowStart: row,\n\t\t\t\t\t\t},\n\t\t\t\t\t},\n\t\t\t\t} );\n\t\t\t\t__unstableMarkNextChangeAsNotPersistent();\n\t\t\t\tmoveBlocksToPosition(\n\t\t\t\t\t[ block.clientId ],\n\t\t\t\t\tgridClientId,\n\t\t\t\t\tgridClientId,\n\t\t\t\t\tgetNumberOfBlocksBeforeCell( column, row )\n\t\t\t\t);\n\t\t\t} }\n\t\t/>\n\t);\n}\n\nfunction useDropZoneWithValidation( {\n\tvalidateDrag,\n\tonDragEnter,\n\tonDragLeave,\n\tonDrop,\n} ) {\n\tconst { getDraggedBlockClientIds } = useSelect( blockEditorStore );\n\treturn useDropZone( {\n\t\tonDragEnter() {\n\t\t\tconst [ srcClientId ] = getDraggedBlockClientIds();\n\t\t\tif ( srcClientId && validateDrag( srcClientId ) ) {\n\t\t\t\tonDragEnter( srcClientId );\n\t\t\t}\n\t\t},\n\t\tonDragLeave() {\n\t\t\tonDragLeave();\n\t\t},\n\t\tonDrop() {\n\t\t\tconst [ srcClientId ] = getDraggedBlockClientIds();\n\t\t\tif ( srcClientId && validateDrag( srcClientId ) ) {\n\t\t\t\tonDrop( srcClientId );\n\t\t\t}\n\t\t},\n\t} );\n}\n"],
+  "mappings": "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",
+  "names": ["blockEditorStore", "BlockPopoverCover", "clsx", "ButtonBlockAppender", "useDropZone"]
+}

package/build/components/grid/index.js

@@ -1,34 +1,38 @@
 "use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-Object.defineProperty(exports, "GridItemMovers", {
-  enumerable: true,
-  get: function () {
-    return _gridItemMovers.GridItemMovers;
-  }
-});
-Object.defineProperty(exports, "GridItemResizer", {
-  enumerable: true,
-  get: function () {
-    return _gridItemResizer.GridItemResizer;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
   }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var grid_exports = {};
+__export(grid_exports, {
+  GridItemMovers: () => import_grid_item_movers.GridItemMovers,
+  GridItemResizer: () => import_grid_item_resizer.GridItemResizer,
+  GridVisualizer: () => import_grid_visualizer.GridVisualizer,
+  useGridLayoutSync: () => import_use_grid_layout_sync.useGridLayoutSync
 });
-Object.defineProperty(exports, "GridVisualizer", {
-  enumerable: true,
-  get: function () {
-    return _gridVisualizer.GridVisualizer;
-  }
-});
-Object.defineProperty(exports, "useGridLayoutSync", {
-  enumerable: true,
-  get: function () {
-    return _useGridLayoutSync.useGridLayoutSync;
-  }
+module.exports = __toCommonJS(grid_exports);
+var import_grid_visualizer = require("./grid-visualizer");
+var import_grid_item_resizer = require("./grid-item-resizer");
+var import_grid_item_movers = require("./grid-item-movers");
+var import_use_grid_layout_sync = require("./use-grid-layout-sync");
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  GridItemMovers,
+  GridItemResizer,
+  GridVisualizer,
+  useGridLayoutSync
 });
-var _gridVisualizer = require("./grid-visualizer");
-var _gridItemResizer = require("./grid-item-resizer");
-var _gridItemMovers = require("./grid-item-movers");
-var _useGridLayoutSync = require("./use-grid-layout-sync");
-//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map

package/build/components/grid/index.js.map

@@ -1 +1,7 @@
-{"version":3,"names":["_gridVisualizer","require","_gridItemResizer","_gridItemMovers","_useGridLayoutSync"],"sources":["@wordpress/block-editor/src/components/grid/index.js"],"sourcesContent":["export { GridVisualizer } from './grid-visualizer';\nexport { GridItemResizer } from './grid-item-resizer';\nexport { GridItemMovers } from './grid-item-movers';\nexport { useGridLayoutSync } from './use-grid-layout-sync';\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,IAAAA,eAAA,GAAAC,OAAA;AACA,IAAAC,gBAAA,GAAAD,OAAA;AACA,IAAAE,eAAA,GAAAF,OAAA;AACA,IAAAG,kBAAA,GAAAH,OAAA","ignoreList":[]}
+{
+  "version": 3,
+  "sources": ["../../../src/components/grid/index.js"],
+  "sourcesContent": ["export { GridVisualizer } from './grid-visualizer';\nexport { GridItemResizer } from './grid-item-resizer';\nexport { GridItemMovers } from './grid-item-movers';\nexport { useGridLayoutSync } from './use-grid-layout-sync';\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,6BAA+B;AAC/B,+BAAgC;AAChC,8BAA+B;AAC/B,kCAAkC;",
+  "names": []
+}

package/build/components/grid/use-get-number-of-blocks-before-cell.js

@@ -1,33 +1,35 @@
 "use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var use_get_number_of_blocks_before_cell_exports = {};
+__export(use_get_number_of_blocks_before_cell_exports, {
+  useGetNumberOfBlocksBeforeCell: () => useGetNumberOfBlocksBeforeCell
 });
-exports.useGetNumberOfBlocksBeforeCell = useGetNumberOfBlocksBeforeCell;
-var _data = require("@wordpress/data");
-var _store = require("../../store");
-/**
- * WordPress dependencies
- */
-
-/**
- * Internal dependencies
- */
-
+module.exports = __toCommonJS(use_get_number_of_blocks_before_cell_exports);
+var import_data = require("@wordpress/data");
+var import_store = require("../../store");
 function useGetNumberOfBlocksBeforeCell(gridClientId, numColumns) {
-  const {
-    getBlockOrder,
-    getBlockAttributes
-  } = (0, _data.useSelect)(_store.store);
+  const { getBlockOrder, getBlockAttributes } = (0, import_data.useSelect)(import_store.store);
   const getNumberOfBlocksBeforeCell = (column, row) => {
     const targetIndex = (row - 1) * numColumns + column - 1;
     let count = 0;
     for (const clientId of getBlockOrder(gridClientId)) {
-      var _getBlockAttributes$s;
-      const {
-        columnStart,
-        rowStart
-      } = (_getBlockAttributes$s = getBlockAttributes(clientId).style?.layout) !== null && _getBlockAttributes$s !== void 0 ? _getBlockAttributes$s : {};
+      const { columnStart, rowStart } = getBlockAttributes(clientId).style?.layout ?? {};
       const cellIndex = (rowStart - 1) * numColumns + columnStart - 1;
       if (cellIndex < targetIndex) {
         count++;
@@ -37,4 +39,8 @@ function useGetNumberOfBlocksBeforeCell(gridClientId, numColumns) {
   };
   return getNumberOfBlocksBeforeCell;
 }
-//# sourceMappingURL=use-get-number-of-blocks-before-cell.js.map
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  useGetNumberOfBlocksBeforeCell
+});
+//# sourceMappingURL=use-get-number-of-blocks-before-cell.js.map

package/build/components/grid/use-get-number-of-blocks-before-cell.js.map

@@ -1 +1,7 @@
-{"version":3,"names":["_data","require","_store","useGetNumberOfBlocksBeforeCell","gridClientId","numColumns","getBlockOrder","getBlockAttributes","useSelect","blockEditorStore","getNumberOfBlocksBeforeCell","column","row","targetIndex","count","clientId","_getBlockAttributes$s","columnStart","rowStart","style","layout","cellIndex"],"sources":["@wordpress/block-editor/src/components/grid/use-get-number-of-blocks-before-cell.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useSelect } from '@wordpress/data';\n\n/**\n * Internal dependencies\n */\nimport { store as blockEditorStore } from '../../store';\n\nexport function useGetNumberOfBlocksBeforeCell( gridClientId, numColumns ) {\n\tconst { getBlockOrder, getBlockAttributes } = useSelect( blockEditorStore );\n\n\tconst getNumberOfBlocksBeforeCell = ( column, row ) => {\n\t\tconst targetIndex = ( row - 1 ) * numColumns + column - 1;\n\n\t\tlet count = 0;\n\t\tfor ( const clientId of getBlockOrder( gridClientId ) ) {\n\t\t\tconst { columnStart, rowStart } =\n\t\t\t\tgetBlockAttributes( clientId ).style?.layout ?? {};\n\t\t\tconst cellIndex = ( rowStart - 1 ) * numColumns + columnStart - 1;\n\t\t\tif ( cellIndex < targetIndex ) {\n\t\t\t\tcount++;\n\t\t\t}\n\t\t}\n\t\treturn count;\n\t};\n\n\treturn getNumberOfBlocksBeforeCell;\n}\n"],"mappings":";;;;;;AAGA,IAAAA,KAAA,GAAAC,OAAA;AAKA,IAAAC,MAAA,GAAAD,OAAA;AARA;AACA;AACA;;AAGA;AACA;AACA;;AAGO,SAASE,8BAA8BA,CAAEC,YAAY,EAAEC,UAAU,EAAG;EAC1E,MAAM;IAAEC,aAAa;IAAEC;EAAmB,CAAC,GAAG,IAAAC,eAAS,EAAEC,YAAiB,CAAC;EAE3E,MAAMC,2BAA2B,GAAGA,CAAEC,MAAM,EAAEC,GAAG,KAAM;IACtD,MAAMC,WAAW,GAAG,CAAED,GAAG,GAAG,CAAC,IAAKP,UAAU,GAAGM,MAAM,GAAG,CAAC;IAEzD,IAAIG,KAAK,GAAG,CAAC;IACb,KAAM,MAAMC,QAAQ,IAAIT,aAAa,CAAEF,YAAa,CAAC,EAAG;MAAA,IAAAY,qBAAA;MACvD,MAAM;QAAEC,WAAW;QAAEC;MAAS,CAAC,IAAAF,qBAAA,GAC9BT,kBAAkB,CAAEQ,QAAS,CAAC,CAACI,KAAK,EAAEC,MAAM,cAAAJ,qBAAA,cAAAA,qBAAA,GAAI,CAAC,CAAC;MACnD,MAAMK,SAAS,GAAG,CAAEH,QAAQ,GAAG,CAAC,IAAKb,UAAU,GAAGY,WAAW,GAAG,CAAC;MACjE,IAAKI,SAAS,GAAGR,WAAW,EAAG;QAC9BC,KAAK,EAAE;MACR;IACD;IACA,OAAOA,KAAK;EACb,CAAC;EAED,OAAOJ,2BAA2B;AACnC","ignoreList":[]}
+{
+  "version": 3,
+  "sources": ["../../../src/components/grid/use-get-number-of-blocks-before-cell.js"],
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { useSelect } from '@wordpress/data';\n\n/**\n * Internal dependencies\n */\nimport { store as blockEditorStore } from '../../store';\n\nexport function useGetNumberOfBlocksBeforeCell( gridClientId, numColumns ) {\n\tconst { getBlockOrder, getBlockAttributes } = useSelect( blockEditorStore );\n\n\tconst getNumberOfBlocksBeforeCell = ( column, row ) => {\n\t\tconst targetIndex = ( row - 1 ) * numColumns + column - 1;\n\n\t\tlet count = 0;\n\t\tfor ( const clientId of getBlockOrder( gridClientId ) ) {\n\t\t\tconst { columnStart, rowStart } =\n\t\t\t\tgetBlockAttributes( clientId ).style?.layout ?? {};\n\t\t\tconst cellIndex = ( rowStart - 1 ) * numColumns + columnStart - 1;\n\t\t\tif ( cellIndex < targetIndex ) {\n\t\t\t\tcount++;\n\t\t\t}\n\t\t}\n\t\treturn count;\n\t};\n\n\treturn getNumberOfBlocksBeforeCell;\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,kBAA0B;AAK1B,mBAA0C;AAEnC,SAAS,+BAAgC,cAAc,YAAa;AAC1E,QAAM,EAAE,eAAe,mBAAmB,QAAI,uBAAW,aAAAA,KAAiB;AAE1E,QAAM,8BAA8B,CAAE,QAAQ,QAAS;AACtD,UAAM,eAAgB,MAAM,KAAM,aAAa,SAAS;AAExD,QAAI,QAAQ;AACZ,eAAY,YAAY,cAAe,YAAa,GAAI;AACvD,YAAM,EAAE,aAAa,SAAS,IAC7B,mBAAoB,QAAS,EAAE,OAAO,UAAU,CAAC;AAClD,YAAM,aAAc,WAAW,KAAM,aAAa,cAAc;AAChE,UAAK,YAAY,aAAc;AAC9B;AAAA,MACD;AAAA,IACD;AACA,WAAO;AAAA,EACR;AAEA,SAAO;AACR;",
+  "names": ["blockEditorStore"]
+}

package/build/components/grid/use-grid-layout-sync.js

@@ -1,100 +1,106 @@
 "use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var use_grid_layout_sync_exports = {};
+__export(use_grid_layout_sync_exports, {
+  useGridLayoutSync: () => useGridLayoutSync
 });
-exports.useGridLayoutSync = useGridLayoutSync;
-var _data = require("@wordpress/data");
-var _element = require("@wordpress/element");
-var _compose = require("@wordpress/compose");
-var _store = require("../../store");
-var _utils = require("./utils");
-var _object = require("../../utils/object");
-/**
- * WordPress dependencies
- */
-
-/**
- * Internal dependencies
- */
-
-function useGridLayoutSync({
-  clientId: gridClientId
-}) {
-  const {
-    gridLayout,
-    blockOrder,
-    selectedBlockLayout
-  } = (0, _data.useSelect)(select => {
-    var _getBlockAttributes$l;
-    const {
-      getBlockAttributes,
-      getBlockOrder
-    } = select(_store.store);
-    const selectedBlock = select(_store.store).getSelectedBlock();
-    return {
-      gridLayout: (_getBlockAttributes$l = getBlockAttributes(gridClientId).layout) !== null && _getBlockAttributes$l !== void 0 ? _getBlockAttributes$l : {},
-      blockOrder: getBlockOrder(gridClientId),
-      selectedBlockLayout: selectedBlock?.attributes.style?.layout
-    };
-  }, [gridClientId]);
-  const {
-    getBlockAttributes,
-    getBlockRootClientId
-  } = (0, _data.useSelect)(_store.store);
-  const {
-    updateBlockAttributes,
-    __unstableMarkNextChangeAsNotPersistent
-  } = (0, _data.useDispatch)(_store.store);
-  const selectedBlockRect = (0, _element.useMemo)(() => selectedBlockLayout ? new _utils.GridRect(selectedBlockLayout) : null, [selectedBlockLayout]);
-  const previouslySelectedBlockRect = (0, _compose.usePrevious)(selectedBlockRect);
-  const previousIsManualPlacement = (0, _compose.usePrevious)(gridLayout.isManualPlacement);
-  const previousBlockOrder = (0, _compose.usePrevious)(blockOrder);
-  (0, _element.useEffect)(() => {
+module.exports = __toCommonJS(use_grid_layout_sync_exports);
+var import_data = require("@wordpress/data");
+var import_element = require("@wordpress/element");
+var import_compose = require("@wordpress/compose");
+var import_store = require("../../store");
+var import_utils = require("./utils");
+var import_object = require("../../utils/object");
+function useGridLayoutSync({ clientId: gridClientId }) {
+  const { gridLayout, blockOrder, selectedBlockLayout } = (0, import_data.useSelect)(
+    (select) => {
+      const { getBlockAttributes: getBlockAttributes2, getBlockOrder } = select(import_store.store);
+      const selectedBlock = select(import_store.store).getSelectedBlock();
+      return {
+        gridLayout: getBlockAttributes2(gridClientId).layout ?? {},
+        blockOrder: getBlockOrder(gridClientId),
+        selectedBlockLayout: selectedBlock?.attributes.style?.layout
+      };
+    },
+    [gridClientId]
+  );
+  const { getBlockAttributes, getBlockRootClientId } = (0, import_data.useSelect)(import_store.store);
+  const { updateBlockAttributes, __unstableMarkNextChangeAsNotPersistent } = (0, import_data.useDispatch)(import_store.store);
+  const selectedBlockRect = (0, import_element.useMemo)(
+    () => selectedBlockLayout ? new import_utils.GridRect(selectedBlockLayout) : null,
+    [selectedBlockLayout]
+  );
+  const previouslySelectedBlockRect = (0, import_compose.usePrevious)(selectedBlockRect);
+  const previousIsManualPlacement = (0, import_compose.usePrevious)(
+    gridLayout.isManualPlacement
+  );
+  const previousBlockOrder = (0, import_compose.usePrevious)(blockOrder);
+  (0, import_element.useEffect)(() => {
     const updates = {};
     if (gridLayout.isManualPlacement) {
       const occupiedRects = [];
-
-      // Respect the position of blocks that already have a columnStart and rowStart value.
       for (const clientId of blockOrder) {
-        var _getBlockAttributes$s;
         const {
           columnStart,
           rowStart,
           columnSpan = 1,
           rowSpan = 1
-        } = (_getBlockAttributes$s = getBlockAttributes(clientId).style?.layout) !== null && _getBlockAttributes$s !== void 0 ? _getBlockAttributes$s : {};
+        } = getBlockAttributes(clientId).style?.layout ?? {};
         if (!columnStart || !rowStart) {
           continue;
         }
-        occupiedRects.push(new _utils.GridRect({
-          columnStart,
-          rowStart,
-          columnSpan,
-          rowSpan
-        }));
+        occupiedRects.push(
+          new import_utils.GridRect({
+            columnStart,
+            rowStart,
+            columnSpan,
+            rowSpan
+          })
+        );
       }
-
-      // When in manual mode, ensure that every block has a columnStart and rowStart value.
       for (const clientId of blockOrder) {
-        var _attributes$style$lay;
         const attributes = getBlockAttributes(clientId);
         const {
           columnStart,
           rowStart,
           columnSpan = 1,
           rowSpan = 1
-        } = (_attributes$style$lay = attributes.style?.layout) !== null && _attributes$style$lay !== void 0 ? _attributes$style$lay : {};
+        } = attributes.style?.layout ?? {};
         if (columnStart && rowStart) {
           continue;
         }
-        const [newColumnStart, newRowStart] = placeBlock(occupiedRects, gridLayout.columnCount, columnSpan, rowSpan, previouslySelectedBlockRect?.columnEnd, previouslySelectedBlockRect?.rowEnd);
-        occupiedRects.push(new _utils.GridRect({
-          columnStart: newColumnStart,
-          rowStart: newRowStart,
+        const [newColumnStart, newRowStart] = placeBlock(
+          occupiedRects,
+          gridLayout.columnCount,
           columnSpan,
-          rowSpan
-        }));
+          rowSpan,
+          previouslySelectedBlockRect?.columnEnd,
+          previouslySelectedBlockRect?.rowEnd
+        );
+        occupiedRects.push(
+          new import_utils.GridRect({
+            columnStart: newColumnStart,
+            rowStart: newRowStart,
+            columnSpan,
+            rowSpan
+          })
+        );
         updates[clientId] = {
           style: {
             ...attributes.style,
@@ -106,9 +112,9 @@ function useGridLayoutSync({
           }
         };
       }
-
-      // Ensure there's enough rows to fit all blocks.
-      const bottomMostRow = Math.max(...occupiedRects.map(r => r.rowEnd));
+      const bottomMostRow = Math.max(
+        ...occupiedRects.map((r) => r.rowEnd)
+      );
       if (!gridLayout.rowCount || gridLayout.rowCount < bottomMostRow) {
         updates[gridClientId] = {
           layout: {
@@ -117,23 +123,14 @@ function useGridLayoutSync({
           }
         };
       }
-
-      // Unset grid layout attributes for blocks removed from the grid.
-      for (const clientId of previousBlockOrder !== null && previousBlockOrder !== void 0 ? previousBlockOrder : []) {
+      for (const clientId of previousBlockOrder ?? []) {
         if (!blockOrder.includes(clientId)) {
-          var _attributes$style$lay2;
           const rootClientId = getBlockRootClientId(clientId);
-
-          // Block was removed from the editor, so nothing to do.
           if (rootClientId === null) {
             continue;
           }
-
-          // Check if the block is being moved to another grid.
-          // If so, do nothing and let the new grid parent handle
-          // the attributes.
           const rootAttributes = getBlockAttributes(rootClientId);
-          if (rootAttributes?.layout?.type === 'grid') {
+          if (rootAttributes?.layout?.type === "grid") {
             continue;
           }
           const attributes = getBlockAttributes(clientId);
@@ -143,75 +140,84 @@ function useGridLayoutSync({
             columnSpan,
             rowSpan,
             ...layout
-          } = (_attributes$style$lay2 = attributes.style?.layout) !== null && _attributes$style$lay2 !== void 0 ? _attributes$style$lay2 : {};
+          } = attributes.style?.layout ?? {};
           if (columnStart || rowStart || columnSpan || rowSpan) {
             const hasEmptyLayoutAttribute = Object.keys(layout).length === 0;
-            updates[clientId] = (0, _object.setImmutably)(attributes, ['style', 'layout'], hasEmptyLayoutAttribute ? undefined : layout);
+            updates[clientId] = (0, import_object.setImmutably)(
+              attributes,
+              ["style", "layout"],
+              hasEmptyLayoutAttribute ? void 0 : layout
+            );
           }
         }
       }
     } else {
-      // Remove all of the columnStart and rowStart values
-      // when switching from manual to auto mode,
       if (previousIsManualPlacement === true) {
         for (const clientId of blockOrder) {
-          var _attributes$style$lay3;
           const attributes = getBlockAttributes(clientId);
-          const {
-            columnStart,
-            rowStart,
-            ...layout
-          } = (_attributes$style$lay3 = attributes.style?.layout) !== null && _attributes$style$lay3 !== void 0 ? _attributes$style$lay3 : {};
-          // Only update attributes if columnStart or rowStart are set.
+          const { columnStart, rowStart, ...layout } = attributes.style?.layout ?? {};
           if (columnStart || rowStart) {
             const hasEmptyLayoutAttribute = Object.keys(layout).length === 0;
-            updates[clientId] = (0, _object.setImmutably)(attributes, ['style', 'layout'], hasEmptyLayoutAttribute ? undefined : layout);
+            updates[clientId] = (0, import_object.setImmutably)(
+              attributes,
+              ["style", "layout"],
+              hasEmptyLayoutAttribute ? void 0 : layout
+            );
           }
         }
       }
-
-      // Remove row styles in auto mode
       if (gridLayout.rowCount) {
         updates[gridClientId] = {
           layout: {
             ...gridLayout,
-            rowCount: undefined
+            rowCount: void 0
           }
         };
       }
     }
     if (Object.keys(updates).length) {
       __unstableMarkNextChangeAsNotPersistent();
-      updateBlockAttributes(Object.keys(updates), updates, /* uniqueByBlock: */true);
+      updateBlockAttributes(
+        Object.keys(updates),
+        updates,
+        /* uniqueByBlock: */
+        true
+      );
     }
   }, [
-  // Actual deps to sync:
-  gridClientId, gridLayout, previousBlockOrder, blockOrder, previouslySelectedBlockRect, previousIsManualPlacement,
-  // These won't change, but the linter thinks they might:
-  __unstableMarkNextChangeAsNotPersistent, getBlockAttributes, getBlockRootClientId, updateBlockAttributes]);
+    // Actual deps to sync:
+    gridClientId,
+    gridLayout,
+    previousBlockOrder,
+    blockOrder,
+    previouslySelectedBlockRect,
+    previousIsManualPlacement,
+    // These won't change, but the linter thinks they might:
+    __unstableMarkNextChangeAsNotPersistent,
+    getBlockAttributes,
+    getBlockRootClientId,
+    updateBlockAttributes
+  ]);
 }
-
-/**
- * @param {GridRect[]} occupiedRects
- * @param {number}     gridColumnCount
- * @param {number}     blockColumnSpan
- * @param {number}     blockRowSpan
- * @param {number?}    startColumn
- * @param {number?}    startRow
- */
 function placeBlock(occupiedRects, gridColumnCount, blockColumnSpan, blockRowSpan, startColumn = 1, startRow = 1) {
-  for (let row = startRow;; row++) {
+  for (let row = startRow; ; row++) {
     for (let column = row === startRow ? startColumn : 1; column <= gridColumnCount; column++) {
-      const candidateRect = new _utils.GridRect({
+      const candidateRect = new import_utils.GridRect({
         columnStart: column,
         rowStart: row,
         columnSpan: blockColumnSpan,
         rowSpan: blockRowSpan
       });
-      if (!occupiedRects.some(r => r.intersectsRect(candidateRect))) {
+      if (!occupiedRects.some(
+        (r) => r.intersectsRect(candidateRect)
+      )) {
         return [column, row];
       }
     }
   }
 }
-//# sourceMappingURL=use-grid-layout-sync.js.map
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  useGridLayoutSync
+});
+//# sourceMappingURL=use-grid-layout-sync.js.map