@wordpress/block-editor 17.1.0 → 17.2.1-next.v.202609171837.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 +32 -0
- package/README.md +214 -214
- package/build/autocompleters/block.cjs.map +2 -2
- package/build/components/alignment-control/ui.cjs.map +2 -2
- package/build/components/background-image-control/index.cjs +1 -1
- package/build/components/background-image-control/index.cjs.map +2 -2
- package/build/components/block-alignment-control/ui.cjs +21 -7
- package/build/components/block-alignment-control/ui.cjs.map +3 -3
- package/build/components/block-alignment-control/use-available-alignments.cjs +60 -13
- package/build/components/block-alignment-control/use-available-alignments.cjs.map +2 -2
- package/build/components/block-allowed-blocks/allowed-blocks-control.cjs.map +2 -2
- package/build/components/block-bindings/attribute-control.cjs +30 -30
- package/build/components/block-bindings/attribute-control.cjs.map +3 -3
- package/build/components/block-bindings/source-fields-list.cjs +27 -32
- package/build/components/block-bindings/source-fields-list.cjs.map +3 -3
- package/build/components/block-canvas/index.cjs.map +2 -2
- package/build/components/block-card/index.cjs +1 -2
- package/build/components/block-card/index.cjs.map +3 -3
- package/build/components/block-edit/edit.cjs.map +2 -2
- package/build/components/block-heading-level-dropdown/index.cjs.map +2 -2
- package/build/components/block-icon/index.cjs.map +2 -2
- package/build/components/block-inspector/edit-contents.cjs.map +2 -2
- package/build/components/block-inspector/index.cjs +27 -8
- package/build/components/block-inspector/index.cjs.map +3 -3
- package/build/components/block-keyboard-shortcuts/index.cjs.map +2 -2
- package/build/components/block-list/block-html.cjs +1 -12
- package/build/components/block-list/block-html.cjs.map +3 -3
- package/build/components/block-list/block.cjs +2 -4
- package/build/components/block-list/block.cjs.map +2 -2
- package/build/components/block-list/layout.cjs +1 -1
- package/build/components/block-list/layout.cjs.map +2 -2
- package/build/components/block-list/use-block-props/index.cjs.map +2 -2
- package/build/components/block-lock/modal.cjs +1 -3
- package/build/components/block-lock/modal.cjs.map +2 -2
- package/build/components/block-parent-selector/index.cjs +8 -5
- package/build/components/block-parent-selector/index.cjs.map +2 -2
- package/build/components/block-popover/index.cjs.map +2 -2
- package/build/components/block-rename/modal.cjs.map +2 -2
- package/build/components/block-settings-menu/block-settings-dropdown.cjs.map +2 -2
- package/build/components/block-styles/utils.cjs.map +2 -2
- package/build/components/block-switcher/index.cjs.map +2 -2
- package/build/components/block-toolbar/edit-section-button.cjs.map +2 -2
- package/build/components/block-toolbar/index.cjs +6 -4
- package/build/components/block-toolbar/index.cjs.map +2 -2
- package/build/components/block-toolbar/switch-section-style.cjs.map +2 -2
- package/build/components/block-variation-transforms/index.cjs +28 -18
- package/build/components/block-variation-transforms/index.cjs.map +3 -3
- package/build/components/block-visibility/modal.cjs.map +2 -2
- package/build/components/block-visibility/viewport-visibility-info.cjs.map +2 -2
- package/build/components/border-radius-control/index.cjs.map +2 -2
- package/build/components/color-palette/with-color-context.cjs.map +2 -2
- package/build/components/colors/with-colors.cjs.map +2 -2
- package/build/components/colors-gradients/control.cjs.map +2 -2
- package/build/components/contrast-checker/index.cjs.map +2 -2
- package/build/components/date-format-picker/index.cjs.map +2 -2
- package/build/components/dimensions-tool/aspect-ratio-tool.cjs.map +3 -3
- package/build/components/dimensions-tool/width-height-tool.cjs.map +2 -2
- package/build/components/font-sizes/with-font-sizes.cjs.map +2 -2
- package/build/components/global-styles/background-panel.cjs +1 -1
- package/build/components/global-styles/background-panel.cjs.map +2 -2
- package/build/components/global-styles/border-panel.cjs +1 -1
- package/build/components/global-styles/border-panel.cjs.map +2 -2
- package/build/components/global-styles/color-gradient-dropdown-item.cjs +1 -1
- package/build/components/global-styles/color-gradient-dropdown-item.cjs.map +2 -2
- package/build/components/global-styles/color-panel.cjs +1 -1
- package/build/components/global-styles/color-panel.cjs.map +2 -2
- package/build/components/global-styles/dimensions-panel.cjs +1 -1
- package/build/components/global-styles/dimensions-panel.cjs.map +2 -2
- package/build/components/global-styles/filters-panel.cjs +1 -1
- package/build/components/global-styles/filters-panel.cjs.map +2 -2
- package/build/components/global-styles/hooks.cjs +1 -0
- package/build/components/global-styles/hooks.cjs.map +2 -2
- package/build/components/global-styles/inheritance/index.cjs +3 -3
- package/build/components/global-styles/inheritance/index.cjs.map +2 -2
- package/build/components/global-styles/inherited-value-context.cjs +0 -5
- package/build/components/global-styles/inherited-value-context.cjs.map +2 -2
- package/build/components/global-styles/state-control-badges.cjs +0 -1
- package/build/components/global-styles/state-control-badges.cjs.map +2 -2
- package/build/components/global-styles/state-control.cjs +6 -4
- package/build/components/global-styles/state-control.cjs.map +2 -2
- package/build/components/global-styles/text-shadow-panel.cjs +254 -0
- package/build/components/global-styles/text-shadow-panel.cjs.map +7 -0
- package/build/components/global-styles/typography-panel.cjs +46 -5
- package/build/components/global-styles/typography-panel.cjs.map +2 -2
- package/build/components/global-styles/typography-utils.cjs.map +2 -2
- package/build/components/global-styles/utils.cjs.map +2 -2
- package/build/components/html-element-control/index.cjs.map +3 -3
- package/build/components/iframe/index.cjs.map +2 -2
- package/build/components/iframe/use-scale-canvas.cjs.map +2 -2
- package/build/components/image-size-control/index.cjs.map +3 -3
- package/build/components/inner-blocks/index.cjs +6 -1
- package/build/components/inner-blocks/index.cjs.map +2 -2
- package/build/components/inner-content/index.cjs.map +2 -2
- package/build/components/inserter/block-patterns-tab/use-pattern-categories.cjs +4 -23
- package/build/components/inserter/block-patterns-tab/use-pattern-categories.cjs.map +2 -2
- package/build/components/inserter/block-patterns-tab/utils.cjs +26 -0
- package/build/components/inserter/block-patterns-tab/utils.cjs.map +2 -2
- package/build/components/inserter/hooks/use-block-types-state.cjs.map +2 -2
- package/build/components/inserter/hooks/use-insertion-point.cjs.map +2 -2
- package/build/components/inserter/hooks/use-patterns-state.cjs.map +2 -2
- package/build/components/inserter/media-tab/media-panel.cjs.map +2 -2
- package/build/components/inserter/media-tab/media-preview.cjs.map +2 -2
- package/build/components/inserter-list-item/index.cjs.map +2 -2
- package/build/components/inspector-controls/list-view-content-popover.cjs.map +2 -2
- package/build/components/link-control/search-results.cjs.map +2 -2
- package/build/components/link-control/use-search-handler.cjs +3 -0
- package/build/components/link-control/use-search-handler.cjs.map +2 -2
- package/build/components/list-view/branch.cjs.map +2 -2
- package/build/components/list-view/drop-indicator.cjs.map +2 -2
- package/build/components/list-view/index.cjs.map +2 -2
- package/build/components/list-view/use-list-view-drop-zone.cjs.map +2 -2
- package/build/components/list-view/utils.cjs.map +2 -2
- package/build/components/media-replace-flow/index.cjs +4 -1
- package/build/components/media-replace-flow/index.cjs.map +2 -2
- package/build/components/plain-text/index.cjs +1 -2
- package/build/components/plain-text/index.cjs.map +3 -3
- package/build/components/preset-input-control/index.cjs.map +2 -2
- package/build/components/provider/index.cjs +3 -1
- package/build/components/provider/index.cjs.map +2 -2
- package/build/components/provider/use-block-sync.cjs.map +2 -2
- package/build/components/publish-date-time-picker/index.cjs.map +2 -2
- package/build/components/resizable-box-popover/index.cjs +1 -1
- package/build/components/resizable-box-popover/index.cjs.map +1 -1
- package/build/components/resolution-tool/index.cjs.map +3 -3
- package/build/components/rich-text/event-listeners/enter.cjs +8 -22
- package/build/components/rich-text/event-listeners/enter.cjs.map +2 -2
- package/build/components/rich-text/format-edit.cjs.map +2 -2
- package/build/components/rich-text/index.cjs +20 -0
- package/build/components/rich-text/index.cjs.map +2 -2
- package/build/components/rich-text/multiline.cjs +10 -2
- package/build/components/rich-text/multiline.cjs.map +2 -2
- package/build/components/spacing-sizes-control/hooks/use-spacing-sizes.cjs.map +2 -2
- package/build/components/typewriter/index.cjs.map +2 -2
- package/build/components/use-block-commands/index.cjs.map +2 -2
- package/build/components/writing-flow/index.cjs +3 -0
- package/build/components/writing-flow/index.cjs.map +2 -2
- package/build/components/writing-flow/use-clipboard-handler.cjs.map +2 -2
- package/build/components/writing-flow/use-selection-observer.cjs +5 -3
- package/build/components/writing-flow/use-selection-observer.cjs.map +2 -2
- package/build/hooks/align.cjs +3 -5
- package/build/hooks/align.cjs.map +2 -2
- package/build/hooks/background.cjs.map +2 -2
- package/build/hooks/block-bindings.cjs.map +2 -2
- package/build/hooks/border.cjs.map +2 -2
- package/build/hooks/contrast-checker.cjs.map +2 -2
- package/build/hooks/dimensions.cjs.map +2 -2
- package/build/hooks/duotone.cjs.map +2 -2
- package/build/hooks/elements.cjs.map +2 -2
- package/build/hooks/fit-text.cjs.map +2 -2
- package/build/hooks/gap.cjs +2 -1
- package/build/hooks/gap.cjs.map +3 -3
- package/build/hooks/index.cjs +4 -2
- package/build/hooks/index.cjs.map +3 -3
- package/build/hooks/layout-child.cjs.map +2 -2
- package/build/hooks/layout.cjs +15 -14
- package/build/hooks/layout.cjs.map +3 -3
- package/build/hooks/position.cjs +3 -31
- package/build/hooks/position.cjs.map +2 -2
- package/build/hooks/states.cjs +3 -2
- package/build/hooks/states.cjs.map +2 -2
- package/build/hooks/text-shadow.cjs +100 -0
- package/build/hooks/text-shadow.cjs.map +7 -0
- package/build/hooks/typography.cjs +30 -6
- package/build/hooks/typography.cjs.map +2 -2
- package/build/hooks/utils.cjs +24 -2
- package/build/hooks/utils.cjs.map +2 -2
- package/build/layouts/grid.cjs.map +2 -2
- package/build/layouts/utils.cjs +7 -2
- package/build/layouts/utils.cjs.map +2 -2
- package/build/private-apis.cjs +9 -6
- package/build/private-apis.cjs.map +2 -2
- package/build/store/actions.cjs +26 -4
- package/build/store/actions.cjs.map +3 -3
- package/build/store/private-selectors.cjs.map +2 -2
- package/build/store/reducer.cjs.map +2 -2
- package/build/store/selectors.cjs.map +2 -2
- package/build/utils/get-font-styles-and-weights.cjs.map +2 -2
- package/build/utils/transform-styles/index.cjs.map +1 -1
- package/build-module/autocompleters/block.mjs.map +2 -2
- package/build-module/components/alignment-control/ui.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-alignment-control/ui.mjs +21 -7
- package/build-module/components/block-alignment-control/ui.mjs.map +2 -2
- package/build-module/components/block-alignment-control/use-available-alignments.mjs +56 -13
- package/build-module/components/block-alignment-control/use-available-alignments.mjs.map +2 -2
- package/build-module/components/block-allowed-blocks/allowed-blocks-control.mjs.map +2 -2
- package/build-module/components/block-bindings/attribute-control.mjs +31 -32
- package/build-module/components/block-bindings/attribute-control.mjs.map +2 -2
- package/build-module/components/block-bindings/source-fields-list.mjs +25 -30
- package/build-module/components/block-bindings/source-fields-list.mjs.map +2 -2
- package/build-module/components/block-canvas/index.mjs.map +2 -2
- package/build-module/components/block-card/index.mjs +3 -8
- package/build-module/components/block-card/index.mjs.map +2 -2
- package/build-module/components/block-edit/edit.mjs.map +2 -2
- package/build-module/components/block-heading-level-dropdown/index.mjs.map +2 -2
- package/build-module/components/block-icon/index.mjs.map +2 -2
- package/build-module/components/block-inspector/edit-contents.mjs.map +2 -2
- package/build-module/components/block-inspector/index.mjs +29 -10
- package/build-module/components/block-inspector/index.mjs.map +2 -2
- package/build-module/components/block-keyboard-shortcuts/index.mjs.map +2 -2
- package/build-module/components/block-list/block-html.mjs +1 -2
- package/build-module/components/block-list/block-html.mjs.map +2 -2
- package/build-module/components/block-list/block.mjs +2 -4
- package/build-module/components/block-list/block.mjs.map +2 -2
- package/build-module/components/block-list/layout.mjs +1 -1
- package/build-module/components/block-list/layout.mjs.map +2 -2
- package/build-module/components/block-list/use-block-props/index.mjs.map +2 -2
- package/build-module/components/block-lock/modal.mjs +1 -3
- package/build-module/components/block-lock/modal.mjs.map +2 -2
- package/build-module/components/block-parent-selector/index.mjs +8 -5
- package/build-module/components/block-parent-selector/index.mjs.map +2 -2
- package/build-module/components/block-popover/index.mjs.map +2 -2
- package/build-module/components/block-rename/modal.mjs.map +2 -2
- package/build-module/components/block-settings-menu/block-settings-dropdown.mjs.map +2 -2
- package/build-module/components/block-styles/utils.mjs.map +2 -2
- package/build-module/components/block-switcher/index.mjs.map +2 -2
- package/build-module/components/block-toolbar/edit-section-button.mjs.map +2 -2
- package/build-module/components/block-toolbar/index.mjs +6 -4
- package/build-module/components/block-toolbar/index.mjs.map +2 -2
- package/build-module/components/block-toolbar/switch-section-style.mjs.map +2 -2
- package/build-module/components/block-variation-transforms/index.mjs +30 -21
- package/build-module/components/block-variation-transforms/index.mjs.map +2 -2
- package/build-module/components/block-visibility/modal.mjs.map +2 -2
- package/build-module/components/block-visibility/viewport-visibility-info.mjs.map +2 -2
- package/build-module/components/border-radius-control/index.mjs.map +2 -2
- package/build-module/components/color-palette/with-color-context.mjs.map +2 -2
- package/build-module/components/colors/with-colors.mjs.map +2 -2
- package/build-module/components/colors-gradients/control.mjs.map +2 -2
- package/build-module/components/contrast-checker/index.mjs.map +2 -2
- package/build-module/components/date-format-picker/index.mjs.map +2 -2
- package/build-module/components/dimensions-tool/aspect-ratio-tool.mjs +2 -2
- package/build-module/components/dimensions-tool/aspect-ratio-tool.mjs.map +2 -2
- package/build-module/components/dimensions-tool/width-height-tool.mjs.map +2 -2
- package/build-module/components/font-sizes/with-font-sizes.mjs.map +2 -2
- package/build-module/components/global-styles/background-panel.mjs +2 -2
- package/build-module/components/global-styles/background-panel.mjs.map +2 -2
- package/build-module/components/global-styles/border-panel.mjs +2 -2
- package/build-module/components/global-styles/border-panel.mjs.map +2 -2
- package/build-module/components/global-styles/color-gradient-dropdown-item.mjs +2 -2
- package/build-module/components/global-styles/color-gradient-dropdown-item.mjs.map +2 -2
- package/build-module/components/global-styles/color-panel.mjs +2 -2
- package/build-module/components/global-styles/color-panel.mjs.map +2 -2
- package/build-module/components/global-styles/dimensions-panel.mjs +2 -2
- package/build-module/components/global-styles/dimensions-panel.mjs.map +2 -2
- package/build-module/components/global-styles/filters-panel.mjs +2 -2
- package/build-module/components/global-styles/filters-panel.mjs.map +2 -2
- package/build-module/components/global-styles/hooks.mjs +1 -0
- package/build-module/components/global-styles/hooks.mjs.map +2 -2
- package/build-module/components/global-styles/inheritance/index.mjs +2 -2
- package/build-module/components/global-styles/inheritance/index.mjs.map +2 -2
- package/build-module/components/global-styles/inherited-value-context.mjs +0 -5
- package/build-module/components/global-styles/inherited-value-context.mjs.map +2 -2
- package/build-module/components/global-styles/state-control-badges.mjs +0 -1
- package/build-module/components/global-styles/state-control-badges.mjs.map +2 -2
- package/build-module/components/global-styles/state-control.mjs +6 -4
- package/build-module/components/global-styles/state-control.mjs.map +2 -2
- package/build-module/components/global-styles/text-shadow-panel.mjs +224 -0
- package/build-module/components/global-styles/text-shadow-panel.mjs.map +7 -0
- package/build-module/components/global-styles/typography-panel.mjs +47 -6
- package/build-module/components/global-styles/typography-panel.mjs.map +2 -2
- package/build-module/components/global-styles/typography-utils.mjs.map +2 -2
- package/build-module/components/global-styles/utils.mjs.map +2 -2
- package/build-module/components/html-element-control/index.mjs +2 -2
- package/build-module/components/html-element-control/index.mjs.map +2 -2
- package/build-module/components/iframe/index.mjs.map +2 -2
- package/build-module/components/iframe/use-scale-canvas.mjs.map +2 -2
- package/build-module/components/image-size-control/index.mjs +2 -2
- package/build-module/components/image-size-control/index.mjs.map +2 -2
- package/build-module/components/inner-blocks/index.mjs +6 -1
- package/build-module/components/inner-blocks/index.mjs.map +2 -2
- package/build-module/components/inner-content/index.mjs.map +2 -2
- package/build-module/components/inserter/block-patterns-tab/use-pattern-categories.mjs +6 -24
- package/build-module/components/inserter/block-patterns-tab/use-pattern-categories.mjs.map +2 -2
- package/build-module/components/inserter/block-patterns-tab/utils.mjs +25 -0
- package/build-module/components/inserter/block-patterns-tab/utils.mjs.map +2 -2
- package/build-module/components/inserter/hooks/use-block-types-state.mjs.map +2 -2
- package/build-module/components/inserter/hooks/use-insertion-point.mjs.map +2 -2
- package/build-module/components/inserter/hooks/use-patterns-state.mjs.map +2 -2
- package/build-module/components/inserter/media-tab/media-panel.mjs.map +2 -2
- package/build-module/components/inserter/media-tab/media-preview.mjs.map +2 -2
- package/build-module/components/inserter-list-item/index.mjs.map +2 -2
- package/build-module/components/inspector-controls/list-view-content-popover.mjs.map +2 -2
- package/build-module/components/link-control/search-results.mjs.map +2 -2
- package/build-module/components/link-control/use-search-handler.mjs +3 -0
- package/build-module/components/link-control/use-search-handler.mjs.map +2 -2
- package/build-module/components/list-view/branch.mjs.map +2 -2
- package/build-module/components/list-view/drop-indicator.mjs.map +2 -2
- package/build-module/components/list-view/index.mjs.map +2 -2
- package/build-module/components/list-view/use-list-view-drop-zone.mjs.map +2 -2
- package/build-module/components/list-view/utils.mjs.map +2 -2
- package/build-module/components/media-replace-flow/index.mjs +4 -1
- package/build-module/components/media-replace-flow/index.mjs.map +2 -2
- package/build-module/components/plain-text/index.mjs +1 -2
- package/build-module/components/plain-text/index.mjs.map +2 -2
- package/build-module/components/preset-input-control/index.mjs.map +2 -2
- package/build-module/components/provider/index.mjs +3 -1
- package/build-module/components/provider/index.mjs.map +2 -2
- package/build-module/components/provider/use-block-sync.mjs.map +2 -2
- package/build-module/components/publish-date-time-picker/index.mjs.map +2 -2
- package/build-module/components/resizable-box-popover/index.mjs +1 -1
- package/build-module/components/resizable-box-popover/index.mjs.map +1 -1
- package/build-module/components/resolution-tool/index.mjs +2 -2
- package/build-module/components/resolution-tool/index.mjs.map +2 -2
- package/build-module/components/rich-text/event-listeners/enter.mjs +8 -22
- package/build-module/components/rich-text/event-listeners/enter.mjs.map +2 -2
- package/build-module/components/rich-text/format-edit.mjs.map +2 -2
- package/build-module/components/rich-text/index.mjs +21 -0
- package/build-module/components/rich-text/index.mjs.map +2 -2
- package/build-module/components/rich-text/multiline.mjs +11 -3
- package/build-module/components/rich-text/multiline.mjs.map +2 -2
- package/build-module/components/spacing-sizes-control/hooks/use-spacing-sizes.mjs.map +2 -2
- package/build-module/components/typewriter/index.mjs.map +2 -2
- package/build-module/components/use-block-commands/index.mjs.map +2 -2
- package/build-module/components/writing-flow/index.mjs +3 -0
- package/build-module/components/writing-flow/index.mjs.map +2 -2
- package/build-module/components/writing-flow/use-clipboard-handler.mjs.map +2 -2
- package/build-module/components/writing-flow/use-selection-observer.mjs +5 -3
- package/build-module/components/writing-flow/use-selection-observer.mjs.map +2 -2
- package/build-module/hooks/align.mjs +6 -6
- package/build-module/hooks/align.mjs.map +2 -2
- package/build-module/hooks/background.mjs.map +2 -2
- package/build-module/hooks/block-bindings.mjs.map +2 -2
- package/build-module/hooks/border.mjs.map +2 -2
- package/build-module/hooks/contrast-checker.mjs.map +2 -2
- package/build-module/hooks/dimensions.mjs.map +2 -2
- package/build-module/hooks/duotone.mjs.map +2 -2
- package/build-module/hooks/elements.mjs.map +2 -2
- package/build-module/hooks/fit-text.mjs.map +2 -2
- package/build-module/hooks/gap.mjs +2 -1
- package/build-module/hooks/gap.mjs.map +2 -2
- package/build-module/hooks/index.mjs +4 -2
- package/build-module/hooks/index.mjs.map +2 -2
- package/build-module/hooks/layout-child.mjs.map +2 -2
- package/build-module/hooks/layout.mjs +6 -5
- package/build-module/hooks/layout.mjs.map +2 -2
- package/build-module/hooks/position.mjs +5 -33
- package/build-module/hooks/position.mjs.map +2 -2
- package/build-module/hooks/states.mjs +3 -2
- package/build-module/hooks/states.mjs.map +2 -2
- package/build-module/hooks/text-shadow.mjs +65 -0
- package/build-module/hooks/text-shadow.mjs.map +7 -0
- package/build-module/hooks/typography.mjs +30 -6
- package/build-module/hooks/typography.mjs.map +2 -2
- package/build-module/hooks/utils.mjs +24 -2
- package/build-module/hooks/utils.mjs.map +2 -2
- package/build-module/layouts/grid.mjs.map +2 -2
- package/build-module/layouts/utils.mjs +5 -1
- package/build-module/layouts/utils.mjs.map +2 -2
- package/build-module/private-apis.mjs +6 -2
- package/build-module/private-apis.mjs.map +2 -2
- package/build-module/store/actions.mjs +28 -5
- package/build-module/store/actions.mjs.map +3 -3
- package/build-module/store/private-selectors.mjs.map +2 -2
- package/build-module/store/reducer.mjs.map +2 -2
- package/build-module/store/selectors.mjs.map +2 -2
- package/build-module/utils/get-font-styles-and-weights.mjs.map +2 -2
- package/build-module/utils/transform-styles/index.mjs.map +1 -1
- package/build-style/content-rtl.css +7 -2
- package/build-style/content.css +7 -2
- package/build-style/style-rtl.css +90 -25
- package/build-style/style.css +92 -25
- package/package.json +42 -43
- package/src/autocompleters/block.jsx +4 -4
- package/src/components/alignment-control/ui.jsx +1 -1
- package/src/components/background-image-control/index.jsx +3 -3
- package/src/components/block-alignment-control/test/index.jsdom.test.jsx +267 -0
- package/src/components/block-alignment-control/ui.jsx +47 -9
- package/src/components/block-alignment-control/use-available-alignments.js +106 -20
- package/src/components/block-allowed-blocks/allowed-blocks-control.jsx +1 -1
- package/src/components/block-bindings/attribute-control.jsx +27 -29
- package/src/components/block-bindings/source-fields-list.jsx +22 -32
- package/src/components/block-bindings/test/attribute-control.jsdom.test.jsx +115 -0
- package/src/components/block-canvas/index.jsx +1 -1
- package/src/components/block-card/index.jsx +5 -11
- package/src/components/block-card/style.scss +1 -0
- package/src/components/block-edit/edit.jsx +1 -1
- package/src/components/block-heading-level-dropdown/index.jsx +1 -1
- package/src/components/block-icon/index.jsx +1 -1
- package/src/components/block-icon/test/index.browser.test.jsx +74 -0
- package/src/components/block-inspector/edit-contents.jsx +2 -2
- package/src/components/block-inspector/index.jsx +46 -15
- package/src/components/block-inspector/style.scss +16 -0
- package/src/components/block-keyboard-shortcuts/index.jsx +2 -2
- package/src/components/block-list/block-html.jsx +2 -3
- package/src/components/block-list/block.jsx +7 -5
- package/src/components/block-list/content.scss +3 -2
- package/src/components/block-list/layout.jsx +4 -1
- package/src/components/block-list/test/layout.jsdom.test.js +40 -0
- package/src/components/block-list/use-block-props/index.js +1 -1
- package/src/components/block-lock/modal.jsx +2 -3
- package/src/components/block-lock/style.scss +1 -1
- package/src/components/block-mover/style.scss +0 -13
- package/src/components/block-parent-selector/index.jsx +12 -6
- package/src/components/block-patterns-list/style.scss +1 -1
- package/src/components/block-popover/index.jsx +1 -1
- package/src/components/block-rename/modal.jsx +3 -3
- package/src/components/block-settings-menu/block-settings-dropdown.jsx +1 -1
- package/src/components/block-styles/utils.js +1 -1
- package/src/components/block-switcher/index.jsx +3 -3
- package/src/components/block-toolbar/edit-section-button.jsx +2 -2
- package/src/components/block-toolbar/index.jsx +8 -4
- package/src/components/block-toolbar/switch-section-style.jsx +1 -1
- package/src/components/block-variation-transforms/index.jsx +24 -23
- package/src/components/block-variation-transforms/test/index.jsdom.test.jsx +93 -0
- package/src/components/block-visibility/modal.jsx +7 -7
- package/src/components/block-visibility/style.scss +1 -1
- package/src/components/block-visibility/viewport-visibility-info.jsx +5 -7
- package/src/components/border-radius-control/index.jsx +2 -2
- package/src/components/border-radius-control/test/index.jsdom.test.jsx +0 -22
- package/src/components/border-radius-control/test/select.browser.test.js +30 -0
- package/src/components/color-palette/with-color-context.jsx +1 -1
- package/src/components/colors/with-colors.jsx +1 -1
- package/src/components/colors-gradients/control.jsx +2 -2
- package/src/components/colors-gradients/test/{control.jsdom.test.jsx → control.browser.test.jsx} +6 -9
- package/src/components/contrast-checker/index.jsx +2 -2
- package/src/components/date-format-picker/index.jsx +2 -2
- package/src/components/dimensions-tool/aspect-ratio-tool.jsx +4 -4
- package/src/components/dimensions-tool/test/index.jsdom.test.jsx +17 -11
- package/src/components/dimensions-tool/width-height-tool.jsx +2 -2
- package/src/components/font-sizes/with-font-sizes.jsx +2 -3
- package/src/components/global-styles/background-panel.jsx +2 -2
- package/src/components/global-styles/border-panel.jsx +2 -2
- package/src/components/global-styles/color-gradient-dropdown-item.jsx +3 -3
- package/src/components/global-styles/color-panel.jsx +3 -3
- package/src/components/global-styles/dimensions-panel.jsx +6 -6
- package/src/components/global-styles/filters-panel.jsx +2 -2
- package/src/components/global-styles/hooks.js +1 -0
- package/src/components/global-styles/inheritance/index.jsx +9 -6
- package/src/components/global-styles/inheritance/test/{index.jsdom.test.jsx → index.browser.test.jsx} +34 -28
- package/src/components/global-styles/inherited-value-context.js +1 -9
- package/src/components/global-styles/state-control-badges.jsx +0 -1
- package/src/components/global-styles/state-control.jsx +12 -3
- package/src/components/global-styles/style.scss +68 -0
- package/src/components/global-styles/test/{color-panel.jsdom.test.jsx → color-panel.browser.test.jsx} +53 -54
- package/src/components/global-styles/test/inherited-value-context-core.jsdom.test.js +17 -26
- package/src/components/global-styles/test/{typography-panel-core.jsdom.test.jsx → typography-panel-core.browser.test.jsx} +84 -39
- package/src/components/global-styles/test/{typography-panel.jsdom.test.jsx → typography-panel.browser.test.jsx} +80 -122
- package/src/components/global-styles/text-shadow-panel.tsx +257 -0
- package/src/components/global-styles/typography-panel.jsx +52 -13
- package/src/components/global-styles/typography-utils.js +2 -2
- package/src/components/global-styles/utils.js +1 -1
- package/src/components/html-element-control/index.jsx +2 -2
- package/src/components/iframe/index.jsx +1 -1
- package/src/components/iframe/use-scale-canvas.js +1 -1
- package/src/components/image-size-control/index.jsx +2 -2
- package/src/components/inner-blocks/index.jsx +9 -1
- package/src/components/inner-content/index.jsx +1 -1
- package/src/components/inserter/block-patterns-tab/use-pattern-categories.js +7 -33
- package/src/components/inserter/block-patterns-tab/utils.js +44 -0
- package/src/components/inserter/hooks/use-block-types-state.js +2 -2
- package/src/components/inserter/hooks/use-insertion-point.js +1 -1
- package/src/components/inserter/hooks/use-patterns-state.js +1 -1
- package/src/components/inserter/media-tab/media-panel.jsx +9 -9
- package/src/components/inserter/media-tab/media-preview.jsx +1 -1
- package/src/components/inserter-list-item/index.jsx +1 -1
- package/src/components/inserter-list-item/style.scss +2 -2
- package/src/components/inspector-controls/list-view-content-popover.jsx +1 -1
- package/src/components/link-control/search-results.jsx +1 -1
- package/src/components/link-control/style.scss +1 -1
- package/src/components/link-control/test/index.jsdom.test.jsx +38 -110
- package/src/components/link-control/test/keyboard-selection.browser.test.js +110 -0
- package/src/components/link-control/use-search-handler.js +8 -3
- package/src/components/list-view/branch.jsx +1 -1
- package/src/components/list-view/drop-indicator.jsx +3 -3
- package/src/components/list-view/index.jsx +1 -1
- package/src/components/list-view/style.scss +1 -9
- package/src/components/list-view/use-list-view-drop-zone.js +1 -1
- package/src/components/list-view/utils.js +1 -1
- package/src/components/media-replace-flow/index.jsx +4 -1
- package/src/components/navigable-toolbar/test/index.browser.test.js +6 -7
- package/src/components/plain-text/README.md +3 -2
- package/src/components/plain-text/content.scss +0 -1
- package/src/components/plain-text/index.jsx +2 -3
- package/src/components/plain-text/style.scss +4 -0
- package/src/components/preset-input-control/index.jsx +2 -2
- package/src/components/preset-input-control/test/index.jsdom.test.jsx +0 -56
- package/src/components/preset-input-control/test/interaction.browser.test.js +63 -0
- package/src/components/provider/index.jsx +5 -3
- package/src/components/provider/use-block-sync.js +5 -5
- package/src/components/publish-date-time-picker/index.jsx +1 -1
- package/src/components/resizable-box-popover/index.jsx +1 -1
- package/src/components/resolution-tool/index.jsx +2 -2
- package/src/components/responsive-block-control/style.scss +1 -2
- package/src/components/responsive-block-control/test/index.jsdom.test.jsx +2 -2
- package/src/components/rich-text/event-listeners/enter.js +16 -23
- package/src/components/rich-text/format-edit.jsx +1 -1
- package/src/components/rich-text/index.jsx +39 -2
- package/src/components/rich-text/multiline.jsx +11 -3
- package/src/components/spacing-sizes-control/hooks/use-spacing-sizes.js +1 -1
- package/src/components/spacing-sizes-control/test/index.jsdom.test.jsx +0 -21
- package/src/components/spacing-sizes-control/test/select.browser.test.js +58 -0
- package/src/components/typewriter/index.jsx +1 -1
- package/src/components/url-input/test/fixtures/validated-input-control-deprecation.js +1 -1
- package/src/components/use-block-commands/index.js +1 -1
- package/src/components/use-block-drop-zone/test/index.js +2 -2
- package/src/components/writing-flow/index.jsx +8 -0
- package/src/components/writing-flow/use-clipboard-handler.js +1 -1
- package/src/components/writing-flow/use-selection-observer.js +15 -6
- package/src/content.scss +1 -0
- package/src/hooks/align.jsx +22 -6
- package/src/hooks/background.jsx +1 -1
- package/src/hooks/block-bindings.jsx +1 -1
- package/src/hooks/block-hooks.scss +0 -6
- package/src/hooks/border.jsx +2 -2
- package/src/hooks/contrast-checker.js +1 -1
- package/src/hooks/dimensions.jsx +2 -2
- package/src/hooks/duotone.jsx +3 -3
- package/src/hooks/elements.jsx +3 -3
- package/src/hooks/fit-text.jsx +1 -1
- package/src/hooks/gap.js +2 -4
- package/src/hooks/index.js +3 -1
- package/src/hooks/layout-child.jsx +3 -4
- package/src/hooks/layout.jsx +17 -18
- package/src/hooks/position.jsx +5 -36
- package/src/hooks/states.jsx +6 -2
- package/src/hooks/test/layout.jsdom.test.js +44 -1
- package/src/hooks/text-shadow.ts +105 -0
- package/src/hooks/typography.jsx +58 -30
- package/src/hooks/utils.jsx +23 -1
- package/src/layouts/grid.jsx +2 -2
- package/src/layouts/test/flex.jsdom.test.jsx +4 -3
- package/src/layouts/test/utils.js +48 -1
- package/src/layouts/utils.js +19 -0
- package/src/private-apis.js +4 -0
- package/src/store/actions.js +50 -10
- package/src/store/private-selectors.js +5 -5
- package/src/store/reducer.js +6 -6
- package/src/store/selectors.js +3 -3
- package/src/store/test/actions.jsdom.test.js +60 -0
- package/src/style.scss +1 -0
- package/src/utils/get-font-styles-and-weights.ts +1 -1
- package/src/utils/transform-styles/index.ts +1 -1
- package/build/hooks/cross-origin-isolation.cjs +0 -56
- package/build/hooks/cross-origin-isolation.cjs.map +0 -7
- package/build-module/hooks/cross-origin-isolation.mjs +0 -54
- package/build-module/hooks/cross-origin-isolation.mjs.map +0 -7
- package/src/components/block-icon/test/__snapshots__/index.jsdom.test.jsx.snap +0 -27
- package/src/components/block-icon/test/index.jsdom.test.jsx +0 -67
- package/src/hooks/cross-origin-isolation.js +0 -73
- package/src/hooks/test/cross-origin-isolation.jsdom.test.js +0 -173
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/utils/get-font-styles-and-weights.ts"],
|
|
4
|
-
"sourcesContent": ["import { _x, sprintf } from '@wordpress/i18n';\nimport { formatFontStyle } from './format-font-style';\nimport { formatFontWeight } from './format-font-weight';\nimport type {\n\tFontFamilyFace,\n\tFormattedFont,\n\tCombinedStyleAndWeightOption,\n} from './types';\n\nconst FONT_STYLES = [\n\t{\n\t\tname: _x( 'Regular', 'font style' ),\n\t\tvalue: 'normal',\n\t},\n\t{\n\t\tname: _x( 'Italic', 'font style' ),\n\t\tvalue: 'italic',\n\t},\n];\n\nconst FONT_WEIGHTS = [\n\t{\n\t\tname: _x( 'Thin', 'font weight' ),\n\t\tvalue: '100',\n\t},\n\t{\n\t\tname: _x( 'Extra Light', 'font weight' ),\n\t\tvalue: '200',\n\t},\n\t{\n\t\tname: _x( 'Light', 'font weight' ),\n\t\tvalue: '300',\n\t},\n\t{\n\t\tname: _x( 'Regular', 'font weight' ),\n\t\tvalue: '400',\n\t},\n\t{\n\t\tname: _x( 'Medium', 'font weight' ),\n\t\tvalue: '500',\n\t},\n\t{\n\t\tname: _x( 'Semi Bold', 'font weight' ),\n\t\tvalue: '600',\n\t},\n\t{\n\t\tname: _x( 'Bold', 'font weight' ),\n\t\tvalue: '700',\n\t},\n\t{\n\t\tname: _x( 'Extra Bold', 'font weight' ),\n\t\tvalue: '800',\n\t},\n\t{\n\t\tname: _x( 'Black', 'font weight' ),\n\t\tvalue: '900',\n\t},\n\t{\n\t\tname: _x( 'Extra Black', 'font weight' ),\n\t\tvalue: '1000',\n\t},\n];\n\n/**\n * Builds a list of font style and weight options based on font family faces.\n * Defaults to the standard font styles and weights if no font family faces are provided.\n *\n * @param fontFamilyFaces font family faces array\n * @return new object with combined and separated font style and weight properties\n */\nexport function getFontStylesAndWeights(\n\tfontFamilyFaces: FontFamilyFace[] | undefined\n) {\n\tlet fontStyles: FormattedFont[] = [];\n\tlet fontWeights: FormattedFont[] = [];\n\tconst combinedStyleAndWeightOptions: CombinedStyleAndWeightOption[] = [];\n\tconst isSystemFont = ! fontFamilyFaces || fontFamilyFaces?.length === 0;\n\tlet isVariableFont = false;\n\n\tfontFamilyFaces?.forEach( ( face ) => {\n\t\t// Check for variable font by looking for a space in the font weight value. e.g. \"100 900\"\n\t\tif (\n\t\t\t'string' === typeof face.fontWeight &&\n\t\t\t/\\s/.test( face.fontWeight.trim() )\n\t\t) {\n\t\t\tisVariableFont = true;\n\n\t\t\t// Find font weight start and end values.\n\t\t\tconst [ startStr, endStr ] = face.fontWeight.split( ' ' );\n\t\t\tconst startValue = parseInt( startStr.slice( 0, 1 ) );\n\t\t\tconst endValue =\n\t\t\t\tendStr === '1000' ? 10 : parseInt( endStr.slice( 0, 1 ) );\n\n\t\t\t// Create font weight options for available variable weights.\n\t\t\tfor ( let i = startValue; i <= endValue; i++ ) {\n\t\t\t\tconst fontWeightValue = `${ i.toString() }00`;\n\t\t\t\tif (\n\t\t\t\t\t! fontWeights.some(\n\t\t\t\t\t\t( weight ) => weight.value === fontWeightValue\n\t\t\t\t\t)\n\t\t\t\t) {\n\t\t\t\t\tfontWeights.push( formatFontWeight( fontWeightValue ) );\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\t// Format font style and weight values.\n\t\tconst fontWeight = formatFontWeight(\n\t\t\t'number' === typeof face.fontWeight\n\t\t\t\t? face.fontWeight.toString()\n\t\t\t\t: face.fontWeight\n\t\t);\n\t\tconst fontStyle = formatFontStyle( face.fontStyle );\n\n\t\t// Create font style and font weight lists without duplicates.\n\t\tif ( fontStyle && Object.keys( fontStyle ).length ) {\n\t\t\tif (\n\t\t\t\t! fontStyles.some(\n\t\t\t\t\t( style ) => style.value === fontStyle.value\n\t\t\t\t)\n\t\t\t) {\n\t\t\t\tfontStyles.push( fontStyle );\n\t\t\t}\n\t\t}\n\n\t\tif ( fontWeight && Object.keys( fontWeight ).length ) {\n\t\t\tif (\n\t\t\t\t! fontWeights.some(\n\t\t\t\t\t( weight ) => weight.value === fontWeight.value\n\t\t\t\t)\n\t\t\t) {\n\t\t\t\tif ( ! isVariableFont ) {\n\t\t\t\t\tfontWeights.push( fontWeight );\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t} );\n\n\t// If there is no font weight of 600 or above, then include faux bold as an option.\n\tif ( ! fontWeights.some( ( weight ) => ( weight.value ?? '' ) >= '600' ) ) {\n\t\tfontWeights.push( {\n\t\t\tname: _x( 'Bold', 'font weight' ),\n\t\t\tvalue: '700',\n\t\t} );\n\t}\n\n\t// If there is no italic font style, then include faux italic as an option.\n\tif ( ! fontStyles.some( ( style ) => style.value === 'italic' ) ) {\n\t\tfontStyles.push( {\n\t\t\tname: _x( 'Italic', 'font style' ),\n\t\t\tvalue: 'italic',\n\t\t} );\n\t}\n\n\t// Use default font styles and weights for system fonts.\n\tif ( isSystemFont ) {\n\t\tfontStyles = FONT_STYLES;\n\t\tfontWeights = FONT_WEIGHTS;\n\t}\n\n\t// Use default styles and weights if there are no available styles or weights from the provided font faces.\n\tfontStyles = fontStyles.length === 0 ? FONT_STYLES : fontStyles;\n\tfontWeights = fontWeights.length === 0 ? FONT_WEIGHTS : fontWeights;\n\n\t// Generate combined font style and weight options for available fonts.\n\tfontStyles.forEach( ( { name: styleName, value: styleValue } ) => {\n\t\tfontWeights.forEach( ( { name: weightName, value: weightValue } ) => {\n\t\t\tconst optionName =\n\t\t\t\tstyleValue === 'normal'\n\t\t\t\t\t? weightName\n\t\t\t\t\t: sprintf(\n\t\t\t\t\t\t\t/* translators: 1: Font weight name. 2: Font style name. */\n\t\t\t\t\t\t\t_x( '%1$s %2$s', 'font' ),\n\t\t\t\t\t\t\tweightName ?? '',\n\t\t\t\t\t\t\tstyleName ?? ''\n\t\t\t\t\t
|
|
5
|
-
"mappings": "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
|
|
4
|
+
"sourcesContent": ["import { _x, sprintf } from '@wordpress/i18n';\nimport { formatFontStyle } from './format-font-style';\nimport { formatFontWeight } from './format-font-weight';\nimport type {\n\tFontFamilyFace,\n\tFormattedFont,\n\tCombinedStyleAndWeightOption,\n} from './types';\n\nconst FONT_STYLES = [\n\t{\n\t\tname: _x( 'Regular', 'font style' ),\n\t\tvalue: 'normal',\n\t},\n\t{\n\t\tname: _x( 'Italic', 'font style' ),\n\t\tvalue: 'italic',\n\t},\n];\n\nconst FONT_WEIGHTS = [\n\t{\n\t\tname: _x( 'Thin', 'font weight' ),\n\t\tvalue: '100',\n\t},\n\t{\n\t\tname: _x( 'Extra Light', 'font weight' ),\n\t\tvalue: '200',\n\t},\n\t{\n\t\tname: _x( 'Light', 'font weight' ),\n\t\tvalue: '300',\n\t},\n\t{\n\t\tname: _x( 'Regular', 'font weight' ),\n\t\tvalue: '400',\n\t},\n\t{\n\t\tname: _x( 'Medium', 'font weight' ),\n\t\tvalue: '500',\n\t},\n\t{\n\t\tname: _x( 'Semi Bold', 'font weight' ),\n\t\tvalue: '600',\n\t},\n\t{\n\t\tname: _x( 'Bold', 'font weight' ),\n\t\tvalue: '700',\n\t},\n\t{\n\t\tname: _x( 'Extra Bold', 'font weight' ),\n\t\tvalue: '800',\n\t},\n\t{\n\t\tname: _x( 'Black', 'font weight' ),\n\t\tvalue: '900',\n\t},\n\t{\n\t\tname: _x( 'Extra Black', 'font weight' ),\n\t\tvalue: '1000',\n\t},\n];\n\n/**\n * Builds a list of font style and weight options based on font family faces.\n * Defaults to the standard font styles and weights if no font family faces are provided.\n *\n * @param fontFamilyFaces font family faces array\n * @return new object with combined and separated font style and weight properties\n */\nexport function getFontStylesAndWeights(\n\tfontFamilyFaces: FontFamilyFace[] | undefined\n) {\n\tlet fontStyles: FormattedFont[] = [];\n\tlet fontWeights: FormattedFont[] = [];\n\tconst combinedStyleAndWeightOptions: CombinedStyleAndWeightOption[] = [];\n\tconst isSystemFont = ! fontFamilyFaces || fontFamilyFaces?.length === 0;\n\tlet isVariableFont = false;\n\n\tfontFamilyFaces?.forEach( ( face ) => {\n\t\t// Check for variable font by looking for a space in the font weight value. e.g. \"100 900\"\n\t\tif (\n\t\t\t'string' === typeof face.fontWeight &&\n\t\t\t/\\s/.test( face.fontWeight.trim() )\n\t\t) {\n\t\t\tisVariableFont = true;\n\n\t\t\t// Find font weight start and end values.\n\t\t\tconst [ startStr, endStr ] = face.fontWeight.split( ' ' );\n\t\t\tconst startValue = parseInt( startStr.slice( 0, 1 ) );\n\t\t\tconst endValue =\n\t\t\t\tendStr === '1000' ? 10 : parseInt( endStr.slice( 0, 1 ) );\n\n\t\t\t// Create font weight options for available variable weights.\n\t\t\tfor ( let i = startValue; i <= endValue; i++ ) {\n\t\t\t\tconst fontWeightValue = `${ i.toString() }00`;\n\t\t\t\tif (\n\t\t\t\t\t! fontWeights.some(\n\t\t\t\t\t\t( weight ) => weight.value === fontWeightValue\n\t\t\t\t\t)\n\t\t\t\t) {\n\t\t\t\t\tfontWeights.push( formatFontWeight( fontWeightValue ) );\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\t// Format font style and weight values.\n\t\tconst fontWeight = formatFontWeight(\n\t\t\t'number' === typeof face.fontWeight\n\t\t\t\t? face.fontWeight.toString()\n\t\t\t\t: face.fontWeight\n\t\t);\n\t\tconst fontStyle = formatFontStyle( face.fontStyle );\n\n\t\t// Create font style and font weight lists without duplicates.\n\t\tif ( fontStyle && Object.keys( fontStyle ).length ) {\n\t\t\tif (\n\t\t\t\t! fontStyles.some(\n\t\t\t\t\t( style ) => style.value === fontStyle.value\n\t\t\t\t)\n\t\t\t) {\n\t\t\t\tfontStyles.push( fontStyle );\n\t\t\t}\n\t\t}\n\n\t\tif ( fontWeight && Object.keys( fontWeight ).length ) {\n\t\t\tif (\n\t\t\t\t! fontWeights.some(\n\t\t\t\t\t( weight ) => weight.value === fontWeight.value\n\t\t\t\t)\n\t\t\t) {\n\t\t\t\tif ( ! isVariableFont ) {\n\t\t\t\t\tfontWeights.push( fontWeight );\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t} );\n\n\t// If there is no font weight of 600 or above, then include faux bold as an option.\n\tif ( ! fontWeights.some( ( weight ) => ( weight.value ?? '' ) >= '600' ) ) {\n\t\tfontWeights.push( {\n\t\t\tname: _x( 'Bold', 'font weight' ),\n\t\t\tvalue: '700',\n\t\t} );\n\t}\n\n\t// If there is no italic font style, then include faux italic as an option.\n\tif ( ! fontStyles.some( ( style ) => style.value === 'italic' ) ) {\n\t\tfontStyles.push( {\n\t\t\tname: _x( 'Italic', 'font style' ),\n\t\t\tvalue: 'italic',\n\t\t} );\n\t}\n\n\t// Use default font styles and weights for system fonts.\n\tif ( isSystemFont ) {\n\t\tfontStyles = FONT_STYLES;\n\t\tfontWeights = FONT_WEIGHTS;\n\t}\n\n\t// Use default styles and weights if there are no available styles or weights from the provided font faces.\n\tfontStyles = fontStyles.length === 0 ? FONT_STYLES : fontStyles;\n\tfontWeights = fontWeights.length === 0 ? FONT_WEIGHTS : fontWeights;\n\n\t// Generate combined font style and weight options for available fonts.\n\tfontStyles.forEach( ( { name: styleName, value: styleValue } ) => {\n\t\tfontWeights.forEach( ( { name: weightName, value: weightValue } ) => {\n\t\t\tconst optionName =\n\t\t\t\tstyleValue === 'normal'\n\t\t\t\t\t? weightName\n\t\t\t\t\t: sprintf(\n\t\t\t\t\t\t\t/* translators: 1: Font weight name. 2: Font style name. */\n\t\t\t\t\t\t\t_x( '%1$s %2$s', 'font' ),\n\t\t\t\t\t\t\tweightName ?? '',\n\t\t\t\t\t\t\tstyleName ?? ''\n\t\t\t\t\t\t);\n\n\t\t\tcombinedStyleAndWeightOptions.push( {\n\t\t\t\tkey: `${ styleValue }-${ weightValue }`,\n\t\t\t\tname: optionName ?? '',\n\t\t\t\tstyle: {\n\t\t\t\t\tfontStyle: styleValue,\n\t\t\t\t\tfontWeight: weightValue,\n\t\t\t\t},\n\t\t\t} );\n\t\t} );\n\t} );\n\n\treturn {\n\t\tfontStyles,\n\t\tfontWeights,\n\t\tcombinedStyleAndWeightOptions,\n\t\tisSystemFont,\n\t\tisVariableFont,\n\t};\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/utils/transform-styles/index.ts"],
|
|
4
|
-
"sourcesContent": ["/// <reference path=\"./postcss-urlrebase.d.ts\" />\nimport * as parsel from 'parsel-js';\nimport Processor from 'postcss/lib/processor';\nimport CssSyntaxError from 'postcss/lib/css-syntax-error';\nimport prefixSelector from 'postcss-prefix-selector';\nimport rebaseUrl from 'postcss-urlrebase';\nimport type { EditorStyle, TransformOptions } from './types';\n\nconst cacheByWrapperSelector = new Map();\n\nconst ROOT_SELECTOR_TOKENS = [\n\t{ type: 'type', content: 'body' },\n\t{ type: 'type', content: 'html' },\n\t{ type: 'pseudo-class', content: ':root' },\n\t{ type: 'pseudo-class', content: ':where(body)' },\n\t{ type: 'pseudo-class', content: ':where(:root)' },\n\t{ type: 'pseudo-class', content: ':where(html)' },\n];\n\n/**\n * Prefixes root selectors in a way that ensures consistent specificity.\n * This requires special handling, since prefixing a classname before\n * html, body, or :root will generally result in an invalid selector.\n *\n * Some libraries will simply replace the root selector with the prefix\n * instead, but this results in inconsistent specificity.\n *\n * This function instead inserts the prefix after the root tags but before\n * any other part of the selector. This results in consistent specificity:\n * - If a `:where()` selector is used for the prefix, all selectors output\n * by `transformStyles` will have no specificity increase.\n * - If a classname, id, or something else is used as the prefix, all selectors\n * will have the same specificity bump when transformed.\n *\n * @param prefix The prefix.\n * @param selector The selector.\n *\n * @return The prefixed root selector.\n */\nfunction prefixRootSelector( prefix: string, selector: string ) {\n\t// Use a tokenizer, since regular expressions are unreliable.\n\tconst tokenized = parsel.tokenize( selector );\n\n\t// Find the last token that contains a root selector by walking back\n\t// through the tokens.\n\tconst lastRootIndex = tokenized.findLastIndex( ( { content, type } ) => {\n\t\treturn ROOT_SELECTOR_TOKENS.some(\n\t\t\t( rootSelector ) =>\n\t\t\t\tcontent === rootSelector.content && type === rootSelector.type\n\t\t);\n\t} );\n\n\t// Walk forwards to find the combinator after the last root.\n\t// This is where the root ends and the rest of the selector begins,\n\t// and the index to insert before.\n\t// Doing it this way takes into account that a root selector like\n\t// 'body' may have additional id/class/pseudo-class/attribute-selector\n\t// parts chained to it, which is difficult to quantify using a regex.\n\tlet insertionPoint = -1;\n\tfor ( let i = lastRootIndex + 1; i < tokenized.length; i++ ) {\n\t\tif ( tokenized[ i ].type === 'combinator' ) {\n\t\t\tinsertionPoint = i;\n\t\t\tbreak;\n\t\t}\n\t}\n\n\t// Tokenize and insert the prefix with a ' ' combinator before it.\n\tconst tokenizedPrefix = parsel.tokenize( prefix );\n\ttokenized.splice(\n\t\t// Insert at the insertion point, or the end.\n\t\tinsertionPoint === -1 ? tokenized.length : insertionPoint,\n\t\t0,\n\t\t{\n\t\t\ttype: 'combinator',\n\t\t\tcontent: ' ',\n\t\t\tpos: [ 0, 0 ],\n\t\t} as parsel.Token,\n\t\t...tokenizedPrefix\n\t);\n\n\treturn parsel.stringify( tokenized );\n}\n\nfunction transformStyle(\n\t{ css, ignoredSelectors = [], baseURL }: EditorStyle,\n\twrapperSelector = '',\n\ttransformOptions?: TransformOptions\n) {\n\t// When there is no wrapper selector and no base URL, there is no need\n\t// to transform the CSS. This is most cases because in the default\n\t// iframed editor, no wrapping is needed, and not many styles\n\t// provide a base URL.\n\tif ( ! wrapperSelector && ! baseURL ) {\n\t\treturn css;\n\t}\n\n\ttry {\n\t\tconst excludedSelectors = [\n\t\t\t...ignoredSelectors,\n\t\t\t...( transformOptions?.ignoredSelectors ?? [] ),\n\t\t\twrapperSelector,\n\t\t];\n\n\t\treturn new Processor(\n\t\t\t[\n\t\t\t\twrapperSelector &&\n\t\t\t\t\tprefixSelector( {\n\t\t\t\t\t\tprefix: wrapperSelector,\n\t\t\t\t\t\ttransform( prefix, selector, prefixedSelector ) {\n\t\t\t\t\t\t\t// For backwards compatibility, don't use the `exclude` option\n\t\t\t\t\t\t\t// of postcss-prefix-selector, instead handle it here to match\n\t\t\t\t\t\t\t// the behavior of the old library (postcss-prefix-wrap) that\n\t\t\t\t\t\t\t// `transformStyle` previously used.\n\t\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t\texcludedSelectors.some( ( excludedSelector ) =>\n\t\t\t\t\t\t\t\t\texcludedSelector instanceof RegExp\n\t\t\t\t\t\t\t\t\t\t? selector.match( excludedSelector )\n\t\t\t\t\t\t\t\t\t\t: selector.includes( excludedSelector )\n\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\treturn selector;\n\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\tconst hasRootSelector = ROOT_SELECTOR_TOKENS.some(\n\t\t\t\t\t\t\t\t( rootSelector ) =>\n\t\t\t\t\t\t\t\t\tselector.startsWith( rootSelector.content )\n\t\t\t\t\t\t\t);\n\n\t\t\t\t\t\t\t// Reorganize root selectors such that the root part comes before the prefix,\n\t\t\t\t\t\t\t// but the prefix still comes before the remaining part of the selector.\n\t\t\t\t\t\t\tif ( hasRootSelector ) {\n\t\t\t\t\t\t\t\treturn prefixRootSelector( prefix, selector );\n\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\treturn prefixedSelector;\n\t\t\t\t\t\t},\n\t\t\t\t\t} ),\n\t\t\t\tbaseURL && rebaseUrl( { rootUrl: baseURL } ),\n\t\t\t].filter( Boolean ) as import('postcss').AcceptedPlugin[]\n\t\t).process( css, {} ).css; // use sync PostCSS API\n\t} catch ( error ) {\n\t\tif ( error instanceof CssSyntaxError ) {\n\t\t\t// eslint-disable-next-line no-console\n\t\t\tconsole.warn(\n\t\t\t\t'wp.blockEditor.transformStyles Failed to transform CSS.',\n\t\t\t\terror.message + '\\n' + error.showSourceCode( false )\n\t\t\t);\n\t\t} else {\n\t\t\t// eslint-disable-next-line no-console\n\t\t\tconsole.warn(\n\t\t\t\t'wp.blockEditor.transformStyles Failed to transform CSS.',\n\t\t\t\terror\n\t\t\t);\n\t\t}\n\n\t\treturn null;\n\t}\n}\n\n/**\n * Applies a series of CSS rule transforms to wrap selectors inside a given class and/or rewrite URLs depending on the parameters passed.\n *\n * @param styles CSS rules.\n * @param wrapperSelector Wrapper selector.\n * @param transformOptions Additional options for style transformation.\n * @return converted rules.\n */\nconst transformStyles = (\n\tstyles: EditorStyle[],\n\twrapperSelector = '',\n\ttransformOptions?: TransformOptions\n) => {\n\tlet cache = cacheByWrapperSelector.get( wrapperSelector );\n\tif ( ! cache ) {\n\t\tcache = new WeakMap();\n\t\tcacheByWrapperSelector.set( wrapperSelector, cache );\n\t}\n\treturn styles.map( ( style ) => {\n\t\tlet css = cache.get( style );\n\t\tif ( ! css ) {\n\t\t\tcss = transformStyle( style, wrapperSelector, transformOptions );\n\t\t\tcache.set( style, css );\n\t\t}\n\t\treturn css;\n\t} );\n};\n\nexport default transformStyles;\n"],
|
|
4
|
+
"sourcesContent": ["/// <reference path=\"./postcss-urlrebase.d.ts\" />\nimport * as parsel from 'parsel-js';\nimport Processor from 'postcss/lib/processor';\nimport CssSyntaxError from 'postcss/lib/css-syntax-error';\nimport prefixSelector from 'postcss-prefix-selector';\nimport rebaseUrl from 'postcss-urlrebase';\nimport type { EditorStyle, TransformOptions } from './types';\n\nconst cacheByWrapperSelector = new Map();\n\nconst ROOT_SELECTOR_TOKENS = [\n\t{ type: 'type', content: 'body' },\n\t{ type: 'type', content: 'html' },\n\t{ type: 'pseudo-class', content: ':root' },\n\t{ type: 'pseudo-class', content: ':where(body)' },\n\t{ type: 'pseudo-class', content: ':where(:root)' },\n\t{ type: 'pseudo-class', content: ':where(html)' },\n];\n\n/**\n * Prefixes root selectors in a way that ensures consistent specificity.\n * This requires special handling, since prefixing a classname before\n * html, body, or :root will generally result in an invalid selector.\n *\n * Some libraries will simply replace the root selector with the prefix\n * instead, but this results in inconsistent specificity.\n *\n * This function instead inserts the prefix after the root tags but before\n * any other part of the selector. This results in consistent specificity:\n * - If a `:where()` selector is used for the prefix, all selectors output\n * by `transformStyles` will have no specificity increase.\n * - If a classname, id, or something else is used as the prefix, all selectors\n * will have the same specificity bump when transformed.\n *\n * @param prefix The prefix.\n * @param selector The selector.\n *\n * @return The prefixed root selector.\n */\nfunction prefixRootSelector( prefix: string, selector: string ) {\n\t// Use a tokenizer, since regular expressions are unreliable.\n\tconst tokenized = parsel.tokenize( selector );\n\n\t// Find the last token that contains a root selector by walking back\n\t// through the tokens.\n\tconst lastRootIndex = tokenized.findLastIndex( ( { content, type } ) => {\n\t\treturn ROOT_SELECTOR_TOKENS.some(\n\t\t\t( rootSelector ) =>\n\t\t\t\tcontent === rootSelector.content && type === rootSelector.type\n\t\t);\n\t} );\n\n\t// Walk forwards to find the combinator after the last root.\n\t// This is where the root ends and the rest of the selector begins,\n\t// and the index to insert before.\n\t// Doing it this way takes into account that a root selector like\n\t// 'body' may have additional id/class/pseudo-class/attribute-selector\n\t// parts chained to it, which is difficult to quantify using a regex.\n\tlet insertionPoint = -1;\n\tfor ( let i = lastRootIndex + 1; i < tokenized.length; i++ ) {\n\t\tif ( tokenized[ i ].type === 'combinator' ) {\n\t\t\tinsertionPoint = i;\n\t\t\tbreak;\n\t\t}\n\t}\n\n\t// Tokenize and insert the prefix with a ' ' combinator before it.\n\tconst tokenizedPrefix = parsel.tokenize( prefix );\n\ttokenized.splice(\n\t\t// Insert at the insertion point, or the end.\n\t\tinsertionPoint === -1 ? tokenized.length : insertionPoint,\n\t\t0,\n\t\t{\n\t\t\ttype: 'combinator',\n\t\t\tcontent: ' ',\n\t\t\tpos: [ 0, 0 ],\n\t\t} as parsel.Token,\n\t\t...tokenizedPrefix\n\t);\n\n\treturn parsel.stringify( tokenized );\n}\n\nfunction transformStyle(\n\t{ css, ignoredSelectors = [], baseURL }: EditorStyle,\n\twrapperSelector = '',\n\ttransformOptions?: TransformOptions\n) {\n\t// When there is no wrapper selector and no base URL, there is no need\n\t// to transform the CSS. This is most cases because in the default\n\t// iframed editor, no wrapping is needed, and not many styles\n\t// provide a base URL.\n\tif ( ! wrapperSelector && ! baseURL ) {\n\t\treturn css;\n\t}\n\n\ttry {\n\t\tconst excludedSelectors = [\n\t\t\t...ignoredSelectors,\n\t\t\t...( transformOptions?.ignoredSelectors ?? [] ),\n\t\t\twrapperSelector,\n\t\t];\n\n\t\treturn new Processor(\n\t\t\t[\n\t\t\t\twrapperSelector &&\n\t\t\t\t\tprefixSelector( {\n\t\t\t\t\t\tprefix: wrapperSelector,\n\t\t\t\t\t\ttransform( prefix, selector, prefixedSelector ) {\n\t\t\t\t\t\t\t// For backwards compatibility, don't use the `exclude` option\n\t\t\t\t\t\t\t// of postcss-prefix-selector, instead handle it here to match\n\t\t\t\t\t\t\t// the behavior of the old library (postcss-prefix-wrap) that\n\t\t\t\t\t\t\t// `transformStyle` previously used.\n\t\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t\texcludedSelectors.some( ( excludedSelector ) =>\n\t\t\t\t\t\t\t\t\texcludedSelector instanceof RegExp\n\t\t\t\t\t\t\t\t\t\t? selector.match( excludedSelector )\n\t\t\t\t\t\t\t\t\t\t: selector.includes( excludedSelector )\n\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\treturn selector;\n\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\tconst hasRootSelector = ROOT_SELECTOR_TOKENS.some(\n\t\t\t\t\t\t\t\t( rootSelector ) =>\n\t\t\t\t\t\t\t\t\tselector.startsWith( rootSelector.content )\n\t\t\t\t\t\t\t);\n\n\t\t\t\t\t\t\t// Reorganize root selectors such that the root part comes before the prefix,\n\t\t\t\t\t\t\t// but the prefix still comes before the remaining part of the selector.\n\t\t\t\t\t\t\tif ( hasRootSelector ) {\n\t\t\t\t\t\t\t\treturn prefixRootSelector( prefix, selector );\n\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\treturn prefixedSelector;\n\t\t\t\t\t\t},\n\t\t\t\t\t} ),\n\t\t\t\tbaseURL && rebaseUrl( { rootUrl: baseURL } ),\n\t\t\t].filter( Boolean ) as import( 'postcss' ).AcceptedPlugin[]\n\t\t).process( css, {} ).css; // use sync PostCSS API\n\t} catch ( error ) {\n\t\tif ( error instanceof CssSyntaxError ) {\n\t\t\t// eslint-disable-next-line no-console\n\t\t\tconsole.warn(\n\t\t\t\t'wp.blockEditor.transformStyles Failed to transform CSS.',\n\t\t\t\terror.message + '\\n' + error.showSourceCode( false )\n\t\t\t);\n\t\t} else {\n\t\t\t// eslint-disable-next-line no-console\n\t\t\tconsole.warn(\n\t\t\t\t'wp.blockEditor.transformStyles Failed to transform CSS.',\n\t\t\t\terror\n\t\t\t);\n\t\t}\n\n\t\treturn null;\n\t}\n}\n\n/**\n * Applies a series of CSS rule transforms to wrap selectors inside a given class and/or rewrite URLs depending on the parameters passed.\n *\n * @param styles CSS rules.\n * @param wrapperSelector Wrapper selector.\n * @param transformOptions Additional options for style transformation.\n * @return converted rules.\n */\nconst transformStyles = (\n\tstyles: EditorStyle[],\n\twrapperSelector = '',\n\ttransformOptions?: TransformOptions\n) => {\n\tlet cache = cacheByWrapperSelector.get( wrapperSelector );\n\tif ( ! cache ) {\n\t\tcache = new WeakMap();\n\t\tcacheByWrapperSelector.set( wrapperSelector, cache );\n\t}\n\treturn styles.map( ( style ) => {\n\t\tlet css = cache.get( style );\n\t\tif ( ! css ) {\n\t\t\tcss = transformStyle( style, wrapperSelector, transformOptions );\n\t\t\tcache.set( style, css );\n\t\t}\n\t\treturn css;\n\t} );\n};\n\nexport default transformStyles;\n"],
|
|
5
5
|
"mappings": "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",
|
|
6
6
|
"names": ["Processor", "prefixSelector", "rebaseUrl", "CssSyntaxError"]
|
|
7
7
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/autocompleters/block.jsx"],
|
|
4
|
-
"sourcesContent": ["import { useSelect } from '@wordpress/data';\nimport {\n\tcloneBlock,\n\tcreateBlock,\n\tcreateBlocksFromInnerBlocksTemplate,\n\tstore as blocksStore,\n} from '@wordpress/blocks';\nimport { useMemo } from '@wordpress/element';\nimport { searchBlockItems } from '../components/inserter/search-items';\nimport useBlockTypesState from '../components/inserter/hooks/use-block-types-state';\nimport BlockIcon from '../components/block-icon';\nimport { store as blockEditorStore } from '../store';\nimport { orderBy } from '../utils/sorting';\nimport { orderInserterBlockItems } from '../utils/order-inserter-block-items';\n\nconst noop = () => {};\nconst SHOWN_BLOCK_TYPES = 9;\n\n/**\n * Creates a blocks repeater for replacing the current block with a selected block type.\n *\n * @return {Object} A blocks completer.\n */\nfunction createBlockCompleter() {\n\treturn {\n\t\tname: 'blocks',\n\t\tclassName: 'block-editor-autocompleters__block',\n\t\ttriggerPrefix: '/',\n\n\t\tuseItems( filterValue ) {\n\t\t\tconst { rootClientId, selectedBlockId, prioritizedBlocks } =\n\t\t\t\tuseSelect( ( select ) => {\n\t\t\t\t\tconst {\n\t\t\t\t\t\tgetSelectedBlockClientId,\n\t\t\t\t\t\tgetBlock,\n\t\t\t\t\t\tgetBlockListSettings,\n\t\t\t\t\t\tgetBlockRootClientId,\n\t\t\t\t\t} = select( blockEditorStore );\n\t\t\t\t\tconst { getActiveBlockVariation } = select( blocksStore );\n\t\t\t\t\tconst selectedBlockClientId = getSelectedBlockClientId();\n\t\t\t\t\tconst { name: blockName, attributes } = getBlock(\n\t\t\t\t\t\tselectedBlockClientId\n\t\t\t\t\t);\n\t\t\t\t\tconst activeBlockVariation = getActiveBlockVariation(\n\t\t\t\t\t\tblockName,\n\t\t\t\t\t\tattributes\n\t\t\t\t\t);\n\t\t\t\t\tconst _rootClientId = getBlockRootClientId(\n\t\t\t\t\t\tselectedBlockClientId\n\t\t\t\t\t);\n\t\t\t\t\treturn {\n\t\t\t\t\t\tselectedBlockId: activeBlockVariation\n\t\t\t\t\t\t\t? `${ blockName }/${ activeBlockVariation.name }`\n\t\t\t\t\t\t\t: blockName,\n\t\t\t\t\t\trootClientId: _rootClientId,\n\t\t\t\t\t\tprioritizedBlocks:\n\t\t\t\t\t\t\tgetBlockListSettings( _rootClientId )\n\t\t\t\t\t\t\t\t?.prioritizedInserterBlocks,\n\t\t\t\t\t};\n\t\t\t\t}, [] );\n\t\t\tconst [ items, categories, collections ] = useBlockTypesState(\n\t\t\t\trootClientId,\n\t\t\t\tnoop,\n\t\t\t\ttrue\n\t\t\t);\n\n\t\t\tconst filteredItems = useMemo( () => {\n\t\t\t\tconst initialFilteredItems = !! filterValue.trim()\n\t\t\t\t\t? searchBlockItems(\n\t\t\t\t\t\t\titems,\n\t\t\t\t\t\t\tcategories,\n\t\t\t\t\t\t\tcollections,\n\t\t\t\t\t\t\tfilterValue\n\t\t\t\t\t
|
|
5
|
-
"mappings": ";AAAA,SAAS,iBAAiB;AAC1B;AAAA,EACC;AAAA,EACA;AAAA,EACA;AAAA,EACA,SAAS;AAAA,OACH;AACP,SAAS,eAAe;AACxB,SAAS,wBAAwB;AACjC,OAAO,wBAAwB;AAC/B,OAAO,eAAe;AACtB,SAAS,SAAS,wBAAwB;AAC1C,SAAS,eAAe;AACxB,SAAS,+BAA+B;AAsFhC,mBACC,KADD;AApFR,IAAM,OAAO,MAAM;AAAC;AACpB,IAAM,oBAAoB;AAO1B,SAAS,uBAAuB;AAC/B,SAAO;AAAA,IACN,MAAM;AAAA,IACN,WAAW;AAAA,IACX,eAAe;AAAA,IAEf,SAAU,aAAc;AACvB,YAAM,EAAE,cAAc,iBAAiB,kBAAkB,IACxD,UAAW,CAAE,WAAY;AACxB,cAAM;AAAA,UACL;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,QACD,IAAI,OAAQ,gBAAiB;AAC7B,cAAM,EAAE,wBAAwB,IAAI,OAAQ,WAAY;AACxD,cAAM,wBAAwB,yBAAyB;AACvD,cAAM,EAAE,MAAM,WAAW,WAAW,IAAI;AAAA,UACvC;AAAA,QACD;AACA,cAAM,uBAAuB;AAAA,UAC5B;AAAA,UACA;AAAA,QACD;AACA,cAAM,gBAAgB;AAAA,UACrB;AAAA,QACD;AACA,eAAO;AAAA,UACN,iBAAiB,uBACd,GAAI,SAAU,IAAK,qBAAqB,IAAK,KAC7C;AAAA,UACH,cAAc;AAAA,UACd,mBACC,qBAAsB,aAAc,GACjC;AAAA,QACL;AAAA,MACD,GAAG,CAAC,CAAE;AACP,YAAM,CAAE,OAAO,YAAY,WAAY,IAAI;AAAA,QAC1C;AAAA,QACA;AAAA,QACA;AAAA,MACD;AAEA,YAAM,gBAAgB,QAAS,MAAM;AACpC,cAAM,uBAAuB,CAAC,CAAE,YAAY,KAAK,IAC9C;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,
|
|
4
|
+
"sourcesContent": ["import { useSelect } from '@wordpress/data';\nimport {\n\tcloneBlock,\n\tcreateBlock,\n\tcreateBlocksFromInnerBlocksTemplate,\n\tstore as blocksStore,\n} from '@wordpress/blocks';\nimport { useMemo } from '@wordpress/element';\nimport { searchBlockItems } from '../components/inserter/search-items';\nimport useBlockTypesState from '../components/inserter/hooks/use-block-types-state';\nimport BlockIcon from '../components/block-icon';\nimport { store as blockEditorStore } from '../store';\nimport { orderBy } from '../utils/sorting';\nimport { orderInserterBlockItems } from '../utils/order-inserter-block-items';\n\nconst noop = () => {};\nconst SHOWN_BLOCK_TYPES = 9;\n\n/**\n * Creates a blocks repeater for replacing the current block with a selected block type.\n *\n * @return {Object} A blocks completer.\n */\nfunction createBlockCompleter() {\n\treturn {\n\t\tname: 'blocks',\n\t\tclassName: 'block-editor-autocompleters__block',\n\t\ttriggerPrefix: '/',\n\n\t\tuseItems( filterValue ) {\n\t\t\tconst { rootClientId, selectedBlockId, prioritizedBlocks } =\n\t\t\t\tuseSelect( ( select ) => {\n\t\t\t\t\tconst {\n\t\t\t\t\t\tgetSelectedBlockClientId,\n\t\t\t\t\t\tgetBlock,\n\t\t\t\t\t\tgetBlockListSettings,\n\t\t\t\t\t\tgetBlockRootClientId,\n\t\t\t\t\t} = select( blockEditorStore );\n\t\t\t\t\tconst { getActiveBlockVariation } = select( blocksStore );\n\t\t\t\t\tconst selectedBlockClientId = getSelectedBlockClientId();\n\t\t\t\t\tconst { name: blockName, attributes } = getBlock(\n\t\t\t\t\t\tselectedBlockClientId\n\t\t\t\t\t);\n\t\t\t\t\tconst activeBlockVariation = getActiveBlockVariation(\n\t\t\t\t\t\tblockName,\n\t\t\t\t\t\tattributes\n\t\t\t\t\t);\n\t\t\t\t\tconst _rootClientId = getBlockRootClientId(\n\t\t\t\t\t\tselectedBlockClientId\n\t\t\t\t\t);\n\t\t\t\t\treturn {\n\t\t\t\t\t\tselectedBlockId: activeBlockVariation\n\t\t\t\t\t\t\t? `${ blockName }/${ activeBlockVariation.name }`\n\t\t\t\t\t\t\t: blockName,\n\t\t\t\t\t\trootClientId: _rootClientId,\n\t\t\t\t\t\tprioritizedBlocks:\n\t\t\t\t\t\t\tgetBlockListSettings( _rootClientId )\n\t\t\t\t\t\t\t\t?.prioritizedInserterBlocks,\n\t\t\t\t\t};\n\t\t\t\t}, [] );\n\t\t\tconst [ items, categories, collections ] = useBlockTypesState(\n\t\t\t\trootClientId,\n\t\t\t\tnoop,\n\t\t\t\ttrue\n\t\t\t);\n\n\t\t\tconst filteredItems = useMemo( () => {\n\t\t\t\tconst initialFilteredItems = !! filterValue.trim()\n\t\t\t\t\t? searchBlockItems(\n\t\t\t\t\t\t\titems,\n\t\t\t\t\t\t\tcategories,\n\t\t\t\t\t\t\tcollections,\n\t\t\t\t\t\t\tfilterValue\n\t\t\t\t\t\t)\n\t\t\t\t\t: orderInserterBlockItems(\n\t\t\t\t\t\t\torderBy( items, 'frecency', 'desc' ),\n\t\t\t\t\t\t\tprioritizedBlocks\n\t\t\t\t\t\t);\n\n\t\t\t\treturn initialFilteredItems\n\t\t\t\t\t.filter( ( item ) => item.id !== selectedBlockId )\n\t\t\t\t\t.slice( 0, SHOWN_BLOCK_TYPES );\n\t\t\t}, [\n\t\t\t\tfilterValue,\n\t\t\t\tselectedBlockId,\n\t\t\t\titems,\n\t\t\t\tcategories,\n\t\t\t\tcollections,\n\t\t\t\tprioritizedBlocks,\n\t\t\t] );\n\n\t\t\tconst options = useMemo(\n\t\t\t\t() =>\n\t\t\t\t\tfilteredItems.map( ( blockItem ) => {\n\t\t\t\t\t\tconst { title, icon, isDisabled } = blockItem;\n\t\t\t\t\t\treturn {\n\t\t\t\t\t\t\tkey: `block-${ blockItem.id }`,\n\t\t\t\t\t\t\tvalue: blockItem,\n\t\t\t\t\t\t\tlabel: (\n\t\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t\t<BlockIcon\n\t\t\t\t\t\t\t\t\t\tkey=\"icon\"\n\t\t\t\t\t\t\t\t\t\ticon={ icon }\n\t\t\t\t\t\t\t\t\t\tshowColors\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t{ title }\n\t\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\tisDisabled,\n\t\t\t\t\t\t};\n\t\t\t\t\t} ),\n\t\t\t\t[ filteredItems ]\n\t\t\t);\n\n\t\t\treturn [ options ];\n\t\t},\n\t\tallowContext( before, after ) {\n\t\t\treturn ! ( /\\S/.test( before ) || /\\S/.test( after ) );\n\t\t},\n\t\tgetOptionCompletion( inserterItem ) {\n\t\t\tconst {\n\t\t\t\tname,\n\t\t\t\tinitialAttributes,\n\t\t\t\tinnerBlocks,\n\t\t\t\tinnerContent,\n\t\t\t\tsyncStatus,\n\t\t\t\tblocks,\n\t\t\t} = inserterItem;\n\n\t\t\treturn {\n\t\t\t\taction: 'replace',\n\t\t\t\tvalue:\n\t\t\t\t\tsyncStatus === 'unsynced'\n\t\t\t\t\t\t? ( blocks ?? [] ).map( ( block ) =>\n\t\t\t\t\t\t\t\tcloneBlock( block )\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t: createBlock(\n\t\t\t\t\t\t\t\tname,\n\t\t\t\t\t\t\t\tinitialAttributes,\n\t\t\t\t\t\t\t\tcreateBlocksFromInnerBlocksTemplate(\n\t\t\t\t\t\t\t\t\tinnerBlocks\n\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t\tinnerContent\n\t\t\t\t\t\t\t),\n\t\t\t};\n\t\t},\n\t};\n}\n\n/**\n * Creates a blocks repeater for replacing the current block with a selected block type.\n *\n * @return {Object} A blocks completer.\n */\nexport default createBlockCompleter();\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/alignment-control/ui.jsx"],
|
|
4
|
-
"sourcesContent": ["import { __, isRTL } from '@wordpress/i18n';\nimport { ToolbarDropdownMenu, ToolbarGroup } from '@wordpress/components';\nimport { alignLeft, alignRight, alignCenter } from '@wordpress/icons';\n\nconst DEFAULT_ALIGNMENT_CONTROLS = [\n\t{\n\t\ticon: alignLeft,\n\t\ttitle: __( 'Align text left' ),\n\t\talign: 'left',\n\t},\n\t{\n\t\ticon: alignCenter,\n\t\ttitle: __( 'Align text center' ),\n\t\talign: 'center',\n\t},\n\t{\n\t\ticon: alignRight,\n\t\ttitle: __( 'Align text right' ),\n\t\talign: 'right',\n\t},\n];\n\nconst POPOVER_PROPS = {\n\tplacement: 'bottom-start',\n};\n\nfunction AlignmentUI( {\n\tvalue,\n\tonChange,\n\talignmentControls = DEFAULT_ALIGNMENT_CONTROLS,\n\tlabel = __( 'Align text' ),\n\tdescription,\n\tisCollapsed = true,\n\tisToolbar,\n} ) {\n\tfunction applyOrUnset( align ) {\n\t\treturn () => onChange( value === align ? undefined : align );\n\t}\n\n\tconst activeAlignment = alignmentControls.find(\n\t\t( control ) => control.align === value\n\t);\n\n\tfunction setIcon() {\n\t\tif ( activeAlignment ) {\n\t\t\treturn activeAlignment.icon;\n\t\t}\n\t\treturn isRTL() ? alignRight : alignLeft;\n\t}\n\n\tconst UIComponent = isToolbar ? ToolbarGroup : ToolbarDropdownMenu;\n\tconst extraProps = isToolbar\n\t\t? { isCollapsed }\n\t\t: {\n\t\t\t\ttoggleProps: description ? { description } : {},\n\t\t\t\tpopoverProps: POPOVER_PROPS,\n\t\t
|
|
5
|
-
"mappings": ";AAAA,SAAS,IAAI,aAAa;AAC1B,SAAS,qBAAqB,oBAAoB;AAClD,SAAS,WAAW,YAAY,mBAAmB;AAyDjD;AAvDF,IAAM,6BAA6B;AAAA,EAClC;AAAA,IACC,MAAM;AAAA,IACN,OAAO,GAAI,iBAAkB;AAAA,IAC7B,OAAO;AAAA,EACR;AAAA,EACA;AAAA,IACC,MAAM;AAAA,IACN,OAAO,GAAI,mBAAoB;AAAA,IAC/B,OAAO;AAAA,EACR;AAAA,EACA;AAAA,IACC,MAAM;AAAA,IACN,OAAO,GAAI,kBAAmB;AAAA,IAC9B,OAAO;AAAA,EACR;AACD;AAEA,IAAM,gBAAgB;AAAA,EACrB,WAAW;AACZ;AAEA,SAAS,YAAa;AAAA,EACrB;AAAA,EACA;AAAA,EACA,oBAAoB;AAAA,EACpB,QAAQ,GAAI,YAAa;AAAA,EACzB;AAAA,EACA,cAAc;AAAA,EACd;AACD,GAAI;AACH,WAAS,aAAc,OAAQ;AAC9B,WAAO,MAAM,SAAU,UAAU,QAAQ,SAAY,KAAM;AAAA,EAC5D;AAEA,QAAM,kBAAkB,kBAAkB;AAAA,IACzC,CAAE,YAAa,QAAQ,UAAU;AAAA,EAClC;AAEA,WAAS,UAAU;AAClB,QAAK,iBAAkB;AACtB,aAAO,gBAAgB;AAAA,IACxB;AACA,WAAO,MAAM,IAAI,aAAa;AAAA,EAC/B;AAEA,QAAM,cAAc,YAAY,eAAe;AAC/C,QAAM,aAAa,YAChB,EAAE,YAAY,IACd;AAAA,IACA,aAAa,cAAc,EAAE,YAAY,IAAI,CAAC;AAAA,IAC9C,cAAc;AAAA,
|
|
4
|
+
"sourcesContent": ["import { __, isRTL } from '@wordpress/i18n';\nimport { ToolbarDropdownMenu, ToolbarGroup } from '@wordpress/components';\nimport { alignLeft, alignRight, alignCenter } from '@wordpress/icons';\n\nconst DEFAULT_ALIGNMENT_CONTROLS = [\n\t{\n\t\ticon: alignLeft,\n\t\ttitle: __( 'Align text left' ),\n\t\talign: 'left',\n\t},\n\t{\n\t\ticon: alignCenter,\n\t\ttitle: __( 'Align text center' ),\n\t\talign: 'center',\n\t},\n\t{\n\t\ticon: alignRight,\n\t\ttitle: __( 'Align text right' ),\n\t\talign: 'right',\n\t},\n];\n\nconst POPOVER_PROPS = {\n\tplacement: 'bottom-start',\n};\n\nfunction AlignmentUI( {\n\tvalue,\n\tonChange,\n\talignmentControls = DEFAULT_ALIGNMENT_CONTROLS,\n\tlabel = __( 'Align text' ),\n\tdescription,\n\tisCollapsed = true,\n\tisToolbar,\n} ) {\n\tfunction applyOrUnset( align ) {\n\t\treturn () => onChange( value === align ? undefined : align );\n\t}\n\n\tconst activeAlignment = alignmentControls.find(\n\t\t( control ) => control.align === value\n\t);\n\n\tfunction setIcon() {\n\t\tif ( activeAlignment ) {\n\t\t\treturn activeAlignment.icon;\n\t\t}\n\t\treturn isRTL() ? alignRight : alignLeft;\n\t}\n\n\tconst UIComponent = isToolbar ? ToolbarGroup : ToolbarDropdownMenu;\n\tconst extraProps = isToolbar\n\t\t? { isCollapsed }\n\t\t: {\n\t\t\t\ttoggleProps: description ? { description } : {},\n\t\t\t\tpopoverProps: POPOVER_PROPS,\n\t\t\t};\n\n\treturn (\n\t\t<UIComponent\n\t\t\ticon={ setIcon() }\n\t\t\tlabel={ label }\n\t\t\tcontrols={ alignmentControls.map( ( control ) => {\n\t\t\t\tconst { align } = control;\n\t\t\t\tconst isActive = value === align;\n\n\t\t\t\treturn {\n\t\t\t\t\t...control,\n\t\t\t\t\tisActive,\n\t\t\t\t\trole: isCollapsed ? 'menuitemradio' : undefined,\n\t\t\t\t\tonClick: applyOrUnset( align ),\n\t\t\t\t};\n\t\t\t} ) }\n\t\t\t{ ...extraProps }\n\t\t/>\n\t);\n}\n\nexport default AlignmentUI;\n"],
|
|
5
|
+
"mappings": ";AAAA,SAAS,IAAI,aAAa;AAC1B,SAAS,qBAAqB,oBAAoB;AAClD,SAAS,WAAW,YAAY,mBAAmB;AAyDjD;AAvDF,IAAM,6BAA6B;AAAA,EAClC;AAAA,IACC,MAAM;AAAA,IACN,OAAO,GAAI,iBAAkB;AAAA,IAC7B,OAAO;AAAA,EACR;AAAA,EACA;AAAA,IACC,MAAM;AAAA,IACN,OAAO,GAAI,mBAAoB;AAAA,IAC/B,OAAO;AAAA,EACR;AAAA,EACA;AAAA,IACC,MAAM;AAAA,IACN,OAAO,GAAI,kBAAmB;AAAA,IAC9B,OAAO;AAAA,EACR;AACD;AAEA,IAAM,gBAAgB;AAAA,EACrB,WAAW;AACZ;AAEA,SAAS,YAAa;AAAA,EACrB;AAAA,EACA;AAAA,EACA,oBAAoB;AAAA,EACpB,QAAQ,GAAI,YAAa;AAAA,EACzB;AAAA,EACA,cAAc;AAAA,EACd;AACD,GAAI;AACH,WAAS,aAAc,OAAQ;AAC9B,WAAO,MAAM,SAAU,UAAU,QAAQ,SAAY,KAAM;AAAA,EAC5D;AAEA,QAAM,kBAAkB,kBAAkB;AAAA,IACzC,CAAE,YAAa,QAAQ,UAAU;AAAA,EAClC;AAEA,WAAS,UAAU;AAClB,QAAK,iBAAkB;AACtB,aAAO,gBAAgB;AAAA,IACxB;AACA,WAAO,MAAM,IAAI,aAAa;AAAA,EAC/B;AAEA,QAAM,cAAc,YAAY,eAAe;AAC/C,QAAM,aAAa,YAChB,EAAE,YAAY,IACd;AAAA,IACA,aAAa,cAAc,EAAE,YAAY,IAAI,CAAC;AAAA,IAC9C,cAAc;AAAA,EACf;AAEF,SACC;AAAA,IAAC;AAAA;AAAA,MACA,MAAO,QAAQ;AAAA,MACf;AAAA,MACA,UAAW,kBAAkB,IAAK,CAAE,YAAa;AAChD,cAAM,EAAE,MAAM,IAAI;AAClB,cAAM,WAAW,UAAU;AAE3B,eAAO;AAAA,UACN,GAAG;AAAA,UACH;AAAA,UACA,MAAM,cAAc,kBAAkB;AAAA,UACtC,SAAS,aAAc,KAAM;AAAA,QAC9B;AAAA,MACD,CAAE;AAAA,MACA,GAAG;AAAA;AAAA,EACN;AAEF;AAEA,IAAO,aAAQ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -31,7 +31,7 @@ import { getResolvedValue } from "@wordpress/global-styles-engine";
|
|
|
31
31
|
import { hasBackgroundImageValue } from "../global-styles/background-panel.mjs";
|
|
32
32
|
import {
|
|
33
33
|
InheritanceResetButton,
|
|
34
|
-
|
|
34
|
+
isGlobalStylesInheritanceIndicatorUIEnabled
|
|
35
35
|
} from "../global-styles/inheritance/index.mjs";
|
|
36
36
|
import { setImmutably } from "../../utils/object.mjs";
|
|
37
37
|
import MediaReplaceFlow from "../media-replace-flow/index.mjs";
|
|
@@ -545,7 +545,7 @@ function BackgroundImagePanel({
|
|
|
545
545
|
inheritedValue = value,
|
|
546
546
|
settings,
|
|
547
547
|
defaultValues = {},
|
|
548
|
-
showInheritanceLabelIndicators =
|
|
548
|
+
showInheritanceLabelIndicators = isGlobalStylesInheritanceIndicatorUIEnabled()
|
|
549
549
|
}) {
|
|
550
550
|
const { globalStyles, _links } = useSelect((select) => {
|
|
551
551
|
const { getSettings } = select(blockEditorStore);
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/background-image-control/index.jsx"],
|
|
4
|
-
"sourcesContent": ["import clsx from 'clsx';\nimport {\n\tToggleControl,\n\t__experimentalToggleGroupControl as ToggleGroupControl,\n\t__experimentalToggleGroupControlOption as ToggleGroupControlOption,\n\t__experimentalUnitControl as UnitControl,\n\t__experimentalVStack as VStack,\n\tDropZone,\n\tFlexBlock,\n\tFocalPointPicker,\n\tMenuItem,\n\t__experimentalHStack as HStack,\n\t__experimentalTruncate as Truncate,\n\tDropdown,\n\tPlaceholder,\n\tSpinner,\n\t__experimentalDropdownContentWrapper as DropdownContentWrapper,\n\tButton,\n} from '@wordpress/components';\nimport { VisuallyHidden } from '@wordpress/ui';\nimport { reset as resetIcon } from '@wordpress/icons';\nimport { __, _x, sprintf } from '@wordpress/i18n';\nimport { store as noticesStore } from '@wordpress/notices';\nimport { getFilename } from '@wordpress/url';\nimport { useRef, useState, useEffect, useMemo } from '@wordpress/element';\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport { focus } from '@wordpress/dom';\nimport { isBlobURL } from '@wordpress/blob';\nimport { getResolvedValue } from '@wordpress/global-styles-engine';\nimport { hasBackgroundImageValue } from '../global-styles/background-panel';\nimport {\n\tInheritanceResetButton,\n\tisGlobalStylesInheritanceEnabled,\n} from '../global-styles/inheritance';\nimport { setImmutably } from '../../utils/object';\nimport MediaReplaceFlow from '../media-replace-flow';\nimport { store as blockEditorStore } from '../../store';\nimport {\n\tglobalStylesDataKey,\n\tglobalStylesLinksDataKey,\n} from '../../store/private-keys';\n\nconst IMAGE_BACKGROUND_TYPE = 'image';\n\nconst BACKGROUND_POPOVER_PROPS = {\n\tplacement: 'left-start',\n\toffset: 36,\n\tshift: true,\n\tclassName: 'block-editor-global-styles-background-panel__popover',\n};\nconst noop = () => {};\n\n/**\n * Focuses the toggle button.\n * @param {Object} containerRef - ref object containing current element\n */\nconst focusToggleButton = ( containerRef ) => {\n\t// Use requestAnimationFrame to ensure DOM updates are complete\n\twindow.requestAnimationFrame( () => {\n\t\tconst [ toggleButton ] = focus.tabbable.find( containerRef?.current );\n\t\tif ( ! toggleButton ) {\n\t\t\treturn;\n\t\t}\n\t\t// Focus the toggle button and close the dropdown menu.\n\t\t// This ensures similar behaviour as to selecting an image, where the dropdown is\n\t\t// closed and focus is redirected to the dropdown toggle button.\n\t\ttoggleButton.focus();\n\t} );\n};\n\n/**\n * Get the help text for the background size control.\n *\n * @param {string} value backgroundSize value.\n * @return {string} Translated help text.\n */\nfunction backgroundSizeHelpText( value ) {\n\tif ( value === 'cover' || value === undefined ) {\n\t\treturn __( 'Image covers the space evenly.' );\n\t}\n\tif ( value === 'contain' ) {\n\t\treturn __( 'Image is contained without distortion.' );\n\t}\n\treturn __( 'Image has a fixed width.' );\n}\n\n/**\n * Converts decimal x and y coords from FocalPointPicker to percentage-based values\n * to use as backgroundPosition value.\n *\n * @param {{x?:number, y?:number}} value FocalPointPicker coords.\n * @return {string} \t\t\t\t backgroundPosition value.\n */\nexport const coordsToBackgroundPosition = ( value ) => {\n\tif ( ! value || ( isNaN( value.x ) && isNaN( value.y ) ) ) {\n\t\treturn undefined;\n\t}\n\n\tconst x = isNaN( value.x ) ? 0.5 : value.x;\n\tconst y = isNaN( value.y ) ? 0.5 : value.y;\n\n\treturn `${ x * 100 }% ${ y * 100 }%`;\n};\n\n/**\n * Converts backgroundPosition value to x and y coords for FocalPointPicker.\n *\n * @param {string} value backgroundPosition value.\n * @return {{x?:number, y?:number}} FocalPointPicker coords.\n */\nexport const backgroundPositionToCoords = ( value ) => {\n\tif ( ! value ) {\n\t\treturn { x: undefined, y: undefined };\n\t}\n\n\tlet [ x, y ] = value.split( ' ' ).map( ( v ) => parseFloat( v ) / 100 );\n\tx = isNaN( x ) ? undefined : x;\n\ty = isNaN( y ) ? x : y;\n\n\treturn { x, y };\n};\n\nfunction InspectorImagePreviewItem( {\n\tas = 'span',\n\timgUrl,\n\ttoggleProps = {},\n\tfilename,\n\tlabel,\n\tonToggleCallback = noop,\n} ) {\n\tconst { isOpen, ...restToggleProps } = toggleProps;\n\n\tuseEffect( () => {\n\t\tif ( typeof isOpen !== 'undefined' ) {\n\t\t\tonToggleCallback( isOpen );\n\t\t}\n\t}, [ isOpen, onToggleCallback ] );\n\n\tconst renderPreviewContent = () => {\n\t\treturn (\n\t\t\t<HStack className=\"block-editor-global-styles-background-panel__inspector-preview-inner\">\n\t\t\t\t<span\n\t\t\t\t\tclassName=\"block-editor-global-styles-background-panel__inspector-image-indicator\"\n\t\t\t\t\tstyle={ {\n\t\t\t\t\t\tbackgroundImage: imgUrl\n\t\t\t\t\t\t\t? `url(${ imgUrl })`\n\t\t\t\t\t\t\t: undefined,\n\t\t\t\t\t} }\n\t\t\t\t/>\n\t\t\t\t<FlexBlock>\n\t\t\t\t\t<Truncate\n\t\t\t\t\t\tnumberOfLines={ 1 }\n\t\t\t\t\t\tclassName=\"block-editor-global-styles-background-panel__inspector-media-replace-title\"\n\t\t\t\t\t>\n\t\t\t\t\t\t{ label }\n\t\t\t\t\t</Truncate>\n\t\t\t\t\t<VisuallyHidden render={ <span /> }>\n\t\t\t\t\t\t{ imgUrl\n\t\t\t\t\t\t\t? sprintf(\n\t\t\t\t\t\t\t\t\t/* translators: %s: file name */\n\t\t\t\t\t\t\t\t\t__( 'Background image: %s' ),\n\t\t\t\t\t\t\t\t\tfilename || label\n\t\t\t\t\t\t\t )\n\t\t\t\t\t\t\t: __( 'No background image selected' ) }\n\t\t\t\t\t</VisuallyHidden>\n\t\t\t\t</FlexBlock>\n\t\t\t</HStack>\n\t\t);\n\t};\n\n\treturn as === 'button' ? (\n\t\t<Button __next40pxDefaultSize { ...restToggleProps }>\n\t\t\t{ renderPreviewContent() }\n\t\t</Button>\n\t) : (\n\t\trenderPreviewContent()\n\t);\n}\n\nfunction BackgroundControlsPanel( {\n\tlabel,\n\tfilename,\n\turl: imgUrl,\n\tchildren,\n\tonToggle: onToggleCallback = noop,\n\thasImageValue,\n\tonReset,\n\thasLocalOverride,\n\tcontainerRef,\n} ) {\n\tif ( ! hasImageValue ) {\n\t\treturn;\n\t}\n\n\tconst imgLabel = label || getFilename( imgUrl ) || __( 'Image' );\n\n\treturn (\n\t\t<Dropdown\n\t\t\tpopoverProps={ BACKGROUND_POPOVER_PROPS }\n\t\t\trenderToggle={ ( { onToggle, isOpen } ) => {\n\t\t\t\tconst toggleProps = {\n\t\t\t\t\tonClick: onToggle,\n\t\t\t\t\tclassName:\n\t\t\t\t\t\t'block-editor-global-styles-background-panel__dropdown-toggle',\n\t\t\t\t\t'aria-expanded': isOpen,\n\t\t\t\t\t'aria-label': __(\n\t\t\t\t\t\t'Background size, position and repeat options.'\n\t\t\t\t\t),\n\t\t\t\t\tisOpen,\n\t\t\t\t};\n\t\t\t\treturn (\n\t\t\t\t\t<>\n\t\t\t\t\t\t<InspectorImagePreviewItem\n\t\t\t\t\t\t\timgUrl={ imgUrl }\n\t\t\t\t\t\t\tfilename={ filename }\n\t\t\t\t\t\t\tlabel={ imgLabel }\n\t\t\t\t\t\t\ttoggleProps={ toggleProps }\n\t\t\t\t\t\t\tas=\"button\"\n\t\t\t\t\t\t\tonToggleCallback={ onToggleCallback }\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t{ onReset &&\n\t\t\t\t\t\t\t( hasLocalOverride ? (\n\t\t\t\t\t\t\t\t<InheritanceResetButton\n\t\t\t\t\t\t\t\t\tclassName=\"block-editor-global-styles-background-panel__reset\"\n\t\t\t\t\t\t\t\t\tonResetToInherited={ () => {\n\t\t\t\t\t\t\t\t\t\tonReset();\n\t\t\t\t\t\t\t\t\t\t// Close the dropdown if open.\n\t\t\t\t\t\t\t\t\t\tif ( isOpen ) {\n\t\t\t\t\t\t\t\t\t\t\tonToggle();\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t// Focus the toggle button.\n\t\t\t\t\t\t\t\t\t\tfocusToggleButton( containerRef );\n\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t\t\t\tlabel={ __( 'Reset' ) }\n\t\t\t\t\t\t\t\t\tclassName=\"block-editor-global-styles-background-panel__reset\"\n\t\t\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\t\t\ticon={ resetIcon }\n\t\t\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\t\t\tonReset();\n\t\t\t\t\t\t\t\t\t\t// Close the dropdown if open.\n\t\t\t\t\t\t\t\t\t\tif ( isOpen ) {\n\t\t\t\t\t\t\t\t\t\t\tonToggle();\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t// Focus the toggle button.\n\t\t\t\t\t\t\t\t\t\tfocusToggleButton( containerRef );\n\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t) ) }\n\t\t\t\t\t</>\n\t\t\t\t);\n\t\t\t} }\n\t\t\trenderContent={ () => (\n\t\t\t\t<DropdownContentWrapper\n\t\t\t\t\tclassName=\"block-editor-global-styles-background-panel__dropdown-content-wrapper\"\n\t\t\t\t\tpaddingSize=\"medium\"\n\t\t\t\t>\n\t\t\t\t\t{ children }\n\t\t\t\t</DropdownContentWrapper>\n\t\t\t) }\n\t\t/>\n\t);\n}\n\nfunction LoadingSpinner() {\n\treturn (\n\t\t<Placeholder className=\"block-editor-global-styles-background-panel__loading\">\n\t\t\t<Spinner />\n\t\t</Placeholder>\n\t);\n}\n\nfunction BackgroundImageControls( {\n\tonChange,\n\tstyle,\n\tinheritedValue,\n\tonRemoveImage = noop,\n\tonResetImage = noop,\n\tdisplayInPanel,\n\tdefaultValues,\n\tcontainerRef,\n} ) {\n\tconst [ isUploading, setIsUploading ] = useState( false );\n\tconst { getSettings } = useSelect( blockEditorStore );\n\n\tconst { id, title, url } = style?.background?.backgroundImage || {\n\t\t...inheritedValue?.background?.backgroundImage,\n\t};\n\tconst { createErrorNotice } = useDispatch( noticesStore );\n\tconst onUploadError = ( message ) => {\n\t\tcreateErrorNotice( message, { type: 'snackbar' } );\n\t\tsetIsUploading( false );\n\t};\n\n\tconst resetBackgroundImage = () =>\n\t\tonChange(\n\t\t\tsetImmutably(\n\t\t\t\tstyle,\n\t\t\t\t[ 'background', 'backgroundImage' ],\n\t\t\t\tundefined\n\t\t\t)\n\t\t);\n\n\tconst onSelectMedia = ( media ) => {\n\t\tif ( ! media || ! media.url ) {\n\t\t\tresetBackgroundImage();\n\t\t\tsetIsUploading( false );\n\t\t\treturn;\n\t\t}\n\n\t\tif ( isBlobURL( media.url ) ) {\n\t\t\tsetIsUploading( true );\n\t\t\treturn;\n\t\t}\n\n\t\t// For media selections originated from a file upload.\n\t\tif (\n\t\t\t( media.media_type &&\n\t\t\t\tmedia.media_type !== IMAGE_BACKGROUND_TYPE ) ||\n\t\t\t( ! media.media_type &&\n\t\t\t\tmedia.type &&\n\t\t\t\tmedia.type !== IMAGE_BACKGROUND_TYPE )\n\t\t) {\n\t\t\tonUploadError(\n\t\t\t\t__( 'Only images can be used as a background image.' )\n\t\t\t);\n\t\t\treturn;\n\t\t}\n\n\t\tconst sizeValue =\n\t\t\tstyle?.background?.backgroundSize || defaultValues?.backgroundSize;\n\t\tconst positionValue = style?.background?.backgroundPosition;\n\t\tonChange(\n\t\t\tsetImmutably( style, [ 'background' ], {\n\t\t\t\t...style?.background,\n\t\t\t\tbackgroundImage: {\n\t\t\t\t\turl: media.url,\n\t\t\t\t\tid: media.id,\n\t\t\t\t\tsource: 'file',\n\t\t\t\t\ttitle: media.title || undefined,\n\t\t\t\t},\n\t\t\t\tbackgroundPosition:\n\t\t\t\t\t/*\n\t\t\t\t\t * A background image uploaded and set in the editor receives a default background position of '50% 0',\n\t\t\t\t\t * when the background image size is the equivalent of \"Tile\".\n\t\t\t\t\t * This is to increase the chance that the image's focus point is visible.\n\t\t\t\t\t * This is in-editor only to assist with the user experience.\n\t\t\t\t\t */\n\t\t\t\t\t! positionValue && ( 'auto' === sizeValue || ! sizeValue )\n\t\t\t\t\t\t? '50% 0'\n\t\t\t\t\t\t: positionValue,\n\t\t\t\tbackgroundSize: sizeValue,\n\t\t\t} )\n\t\t);\n\t\tsetIsUploading( false );\n\t\t// Close the dropdown and focus the toggle button.\n\t\tfocusToggleButton( containerRef );\n\t};\n\n\t/*\n\t * Sets an image entered as a direct URL. There is no attachment `id`:\n\t * `source: 'url'` records that the image is externally hosted.\n\t */\n\tconst onSelectURL = ( newURL ) => {\n\t\tif ( ! newURL || newURL === url ) {\n\t\t\treturn;\n\t\t}\n\t\tonChange(\n\t\t\tsetImmutably( style, [ 'background' ], {\n\t\t\t\t...style?.background,\n\t\t\t\tbackgroundImage: {\n\t\t\t\t\turl: newURL,\n\t\t\t\t\tsource: 'url',\n\t\t\t\t},\n\t\t\t} )\n\t\t);\n\t};\n\n\t// Drag and drop callback, restricting image to one.\n\tconst onFilesDrop = ( filesList ) => {\n\t\tgetSettings().mediaUpload( {\n\t\t\tallowedTypes: [ IMAGE_BACKGROUND_TYPE ],\n\t\t\tfilesList,\n\t\t\tonFileChange( [ image ] ) {\n\t\t\t\tonSelectMedia( image );\n\t\t\t},\n\t\t\tonError: onUploadError,\n\t\t\tmultiple: false,\n\t\t} );\n\t};\n\n\tconst hasValue = hasBackgroundImageValue( style );\n\n\tconst onRemove = () =>\n\t\tonChange(\n\t\t\tsetImmutably( style, [ 'background' ], {\n\t\t\t\tbackgroundImage: 'none',\n\t\t\t} )\n\t\t);\n\tconst canRemove = ! hasValue && hasBackgroundImageValue( inheritedValue );\n\t// theme.json accepts a plain string for `backgroundImage`; the editor\n\t// stores an object with a `url`. Resolve either for the URL field.\n\tconst rawURL =\n\t\ttypeof style?.background?.backgroundImage === 'string'\n\t\t\t? style.background.backgroundImage\n\t\t\t: url;\n\t// Offer only absolute `http(s)` addresses to the URL field. A theme.json\n\t// value can be theme-relative (`file:./…`), which the field could neither\n\t// display usefully nor re-apply without breaking the image, and removing\n\t// an inherited image stores the `'none'` sentinel string.\n\tconst currentURL = /^https?:\\/\\//.test( rawURL ?? '' ) ? rawURL : undefined;\n\tconst imgLabel = title || getFilename( url ) || __( 'Image' );\n\n\treturn (\n\t\t<div className=\"block-editor-global-styles-background-panel__image-tools-panel-item\">\n\t\t\t{ isUploading && <LoadingSpinner /> }\n\t\t\t<MediaReplaceFlow\n\t\t\t\tmediaId={ id }\n\t\t\t\tmediaURL={ currentURL }\n\t\t\t\tallowedTypes={ [ IMAGE_BACKGROUND_TYPE ] }\n\t\t\t\taccept=\"image/*\"\n\t\t\t\tonSelect={ onSelectMedia }\n\t\t\t\tonSelectURL={ onSelectURL }\n\t\t\t\tpopoverProps={ {\n\t\t\t\t\tclassName: clsx( {\n\t\t\t\t\t\t'block-editor-global-styles-background-panel__media-replace-popover':\n\t\t\t\t\t\t\tdisplayInPanel,\n\t\t\t\t\t} ),\n\t\t\t\t} }\n\t\t\t\tname={\n\t\t\t\t\t<InspectorImagePreviewItem\n\t\t\t\t\t\timgUrl={ url }\n\t\t\t\t\t\tfilename={ title }\n\t\t\t\t\t\tlabel={ imgLabel }\n\t\t\t\t\t/>\n\t\t\t\t}\n\t\t\t\trenderToggle={ ( props ) => (\n\t\t\t\t\t<Button { ...props } __next40pxDefaultSize />\n\t\t\t\t) }\n\t\t\t\tonError={ onUploadError }\n\t\t\t\tonReset={ () => {\n\t\t\t\t\tfocusToggleButton( containerRef );\n\t\t\t\t\tonResetImage();\n\t\t\t\t} }\n\t\t\t>\n\t\t\t\t{ canRemove && (\n\t\t\t\t\t<MenuItem\n\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\tfocusToggleButton( containerRef );\n\t\t\t\t\t\t\tonRemove();\n\t\t\t\t\t\t\tonRemoveImage();\n\t\t\t\t\t\t} }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ __( 'Remove' ) }\n\t\t\t\t\t</MenuItem>\n\t\t\t\t) }\n\t\t\t</MediaReplaceFlow>\n\t\t\t<DropZone\n\t\t\t\tonFilesDrop={ onFilesDrop }\n\t\t\t\tlabel={ __( 'Drop to upload' ) }\n\t\t\t/>\n\t\t</div>\n\t);\n}\n\nfunction BackgroundSizeControls( {\n\tonChange,\n\tstyle,\n\tinheritedValue,\n\tdefaultValues,\n} ) {\n\t/*\n\t * Read local and inherited values separately so each sub-control can\n\t * show the inherited value while marking the control as inherited.\n\t */\n\tconst localSizeValue = style?.background?.backgroundSize;\n\tconst localRepeatValue = style?.background?.backgroundRepeat;\n\tconst localPositionValue = style?.background?.backgroundPosition;\n\tconst localAttachmentValue = style?.background?.backgroundAttachment;\n\tconst inheritedSizeValue = inheritedValue?.background?.backgroundSize;\n\tconst inheritedRepeatValue = inheritedValue?.background?.backgroundRepeat;\n\tconst inheritedPositionValue =\n\t\tinheritedValue?.background?.backgroundPosition;\n\tconst inheritedAttachmentValue =\n\t\tinheritedValue?.background?.backgroundAttachment;\n\n\tconst sizeValue = localSizeValue || inheritedSizeValue;\n\tconst repeatValue = localRepeatValue || inheritedRepeatValue;\n\tconst imageValue =\n\t\tstyle?.background?.backgroundImage?.url ||\n\t\tinheritedValue?.background?.backgroundImage?.url;\n\tconst isUploadedImage = style?.background?.backgroundImage?.id;\n\tconst positionValue = localPositionValue || inheritedPositionValue;\n\tconst attachmentValue = localAttachmentValue || inheritedAttachmentValue;\n\n\t/*\n\t * Set default values for uploaded images.\n\t * The default values are passed by the consumer.\n\t * Block-level controls may have different defaults to root-level controls.\n\t * A falsy value is treated by default as `auto` (Tile).\n\t */\n\tlet currentValueForToggle =\n\t\t! sizeValue && isUploadedImage\n\t\t\t? defaultValues?.backgroundSize\n\t\t\t: sizeValue || 'auto';\n\t/*\n\t * The incoming value could be a value + unit, e.g. '20px'.\n\t * In this case set the value to 'tile'.\n\t */\n\tcurrentValueForToggle = ! [ 'cover', 'contain', 'auto' ].includes(\n\t\tcurrentValueForToggle\n\t)\n\t\t? 'auto'\n\t\t: currentValueForToggle;\n\t/*\n\t * If the current value is `cover` and the repeat value is `undefined`, then\n\t * the toggle should be unchecked as the default state. Otherwise, the toggle\n\t * should reflect the current repeat value.\n\t */\n\tconst repeatCheckedValue = ! (\n\t\trepeatValue === 'no-repeat' ||\n\t\t( currentValueForToggle === 'cover' && repeatValue === undefined )\n\t);\n\n\tconst updateBackgroundSize = ( next ) => {\n\t\t// When switching to 'contain' toggle the repeat off.\n\t\tlet nextRepeat = repeatValue;\n\t\tlet nextPosition = positionValue;\n\n\t\tif ( next === 'contain' ) {\n\t\t\tnextRepeat = 'no-repeat';\n\t\t\tnextPosition = undefined;\n\t\t}\n\n\t\tif ( next === 'cover' ) {\n\t\t\tnextRepeat = undefined;\n\t\t\tnextPosition = undefined;\n\t\t}\n\n\t\tif (\n\t\t\t( currentValueForToggle === 'cover' ||\n\t\t\t\tcurrentValueForToggle === 'contain' ) &&\n\t\t\tnext === 'auto'\n\t\t) {\n\t\t\tnextRepeat = undefined;\n\t\t\t/*\n\t\t\t * A background image uploaded and set in the editor (an image with a record id),\n\t\t\t * receives a default background position of '50% 0',\n\t\t\t * when the toggle switches to \"Tile\". This is to increase the chance that\n\t\t\t * the image's focus point is visible.\n\t\t\t * This is in-editor only to assist with the user experience.\n\t\t\t */\n\t\t\tif ( !! style?.background?.backgroundImage?.id ) {\n\t\t\t\tnextPosition = '50% 0';\n\t\t\t}\n\t\t}\n\n\t\t/*\n\t\t * Next will be null when the input is cleared,\n\t\t * in which case the value should be 'auto'.\n\t\t */\n\t\tif ( ! next && currentValueForToggle === 'auto' ) {\n\t\t\tnext = 'auto';\n\t\t}\n\n\t\tonChange(\n\t\t\tsetImmutably( style, [ 'background' ], {\n\t\t\t\t...style?.background,\n\t\t\t\tbackgroundPosition: nextPosition,\n\t\t\t\tbackgroundRepeat: nextRepeat,\n\t\t\t\tbackgroundSize: next,\n\t\t\t} )\n\t\t);\n\t};\n\n\tconst updateBackgroundPosition = ( next ) => {\n\t\tonChange(\n\t\t\tsetImmutably(\n\t\t\t\tstyle,\n\t\t\t\t[ 'background', 'backgroundPosition' ],\n\t\t\t\tcoordsToBackgroundPosition( next )\n\t\t\t)\n\t\t);\n\t};\n\n\tconst toggleIsRepeated = () =>\n\t\tonChange(\n\t\t\tsetImmutably(\n\t\t\t\tstyle,\n\t\t\t\t[ 'background', 'backgroundRepeat' ],\n\t\t\t\trepeatCheckedValue === true ? 'no-repeat' : 'repeat'\n\t\t\t)\n\t\t);\n\n\tconst toggleScrollWithPage = () =>\n\t\tonChange(\n\t\t\tsetImmutably(\n\t\t\t\tstyle,\n\t\t\t\t[ 'background', 'backgroundAttachment' ],\n\t\t\t\tattachmentValue === 'fixed' ? 'scroll' : 'fixed'\n\t\t\t)\n\t\t);\n\n\t// Set a default background position for non-site-wide, uploaded images with a size of 'contain'.\n\tconst backgroundPositionValue =\n\t\t! positionValue && isUploadedImage && 'contain' === sizeValue\n\t\t\t? defaultValues?.backgroundPosition\n\t\t\t: positionValue;\n\n\treturn (\n\t\t<VStack spacing={ 3 } className=\"single-column\">\n\t\t\t<FocalPointPicker\n\t\t\t\tlabel={ __( 'Focal point' ) }\n\t\t\t\turl={ imageValue }\n\t\t\t\tvalue={ backgroundPositionToCoords( backgroundPositionValue ) }\n\t\t\t\tonChange={ updateBackgroundPosition }\n\t\t\t/>\n\t\t\t<ToggleControl\n\t\t\t\tlabel={ __( 'Fixed background' ) }\n\t\t\t\tchecked={ attachmentValue === 'fixed' }\n\t\t\t\tonChange={ toggleScrollWithPage }\n\t\t\t/>\n\t\t\t<ToggleGroupControl\n\t\t\t\tlabel={ __( 'Size' ) }\n\t\t\t\tvalue={ currentValueForToggle }\n\t\t\t\tonChange={ updateBackgroundSize }\n\t\t\t\tisBlock\n\t\t\t\thelp={ backgroundSizeHelpText(\n\t\t\t\t\tsizeValue || defaultValues?.backgroundSize\n\t\t\t\t) }\n\t\t\t>\n\t\t\t\t<ToggleGroupControlOption\n\t\t\t\t\tkey=\"cover\"\n\t\t\t\t\tvalue=\"cover\"\n\t\t\t\t\tlabel={ _x(\n\t\t\t\t\t\t'Cover',\n\t\t\t\t\t\t'Size option for background image control'\n\t\t\t\t\t) }\n\t\t\t\t/>\n\t\t\t\t<ToggleGroupControlOption\n\t\t\t\t\tkey=\"contain\"\n\t\t\t\t\tvalue=\"contain\"\n\t\t\t\t\tlabel={ _x(\n\t\t\t\t\t\t'Contain',\n\t\t\t\t\t\t'Size option for background image control'\n\t\t\t\t\t) }\n\t\t\t\t/>\n\t\t\t\t<ToggleGroupControlOption\n\t\t\t\t\tkey=\"tile\"\n\t\t\t\t\tvalue=\"auto\"\n\t\t\t\t\tlabel={ _x(\n\t\t\t\t\t\t'Tile',\n\t\t\t\t\t\t'Size option for background image control'\n\t\t\t\t\t) }\n\t\t\t\t/>\n\t\t\t</ToggleGroupControl>\n\t\t\t<HStack justify=\"flex-start\" spacing={ 2 } as=\"span\">\n\t\t\t\t<UnitControl\n\t\t\t\t\taria-label={ __( 'Background image width' ) }\n\t\t\t\t\tonChange={ updateBackgroundSize }\n\t\t\t\t\tvalue={ sizeValue }\n\t\t\t\t\t__unstableInputWidth=\"100px\"\n\t\t\t\t\tmin={ 0 }\n\t\t\t\t\tplaceholder={ __( 'Auto' ) }\n\t\t\t\t\tdisabled={\n\t\t\t\t\t\tcurrentValueForToggle !== 'auto' ||\n\t\t\t\t\t\tcurrentValueForToggle === undefined\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t\t<ToggleControl\n\t\t\t\t\tlabel={ __( 'Repeat' ) }\n\t\t\t\t\tchecked={ repeatCheckedValue }\n\t\t\t\t\tonChange={ toggleIsRepeated }\n\t\t\t\t\tdisabled={ currentValueForToggle === 'cover' }\n\t\t\t\t/>\n\t\t\t</HStack>\n\t\t</VStack>\n\t);\n}\n\nexport default function BackgroundImagePanel( {\n\tvalue,\n\tonChange,\n\tinheritedValue = value,\n\tsettings,\n\tdefaultValues = {},\n\tshowInheritanceLabelIndicators = isGlobalStylesInheritanceEnabled(),\n} ) {\n\t/*\n\t * Resolve inherited `ref` pointers for background controls.\n\t */\n\tconst { globalStyles, _links } = useSelect( ( select ) => {\n\t\tconst { getSettings } = select( blockEditorStore );\n\t\tconst _settings = getSettings();\n\t\treturn {\n\t\t\tglobalStyles: _settings[ globalStylesDataKey ],\n\t\t\t_links: _settings[ globalStylesLinksDataKey ],\n\t\t};\n\t}, [] );\n\tconst resolvedInheritedValue = useMemo( () => {\n\t\tconst resolvedValues = {\n\t\t\tbackground: {},\n\t\t};\n\n\t\tif ( ! inheritedValue?.background ) {\n\t\t\treturn inheritedValue;\n\t\t}\n\n\t\tObject.entries( inheritedValue?.background ).forEach(\n\t\t\t( [ key, backgroundValue ] ) => {\n\t\t\t\tresolvedValues.background[ key ] = getResolvedValue(\n\t\t\t\t\tbackgroundValue,\n\t\t\t\t\t{\n\t\t\t\t\t\tstyles: globalStyles,\n\t\t\t\t\t\t_links,\n\t\t\t\t\t}\n\t\t\t\t);\n\t\t\t}\n\t\t);\n\t\treturn resolvedValues;\n\t}, [ globalStyles, _links, inheritedValue ] );\n\n\tconst resetBackground = () =>\n\t\tonChange(\n\t\t\tsetImmutably( value, [ 'background' ], {\n\t\t\t\tgradient: value?.background?.gradient,\n\t\t\t} )\n\t\t);\n\n\tconst { title, url } = value?.background?.backgroundImage || {\n\t\t...resolvedInheritedValue?.background?.backgroundImage,\n\t};\n\tconst localHasImageValue = hasBackgroundImageValue( value );\n\tconst hasImageValue =\n\t\tlocalHasImageValue || hasBackgroundImageValue( resolvedInheritedValue );\n\t// The blue-dot local-override affordance is part of the inherited-value\n\t// treatment. When that treatment is disabled (e.g. in the Global Styles\n\t// panel, where the edited value *is* the global style rather than a local\n\t// override of it), fall back to the plain reset control.\n\tconst hasLocalOverride =\n\t\tshowInheritanceLabelIndicators &&\n\t\tlocalHasImageValue &&\n\t\thasBackgroundImageValue( resolvedInheritedValue );\n\n\tconst imageValue =\n\t\tvalue?.background?.backgroundImage ||\n\t\tinheritedValue?.background?.backgroundImage;\n\n\tconst shouldShowBackgroundImageControls =\n\t\thasImageValue &&\n\t\t'none' !== imageValue &&\n\t\t( settings?.background?.backgroundSize ||\n\t\t\tsettings?.background?.backgroundPosition ||\n\t\t\tsettings?.background?.backgroundRepeat );\n\n\tconst [ isDropDownOpen, setIsDropDownOpen ] = useState( false );\n\tconst containerRef = useRef();\n\n\treturn (\n\t\t<div\n\t\t\tref={ containerRef }\n\t\t\tclassName={ clsx(\n\t\t\t\t'block-editor-global-styles-background-panel__inspector-media-replace-container',\n\t\t\t\t{\n\t\t\t\t\t'is-open': isDropDownOpen,\n\t\t\t\t}\n\t\t\t) }\n\t\t>\n\t\t\t{ shouldShowBackgroundImageControls ? (\n\t\t\t\t<BackgroundControlsPanel\n\t\t\t\t\tlabel={ title }\n\t\t\t\t\tfilename={ title }\n\t\t\t\t\turl={ url }\n\t\t\t\t\tonToggle={ setIsDropDownOpen }\n\t\t\t\t\thasImageValue={ hasImageValue }\n\t\t\t\t\thasLocalOverride={ hasLocalOverride }\n\t\t\t\t\tonReset={ localHasImageValue ? resetBackground : undefined }\n\t\t\t\t\tcontainerRef={ containerRef }\n\t\t\t\t>\n\t\t\t\t\t<VStack spacing={ 3 } className=\"single-column\">\n\t\t\t\t\t\t<BackgroundImageControls\n\t\t\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\t\t\tstyle={ value }\n\t\t\t\t\t\t\tinheritedValue={ resolvedInheritedValue }\n\t\t\t\t\t\t\tdisplayInPanel\n\t\t\t\t\t\t\tonResetImage={ () => {\n\t\t\t\t\t\t\t\tsetIsDropDownOpen( false );\n\t\t\t\t\t\t\t\tresetBackground();\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tonRemoveImage={ () => setIsDropDownOpen( false ) }\n\t\t\t\t\t\t\tdefaultValues={ defaultValues }\n\t\t\t\t\t\t\tcontainerRef={ containerRef }\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<BackgroundSizeControls\n\t\t\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\t\t\tstyle={ value }\n\t\t\t\t\t\t\tdefaultValues={ defaultValues }\n\t\t\t\t\t\t\tinheritedValue={ resolvedInheritedValue }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</VStack>\n\t\t\t\t</BackgroundControlsPanel>\n\t\t\t) : (\n\t\t\t\t<BackgroundImageControls\n\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\tstyle={ value }\n\t\t\t\t\tinheritedValue={ resolvedInheritedValue }\n\t\t\t\t\tdefaultValues={ defaultValues }\n\t\t\t\t\tonResetImage={ () => {\n\t\t\t\t\t\tsetIsDropDownOpen( false );\n\t\t\t\t\t\tresetBackground();\n\t\t\t\t\t} }\n\t\t\t\t\tonRemoveImage={ () => setIsDropDownOpen( false ) }\n\t\t\t\t\tcontainerRef={ containerRef }\n\t\t\t\t/>\n\t\t\t) }\n\t\t</div>\n\t);\n}\n"],
|
|
5
|
-
"mappings": ";AAAA,OAAO,UAAU;AACjB;AAAA,EACC;AAAA,EACA,oCAAoC;AAAA,EACpC,0CAA0C;AAAA,EAC1C,6BAA6B;AAAA,EAC7B,wBAAwB;AAAA,EACxB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,wBAAwB;AAAA,EACxB,0BAA0B;AAAA,EAC1B;AAAA,EACA;AAAA,EACA;AAAA,EACA,wCAAwC;AAAA,EACxC;AAAA,OACM;AACP,SAAS,sBAAsB;AAC/B,SAAS,SAAS,iBAAiB;AACnC,SAAS,IAAI,IAAI,eAAe;AAChC,SAAS,SAAS,oBAAoB;AACtC,SAAS,mBAAmB;AAC5B,SAAS,QAAQ,UAAU,WAAW,eAAe;AACrD,SAAS,aAAa,iBAAiB;AACvC,SAAS,aAAa;AACtB,SAAS,iBAAiB;AAC1B,SAAS,wBAAwB;AACjC,SAAS,+BAA+B;AACxC;AAAA,EACC;AAAA,EACA;AAAA,OACM;AACP,SAAS,oBAAoB;AAC7B,OAAO,sBAAsB;AAC7B,SAAS,SAAS,wBAAwB;AAC1C;AAAA,EACC;AAAA,EACA;AAAA,OACM;AAqGH,SAsEC,UAtED,KAQA,YARA;AAnGJ,IAAM,wBAAwB;AAE9B,IAAM,2BAA2B;AAAA,EAChC,WAAW;AAAA,EACX,QAAQ;AAAA,EACR,OAAO;AAAA,EACP,WAAW;AACZ;AACA,IAAM,OAAO,MAAM;AAAC;AAMpB,IAAM,oBAAoB,CAAE,iBAAkB;AAE7C,SAAO,sBAAuB,MAAM;AACnC,UAAM,CAAE,YAAa,IAAI,MAAM,SAAS,KAAM,cAAc,OAAQ;AACpE,QAAK,CAAE,cAAe;AACrB;AAAA,IACD;AAIA,iBAAa,MAAM;AAAA,EACpB,CAAE;AACH;AAQA,SAAS,uBAAwB,OAAQ;AACxC,MAAK,UAAU,WAAW,UAAU,QAAY;AAC/C,WAAO,GAAI,gCAAiC;AAAA,EAC7C;AACA,MAAK,UAAU,WAAY;AAC1B,WAAO,GAAI,wCAAyC;AAAA,EACrD;AACA,SAAO,GAAI,0BAA2B;AACvC;AASO,IAAM,6BAA6B,CAAE,UAAW;AACtD,MAAK,CAAE,SAAW,MAAO,MAAM,CAAE,KAAK,MAAO,MAAM,CAAE,GAAM;AAC1D,WAAO;AAAA,EACR;AAEA,QAAM,IAAI,MAAO,MAAM,CAAE,IAAI,MAAM,MAAM;AACzC,QAAM,IAAI,MAAO,MAAM,CAAE,IAAI,MAAM,MAAM;AAEzC,SAAO,GAAI,IAAI,GAAI,KAAM,IAAI,GAAI;AAClC;AAQO,IAAM,6BAA6B,CAAE,UAAW;AACtD,MAAK,CAAE,OAAQ;AACd,WAAO,EAAE,GAAG,QAAW,GAAG,OAAU;AAAA,EACrC;AAEA,MAAI,CAAE,GAAG,CAAE,IAAI,MAAM,MAAO,GAAI,EAAE,IAAK,CAAE,MAAO,WAAY,CAAE,IAAI,GAAI;AACtE,MAAI,MAAO,CAAE,IAAI,SAAY;AAC7B,MAAI,MAAO,CAAE,IAAI,IAAI;AAErB,SAAO,EAAE,GAAG,EAAE;AACf;AAEA,SAAS,0BAA2B;AAAA,EACnC,KAAK;AAAA,EACL;AAAA,EACA,cAAc,CAAC;AAAA,EACf;AAAA,EACA;AAAA,EACA,mBAAmB;AACpB,GAAI;AACH,QAAM,EAAE,QAAQ,GAAG,gBAAgB,IAAI;AAEvC,YAAW,MAAM;AAChB,QAAK,OAAO,WAAW,aAAc;AACpC,uBAAkB,MAAO;AAAA,IAC1B;AAAA,EACD,GAAG,CAAE,QAAQ,gBAAiB,CAAE;AAEhC,QAAM,uBAAuB,MAAM;AAClC,WACC,qBAAC,UAAO,WAAU,wEACjB;AAAA;AAAA,QAAC;AAAA;AAAA,UACA,WAAU;AAAA,UACV,OAAQ;AAAA,YACP,iBAAiB,SACd,OAAQ,MAAO,MACf;AAAA,UACJ;AAAA;AAAA,MACD;AAAA,MACA,qBAAC,aACA;AAAA;AAAA,UAAC;AAAA;AAAA,YACA,eAAgB;AAAA,YAChB,WAAU;AAAA,YAER;AAAA;AAAA,QACH;AAAA,QACA,oBAAC,kBAAe,QAAS,oBAAC,UAAK,GAC5B,mBACC;AAAA;AAAA,UAEA,GAAI,sBAAuB;AAAA,UAC3B,YAAY;AAAA,QACZ,IACA,GAAI,8BAA+B,GACvC;AAAA,SACD;AAAA,OACD;AAAA,EAEF;AAEA,SAAO,OAAO,WACb,oBAAC,UAAO,uBAAqB,MAAG,GAAG,iBAChC,+BAAqB,GACxB,IAEA,qBAAqB;AAEvB;AAEA,SAAS,wBAAyB;AAAA,EACjC;AAAA,EACA;AAAA,EACA,KAAK;AAAA,EACL;AAAA,EACA,UAAU,mBAAmB;AAAA,EAC7B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAAI;AACH,MAAK,CAAE,eAAgB;AACtB;AAAA,EACD;AAEA,QAAM,WAAW,SAAS,YAAa,MAAO,KAAK,GAAI,OAAQ;AAE/D,SACC;AAAA,IAAC;AAAA;AAAA,MACA,cAAe;AAAA,MACf,cAAe,CAAE,EAAE,UAAU,OAAO,MAAO;AAC1C,cAAM,cAAc;AAAA,UACnB,SAAS;AAAA,UACT,WACC;AAAA,UACD,iBAAiB;AAAA,UACjB,cAAc;AAAA,YACb;AAAA,UACD;AAAA,UACA;AAAA,QACD;AACA,eACC,iCACC;AAAA;AAAA,YAAC;AAAA;AAAA,cACA;AAAA,cACA;AAAA,cACA,OAAQ;AAAA,cACR;AAAA,cACA,IAAG;AAAA,cACH;AAAA;AAAA,UACD;AAAA,UACE,YACC,mBACD;AAAA,YAAC;AAAA;AAAA,cACA,WAAU;AAAA,cACV,oBAAqB,MAAM;AAC1B,wBAAQ;AAER,oBAAK,QAAS;AACb,2BAAS;AAAA,gBACV;AAEA,kCAAmB,YAAa;AAAA,cACjC;AAAA;AAAA,UACD,IAEA;AAAA,YAAC;AAAA;AAAA,cACA,uBAAqB;AAAA,cACrB,OAAQ,GAAI,OAAQ;AAAA,cACpB,WAAU;AAAA,cACV,MAAK;AAAA,cACL,MAAO;AAAA,cACP,SAAU,MAAM;AACf,wBAAQ;AAER,oBAAK,QAAS;AACb,2BAAS;AAAA,gBACV;AAEA,kCAAmB,YAAa;AAAA,cACjC;AAAA;AAAA,UACD;AAAA,WAEH;AAAA,MAEF;AAAA,MACA,eAAgB,MACf;AAAA,QAAC;AAAA;AAAA,UACA,WAAU;AAAA,UACV,aAAY;AAAA,UAEV;AAAA;AAAA,MACH;AAAA;AAAA,EAEF;AAEF;AAEA,SAAS,iBAAiB;AACzB,SACC,oBAAC,eAAY,WAAU,wDACtB,8BAAC,WAAQ,GACV;AAEF;AAEA,SAAS,wBAAyB;AAAA,EACjC;AAAA,EACA;AAAA,EACA;AAAA,EACA,gBAAgB;AAAA,EAChB,eAAe;AAAA,EACf;AAAA,EACA;AAAA,EACA;AACD,GAAI;AACH,QAAM,CAAE,aAAa,cAAe,IAAI,SAAU,KAAM;AACxD,QAAM,EAAE,YAAY,IAAI,UAAW,gBAAiB;AAEpD,QAAM,EAAE,IAAI,OAAO,IAAI,IAAI,OAAO,YAAY,mBAAmB;AAAA,IAChE,GAAG,gBAAgB,YAAY;AAAA,EAChC;AACA,QAAM,EAAE,kBAAkB,IAAI,YAAa,YAAa;AACxD,QAAM,gBAAgB,CAAE,YAAa;AACpC,sBAAmB,SAAS,EAAE,MAAM,WAAW,CAAE;AACjD,mBAAgB,KAAM;AAAA,EACvB;AAEA,QAAM,uBAAuB,MAC5B;AAAA,IACC;AAAA,MACC;AAAA,MACA,CAAE,cAAc,iBAAkB;AAAA,MAClC;AAAA,IACD;AAAA,EACD;AAED,QAAM,gBAAgB,CAAE,UAAW;AAClC,QAAK,CAAE,SAAS,CAAE,MAAM,KAAM;AAC7B,2BAAqB;AACrB,qBAAgB,KAAM;AACtB;AAAA,IACD;AAEA,QAAK,UAAW,MAAM,GAAI,GAAI;AAC7B,qBAAgB,IAAK;AACrB;AAAA,IACD;AAGA,QACG,MAAM,cACP,MAAM,eAAe,yBACpB,CAAE,MAAM,cACT,MAAM,QACN,MAAM,SAAS,uBACf;AACD;AAAA,QACC,GAAI,gDAAiD;AAAA,MACtD;AACA;AAAA,IACD;AAEA,UAAM,YACL,OAAO,YAAY,kBAAkB,eAAe;AACrD,UAAM,gBAAgB,OAAO,YAAY;AACzC;AAAA,MACC,aAAc,OAAO,CAAE,YAAa,GAAG;AAAA,QACtC,GAAG,OAAO;AAAA,QACV,iBAAiB;AAAA,UAChB,KAAK,MAAM;AAAA,UACX,IAAI,MAAM;AAAA,UACV,QAAQ;AAAA,UACR,OAAO,MAAM,SAAS;AAAA,QACvB;AAAA,QACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,UAOC,CAAE,kBAAmB,WAAW,aAAa,CAAE,aAC5C,UACA;AAAA;AAAA,QACJ,gBAAgB;AAAA,MACjB,CAAE;AAAA,IACH;AACA,mBAAgB,KAAM;AAEtB,sBAAmB,YAAa;AAAA,EACjC;AAMA,QAAM,cAAc,CAAE,WAAY;AACjC,QAAK,CAAE,UAAU,WAAW,KAAM;AACjC;AAAA,IACD;AACA;AAAA,MACC,aAAc,OAAO,CAAE,YAAa,GAAG;AAAA,QACtC,GAAG,OAAO;AAAA,QACV,iBAAiB;AAAA,UAChB,KAAK;AAAA,UACL,QAAQ;AAAA,QACT;AAAA,MACD,CAAE;AAAA,IACH;AAAA,EACD;AAGA,QAAM,cAAc,CAAE,cAAe;AACpC,gBAAY,EAAE,YAAa;AAAA,MAC1B,cAAc,CAAE,qBAAsB;AAAA,MACtC;AAAA,MACA,aAAc,CAAE,KAAM,GAAI;AACzB,sBAAe,KAAM;AAAA,MACtB;AAAA,MACA,SAAS;AAAA,MACT,UAAU;AAAA,IACX,CAAE;AAAA,EACH;AAEA,QAAM,WAAW,wBAAyB,KAAM;AAEhD,QAAM,WAAW,MAChB;AAAA,IACC,aAAc,OAAO,CAAE,YAAa,GAAG;AAAA,MACtC,iBAAiB;AAAA,IAClB,CAAE;AAAA,EACH;AACD,QAAM,YAAY,CAAE,YAAY,wBAAyB,cAAe;AAGxE,QAAM,SACL,OAAO,OAAO,YAAY,oBAAoB,WAC3C,MAAM,WAAW,kBACjB;AAKJ,QAAM,aAAa,eAAe,KAAM,UAAU,EAAG,IAAI,SAAS;AAClE,QAAM,WAAW,SAAS,YAAa,GAAI,KAAK,GAAI,OAAQ;AAE5D,SACC,qBAAC,SAAI,WAAU,uEACZ;AAAA,mBAAe,oBAAC,kBAAe;AAAA,IACjC;AAAA,MAAC;AAAA;AAAA,QACA,SAAU;AAAA,QACV,UAAW;AAAA,QACX,cAAe,CAAE,qBAAsB;AAAA,QACvC,QAAO;AAAA,QACP,UAAW;AAAA,QACX;AAAA,QACA,cAAe;AAAA,UACd,WAAW,KAAM;AAAA,YAChB,sEACC;AAAA,UACF,CAAE;AAAA,QACH;AAAA,QACA,MACC;AAAA,UAAC;AAAA;AAAA,YACA,QAAS;AAAA,YACT,UAAW;AAAA,YACX,OAAQ;AAAA;AAAA,QACT;AAAA,QAED,cAAe,CAAE,UAChB,oBAAC,UAAS,GAAG,OAAQ,uBAAqB,MAAC;AAAA,QAE5C,SAAU;AAAA,QACV,SAAU,MAAM;AACf,4BAAmB,YAAa;AAChC,uBAAa;AAAA,QACd;AAAA,QAEE,uBACD;AAAA,UAAC;AAAA;AAAA,YACA,SAAU,MAAM;AACf,gCAAmB,YAAa;AAChC,uBAAS;AACT,4BAAc;AAAA,YACf;AAAA,YAEE,aAAI,QAAS;AAAA;AAAA,QAChB;AAAA;AAAA,IAEF;AAAA,IACA;AAAA,MAAC;AAAA;AAAA,QACA;AAAA,QACA,OAAQ,GAAI,gBAAiB;AAAA;AAAA,IAC9B;AAAA,KACD;AAEF;AAEA,SAAS,uBAAwB;AAAA,EAChC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAAI;AAKH,QAAM,iBAAiB,OAAO,YAAY;AAC1C,QAAM,mBAAmB,OAAO,YAAY;AAC5C,QAAM,qBAAqB,OAAO,YAAY;AAC9C,QAAM,uBAAuB,OAAO,YAAY;AAChD,QAAM,qBAAqB,gBAAgB,YAAY;AACvD,QAAM,uBAAuB,gBAAgB,YAAY;AACzD,QAAM,yBACL,gBAAgB,YAAY;AAC7B,QAAM,2BACL,gBAAgB,YAAY;AAE7B,QAAM,YAAY,kBAAkB;AACpC,QAAM,cAAc,oBAAoB;AACxC,QAAM,aACL,OAAO,YAAY,iBAAiB,OACpC,gBAAgB,YAAY,iBAAiB;AAC9C,QAAM,kBAAkB,OAAO,YAAY,iBAAiB;AAC5D,QAAM,gBAAgB,sBAAsB;AAC5C,QAAM,kBAAkB,wBAAwB;AAQhD,MAAI,wBACH,CAAE,aAAa,kBACZ,eAAe,iBACf,aAAa;AAKjB,0BAAwB,CAAE,CAAE,SAAS,WAAW,MAAO,EAAE;AAAA,IACxD;AAAA,EACD,IACG,SACA;AAMH,QAAM,qBAAqB,EAC1B,gBAAgB,eACd,0BAA0B,WAAW,gBAAgB;AAGxD,QAAM,uBAAuB,CAAE,SAAU;AAExC,QAAI,aAAa;AACjB,QAAI,eAAe;AAEnB,QAAK,SAAS,WAAY;AACzB,mBAAa;AACb,qBAAe;AAAA,IAChB;AAEA,QAAK,SAAS,SAAU;AACvB,mBAAa;AACb,qBAAe;AAAA,IAChB;AAEA,SACG,0BAA0B,WAC3B,0BAA0B,cAC3B,SAAS,QACR;AACD,mBAAa;AAQb,UAAK,CAAC,CAAE,OAAO,YAAY,iBAAiB,IAAK;AAChD,uBAAe;AAAA,MAChB;AAAA,IACD;AAMA,QAAK,CAAE,QAAQ,0BAA0B,QAAS;AACjD,aAAO;AAAA,IACR;AAEA;AAAA,MACC,aAAc,OAAO,CAAE,YAAa,GAAG;AAAA,QACtC,GAAG,OAAO;AAAA,QACV,oBAAoB;AAAA,QACpB,kBAAkB;AAAA,QAClB,gBAAgB;AAAA,MACjB,CAAE;AAAA,IACH;AAAA,EACD;AAEA,QAAM,2BAA2B,CAAE,SAAU;AAC5C;AAAA,MACC;AAAA,QACC;AAAA,QACA,CAAE,cAAc,oBAAqB;AAAA,QACrC,2BAA4B,IAAK;AAAA,MAClC;AAAA,IACD;AAAA,EACD;AAEA,QAAM,mBAAmB,MACxB;AAAA,IACC;AAAA,MACC;AAAA,MACA,CAAE,cAAc,kBAAmB;AAAA,MACnC,uBAAuB,OAAO,cAAc;AAAA,IAC7C;AAAA,EACD;AAED,QAAM,uBAAuB,MAC5B;AAAA,IACC;AAAA,MACC;AAAA,MACA,CAAE,cAAc,sBAAuB;AAAA,MACvC,oBAAoB,UAAU,WAAW;AAAA,IAC1C;AAAA,EACD;AAGD,QAAM,0BACL,CAAE,iBAAiB,mBAAmB,cAAc,YACjD,eAAe,qBACf;AAEJ,SACC,qBAAC,UAAO,SAAU,GAAI,WAAU,iBAC/B;AAAA;AAAA,MAAC;AAAA;AAAA,QACA,OAAQ,GAAI,aAAc;AAAA,QAC1B,KAAM;AAAA,QACN,OAAQ,2BAA4B,uBAAwB;AAAA,QAC5D,UAAW;AAAA;AAAA,IACZ;AAAA,IACA;AAAA,MAAC;AAAA;AAAA,QACA,OAAQ,GAAI,kBAAmB;AAAA,QAC/B,SAAU,oBAAoB;AAAA,QAC9B,UAAW;AAAA;AAAA,IACZ;AAAA,IACA;AAAA,MAAC;AAAA;AAAA,QACA,OAAQ,GAAI,MAAO;AAAA,QACnB,OAAQ;AAAA,QACR,UAAW;AAAA,QACX,SAAO;AAAA,QACP,MAAO;AAAA,UACN,aAAa,eAAe;AAAA,QAC7B;AAAA,QAEA;AAAA;AAAA,YAAC;AAAA;AAAA,cAEA,OAAM;AAAA,cACN,OAAQ;AAAA,gBACP;AAAA,gBACA;AAAA,cACD;AAAA;AAAA,YALI;AAAA,UAML;AAAA,UACA;AAAA,YAAC;AAAA;AAAA,cAEA,OAAM;AAAA,cACN,OAAQ;AAAA,gBACP;AAAA,gBACA;AAAA,cACD;AAAA;AAAA,YALI;AAAA,UAML;AAAA,UACA;AAAA,YAAC;AAAA;AAAA,cAEA,OAAM;AAAA,cACN,OAAQ;AAAA,gBACP;AAAA,gBACA;AAAA,cACD;AAAA;AAAA,YALI;AAAA,UAML;AAAA;AAAA;AAAA,IACD;AAAA,IACA,qBAAC,UAAO,SAAQ,cAAa,SAAU,GAAI,IAAG,QAC7C;AAAA;AAAA,QAAC;AAAA;AAAA,UACA,cAAa,GAAI,wBAAyB;AAAA,UAC1C,UAAW;AAAA,UACX,OAAQ;AAAA,UACR,sBAAqB;AAAA,UACrB,KAAM;AAAA,UACN,aAAc,GAAI,MAAO;AAAA,UACzB,UACC,0BAA0B,UAC1B,0BAA0B;AAAA;AAAA,MAE5B;AAAA,MACA;AAAA,QAAC;AAAA;AAAA,UACA,OAAQ,GAAI,QAAS;AAAA,UACrB,SAAU;AAAA,UACV,UAAW;AAAA,UACX,UAAW,0BAA0B;AAAA;AAAA,MACtC;AAAA,OACD;AAAA,KACD;AAEF;AAEe,SAAR,qBAAuC;AAAA,EAC7C;AAAA,EACA;AAAA,EACA,iBAAiB;AAAA,EACjB;AAAA,EACA,gBAAgB,CAAC;AAAA,EACjB,iCAAiC,iCAAiC;AACnE,GAAI;AAIH,QAAM,EAAE,cAAc,OAAO,IAAI,UAAW,CAAE,WAAY;AACzD,UAAM,EAAE,YAAY,IAAI,OAAQ,gBAAiB;AACjD,UAAM,YAAY,YAAY;AAC9B,WAAO;AAAA,MACN,cAAc,UAAW,mBAAoB;AAAA,MAC7C,QAAQ,UAAW,wBAAyB;AAAA,IAC7C;AAAA,EACD,GAAG,CAAC,CAAE;AACN,QAAM,yBAAyB,QAAS,MAAM;AAC7C,UAAM,iBAAiB;AAAA,MACtB,YAAY,CAAC;AAAA,IACd;AAEA,QAAK,CAAE,gBAAgB,YAAa;AACnC,aAAO;AAAA,IACR;AAEA,WAAO,QAAS,gBAAgB,UAAW,EAAE;AAAA,MAC5C,CAAE,CAAE,KAAK,eAAgB,MAAO;AAC/B,uBAAe,WAAY,GAAI,IAAI;AAAA,UAClC;AAAA,UACA;AAAA,YACC,QAAQ;AAAA,YACR;AAAA,UACD;AAAA,QACD;AAAA,MACD;AAAA,IACD;AACA,WAAO;AAAA,EACR,GAAG,CAAE,cAAc,QAAQ,cAAe,CAAE;AAE5C,QAAM,kBAAkB,MACvB;AAAA,IACC,aAAc,OAAO,CAAE,YAAa,GAAG;AAAA,MACtC,UAAU,OAAO,YAAY;AAAA,IAC9B,CAAE;AAAA,EACH;AAED,QAAM,EAAE,OAAO,IAAI,IAAI,OAAO,YAAY,mBAAmB;AAAA,IAC5D,GAAG,wBAAwB,YAAY;AAAA,EACxC;AACA,QAAM,qBAAqB,wBAAyB,KAAM;AAC1D,QAAM,gBACL,sBAAsB,wBAAyB,sBAAuB;AAKvE,QAAM,mBACL,kCACA,sBACA,wBAAyB,sBAAuB;AAEjD,QAAM,aACL,OAAO,YAAY,mBACnB,gBAAgB,YAAY;AAE7B,QAAM,oCACL,iBACA,WAAW,eACT,UAAU,YAAY,kBACvB,UAAU,YAAY,sBACtB,UAAU,YAAY;AAExB,QAAM,CAAE,gBAAgB,iBAAkB,IAAI,SAAU,KAAM;AAC9D,QAAM,eAAe,OAAO;AAE5B,SACC;AAAA,IAAC;AAAA;AAAA,MACA,KAAM;AAAA,MACN,WAAY;AAAA,QACX;AAAA,QACA;AAAA,UACC,WAAW;AAAA,QACZ;AAAA,MACD;AAAA,MAEE,8CACD;AAAA,QAAC;AAAA;AAAA,UACA,OAAQ;AAAA,UACR,UAAW;AAAA,UACX;AAAA,UACA,UAAW;AAAA,UACX;AAAA,UACA;AAAA,UACA,SAAU,qBAAqB,kBAAkB;AAAA,UACjD;AAAA,UAEA,+BAAC,UAAO,SAAU,GAAI,WAAU,iBAC/B;AAAA;AAAA,cAAC;AAAA;AAAA,gBACA;AAAA,gBACA,OAAQ;AAAA,gBACR,gBAAiB;AAAA,gBACjB,gBAAc;AAAA,gBACd,cAAe,MAAM;AACpB,oCAAmB,KAAM;AACzB,kCAAgB;AAAA,gBACjB;AAAA,gBACA,eAAgB,MAAM,kBAAmB,KAAM;AAAA,gBAC/C;AAAA,gBACA;AAAA;AAAA,YACD;AAAA,YACA;AAAA,cAAC;AAAA;AAAA,gBACA;AAAA,gBACA,OAAQ;AAAA,gBACR;AAAA,gBACA,gBAAiB;AAAA;AAAA,YAClB;AAAA,aACD;AAAA;AAAA,MACD,IAEA;AAAA,QAAC;AAAA;AAAA,UACA;AAAA,UACA,OAAQ;AAAA,UACR,gBAAiB;AAAA,UACjB;AAAA,UACA,cAAe,MAAM;AACpB,8BAAmB,KAAM;AACzB,4BAAgB;AAAA,UACjB;AAAA,UACA,eAAgB,MAAM,kBAAmB,KAAM;AAAA,UAC/C;AAAA;AAAA,MACD;AAAA;AAAA,EAEF;AAEF;",
|
|
4
|
+
"sourcesContent": ["import clsx from 'clsx';\nimport {\n\tToggleControl,\n\t__experimentalToggleGroupControl as ToggleGroupControl,\n\t__experimentalToggleGroupControlOption as ToggleGroupControlOption,\n\t__experimentalUnitControl as UnitControl,\n\t__experimentalVStack as VStack,\n\tDropZone,\n\tFlexBlock,\n\tFocalPointPicker,\n\tMenuItem,\n\t__experimentalHStack as HStack,\n\t__experimentalTruncate as Truncate,\n\tDropdown,\n\tPlaceholder,\n\tSpinner,\n\t__experimentalDropdownContentWrapper as DropdownContentWrapper,\n\tButton,\n} from '@wordpress/components';\nimport { VisuallyHidden } from '@wordpress/ui';\nimport { reset as resetIcon } from '@wordpress/icons';\nimport { __, _x, sprintf } from '@wordpress/i18n';\nimport { store as noticesStore } from '@wordpress/notices';\nimport { getFilename } from '@wordpress/url';\nimport { useRef, useState, useEffect, useMemo } from '@wordpress/element';\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport { focus } from '@wordpress/dom';\nimport { isBlobURL } from '@wordpress/blob';\nimport { getResolvedValue } from '@wordpress/global-styles-engine';\nimport { hasBackgroundImageValue } from '../global-styles/background-panel';\nimport {\n\tInheritanceResetButton,\n\tisGlobalStylesInheritanceIndicatorUIEnabled,\n} from '../global-styles/inheritance';\nimport { setImmutably } from '../../utils/object';\nimport MediaReplaceFlow from '../media-replace-flow';\nimport { store as blockEditorStore } from '../../store';\nimport {\n\tglobalStylesDataKey,\n\tglobalStylesLinksDataKey,\n} from '../../store/private-keys';\n\nconst IMAGE_BACKGROUND_TYPE = 'image';\n\nconst BACKGROUND_POPOVER_PROPS = {\n\tplacement: 'left-start',\n\toffset: 36,\n\tshift: true,\n\tclassName: 'block-editor-global-styles-background-panel__popover',\n};\nconst noop = () => {};\n\n/**\n * Focuses the toggle button.\n * @param {Object} containerRef - ref object containing current element\n */\nconst focusToggleButton = ( containerRef ) => {\n\t// Use requestAnimationFrame to ensure DOM updates are complete\n\twindow.requestAnimationFrame( () => {\n\t\tconst [ toggleButton ] = focus.tabbable.find( containerRef?.current );\n\t\tif ( ! toggleButton ) {\n\t\t\treturn;\n\t\t}\n\t\t// Focus the toggle button and close the dropdown menu.\n\t\t// This ensures similar behaviour as to selecting an image, where the dropdown is\n\t\t// closed and focus is redirected to the dropdown toggle button.\n\t\ttoggleButton.focus();\n\t} );\n};\n\n/**\n * Get the help text for the background size control.\n *\n * @param {string} value backgroundSize value.\n * @return {string} Translated help text.\n */\nfunction backgroundSizeHelpText( value ) {\n\tif ( value === 'cover' || value === undefined ) {\n\t\treturn __( 'Image covers the space evenly.' );\n\t}\n\tif ( value === 'contain' ) {\n\t\treturn __( 'Image is contained without distortion.' );\n\t}\n\treturn __( 'Image has a fixed width.' );\n}\n\n/**\n * Converts decimal x and y coords from FocalPointPicker to percentage-based values\n * to use as backgroundPosition value.\n *\n * @param {{x?:number, y?:number}} value FocalPointPicker coords.\n * @return {string} \t\t\t\t backgroundPosition value.\n */\nexport const coordsToBackgroundPosition = ( value ) => {\n\tif ( ! value || ( isNaN( value.x ) && isNaN( value.y ) ) ) {\n\t\treturn undefined;\n\t}\n\n\tconst x = isNaN( value.x ) ? 0.5 : value.x;\n\tconst y = isNaN( value.y ) ? 0.5 : value.y;\n\n\treturn `${ x * 100 }% ${ y * 100 }%`;\n};\n\n/**\n * Converts backgroundPosition value to x and y coords for FocalPointPicker.\n *\n * @param {string} value backgroundPosition value.\n * @return {{x?:number, y?:number}} FocalPointPicker coords.\n */\nexport const backgroundPositionToCoords = ( value ) => {\n\tif ( ! value ) {\n\t\treturn { x: undefined, y: undefined };\n\t}\n\n\tlet [ x, y ] = value.split( ' ' ).map( ( v ) => parseFloat( v ) / 100 );\n\tx = isNaN( x ) ? undefined : x;\n\ty = isNaN( y ) ? x : y;\n\n\treturn { x, y };\n};\n\nfunction InspectorImagePreviewItem( {\n\tas = 'span',\n\timgUrl,\n\ttoggleProps = {},\n\tfilename,\n\tlabel,\n\tonToggleCallback = noop,\n} ) {\n\tconst { isOpen, ...restToggleProps } = toggleProps;\n\n\tuseEffect( () => {\n\t\tif ( typeof isOpen !== 'undefined' ) {\n\t\t\tonToggleCallback( isOpen );\n\t\t}\n\t}, [ isOpen, onToggleCallback ] );\n\n\tconst renderPreviewContent = () => {\n\t\treturn (\n\t\t\t<HStack className=\"block-editor-global-styles-background-panel__inspector-preview-inner\">\n\t\t\t\t<span\n\t\t\t\t\tclassName=\"block-editor-global-styles-background-panel__inspector-image-indicator\"\n\t\t\t\t\tstyle={ {\n\t\t\t\t\t\tbackgroundImage: imgUrl\n\t\t\t\t\t\t\t? `url(${ imgUrl })`\n\t\t\t\t\t\t\t: undefined,\n\t\t\t\t\t} }\n\t\t\t\t/>\n\t\t\t\t<FlexBlock>\n\t\t\t\t\t<Truncate\n\t\t\t\t\t\tnumberOfLines={ 1 }\n\t\t\t\t\t\tclassName=\"block-editor-global-styles-background-panel__inspector-media-replace-title\"\n\t\t\t\t\t>\n\t\t\t\t\t\t{ label }\n\t\t\t\t\t</Truncate>\n\t\t\t\t\t<VisuallyHidden render={ <span /> }>\n\t\t\t\t\t\t{ imgUrl\n\t\t\t\t\t\t\t? sprintf(\n\t\t\t\t\t\t\t\t\t/* translators: %s: file name */\n\t\t\t\t\t\t\t\t\t__( 'Background image: %s' ),\n\t\t\t\t\t\t\t\t\tfilename || label\n\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t: __( 'No background image selected' ) }\n\t\t\t\t\t</VisuallyHidden>\n\t\t\t\t</FlexBlock>\n\t\t\t</HStack>\n\t\t);\n\t};\n\n\treturn as === 'button' ? (\n\t\t<Button __next40pxDefaultSize { ...restToggleProps }>\n\t\t\t{ renderPreviewContent() }\n\t\t</Button>\n\t) : (\n\t\trenderPreviewContent()\n\t);\n}\n\nfunction BackgroundControlsPanel( {\n\tlabel,\n\tfilename,\n\turl: imgUrl,\n\tchildren,\n\tonToggle: onToggleCallback = noop,\n\thasImageValue,\n\tonReset,\n\thasLocalOverride,\n\tcontainerRef,\n} ) {\n\tif ( ! hasImageValue ) {\n\t\treturn;\n\t}\n\n\tconst imgLabel = label || getFilename( imgUrl ) || __( 'Image' );\n\n\treturn (\n\t\t<Dropdown\n\t\t\tpopoverProps={ BACKGROUND_POPOVER_PROPS }\n\t\t\trenderToggle={ ( { onToggle, isOpen } ) => {\n\t\t\t\tconst toggleProps = {\n\t\t\t\t\tonClick: onToggle,\n\t\t\t\t\tclassName:\n\t\t\t\t\t\t'block-editor-global-styles-background-panel__dropdown-toggle',\n\t\t\t\t\t'aria-expanded': isOpen,\n\t\t\t\t\t'aria-label': __(\n\t\t\t\t\t\t'Background size, position and repeat options.'\n\t\t\t\t\t),\n\t\t\t\t\tisOpen,\n\t\t\t\t};\n\t\t\t\treturn (\n\t\t\t\t\t<>\n\t\t\t\t\t\t<InspectorImagePreviewItem\n\t\t\t\t\t\t\timgUrl={ imgUrl }\n\t\t\t\t\t\t\tfilename={ filename }\n\t\t\t\t\t\t\tlabel={ imgLabel }\n\t\t\t\t\t\t\ttoggleProps={ toggleProps }\n\t\t\t\t\t\t\tas=\"button\"\n\t\t\t\t\t\t\tonToggleCallback={ onToggleCallback }\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t{ onReset &&\n\t\t\t\t\t\t\t( hasLocalOverride ? (\n\t\t\t\t\t\t\t\t<InheritanceResetButton\n\t\t\t\t\t\t\t\t\tclassName=\"block-editor-global-styles-background-panel__reset\"\n\t\t\t\t\t\t\t\t\tonResetToInherited={ () => {\n\t\t\t\t\t\t\t\t\t\tonReset();\n\t\t\t\t\t\t\t\t\t\t// Close the dropdown if open.\n\t\t\t\t\t\t\t\t\t\tif ( isOpen ) {\n\t\t\t\t\t\t\t\t\t\t\tonToggle();\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t// Focus the toggle button.\n\t\t\t\t\t\t\t\t\t\tfocusToggleButton( containerRef );\n\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t\t\t\tlabel={ __( 'Reset' ) }\n\t\t\t\t\t\t\t\t\tclassName=\"block-editor-global-styles-background-panel__reset\"\n\t\t\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\t\t\ticon={ resetIcon }\n\t\t\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\t\t\tonReset();\n\t\t\t\t\t\t\t\t\t\t// Close the dropdown if open.\n\t\t\t\t\t\t\t\t\t\tif ( isOpen ) {\n\t\t\t\t\t\t\t\t\t\t\tonToggle();\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t// Focus the toggle button.\n\t\t\t\t\t\t\t\t\t\tfocusToggleButton( containerRef );\n\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t) ) }\n\t\t\t\t\t</>\n\t\t\t\t);\n\t\t\t} }\n\t\t\trenderContent={ () => (\n\t\t\t\t<DropdownContentWrapper\n\t\t\t\t\tclassName=\"block-editor-global-styles-background-panel__dropdown-content-wrapper\"\n\t\t\t\t\tpaddingSize=\"medium\"\n\t\t\t\t>\n\t\t\t\t\t{ children }\n\t\t\t\t</DropdownContentWrapper>\n\t\t\t) }\n\t\t/>\n\t);\n}\n\nfunction LoadingSpinner() {\n\treturn (\n\t\t<Placeholder className=\"block-editor-global-styles-background-panel__loading\">\n\t\t\t<Spinner />\n\t\t</Placeholder>\n\t);\n}\n\nfunction BackgroundImageControls( {\n\tonChange,\n\tstyle,\n\tinheritedValue,\n\tonRemoveImage = noop,\n\tonResetImage = noop,\n\tdisplayInPanel,\n\tdefaultValues,\n\tcontainerRef,\n} ) {\n\tconst [ isUploading, setIsUploading ] = useState( false );\n\tconst { getSettings } = useSelect( blockEditorStore );\n\n\tconst { id, title, url } = style?.background?.backgroundImage || {\n\t\t...inheritedValue?.background?.backgroundImage,\n\t};\n\tconst { createErrorNotice } = useDispatch( noticesStore );\n\tconst onUploadError = ( message ) => {\n\t\tcreateErrorNotice( message, { type: 'snackbar' } );\n\t\tsetIsUploading( false );\n\t};\n\n\tconst resetBackgroundImage = () =>\n\t\tonChange(\n\t\t\tsetImmutably(\n\t\t\t\tstyle,\n\t\t\t\t[ 'background', 'backgroundImage' ],\n\t\t\t\tundefined\n\t\t\t)\n\t\t);\n\n\tconst onSelectMedia = ( media ) => {\n\t\tif ( ! media || ! media.url ) {\n\t\t\tresetBackgroundImage();\n\t\t\tsetIsUploading( false );\n\t\t\treturn;\n\t\t}\n\n\t\tif ( isBlobURL( media.url ) ) {\n\t\t\tsetIsUploading( true );\n\t\t\treturn;\n\t\t}\n\n\t\t// For media selections originated from a file upload.\n\t\tif (\n\t\t\t( media.media_type &&\n\t\t\t\tmedia.media_type !== IMAGE_BACKGROUND_TYPE ) ||\n\t\t\t( ! media.media_type &&\n\t\t\t\tmedia.type &&\n\t\t\t\tmedia.type !== IMAGE_BACKGROUND_TYPE )\n\t\t) {\n\t\t\tonUploadError(\n\t\t\t\t__( 'Only images can be used as a background image.' )\n\t\t\t);\n\t\t\treturn;\n\t\t}\n\n\t\tconst sizeValue =\n\t\t\tstyle?.background?.backgroundSize || defaultValues?.backgroundSize;\n\t\tconst positionValue = style?.background?.backgroundPosition;\n\t\tonChange(\n\t\t\tsetImmutably( style, [ 'background' ], {\n\t\t\t\t...style?.background,\n\t\t\t\tbackgroundImage: {\n\t\t\t\t\turl: media.url,\n\t\t\t\t\tid: media.id,\n\t\t\t\t\tsource: 'file',\n\t\t\t\t\ttitle: media.title || undefined,\n\t\t\t\t},\n\t\t\t\tbackgroundPosition:\n\t\t\t\t\t/*\n\t\t\t\t\t * A background image uploaded and set in the editor receives a default background position of '50% 0',\n\t\t\t\t\t * when the background image size is the equivalent of \"Tile\".\n\t\t\t\t\t * This is to increase the chance that the image's focus point is visible.\n\t\t\t\t\t * This is in-editor only to assist with the user experience.\n\t\t\t\t\t */\n\t\t\t\t\t! positionValue && ( 'auto' === sizeValue || ! sizeValue )\n\t\t\t\t\t\t? '50% 0'\n\t\t\t\t\t\t: positionValue,\n\t\t\t\tbackgroundSize: sizeValue,\n\t\t\t} )\n\t\t);\n\t\tsetIsUploading( false );\n\t\t// Close the dropdown and focus the toggle button.\n\t\tfocusToggleButton( containerRef );\n\t};\n\n\t/*\n\t * Sets an image entered as a direct URL. There is no attachment `id`:\n\t * `source: 'url'` records that the image is externally hosted.\n\t */\n\tconst onSelectURL = ( newURL ) => {\n\t\tif ( ! newURL || newURL === url ) {\n\t\t\treturn;\n\t\t}\n\t\tonChange(\n\t\t\tsetImmutably( style, [ 'background' ], {\n\t\t\t\t...style?.background,\n\t\t\t\tbackgroundImage: {\n\t\t\t\t\turl: newURL,\n\t\t\t\t\tsource: 'url',\n\t\t\t\t},\n\t\t\t} )\n\t\t);\n\t};\n\n\t// Drag and drop callback, restricting image to one.\n\tconst onFilesDrop = ( filesList ) => {\n\t\tgetSettings().mediaUpload( {\n\t\t\tallowedTypes: [ IMAGE_BACKGROUND_TYPE ],\n\t\t\tfilesList,\n\t\t\tonFileChange( [ image ] ) {\n\t\t\t\tonSelectMedia( image );\n\t\t\t},\n\t\t\tonError: onUploadError,\n\t\t\tmultiple: false,\n\t\t} );\n\t};\n\n\tconst hasValue = hasBackgroundImageValue( style );\n\n\tconst onRemove = () =>\n\t\tonChange(\n\t\t\tsetImmutably( style, [ 'background' ], {\n\t\t\t\tbackgroundImage: 'none',\n\t\t\t} )\n\t\t);\n\tconst canRemove = ! hasValue && hasBackgroundImageValue( inheritedValue );\n\t// theme.json accepts a plain string for `backgroundImage`; the editor\n\t// stores an object with a `url`. Resolve either for the URL field.\n\tconst rawURL =\n\t\ttypeof style?.background?.backgroundImage === 'string'\n\t\t\t? style.background.backgroundImage\n\t\t\t: url;\n\t// Offer only absolute `http(s)` addresses to the URL field. A theme.json\n\t// value can be theme-relative (`file:./…`), which the field could neither\n\t// display usefully nor re-apply without breaking the image, and removing\n\t// an inherited image stores the `'none'` sentinel string.\n\tconst currentURL = /^https?:\\/\\//.test( rawURL ?? '' ) ? rawURL : undefined;\n\tconst imgLabel = title || getFilename( url ) || __( 'Image' );\n\n\treturn (\n\t\t<div className=\"block-editor-global-styles-background-panel__image-tools-panel-item\">\n\t\t\t{ isUploading && <LoadingSpinner /> }\n\t\t\t<MediaReplaceFlow\n\t\t\t\tmediaId={ id }\n\t\t\t\tmediaURL={ currentURL }\n\t\t\t\tallowedTypes={ [ IMAGE_BACKGROUND_TYPE ] }\n\t\t\t\taccept=\"image/*\"\n\t\t\t\tonSelect={ onSelectMedia }\n\t\t\t\tonSelectURL={ onSelectURL }\n\t\t\t\tpopoverProps={ {\n\t\t\t\t\tclassName: clsx( {\n\t\t\t\t\t\t'block-editor-global-styles-background-panel__media-replace-popover':\n\t\t\t\t\t\t\tdisplayInPanel,\n\t\t\t\t\t} ),\n\t\t\t\t} }\n\t\t\t\tname={\n\t\t\t\t\t<InspectorImagePreviewItem\n\t\t\t\t\t\timgUrl={ url }\n\t\t\t\t\t\tfilename={ title }\n\t\t\t\t\t\tlabel={ imgLabel }\n\t\t\t\t\t/>\n\t\t\t\t}\n\t\t\t\trenderToggle={ ( props ) => (\n\t\t\t\t\t<Button { ...props } __next40pxDefaultSize />\n\t\t\t\t) }\n\t\t\t\tonError={ onUploadError }\n\t\t\t\tonReset={ () => {\n\t\t\t\t\tfocusToggleButton( containerRef );\n\t\t\t\t\tonResetImage();\n\t\t\t\t} }\n\t\t\t>\n\t\t\t\t{ canRemove && (\n\t\t\t\t\t<MenuItem\n\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\tfocusToggleButton( containerRef );\n\t\t\t\t\t\t\tonRemove();\n\t\t\t\t\t\t\tonRemoveImage();\n\t\t\t\t\t\t} }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ __( 'Remove' ) }\n\t\t\t\t\t</MenuItem>\n\t\t\t\t) }\n\t\t\t</MediaReplaceFlow>\n\t\t\t<DropZone\n\t\t\t\tonFilesDrop={ onFilesDrop }\n\t\t\t\tlabel={ __( 'Drop to upload' ) }\n\t\t\t/>\n\t\t</div>\n\t);\n}\n\nfunction BackgroundSizeControls( {\n\tonChange,\n\tstyle,\n\tinheritedValue,\n\tdefaultValues,\n} ) {\n\t/*\n\t * Read local and inherited values separately so each sub-control can\n\t * show the inherited value while marking the control as inherited.\n\t */\n\tconst localSizeValue = style?.background?.backgroundSize;\n\tconst localRepeatValue = style?.background?.backgroundRepeat;\n\tconst localPositionValue = style?.background?.backgroundPosition;\n\tconst localAttachmentValue = style?.background?.backgroundAttachment;\n\tconst inheritedSizeValue = inheritedValue?.background?.backgroundSize;\n\tconst inheritedRepeatValue = inheritedValue?.background?.backgroundRepeat;\n\tconst inheritedPositionValue =\n\t\tinheritedValue?.background?.backgroundPosition;\n\tconst inheritedAttachmentValue =\n\t\tinheritedValue?.background?.backgroundAttachment;\n\n\tconst sizeValue = localSizeValue || inheritedSizeValue;\n\tconst repeatValue = localRepeatValue || inheritedRepeatValue;\n\tconst imageValue =\n\t\tstyle?.background?.backgroundImage?.url ||\n\t\tinheritedValue?.background?.backgroundImage?.url;\n\tconst isUploadedImage = style?.background?.backgroundImage?.id;\n\tconst positionValue = localPositionValue || inheritedPositionValue;\n\tconst attachmentValue = localAttachmentValue || inheritedAttachmentValue;\n\n\t/*\n\t * Set default values for uploaded images.\n\t * The default values are passed by the consumer.\n\t * Block-level controls may have different defaults to root-level controls.\n\t * A falsy value is treated by default as `auto` (Tile).\n\t */\n\tlet currentValueForToggle =\n\t\t! sizeValue && isUploadedImage\n\t\t\t? defaultValues?.backgroundSize\n\t\t\t: sizeValue || 'auto';\n\t/*\n\t * The incoming value could be a value + unit, e.g. '20px'.\n\t * In this case set the value to 'tile'.\n\t */\n\tcurrentValueForToggle = ! [ 'cover', 'contain', 'auto' ].includes(\n\t\tcurrentValueForToggle\n\t)\n\t\t? 'auto'\n\t\t: currentValueForToggle;\n\t/*\n\t * If the current value is `cover` and the repeat value is `undefined`, then\n\t * the toggle should be unchecked as the default state. Otherwise, the toggle\n\t * should reflect the current repeat value.\n\t */\n\tconst repeatCheckedValue = ! (\n\t\trepeatValue === 'no-repeat' ||\n\t\t( currentValueForToggle === 'cover' && repeatValue === undefined )\n\t);\n\n\tconst updateBackgroundSize = ( next ) => {\n\t\t// When switching to 'contain' toggle the repeat off.\n\t\tlet nextRepeat = repeatValue;\n\t\tlet nextPosition = positionValue;\n\n\t\tif ( next === 'contain' ) {\n\t\t\tnextRepeat = 'no-repeat';\n\t\t\tnextPosition = undefined;\n\t\t}\n\n\t\tif ( next === 'cover' ) {\n\t\t\tnextRepeat = undefined;\n\t\t\tnextPosition = undefined;\n\t\t}\n\n\t\tif (\n\t\t\t( currentValueForToggle === 'cover' ||\n\t\t\t\tcurrentValueForToggle === 'contain' ) &&\n\t\t\tnext === 'auto'\n\t\t) {\n\t\t\tnextRepeat = undefined;\n\t\t\t/*\n\t\t\t * A background image uploaded and set in the editor (an image with a record id),\n\t\t\t * receives a default background position of '50% 0',\n\t\t\t * when the toggle switches to \"Tile\". This is to increase the chance that\n\t\t\t * the image's focus point is visible.\n\t\t\t * This is in-editor only to assist with the user experience.\n\t\t\t */\n\t\t\tif ( !! style?.background?.backgroundImage?.id ) {\n\t\t\t\tnextPosition = '50% 0';\n\t\t\t}\n\t\t}\n\n\t\t/*\n\t\t * Next will be null when the input is cleared,\n\t\t * in which case the value should be 'auto'.\n\t\t */\n\t\tif ( ! next && currentValueForToggle === 'auto' ) {\n\t\t\tnext = 'auto';\n\t\t}\n\n\t\tonChange(\n\t\t\tsetImmutably( style, [ 'background' ], {\n\t\t\t\t...style?.background,\n\t\t\t\tbackgroundPosition: nextPosition,\n\t\t\t\tbackgroundRepeat: nextRepeat,\n\t\t\t\tbackgroundSize: next,\n\t\t\t} )\n\t\t);\n\t};\n\n\tconst updateBackgroundPosition = ( next ) => {\n\t\tonChange(\n\t\t\tsetImmutably(\n\t\t\t\tstyle,\n\t\t\t\t[ 'background', 'backgroundPosition' ],\n\t\t\t\tcoordsToBackgroundPosition( next )\n\t\t\t)\n\t\t);\n\t};\n\n\tconst toggleIsRepeated = () =>\n\t\tonChange(\n\t\t\tsetImmutably(\n\t\t\t\tstyle,\n\t\t\t\t[ 'background', 'backgroundRepeat' ],\n\t\t\t\trepeatCheckedValue === true ? 'no-repeat' : 'repeat'\n\t\t\t)\n\t\t);\n\n\tconst toggleScrollWithPage = () =>\n\t\tonChange(\n\t\t\tsetImmutably(\n\t\t\t\tstyle,\n\t\t\t\t[ 'background', 'backgroundAttachment' ],\n\t\t\t\tattachmentValue === 'fixed' ? 'scroll' : 'fixed'\n\t\t\t)\n\t\t);\n\n\t// Set a default background position for non-site-wide, uploaded images with a size of 'contain'.\n\tconst backgroundPositionValue =\n\t\t! positionValue && isUploadedImage && 'contain' === sizeValue\n\t\t\t? defaultValues?.backgroundPosition\n\t\t\t: positionValue;\n\n\treturn (\n\t\t<VStack spacing={ 3 } className=\"single-column\">\n\t\t\t<FocalPointPicker\n\t\t\t\tlabel={ __( 'Focal point' ) }\n\t\t\t\turl={ imageValue }\n\t\t\t\tvalue={ backgroundPositionToCoords( backgroundPositionValue ) }\n\t\t\t\tonChange={ updateBackgroundPosition }\n\t\t\t/>\n\t\t\t<ToggleControl\n\t\t\t\tlabel={ __( 'Fixed background' ) }\n\t\t\t\tchecked={ attachmentValue === 'fixed' }\n\t\t\t\tonChange={ toggleScrollWithPage }\n\t\t\t/>\n\t\t\t<ToggleGroupControl\n\t\t\t\tlabel={ __( 'Size' ) }\n\t\t\t\tvalue={ currentValueForToggle }\n\t\t\t\tonChange={ updateBackgroundSize }\n\t\t\t\tisBlock\n\t\t\t\thelp={ backgroundSizeHelpText(\n\t\t\t\t\tsizeValue || defaultValues?.backgroundSize\n\t\t\t\t) }\n\t\t\t>\n\t\t\t\t<ToggleGroupControlOption\n\t\t\t\t\tkey=\"cover\"\n\t\t\t\t\tvalue=\"cover\"\n\t\t\t\t\tlabel={ _x(\n\t\t\t\t\t\t'Cover',\n\t\t\t\t\t\t'Size option for background image control'\n\t\t\t\t\t) }\n\t\t\t\t/>\n\t\t\t\t<ToggleGroupControlOption\n\t\t\t\t\tkey=\"contain\"\n\t\t\t\t\tvalue=\"contain\"\n\t\t\t\t\tlabel={ _x(\n\t\t\t\t\t\t'Contain',\n\t\t\t\t\t\t'Size option for background image control'\n\t\t\t\t\t) }\n\t\t\t\t/>\n\t\t\t\t<ToggleGroupControlOption\n\t\t\t\t\tkey=\"tile\"\n\t\t\t\t\tvalue=\"auto\"\n\t\t\t\t\tlabel={ _x(\n\t\t\t\t\t\t'Tile',\n\t\t\t\t\t\t'Size option for background image control'\n\t\t\t\t\t) }\n\t\t\t\t/>\n\t\t\t</ToggleGroupControl>\n\t\t\t<HStack justify=\"flex-start\" spacing={ 2 } as=\"span\">\n\t\t\t\t<UnitControl\n\t\t\t\t\taria-label={ __( 'Background image width' ) }\n\t\t\t\t\tonChange={ updateBackgroundSize }\n\t\t\t\t\tvalue={ sizeValue }\n\t\t\t\t\t__unstableInputWidth=\"100px\"\n\t\t\t\t\tmin={ 0 }\n\t\t\t\t\tplaceholder={ __( 'Auto' ) }\n\t\t\t\t\tdisabled={\n\t\t\t\t\t\tcurrentValueForToggle !== 'auto' ||\n\t\t\t\t\t\tcurrentValueForToggle === undefined\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t\t<ToggleControl\n\t\t\t\t\tlabel={ __( 'Repeat' ) }\n\t\t\t\t\tchecked={ repeatCheckedValue }\n\t\t\t\t\tonChange={ toggleIsRepeated }\n\t\t\t\t\tdisabled={ currentValueForToggle === 'cover' }\n\t\t\t\t/>\n\t\t\t</HStack>\n\t\t</VStack>\n\t);\n}\n\nexport default function BackgroundImagePanel( {\n\tvalue,\n\tonChange,\n\tinheritedValue = value,\n\tsettings,\n\tdefaultValues = {},\n\tshowInheritanceLabelIndicators = isGlobalStylesInheritanceIndicatorUIEnabled(),\n} ) {\n\t/*\n\t * Resolve inherited `ref` pointers for background controls.\n\t */\n\tconst { globalStyles, _links } = useSelect( ( select ) => {\n\t\tconst { getSettings } = select( blockEditorStore );\n\t\tconst _settings = getSettings();\n\t\treturn {\n\t\t\tglobalStyles: _settings[ globalStylesDataKey ],\n\t\t\t_links: _settings[ globalStylesLinksDataKey ],\n\t\t};\n\t}, [] );\n\tconst resolvedInheritedValue = useMemo( () => {\n\t\tconst resolvedValues = {\n\t\t\tbackground: {},\n\t\t};\n\n\t\tif ( ! inheritedValue?.background ) {\n\t\t\treturn inheritedValue;\n\t\t}\n\n\t\tObject.entries( inheritedValue?.background ).forEach(\n\t\t\t( [ key, backgroundValue ] ) => {\n\t\t\t\tresolvedValues.background[ key ] = getResolvedValue(\n\t\t\t\t\tbackgroundValue,\n\t\t\t\t\t{\n\t\t\t\t\t\tstyles: globalStyles,\n\t\t\t\t\t\t_links,\n\t\t\t\t\t}\n\t\t\t\t);\n\t\t\t}\n\t\t);\n\t\treturn resolvedValues;\n\t}, [ globalStyles, _links, inheritedValue ] );\n\n\tconst resetBackground = () =>\n\t\tonChange(\n\t\t\tsetImmutably( value, [ 'background' ], {\n\t\t\t\tgradient: value?.background?.gradient,\n\t\t\t} )\n\t\t);\n\n\tconst { title, url } = value?.background?.backgroundImage || {\n\t\t...resolvedInheritedValue?.background?.backgroundImage,\n\t};\n\tconst localHasImageValue = hasBackgroundImageValue( value );\n\tconst hasImageValue =\n\t\tlocalHasImageValue || hasBackgroundImageValue( resolvedInheritedValue );\n\t// The blue-dot local-override affordance is part of the inherited-value\n\t// treatment. When that treatment is disabled (e.g. in the Global Styles\n\t// panel, where the edited value *is* the global style rather than a local\n\t// override of it), fall back to the plain reset control.\n\tconst hasLocalOverride =\n\t\tshowInheritanceLabelIndicators &&\n\t\tlocalHasImageValue &&\n\t\thasBackgroundImageValue( resolvedInheritedValue );\n\n\tconst imageValue =\n\t\tvalue?.background?.backgroundImage ||\n\t\tinheritedValue?.background?.backgroundImage;\n\n\tconst shouldShowBackgroundImageControls =\n\t\thasImageValue &&\n\t\t'none' !== imageValue &&\n\t\t( settings?.background?.backgroundSize ||\n\t\t\tsettings?.background?.backgroundPosition ||\n\t\t\tsettings?.background?.backgroundRepeat );\n\n\tconst [ isDropDownOpen, setIsDropDownOpen ] = useState( false );\n\tconst containerRef = useRef();\n\n\treturn (\n\t\t<div\n\t\t\tref={ containerRef }\n\t\t\tclassName={ clsx(\n\t\t\t\t'block-editor-global-styles-background-panel__inspector-media-replace-container',\n\t\t\t\t{\n\t\t\t\t\t'is-open': isDropDownOpen,\n\t\t\t\t}\n\t\t\t) }\n\t\t>\n\t\t\t{ shouldShowBackgroundImageControls ? (\n\t\t\t\t<BackgroundControlsPanel\n\t\t\t\t\tlabel={ title }\n\t\t\t\t\tfilename={ title }\n\t\t\t\t\turl={ url }\n\t\t\t\t\tonToggle={ setIsDropDownOpen }\n\t\t\t\t\thasImageValue={ hasImageValue }\n\t\t\t\t\thasLocalOverride={ hasLocalOverride }\n\t\t\t\t\tonReset={ localHasImageValue ? resetBackground : undefined }\n\t\t\t\t\tcontainerRef={ containerRef }\n\t\t\t\t>\n\t\t\t\t\t<VStack spacing={ 3 } className=\"single-column\">\n\t\t\t\t\t\t<BackgroundImageControls\n\t\t\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\t\t\tstyle={ value }\n\t\t\t\t\t\t\tinheritedValue={ resolvedInheritedValue }\n\t\t\t\t\t\t\tdisplayInPanel\n\t\t\t\t\t\t\tonResetImage={ () => {\n\t\t\t\t\t\t\t\tsetIsDropDownOpen( false );\n\t\t\t\t\t\t\t\tresetBackground();\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tonRemoveImage={ () => setIsDropDownOpen( false ) }\n\t\t\t\t\t\t\tdefaultValues={ defaultValues }\n\t\t\t\t\t\t\tcontainerRef={ containerRef }\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<BackgroundSizeControls\n\t\t\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\t\t\tstyle={ value }\n\t\t\t\t\t\t\tdefaultValues={ defaultValues }\n\t\t\t\t\t\t\tinheritedValue={ resolvedInheritedValue }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</VStack>\n\t\t\t\t</BackgroundControlsPanel>\n\t\t\t) : (\n\t\t\t\t<BackgroundImageControls\n\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\tstyle={ value }\n\t\t\t\t\tinheritedValue={ resolvedInheritedValue }\n\t\t\t\t\tdefaultValues={ defaultValues }\n\t\t\t\t\tonResetImage={ () => {\n\t\t\t\t\t\tsetIsDropDownOpen( false );\n\t\t\t\t\t\tresetBackground();\n\t\t\t\t\t} }\n\t\t\t\t\tonRemoveImage={ () => setIsDropDownOpen( false ) }\n\t\t\t\t\tcontainerRef={ containerRef }\n\t\t\t\t/>\n\t\t\t) }\n\t\t</div>\n\t);\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -7,7 +7,7 @@ import {
|
|
|
7
7
|
MenuGroup,
|
|
8
8
|
MenuItem
|
|
9
9
|
} from "@wordpress/components";
|
|
10
|
-
import
|
|
10
|
+
import { useAlignmentMenu } from "./use-available-alignments.mjs";
|
|
11
11
|
import { BLOCK_ALIGNMENTS_CONTROLS, DEFAULT_CONTROL } from "./constants.mjs";
|
|
12
12
|
import { Fragment, jsx } from "react/jsx-runtime";
|
|
13
13
|
function BlockAlignmentUI({
|
|
@@ -19,11 +19,20 @@ function BlockAlignmentUI({
|
|
|
19
19
|
label = __("Align block"),
|
|
20
20
|
description
|
|
21
21
|
}) {
|
|
22
|
-
const enabledControls =
|
|
23
|
-
|
|
24
|
-
if (!hasEnabledControls) {
|
|
22
|
+
const { enabled: enabledControls, unavailable: unavailableControls } = useAlignmentMenu(controls);
|
|
23
|
+
if (!enabledControls.length && !unavailableControls.length) {
|
|
25
24
|
return null;
|
|
26
25
|
}
|
|
26
|
+
const menuControls = enabledControls.length ? [...enabledControls] : [{ name: "none" }];
|
|
27
|
+
const enabledNames = menuControls.map(({ name }) => name);
|
|
28
|
+
menuControls.splice(
|
|
29
|
+
enabledNames.indexOf("none") + 1,
|
|
30
|
+
0,
|
|
31
|
+
...unavailableControls.map((name) => ({
|
|
32
|
+
name,
|
|
33
|
+
isUnavailable: true
|
|
34
|
+
}))
|
|
35
|
+
);
|
|
27
36
|
function onChangeAlignment(align) {
|
|
28
37
|
onChange([value, "none"].includes(align) ? void 0 : align);
|
|
29
38
|
}
|
|
@@ -47,8 +56,12 @@ function BlockAlignmentUI({
|
|
|
47
56
|
} : {
|
|
48
57
|
toggleProps: description ? { description } : {},
|
|
49
58
|
children: ({ onClose }) => {
|
|
50
|
-
return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(MenuGroup, { className: "block-editor-block-alignment-control__menu-group", children:
|
|
51
|
-
({
|
|
59
|
+
return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(MenuGroup, { className: "block-editor-block-alignment-control__menu-group", children: menuControls.map(
|
|
60
|
+
({
|
|
61
|
+
name: controlName,
|
|
62
|
+
info,
|
|
63
|
+
isUnavailable
|
|
64
|
+
}) => {
|
|
52
65
|
const { icon, title } = BLOCK_ALIGNMENTS_CONTROLS[controlName];
|
|
53
66
|
const isSelected = controlName === value || !value && controlName === "none";
|
|
54
67
|
return /* @__PURE__ */ jsx(
|
|
@@ -63,6 +76,7 @@ function BlockAlignmentUI({
|
|
|
63
76
|
}
|
|
64
77
|
),
|
|
65
78
|
isSelected,
|
|
79
|
+
disabled: isUnavailable,
|
|
66
80
|
onClick: () => {
|
|
67
81
|
onChangeAlignment(
|
|
68
82
|
controlName
|
|
@@ -70,7 +84,7 @@ function BlockAlignmentUI({
|
|
|
70
84
|
onClose();
|
|
71
85
|
},
|
|
72
86
|
role: "menuitemradio",
|
|
73
|
-
info,
|
|
87
|
+
info: isUnavailable ? __("Not available") : info,
|
|
74
88
|
children: title
|
|
75
89
|
},
|
|
76
90
|
controlName
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/block-alignment-control/ui.jsx"],
|
|
4
|
-
"sourcesContent": ["import clsx from 'clsx';\nimport { __ } from '@wordpress/i18n';\nimport {\n\tToolbarDropdownMenu,\n\tToolbarGroup,\n\tMenuGroup,\n\tMenuItem,\n} from '@wordpress/components';\nimport
|
|
5
|
-
"mappings": ";AAAA,OAAO,UAAU;AACjB,SAAS,UAAU;AACnB;AAAA,EACC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACM;AACP,
|
|
4
|
+
"sourcesContent": ["import clsx from 'clsx';\nimport { __ } from '@wordpress/i18n';\nimport {\n\tToolbarDropdownMenu,\n\tToolbarGroup,\n\tMenuGroup,\n\tMenuItem,\n} from '@wordpress/components';\nimport { useAlignmentMenu } from './use-available-alignments';\nimport { BLOCK_ALIGNMENTS_CONTROLS, DEFAULT_CONTROL } from './constants';\n\nfunction BlockAlignmentUI( {\n\tvalue,\n\tonChange,\n\tcontrols,\n\tisToolbar,\n\tisCollapsed = true,\n\tlabel = __( 'Align block' ),\n\tdescription,\n} ) {\n\t/*\n\t * Wide and Full are the alignments users look for and fail to find. When a\n\t * parent layout does not offer them they disappear from this menu with no\n\t * explanation, which reads as the editor losing the setting. List them as\n\t * unavailable instead, so the menu says why it cannot do what was asked.\n\t */\n\tconst { enabled: enabledControls, unavailable: unavailableControls } =\n\t\tuseAlignmentMenu( controls );\n\n\tif ( ! enabledControls.length && ! unavailableControls.length ) {\n\t\treturn null;\n\t}\n\n\t/*\n\t * A block whose alignments are all unavailable still needs somewhere to\n\t * anchor them, and `None` is always a valid choice for it.\n\t */\n\tconst menuControls = enabledControls.length\n\t\t? [ ...enabledControls ]\n\t\t: [ { name: 'none' } ];\n\tconst enabledNames = menuControls.map( ( { name } ) => name );\n\n\t// Unavailable alignments sit where they would have sat had they been\n\t// offered, which is directly after `none`.\n\tmenuControls.splice(\n\t\tenabledNames.indexOf( 'none' ) + 1,\n\t\t0,\n\t\t...unavailableControls.map( ( name ) => ( {\n\t\t\tname,\n\t\t\tisUnavailable: true,\n\t\t} ) )\n\t);\n\n\tfunction onChangeAlignment( align ) {\n\t\tonChange( [ value, 'none' ].includes( align ) ? undefined : align );\n\t}\n\n\tconst activeAlignmentControl = BLOCK_ALIGNMENTS_CONTROLS[ value ];\n\tconst defaultAlignmentControl =\n\t\tBLOCK_ALIGNMENTS_CONTROLS[ DEFAULT_CONTROL ];\n\n\tconst UIComponent = isToolbar ? ToolbarGroup : ToolbarDropdownMenu;\n\tconst commonProps = {\n\t\ticon: activeAlignmentControl\n\t\t\t? activeAlignmentControl.icon\n\t\t\t: defaultAlignmentControl.icon,\n\t\tlabel,\n\t};\n\tconst extraProps = isToolbar\n\t\t? {\n\t\t\t\tisCollapsed,\n\t\t\t\tcontrols: enabledControls.map( ( { name: controlName } ) => {\n\t\t\t\t\treturn {\n\t\t\t\t\t\t...BLOCK_ALIGNMENTS_CONTROLS[ controlName ],\n\t\t\t\t\t\tisActive:\n\t\t\t\t\t\t\tvalue === controlName ||\n\t\t\t\t\t\t\t( ! value && controlName === 'none' ),\n\t\t\t\t\t\trole: isCollapsed ? 'menuitemradio' : undefined,\n\t\t\t\t\t\tonClick: () => onChangeAlignment( controlName ),\n\t\t\t\t\t};\n\t\t\t\t} ),\n\t\t\t}\n\t\t: {\n\t\t\t\ttoggleProps: description ? { description } : {},\n\t\t\t\tchildren: ( { onClose } ) => {\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t<MenuGroup className=\"block-editor-block-alignment-control__menu-group\">\n\t\t\t\t\t\t\t\t{ menuControls.map(\n\t\t\t\t\t\t\t\t\t( {\n\t\t\t\t\t\t\t\t\t\tname: controlName,\n\t\t\t\t\t\t\t\t\t\tinfo,\n\t\t\t\t\t\t\t\t\t\tisUnavailable,\n\t\t\t\t\t\t\t\t\t} ) => {\n\t\t\t\t\t\t\t\t\t\tconst { icon, title } =\n\t\t\t\t\t\t\t\t\t\t\tBLOCK_ALIGNMENTS_CONTROLS[\n\t\t\t\t\t\t\t\t\t\t\t\tcontrolName\n\t\t\t\t\t\t\t\t\t\t\t];\n\t\t\t\t\t\t\t\t\t\t// If no value is provided, mark as selected the `none` option.\n\t\t\t\t\t\t\t\t\t\t// An unavailable alignment can still be the saved value, and\n\t\t\t\t\t\t\t\t\t\t// showing it as selected is how the menu says the setting\n\t\t\t\t\t\t\t\t\t\t// exists but has no effect in this position.\n\t\t\t\t\t\t\t\t\t\tconst isSelected =\n\t\t\t\t\t\t\t\t\t\t\tcontrolName === value ||\n\t\t\t\t\t\t\t\t\t\t\t( ! value &&\n\t\t\t\t\t\t\t\t\t\t\t\tcontrolName === 'none' );\n\t\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t\t<MenuItem\n\t\t\t\t\t\t\t\t\t\t\t\tkey={ controlName }\n\t\t\t\t\t\t\t\t\t\t\t\ticon={ icon }\n\t\t\t\t\t\t\t\t\t\t\t\ticonPosition=\"left\"\n\t\t\t\t\t\t\t\t\t\t\t\tclassName={ clsx(\n\t\t\t\t\t\t\t\t\t\t\t\t\t'components-dropdown-menu__menu-item',\n\t\t\t\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t'is-active': isSelected,\n\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t\t\t\tisSelected={ isSelected }\n\t\t\t\t\t\t\t\t\t\t\t\tdisabled={ isUnavailable }\n\t\t\t\t\t\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\t\t\t\t\t\tonChangeAlignment(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tcontrolName\n\t\t\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t\t\t\tonClose();\n\t\t\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\t\t\trole=\"menuitemradio\"\n\t\t\t\t\t\t\t\t\t\t\t\tinfo={\n\t\t\t\t\t\t\t\t\t\t\t\t\tisUnavailable\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t? __( 'Not available' )\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t: info\n\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t{ title }\n\t\t\t\t\t\t\t\t\t\t\t</MenuItem>\n\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t</MenuGroup>\n\t\t\t\t\t\t</>\n\t\t\t\t\t);\n\t\t\t\t},\n\t\t\t};\n\n\treturn <UIComponent { ...commonProps } { ...extraProps } />;\n}\n\nexport default BlockAlignmentUI;\n"],
|
|
5
|
+
"mappings": ";AAAA,OAAO,UAAU;AACjB,SAAS,UAAU;AACnB;AAAA,EACC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACM;AACP,SAAS,wBAAwB;AACjC,SAAS,2BAA2B,uBAAuB;AA6ErD,mBAqBK,WArBL;AA3EN,SAAS,iBAAkB;AAAA,EAC1B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,cAAc;AAAA,EACd,QAAQ,GAAI,aAAc;AAAA,EAC1B;AACD,GAAI;AAOH,QAAM,EAAE,SAAS,iBAAiB,aAAa,oBAAoB,IAClE,iBAAkB,QAAS;AAE5B,MAAK,CAAE,gBAAgB,UAAU,CAAE,oBAAoB,QAAS;AAC/D,WAAO;AAAA,EACR;AAMA,QAAM,eAAe,gBAAgB,SAClC,CAAE,GAAG,eAAgB,IACrB,CAAE,EAAE,MAAM,OAAO,CAAE;AACtB,QAAM,eAAe,aAAa,IAAK,CAAE,EAAE,KAAK,MAAO,IAAK;AAI5D,eAAa;AAAA,IACZ,aAAa,QAAS,MAAO,IAAI;AAAA,IACjC;AAAA,IACA,GAAG,oBAAoB,IAAK,CAAE,UAAY;AAAA,MACzC;AAAA,MACA,eAAe;AAAA,IAChB,EAAI;AAAA,EACL;AAEA,WAAS,kBAAmB,OAAQ;AACnC,aAAU,CAAE,OAAO,MAAO,EAAE,SAAU,KAAM,IAAI,SAAY,KAAM;AAAA,EACnE;AAEA,QAAM,yBAAyB,0BAA2B,KAAM;AAChE,QAAM,0BACL,0BAA2B,eAAgB;AAE5C,QAAM,cAAc,YAAY,eAAe;AAC/C,QAAM,cAAc;AAAA,IACnB,MAAM,yBACH,uBAAuB,OACvB,wBAAwB;AAAA,IAC3B;AAAA,EACD;AACA,QAAM,aAAa,YAChB;AAAA,IACA;AAAA,IACA,UAAU,gBAAgB,IAAK,CAAE,EAAE,MAAM,YAAY,MAAO;AAC3D,aAAO;AAAA,QACN,GAAG,0BAA2B,WAAY;AAAA,QAC1C,UACC,UAAU,eACR,CAAE,SAAS,gBAAgB;AAAA,QAC9B,MAAM,cAAc,kBAAkB;AAAA,QACtC,SAAS,MAAM,kBAAmB,WAAY;AAAA,MAC/C;AAAA,IACD,CAAE;AAAA,EACH,IACC;AAAA,IACA,aAAa,cAAc,EAAE,YAAY,IAAI,CAAC;AAAA,IAC9C,UAAU,CAAE,EAAE,QAAQ,MAAO;AAC5B,aACC,gCACC,8BAAC,aAAU,WAAU,oDAClB,uBAAa;AAAA,QACd,CAAE;AAAA,UACD,MAAM;AAAA,UACN;AAAA,UACA;AAAA,QACD,MAAO;AACN,gBAAM,EAAE,MAAM,MAAM,IACnB,0BACC,WACD;AAKD,gBAAM,aACL,gBAAgB,SACd,CAAE,SACH,gBAAgB;AAClB,iBACC;AAAA,YAAC;AAAA;AAAA,cAEA;AAAA,cACA,cAAa;AAAA,cACb,WAAY;AAAA,gBACX;AAAA,gBACA;AAAA,kBACC,aAAa;AAAA,gBACd;AAAA,cACD;AAAA,cACA;AAAA,cACA,UAAW;AAAA,cACX,SAAU,MAAM;AACf;AAAA,kBACC;AAAA,gBACD;AACA,wBAAQ;AAAA,cACT;AAAA,cACA,MAAK;AAAA,cACL,MACC,gBACG,GAAI,eAAgB,IACpB;AAAA,cAGF;AAAA;AAAA,YAxBI;AAAA,UAyBP;AAAA,QAEF;AAAA,MACD,GACD,GACD;AAAA,IAEF;AAAA,EACD;AAEF,SAAO,oBAAC,eAAc,GAAG,aAAgB,GAAG,YAAa;AAC1D;AAEA,IAAO,aAAQ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,34 +1,45 @@
|
|
|
1
1
|
// packages/block-editor/src/components/block-alignment-control/use-available-alignments.js
|
|
2
2
|
import { useSelect } from "@wordpress/data";
|
|
3
3
|
import { useLayout } from "../block-list/layout.mjs";
|
|
4
|
+
import { useSettings } from "../use-settings/index.mjs";
|
|
4
5
|
import { store as blockEditorStore } from "../../store/index.mjs";
|
|
5
6
|
import { getLayoutType } from "../../layouts/index.mjs";
|
|
6
7
|
var EMPTY_ARRAY = [];
|
|
7
8
|
var DEFAULT_CONTROLS = ["none", "left", "center", "right", "wide", "full"];
|
|
8
9
|
var WIDE_CONTROLS = ["wide", "full"];
|
|
9
|
-
function
|
|
10
|
-
|
|
11
|
-
controls = ["none", ...controls];
|
|
12
|
-
}
|
|
13
|
-
const isNoneOnly = controls.length === 1 && controls[0] === "none";
|
|
14
|
-
const [wideControlsEnabled, themeSupportsLayout, isBlockBasedTheme] = useSelect(
|
|
10
|
+
function useAlignmentSettings(isNoneOnly) {
|
|
11
|
+
return useSelect(
|
|
15
12
|
(select) => {
|
|
16
13
|
if (isNoneOnly) {
|
|
17
|
-
return
|
|
14
|
+
return {
|
|
15
|
+
wideControlsEnabled: false,
|
|
16
|
+
themeSupportsLayout: false,
|
|
17
|
+
isBlockBasedTheme: false
|
|
18
|
+
};
|
|
18
19
|
}
|
|
19
20
|
const settings = select(blockEditorStore).getSettings();
|
|
20
|
-
return
|
|
21
|
-
settings.alignWide ?? false,
|
|
22
|
-
settings.supportsLayout,
|
|
23
|
-
settings.__unstableIsBlockBasedTheme
|
|
24
|
-
|
|
21
|
+
return {
|
|
22
|
+
wideControlsEnabled: settings.alignWide ?? false,
|
|
23
|
+
themeSupportsLayout: settings.supportsLayout,
|
|
24
|
+
isBlockBasedTheme: settings.__unstableIsBlockBasedTheme
|
|
25
|
+
};
|
|
25
26
|
},
|
|
26
27
|
[isNoneOnly]
|
|
27
28
|
);
|
|
29
|
+
}
|
|
30
|
+
function useAvailableAlignments(controls = DEFAULT_CONTROLS) {
|
|
31
|
+
if (!controls.includes("none")) {
|
|
32
|
+
controls = ["none", ...controls];
|
|
33
|
+
}
|
|
34
|
+
const isNoneOnly = controls.length === 1 && controls[0] === "none";
|
|
35
|
+
const settings = useAlignmentSettings(isNoneOnly);
|
|
28
36
|
const layout = useLayout();
|
|
29
37
|
if (isNoneOnly) {
|
|
30
38
|
return EMPTY_ARRAY;
|
|
31
39
|
}
|
|
40
|
+
return getAvailableAlignments(controls, layout, settings);
|
|
41
|
+
}
|
|
42
|
+
function getAvailableAlignments(controls, layout, { wideControlsEnabled, themeSupportsLayout, isBlockBasedTheme }) {
|
|
32
43
|
const layoutType = getLayoutType(layout?.type);
|
|
33
44
|
if (themeSupportsLayout) {
|
|
34
45
|
const layoutAlignments = layoutType.getAlignments(
|
|
@@ -60,7 +71,39 @@ function useAvailableAlignments(controls = DEFAULT_CONTROLS) {
|
|
|
60
71
|
}
|
|
61
72
|
return alignments;
|
|
62
73
|
}
|
|
74
|
+
function useAlignmentMenu(controls = DEFAULT_CONTROLS) {
|
|
75
|
+
if (!controls.includes("none")) {
|
|
76
|
+
controls = ["none", ...controls];
|
|
77
|
+
}
|
|
78
|
+
const isNoneOnly = controls.length === 1 && controls[0] === "none";
|
|
79
|
+
const settings = useAlignmentSettings(isNoneOnly);
|
|
80
|
+
const layout = useLayout();
|
|
81
|
+
const [globalLayout] = useSettings("layout");
|
|
82
|
+
if (isNoneOnly) {
|
|
83
|
+
return { enabled: EMPTY_ARRAY, unavailable: EMPTY_ARRAY };
|
|
84
|
+
}
|
|
85
|
+
const enabled = getAvailableAlignments(controls, layout, settings);
|
|
86
|
+
const layoutOffersAlignments = !!getAvailableAlignments(
|
|
87
|
+
DEFAULT_CONTROLS,
|
|
88
|
+
layout,
|
|
89
|
+
settings
|
|
90
|
+
).length;
|
|
91
|
+
if (!layoutOffersAlignments) {
|
|
92
|
+
return { enabled, unavailable: EMPTY_ARRAY };
|
|
93
|
+
}
|
|
94
|
+
const themeNames = getAvailableAlignments(
|
|
95
|
+
DEFAULT_CONTROLS,
|
|
96
|
+
{ ...globalLayout, type: "constrained" },
|
|
97
|
+
settings
|
|
98
|
+
).map(({ name }) => name);
|
|
99
|
+
const enabledNames = enabled.map(({ name }) => name);
|
|
100
|
+
const unavailable = controls.filter(
|
|
101
|
+
(name) => WIDE_CONTROLS.includes(name) && themeNames.includes(name) && !enabledNames.includes(name)
|
|
102
|
+
);
|
|
103
|
+
return { enabled, unavailable };
|
|
104
|
+
}
|
|
63
105
|
export {
|
|
64
|
-
useAvailableAlignments as default
|
|
106
|
+
useAvailableAlignments as default,
|
|
107
|
+
useAlignmentMenu
|
|
65
108
|
};
|
|
66
109
|
//# sourceMappingURL=use-available-alignments.mjs.map
|