@wordpress/block-editor 15.16.1-next.v.202604091042.0 → 15.18.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 +8 -0
- package/build/components/autocomplete/index.cjs.map +3 -3
- package/build/components/background-image-control/index.cjs +2 -1
- package/build/components/background-image-control/index.cjs.map +2 -2
- package/build/components/block-allowed-blocks/modal.cjs.map +2 -2
- package/build/components/block-bindings/attribute-control.cjs.map +3 -3
- package/build/components/block-card/index.cjs +2 -2
- package/build/components/block-card/index.cjs.map +3 -3
- package/build/components/block-mover/button.cjs +9 -3
- package/build/components/block-mover/button.cjs.map +2 -2
- package/build/components/block-pattern-setup/index.cjs +3 -2
- package/build/components/block-pattern-setup/index.cjs.map +2 -2
- package/build/components/block-patterns-list/index.cjs +2 -1
- package/build/components/block-patterns-list/index.cjs.map +2 -2
- package/build/components/block-patterns-paging/index.cjs.map +3 -3
- package/build/components/block-settings-menu/block-settings-dropdown.cjs +2 -2
- package/build/components/block-settings-menu/block-settings-dropdown.cjs.map +3 -3
- package/build/components/block-settings-menu/index.cjs +2 -2
- package/build/components/block-settings-menu/index.cjs.map +3 -3
- package/build/components/block-styles/menu-items.cjs.map +3 -3
- package/build/components/block-switcher/index.cjs.map +3 -3
- package/build/components/block-switcher/pattern-transformations-menu.cjs +2 -1
- package/build/components/block-switcher/pattern-transformations-menu.cjs.map +2 -2
- package/build/components/block-toolbar/pattern-overrides-dropdown.cjs.map +3 -3
- package/build/components/block-variation-transforms/index.cjs +2 -1
- package/build/components/block-variation-transforms/index.cjs.map +2 -2
- package/build/components/block-visibility/viewport-visibility-info.cjs +4 -4
- package/build/components/block-visibility/viewport-visibility-info.cjs.map +3 -3
- package/build/components/collab/{block-comment-icon-slot.cjs → note-icon-slot.cjs} +8 -8
- package/build/components/collab/note-icon-slot.cjs.map +7 -0
- package/build/components/collab/{block-comment-icon-toolbar-slot.cjs → note-icon-toolbar-slot.cjs} +9 -9
- package/build/components/collab/note-icon-toolbar-slot.cjs.map +7 -0
- package/build/components/copy-handler/index.cjs.map +2 -2
- package/build/components/date-format-picker/index.cjs +2 -1
- package/build/components/date-format-picker/index.cjs.map +2 -2
- package/build/components/global-styles/color-panel.cjs.map +2 -2
- package/build/components/global-styles/dimensions-panel.cjs +87 -62
- package/build/components/global-styles/dimensions-panel.cjs.map +2 -2
- package/build/components/global-styles/filters-panel.cjs.map +2 -2
- package/build/components/global-styles/hooks.cjs +9 -7
- package/build/components/global-styles/hooks.cjs.map +2 -2
- package/build/components/grid/grid-item-movers.cjs +2 -1
- package/build/components/grid/grid-item-movers.cjs.map +2 -2
- package/build/components/inserter/block-patterns-tab/pattern-category-previews.cjs.map +2 -2
- package/build/components/inserter/menu.cjs +2 -1
- package/build/components/inserter/menu.cjs.map +2 -2
- package/build/components/inserter/search-results.cjs +3 -3
- package/build/components/inserter/search-results.cjs.map +2 -2
- package/build/components/inspector-popover-header/index.cjs.map +3 -3
- package/build/components/link-control/link-preview.cjs +5 -3
- package/build/components/link-control/link-preview.cjs.map +2 -2
- package/build/components/link-control/settings.cjs +2 -1
- package/build/components/link-control/settings.cjs.map +2 -2
- package/build/components/link-picker/link-picker.cjs +3 -2
- package/build/components/link-picker/link-picker.cjs.map +2 -2
- package/build/components/link-picker/link-preview.cjs +2 -2
- package/build/components/link-picker/link-preview.cjs.map +2 -2
- package/build/components/list-view/block-select-button.cjs +2 -2
- package/build/components/list-view/block-select-button.cjs.map +2 -2
- package/build/components/list-view/index.cjs +2 -1
- package/build/components/list-view/index.cjs.map +2 -2
- package/build/components/preset-input-control/index.cjs +7 -4
- package/build/components/preset-input-control/index.cjs.map +2 -2
- package/build/components/provider/index.cjs +80 -7
- package/build/components/provider/index.cjs.map +2 -2
- package/build/components/responsive-block-control/label.cjs +9 -2
- package/build/components/responsive-block-control/label.cjs.map +2 -2
- package/build/components/rich-text/event-listeners/index.cjs.map +2 -2
- package/build/components/rich-text/event-listeners/paste-handler.cjs +12 -5
- package/build/components/rich-text/event-listeners/paste-handler.cjs.map +3 -3
- package/build/components/spacing-sizes-control/utils.cjs +1 -1
- package/build/components/spacing-sizes-control/utils.cjs.map +2 -2
- package/build/components/url-popover/image-url-input-ui.cjs +1 -1
- package/build/components/url-popover/image-url-input-ui.cjs.map +2 -2
- package/build/components/writing-flow/use-arrow-nav.cjs +1 -1
- package/build/components/writing-flow/use-arrow-nav.cjs.map +2 -2
- package/build/components/writing-flow/use-selection-observer.cjs +23 -1
- package/build/components/writing-flow/use-selection-observer.cjs.map +2 -2
- package/build/hooks/block-bindings.cjs.map +3 -3
- package/build/hooks/block-fields/link/index.cjs +1 -1
- package/build/hooks/block-fields/link/index.cjs.map +1 -1
- package/build/hooks/custom-css.cjs +21 -0
- package/build/hooks/custom-css.cjs.map +3 -3
- package/build/hooks/dimensions.cjs +5 -1
- package/build/hooks/dimensions.cjs.map +2 -2
- package/build/hooks/grid-visualizer.cjs +1 -1
- package/build/hooks/grid-visualizer.cjs.map +1 -1
- package/build/hooks/layout-child.cjs +1 -1
- package/build/hooks/layout-child.cjs.map +1 -1
- package/build/hooks/style.cjs +54 -52
- package/build/hooks/style.cjs.map +2 -2
- package/build/hooks/utils.cjs +4 -0
- package/build/hooks/utils.cjs.map +2 -2
- package/build/layouts/flex.cjs +5 -8
- package/build/layouts/flex.cjs.map +3 -3
- package/build/layouts/grid.cjs +5 -5
- package/build/layouts/grid.cjs.map +2 -2
- package/build/private-apis.cjs +5 -4
- package/build/private-apis.cjs.map +3 -3
- package/build/store/private-keys.cjs +3 -0
- package/build/store/private-keys.cjs.map +2 -2
- package/build/utils/dom.cjs +3 -1
- package/build/utils/dom.cjs.map +2 -2
- package/build-module/components/autocomplete/index.mjs +2 -2
- package/build-module/components/autocomplete/index.mjs.map +2 -2
- package/build-module/components/background-image-control/index.mjs +2 -2
- package/build-module/components/background-image-control/index.mjs.map +2 -2
- package/build-module/components/block-allowed-blocks/modal.mjs +2 -2
- package/build-module/components/block-allowed-blocks/modal.mjs.map +2 -2
- package/build-module/components/block-bindings/attribute-control.mjs +3 -3
- package/build-module/components/block-bindings/attribute-control.mjs.map +2 -2
- package/build-module/components/block-card/index.mjs +4 -4
- package/build-module/components/block-card/index.mjs.map +2 -2
- package/build-module/components/block-mover/button.mjs +11 -5
- package/build-module/components/block-mover/button.mjs.map +2 -2
- package/build-module/components/block-pattern-setup/index.mjs +2 -1
- package/build-module/components/block-pattern-setup/index.mjs.map +2 -2
- package/build-module/components/block-patterns-list/index.mjs +1 -1
- package/build-module/components/block-patterns-list/index.mjs.map +2 -2
- package/build-module/components/block-patterns-paging/index.mjs +3 -3
- package/build-module/components/block-patterns-paging/index.mjs.map +2 -2
- package/build-module/components/block-settings-menu/block-settings-dropdown.mjs +2 -2
- package/build-module/components/block-settings-menu/block-settings-dropdown.mjs.map +2 -2
- package/build-module/components/block-settings-menu/index.mjs +2 -2
- package/build-module/components/block-settings-menu/index.mjs.map +2 -2
- package/build-module/components/block-styles/menu-items.mjs +2 -2
- package/build-module/components/block-styles/menu-items.mjs.map +2 -2
- package/build-module/components/block-switcher/index.mjs +2 -2
- package/build-module/components/block-switcher/index.mjs.map +2 -2
- package/build-module/components/block-switcher/pattern-transformations-menu.mjs +2 -7
- package/build-module/components/block-switcher/pattern-transformations-menu.mjs.map +2 -2
- package/build-module/components/block-toolbar/pattern-overrides-dropdown.mjs +2 -2
- package/build-module/components/block-toolbar/pattern-overrides-dropdown.mjs.map +2 -2
- package/build-module/components/block-variation-transforms/index.mjs +2 -2
- package/build-module/components/block-variation-transforms/index.mjs.map +2 -2
- package/build-module/components/block-visibility/viewport-visibility-info.mjs +6 -6
- package/build-module/components/block-visibility/viewport-visibility-info.mjs.map +2 -2
- package/build-module/components/collab/note-icon-slot.mjs +8 -0
- package/build-module/components/collab/note-icon-slot.mjs.map +7 -0
- package/build-module/components/collab/note-icon-toolbar-slot.mjs +10 -0
- package/build-module/components/collab/note-icon-toolbar-slot.mjs.map +7 -0
- package/build-module/components/copy-handler/index.mjs.map +2 -2
- package/build-module/components/date-format-picker/index.mjs +2 -2
- package/build-module/components/date-format-picker/index.mjs.map +2 -2
- package/build-module/components/global-styles/color-panel.mjs.map +2 -2
- package/build-module/components/global-styles/dimensions-panel.mjs +87 -62
- package/build-module/components/global-styles/dimensions-panel.mjs.map +2 -2
- package/build-module/components/global-styles/filters-panel.mjs.map +2 -2
- package/build-module/components/global-styles/hooks.mjs +9 -7
- package/build-module/components/global-styles/hooks.mjs.map +2 -2
- package/build-module/components/grid/grid-item-movers.mjs +2 -5
- package/build-module/components/grid/grid-item-movers.mjs.map +2 -2
- package/build-module/components/inserter/block-patterns-tab/pattern-category-previews.mjs +3 -3
- package/build-module/components/inserter/block-patterns-tab/pattern-category-previews.mjs.map +1 -1
- package/build-module/components/inserter/menu.mjs +3 -2
- package/build-module/components/inserter/menu.mjs.map +2 -2
- package/build-module/components/inserter/search-results.mjs +1 -1
- package/build-module/components/inserter/search-results.mjs.map +1 -1
- package/build-module/components/inspector-popover-header/index.mjs +2 -2
- package/build-module/components/inspector-popover-header/index.mjs.map +2 -2
- package/build-module/components/link-control/link-preview.mjs +5 -3
- package/build-module/components/link-control/link-preview.mjs.map +2 -2
- package/build-module/components/link-control/settings.mjs +3 -2
- package/build-module/components/link-control/settings.mjs.map +2 -2
- package/build-module/components/link-picker/link-picker.mjs +1 -1
- package/build-module/components/link-picker/link-picker.mjs.map +2 -2
- package/build-module/components/link-picker/link-preview.mjs +2 -2
- package/build-module/components/link-picker/link-preview.mjs.map +2 -2
- package/build-module/components/list-view/block-select-button.mjs +2 -2
- package/build-module/components/list-view/block-select-button.mjs.map +2 -2
- package/build-module/components/list-view/index.mjs +2 -4
- package/build-module/components/list-view/index.mjs.map +2 -2
- package/build-module/components/preset-input-control/index.mjs +7 -4
- package/build-module/components/preset-input-control/index.mjs.map +2 -2
- package/build-module/components/provider/index.mjs +82 -8
- package/build-module/components/provider/index.mjs.map +2 -2
- package/build-module/components/responsive-block-control/label.mjs +9 -2
- package/build-module/components/responsive-block-control/label.mjs.map +2 -2
- package/build-module/components/rich-text/event-listeners/index.mjs.map +2 -2
- package/build-module/components/rich-text/event-listeners/paste-handler.mjs +12 -5
- package/build-module/components/rich-text/event-listeners/paste-handler.mjs.map +2 -2
- package/build-module/components/spacing-sizes-control/utils.mjs +1 -1
- package/build-module/components/spacing-sizes-control/utils.mjs.map +2 -2
- package/build-module/components/url-popover/image-url-input-ui.mjs +1 -1
- package/build-module/components/url-popover/image-url-input-ui.mjs.map +2 -2
- package/build-module/components/writing-flow/use-arrow-nav.mjs +1 -1
- package/build-module/components/writing-flow/use-arrow-nav.mjs.map +2 -2
- package/build-module/components/writing-flow/use-selection-observer.mjs +23 -1
- package/build-module/components/writing-flow/use-selection-observer.mjs.map +2 -2
- package/build-module/hooks/block-bindings.mjs +2 -2
- package/build-module/hooks/block-bindings.mjs.map +2 -2
- package/build-module/hooks/block-fields/link/index.mjs +1 -1
- package/build-module/hooks/block-fields/link/index.mjs.map +1 -1
- package/build-module/hooks/custom-css.mjs +23 -2
- package/build-module/hooks/custom-css.mjs.map +2 -2
- package/build-module/hooks/dimensions.mjs +5 -1
- package/build-module/hooks/dimensions.mjs.map +2 -2
- package/build-module/hooks/grid-visualizer.mjs +1 -1
- package/build-module/hooks/grid-visualizer.mjs.map +1 -1
- package/build-module/hooks/layout-child.mjs +1 -1
- package/build-module/hooks/layout-child.mjs.map +1 -1
- package/build-module/hooks/style.mjs +54 -52
- package/build-module/hooks/style.mjs.map +2 -2
- package/build-module/hooks/utils.mjs +4 -0
- package/build-module/hooks/utils.mjs.map +2 -2
- package/build-module/layouts/flex.mjs +4 -7
- package/build-module/layouts/flex.mjs.map +2 -2
- package/build-module/layouts/grid.mjs +4 -4
- package/build-module/layouts/grid.mjs.map +2 -2
- package/build-module/private-apis.mjs +7 -5
- package/build-module/private-apis.mjs.map +2 -2
- package/build-module/store/private-keys.mjs +2 -0
- package/build-module/store/private-keys.mjs.map +2 -2
- package/build-module/utils/dom.mjs +2 -1
- package/build-module/utils/dom.mjs.map +2 -2
- package/build-style/content-rtl.css +1 -4
- package/build-style/content.css +1 -4
- package/build-style/style-rtl.css +12 -12
- package/build-style/style.css +12 -12
- package/build-types/utils/dom.d.ts +7 -0
- package/build-types/utils/dom.d.ts.map +1 -1
- package/package.json +39 -38
- package/src/components/autocomplete/index.js +4 -2
- package/src/components/background-image-control/index.js +2 -2
- package/src/components/background-image-control/style.scss +1 -1
- package/src/components/block-allowed-blocks/modal.js +3 -3
- package/src/components/block-bindings/attribute-control.js +4 -4
- package/src/components/block-card/index.js +5 -5
- package/src/components/block-list/content.scss +0 -4
- package/src/components/block-mover/button.js +17 -7
- package/src/components/block-pattern-setup/index.js +2 -1
- package/src/components/block-pattern-setup/style.scss +2 -2
- package/src/components/block-patterns-list/index.js +1 -1
- package/src/components/block-patterns-list/style.scss +1 -1
- package/src/components/block-patterns-paging/index.js +5 -6
- package/src/components/block-settings-menu/block-settings-dropdown.js +2 -2
- package/src/components/block-settings-menu/index.js +2 -2
- package/src/components/block-styles/menu-items.js +3 -3
- package/src/components/block-switcher/index.js +3 -3
- package/src/components/block-switcher/pattern-transformations-menu.js +2 -7
- package/src/components/block-switcher/style.scss +2 -2
- package/src/components/block-toolbar/pattern-overrides-dropdown.js +2 -2
- package/src/components/block-variation-transforms/index.js +2 -2
- package/src/components/block-visibility/viewport-visibility-info.js +7 -7
- package/src/components/collab/note-icon-slot.js +8 -0
- package/src/components/collab/note-icon-toolbar-slot.js +10 -0
- package/src/components/copy-handler/index.js +1 -0
- package/src/components/date-format-picker/index.js +4 -2
- package/src/components/global-styles/color-panel.js +0 -2
- package/src/components/global-styles/dimensions-panel.js +100 -73
- package/src/components/global-styles/filters-panel.js +0 -2
- package/src/components/global-styles/hooks.js +9 -7
- package/src/components/global-styles/style.scss +1 -1
- package/src/components/grid/grid-item-movers.js +2 -5
- package/src/components/inserter/block-patterns-tab/pattern-category-previews.js +5 -5
- package/src/components/inserter/menu.js +3 -2
- package/src/components/inserter/search-results.js +1 -1
- package/src/components/inserter/style.scss +2 -2
- package/src/components/inserter-list-item/style.scss +1 -1
- package/src/components/inspector-popover-header/index.js +2 -2
- package/src/components/link-control/link-preview.js +6 -4
- package/src/components/link-control/settings.js +3 -2
- package/src/components/link-picker/link-picker.js +1 -1
- package/src/components/link-picker/link-preview.js +3 -3
- package/src/components/list-view/block-select-button.js +3 -3
- package/src/components/list-view/index.js +2 -4
- package/src/components/list-view/style.scss +1 -1
- package/src/components/media-placeholder/content.scss +1 -1
- package/src/components/preset-input-control/index.js +10 -4
- package/src/components/preset-input-control/test/index.js +70 -0
- package/src/components/provider/index.js +149 -8
- package/src/components/responsive-block-control/label.js +5 -2
- package/src/components/rich-text/event-listeners/index.js +1 -0
- package/src/components/rich-text/event-listeners/paste-handler.js +18 -4
- package/src/components/spacing-sizes-control/utils.js +1 -1
- package/src/components/url-input/style.scss +1 -1
- package/src/components/url-popover/image-url-input-ui.js +1 -1
- package/src/components/writing-flow/use-arrow-nav.js +9 -2
- package/src/components/writing-flow/use-selection-observer.js +39 -1
- package/src/hooks/block-bindings.js +3 -3
- package/src/hooks/block-fields/link/index.js +1 -1
- package/src/hooks/custom-css.js +30 -9
- package/src/hooks/dimensions.js +6 -1
- package/src/hooks/grid-visualizer.js +1 -1
- package/src/hooks/layout-child.js +1 -1
- package/src/hooks/style.js +75 -61
- package/src/hooks/test/dimensions.js +16 -0
- package/src/hooks/test/style.js +2 -0
- package/src/hooks/utils.js +4 -0
- package/src/layouts/flex.js +7 -9
- package/src/layouts/grid.js +7 -4
- package/src/private-apis.js +6 -4
- package/src/store/private-keys.js +1 -0
- package/src/utils/dom.js +3 -3
- package/src/utils/test/dom.js +47 -4
- package/build/components/collab/block-comment-icon-slot.cjs.map +0 -7
- package/build/components/collab/block-comment-icon-toolbar-slot.cjs.map +0 -7
- package/build-module/components/collab/block-comment-icon-slot.mjs +0 -8
- package/build-module/components/collab/block-comment-icon-slot.mjs.map +0 -7
- package/build-module/components/collab/block-comment-icon-toolbar-slot.mjs +0 -10
- package/build-module/components/collab/block-comment-icon-toolbar-slot.mjs.map +0 -7
- package/src/components/collab/block-comment-icon-slot.js +0 -8
- package/src/components/collab/block-comment-icon-toolbar-slot.js +0 -10
|
@@ -38,7 +38,7 @@ const LINK_DESTINATION_NONE = 'none';
|
|
|
38
38
|
const LINK_DESTINATION_CUSTOM = 'custom';
|
|
39
39
|
const LINK_DESTINATION_MEDIA = 'media';
|
|
40
40
|
const LINK_DESTINATION_ATTACHMENT = 'attachment';
|
|
41
|
-
const NEW_TAB_REL = [ '
|
|
41
|
+
const NEW_TAB_REL = [ 'noopener' ];
|
|
42
42
|
|
|
43
43
|
const ImageURLInputUI = ( {
|
|
44
44
|
linkDestination,
|
|
@@ -115,9 +115,16 @@ export function getClosestTabbable(
|
|
|
115
115
|
}
|
|
116
116
|
|
|
117
117
|
function isTabCandidate( node ) {
|
|
118
|
-
// If it's a block
|
|
119
|
-
// there are better
|
|
118
|
+
// If it's a block wrapper (not itself a contenteditable editing surface)
|
|
119
|
+
// and there are nested focusable nodes, skip because there are better
|
|
120
|
+
// candidates. We must not skip contenteditable nodes that happen to
|
|
121
|
+
// contain links or other focusable inline elements, since those are the
|
|
122
|
+
// correct navigation targets.
|
|
123
|
+
//
|
|
124
|
+
// See https://github.com/WordPress/gutenberg/pull/77474
|
|
125
|
+
// TODO: Consider fixing focus.tabbable
|
|
120
126
|
if (
|
|
127
|
+
node.contentEditable !== 'true' &&
|
|
121
128
|
getBlockClientId( node ) &&
|
|
122
129
|
focus.focusable
|
|
123
130
|
.find( node )
|
|
@@ -214,7 +214,45 @@ export default function useSelectionObserver() {
|
|
|
214
214
|
const isSingularSelection = startClientId === endClientId;
|
|
215
215
|
if ( isSingularSelection ) {
|
|
216
216
|
if ( ! isMultiSelecting() ) {
|
|
217
|
-
|
|
217
|
+
// If the selection is not collapsed and falls
|
|
218
|
+
// within a RichText that doesn't have focus
|
|
219
|
+
// (e.g. the user started dragging from the block
|
|
220
|
+
// wrapper padding), dispatch a full
|
|
221
|
+
// selectionChange so the format toolbar appears.
|
|
222
|
+
const richTextElement =
|
|
223
|
+
! selection.isCollapsed &&
|
|
224
|
+
( getRichTextElement( startNode ) ||
|
|
225
|
+
getRichTextElement( endNode ) );
|
|
226
|
+
|
|
227
|
+
if (
|
|
228
|
+
richTextElement &&
|
|
229
|
+
ownerDocument.activeElement !== richTextElement
|
|
230
|
+
) {
|
|
231
|
+
const range = selection.getRangeAt( 0 );
|
|
232
|
+
const richTextData = create( {
|
|
233
|
+
element: richTextElement,
|
|
234
|
+
range,
|
|
235
|
+
__unstableIsEditableTree: true,
|
|
236
|
+
} );
|
|
237
|
+
selectionChange( {
|
|
238
|
+
start: {
|
|
239
|
+
clientId: startClientId,
|
|
240
|
+
attributeKey:
|
|
241
|
+
richTextElement.dataset
|
|
242
|
+
.wpBlockAttributeKey,
|
|
243
|
+
offset: richTextData.start ?? 0,
|
|
244
|
+
},
|
|
245
|
+
end: {
|
|
246
|
+
clientId: startClientId,
|
|
247
|
+
attributeKey:
|
|
248
|
+
richTextElement.dataset
|
|
249
|
+
.wpBlockAttributeKey,
|
|
250
|
+
offset: richTextData.end,
|
|
251
|
+
},
|
|
252
|
+
} );
|
|
253
|
+
} else {
|
|
254
|
+
selectBlock( startClientId );
|
|
255
|
+
}
|
|
218
256
|
} else {
|
|
219
257
|
multiSelect( startClientId, startClientId );
|
|
220
258
|
}
|
|
@@ -5,7 +5,7 @@ import { __ } from '@wordpress/i18n';
|
|
|
5
5
|
import { store as blocksStore } from '@wordpress/blocks';
|
|
6
6
|
import {
|
|
7
7
|
__experimentalItemGroup as ItemGroup,
|
|
8
|
-
__experimentalText as
|
|
8
|
+
__experimentalText as WCText,
|
|
9
9
|
__experimentalToolsPanel as ToolsPanel,
|
|
10
10
|
} from '@wordpress/components';
|
|
11
11
|
import { useSelect } from '@wordpress/data';
|
|
@@ -103,13 +103,13 @@ export const BlockBindingsPanel = ( { name: blockName, metadata } ) => {
|
|
|
103
103
|
Use a div element to make the ToolsPanelHiddenInnerWrapper
|
|
104
104
|
toggle the visibility of this help text automatically.
|
|
105
105
|
*/ }
|
|
106
|
-
<
|
|
106
|
+
<WCText as="div" variant="muted">
|
|
107
107
|
<p>
|
|
108
108
|
{ __(
|
|
109
109
|
'Attributes connected to custom fields or other dynamic data.'
|
|
110
110
|
) }
|
|
111
111
|
</p>
|
|
112
|
-
</
|
|
112
|
+
</WCText>
|
|
113
113
|
</ToolsPanel>
|
|
114
114
|
</InspectorControls>
|
|
115
115
|
);
|
|
@@ -18,7 +18,7 @@ import { prependHTTP } from '@wordpress/url';
|
|
|
18
18
|
import LinkControl from '../../../components/link-control';
|
|
19
19
|
import { useInspectorPopoverPlacement } from '../use-inspector-popover-placement';
|
|
20
20
|
|
|
21
|
-
export const NEW_TAB_REL = '
|
|
21
|
+
export const NEW_TAB_REL = 'noopener';
|
|
22
22
|
export const NEW_TAB_TARGET = '_blank';
|
|
23
23
|
export const NOFOLLOW_REL = 'nofollow';
|
|
24
24
|
|
package/src/hooks/custom-css.js
CHANGED
|
@@ -1,17 +1,11 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
*/
|
|
4
|
-
import { useMemo } from '@wordpress/element';
|
|
5
|
-
import { useSelect } from '@wordpress/data';
|
|
1
|
+
import { useEffect, useMemo } from '@wordpress/element';
|
|
2
|
+
import { useDispatch, useSelect } from '@wordpress/data';
|
|
6
3
|
import { useInstanceId } from '@wordpress/compose';
|
|
7
4
|
import { getBlockType, hasBlockSupport } from '@wordpress/blocks';
|
|
8
5
|
import { __, sprintf } from '@wordpress/i18n';
|
|
9
6
|
import { processCSSNesting } from '@wordpress/global-styles-engine';
|
|
7
|
+
import { store as noticesStore } from '@wordpress/notices';
|
|
10
8
|
import { useBlockEditingMode } from '../components/block-editing-mode';
|
|
11
|
-
|
|
12
|
-
/**
|
|
13
|
-
* Internal dependencies
|
|
14
|
-
*/
|
|
15
9
|
import InspectorControls from '../components/inspector-controls';
|
|
16
10
|
import AdvancedPanel, {
|
|
17
11
|
validateCSS,
|
|
@@ -69,6 +63,8 @@ function CustomCSSControl( { blockName, setAttributes, style } ) {
|
|
|
69
63
|
);
|
|
70
64
|
}
|
|
71
65
|
|
|
66
|
+
const CUSTOM_CSS_WARNING_NOTICE_ID = 'custom-css-edit-warning';
|
|
67
|
+
|
|
72
68
|
function CustomCSSEdit( { clientId, name, setAttributes } ) {
|
|
73
69
|
const { style, canEditCSS } = useSelect(
|
|
74
70
|
( select ) => {
|
|
@@ -113,6 +109,31 @@ function useBlockProps( { style } ) {
|
|
|
113
109
|
customCSS.trim().length > 0 &&
|
|
114
110
|
validateCSS( customCSS );
|
|
115
111
|
|
|
112
|
+
const canEditCSS = useSelect(
|
|
113
|
+
( select ) => select( blockEditorStore ).getSettings().canEditCSS,
|
|
114
|
+
[]
|
|
115
|
+
);
|
|
116
|
+
|
|
117
|
+
const { createWarningNotice } = useDispatch( noticesStore );
|
|
118
|
+
|
|
119
|
+
// Show a warning notice when the user lacks edit_css and a block has
|
|
120
|
+
// custom CSS. The fixed notice ID ensures only one notice is shown
|
|
121
|
+
// regardless of how many blocks have CSS.
|
|
122
|
+
const hasCustomCSS = !! customCSS?.trim();
|
|
123
|
+
useEffect( () => {
|
|
124
|
+
if ( ! canEditCSS && hasCustomCSS ) {
|
|
125
|
+
createWarningNotice(
|
|
126
|
+
__(
|
|
127
|
+
'This post contains blocks with custom CSS. You do not have permission to edit CSS. If you save this post, the custom CSS will be removed.'
|
|
128
|
+
),
|
|
129
|
+
{
|
|
130
|
+
id: CUSTOM_CSS_WARNING_NOTICE_ID,
|
|
131
|
+
isDismissible: true,
|
|
132
|
+
}
|
|
133
|
+
);
|
|
134
|
+
}
|
|
135
|
+
}, [ canEditCSS, hasCustomCSS, createWarningNotice ] );
|
|
136
|
+
|
|
116
137
|
const customCSSIdentifier = useInstanceId(
|
|
117
138
|
CUSTOM_CSS_INSTANCE_REFERENCE,
|
|
118
139
|
'wp-custom-css'
|
package/src/hooks/dimensions.js
CHANGED
|
@@ -102,6 +102,10 @@ export function DimensionsPanel( { clientId, name, setAttributes, settings } ) {
|
|
|
102
102
|
'__experimentalDefaultControls',
|
|
103
103
|
] );
|
|
104
104
|
const defaultControls = {
|
|
105
|
+
// In the block inspector, minHeight and minWidth should not
|
|
106
|
+
// be shown by default unless the block explicitly opts in.
|
|
107
|
+
minHeight: false,
|
|
108
|
+
minWidth: false,
|
|
105
109
|
...defaultDimensionsControls,
|
|
106
110
|
...defaultSpacingControls,
|
|
107
111
|
};
|
|
@@ -161,7 +165,8 @@ export function hasDimensionsSupport( blockName, feature = 'any' ) {
|
|
|
161
165
|
support?.aspectRatio ||
|
|
162
166
|
!! support?.height ||
|
|
163
167
|
!! support?.minHeight ||
|
|
164
|
-
!! support?.width
|
|
168
|
+
!! support?.width ||
|
|
169
|
+
!! support?.minWidth
|
|
165
170
|
);
|
|
166
171
|
}
|
|
167
172
|
|
|
@@ -54,7 +54,7 @@ function GridTools( { clientId, layout } ) {
|
|
|
54
54
|
const settings = getSettings();
|
|
55
55
|
const currentDeviceType =
|
|
56
56
|
settings?.[ deviceTypeKey ]?.toLowerCase() ||
|
|
57
|
-
BLOCK_VISIBILITY_VIEWPORTS.desktop.
|
|
57
|
+
BLOCK_VISIBILITY_VIEWPORTS.desktop.key;
|
|
58
58
|
|
|
59
59
|
return {
|
|
60
60
|
isVisible: true,
|
|
@@ -244,7 +244,7 @@ function GridTools( {
|
|
|
244
244
|
blockAttributes?.metadata?.blockVisibility,
|
|
245
245
|
deviceType:
|
|
246
246
|
settings?.[ deviceTypeKey ]?.toLowerCase() ||
|
|
247
|
-
BLOCK_VISIBILITY_VIEWPORTS.desktop.
|
|
247
|
+
BLOCK_VISIBILITY_VIEWPORTS.desktop.key,
|
|
248
248
|
// Check if the selected child block is itself a grid.
|
|
249
249
|
isChildBlockAGrid: blockAttributes?.layout?.type === 'grid',
|
|
250
250
|
};
|
package/src/hooks/style.js
CHANGED
|
@@ -382,84 +382,98 @@ const elementTypes = [
|
|
|
382
382
|
// Used for generating the instance ID
|
|
383
383
|
const STYLE_BLOCK_PROPS_REFERENCE = {};
|
|
384
384
|
|
|
385
|
-
|
|
386
|
-
|
|
387
|
-
|
|
388
|
-
|
|
389
|
-
|
|
385
|
+
/**
|
|
386
|
+
* Generates CSS rules for block element styles (buttons, links, headings, etc.).
|
|
387
|
+
*
|
|
388
|
+
* Iterates over supported element types and compiles their styles, including
|
|
389
|
+
* pseudo-selectors (e.g. :hover) and related sub-elements (e.g. h1-h6 for headings),
|
|
390
|
+
* into scoped CSS rule strings.
|
|
391
|
+
*
|
|
392
|
+
* @param {Object} blockElementStyles The block's `style.elements` object.
|
|
393
|
+
* @param {string} blockName The block name, used for skip-serialization checks.
|
|
394
|
+
* @param {string} baseSelector The base CSS selector to scope rules under.
|
|
395
|
+
* @return {string|undefined} Concatenated CSS rules string, or undefined if none.
|
|
396
|
+
*/
|
|
397
|
+
function getElementCSSRules( blockElementStyles, blockName, baseSelector ) {
|
|
398
|
+
if ( ! blockElementStyles ) {
|
|
399
|
+
return;
|
|
400
|
+
}
|
|
390
401
|
|
|
391
|
-
const
|
|
392
|
-
const blockElementStyles = style?.elements;
|
|
402
|
+
const rules = [];
|
|
393
403
|
|
|
394
|
-
|
|
395
|
-
|
|
404
|
+
elementTypes.forEach( ( { elementType, pseudo, elements } ) => {
|
|
405
|
+
const skipSerialization = shouldSkipSerialization(
|
|
406
|
+
blockName,
|
|
407
|
+
COLOR_SUPPORT_KEY,
|
|
408
|
+
elementType
|
|
409
|
+
);
|
|
410
|
+
|
|
411
|
+
if ( skipSerialization ) {
|
|
396
412
|
return;
|
|
397
413
|
}
|
|
398
414
|
|
|
399
|
-
const
|
|
415
|
+
const elementStyles = blockElementStyles?.[ elementType ];
|
|
400
416
|
|
|
401
|
-
|
|
402
|
-
|
|
403
|
-
|
|
404
|
-
|
|
405
|
-
elementType
|
|
417
|
+
// Process primary element type styles.
|
|
418
|
+
if ( elementStyles ) {
|
|
419
|
+
const selector = scopeSelector(
|
|
420
|
+
baseSelector,
|
|
421
|
+
ELEMENTS[ elementType ]
|
|
406
422
|
);
|
|
407
423
|
|
|
408
|
-
|
|
409
|
-
return;
|
|
410
|
-
}
|
|
424
|
+
rules.push( compileCSS( elementStyles, { selector } ) );
|
|
411
425
|
|
|
412
|
-
|
|
413
|
-
|
|
414
|
-
|
|
415
|
-
|
|
416
|
-
|
|
417
|
-
|
|
418
|
-
ELEMENTS[ elementType ]
|
|
419
|
-
);
|
|
420
|
-
|
|
421
|
-
elementCSSRules.push(
|
|
422
|
-
compileCSS( elementStyles, { selector } )
|
|
423
|
-
);
|
|
424
|
-
|
|
425
|
-
// Process any interactive states for the element type.
|
|
426
|
-
if ( pseudo ) {
|
|
427
|
-
pseudo.forEach( ( pseudoSelector ) => {
|
|
428
|
-
if ( elementStyles[ pseudoSelector ] ) {
|
|
429
|
-
elementCSSRules.push(
|
|
430
|
-
compileCSS( elementStyles[ pseudoSelector ], {
|
|
431
|
-
selector: scopeSelector(
|
|
432
|
-
baseElementSelector,
|
|
433
|
-
`${ ELEMENTS[ elementType ] }${ pseudoSelector }`
|
|
434
|
-
),
|
|
435
|
-
} )
|
|
436
|
-
);
|
|
437
|
-
}
|
|
438
|
-
} );
|
|
439
|
-
}
|
|
440
|
-
}
|
|
441
|
-
|
|
442
|
-
// Process related elements e.g. h1-h6 for headings
|
|
443
|
-
if ( elements ) {
|
|
444
|
-
elements.forEach( ( element ) => {
|
|
445
|
-
if ( blockElementStyles[ element ] ) {
|
|
446
|
-
elementCSSRules.push(
|
|
447
|
-
compileCSS( blockElementStyles[ element ], {
|
|
426
|
+
// Process any interactive states for the element type.
|
|
427
|
+
if ( pseudo ) {
|
|
428
|
+
pseudo.forEach( ( pseudoSelector ) => {
|
|
429
|
+
if ( elementStyles[ pseudoSelector ] ) {
|
|
430
|
+
rules.push(
|
|
431
|
+
compileCSS( elementStyles[ pseudoSelector ], {
|
|
448
432
|
selector: scopeSelector(
|
|
449
|
-
|
|
450
|
-
ELEMENTS[
|
|
433
|
+
baseSelector,
|
|
434
|
+
`${ ELEMENTS[ elementType ] }${ pseudoSelector }`
|
|
451
435
|
),
|
|
452
436
|
} )
|
|
453
437
|
);
|
|
454
438
|
}
|
|
455
439
|
} );
|
|
456
440
|
}
|
|
457
|
-
}
|
|
441
|
+
}
|
|
442
|
+
|
|
443
|
+
// Process related elements e.g. h1-h6 for headings
|
|
444
|
+
if ( elements ) {
|
|
445
|
+
elements.forEach( ( element ) => {
|
|
446
|
+
if ( blockElementStyles[ element ] ) {
|
|
447
|
+
rules.push(
|
|
448
|
+
compileCSS( blockElementStyles[ element ], {
|
|
449
|
+
selector: scopeSelector(
|
|
450
|
+
baseSelector,
|
|
451
|
+
ELEMENTS[ element ]
|
|
452
|
+
),
|
|
453
|
+
} )
|
|
454
|
+
);
|
|
455
|
+
}
|
|
456
|
+
} );
|
|
457
|
+
}
|
|
458
|
+
} );
|
|
459
|
+
|
|
460
|
+
return rules.length > 0 ? rules.join( '' ) : undefined;
|
|
461
|
+
}
|
|
462
|
+
|
|
463
|
+
function useBlockProps( { name, style } ) {
|
|
464
|
+
const blockElementsContainerIdentifier = useInstanceId(
|
|
465
|
+
STYLE_BLOCK_PROPS_REFERENCE,
|
|
466
|
+
'wp-elements'
|
|
467
|
+
);
|
|
458
468
|
|
|
459
|
-
|
|
460
|
-
|
|
461
|
-
|
|
462
|
-
|
|
469
|
+
const baseElementSelector = `.${ blockElementsContainerIdentifier }`;
|
|
470
|
+
const blockElementStyles = style?.elements;
|
|
471
|
+
|
|
472
|
+
const styles = useMemo(
|
|
473
|
+
() =>
|
|
474
|
+
getElementCSSRules( blockElementStyles, name, baseElementSelector ),
|
|
475
|
+
[ baseElementSelector, blockElementStyles, name ]
|
|
476
|
+
);
|
|
463
477
|
|
|
464
478
|
useStyleOverride( { css: styles } );
|
|
465
479
|
|
|
@@ -76,6 +76,22 @@ describe( 'getDimensionsClassesAndStyles', () => {
|
|
|
76
76
|
} );
|
|
77
77
|
} );
|
|
78
78
|
|
|
79
|
+
it( 'should return minWidth style', () => {
|
|
80
|
+
const attributes = {
|
|
81
|
+
style: {
|
|
82
|
+
dimensions: {
|
|
83
|
+
minWidth: '200px',
|
|
84
|
+
},
|
|
85
|
+
},
|
|
86
|
+
};
|
|
87
|
+
expect( getDimensionsClassesAndStyles( attributes ) ).toEqual( {
|
|
88
|
+
className: undefined,
|
|
89
|
+
style: {
|
|
90
|
+
minWidth: '200px',
|
|
91
|
+
},
|
|
92
|
+
} );
|
|
93
|
+
} );
|
|
94
|
+
|
|
79
95
|
it( 'should return all dimension styles when multiple are provided', () => {
|
|
80
96
|
const attributes = {
|
|
81
97
|
style: {
|
package/src/hooks/test/style.js
CHANGED
|
@@ -25,6 +25,7 @@ describe( 'getInlineStyles', () => {
|
|
|
25
25
|
},
|
|
26
26
|
dimensions: {
|
|
27
27
|
minHeight: '50vh',
|
|
28
|
+
minWidth: '200px',
|
|
28
29
|
},
|
|
29
30
|
spacing: {
|
|
30
31
|
blockGap: '1em',
|
|
@@ -44,6 +45,7 @@ describe( 'getInlineStyles', () => {
|
|
|
44
45
|
fontSize: 10,
|
|
45
46
|
marginBottom: '15px',
|
|
46
47
|
minHeight: '50vh',
|
|
48
|
+
minWidth: '200px',
|
|
47
49
|
paddingTop: '10px',
|
|
48
50
|
} );
|
|
49
51
|
} );
|
package/src/hooks/utils.js
CHANGED
|
@@ -269,6 +269,7 @@ export function useBlockSettings( name, parentLayout ) {
|
|
|
269
269
|
aspectRatio,
|
|
270
270
|
height,
|
|
271
271
|
minHeight,
|
|
272
|
+
minWidth,
|
|
272
273
|
width,
|
|
273
274
|
dimensionSizes,
|
|
274
275
|
layout,
|
|
@@ -332,6 +333,7 @@ export function useBlockSettings( name, parentLayout ) {
|
|
|
332
333
|
'dimensions.aspectRatio',
|
|
333
334
|
'dimensions.height',
|
|
334
335
|
'dimensions.minHeight',
|
|
336
|
+
'dimensions.minWidth',
|
|
335
337
|
'dimensions.width',
|
|
336
338
|
'dimensions.dimensionSizes',
|
|
337
339
|
'layout',
|
|
@@ -446,6 +448,7 @@ export function useBlockSettings( name, parentLayout ) {
|
|
|
446
448
|
aspectRatio,
|
|
447
449
|
height,
|
|
448
450
|
minHeight,
|
|
451
|
+
minWidth,
|
|
449
452
|
width,
|
|
450
453
|
dimensionSizes,
|
|
451
454
|
},
|
|
@@ -487,6 +490,7 @@ export function useBlockSettings( name, parentLayout ) {
|
|
|
487
490
|
aspectRatio,
|
|
488
491
|
height,
|
|
489
492
|
minHeight,
|
|
493
|
+
minWidth,
|
|
490
494
|
width,
|
|
491
495
|
dimensionSizes,
|
|
492
496
|
layout,
|
package/src/layouts/flex.js
CHANGED
|
@@ -23,7 +23,8 @@ import {
|
|
|
23
23
|
* Internal dependencies
|
|
24
24
|
*/
|
|
25
25
|
import { appendSelectors, getBlockGapCSS } from './utils';
|
|
26
|
-
import { getGapCSSValue } from '../hooks/gap';
|
|
26
|
+
import { getGapCSSValue, getGapBoxControlValueFromStyle } from '../hooks/gap';
|
|
27
|
+
import { getSpacingPresetCssVar } from '../components/spacing-sizes-control/utils';
|
|
27
28
|
import {
|
|
28
29
|
BlockControls,
|
|
29
30
|
JustifyContentControl,
|
|
@@ -147,15 +148,12 @@ export default {
|
|
|
147
148
|
// falling back to '0.5em' for backwards compatibility.
|
|
148
149
|
let fallbackGapValue = '0.5em';
|
|
149
150
|
if ( globalBlockGapValue ) {
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
globalBlockGapValue,
|
|
153
|
-
'0.5em'
|
|
154
|
-
);
|
|
155
|
-
// Use the column gap value (second value if two values exist)
|
|
156
|
-
const gapParts = processedGlobalGap.split( ' ' );
|
|
151
|
+
const gapBox =
|
|
152
|
+
getGapBoxControlValueFromStyle( globalBlockGapValue );
|
|
157
153
|
fallbackGapValue =
|
|
158
|
-
|
|
154
|
+
getSpacingPresetCssVar( gapBox?.left ) ||
|
|
155
|
+
getSpacingPresetCssVar( gapBox?.top ) ||
|
|
156
|
+
'0.5em';
|
|
159
157
|
}
|
|
160
158
|
|
|
161
159
|
// If a block's block.json skips serialization for spacing or spacing.blockGap,
|
package/src/layouts/grid.js
CHANGED
|
@@ -21,7 +21,8 @@ import { useState } from '@wordpress/element';
|
|
|
21
21
|
* Internal dependencies
|
|
22
22
|
*/
|
|
23
23
|
import { appendSelectors, getBlockGapCSS } from './utils';
|
|
24
|
-
import { getGapCSSValue } from '../hooks/gap';
|
|
24
|
+
import { getGapCSSValue, getGapBoxControlValueFromStyle } from '../hooks/gap';
|
|
25
|
+
import { getSpacingPresetCssVar } from '../components/spacing-sizes-control/utils';
|
|
25
26
|
import { shouldSkipSerialization } from '../hooks/utils';
|
|
26
27
|
import { LAYOUT_DEFINITIONS } from './definitions';
|
|
27
28
|
|
|
@@ -143,10 +144,12 @@ export default {
|
|
|
143
144
|
// If the gap value has both top and left (separated by space), use the left value for horizontal calculations.
|
|
144
145
|
let fallbackGapValue = '1.2rem';
|
|
145
146
|
if ( globalBlockGapValue ) {
|
|
146
|
-
const
|
|
147
|
-
|
|
147
|
+
const gapBox =
|
|
148
|
+
getGapBoxControlValueFromStyle( globalBlockGapValue );
|
|
148
149
|
fallbackGapValue =
|
|
149
|
-
|
|
150
|
+
getSpacingPresetCssVar( gapBox?.left ) ||
|
|
151
|
+
getSpacingPresetCssVar( gapBox?.top ) ||
|
|
152
|
+
'1.2rem';
|
|
150
153
|
}
|
|
151
154
|
|
|
152
155
|
// If a block's block.json skips serialization for spacing or spacing.blockGap,
|
package/src/private-apis.js
CHANGED
|
@@ -50,6 +50,7 @@ import {
|
|
|
50
50
|
isNavigationOverlayContextKey,
|
|
51
51
|
isNavigationPostEditorKey,
|
|
52
52
|
mediaUploadOnSuccessKey,
|
|
53
|
+
openMediaEditorModalKey,
|
|
53
54
|
} from './store/private-keys';
|
|
54
55
|
import { requiresWrapperOnCopy } from './components/writing-flow/utils';
|
|
55
56
|
import { PrivateRichText } from './components/rich-text/';
|
|
@@ -59,8 +60,8 @@ import { PrivatePublishDateTimePicker } from './components/publish-date-time-pic
|
|
|
59
60
|
import useSpacingSizes from './components/spacing-sizes-control/hooks/use-spacing-sizes';
|
|
60
61
|
import useBlockDisplayTitle from './components/block-title/use-block-display-title';
|
|
61
62
|
import TabbedSidebar from './components/tabbed-sidebar';
|
|
62
|
-
import
|
|
63
|
-
import
|
|
63
|
+
import NoteIconSlotFill from './components/collab/note-icon-slot';
|
|
64
|
+
import NoteIconToolbarSlotFill from './components/collab/note-icon-toolbar-slot';
|
|
64
65
|
import HTMLElementControl from './components/html-element-control';
|
|
65
66
|
import {
|
|
66
67
|
useBlockElementRef,
|
|
@@ -124,8 +125,8 @@ lock( privateApis, {
|
|
|
124
125
|
BlockStyleVariationOverridesWithConfig,
|
|
125
126
|
setBackgroundStyleDefaults,
|
|
126
127
|
sectionRootClientIdKey,
|
|
127
|
-
|
|
128
|
-
|
|
128
|
+
NoteIconSlotFill,
|
|
129
|
+
NoteIconToolbarSlotFill,
|
|
129
130
|
mediaEditKey,
|
|
130
131
|
getMediaSelectKey,
|
|
131
132
|
deviceTypeKey,
|
|
@@ -133,6 +134,7 @@ lock( privateApis, {
|
|
|
133
134
|
isNavigationOverlayContextKey,
|
|
134
135
|
isNavigationPostEditorKey,
|
|
135
136
|
mediaUploadOnSuccessKey,
|
|
137
|
+
openMediaEditorModalKey,
|
|
136
138
|
useBlockElement,
|
|
137
139
|
useBlockElementRef,
|
|
138
140
|
LinkPicker,
|
|
@@ -12,3 +12,4 @@ export const isNavigationOverlayContextKey = Symbol(
|
|
|
12
12
|
);
|
|
13
13
|
export const isNavigationPostEditorKey = Symbol( 'isNavigationPostEditor' );
|
|
14
14
|
export const mediaUploadOnSuccessKey = Symbol( 'mediaUploadOnSuccess' );
|
|
15
|
+
export const openMediaEditorModalKey = Symbol( 'openMediaEditorModal' );
|
package/src/utils/dom.js
CHANGED
|
@@ -80,14 +80,14 @@ export function rectUnion( rect1, rect2 ) {
|
|
|
80
80
|
* @param {Element} element Element.
|
|
81
81
|
* @return {boolean} Whether the element is visible.
|
|
82
82
|
*/
|
|
83
|
-
function isElementVisible( element ) {
|
|
83
|
+
export function isElementVisible( element ) {
|
|
84
84
|
const viewport = element.ownerDocument.defaultView;
|
|
85
85
|
if ( ! viewport ) {
|
|
86
86
|
return false;
|
|
87
87
|
}
|
|
88
88
|
|
|
89
|
-
// Check for <VisuallyHidden>
|
|
90
|
-
if ( element.
|
|
89
|
+
// Check for <VisuallyHidden> components.
|
|
90
|
+
if ( element.hasAttribute( 'data-visually-hidden' ) ) {
|
|
91
91
|
return false;
|
|
92
92
|
}
|
|
93
93
|
|
package/src/utils/test/dom.js
CHANGED
|
@@ -1,8 +1,51 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
import {
|
|
1
|
+
import { render, screen } from '@testing-library/react';
|
|
2
|
+
// eslint-disable-next-line @wordpress/use-recommended-components -- Required for testing
|
|
3
|
+
import { VisuallyHidden as WCVisuallyHidden } from '@wordpress/components';
|
|
4
|
+
import { VisuallyHidden } from '@wordpress/ui';
|
|
5
|
+
import {
|
|
6
|
+
getElementBounds,
|
|
7
|
+
isElementVisible,
|
|
8
|
+
WITH_OVERFLOW_ELEMENT_BLOCKS,
|
|
9
|
+
} from '../dom';
|
|
10
|
+
|
|
11
|
+
function mockVisibleBoundingClientRect( element ) {
|
|
12
|
+
element.getBoundingClientRect = jest.fn().mockReturnValue( {
|
|
13
|
+
left: 0,
|
|
14
|
+
top: 0,
|
|
15
|
+
right: 100,
|
|
16
|
+
bottom: 20,
|
|
17
|
+
width: 100,
|
|
18
|
+
height: 20,
|
|
19
|
+
x: 0,
|
|
20
|
+
y: 0,
|
|
21
|
+
} );
|
|
22
|
+
}
|
|
23
|
+
|
|
5
24
|
describe( 'dom', () => {
|
|
25
|
+
describe( 'isElementVisible', () => {
|
|
26
|
+
it( 'returns false for @wordpress/components VisuallyHidden', () => {
|
|
27
|
+
render(
|
|
28
|
+
<WCVisuallyHidden data-testid="wc-visually-hidden">
|
|
29
|
+
Hidden
|
|
30
|
+
</WCVisuallyHidden>
|
|
31
|
+
);
|
|
32
|
+
const element = screen.getByTestId( 'wc-visually-hidden' );
|
|
33
|
+
mockVisibleBoundingClientRect( element );
|
|
34
|
+
expect( isElementVisible( element ) ).toBe( false );
|
|
35
|
+
} );
|
|
36
|
+
|
|
37
|
+
it( 'returns false for @wordpress/ui VisuallyHidden', () => {
|
|
38
|
+
render(
|
|
39
|
+
<VisuallyHidden data-testid="ui-visually-hidden">
|
|
40
|
+
Hidden
|
|
41
|
+
</VisuallyHidden>
|
|
42
|
+
);
|
|
43
|
+
const element = screen.getByTestId( 'ui-visually-hidden' );
|
|
44
|
+
mockVisibleBoundingClientRect( element );
|
|
45
|
+
expect( isElementVisible( element ) ).toBe( false );
|
|
46
|
+
} );
|
|
47
|
+
} );
|
|
48
|
+
|
|
6
49
|
describe( 'getElementBounds', () => {
|
|
7
50
|
it( 'should return a DOMRectReadOnly object if the viewport is not available', () => {
|
|
8
51
|
const element = {
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"version": 3,
|
|
3
|
-
"sources": ["../../../src/components/collab/block-comment-icon-slot.js"],
|
|
4
|
-
"sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { createSlotFill } from '@wordpress/components';\n\nconst CommentIconSlotFill = createSlotFill( Symbol( 'CommentIconSlotFill' ) );\n\nexport default CommentIconSlotFill;\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,wBAA+B;AAE/B,IAAM,0BAAsB,kCAAgB,uBAAQ,qBAAsB,CAAE;AAE5E,IAAO,kCAAQ;",
|
|
6
|
-
"names": []
|
|
7
|
-
}
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"version": 3,
|
|
3
|
-
"sources": ["../../../src/components/collab/block-comment-icon-toolbar-slot.js"],
|
|
4
|
-
"sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { createSlotFill } from '@wordpress/components';\n\nconst CommentIconToolbarSlotFill = createSlotFill(\n\tSymbol( 'CommentIconToolbarSlotFill' )\n);\n\nexport default CommentIconToolbarSlotFill;\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,wBAA+B;AAE/B,IAAM,iCAA6B;AAAA,EAClC,uBAAQ,4BAA6B;AACtC;AAEA,IAAO,0CAAQ;",
|
|
6
|
-
"names": []
|
|
7
|
-
}
|
|
@@ -1,8 +0,0 @@
|
|
|
1
|
-
// packages/block-editor/src/components/collab/block-comment-icon-slot.js
|
|
2
|
-
import { createSlotFill } from "@wordpress/components";
|
|
3
|
-
var CommentIconSlotFill = createSlotFill(/* @__PURE__ */ Symbol("CommentIconSlotFill"));
|
|
4
|
-
var block_comment_icon_slot_default = CommentIconSlotFill;
|
|
5
|
-
export {
|
|
6
|
-
block_comment_icon_slot_default as default
|
|
7
|
-
};
|
|
8
|
-
//# sourceMappingURL=block-comment-icon-slot.mjs.map
|