@wordpress/block-editor 13.1.0 → 13.3.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/CHANGELOG.md +21 -17
- package/README.md +1 -2
- package/build/components/block-breadcrumb/index.js +12 -1
- package/build/components/block-breadcrumb/index.js.map +1 -1
- package/build/components/block-lock/modal.js +67 -67
- package/build/components/block-lock/modal.js.map +1 -1
- package/build/components/block-lock/toolbar.js +0 -1
- package/build/components/block-lock/toolbar.js.map +1 -1
- package/build/components/block-mover/button.js +1 -1
- package/build/components/block-mover/button.js.map +1 -1
- package/build/components/block-mover/index.js +12 -6
- package/build/components/block-mover/index.js.map +1 -1
- package/build/components/block-pattern-setup/setup-toolbar.js +2 -2
- package/build/components/block-pattern-setup/setup-toolbar.js.map +1 -1
- package/build/components/block-patterns-paging/index.js +5 -7
- package/build/components/block-patterns-paging/index.js.map +1 -1
- package/build/components/block-quick-navigation/index.js +20 -17
- package/build/components/block-quick-navigation/index.js.map +1 -1
- package/build/components/block-rename/modal.js +4 -12
- package/build/components/block-rename/modal.js.map +1 -1
- package/build/components/block-toolbar/shuffle.js +4 -1
- package/build/components/block-toolbar/shuffle.js.map +1 -1
- package/build/components/block-tools/block-selection-button.js +7 -58
- package/build/components/block-tools/block-selection-button.js.map +1 -1
- package/build/components/block-tools/block-toolbar-breadcrumb.js +9 -2
- package/build/components/block-tools/block-toolbar-breadcrumb.js.map +1 -1
- package/build/components/block-tools/index.js +14 -1
- package/build/components/block-tools/index.js.map +1 -1
- package/build/components/block-tools/use-show-block-tools.js +4 -2
- package/build/components/block-tools/use-show-block-tools.js.map +1 -1
- package/build/components/block-tools/zoom-out-mode-inserters.js +5 -4
- package/build/components/block-tools/zoom-out-mode-inserters.js.map +1 -1
- package/build/components/block-tools/zoom-out-popover.js +57 -0
- package/build/components/block-tools/zoom-out-popover.js.map +1 -0
- package/build/components/block-tools/zoom-out-toolbar.js +138 -0
- package/build/components/block-tools/zoom-out-toolbar.js.map +1 -0
- package/build/components/button-block-appender/index.js +3 -1
- package/build/components/button-block-appender/index.js.map +1 -1
- package/build/components/child-layout-control/index.js +193 -127
- package/build/components/child-layout-control/index.js.map +1 -1
- package/build/components/date-format-picker/index.js +10 -1
- package/build/components/date-format-picker/index.js.map +1 -1
- package/build/components/dimensions-tool/index.js +6 -4
- package/build/components/dimensions-tool/index.js.map +1 -1
- package/build/components/font-appearance-control/index.js +26 -61
- package/build/components/font-appearance-control/index.js.map +1 -1
- package/build/components/global-styles/background-panel.js +178 -116
- package/build/components/global-styles/background-panel.js.map +1 -1
- package/build/components/global-styles/border-panel.js +2 -1
- package/build/components/global-styles/border-panel.js.map +1 -1
- package/build/components/global-styles/color-panel.js +2 -1
- package/build/components/global-styles/color-panel.js.map +1 -1
- package/build/components/global-styles/dimensions-panel.js +2 -1
- package/build/components/global-styles/dimensions-panel.js.map +1 -1
- package/build/components/global-styles/filters-panel.js +2 -1
- package/build/components/global-styles/filters-panel.js.map +1 -1
- package/build/components/global-styles/hooks.js +8 -0
- package/build/components/global-styles/hooks.js.map +1 -1
- package/build/components/global-styles/image-settings-panel.js +2 -1
- package/build/components/global-styles/image-settings-panel.js.map +1 -1
- package/build/components/global-styles/typography-panel.js +50 -12
- package/build/components/global-styles/typography-panel.js.map +1 -1
- package/build/components/global-styles/typography-utils.js +50 -0
- package/build/components/global-styles/typography-utils.js.map +1 -1
- package/build/components/global-styles/use-global-styles-output.js +25 -9
- package/build/components/global-styles/use-global-styles-output.js.map +1 -1
- package/build/components/global-styles/utils.js +17 -7
- package/build/components/global-styles/utils.js.map +1 -1
- package/build/components/grid/grid-item-movers.js +94 -0
- package/build/components/grid/grid-item-movers.js.map +1 -0
- package/build/components/{grid-visualizer → grid}/grid-item-resizer.js +18 -56
- package/build/components/grid/grid-item-resizer.js.map +1 -0
- package/build/components/grid/grid-visualizer.js +305 -0
- package/build/components/grid/grid-visualizer.js.map +1 -0
- package/build/components/{grid-visualizer → grid}/index.js +14 -0
- package/build/components/grid/index.js.map +1 -0
- package/build/components/grid/use-get-number-of-blocks-before-cell.js +40 -0
- package/build/components/grid/use-get-number-of-blocks-before-cell.js.map +1 -0
- package/build/components/grid/use-grid-layout-sync.js +169 -0
- package/build/components/grid/use-grid-layout-sync.js.map +1 -0
- package/build/components/grid/utils.js +145 -0
- package/build/components/grid/utils.js.map +1 -0
- package/build/components/image-editor/aspect-ratio-dropdown.js +0 -1
- package/build/components/image-editor/aspect-ratio-dropdown.js.map +1 -1
- package/build/components/inner-blocks/index.js +1 -1
- package/build/components/inner-blocks/index.js.map +1 -1
- package/build/components/inserter/block-patterns-tab/pattern-category-preview-panel.js +1 -19
- package/build/components/inserter/block-patterns-tab/pattern-category-preview-panel.js.map +1 -1
- package/build/components/inserter/menu.js +26 -4
- package/build/components/inserter/menu.js.map +1 -1
- package/build/components/inserter/quick-inserter.js +2 -1
- package/build/components/inserter/quick-inserter.js.map +1 -1
- package/build/components/inspector-controls/block-support-tools-panel.js +2 -1
- package/build/components/inspector-controls/block-support-tools-panel.js.map +1 -1
- package/build/components/link-control/link-preview.js +1 -1
- package/build/components/link-control/link-preview.js.map +1 -1
- package/build/components/media-placeholder/index.js +19 -23
- package/build/components/media-placeholder/index.js.map +1 -1
- package/build/components/navigable-toolbar/index.js +3 -1
- package/build/components/navigable-toolbar/index.js.map +1 -1
- package/build/components/rich-text/event-listeners/input-rules.js +1 -0
- package/build/components/rich-text/event-listeners/input-rules.js.map +1 -1
- package/build/components/rich-text/index.native.js +10 -4
- package/build/components/rich-text/index.native.js.map +1 -1
- package/build/components/rich-text/native/index.native.js +14 -0
- package/build/components/rich-text/native/index.native.js.map +1 -1
- package/build/components/spacing-sizes-control/input-controls/spacing-input-control.js +5 -1
- package/build/components/spacing-sizes-control/input-controls/spacing-input-control.js.map +1 -1
- package/build/components/tabbed-sidebar/index.js +66 -0
- package/build/components/tabbed-sidebar/index.js.map +1 -0
- package/build/components/url-popover/index.js +3 -0
- package/build/components/url-popover/index.js.map +1 -1
- package/build/hooks/background.js +26 -4
- package/build/hooks/background.js.map +1 -1
- package/build/hooks/block-hooks.js +11 -17
- package/build/hooks/block-hooks.js.map +1 -1
- package/build/hooks/block-style-variation.js +195 -11
- package/build/hooks/block-style-variation.js.map +1 -1
- package/build/hooks/duotone.js +16 -11
- package/build/hooks/duotone.js.map +1 -1
- package/build/hooks/grid-visualizer.js +65 -0
- package/build/hooks/grid-visualizer.js.map +1 -0
- package/build/hooks/index.js +15 -2
- package/build/hooks/index.js.map +1 -1
- package/build/hooks/layout-child.js +65 -40
- package/build/hooks/layout-child.js.map +1 -1
- package/build/hooks/position.js +2 -9
- package/build/hooks/position.js.map +1 -1
- package/build/hooks/use-bindings-attributes.js +16 -6
- package/build/hooks/use-bindings-attributes.js.map +1 -1
- package/build/hooks/utils.js +5 -2
- package/build/hooks/utils.js.map +1 -1
- package/build/layouts/constrained.js +44 -2
- package/build/layouts/constrained.js.map +1 -1
- package/build/layouts/grid.js +92 -76
- package/build/layouts/grid.js.map +1 -1
- package/build/lock-unlock.js +1 -1
- package/build/lock-unlock.js.map +1 -1
- package/build/private-apis.js +6 -1
- package/build/private-apis.js.map +1 -1
- package/build/store/actions.js +17 -1
- package/build/store/actions.js.map +1 -1
- package/build/store/defaults.js +0 -2
- package/build/store/defaults.js.map +1 -1
- package/build/store/defaults.native.js +0 -3
- package/build/store/defaults.native.js.map +1 -1
- package/build/store/private-keys.js +2 -1
- package/build/store/private-keys.js.map +1 -1
- package/build/utils/format-font-style.js +45 -0
- package/build/utils/format-font-style.js.map +1 -0
- package/build/utils/format-font-weight.js +68 -0
- package/build/utils/format-font-weight.js.map +1 -0
- package/build/utils/get-editor-region.js +34 -0
- package/build/utils/get-editor-region.js.map +1 -0
- package/build/utils/get-font-styles-and-weights.js +167 -0
- package/build/utils/get-font-styles-and-weights.js.map +1 -0
- package/build/utils/pasting.js +5 -13
- package/build/utils/pasting.js.map +1 -1
- package/build-module/components/block-breadcrumb/index.js +12 -1
- package/build-module/components/block-breadcrumb/index.js.map +1 -1
- package/build-module/components/block-lock/modal.js +67 -67
- package/build-module/components/block-lock/modal.js.map +1 -1
- package/build-module/components/block-lock/toolbar.js +0 -1
- package/build-module/components/block-lock/toolbar.js.map +1 -1
- package/build-module/components/block-mover/button.js +1 -1
- package/build-module/components/block-mover/button.js.map +1 -1
- package/build-module/components/block-mover/index.js +12 -6
- package/build-module/components/block-mover/index.js.map +1 -1
- package/build-module/components/block-pattern-setup/setup-toolbar.js +2 -2
- package/build-module/components/block-pattern-setup/setup-toolbar.js.map +1 -1
- package/build-module/components/block-patterns-paging/index.js +5 -7
- package/build-module/components/block-patterns-paging/index.js.map +1 -1
- package/build-module/components/block-quick-navigation/index.js +20 -17
- package/build-module/components/block-quick-navigation/index.js.map +1 -1
- package/build-module/components/block-rename/modal.js +5 -13
- package/build-module/components/block-rename/modal.js.map +1 -1
- package/build-module/components/block-toolbar/shuffle.js +4 -1
- package/build-module/components/block-toolbar/shuffle.js.map +1 -1
- package/build-module/components/block-tools/block-selection-button.js +10 -61
- package/build-module/components/block-tools/block-selection-button.js.map +1 -1
- package/build-module/components/block-tools/block-toolbar-breadcrumb.js +9 -2
- package/build-module/components/block-tools/block-toolbar-breadcrumb.js.map +1 -1
- package/build-module/components/block-tools/index.js +14 -1
- package/build-module/components/block-tools/index.js.map +1 -1
- package/build-module/components/block-tools/use-show-block-tools.js +4 -2
- package/build-module/components/block-tools/use-show-block-tools.js.map +1 -1
- package/build-module/components/block-tools/zoom-out-mode-inserters.js +5 -4
- package/build-module/components/block-tools/zoom-out-mode-inserters.js.map +1 -1
- package/build-module/components/block-tools/zoom-out-popover.js +48 -0
- package/build-module/components/block-tools/zoom-out-popover.js.map +1 -0
- package/build-module/components/block-tools/zoom-out-toolbar.js +131 -0
- package/build-module/components/block-tools/zoom-out-toolbar.js.map +1 -0
- package/build-module/components/button-block-appender/index.js +3 -1
- package/build-module/components/button-block-appender/index.js.map +1 -1
- package/build-module/components/child-layout-control/index.js +194 -128
- package/build-module/components/child-layout-control/index.js.map +1 -1
- package/build-module/components/date-format-picker/index.js +11 -3
- package/build-module/components/date-format-picker/index.js.map +1 -1
- package/build-module/components/dimensions-tool/index.js +6 -4
- package/build-module/components/dimensions-tool/index.js.map +1 -1
- package/build-module/components/font-appearance-control/index.js +28 -63
- package/build-module/components/font-appearance-control/index.js.map +1 -1
- package/build-module/components/global-styles/background-panel.js +181 -119
- package/build-module/components/global-styles/background-panel.js.map +1 -1
- package/build-module/components/global-styles/border-panel.js +3 -2
- package/build-module/components/global-styles/border-panel.js.map +1 -1
- package/build-module/components/global-styles/color-panel.js +3 -2
- package/build-module/components/global-styles/color-panel.js.map +1 -1
- package/build-module/components/global-styles/dimensions-panel.js +3 -2
- package/build-module/components/global-styles/dimensions-panel.js.map +1 -1
- package/build-module/components/global-styles/filters-panel.js +3 -2
- package/build-module/components/global-styles/filters-panel.js.map +1 -1
- package/build-module/components/global-styles/hooks.js +8 -0
- package/build-module/components/global-styles/hooks.js.map +1 -1
- package/build-module/components/global-styles/image-settings-panel.js +3 -2
- package/build-module/components/global-styles/image-settings-panel.js.map +1 -1
- package/build-module/components/global-styles/typography-panel.js +52 -14
- package/build-module/components/global-styles/typography-panel.js.map +1 -1
- package/build-module/components/global-styles/typography-utils.js +48 -0
- package/build-module/components/global-styles/typography-utils.js.map +1 -1
- package/build-module/components/global-styles/use-global-styles-output.js +25 -9
- package/build-module/components/global-styles/use-global-styles-output.js.map +1 -1
- package/build-module/components/global-styles/utils.js +15 -6
- package/build-module/components/global-styles/utils.js.map +1 -1
- package/build-module/components/grid/grid-item-movers.js +87 -0
- package/build-module/components/grid/grid-item-movers.js.map +1 -0
- package/build-module/components/{grid-visualizer → grid}/grid-item-resizer.js +13 -51
- package/build-module/components/grid/grid-item-resizer.js.map +1 -0
- package/build-module/components/grid/grid-visualizer.js +297 -0
- package/build-module/components/grid/grid-visualizer.js.map +1 -0
- package/build-module/components/grid/index.js +5 -0
- package/build-module/components/grid/index.js.map +1 -0
- package/build-module/components/grid/use-get-number-of-blocks-before-cell.js +33 -0
- package/build-module/components/grid/use-get-number-of-blocks-before-cell.js.map +1 -0
- package/build-module/components/grid/use-grid-layout-sync.js +162 -0
- package/build-module/components/grid/use-grid-layout-sync.js.map +1 -0
- package/build-module/components/grid/utils.js +131 -0
- package/build-module/components/grid/utils.js.map +1 -0
- package/build-module/components/image-editor/aspect-ratio-dropdown.js +0 -1
- package/build-module/components/image-editor/aspect-ratio-dropdown.js.map +1 -1
- package/build-module/components/inner-blocks/index.js +1 -1
- package/build-module/components/inner-blocks/index.js.map +1 -1
- package/build-module/components/inserter/block-patterns-tab/pattern-category-preview-panel.js +1 -19
- package/build-module/components/inserter/block-patterns-tab/pattern-category-preview-panel.js.map +1 -1
- package/build-module/components/inserter/menu.js +26 -4
- package/build-module/components/inserter/menu.js.map +1 -1
- package/build-module/components/inserter/quick-inserter.js +2 -1
- package/build-module/components/inserter/quick-inserter.js.map +1 -1
- package/build-module/components/inspector-controls/block-support-tools-panel.js +3 -2
- package/build-module/components/inspector-controls/block-support-tools-panel.js.map +1 -1
- package/build-module/components/link-control/link-preview.js +1 -1
- package/build-module/components/link-control/link-preview.js.map +1 -1
- package/build-module/components/media-placeholder/index.js +19 -23
- package/build-module/components/media-placeholder/index.js.map +1 -1
- package/build-module/components/navigable-toolbar/index.js +3 -1
- package/build-module/components/navigable-toolbar/index.js.map +1 -1
- package/build-module/components/rich-text/event-listeners/input-rules.js +1 -1
- package/build-module/components/rich-text/event-listeners/input-rules.js.map +1 -1
- package/build-module/components/rich-text/index.native.js +11 -5
- package/build-module/components/rich-text/index.native.js.map +1 -1
- package/build-module/components/rich-text/native/index.native.js +14 -0
- package/build-module/components/rich-text/native/index.native.js.map +1 -1
- package/build-module/components/spacing-sizes-control/input-controls/spacing-input-control.js +5 -1
- package/build-module/components/spacing-sizes-control/input-controls/spacing-input-control.js.map +1 -1
- package/build-module/components/tabbed-sidebar/index.js +60 -0
- package/build-module/components/tabbed-sidebar/index.js.map +1 -0
- package/build-module/components/url-popover/index.js +3 -0
- package/build-module/components/url-popover/index.js.map +1 -1
- package/build-module/hooks/background.js +26 -4
- package/build-module/hooks/background.js.map +1 -1
- package/build-module/hooks/block-hooks.js +11 -17
- package/build-module/hooks/block-hooks.js.map +1 -1
- package/build-module/hooks/block-style-variation.js +193 -11
- package/build-module/hooks/block-style-variation.js.map +1 -1
- package/build-module/hooks/duotone.js +16 -11
- package/build-module/hooks/duotone.js.map +1 -1
- package/build-module/hooks/grid-visualizer.js +64 -0
- package/build-module/hooks/grid-visualizer.js.map +1 -0
- package/build-module/hooks/index.js +3 -0
- package/build-module/hooks/index.js.map +1 -1
- package/build-module/hooks/layout-child.js +63 -38
- package/build-module/hooks/layout-child.js.map +1 -1
- package/build-module/hooks/position.js +2 -9
- package/build-module/hooks/position.js.map +1 -1
- package/build-module/hooks/use-bindings-attributes.js +16 -6
- package/build-module/hooks/use-bindings-attributes.js.map +1 -1
- package/build-module/hooks/utils.js +5 -2
- package/build-module/hooks/utils.js.map +1 -1
- package/build-module/layouts/constrained.js +44 -2
- package/build-module/layouts/constrained.js.map +1 -1
- package/build-module/layouts/grid.js +92 -76
- package/build-module/layouts/grid.js.map +1 -1
- package/build-module/lock-unlock.js +1 -1
- package/build-module/lock-unlock.js.map +1 -1
- package/build-module/private-apis.js +8 -3
- package/build-module/private-apis.js.map +1 -1
- package/build-module/store/actions.js +17 -1
- package/build-module/store/actions.js.map +1 -1
- package/build-module/store/defaults.js +0 -2
- package/build-module/store/defaults.js.map +1 -1
- package/build-module/store/defaults.native.js +0 -3
- package/build-module/store/defaults.native.js.map +1 -1
- package/build-module/store/private-keys.js +1 -0
- package/build-module/store/private-keys.js.map +1 -1
- package/build-module/utils/format-font-style.js +39 -0
- package/build-module/utils/format-font-style.js.map +1 -0
- package/build-module/utils/format-font-weight.js +62 -0
- package/build-module/utils/format-font-weight.js.map +1 -0
- package/build-module/utils/get-editor-region.js +28 -0
- package/build-module/utils/get-editor-region.js.map +1 -0
- package/build-module/utils/get-font-styles-and-weights.js +160 -0
- package/build-module/utils/get-font-styles-and-weights.js.map +1 -0
- package/build-module/utils/pasting.js +5 -13
- package/build-module/utils/pasting.js.map +1 -1
- package/build-style/content-rtl.css +1 -0
- package/build-style/content.css +1 -0
- package/build-style/style-rtl.css +238 -106
- package/build-style/style.css +238 -106
- package/package.json +32 -32
- package/src/components/block-breadcrumb/index.js +16 -1
- package/src/components/block-lock/modal.js +95 -82
- package/src/components/block-lock/style.scss +11 -1
- package/src/components/block-lock/toolbar.js +0 -1
- package/src/components/block-mover/button.js +1 -1
- package/src/components/block-mover/index.js +37 -24
- package/src/components/block-pattern-setup/setup-toolbar.js +2 -2
- package/src/components/block-patterns-paging/index.js +8 -11
- package/src/components/block-patterns-paging/style.scss +18 -0
- package/src/components/block-quick-navigation/index.js +21 -28
- package/src/components/block-rename/modal.js +2 -8
- package/src/components/block-switcher/test/index.js +6 -6
- package/src/components/block-toolbar/shuffle.js +4 -1
- package/src/components/block-toolbar/style.scss +1 -11
- package/src/components/block-tools/block-selection-button.js +11 -83
- package/src/components/block-tools/block-toolbar-breadcrumb.js +9 -4
- package/src/components/block-tools/index.js +21 -1
- package/src/components/block-tools/style.scss +15 -0
- package/src/components/block-tools/use-show-block-tools.js +14 -6
- package/src/components/block-tools/zoom-out-mode-inserters.js +5 -4
- package/src/components/block-tools/zoom-out-popover.js +49 -0
- package/src/components/block-tools/zoom-out-toolbar.js +140 -0
- package/src/components/button-block-appender/index.js +2 -1
- package/src/components/child-layout-control/index.js +243 -160
- package/src/components/date-format-picker/index.js +10 -1
- package/src/components/date-format-picker/style.scss +0 -9
- package/src/components/dimensions-tool/index.js +97 -89
- package/src/components/font-appearance-control/index.js +29 -83
- package/src/components/font-appearance-control/style.scss +3 -5
- package/src/components/global-styles/background-panel.js +249 -170
- package/src/components/global-styles/border-panel.js +3 -2
- package/src/components/global-styles/color-panel.js +3 -2
- package/src/components/global-styles/dimensions-panel.js +3 -2
- package/src/components/global-styles/filters-panel.js +3 -2
- package/src/components/global-styles/hooks.js +9 -0
- package/src/components/global-styles/image-settings-panel.js +3 -2
- package/src/components/global-styles/style.scss +105 -20
- package/src/components/global-styles/test/typography-utils.js +269 -0
- package/src/components/global-styles/test/use-global-styles-output.js +38 -3
- package/src/components/global-styles/typography-panel.js +49 -12
- package/src/components/global-styles/typography-utils.js +63 -0
- package/src/components/global-styles/use-global-styles-output.js +25 -9
- package/src/components/global-styles/utils.js +17 -6
- package/src/components/grid/grid-item-movers.js +112 -0
- package/src/components/{grid-visualizer → grid}/grid-item-resizer.js +15 -52
- package/src/components/grid/grid-visualizer.js +384 -0
- package/src/components/grid/index.js +4 -0
- package/src/components/grid/style.scss +98 -0
- package/src/components/grid/use-get-number-of-blocks-before-cell.js +30 -0
- package/src/components/grid/use-grid-layout-sync.js +170 -0
- package/src/components/grid/utils.js +178 -0
- package/src/components/iframe/content.scss +1 -0
- package/src/components/image-editor/aspect-ratio-dropdown.js +0 -1
- package/src/components/inner-blocks/index.js +4 -1
- package/src/components/inserter/block-patterns-tab/pattern-category-preview-panel.js +1 -16
- package/src/components/inserter/menu.js +47 -13
- package/src/components/inserter/quick-inserter.js +6 -1
- package/src/components/inserter/style.scss +1 -49
- package/src/components/inspector-controls/block-support-tools-panel.js +3 -3
- package/src/components/link-control/link-preview.js +1 -1
- package/src/components/media-placeholder/index.js +22 -32
- package/src/components/navigable-toolbar/index.js +3 -1
- package/src/components/rich-text/event-listeners/input-rules.js +1 -1
- package/src/components/rich-text/index.native.js +10 -8
- package/src/components/rich-text/native/index.native.js +17 -0
- package/src/components/spacing-sizes-control/input-controls/spacing-input-control.js +6 -1
- package/src/components/tabbed-sidebar/README.md +76 -0
- package/src/components/tabbed-sidebar/index.js +70 -0
- package/src/components/tabbed-sidebar/style.scss +53 -0
- package/src/components/url-popover/index.js +3 -0
- package/src/hooks/background.js +25 -10
- package/src/hooks/block-hooks.js +9 -16
- package/src/hooks/block-style-variation.js +226 -9
- package/src/hooks/duotone.js +16 -12
- package/src/hooks/grid-visualizer.js +64 -0
- package/src/hooks/index.js +3 -0
- package/src/hooks/layout-child.js +75 -39
- package/src/hooks/position.js +3 -10
- package/src/hooks/test/get-variation-styles-with-ref-values.js +91 -0
- package/src/hooks/use-bindings-attributes.js +18 -4
- package/src/hooks/utils.js +5 -1
- package/src/layouts/constrained.js +43 -2
- package/src/layouts/grid.js +175 -88
- package/src/lock-unlock.js +1 -1
- package/src/private-apis.js +12 -1
- package/src/store/actions.js +21 -1
- package/src/store/defaults.js +0 -2
- package/src/store/defaults.native.js +0 -3
- package/src/store/private-keys.js +1 -0
- package/src/style.scss +2 -2
- package/src/utils/format-font-style.js +40 -0
- package/src/utils/format-font-weight.js +63 -0
- package/src/utils/get-editor-region.js +31 -0
- package/src/utils/get-font-styles-and-weights.js +191 -0
- package/src/utils/pasting.js +5 -12
- package/src/utils/test/format-font-style.js +34 -0
- package/src/utils/test/format-font-weight.js +66 -0
- package/src/utils/test/get-font-styles-and-weights.js +513 -0
- package/tsconfig.tsbuildinfo +1 -1
- package/build/components/grid-visualizer/grid-item-resizer.js.map +0 -1
- package/build/components/grid-visualizer/grid-visualizer.js +0 -92
- package/build/components/grid-visualizer/grid-visualizer.js.map +0 -1
- package/build/components/grid-visualizer/index.js.map +0 -1
- package/build/components/grid-visualizer/utils.js +0 -10
- package/build/components/grid-visualizer/utils.js.map +0 -1
- package/build-module/components/grid-visualizer/grid-item-resizer.js.map +0 -1
- package/build-module/components/grid-visualizer/grid-visualizer.js +0 -84
- package/build-module/components/grid-visualizer/grid-visualizer.js.map +0 -1
- package/build-module/components/grid-visualizer/index.js +0 -3
- package/build-module/components/grid-visualizer/index.js.map +0 -1
- package/build-module/components/grid-visualizer/utils.js +0 -4
- package/build-module/components/grid-visualizer/utils.js.map +0 -1
- package/src/components/grid-visualizer/grid-visualizer.js +0 -101
- package/src/components/grid-visualizer/index.js +0 -2
- package/src/components/grid-visualizer/style.scss +0 -34
- package/src/components/grid-visualizer/utils.js +0 -5
- package/src/hooks/position.scss +0 -18
- /package/src/components/font-sizes/{README.MD → README.md} +0 -0
|
@@ -0,0 +1,305 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
Object.defineProperty(exports, "__esModule", {
|
|
5
|
+
value: true
|
|
6
|
+
});
|
|
7
|
+
exports.GridVisualizer = GridVisualizer;
|
|
8
|
+
var _clsx = _interopRequireDefault(require("clsx"));
|
|
9
|
+
var _element = require("@wordpress/element");
|
|
10
|
+
var _data = require("@wordpress/data");
|
|
11
|
+
var _compose = require("@wordpress/compose");
|
|
12
|
+
var _useBlockRefs = require("../block-list/use-block-props/use-block-refs");
|
|
13
|
+
var _cover = _interopRequireDefault(require("../block-popover/cover"));
|
|
14
|
+
var _utils = require("./utils");
|
|
15
|
+
var _store = require("../../store");
|
|
16
|
+
var _useGetNumberOfBlocksBeforeCell = require("./use-get-number-of-blocks-before-cell");
|
|
17
|
+
var _buttonBlockAppender = _interopRequireDefault(require("../button-block-appender"));
|
|
18
|
+
var _jsxRuntime = require("react/jsx-runtime");
|
|
19
|
+
/**
|
|
20
|
+
* External dependencies
|
|
21
|
+
*/
|
|
22
|
+
|
|
23
|
+
/**
|
|
24
|
+
* WordPress dependencies
|
|
25
|
+
*/
|
|
26
|
+
|
|
27
|
+
/**
|
|
28
|
+
* Internal dependencies
|
|
29
|
+
*/
|
|
30
|
+
|
|
31
|
+
function GridVisualizer({
|
|
32
|
+
clientId,
|
|
33
|
+
contentRef,
|
|
34
|
+
parentLayout
|
|
35
|
+
}) {
|
|
36
|
+
const isDistractionFree = (0, _data.useSelect)(select => select(_store.store).getSettings().isDistractionFree, []);
|
|
37
|
+
const gridElement = (0, _useBlockRefs.__unstableUseBlockElement)(clientId);
|
|
38
|
+
if (isDistractionFree || !gridElement) {
|
|
39
|
+
return null;
|
|
40
|
+
}
|
|
41
|
+
const isManualGrid = parentLayout?.isManualPlacement && window.__experimentalEnableGridInteractivity;
|
|
42
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(GridVisualizerGrid, {
|
|
43
|
+
gridClientId: clientId,
|
|
44
|
+
gridElement: gridElement,
|
|
45
|
+
isManualGrid: isManualGrid,
|
|
46
|
+
ref: contentRef
|
|
47
|
+
});
|
|
48
|
+
}
|
|
49
|
+
const GridVisualizerGrid = (0, _element.forwardRef)(({
|
|
50
|
+
gridClientId,
|
|
51
|
+
gridElement,
|
|
52
|
+
isManualGrid
|
|
53
|
+
}, ref) => {
|
|
54
|
+
const [gridInfo, setGridInfo] = (0, _element.useState)(() => (0, _utils.getGridInfo)(gridElement));
|
|
55
|
+
const [isDroppingAllowed, setIsDroppingAllowed] = (0, _element.useState)(false);
|
|
56
|
+
(0, _element.useEffect)(() => {
|
|
57
|
+
const observers = [];
|
|
58
|
+
for (const element of [gridElement, ...gridElement.children]) {
|
|
59
|
+
const observer = new window.ResizeObserver(() => {
|
|
60
|
+
setGridInfo((0, _utils.getGridInfo)(gridElement));
|
|
61
|
+
});
|
|
62
|
+
observer.observe(element);
|
|
63
|
+
observers.push(observer);
|
|
64
|
+
}
|
|
65
|
+
return () => {
|
|
66
|
+
for (const observer of observers) {
|
|
67
|
+
observer.disconnect();
|
|
68
|
+
}
|
|
69
|
+
};
|
|
70
|
+
}, [gridElement]);
|
|
71
|
+
(0, _element.useEffect)(() => {
|
|
72
|
+
function onGlobalDrag() {
|
|
73
|
+
setIsDroppingAllowed(true);
|
|
74
|
+
}
|
|
75
|
+
function onGlobalDragEnd() {
|
|
76
|
+
setIsDroppingAllowed(false);
|
|
77
|
+
}
|
|
78
|
+
document.addEventListener('drag', onGlobalDrag);
|
|
79
|
+
document.addEventListener('dragend', onGlobalDragEnd);
|
|
80
|
+
return () => {
|
|
81
|
+
document.removeEventListener('drag', onGlobalDrag);
|
|
82
|
+
document.removeEventListener('dragend', onGlobalDragEnd);
|
|
83
|
+
};
|
|
84
|
+
}, []);
|
|
85
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_cover.default, {
|
|
86
|
+
className: (0, _clsx.default)('block-editor-grid-visualizer', {
|
|
87
|
+
'is-dropping-allowed': isDroppingAllowed
|
|
88
|
+
}),
|
|
89
|
+
clientId: gridClientId,
|
|
90
|
+
__unstablePopoverSlot: "block-toolbar",
|
|
91
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
|
|
92
|
+
ref: ref,
|
|
93
|
+
className: "block-editor-grid-visualizer__grid",
|
|
94
|
+
style: gridInfo.style,
|
|
95
|
+
children: isManualGrid ? /*#__PURE__*/(0, _jsxRuntime.jsx)(ManualGridVisualizer, {
|
|
96
|
+
gridClientId: gridClientId,
|
|
97
|
+
gridInfo: gridInfo
|
|
98
|
+
}) : Array.from({
|
|
99
|
+
length: gridInfo.numItems
|
|
100
|
+
}, (_, i) => /*#__PURE__*/(0, _jsxRuntime.jsx)(GridVisualizerCell, {
|
|
101
|
+
color: gridInfo.currentColor
|
|
102
|
+
}, i))
|
|
103
|
+
})
|
|
104
|
+
});
|
|
105
|
+
});
|
|
106
|
+
function ManualGridVisualizer({
|
|
107
|
+
gridClientId,
|
|
108
|
+
gridInfo
|
|
109
|
+
}) {
|
|
110
|
+
const [highlightedRect, setHighlightedRect] = (0, _element.useState)(null);
|
|
111
|
+
const gridItems = (0, _data.useSelect)(select => select(_store.store).getBlocks(gridClientId), [gridClientId]);
|
|
112
|
+
const occupiedRects = (0, _element.useMemo)(() => {
|
|
113
|
+
const rects = [];
|
|
114
|
+
for (const block of gridItems) {
|
|
115
|
+
const {
|
|
116
|
+
columnStart,
|
|
117
|
+
rowStart,
|
|
118
|
+
columnSpan = 1,
|
|
119
|
+
rowSpan = 1
|
|
120
|
+
} = block.attributes.style?.layout || {};
|
|
121
|
+
if (!columnStart || !rowStart) {
|
|
122
|
+
continue;
|
|
123
|
+
}
|
|
124
|
+
rects.push(new _utils.GridRect({
|
|
125
|
+
columnStart,
|
|
126
|
+
rowStart,
|
|
127
|
+
columnSpan,
|
|
128
|
+
rowSpan
|
|
129
|
+
}));
|
|
130
|
+
}
|
|
131
|
+
return rects;
|
|
132
|
+
}, [gridItems]);
|
|
133
|
+
return (0, _utils.range)(1, gridInfo.numRows).map(row => (0, _utils.range)(1, gridInfo.numColumns).map(column => {
|
|
134
|
+
var _highlightedRect$cont;
|
|
135
|
+
const isCellOccupied = occupiedRects.some(rect => rect.contains(column, row));
|
|
136
|
+
const isHighlighted = (_highlightedRect$cont = highlightedRect?.contains(column, row)) !== null && _highlightedRect$cont !== void 0 ? _highlightedRect$cont : false;
|
|
137
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(GridVisualizerCell, {
|
|
138
|
+
color: gridInfo.currentColor,
|
|
139
|
+
className: isHighlighted && 'is-highlighted',
|
|
140
|
+
children: isCellOccupied ? /*#__PURE__*/(0, _jsxRuntime.jsx)(GridVisualizerDropZone, {
|
|
141
|
+
column: column,
|
|
142
|
+
row: row,
|
|
143
|
+
gridClientId: gridClientId,
|
|
144
|
+
gridInfo: gridInfo,
|
|
145
|
+
setHighlightedRect: setHighlightedRect
|
|
146
|
+
}) : /*#__PURE__*/(0, _jsxRuntime.jsx)(GridVisualizerAppender, {
|
|
147
|
+
column: column,
|
|
148
|
+
row: row,
|
|
149
|
+
gridClientId: gridClientId,
|
|
150
|
+
gridInfo: gridInfo,
|
|
151
|
+
setHighlightedRect: setHighlightedRect
|
|
152
|
+
})
|
|
153
|
+
}, `${row}-${column}`);
|
|
154
|
+
}));
|
|
155
|
+
}
|
|
156
|
+
function GridVisualizerCell({
|
|
157
|
+
color,
|
|
158
|
+
children,
|
|
159
|
+
className
|
|
160
|
+
}) {
|
|
161
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
|
|
162
|
+
className: (0, _clsx.default)('block-editor-grid-visualizer__cell', className),
|
|
163
|
+
style: {
|
|
164
|
+
boxShadow: `inset 0 0 0 1px color-mix(in srgb, ${color} 20%, #0000)`,
|
|
165
|
+
color
|
|
166
|
+
},
|
|
167
|
+
children: children
|
|
168
|
+
});
|
|
169
|
+
}
|
|
170
|
+
function useGridVisualizerDropZone(column, row, gridClientId, gridInfo, setHighlightedRect) {
|
|
171
|
+
const {
|
|
172
|
+
getBlockAttributes,
|
|
173
|
+
getBlockRootClientId
|
|
174
|
+
} = (0, _data.useSelect)(_store.store);
|
|
175
|
+
const {
|
|
176
|
+
updateBlockAttributes,
|
|
177
|
+
moveBlocksToPosition,
|
|
178
|
+
__unstableMarkNextChangeAsNotPersistent
|
|
179
|
+
} = (0, _data.useDispatch)(_store.store);
|
|
180
|
+
const getNumberOfBlocksBeforeCell = (0, _useGetNumberOfBlocksBeforeCell.useGetNumberOfBlocksBeforeCell)(gridClientId, gridInfo.numColumns);
|
|
181
|
+
return useDropZoneWithValidation({
|
|
182
|
+
validateDrag(srcClientId) {
|
|
183
|
+
const attributes = getBlockAttributes(srcClientId);
|
|
184
|
+
const rect = new _utils.GridRect({
|
|
185
|
+
columnStart: column,
|
|
186
|
+
rowStart: row,
|
|
187
|
+
columnSpan: attributes.style?.layout?.columnSpan,
|
|
188
|
+
rowSpan: attributes.style?.layout?.rowSpan
|
|
189
|
+
});
|
|
190
|
+
const isInBounds = new _utils.GridRect({
|
|
191
|
+
columnSpan: gridInfo.numColumns,
|
|
192
|
+
rowSpan: gridInfo.numRows
|
|
193
|
+
}).containsRect(rect);
|
|
194
|
+
return isInBounds;
|
|
195
|
+
},
|
|
196
|
+
onDragEnter(srcClientId) {
|
|
197
|
+
const attributes = getBlockAttributes(srcClientId);
|
|
198
|
+
setHighlightedRect(new _utils.GridRect({
|
|
199
|
+
columnStart: column,
|
|
200
|
+
rowStart: row,
|
|
201
|
+
columnSpan: attributes.style?.layout?.columnSpan,
|
|
202
|
+
rowSpan: attributes.style?.layout?.rowSpan
|
|
203
|
+
}));
|
|
204
|
+
},
|
|
205
|
+
onDragLeave() {
|
|
206
|
+
// onDragEnter can be called before onDragLeave if the user moves
|
|
207
|
+
// their mouse quickly, so only clear the highlight if it was set
|
|
208
|
+
// by this cell.
|
|
209
|
+
setHighlightedRect(prevHighlightedRect => prevHighlightedRect?.columnStart === column && prevHighlightedRect?.rowStart === row ? null : prevHighlightedRect);
|
|
210
|
+
},
|
|
211
|
+
onDrop(srcClientId) {
|
|
212
|
+
setHighlightedRect(null);
|
|
213
|
+
const attributes = getBlockAttributes(srcClientId);
|
|
214
|
+
updateBlockAttributes(srcClientId, {
|
|
215
|
+
style: {
|
|
216
|
+
...attributes.style,
|
|
217
|
+
layout: {
|
|
218
|
+
...attributes.style?.layout,
|
|
219
|
+
columnStart: column,
|
|
220
|
+
rowStart: row
|
|
221
|
+
}
|
|
222
|
+
}
|
|
223
|
+
});
|
|
224
|
+
__unstableMarkNextChangeAsNotPersistent();
|
|
225
|
+
moveBlocksToPosition([srcClientId], getBlockRootClientId(srcClientId), gridClientId, getNumberOfBlocksBeforeCell(column, row));
|
|
226
|
+
}
|
|
227
|
+
});
|
|
228
|
+
}
|
|
229
|
+
function GridVisualizerDropZone({
|
|
230
|
+
column,
|
|
231
|
+
row,
|
|
232
|
+
gridClientId,
|
|
233
|
+
gridInfo,
|
|
234
|
+
setHighlightedRect
|
|
235
|
+
}) {
|
|
236
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
|
|
237
|
+
className: "block-editor-grid-visualizer__drop-zone",
|
|
238
|
+
ref: useGridVisualizerDropZone(column, row, gridClientId, gridInfo, setHighlightedRect)
|
|
239
|
+
});
|
|
240
|
+
}
|
|
241
|
+
function GridVisualizerAppender({
|
|
242
|
+
column,
|
|
243
|
+
row,
|
|
244
|
+
gridClientId,
|
|
245
|
+
gridInfo,
|
|
246
|
+
setHighlightedRect
|
|
247
|
+
}) {
|
|
248
|
+
const {
|
|
249
|
+
updateBlockAttributes,
|
|
250
|
+
moveBlocksToPosition,
|
|
251
|
+
__unstableMarkNextChangeAsNotPersistent
|
|
252
|
+
} = (0, _data.useDispatch)(_store.store);
|
|
253
|
+
const getNumberOfBlocksBeforeCell = (0, _useGetNumberOfBlocksBeforeCell.useGetNumberOfBlocksBeforeCell)(gridClientId, gridInfo.numColumns);
|
|
254
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_buttonBlockAppender.default, {
|
|
255
|
+
rootClientId: gridClientId,
|
|
256
|
+
className: "block-editor-grid-visualizer__appender",
|
|
257
|
+
ref: useGridVisualizerDropZone(column, row, gridClientId, gridInfo, setHighlightedRect),
|
|
258
|
+
style: {
|
|
259
|
+
color: gridInfo.currentColor
|
|
260
|
+
},
|
|
261
|
+
onSelect: block => {
|
|
262
|
+
if (!block) {
|
|
263
|
+
return;
|
|
264
|
+
}
|
|
265
|
+
updateBlockAttributes(block.clientId, {
|
|
266
|
+
style: {
|
|
267
|
+
layout: {
|
|
268
|
+
columnStart: column,
|
|
269
|
+
rowStart: row
|
|
270
|
+
}
|
|
271
|
+
}
|
|
272
|
+
});
|
|
273
|
+
__unstableMarkNextChangeAsNotPersistent();
|
|
274
|
+
moveBlocksToPosition([block.clientId], gridClientId, gridClientId, getNumberOfBlocksBeforeCell(column, row));
|
|
275
|
+
}
|
|
276
|
+
});
|
|
277
|
+
}
|
|
278
|
+
function useDropZoneWithValidation({
|
|
279
|
+
validateDrag,
|
|
280
|
+
onDragEnter,
|
|
281
|
+
onDragLeave,
|
|
282
|
+
onDrop
|
|
283
|
+
}) {
|
|
284
|
+
const {
|
|
285
|
+
getDraggedBlockClientIds
|
|
286
|
+
} = (0, _data.useSelect)(_store.store);
|
|
287
|
+
return (0, _compose.__experimentalUseDropZone)({
|
|
288
|
+
onDragEnter() {
|
|
289
|
+
const [srcClientId] = getDraggedBlockClientIds();
|
|
290
|
+
if (srcClientId && validateDrag(srcClientId)) {
|
|
291
|
+
onDragEnter(srcClientId);
|
|
292
|
+
}
|
|
293
|
+
},
|
|
294
|
+
onDragLeave() {
|
|
295
|
+
onDragLeave();
|
|
296
|
+
},
|
|
297
|
+
onDrop() {
|
|
298
|
+
const [srcClientId] = getDraggedBlockClientIds();
|
|
299
|
+
if (srcClientId && validateDrag(srcClientId)) {
|
|
300
|
+
onDrop(srcClientId);
|
|
301
|
+
}
|
|
302
|
+
}
|
|
303
|
+
});
|
|
304
|
+
}
|
|
305
|
+
//# sourceMappingURL=grid-visualizer.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["_clsx","_interopRequireDefault","require","_element","_data","_compose","_useBlockRefs","_cover","_utils","_store","_useGetNumberOfBlocksBeforeCell","_buttonBlockAppender","_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","observers","element","children","observer","ResizeObserver","observe","push","disconnect","onGlobalDrag","onGlobalDragEnd","document","addEventListener","removeEventListener","default","className","clsx","__unstablePopoverSlot","style","ManualGridVisualizer","Array","from","length","numItems","_","i","GridVisualizerCell","color","currentColor","highlightedRect","setHighlightedRect","gridItems","getBlocks","occupiedRects","useMemo","rects","block","columnStart","rowStart","columnSpan","rowSpan","attributes","layout","GridRect","range","numRows","map","row","numColumns","column","_highlightedRect$cont","isCellOccupied","some","rect","contains","isHighlighted","GridVisualizerDropZone","GridVisualizerAppender","boxShadow","useGridVisualizerDropZone","getBlockAttributes","getBlockRootClientId","updateBlockAttributes","moveBlocksToPosition","__unstableMarkNextChangeAsNotPersistent","useDispatch","getNumberOfBlocksBeforeCell","useGetNumberOfBlocksBeforeCell","useDropZoneWithValidation","validateDrag","srcClientId","isInBounds","containsRect","onDragEnter","onDragLeave","prevHighlightedRect","onDrop","rootClientId","onSelect","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 { __unstableUseBlockElement as 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';\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 observers = [];\n\t\t\tfor ( const element of [ gridElement, ...gridElement.children ] ) {\n\t\t\t\tconst observer = new window.ResizeObserver( () => {\n\t\t\t\t\tsetGridInfo( getGridInfo( gridElement ) );\n\t\t\t\t} );\n\t\t\t\tobserver.observe( element );\n\t\t\t\tobservers.push( observer );\n\t\t\t}\n\t\t\treturn () => {\n\t\t\t\tfor ( const observer of observers ) {\n\t\t\t\t\tobserver.disconnect();\n\t\t\t\t}\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=\"block-toolbar\"\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 gridItems = useSelect(\n\t\t( select ) => select( blockEditorStore ).getBlocks( gridClientId ),\n\t\t[ gridClientId ]\n\t);\n\tconst occupiedRects = useMemo( () => {\n\t\tconst rects = [];\n\t\tfor ( const block of gridItems ) {\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} = block.attributes.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}, [ gridItems ] );\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 { getBlockAttributes, getBlockRootClientId } =\n\t\tuseSelect( 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 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":[]}
|
|
@@ -3,6 +3,12 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
+
Object.defineProperty(exports, "GridItemMovers", {
|
|
7
|
+
enumerable: true,
|
|
8
|
+
get: function () {
|
|
9
|
+
return _gridItemMovers.GridItemMovers;
|
|
10
|
+
}
|
|
11
|
+
});
|
|
6
12
|
Object.defineProperty(exports, "GridItemResizer", {
|
|
7
13
|
enumerable: true,
|
|
8
14
|
get: function () {
|
|
@@ -15,6 +21,14 @@ Object.defineProperty(exports, "GridVisualizer", {
|
|
|
15
21
|
return _gridVisualizer.GridVisualizer;
|
|
16
22
|
}
|
|
17
23
|
});
|
|
24
|
+
Object.defineProperty(exports, "useGridLayoutSync", {
|
|
25
|
+
enumerable: true,
|
|
26
|
+
get: function () {
|
|
27
|
+
return _useGridLayoutSync.useGridLayoutSync;
|
|
28
|
+
}
|
|
29
|
+
});
|
|
18
30
|
var _gridVisualizer = require("./grid-visualizer");
|
|
19
31
|
var _gridItemResizer = require("./grid-item-resizer");
|
|
32
|
+
var _gridItemMovers = require("./grid-item-movers");
|
|
33
|
+
var _useGridLayoutSync = require("./use-grid-layout-sync");
|
|
20
34
|
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"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":[]}
|
|
@@ -0,0 +1,40 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.useGetNumberOfBlocksBeforeCell = useGetNumberOfBlocksBeforeCell;
|
|
7
|
+
var _data = require("@wordpress/data");
|
|
8
|
+
var _store = require("../../store");
|
|
9
|
+
/**
|
|
10
|
+
* WordPress dependencies
|
|
11
|
+
*/
|
|
12
|
+
|
|
13
|
+
/**
|
|
14
|
+
* Internal dependencies
|
|
15
|
+
*/
|
|
16
|
+
|
|
17
|
+
function useGetNumberOfBlocksBeforeCell(gridClientId, numColumns) {
|
|
18
|
+
const {
|
|
19
|
+
getBlockOrder,
|
|
20
|
+
getBlockAttributes
|
|
21
|
+
} = (0, _data.useSelect)(_store.store);
|
|
22
|
+
const getNumberOfBlocksBeforeCell = (column, row) => {
|
|
23
|
+
const targetIndex = (row - 1) * numColumns + column - 1;
|
|
24
|
+
let count = 0;
|
|
25
|
+
for (const clientId of getBlockOrder(gridClientId)) {
|
|
26
|
+
var _getBlockAttributes$s;
|
|
27
|
+
const {
|
|
28
|
+
columnStart,
|
|
29
|
+
rowStart
|
|
30
|
+
} = (_getBlockAttributes$s = getBlockAttributes(clientId).style?.layout) !== null && _getBlockAttributes$s !== void 0 ? _getBlockAttributes$s : {};
|
|
31
|
+
const cellIndex = (rowStart - 1) * numColumns + columnStart - 1;
|
|
32
|
+
if (cellIndex < targetIndex) {
|
|
33
|
+
count++;
|
|
34
|
+
}
|
|
35
|
+
}
|
|
36
|
+
return count;
|
|
37
|
+
};
|
|
38
|
+
return getNumberOfBlocksBeforeCell;
|
|
39
|
+
}
|
|
40
|
+
//# sourceMappingURL=use-get-number-of-blocks-before-cell.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"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":[]}
|
|
@@ -0,0 +1,169 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.useGridLayoutSync = useGridLayoutSync;
|
|
7
|
+
var _data = require("@wordpress/data");
|
|
8
|
+
var _element = require("@wordpress/element");
|
|
9
|
+
var _store = require("../../store");
|
|
10
|
+
var _utils = require("./utils");
|
|
11
|
+
/**
|
|
12
|
+
* WordPress dependencies
|
|
13
|
+
*/
|
|
14
|
+
|
|
15
|
+
/**
|
|
16
|
+
* Internal dependencies
|
|
17
|
+
*/
|
|
18
|
+
|
|
19
|
+
function useGridLayoutSync({
|
|
20
|
+
clientId: gridClientId
|
|
21
|
+
}) {
|
|
22
|
+
const {
|
|
23
|
+
gridLayout,
|
|
24
|
+
blockOrder
|
|
25
|
+
} = (0, _data.useSelect)(select => {
|
|
26
|
+
var _getBlockAttributes$l;
|
|
27
|
+
const {
|
|
28
|
+
getBlockAttributes,
|
|
29
|
+
getBlockOrder
|
|
30
|
+
} = select(_store.store);
|
|
31
|
+
return {
|
|
32
|
+
gridLayout: (_getBlockAttributes$l = getBlockAttributes(gridClientId).layout) !== null && _getBlockAttributes$l !== void 0 ? _getBlockAttributes$l : {},
|
|
33
|
+
blockOrder: getBlockOrder(gridClientId)
|
|
34
|
+
};
|
|
35
|
+
}, [gridClientId]);
|
|
36
|
+
const {
|
|
37
|
+
getBlockAttributes
|
|
38
|
+
} = (0, _data.useSelect)(_store.store);
|
|
39
|
+
const {
|
|
40
|
+
updateBlockAttributes,
|
|
41
|
+
__unstableMarkNextChangeAsNotPersistent
|
|
42
|
+
} = (0, _data.useDispatch)(_store.store);
|
|
43
|
+
(0, _element.useEffect)(() => {
|
|
44
|
+
const updates = {};
|
|
45
|
+
const {
|
|
46
|
+
columnCount,
|
|
47
|
+
rowCount,
|
|
48
|
+
isManualPlacement
|
|
49
|
+
} = gridLayout;
|
|
50
|
+
if (isManualPlacement) {
|
|
51
|
+
const rects = [];
|
|
52
|
+
|
|
53
|
+
// Respect the position of blocks that already have a columnStart and rowStart value.
|
|
54
|
+
for (const clientId of blockOrder) {
|
|
55
|
+
const attributes = getBlockAttributes(clientId);
|
|
56
|
+
const {
|
|
57
|
+
columnStart,
|
|
58
|
+
rowStart,
|
|
59
|
+
columnSpan = 1,
|
|
60
|
+
rowSpan = 1
|
|
61
|
+
} = attributes.style?.layout || {};
|
|
62
|
+
if (!columnStart || !rowStart) {
|
|
63
|
+
continue;
|
|
64
|
+
}
|
|
65
|
+
rects.push(new _utils.GridRect({
|
|
66
|
+
columnStart,
|
|
67
|
+
rowStart,
|
|
68
|
+
columnSpan,
|
|
69
|
+
rowSpan
|
|
70
|
+
}));
|
|
71
|
+
}
|
|
72
|
+
|
|
73
|
+
// When in manual mode, ensure that every block has a columnStart and rowStart value.
|
|
74
|
+
for (const clientId of blockOrder) {
|
|
75
|
+
const attributes = getBlockAttributes(clientId);
|
|
76
|
+
const {
|
|
77
|
+
columnStart,
|
|
78
|
+
rowStart,
|
|
79
|
+
columnSpan = 1,
|
|
80
|
+
rowSpan = 1
|
|
81
|
+
} = attributes.style?.layout || {};
|
|
82
|
+
if (columnStart && rowStart) {
|
|
83
|
+
continue;
|
|
84
|
+
}
|
|
85
|
+
const [newColumnStart, newRowStart] = getFirstEmptyCell(rects, columnCount, columnSpan, rowSpan);
|
|
86
|
+
rects.push(new _utils.GridRect({
|
|
87
|
+
columnStart: newColumnStart,
|
|
88
|
+
rowStart: newRowStart,
|
|
89
|
+
columnSpan,
|
|
90
|
+
rowSpan
|
|
91
|
+
}));
|
|
92
|
+
updates[clientId] = {
|
|
93
|
+
style: {
|
|
94
|
+
...attributes.style,
|
|
95
|
+
layout: {
|
|
96
|
+
...attributes.style?.layout,
|
|
97
|
+
columnStart: newColumnStart,
|
|
98
|
+
rowStart: newRowStart
|
|
99
|
+
}
|
|
100
|
+
}
|
|
101
|
+
};
|
|
102
|
+
}
|
|
103
|
+
|
|
104
|
+
// Ensure there's enough rows to fit all blocks.
|
|
105
|
+
const bottomMostRow = Math.max(...rects.map(r => r.rowEnd));
|
|
106
|
+
if (!rowCount || rowCount < bottomMostRow) {
|
|
107
|
+
updates[gridClientId] = {
|
|
108
|
+
layout: {
|
|
109
|
+
...gridLayout,
|
|
110
|
+
rowCount: bottomMostRow
|
|
111
|
+
}
|
|
112
|
+
};
|
|
113
|
+
}
|
|
114
|
+
} else {
|
|
115
|
+
// When in auto mode, remove all of the columnStart and rowStart values.
|
|
116
|
+
for (const clientId of blockOrder) {
|
|
117
|
+
const attributes = getBlockAttributes(clientId);
|
|
118
|
+
const {
|
|
119
|
+
columnStart,
|
|
120
|
+
rowStart,
|
|
121
|
+
...layout
|
|
122
|
+
} = attributes.style?.layout || {};
|
|
123
|
+
// Only update attributes if columnStart or rowStart are set.
|
|
124
|
+
if (columnStart || rowStart) {
|
|
125
|
+
updates[clientId] = {
|
|
126
|
+
style: {
|
|
127
|
+
...attributes.style,
|
|
128
|
+
layout
|
|
129
|
+
}
|
|
130
|
+
};
|
|
131
|
+
}
|
|
132
|
+
}
|
|
133
|
+
|
|
134
|
+
// Remove row styles in auto mode
|
|
135
|
+
if (rowCount) {
|
|
136
|
+
updates[gridClientId] = {
|
|
137
|
+
layout: {
|
|
138
|
+
...gridLayout,
|
|
139
|
+
rowCount: undefined
|
|
140
|
+
}
|
|
141
|
+
};
|
|
142
|
+
}
|
|
143
|
+
}
|
|
144
|
+
if (Object.keys(updates).length) {
|
|
145
|
+
__unstableMarkNextChangeAsNotPersistent();
|
|
146
|
+
updateBlockAttributes(Object.keys(updates), updates, /* uniqueByBlock: */true);
|
|
147
|
+
}
|
|
148
|
+
}, [
|
|
149
|
+
// Actual deps to sync:
|
|
150
|
+
gridClientId, gridLayout, blockOrder,
|
|
151
|
+
// Needed for linter:
|
|
152
|
+
__unstableMarkNextChangeAsNotPersistent, getBlockAttributes, updateBlockAttributes]);
|
|
153
|
+
}
|
|
154
|
+
function getFirstEmptyCell(rects, columnCount, columnSpan = 1, rowSpan = 1) {
|
|
155
|
+
for (let row = 1;; row++) {
|
|
156
|
+
for (let column = 1; column <= columnCount; column++) {
|
|
157
|
+
const rect = new _utils.GridRect({
|
|
158
|
+
columnStart: column,
|
|
159
|
+
rowStart: row,
|
|
160
|
+
columnSpan,
|
|
161
|
+
rowSpan
|
|
162
|
+
});
|
|
163
|
+
if (!rects.some(r => r.intersectsRect(rect))) {
|
|
164
|
+
return [column, row];
|
|
165
|
+
}
|
|
166
|
+
}
|
|
167
|
+
}
|
|
168
|
+
}
|
|
169
|
+
//# sourceMappingURL=use-grid-layout-sync.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["_data","require","_element","_store","_utils","useGridLayoutSync","clientId","gridClientId","gridLayout","blockOrder","useSelect","select","_getBlockAttributes$l","getBlockAttributes","getBlockOrder","blockEditorStore","layout","updateBlockAttributes","__unstableMarkNextChangeAsNotPersistent","useDispatch","useEffect","updates","columnCount","rowCount","isManualPlacement","rects","attributes","columnStart","rowStart","columnSpan","rowSpan","style","push","GridRect","newColumnStart","newRowStart","getFirstEmptyCell","bottomMostRow","Math","max","map","r","rowEnd","undefined","Object","keys","length","row","column","rect","some","intersectsRect"],"sources":["@wordpress/block-editor/src/components/grid/use-grid-layout-sync.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport { useEffect } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { store as blockEditorStore } from '../../store';\nimport { GridRect } from './utils';\n\nexport function useGridLayoutSync( { clientId: gridClientId } ) {\n\tconst { gridLayout, blockOrder } = useSelect(\n\t\t( select ) => {\n\t\t\tconst { getBlockAttributes, getBlockOrder } =\n\t\t\t\tselect( blockEditorStore );\n\t\t\treturn {\n\t\t\t\tgridLayout: getBlockAttributes( gridClientId ).layout ?? {},\n\t\t\t\tblockOrder: getBlockOrder( gridClientId ),\n\t\t\t};\n\t\t},\n\t\t[ gridClientId ]\n\t);\n\n\tconst { getBlockAttributes } = useSelect( blockEditorStore );\n\tconst { updateBlockAttributes, __unstableMarkNextChangeAsNotPersistent } =\n\t\tuseDispatch( blockEditorStore );\n\n\tuseEffect( () => {\n\t\tconst updates = {};\n\n\t\tconst { columnCount, rowCount, isManualPlacement } = gridLayout;\n\n\t\tif ( isManualPlacement ) {\n\t\t\tconst rects = [];\n\n\t\t\t// Respect the position of blocks that already have a columnStart and rowStart value.\n\t\t\tfor ( const clientId of blockOrder ) {\n\t\t\t\tconst attributes = getBlockAttributes( clientId );\n\t\t\t\tconst {\n\t\t\t\t\tcolumnStart,\n\t\t\t\t\trowStart,\n\t\t\t\t\tcolumnSpan = 1,\n\t\t\t\t\trowSpan = 1,\n\t\t\t\t} = attributes.style?.layout || {};\n\t\t\t\tif ( ! columnStart || ! rowStart ) {\n\t\t\t\t\tcontinue;\n\t\t\t\t}\n\t\t\t\trects.push(\n\t\t\t\t\tnew GridRect( {\n\t\t\t\t\t\tcolumnStart,\n\t\t\t\t\t\trowStart,\n\t\t\t\t\t\tcolumnSpan,\n\t\t\t\t\t\trowSpan,\n\t\t\t\t\t} )\n\t\t\t\t);\n\t\t\t}\n\n\t\t\t// When in manual mode, ensure that every block has a columnStart and rowStart value.\n\t\t\tfor ( const clientId of blockOrder ) {\n\t\t\t\tconst attributes = getBlockAttributes( clientId );\n\t\t\t\tconst {\n\t\t\t\t\tcolumnStart,\n\t\t\t\t\trowStart,\n\t\t\t\t\tcolumnSpan = 1,\n\t\t\t\t\trowSpan = 1,\n\t\t\t\t} = attributes.style?.layout || {};\n\t\t\t\tif ( columnStart && rowStart ) {\n\t\t\t\t\tcontinue;\n\t\t\t\t}\n\t\t\t\tconst [ newColumnStart, newRowStart ] = getFirstEmptyCell(\n\t\t\t\t\trects,\n\t\t\t\t\tcolumnCount,\n\t\t\t\t\tcolumnSpan,\n\t\t\t\t\trowSpan\n\t\t\t\t);\n\t\t\t\trects.push(\n\t\t\t\t\tnew GridRect( {\n\t\t\t\t\t\tcolumnStart: newColumnStart,\n\t\t\t\t\t\trowStart: newRowStart,\n\t\t\t\t\t\tcolumnSpan,\n\t\t\t\t\t\trowSpan,\n\t\t\t\t\t} )\n\t\t\t\t);\n\t\t\t\tupdates[ clientId ] = {\n\t\t\t\t\tstyle: {\n\t\t\t\t\t\t...attributes.style,\n\t\t\t\t\t\tlayout: {\n\t\t\t\t\t\t\t...attributes.style?.layout,\n\t\t\t\t\t\t\tcolumnStart: newColumnStart,\n\t\t\t\t\t\t\trowStart: newRowStart,\n\t\t\t\t\t\t},\n\t\t\t\t\t},\n\t\t\t\t};\n\t\t\t}\n\n\t\t\t// Ensure there's enough rows to fit all blocks.\n\t\t\tconst bottomMostRow = Math.max( ...rects.map( ( r ) => r.rowEnd ) );\n\t\t\tif ( ! rowCount || rowCount < bottomMostRow ) {\n\t\t\t\tupdates[ gridClientId ] = {\n\t\t\t\t\tlayout: {\n\t\t\t\t\t\t...gridLayout,\n\t\t\t\t\t\trowCount: bottomMostRow,\n\t\t\t\t\t},\n\t\t\t\t};\n\t\t\t}\n\t\t} else {\n\t\t\t// When in auto mode, remove all of the columnStart and rowStart values.\n\t\t\tfor ( const clientId of blockOrder ) {\n\t\t\t\tconst attributes = getBlockAttributes( clientId );\n\t\t\t\tconst { columnStart, rowStart, ...layout } =\n\t\t\t\t\tattributes.style?.layout || {};\n\t\t\t\t// Only update attributes if columnStart or rowStart are set.\n\t\t\t\tif ( columnStart || rowStart ) {\n\t\t\t\t\tupdates[ clientId ] = {\n\t\t\t\t\t\tstyle: {\n\t\t\t\t\t\t\t...attributes.style,\n\t\t\t\t\t\t\tlayout,\n\t\t\t\t\t\t},\n\t\t\t\t\t};\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t// Remove row styles in auto mode\n\t\t\tif ( rowCount ) {\n\t\t\t\tupdates[ gridClientId ] = {\n\t\t\t\t\tlayout: {\n\t\t\t\t\t\t...gridLayout,\n\t\t\t\t\t\trowCount: undefined,\n\t\t\t\t\t},\n\t\t\t\t};\n\t\t\t}\n\t\t}\n\n\t\tif ( Object.keys( updates ).length ) {\n\t\t\t__unstableMarkNextChangeAsNotPersistent();\n\t\t\tupdateBlockAttributes(\n\t\t\t\tObject.keys( updates ),\n\t\t\t\tupdates,\n\t\t\t\t/* uniqueByBlock: */ true\n\t\t\t);\n\t\t}\n\t}, [\n\t\t// Actual deps to sync:\n\t\tgridClientId,\n\t\tgridLayout,\n\t\tblockOrder,\n\t\t// Needed for linter:\n\t\t__unstableMarkNextChangeAsNotPersistent,\n\t\tgetBlockAttributes,\n\t\tupdateBlockAttributes,\n\t] );\n}\n\nfunction getFirstEmptyCell( rects, columnCount, columnSpan = 1, rowSpan = 1 ) {\n\tfor ( let row = 1; ; row++ ) {\n\t\tfor ( let column = 1; column <= columnCount; column++ ) {\n\t\t\tconst rect = new GridRect( {\n\t\t\t\tcolumnStart: column,\n\t\t\t\trowStart: row,\n\t\t\t\tcolumnSpan,\n\t\t\t\trowSpan,\n\t\t\t} );\n\t\t\tif ( ! rects.some( ( r ) => r.intersectsRect( rect ) ) ) {\n\t\t\t\treturn [ column, row ];\n\t\t\t}\n\t\t}\n\t}\n}\n"],"mappings":"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","ignoreList":[]}
|