@wordpress/block-editor 15.21.1 → 15.22.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 +6 -0
- package/README.md +2 -2
- package/build/components/block-card/index.cjs +4 -5
- package/build/components/block-card/index.cjs.map +2 -2
- package/build/components/block-editing-mode/index.cjs +13 -7
- package/build/components/block-editing-mode/index.cjs.map +2 -2
- package/build/components/block-inspector/index.cjs +35 -20
- package/build/components/block-inspector/index.cjs.map +2 -2
- package/build/components/block-mover/mover-description.cjs +6 -6
- package/build/components/block-mover/mover-description.cjs.map +1 -1
- package/build/components/block-patterns-list/index.cjs.map +2 -2
- package/build/components/block-patterns-paging/index.cjs +4 -4
- package/build/components/block-patterns-paging/index.cjs.map +2 -2
- package/build/components/block-popover/use-popover-scroll.cjs.map +1 -1
- package/build/components/block-quick-navigation/index.cjs +7 -5
- package/build/components/block-quick-navigation/index.cjs.map +2 -2
- package/build/components/block-rename/modal.cjs +0 -1
- package/build/components/block-rename/modal.cjs.map +2 -2
- package/build/components/block-toolbar/block-toolbar-icon.cjs +14 -6
- package/build/components/block-toolbar/block-toolbar-icon.cjs.map +2 -2
- package/build/components/block-toolbar/edit-section-button.cjs.map +1 -1
- package/build/components/block-tools/use-block-toolbar-popover-props.cjs +10 -4
- package/build/components/block-tools/use-block-toolbar-popover-props.cjs.map +2 -2
- package/build/components/child-layout-control/index.cjs +51 -19
- package/build/components/child-layout-control/index.cjs.map +2 -2
- package/build/components/colors-gradients/control.cjs +25 -14
- package/build/components/colors-gradients/control.cjs.map +2 -2
- package/build/components/colors-gradients/dropdown.cjs +4 -1
- package/build/components/colors-gradients/dropdown.cjs.map +3 -3
- package/build/components/contrast-checker/index.cjs +22 -4
- package/build/components/contrast-checker/index.cjs.map +2 -2
- package/build/components/date-format-picker/index.cjs +0 -1
- package/build/components/date-format-picker/index.cjs.map +2 -2
- package/build/components/dimensions-tool/index.cjs +4 -5
- package/build/components/dimensions-tool/index.cjs.map +2 -2
- package/build/components/dimensions-tool/scale-tool.cjs +1 -1
- package/build/components/dimensions-tool/scale-tool.cjs.map +2 -2
- package/build/components/global-styles/background-panel.cjs +153 -25
- package/build/components/global-styles/background-panel.cjs.map +3 -3
- package/build/components/global-styles/color-gradient-dropdown-item.cjs +227 -0
- package/build/components/global-styles/color-gradient-dropdown-item.cjs.map +7 -0
- package/build/components/global-styles/color-panel.cjs +98 -375
- package/build/components/global-styles/color-panel.cjs.map +3 -3
- package/build/components/global-styles/dimensions-panel.cjs +1 -4
- package/build/components/global-styles/dimensions-panel.cjs.map +2 -2
- package/build/components/global-styles/hooks.cjs +34 -0
- package/build/components/global-styles/hooks.cjs.map +2 -2
- package/build/components/global-styles/shadow-panel-components.cjs.map +2 -2
- package/build/components/global-styles/typography-panel.cjs +82 -10
- package/build/components/global-styles/typography-panel.cjs.map +3 -3
- package/build/components/grid/grid-item-resizer.cjs.map +1 -1
- package/build/components/grid/grid-visualizer.cjs.map +1 -1
- package/build/components/iframe/index.cjs +6 -3
- package/build/components/iframe/index.cjs.map +3 -3
- package/build/components/image-editor/use-transform-image.cjs.map +1 -1
- package/build/components/inserter/get-appender-label.cjs.map +1 -1
- package/build/components/inserter/media-tab/media-preview.cjs.map +2 -2
- package/build/components/inserter/search-items.cjs.map +1 -1
- package/build/components/inspector-controls/fill.cjs +1 -3
- package/build/components/inspector-controls/fill.cjs.map +2 -2
- package/build/components/inspector-controls/groups.cjs +2 -0
- package/build/components/inspector-controls/groups.cjs.map +2 -2
- package/build/components/inspector-controls-tabs/index.cjs.map +2 -2
- package/build/components/inspector-controls-tabs/styles-tab.cjs +76 -32
- package/build/components/inspector-controls-tabs/styles-tab.cjs.map +2 -2
- package/build/components/keyboard-shortcuts/index.cjs.map +1 -1
- package/build/components/line-height-control/index.cjs.map +1 -1
- package/build/components/link-control/index.cjs +2 -3
- package/build/components/link-control/index.cjs.map +2 -2
- package/build/components/link-control/normalize-url.cjs.map +1 -1
- package/build/components/list-view/block-select-button.cjs +1 -10
- package/build/components/list-view/block-select-button.cjs.map +3 -3
- package/build/components/list-view/utils.cjs.map +1 -1
- package/build/components/preset-input-control/custom-value-controls.cjs.map +2 -2
- package/build/components/provider/index.cjs.map +1 -1
- package/build/components/provider/use-block-sync.cjs +3 -1
- package/build/components/provider/use-block-sync.cjs.map +2 -2
- package/build/components/rich-text/event-listeners/before-input-rules.cjs +1 -1
- package/build/components/rich-text/event-listeners/before-input-rules.cjs.map +2 -2
- package/build/components/rich-text/event-listeners/paste-handler.cjs.map +1 -1
- package/build/components/rich-text/prevent-event-discovery.cjs +1 -1
- package/build/components/rich-text/prevent-event-discovery.cjs.map +1 -1
- package/build/components/url-popover/image-url-input-ui.cjs +0 -2
- package/build/components/url-popover/image-url-input-ui.cjs.map +2 -2
- package/build/components/use-block-display-information/index.cjs +10 -3
- package/build/components/use-block-display-information/index.cjs.map +2 -2
- package/build/components/writing-flow/use-tab-nav.cjs.map +1 -1
- package/build/hooks/anchor.cjs +1 -2
- package/build/hooks/anchor.cjs.map +2 -2
- package/build/hooks/background.cjs +124 -75
- package/build/hooks/background.cjs.map +3 -3
- package/build/hooks/block-fields/index.cjs +13 -2
- package/build/hooks/block-fields/index.cjs.map +2 -2
- package/build/hooks/color.cjs +0 -162
- package/build/hooks/color.cjs.map +3 -3
- package/build/hooks/contrast-checker.cjs +31 -28
- package/build/hooks/contrast-checker.cjs.map +3 -3
- package/build/hooks/custom-class-name.cjs +0 -1
- package/build/hooks/custom-class-name.cjs.map +2 -2
- package/build/hooks/dimensions.cjs +13 -2
- package/build/hooks/dimensions.cjs.map +2 -2
- package/build/hooks/elements.cjs +142 -0
- package/build/hooks/elements.cjs.map +7 -0
- package/build/hooks/grid-visualizer.cjs +21 -11
- package/build/hooks/grid-visualizer.cjs.map +2 -2
- package/build/hooks/layout-child.cjs +65 -10
- package/build/hooks/layout-child.cjs.map +2 -2
- package/build/hooks/layout.cjs +6 -3
- package/build/hooks/layout.cjs.map +2 -2
- package/build/hooks/list-view.cjs +10 -7
- package/build/hooks/list-view.cjs.map +2 -2
- package/build/hooks/spacing-visualizer.cjs.map +1 -1
- package/build/hooks/state-utils.cjs.map +1 -1
- package/build/hooks/states.cjs +2 -2
- package/build/hooks/states.cjs.map +2 -2
- package/build/hooks/style.cjs +50 -6
- package/build/hooks/style.cjs.map +2 -2
- package/build/hooks/typography.cjs +62 -10
- package/build/hooks/typography.cjs.map +3 -3
- package/build/layouts/flex.cjs +99 -6
- package/build/layouts/flex.cjs.map +2 -2
- package/build/private-apis.cjs +4 -0
- package/build/private-apis.cjs.map +2 -2
- package/build/store/actions.cjs.map +1 -1
- package/build/store/private-selectors.cjs +19 -2
- package/build/store/private-selectors.cjs.map +2 -2
- package/build/store/reducer.cjs.map +1 -1
- package/build/store/selectors.cjs.map +1 -1
- package/build/utils/block-bindings.cjs +9 -9
- package/build/utils/block-bindings.cjs.map +3 -3
- package/build/utils/color-values.cjs +10 -1
- package/build/utils/color-values.cjs.map +3 -3
- package/build/utils/dom.cjs +2 -5
- package/build/utils/dom.cjs.map +3 -3
- package/build/utils/fit-text-frontend.cjs +6 -2
- package/build/utils/fit-text-frontend.cjs.map +3 -3
- package/build/utils/fit-text-utils.cjs +1 -1
- package/build/utils/fit-text-utils.cjs.map +3 -3
- package/build/utils/format-font-style.cjs +1 -1
- package/build/utils/format-font-style.cjs.map +3 -3
- package/build/utils/format-font-weight.cjs +1 -1
- package/build/utils/format-font-weight.cjs.map +3 -3
- package/build/utils/get-editor-region.cjs +4 -2
- package/build/utils/get-editor-region.cjs.map +3 -3
- package/build/utils/get-font-styles-and-weights.cjs +8 -12
- package/build/utils/get-font-styles-and-weights.cjs.map +3 -3
- package/build/utils/get-px-from-css-unit.cjs +1 -1
- package/build/utils/get-px-from-css-unit.cjs.map +1 -1
- package/build/utils/index.cjs +1 -1
- package/build/utils/index.cjs.map +1 -1
- package/build/utils/math.cjs +1 -1
- package/build/utils/math.cjs.map +3 -3
- package/build/utils/object.cjs +8 -8
- package/build/utils/object.cjs.map +3 -3
- package/build/utils/order-inserter-block-items.cjs +1 -1
- package/build/utils/order-inserter-block-items.cjs.map +3 -3
- package/build/utils/pasting.cjs +4 -2
- package/build/utils/pasting.cjs.map +3 -3
- package/build/utils/selection.cjs +3 -2
- package/build/utils/selection.cjs.map +3 -3
- package/build/utils/sorting.cjs +9 -3
- package/build/utils/sorting.cjs.map +3 -3
- package/build/utils/transform-styles/index.cjs +3 -2
- package/build/utils/transform-styles/index.cjs.map +3 -3
- package/build/utils/transform-styles/postcss-urlrebase.d.cjs +2 -0
- package/build/utils/transform-styles/postcss-urlrebase.d.cjs.map +7 -0
- package/build/utils/transform-styles/types.cjs +19 -0
- package/build/utils/transform-styles/types.cjs.map +7 -0
- package/build/utils/types.cjs +19 -0
- package/build/utils/types.cjs.map +7 -0
- package/build-module/components/block-card/index.mjs +5 -6
- package/build-module/components/block-card/index.mjs.map +2 -2
- package/build-module/components/block-editing-mode/index.mjs +14 -8
- package/build-module/components/block-editing-mode/index.mjs.map +2 -2
- package/build-module/components/block-inspector/index.mjs +35 -21
- package/build-module/components/block-inspector/index.mjs.map +2 -2
- package/build-module/components/block-mover/mover-description.mjs +6 -6
- package/build-module/components/block-mover/mover-description.mjs.map +1 -1
- package/build-module/components/block-patterns-list/index.mjs.map +2 -2
- package/build-module/components/block-patterns-paging/index.mjs +4 -4
- package/build-module/components/block-patterns-paging/index.mjs.map +2 -2
- package/build-module/components/block-popover/use-popover-scroll.mjs.map +1 -1
- package/build-module/components/block-quick-navigation/index.mjs +8 -6
- package/build-module/components/block-quick-navigation/index.mjs.map +2 -2
- package/build-module/components/block-rename/modal.mjs +0 -1
- package/build-module/components/block-rename/modal.mjs.map +2 -2
- package/build-module/components/block-toolbar/block-toolbar-icon.mjs +14 -6
- package/build-module/components/block-toolbar/block-toolbar-icon.mjs.map +2 -2
- package/build-module/components/block-toolbar/edit-section-button.mjs.map +1 -1
- package/build-module/components/block-tools/use-block-toolbar-popover-props.mjs +10 -4
- package/build-module/components/block-tools/use-block-toolbar-popover-props.mjs.map +2 -2
- package/build-module/components/child-layout-control/index.mjs +51 -19
- package/build-module/components/child-layout-control/index.mjs.map +2 -2
- package/build-module/components/colors-gradients/control.mjs +27 -15
- package/build-module/components/colors-gradients/control.mjs.map +2 -2
- package/build-module/components/colors-gradients/dropdown.mjs +4 -1
- package/build-module/components/colors-gradients/dropdown.mjs.map +2 -2
- package/build-module/components/contrast-checker/index.mjs +18 -4
- package/build-module/components/contrast-checker/index.mjs.map +2 -2
- package/build-module/components/date-format-picker/index.mjs +0 -1
- package/build-module/components/date-format-picker/index.mjs.map +2 -2
- package/build-module/components/dimensions-tool/index.mjs +4 -5
- package/build-module/components/dimensions-tool/index.mjs.map +2 -2
- package/build-module/components/dimensions-tool/scale-tool.mjs +1 -1
- package/build-module/components/dimensions-tool/scale-tool.mjs.map +2 -2
- package/build-module/components/global-styles/background-panel.mjs +155 -27
- package/build-module/components/global-styles/background-panel.mjs.map +2 -2
- package/build-module/components/global-styles/color-gradient-dropdown-item.mjs +207 -0
- package/build-module/components/global-styles/color-gradient-dropdown-item.mjs.map +7 -0
- package/build-module/components/global-styles/color-panel.mjs +106 -387
- package/build-module/components/global-styles/color-panel.mjs.map +3 -3
- package/build-module/components/global-styles/dimensions-panel.mjs +1 -5
- package/build-module/components/global-styles/dimensions-panel.mjs.map +2 -2
- package/build-module/components/global-styles/hooks.mjs +33 -0
- package/build-module/components/global-styles/hooks.mjs.map +2 -2
- package/build-module/components/global-styles/shadow-panel-components.mjs.map +2 -2
- package/build-module/components/global-styles/typography-panel.mjs +84 -10
- package/build-module/components/global-styles/typography-panel.mjs.map +2 -2
- package/build-module/components/grid/grid-item-resizer.mjs.map +1 -1
- package/build-module/components/grid/grid-visualizer.mjs.map +1 -1
- package/build-module/components/iframe/index.mjs +6 -3
- package/build-module/components/iframe/index.mjs.map +2 -2
- package/build-module/components/image-editor/use-transform-image.mjs.map +1 -1
- package/build-module/components/inserter/get-appender-label.mjs.map +1 -1
- package/build-module/components/inserter/media-tab/media-preview.mjs.map +2 -2
- package/build-module/components/inserter/search-items.mjs.map +1 -1
- package/build-module/components/inspector-controls/fill.mjs +1 -3
- package/build-module/components/inspector-controls/fill.mjs.map +2 -2
- package/build-module/components/inspector-controls/groups.mjs +2 -0
- package/build-module/components/inspector-controls/groups.mjs.map +2 -2
- package/build-module/components/inspector-controls-tabs/index.mjs.map +2 -2
- package/build-module/components/inspector-controls-tabs/styles-tab.mjs +76 -32
- package/build-module/components/inspector-controls-tabs/styles-tab.mjs.map +2 -2
- package/build-module/components/keyboard-shortcuts/index.mjs.map +1 -1
- package/build-module/components/line-height-control/index.mjs.map +1 -1
- package/build-module/components/link-control/index.mjs +2 -3
- package/build-module/components/link-control/index.mjs.map +2 -2
- package/build-module/components/link-control/normalize-url.mjs.map +1 -1
- package/build-module/components/list-view/block-select-button.mjs +2 -17
- package/build-module/components/list-view/block-select-button.mjs.map +2 -2
- package/build-module/components/list-view/utils.mjs.map +1 -1
- package/build-module/components/preset-input-control/custom-value-controls.mjs.map +2 -2
- package/build-module/components/provider/index.mjs.map +1 -1
- package/build-module/components/provider/use-block-sync.mjs +3 -1
- package/build-module/components/provider/use-block-sync.mjs.map +2 -2
- package/build-module/components/rich-text/event-listeners/before-input-rules.mjs +1 -1
- package/build-module/components/rich-text/event-listeners/before-input-rules.mjs.map +2 -2
- package/build-module/components/rich-text/event-listeners/paste-handler.mjs.map +1 -1
- package/build-module/components/rich-text/prevent-event-discovery.mjs +1 -1
- package/build-module/components/rich-text/prevent-event-discovery.mjs.map +1 -1
- package/build-module/components/url-popover/image-url-input-ui.mjs +0 -2
- package/build-module/components/url-popover/image-url-input-ui.mjs.map +2 -2
- package/build-module/components/use-block-display-information/index.mjs +10 -3
- package/build-module/components/use-block-display-information/index.mjs.map +2 -2
- package/build-module/components/writing-flow/use-tab-nav.mjs.map +1 -1
- package/build-module/hooks/anchor.mjs +1 -2
- package/build-module/hooks/anchor.mjs.map +2 -2
- package/build-module/hooks/background.mjs +123 -75
- package/build-module/hooks/background.mjs.map +2 -2
- package/build-module/hooks/block-fields/index.mjs +13 -2
- package/build-module/hooks/block-fields/index.mjs.map +2 -2
- package/build-module/hooks/color.mjs +2 -175
- package/build-module/hooks/color.mjs.map +2 -2
- package/build-module/hooks/contrast-checker.mjs +32 -19
- package/build-module/hooks/contrast-checker.mjs.map +2 -2
- package/build-module/hooks/custom-class-name.mjs +0 -1
- package/build-module/hooks/custom-class-name.mjs.map +2 -2
- package/build-module/hooks/dimensions.mjs +12 -2
- package/build-module/hooks/dimensions.mjs.map +2 -2
- package/build-module/hooks/elements.mjs +115 -0
- package/build-module/hooks/elements.mjs.map +7 -0
- package/build-module/hooks/grid-visualizer.mjs +21 -11
- package/build-module/hooks/grid-visualizer.mjs.map +2 -2
- package/build-module/hooks/layout-child.mjs +68 -10
- package/build-module/hooks/layout-child.mjs.map +2 -2
- package/build-module/hooks/layout.mjs +6 -3
- package/build-module/hooks/layout.mjs.map +2 -2
- package/build-module/hooks/list-view.mjs +10 -7
- package/build-module/hooks/list-view.mjs.map +2 -2
- package/build-module/hooks/spacing-visualizer.mjs.map +1 -1
- package/build-module/hooks/state-utils.mjs.map +1 -1
- package/build-module/hooks/states.mjs +2 -2
- package/build-module/hooks/states.mjs.map +2 -2
- package/build-module/hooks/style.mjs +53 -8
- package/build-module/hooks/style.mjs.map +2 -2
- package/build-module/hooks/typography.mjs +62 -10
- package/build-module/hooks/typography.mjs.map +2 -2
- package/build-module/layouts/flex.mjs +105 -7
- package/build-module/layouts/flex.mjs.map +2 -2
- package/build-module/private-apis.mjs +8 -0
- package/build-module/private-apis.mjs.map +2 -2
- package/build-module/store/actions.mjs.map +1 -1
- package/build-module/store/private-selectors.mjs +18 -1
- package/build-module/store/private-selectors.mjs.map +2 -2
- package/build-module/store/reducer.mjs.map +1 -1
- package/build-module/store/selectors.mjs.map +1 -1
- package/build-module/utils/block-bindings.mjs +9 -9
- package/build-module/utils/block-bindings.mjs.map +3 -3
- package/build-module/utils/color-values.mjs +9 -1
- package/build-module/utils/color-values.mjs.map +3 -3
- package/build-module/utils/dom.mjs +2 -5
- package/build-module/utils/dom.mjs.map +3 -3
- package/build-module/utils/fit-text-frontend.mjs +6 -2
- package/build-module/utils/fit-text-frontend.mjs.map +3 -3
- package/build-module/utils/fit-text-utils.mjs +1 -1
- package/build-module/utils/fit-text-utils.mjs.map +3 -3
- package/build-module/utils/format-font-style.mjs +1 -1
- package/build-module/utils/format-font-style.mjs.map +3 -3
- package/build-module/utils/format-font-weight.mjs +1 -1
- package/build-module/utils/format-font-weight.mjs.map +3 -3
- package/build-module/utils/get-editor-region.mjs +4 -2
- package/build-module/utils/get-editor-region.mjs.map +3 -3
- package/build-module/utils/get-font-styles-and-weights.mjs +8 -12
- package/build-module/utils/get-font-styles-and-weights.mjs.map +3 -3
- package/build-module/utils/get-px-from-css-unit.mjs +1 -1
- package/build-module/utils/get-px-from-css-unit.mjs.map +1 -1
- package/build-module/utils/index.mjs +1 -1
- package/build-module/utils/index.mjs.map +1 -1
- package/build-module/utils/math.mjs +1 -1
- package/build-module/utils/math.mjs.map +3 -3
- package/build-module/utils/object.mjs +8 -8
- package/build-module/utils/object.mjs.map +3 -3
- package/build-module/utils/order-inserter-block-items.mjs +1 -1
- package/build-module/utils/order-inserter-block-items.mjs.map +3 -3
- package/build-module/utils/pasting.mjs +4 -2
- package/build-module/utils/pasting.mjs.map +3 -3
- package/build-module/utils/selection.mjs +3 -2
- package/build-module/utils/selection.mjs.map +3 -3
- package/build-module/utils/sorting.mjs +9 -3
- package/build-module/utils/sorting.mjs.map +3 -3
- package/build-module/utils/transform-styles/index.mjs +3 -2
- package/build-module/utils/transform-styles/index.mjs.map +3 -3
- package/build-module/utils/transform-styles/postcss-urlrebase.d.mjs +1 -0
- package/build-module/utils/transform-styles/postcss-urlrebase.d.mjs.map +7 -0
- package/build-module/utils/transform-styles/types.mjs +1 -0
- package/build-module/utils/transform-styles/types.mjs.map +7 -0
- package/build-module/utils/types.mjs +1 -0
- package/build-module/utils/types.mjs.map +7 -0
- package/build-style/content-rtl.css +2 -0
- package/build-style/content.css +2 -0
- package/build-style/style-rtl.css +34 -41
- package/build-style/style.css +34 -41
- package/build-types/utils/block-bindings.d.ts +27 -0
- package/build-types/utils/block-bindings.d.ts.map +1 -0
- package/build-types/utils/color-values.d.ts +40 -0
- package/build-types/utils/color-values.d.ts.map +1 -0
- package/build-types/utils/dom.d.ts +19 -19
- package/build-types/utils/dom.d.ts.map +1 -1
- package/build-types/utils/fit-text-frontend.d.ts +7 -0
- package/build-types/utils/fit-text-frontend.d.ts.map +1 -0
- package/build-types/utils/fit-text-utils.d.ts +15 -0
- package/build-types/utils/fit-text-utils.d.ts.map +1 -0
- package/build-types/utils/format-font-style.d.ts +12 -0
- package/build-types/utils/format-font-style.d.ts.map +1 -0
- package/build-types/utils/format-font-weight.d.ts +12 -0
- package/build-types/utils/format-font-weight.d.ts.map +1 -0
- package/build-types/utils/get-editor-region.d.ts +9 -0
- package/build-types/utils/get-editor-region.d.ts.map +1 -0
- package/build-types/utils/get-font-styles-and-weights.d.ts +16 -0
- package/build-types/utils/get-font-styles-and-weights.d.ts.map +1 -0
- package/build-types/utils/get-px-from-css-unit.d.ts +10 -0
- package/build-types/utils/get-px-from-css-unit.d.ts.map +1 -0
- package/build-types/utils/index.d.ts +3 -0
- package/build-types/utils/index.d.ts.map +1 -0
- package/build-types/utils/math.d.ts +61 -0
- package/build-types/utils/math.d.ts.map +1 -0
- package/build-types/utils/object.d.ts +39 -0
- package/build-types/utils/object.d.ts.map +1 -0
- package/build-types/utils/order-inserter-block-items.d.ts +13 -0
- package/build-types/utils/order-inserter-block-items.d.ts.map +1 -0
- package/build-types/utils/pasting.d.ts +28 -0
- package/build-types/utils/pasting.d.ts.map +1 -0
- package/build-types/utils/selection.d.ts +21 -0
- package/build-types/utils/selection.d.ts.map +1 -0
- package/build-types/utils/sorting.d.ts +17 -0
- package/build-types/utils/sorting.d.ts.map +1 -0
- package/build-types/utils/transform-styles/index.d.ts +15 -0
- package/build-types/utils/transform-styles/index.d.ts.map +1 -0
- package/build-types/utils/transform-styles/types.d.ts +13 -0
- package/build-types/utils/transform-styles/types.d.ts.map +1 -0
- package/build-types/utils/types.d.ts +28 -0
- package/build-types/utils/types.d.ts.map +1 -0
- package/package.json +46 -40
- package/src/components/alignment-control/test/__snapshots__/index.js.snap +6 -0
- package/src/components/block-alignment-control/test/__snapshots__/index.js.snap +5 -0
- package/src/components/block-card/index.js +7 -13
- package/src/components/block-editing-mode/index.js +17 -9
- package/src/components/block-icon/test/__snapshots__/index.js.snap +1 -0
- package/src/components/block-inspector/index.js +22 -20
- package/src/components/block-patterns-list/index.js +0 -1
- package/src/components/block-quick-navigation/index.js +7 -7
- package/src/components/block-rename/modal.js +0 -1
- package/src/components/block-toolbar/block-toolbar-icon.js +22 -6
- package/src/components/block-toolbar/test/block-toolbar-icon.js +99 -0
- package/src/components/block-tools/use-block-toolbar-popover-props.js +10 -4
- package/src/components/block-vertical-alignment-control/test/__snapshots__/index.js.snap +4 -0
- package/src/components/child-layout-control/index.js +65 -20
- package/src/components/child-layout-control/test/index.js +64 -0
- package/src/components/colors-gradients/control.js +29 -12
- package/src/components/colors-gradients/dropdown.js +4 -1
- package/src/components/colors-gradients/style.scss +39 -2
- package/src/components/contrast-checker/README.md +9 -0
- package/src/components/contrast-checker/index.js +42 -3
- package/src/components/date-format-picker/index.js +0 -1
- package/src/components/default-block-appender/content.scss +3 -0
- package/src/components/dimensions-tool/index.js +4 -9
- package/src/components/dimensions-tool/scale-tool.js +1 -2
- package/src/components/dimensions-tool/test/index.js +89 -11
- package/src/components/global-styles/background-panel.js +201 -34
- package/src/components/global-styles/color-gradient-dropdown-item.js +258 -0
- package/src/components/global-styles/color-panel.js +125 -487
- package/src/components/global-styles/dimensions-panel.js +1 -5
- package/src/components/global-styles/hooks.js +45 -0
- package/src/components/global-styles/shadow-panel-components.js +0 -1
- package/src/components/global-styles/test/background-panel.js +56 -0
- package/src/components/global-styles/test/color-panel.js +172 -118
- package/src/components/global-styles/test/typography-panel.js +167 -0
- package/src/components/global-styles/typography-panel.js +100 -11
- package/src/components/iframe/index.js +8 -3
- package/src/components/inserter/media-tab/media-preview.js +0 -1
- package/src/components/inspector-controls/README.md +0 -2
- package/src/components/inspector-controls/fill.js +6 -8
- package/src/components/inspector-controls/groups.js +2 -0
- package/src/components/inspector-controls-tabs/index.js +0 -1
- package/src/components/inspector-controls-tabs/styles-tab.js +78 -28
- package/src/components/link-control/index.js +0 -1
- package/src/components/link-control/test/index.js +2 -3
- package/src/components/list-view/block-select-button.js +2 -18
- package/src/components/preset-input-control/custom-value-controls.js +0 -1
- package/src/components/provider/use-block-sync.js +3 -1
- package/src/components/rich-text/content.scss +2 -0
- package/src/components/url-popover/image-url-input-ui.js +0 -2
- package/src/components/use-block-display-information/index.js +15 -2
- package/src/components/use-block-display-information/test/index.js +140 -0
- package/src/hooks/anchor.js +0 -1
- package/src/hooks/background.js +210 -133
- package/src/hooks/background.scss +0 -35
- package/src/hooks/block-fields/index.js +27 -2
- package/src/hooks/color.js +2 -205
- package/src/hooks/color.scss +3 -9
- package/src/hooks/contrast-checker.js +60 -17
- package/src/hooks/custom-class-name.js +0 -1
- package/src/hooks/dimensions.js +14 -3
- package/src/hooks/elements.js +140 -0
- package/src/hooks/elements.scss +8 -0
- package/src/hooks/grid-visualizer.js +59 -45
- package/src/hooks/layout-child.js +92 -14
- package/src/hooks/layout.js +6 -3
- package/src/hooks/list-view.js +10 -11
- package/src/hooks/states.js +2 -2
- package/src/hooks/style.js +91 -9
- package/src/hooks/test/background.js +59 -0
- package/src/hooks/test/block-style-state.js +14 -14
- package/src/hooks/test/dimensions.js +71 -0
- package/src/hooks/test/layout-child.js +165 -0
- package/src/hooks/test/layout.js +6 -6
- package/src/hooks/test/style.js +133 -11
- package/src/hooks/typography.js +70 -6
- package/src/layouts/flex.js +118 -15
- package/src/private-apis.js +8 -0
- package/src/store/private-selectors.js +47 -0
- package/src/store/test/private-selectors.js +166 -7
- package/src/store/test/reducer.js +61 -10
- package/src/style.scss +1 -0
- package/src/utils/block-bindings.ts +51 -0
- package/src/utils/color-values.ts +63 -0
- package/src/utils/{dom.js → dom.ts} +27 -27
- package/src/utils/{fit-text-frontend.js → fit-text-frontend.ts} +12 -4
- package/src/utils/{fit-text-utils.js → fit-text-utils.ts} +15 -7
- package/src/utils/{format-font-style.js → format-font-style.ts} +10 -3
- package/src/utils/{format-font-weight.js → format-font-weight.ts} +10 -3
- package/src/utils/{get-editor-region.js → get-editor-region.ts} +10 -6
- package/src/utils/{get-font-styles-and-weights.js → get-font-styles-and-weights.ts} +21 -17
- package/src/utils/{math.js → math.ts} +37 -30
- package/src/utils/object.ts +89 -0
- package/src/utils/{order-inserter-block-items.js → order-inserter-block-items.ts} +8 -5
- package/src/utils/{pasting.js → pasting.ts} +18 -11
- package/src/utils/{selection.js → selection.ts} +11 -4
- package/src/utils/sorting.ts +81 -0
- package/src/utils/test/color-values.js +44 -1
- package/src/utils/transform-styles/{index.js → index.ts} +25 -25
- package/src/utils/transform-styles/postcss-urlrebase.d.ts +15 -0
- package/src/utils/transform-styles/types.ts +13 -0
- package/src/utils/types.ts +29 -0
- package/src/utils/block-bindings.js +0 -46
- package/src/utils/color-values.js +0 -28
- package/src/utils/object.js +0 -67
- package/src/utils/sorting.js +0 -54
- /package/src/utils/{get-px-from-css-unit.js → get-px-from-css-unit.ts} +0 -0
- /package/src/utils/{index.js → index.ts} +0 -0
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/hooks/background.js"],
|
|
4
|
-
"sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { getBlockSupport } from '@wordpress/blocks';\nimport { useSelect } from '@wordpress/data';\nimport { useCallback } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport InspectorControls from '../components/inspector-controls';\nimport { cleanEmptyObject } from './utils';\nimport { store as blockEditorStore } from '../store';\nimport {\n\tdefault as StylesBackgroundPanel,\n\tuseHasBackgroundPanel,\n\thasBackgroundImageValue,\n\thasBackgroundGradientValue,\n} from '../components/global-styles/background-panel';\nimport { globalStylesDataKey } from '../store/private-keys';\nimport {\n\tgetStyleForState,\n\tisDefaultBlockStyleState,\n\tsetStyleForState,\n\tuseBlockStyleState,\n} from './block-style-state';\n\nexport const BACKGROUND_SUPPORT_KEY = 'background';\n\n// Initial control values.\nexport const BACKGROUND_BLOCK_DEFAULT_VALUES = {\n\tbackgroundSize: 'cover',\n\tbackgroundPosition: '50% 50%', // used only when backgroundSize is 'contain'.\n};\n\n/**\n * Determine whether there is block support for background.\n *\n * @param {string} blockName Block name.\n * @param {string} feature Background image feature to check for.\n *\n * @return {boolean} Whether there is support.\n */\nexport function hasBackgroundSupport( blockName, feature = 'any' ) {\n\tconst support = getBlockSupport( blockName, BACKGROUND_SUPPORT_KEY );\n\n\tif ( support === true ) {\n\t\treturn true;\n\t}\n\n\tif ( feature === 'any' ) {\n\t\treturn (\n\t\t\t!! support?.backgroundImage ||\n\t\t\t!! support?.backgroundSize ||\n\t\t\t!! support?.backgroundRepeat ||\n\t\t\t!! support?.gradient\n\t\t);\n\t}\n\n\treturn !! support?.[ feature ];\n}\n\nexport function setBackgroundStyleDefaults( backgroundStyle ) {\n\tif ( ! backgroundStyle || ! backgroundStyle?.backgroundImage?.url ) {\n\t\treturn;\n\t}\n\n\tlet backgroundStylesWithDefaults;\n\n\t// Set block background defaults.\n\tif ( ! backgroundStyle?.backgroundSize ) {\n\t\tbackgroundStylesWithDefaults = {\n\t\t\tbackgroundSize: BACKGROUND_BLOCK_DEFAULT_VALUES.backgroundSize,\n\t\t};\n\t}\n\n\tif (\n\t\t'contain' === backgroundStyle?.backgroundSize &&\n\t\t! backgroundStyle?.backgroundPosition\n\t) {\n\t\tbackgroundStylesWithDefaults = {\n\t\t\tbackgroundPosition:\n\t\t\t\tBACKGROUND_BLOCK_DEFAULT_VALUES.backgroundPosition,\n\t\t};\n\t}\n\treturn backgroundStylesWithDefaults;\n}\n\nfunction useBlockProps( { name, style } ) {\n\tif (\n\t\t! hasBackgroundSupport( name ) ||\n\t\t! style?.background?.backgroundImage\n\t) {\n\t\treturn;\n\t}\n\n\tconst backgroundStyles = setBackgroundStyleDefaults( style?.background );\n\n\tif ( ! backgroundStyles ) {\n\t\treturn;\n\t}\n\n\treturn {\n\t\tstyle: {\n\t\t\t...backgroundStyles,\n\t\t},\n\t};\n}\n\n/**\n * Generates a CSS class name if an background image is set.\n *\n * @param {Object} style A block's style attribute.\n *\n * @return {string} CSS class name.\n */\nexport function getBackgroundImageClasses( style ) {\n\treturn hasBackgroundImageValue( style ) ||\n\t\thasBackgroundGradientValue( style )\n\t\t? 'has-background'\n\t\t: '';\n}\n\nfunction BackgroundInspectorControl( {\n\tchildren,\n\tbackgroundGradientSupported = false,\n} ) {\n\tconst resetAllFilter = useCallback(\n\t\t( attributes ) => {\n\t\t\tconst updatedClassName = attributes.className?.includes(\n\t\t\t\t'has-background'\n\t\t\t)\n\t\t\t\t? attributes.className\n\t\t\t\t\t\t.split( ' ' )\n\t\t\t\t\t\t.filter( ( c ) => c !== 'has-background' )\n\t\t\t\t\t\t.join( ' ' ) || undefined\n\t\t\t\t: attributes.className;\n\t\t\treturn {\n\t\t\t\t...attributes,\n\t\t\t\tclassName: updatedClassName,\n\t\t\t\tstyle: cleanEmptyObject( {\n\t\t\t\t\t...attributes.style,\n\t\t\t\t\tbackground: undefined,\n\t\t\t\t\tcolor: backgroundGradientSupported\n\t\t\t\t\t\t? {\n\t\t\t\t\t\t\t\t...attributes.style?.color,\n\t\t\t\t\t\t\t\tgradient: undefined,\n\t\t\t\t\t\t }\n\t\t\t\t\t\t: attributes.style?.color,\n\t\t\t\t} ),\n\t\t\t};\n\t\t},\n\t\t[ backgroundGradientSupported ]\n\t);\n\treturn (\n\t\t<InspectorControls group=\"background\" resetAllFilter={ resetAllFilter }>\n\t\t\t{ children }\n\t\t</InspectorControls>\n\t);\n}\n\nexport function BackgroundImagePanel( {\n\tclientId,\n\tname,\n\tsetAttributes,\n\tsettings,\n} ) {\n\tconst selectedState = useBlockStyleState();\n\tconst { style, className, inheritedValue } = useSelect(\n\t\t( select ) => {\n\t\t\tconst { getBlockAttributes, getSettings } =\n\t\t\t\tselect( blockEditorStore );\n\t\t\tconst _settings = getSettings();\n\t\t\tconst blockAttributes = getBlockAttributes( clientId );\n\t\t\treturn {\n\t\t\t\tstyle: blockAttributes?.style,\n\t\t\t\tclassName: blockAttributes?.className,\n\t\t\t\t/*\n\t\t\t\t * To ensure we pass down the right inherited values:\n\t\t\t\t * @TODO 1. Pass inherited value down to all block style controls,\n\t\t\t\t * See: packages/block-editor/src/hooks/style.js\n\t\t\t\t * @TODO 2. Add support for block style variations,\n\t\t\t\t * See implementation: packages/block-editor/src/hooks/block-style-variation.js\n\t\t\t\t */\n\t\t\t\tinheritedValue:\n\t\t\t\t\t_settings[ globalStylesDataKey ]?.blocks?.[ name ],\n\t\t\t};\n\t\t},\n\t\t[ clientId, name ]\n\t);\n\n\tconst backgroundGradientSupported = hasBackgroundSupport(\n\t\tname,\n\t\t'gradient'\n\t);\n\n\t// Must be declared before the early return to follow Rules of Hooks.\n\t// Passes backgroundGradientSupported so that \"Reset All\" also clears\n\t// the legacy color.gradient value when background.gradient is supported.\n\tconst as = useCallback(\n\t\t( { children } ) => (\n\t\t\t<BackgroundInspectorControl\n\t\t\t\tbackgroundGradientSupported={ backgroundGradientSupported }\n\t\t\t>\n\t\t\t\t{ children }\n\t\t\t</BackgroundInspectorControl>\n\t\t),\n\t\t[ backgroundGradientSupported ]\n\t);\n\n\tif (\n\t\t! useHasBackgroundPanel( settings ) ||\n\t\t! hasBackgroundSupport( name )\n\t) {\n\t\treturn null;\n\t}\n\n\tconst isStateSelected = ! isDefaultBlockStyleState( selectedState );\n\n\tconst onChange = isStateSelected\n\t\t? ( newStyle ) => {\n\t\t\t\tsetAttributes( {\n\t\t\t\t\tstyle: setStyleForState( style, selectedState, newStyle ),\n\t\t\t\t} );\n\t\t }\n\t\t: ( newStyle ) => {\n\t\t\t\tconst isMigrating =\n\t\t\t\t\tbackgroundGradientSupported && !! style?.color?.gradient;\n\t\t\t\tconst newAttributes = {\n\t\t\t\t\tstyle: cleanEmptyObject(\n\t\t\t\t\t\tbackgroundGradientSupported\n\t\t\t\t\t\t\t? {\n\t\t\t\t\t\t\t\t\t...newStyle,\n\t\t\t\t\t\t\t\t\tcolor: {\n\t\t\t\t\t\t\t\t\t\t...newStyle?.color,\n\t\t\t\t\t\t\t\t\t\tgradient: undefined,\n\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t }\n\t\t\t\t\t\t\t: newStyle\n\t\t\t\t\t),\n\t\t\t\t};\n\n\t\t\t\t// When migrating from color.gradient to background.gradient, preserve\n\t\t\t\t// the has-background class so existing styles relying on it (e.g.\n\t\t\t\t// theme padding) are not silently broken. Only add the class when a\n\t\t\t\t// gradient value is being set \u2014 not when it is being cleared/reset.\n\t\t\t\t// Conversely, if the gradient is cleared and has-background was added\n\t\t\t\t// during a previous migration, remove it so it does not linger.\n\t\t\t\tif ( isMigrating && !! newStyle?.background?.gradient ) {\n\t\t\t\t\tnewAttributes.className = clsx(\n\t\t\t\t\t\tclassName,\n\t\t\t\t\t\t'has-background'\n\t\t\t\t\t);\n\t\t\t\t} else if (\n\t\t\t\t\t! newStyle?.background?.gradient &&\n\t\t\t\t\tclassName?.includes( 'has-background' )\n\t\t\t\t) {\n\t\t\t\t\tnewAttributes.className =\n\t\t\t\t\t\tclassName\n\t\t\t\t\t\t\t.split( ' ' )\n\t\t\t\t\t\t\t.filter( ( c ) => c !== 'has-background' )\n\t\t\t\t\t\t\t.join( ' ' ) || undefined;\n\t\t\t\t}\n\n\t\t\t\tsetAttributes( newAttributes );\n\t\t };\n\n\t// When background.gradient is supported but not yet explicitly set, fall\n\t// back to color.gradient for display. Any write from this panel migrates\n\t// the value to background.gradient and clears color.gradient atomically.\n\tconst styleValue =\n\t\tbackgroundGradientSupported &&\n\t\t! style?.background?.gradient &&\n\t\tstyle?.color?.gradient\n\t\t\t? {\n\t\t\t\t\t...style,\n\t\t\t\t\tbackground: {\n\t\t\t\t\t\t...style?.background,\n\t\t\t\t\t\tgradient: style?.color?.gradient,\n\t\t\t\t\t},\n\t\t\t }\n\t\t\t: style;\n\n\tconst updatedSettings = {\n\t\t...settings,\n\t\tbackground: {\n\t\t\t...settings.background,\n\t\t\tbackgroundSize:\n\t\t\t\tsettings?.background?.backgroundSize &&\n\t\t\t\thasBackgroundSupport( name, 'backgroundSize' ),\n\t\t},\n\t};\n\n\tconst defaultControls = getBlockSupport( name, [\n\t\tBACKGROUND_SUPPORT_KEY,\n\t\t'__experimentalDefaultControls',\n\t] );\n\n\treturn (\n\t\t<StylesBackgroundPanel\n\t\t\tinheritedValue={ inheritedValue }\n\t\t\tas={ as }\n\t\t\tpanelId={ clientId }\n\t\t\tdefaultValues={ BACKGROUND_BLOCK_DEFAULT_VALUES }\n\t\t\tsettings={ updatedSettings }\n\t\t\tonChange={ onChange }\n\t\t\tdefaultControls={ defaultControls }\n\t\t\tvalue={\n\t\t\t\tisStateSelected\n\t\t\t\t\t? getStyleForState( style, selectedState )\n\t\t\t\t\t: styleValue\n\t\t\t}\n\t\t/>\n\t);\n}\n\nexport default {\n\tuseBlockProps,\n\tattributeKeys: [ 'style' ],\n\thasSupport: hasBackgroundSupport,\n};\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,kBAAiB;AAKjB,oBAAgC;AAChC,kBAA0B;AAC1B,
|
|
6
|
-
"names": ["InspectorControls", "blockEditorStore", "clsx", "StylesBackgroundPanel"]
|
|
4
|
+
"sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { getBlockSupport } from '@wordpress/blocks';\nimport { useSelect } from '@wordpress/data';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport InspectorControls from '../components/inspector-controls';\nimport { cleanEmptyObject } from './utils';\nimport { extractPresetSlug } from '../utils/color-values';\nimport { store as blockEditorStore } from '../store';\nimport useBlockColorContrastWarning from './contrast-checker';\nimport {\n\tdefault as StylesBackgroundPanel,\n\tuseHasBackgroundPanel,\n\thasBackgroundImageValue,\n\thasBackgroundGradientValue,\n} from '../components/global-styles/background-panel';\nimport { globalStylesDataKey } from '../store/private-keys';\nimport {\n\tgetStyleForState,\n\tisDefaultBlockStyleState,\n\tsetStyleForState,\n\tuseBlockStyleState,\n} from './block-style-state';\n\nexport const BACKGROUND_SUPPORT_KEY = 'background';\n\n// Initial control values.\nexport const BACKGROUND_BLOCK_DEFAULT_VALUES = {\n\tbackgroundSize: 'cover',\n\tbackgroundPosition: '50% 50%', // used only when backgroundSize is 'contain'.\n};\n\n/**\n * Determine whether there is block support for background.\n *\n * @param {string} blockName Block name.\n * @param {string} feature Background image feature to check for.\n *\n * @return {boolean} Whether there is support.\n */\nexport function hasBackgroundSupport( blockName, feature = 'any' ) {\n\tconst support = getBlockSupport( blockName, BACKGROUND_SUPPORT_KEY );\n\n\tif ( support === true ) {\n\t\treturn true;\n\t}\n\n\tif ( feature === 'any' ) {\n\t\treturn (\n\t\t\t!! support?.backgroundImage ||\n\t\t\t!! support?.backgroundSize ||\n\t\t\t!! support?.backgroundRepeat ||\n\t\t\t!! support?.gradient\n\t\t);\n\t}\n\n\treturn !! support?.[ feature ];\n}\n\nexport function setBackgroundStyleDefaults( backgroundStyle ) {\n\tif ( ! backgroundStyle || ! backgroundStyle?.backgroundImage?.url ) {\n\t\treturn;\n\t}\n\n\tlet backgroundStylesWithDefaults;\n\n\t// Set block background defaults.\n\tif ( ! backgroundStyle?.backgroundSize ) {\n\t\tbackgroundStylesWithDefaults = {\n\t\t\tbackgroundSize: BACKGROUND_BLOCK_DEFAULT_VALUES.backgroundSize,\n\t\t};\n\t}\n\n\tif (\n\t\t'contain' === backgroundStyle?.backgroundSize &&\n\t\t! backgroundStyle?.backgroundPosition\n\t) {\n\t\tbackgroundStylesWithDefaults = {\n\t\t\tbackgroundPosition:\n\t\t\t\tBACKGROUND_BLOCK_DEFAULT_VALUES.backgroundPosition,\n\t\t};\n\t}\n\treturn backgroundStylesWithDefaults;\n}\n\nfunction useBlockProps( { name, style } ) {\n\tif (\n\t\t! hasBackgroundSupport( name ) ||\n\t\t! style?.background?.backgroundImage\n\t) {\n\t\treturn;\n\t}\n\n\tconst backgroundStyles = setBackgroundStyleDefaults( style?.background );\n\n\tif ( ! backgroundStyles ) {\n\t\treturn;\n\t}\n\n\treturn {\n\t\tstyle: {\n\t\t\t...backgroundStyles,\n\t\t},\n\t};\n}\n\n/**\n * Generates a CSS class name if an background image is set.\n *\n * @param {Object} style A block's style attribute.\n *\n * @return {string} CSS class name.\n */\nexport function getBackgroundImageClasses( style ) {\n\treturn hasBackgroundImageValue( style ) ||\n\t\thasBackgroundGradientValue( style )\n\t\t? 'has-background'\n\t\t: '';\n}\n\n// Clears every control the Background panel owns: the background image,\n// background color, and the gradient. The Background panel owns the gradient\n// control for both the newer `background.gradient` support and the legacy\n// `color.gradient` path, so \"Reset all\" clears the legacy value too,\n// regardless of which path stored it.\nexport function backgroundResetAllFilter( attributes ) {\n\tconst updatedClassName = attributes.className?.includes( 'has-background' )\n\t\t? attributes.className\n\t\t\t\t.split( ' ' )\n\t\t\t\t.filter( ( c ) => c !== 'has-background' )\n\t\t\t\t.join( ' ' ) || undefined\n\t\t: attributes.className;\n\treturn {\n\t\t...attributes,\n\t\tclassName: updatedClassName,\n\t\tbackgroundColor: undefined,\n\t\tgradient: undefined,\n\t\tstyle: cleanEmptyObject( {\n\t\t\t...attributes.style,\n\t\t\tbackground: undefined,\n\t\t\tcolor: {\n\t\t\t\t...attributes.style?.color,\n\t\t\t\tbackground: undefined,\n\t\t\t\tgradient: undefined,\n\t\t\t},\n\t\t} ),\n\t};\n}\n\nfunction BackgroundInspectorControl( { children } ) {\n\treturn (\n\t\t<InspectorControls\n\t\t\tgroup=\"background\"\n\t\t\tresetAllFilter={ backgroundResetAllFilter }\n\t\t>\n\t\t\t{ children }\n\t\t</InspectorControls>\n\t);\n}\n\nexport function BackgroundImagePanel( {\n\tclientId,\n\tname,\n\tsetAttributes,\n\tsettings,\n\t// Allows rendering outside the `background` inspector group (e.g. section\n\t// blocks direct-render this panel because their support fills are gated\n\t// off by editing mode). Defaults to the slot-based wrapper.\n\tasWrapper,\n} ) {\n\tconst selectedState = useBlockStyleState();\n\tconst { style, className, backgroundColor, gradient, inheritedValue } =\n\t\tuseSelect(\n\t\t\t( select ) => {\n\t\t\t\tconst { getBlockAttributes, getSettings } =\n\t\t\t\t\tselect( blockEditorStore );\n\t\t\t\tconst _settings = getSettings();\n\t\t\t\tconst blockAttributes = getBlockAttributes( clientId );\n\t\t\t\treturn {\n\t\t\t\t\tstyle: blockAttributes?.style,\n\t\t\t\t\tclassName: blockAttributes?.className,\n\t\t\t\t\tbackgroundColor: blockAttributes?.backgroundColor,\n\t\t\t\t\tgradient: blockAttributes?.gradient,\n\t\t\t\t\tinheritedValue:\n\t\t\t\t\t\t_settings[ globalStylesDataKey ]?.blocks?.[ name ],\n\t\t\t\t};\n\t\t\t},\n\t\t\t[ clientId, name ]\n\t\t);\n\n\tconst backgroundGradientSupported = hasBackgroundSupport(\n\t\tname,\n\t\t'gradient'\n\t);\n\n\tconst colorSupport = getBlockSupport( name, 'color' );\n\tconst hasColorBackgroundSupport =\n\t\tcolorSupport && colorSupport.background !== false;\n\tconst hasColorGradientSupport = !! colorSupport?.gradients;\n\n\tconst isStateSelected = ! isDefaultBlockStyleState( selectedState );\n\n\t// Fold the backgroundColor / gradient attribute slugs back into the style\n\t// object the panel consumes. When background.gradient is supported but not\n\t// yet explicitly set, fall back to color.gradient for display.\n\tconst styleValue = {\n\t\t...style,\n\t\tcolor: {\n\t\t\t...style?.color,\n\t\t\tbackground: backgroundColor\n\t\t\t\t? 'var:preset|color|' + backgroundColor\n\t\t\t\t: style?.color?.background,\n\t\t\tgradient:\n\t\t\t\t! backgroundGradientSupported && gradient\n\t\t\t\t\t? 'var:preset|gradient|' + gradient\n\t\t\t\t\t: style?.color?.gradient,\n\t\t},\n\t\t...( backgroundGradientSupported && {\n\t\t\tbackground: {\n\t\t\t\t...style?.background,\n\t\t\t\tgradient: gradient\n\t\t\t\t\t? 'var:preset|gradient|' + gradient\n\t\t\t\t\t: style?.background?.gradient ?? style?.color?.gradient,\n\t\t\t},\n\t\t} ),\n\t};\n\n\t// Skipped for gradients, which can't be reliably evaluated for contrast.\n\tconst enableContrastChecking =\n\t\t! isStateSelected &&\n\t\t! styleValue?.color?.gradient &&\n\t\t! styleValue?.background?.gradient &&\n\t\t!! styleValue?.color?.background &&\n\t\t( settings?.color?.text || settings?.color?.link ) &&\n\t\tfalse !== getBlockSupport( name, [ 'color', 'enableContrastChecker' ] );\n\n\tconst contrastWarning = useBlockColorContrastWarning( {\n\t\tclientId,\n\t\tname,\n\t\tenabled: !! enableContrastChecking,\n\t\tmessageOverride: __(\n\t\t\t'This color combination has poor contrast. Consider increasing contrast between background and foreground.'\n\t\t),\n\t} );\n\n\tif (\n\t\t! useHasBackgroundPanel( settings ) ||\n\t\t( ! hasBackgroundSupport( name ) &&\n\t\t\t! hasColorBackgroundSupport &&\n\t\t\t! hasColorGradientSupport )\n\t) {\n\t\treturn null;\n\t}\n\n\tconst onChange = ( newStyle ) => {\n\t\tif ( isStateSelected ) {\n\t\t\tsetAttributes( {\n\t\t\t\tstyle: setStyleForState( style, selectedState, newStyle ),\n\t\t\t} );\n\t\t\treturn;\n\t\t}\n\n\t\t// Extract background color slug from style.color.background.\n\t\tconst newBackgroundColorValue = newStyle?.color?.background;\n\t\tconst newBackgroundColorSlug = extractPresetSlug(\n\t\t\tnewBackgroundColorValue,\n\t\t\t'color'\n\t\t);\n\n\t\t// Extract gradient slug — prefer the new background.gradient path\n\t\t// when backgroundGradientSupported, fall back to color.gradient.\n\t\tconst newGradientValue = backgroundGradientSupported\n\t\t\t? newStyle?.background?.gradient\n\t\t\t: newStyle?.color?.gradient;\n\t\tconst newGradientSlug = extractPresetSlug(\n\t\t\tnewGradientValue,\n\t\t\t'gradient'\n\t\t);\n\t\tconst cleanedColorGradient = newGradientSlug\n\t\t\t? undefined\n\t\t\t: newStyle?.color?.gradient;\n\n\t\t// Drop slug-resolved values so they aren't persisted inline alongside\n\t\t// the attribute slugs.\n\t\tconst cleanedStyle = {\n\t\t\t...newStyle,\n\t\t\tcolor: {\n\t\t\t\t...newStyle?.color,\n\t\t\t\tbackground: newBackgroundColorSlug\n\t\t\t\t\t? undefined\n\t\t\t\t\t: newBackgroundColorValue,\n\t\t\t\tgradient: backgroundGradientSupported\n\t\t\t\t\t? undefined\n\t\t\t\t\t: cleanedColorGradient,\n\t\t\t},\n\t\t};\n\t\tif ( backgroundGradientSupported ) {\n\t\t\t// Background gradients are kept whole in `style.background.gradient`\n\t\t\t// rather than extracted to the legacy `gradient` attribute.\n\t\t\tcleanedStyle.background = {\n\t\t\t\t...cleanedStyle.background,\n\t\t\t\tgradient: newStyle?.background?.gradient,\n\t\t\t};\n\t\t}\n\n\t\tconst isMigrating =\n\t\t\tbackgroundGradientSupported && !! style?.color?.gradient;\n\t\tconst newAttributes = {\n\t\t\tstyle: cleanEmptyObject( cleanedStyle ),\n\t\t\tbackgroundColor: newBackgroundColorSlug,\n\t\t\t// The legacy `gradient` attribute is only used when the block does\n\t\t\t// not support `background.gradient`; otherwise the gradient is\n\t\t\t// stored in `style.background.gradient` above.\n\t\t\tgradient: backgroundGradientSupported ? undefined : newGradientSlug,\n\t\t};\n\n\t\t// When migrating from color.gradient to background.gradient, preserve\n\t\t// the has-background class so existing styles relying on it (e.g.\n\t\t// theme padding) are not silently broken. Only add the class when a\n\t\t// gradient value is being set — not when it is being cleared/reset.\n\t\t// Conversely, if the gradient is cleared and has-background was added\n\t\t// during a previous migration, remove it so it does not linger.\n\t\tconst hasNewGradient = !! newGradientSlug || !! newGradientValue;\n\t\tif ( isMigrating && hasNewGradient ) {\n\t\t\tnewAttributes.className = clsx( className, 'has-background' );\n\t\t} else if (\n\t\t\t! hasNewGradient &&\n\t\t\tclassName?.includes( 'has-background' )\n\t\t) {\n\t\t\tnewAttributes.className =\n\t\t\t\tclassName\n\t\t\t\t\t.split( ' ' )\n\t\t\t\t\t.filter( ( c ) => c !== 'has-background' )\n\t\t\t\t\t.join( ' ' ) || undefined;\n\t\t}\n\n\t\tsetAttributes( newAttributes );\n\t};\n\n\tconst updatedSettings = {\n\t\t...settings,\n\t\tbackground: {\n\t\t\t...settings.background,\n\t\t\tbackgroundSize:\n\t\t\t\tsettings?.background?.backgroundSize &&\n\t\t\t\thasBackgroundSupport( name, 'backgroundSize' ),\n\t\t},\n\t};\n\n\tconst backgroundDefaultControls = getBlockSupport( name, [\n\t\tBACKGROUND_SUPPORT_KEY,\n\t\t'__experimentalDefaultControls',\n\t] );\n\tconst colorDefaultControls = getBlockSupport( name, [\n\t\t'color',\n\t\t'__experimentalDefaultControls',\n\t] );\n\tconst defaultControls = {\n\t\t...backgroundDefaultControls,\n\t\tbackgroundColor: colorDefaultControls?.background,\n\t\t// Mirror the old combined control: show the gradient item by default\n\t\t// when background color was shown by default.\n\t\tgradient:\n\t\t\tbackgroundDefaultControls?.gradient ??\n\t\t\tcolorDefaultControls?.background,\n\t};\n\n\tconst Wrapper = asWrapper || BackgroundInspectorControl;\n\n\treturn (\n\t\t<StylesBackgroundPanel\n\t\t\tinheritedValue={ inheritedValue }\n\t\t\tas={ Wrapper }\n\t\t\tpanelId={ clientId }\n\t\t\tdefaultValues={ BACKGROUND_BLOCK_DEFAULT_VALUES }\n\t\t\tsettings={ updatedSettings }\n\t\t\tonChange={ onChange }\n\t\t\tdefaultControls={ defaultControls }\n\t\t\tvalue={\n\t\t\t\tisStateSelected\n\t\t\t\t\t? getStyleForState( style, selectedState )\n\t\t\t\t\t: styleValue\n\t\t\t}\n\t\t\tcontrastWarning={ contrastWarning }\n\t\t/>\n\t);\n}\n\nexport default {\n\tuseBlockProps,\n\tattributeKeys: [ 'style' ],\n\thasSupport: hasBackgroundSupport,\n};\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": ["InspectorControls", "blockEditorStore", "useBlockColorContrastWarning", "clsx", "StylesBackgroundPanel"]
|
|
7
7
|
}
|
|
@@ -43,6 +43,7 @@ var import_element = require("@wordpress/element");
|
|
|
43
43
|
var import_i18n = require("@wordpress/i18n");
|
|
44
44
|
var import_store = require("../../store/index.cjs");
|
|
45
45
|
var import_lock_unlock = require("../../lock-unlock.cjs");
|
|
46
|
+
var import_block_bindings = require("../../utils/block-bindings.cjs");
|
|
46
47
|
var import_block_context = __toESM(require("../../components/block-context/index.cjs"));
|
|
47
48
|
var import_block_icon = __toESM(require("../../components/block-icon/index.cjs"));
|
|
48
49
|
var import_use_block_display_title = __toESM(require("../../components/block-title/use-block-display-title.cjs"));
|
|
@@ -79,15 +80,25 @@ function BlockFields({
|
|
|
79
80
|
if (!_attributes?.metadata?.bindings) {
|
|
80
81
|
return _attributes;
|
|
81
82
|
}
|
|
83
|
+
const { __experimentalBlockBindingsSupportedAttributes } = select(import_store.store).getSettings();
|
|
84
|
+
const bindableAttributes = __experimentalBlockBindingsSupportedAttributes?.[blockType?.name];
|
|
85
|
+
const bindings = bindableAttributes ? (0, import_block_bindings.replacePatternOverridesDefaultBinding)(
|
|
86
|
+
_attributes.metadata.bindings,
|
|
87
|
+
bindableAttributes
|
|
88
|
+
) : _attributes.metadata.bindings;
|
|
82
89
|
const { getBlockBindingsSource } = (0, import_lock_unlock.unlock)(select(import_blocks.store));
|
|
83
|
-
return Object.entries(
|
|
90
|
+
return Object.entries(bindings).reduce(
|
|
84
91
|
(acc, [attribute, binding]) => {
|
|
92
|
+
if (attribute === "__default") {
|
|
93
|
+
return acc;
|
|
94
|
+
}
|
|
85
95
|
const source = getBlockBindingsSource(binding.source);
|
|
86
96
|
if (!source) {
|
|
87
97
|
return acc;
|
|
88
98
|
}
|
|
89
99
|
const values = source.getValues({
|
|
90
100
|
select,
|
|
101
|
+
clientId,
|
|
91
102
|
context: blockContext,
|
|
92
103
|
bindings: { [attribute]: binding }
|
|
93
104
|
});
|
|
@@ -96,7 +107,7 @@ function BlockFields({
|
|
|
96
107
|
_attributes
|
|
97
108
|
);
|
|
98
109
|
},
|
|
99
|
-
[blockContext, clientId]
|
|
110
|
+
[blockContext, clientId, blockType?.name]
|
|
100
111
|
);
|
|
101
112
|
const { selectBlock, toggleBlockHighlight } = (0, import_data.useDispatch)(import_store.store);
|
|
102
113
|
const debouncedToggleBlockHighlight = (0, import_compose.useDebounce)(
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/hooks/block-fields/index.js"],
|
|
4
|
-
"sourcesContent": ["import {\n\tprivateApis as blocksPrivateApis,\n\tgetBlockType,\n\tstore as blocksStore,\n} from '@wordpress/blocks';\nimport { useDebounce } from '@wordpress/compose';\nimport {\n\t__experimentalHStack as HStack,\n\t__experimentalTruncate as Truncate,\n} from '@wordpress/components';\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport { DataForm } from '@wordpress/dataviews';\nimport { useContext, useState, useMemo } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\nimport { store as blockEditorStore } from '../../store';\nimport { unlock } from '../../lock-unlock';\nimport BlockContext from '../../components/block-context';\nimport BlockIcon from '../../components/block-icon';\nimport useBlockDisplayTitle from '../../components/block-title/use-block-display-title';\nimport useBlockDisplayInformation from '../../components/use-block-display-information';\nconst { fieldsKey, formKey } = unlock( blocksPrivateApis );\nimport FieldsDropdownMenu from './fields-dropdown-menu';\nimport { PrivateBlockContext } from '../../components/block-list/private-block-context';\nimport InspectorControls from '../../components/inspector-controls/fill';\n\n// controls\nimport RichText from './rich-text';\nimport Media from './media';\nimport Link from './link';\n\n/**\n * Creates a configured control component that wraps a custom control\n * and passes configuration as props.\n *\n * @param {Component} ControlComponent The React component for the control.\n * @param {Object} config The control configuration passed as a prop.\n *\n * @return {Function} A wrapped control component\n */\nfunction createConfiguredControl( ControlComponent, config = {} ) {\n\treturn function ConfiguredControl( props ) {\n\t\treturn <ControlComponent { ...props } config={ config } />;\n\t};\n}\n\n/**\n * Component that renders a DataForm for a single block's attributes\n * @param {Object} props\n * @param {string} props.clientId The clientId of the block.\n * @param {Object} props.blockType The blockType definition.\n * @param {Function} props.setAttributes Action to set the block's attributes.\n * @param {boolean} props.isMultiBlock Whether forms for multiple blocks are shown at the same time.\n * This changes the behavior of the component:\n * - Only the first field is shown for each block.\n * - A dropdown is rendered allowing display of additional fields.\n * - Hovering the block fields highlights the block in the canvas\n * - Focusing a block field soft-selects the block in the canvas.\n */\nfunction BlockFields( {\n\tclientId,\n\tblockType,\n\tsetAttributes,\n\tisMultiBlock = false,\n} ) {\n\tconst blockTitle = useBlockDisplayTitle( {\n\t\tclientId,\n\t\tcontext: 'list-view',\n\t} );\n\tconst blockInformation = useBlockDisplayInformation( clientId );\n\n\tconst blockTypeFields = blockType?.[ fieldsKey ];\n\n\tconst blockContext = useContext( BlockContext );\n\n\tconst attributes = useSelect(\n\t\t( select ) => {\n\t\t\tconst _attributes =\n\t\t\t\tselect( blockEditorStore ).getBlockAttributes( clientId );\n\t\t\tif ( ! _attributes?.metadata?.bindings ) {\n\t\t\t\treturn _attributes;\n\t\t\t}\n\n\t\t\tconst { getBlockBindingsSource } = unlock( select( blocksStore ) );\n\t\t\treturn Object.entries(
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,oBAIO;AACP,qBAA4B;AAC5B,wBAGO;AACP,kBAAuC;AACvC,uBAAyB;AACzB,qBAA8C;AAC9C,kBAAmB;AACnB,mBAA0C;AAC1C,yBAAuB;AACvB,2BAAyB;AACzB,wBAAsB;AACtB,qCAAiC;AACjC,2CAAuC;AAEvC,kCAA+B;AAC/B,mCAAoC;AACpC,kBAA8B;AAG9B,uBAAqB;AACrB,mBAAkB;AAClB,kBAAiB;AAaR;AArBT,IAAM,EAAE,WAAW,QAAQ,QAAI,2BAAQ,cAAAA,WAAkB;AAmBzD,SAAS,wBAAyB,kBAAkB,SAAS,CAAC,GAAI;AACjE,SAAO,SAAS,kBAAmB,OAAQ;AAC1C,WAAO,4CAAC,oBAAmB,GAAG,OAAQ,QAAkB;AAAA,EACzD;AACD;AAeA,SAAS,YAAa;AAAA,EACrB;AAAA,EACA;AAAA,EACA;AAAA,EACA,eAAe;AAChB,GAAI;AACH,QAAM,iBAAa,+BAAAC,SAAsB;AAAA,IACxC;AAAA,IACA,SAAS;AAAA,EACV,CAAE;AACF,QAAM,uBAAmB,qCAAAC,SAA4B,QAAS;AAE9D,QAAM,kBAAkB,YAAa,SAAU;AAE/C,QAAM,mBAAe,2BAAY,qBAAAC,OAAa;AAE9C,QAAM,iBAAa;AAAA,IAClB,CAAE,WAAY;AACb,YAAM,cACL,OAAQ,aAAAC,KAAiB,EAAE,mBAAoB,QAAS;AACzD,UAAK,CAAE,aAAa,UAAU,UAAW;AACxC,eAAO;AAAA,MACR;
|
|
4
|
+
"sourcesContent": ["import {\n\tprivateApis as blocksPrivateApis,\n\tgetBlockType,\n\tstore as blocksStore,\n} from '@wordpress/blocks';\nimport { useDebounce } from '@wordpress/compose';\nimport {\n\t__experimentalHStack as HStack,\n\t__experimentalTruncate as Truncate,\n} from '@wordpress/components';\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport { DataForm } from '@wordpress/dataviews';\nimport { useContext, useState, useMemo } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\nimport { store as blockEditorStore } from '../../store';\nimport { unlock } from '../../lock-unlock';\nimport { replacePatternOverridesDefaultBinding } from '../../utils/block-bindings';\nimport BlockContext from '../../components/block-context';\nimport BlockIcon from '../../components/block-icon';\nimport useBlockDisplayTitle from '../../components/block-title/use-block-display-title';\nimport useBlockDisplayInformation from '../../components/use-block-display-information';\nconst { fieldsKey, formKey } = unlock( blocksPrivateApis );\nimport FieldsDropdownMenu from './fields-dropdown-menu';\nimport { PrivateBlockContext } from '../../components/block-list/private-block-context';\nimport InspectorControls from '../../components/inspector-controls/fill';\n\n// controls\nimport RichText from './rich-text';\nimport Media from './media';\nimport Link from './link';\n\n/**\n * Creates a configured control component that wraps a custom control\n * and passes configuration as props.\n *\n * @param {Component} ControlComponent The React component for the control.\n * @param {Object} config The control configuration passed as a prop.\n *\n * @return {Function} A wrapped control component\n */\nfunction createConfiguredControl( ControlComponent, config = {} ) {\n\treturn function ConfiguredControl( props ) {\n\t\treturn <ControlComponent { ...props } config={ config } />;\n\t};\n}\n\n/**\n * Component that renders a DataForm for a single block's attributes\n * @param {Object} props\n * @param {string} props.clientId The clientId of the block.\n * @param {Object} props.blockType The blockType definition.\n * @param {Function} props.setAttributes Action to set the block's attributes.\n * @param {boolean} props.isMultiBlock Whether forms for multiple blocks are shown at the same time.\n * This changes the behavior of the component:\n * - Only the first field is shown for each block.\n * - A dropdown is rendered allowing display of additional fields.\n * - Hovering the block fields highlights the block in the canvas\n * - Focusing a block field soft-selects the block in the canvas.\n */\nfunction BlockFields( {\n\tclientId,\n\tblockType,\n\tsetAttributes,\n\tisMultiBlock = false,\n} ) {\n\tconst blockTitle = useBlockDisplayTitle( {\n\t\tclientId,\n\t\tcontext: 'list-view',\n\t} );\n\tconst blockInformation = useBlockDisplayInformation( clientId );\n\n\tconst blockTypeFields = blockType?.[ fieldsKey ];\n\n\tconst blockContext = useContext( BlockContext );\n\n\tconst attributes = useSelect(\n\t\t( select ) => {\n\t\t\tconst _attributes =\n\t\t\t\tselect( blockEditorStore ).getBlockAttributes( clientId );\n\t\t\tif ( ! _attributes?.metadata?.bindings ) {\n\t\t\t\treturn _attributes;\n\t\t\t}\n\n\t\t\t/*\n\t\t\t * The pattern overrides `__default` binding is a placeholder, not\n\t\t\t * a real attribute: expand it to the block's bindable attributes\n\t\t\t * before resolving values, as other bindings consumers do.\n\t\t\t */\n\t\t\tconst { __experimentalBlockBindingsSupportedAttributes } =\n\t\t\t\tselect( blockEditorStore ).getSettings();\n\t\t\tconst bindableAttributes =\n\t\t\t\t__experimentalBlockBindingsSupportedAttributes?.[\n\t\t\t\t\tblockType?.name\n\t\t\t\t];\n\t\t\tconst bindings = bindableAttributes\n\t\t\t\t? replacePatternOverridesDefaultBinding(\n\t\t\t\t\t\t_attributes.metadata.bindings,\n\t\t\t\t\t\tbindableAttributes\n\t\t\t\t )\n\t\t\t\t: _attributes.metadata.bindings;\n\n\t\t\tconst { getBlockBindingsSource } = unlock( select( blocksStore ) );\n\t\t\treturn Object.entries( bindings ).reduce(\n\t\t\t\t( acc, [ attribute, binding ] ) => {\n\t\t\t\t\t// Skip a `__default` binding that could not be expanded:\n\t\t\t\t\t// it is not a real block attribute.\n\t\t\t\t\tif ( attribute === '__default' ) {\n\t\t\t\t\t\treturn acc;\n\t\t\t\t\t}\n\t\t\t\t\tconst source = getBlockBindingsSource( binding.source );\n\t\t\t\t\tif ( ! source ) {\n\t\t\t\t\t\treturn acc;\n\t\t\t\t\t}\n\t\t\t\t\tconst values = source.getValues( {\n\t\t\t\t\t\tselect,\n\t\t\t\t\t\tclientId,\n\t\t\t\t\t\tcontext: blockContext,\n\t\t\t\t\t\tbindings: { [ attribute ]: binding },\n\t\t\t\t\t} );\n\t\t\t\t\treturn { ...acc, ...values };\n\t\t\t\t},\n\t\t\t\t_attributes\n\t\t\t);\n\t\t},\n\t\t[ blockContext, clientId, blockType?.name ]\n\t);\n\tconst { selectBlock, toggleBlockHighlight } =\n\t\tuseDispatch( blockEditorStore );\n\n\tconst debouncedToggleBlockHighlight = useDebounce(\n\t\ttoggleBlockHighlight,\n\t\t50\n\t);\n\n\tconst computedForm = useMemo( () => {\n\t\tif ( ! isMultiBlock ) {\n\t\t\treturn blockType?.[ formKey ];\n\t\t}\n\n\t\t// For a collapsed form only show the first field by default.\n\t\treturn {\n\t\t\t...blockType?.[ formKey ],\n\t\t\tfields: [ blockType?.[ formKey ]?.fields?.[ 0 ] ],\n\t\t};\n\t}, [ blockType, isMultiBlock ] );\n\n\tconst [ form, setForm ] = useState( computedForm );\n\n\t// Build DataForm fields with proper structure\n\tconst dataFormFields = useMemo( () => {\n\t\tif ( ! blockTypeFields?.length ) {\n\t\t\treturn [];\n\t\t}\n\n\t\treturn blockTypeFields.map( ( fieldDef ) => {\n\t\t\tconst field = {\n\t\t\t\t...fieldDef,\n\t\t\t};\n\n\t\t\t// These should be custom Edit components, not replaced here.\n\t\t\t//\n\t\t\t// - rich-text control: it needs clientId\n\t\t\t// - link control: does not need anything extra\n\t\t\t// - media control: needs the Edit config\n\t\t\tif (\n\t\t\t\t'string' === typeof fieldDef.Edit &&\n\t\t\t\tfieldDef.Edit === 'rich-text'\n\t\t\t) {\n\t\t\t\tfield.Edit = createConfiguredControl( RichText, {\n\t\t\t\t\tclientId,\n\t\t\t\t} );\n\t\t\t} else if (\n\t\t\t\t'string' === typeof fieldDef.Edit &&\n\t\t\t\tfieldDef.Edit === 'link'\n\t\t\t) {\n\t\t\t\tfield.Edit = createConfiguredControl( Link );\n\t\t\t} else if (\n\t\t\t\t'object' === typeof fieldDef.Edit &&\n\t\t\t\tfieldDef.Edit.control === 'media'\n\t\t\t) {\n\t\t\t\tfield.Edit = createConfiguredControl( Media, {\n\t\t\t\t\t...fieldDef.Edit,\n\t\t\t\t} );\n\t\t\t}\n\n\t\t\treturn field;\n\t\t} );\n\t}, [ blockTypeFields, clientId ] );\n\n\tif ( ! blockTypeFields?.length ) {\n\t\t// TODO - we might still want to show a placeholder for blocks with no fields.\n\t\t// for example, a way to select the block.\n\t\treturn null;\n\t}\n\n\tconst handleToggleField = ( fieldId ) => {\n\t\tsetForm( ( prev ) => {\n\t\t\tif ( prev.fields?.includes( fieldId ) ) {\n\t\t\t\treturn {\n\t\t\t\t\t...prev,\n\t\t\t\t\tfields: prev.fields.filter( ( id ) => id !== fieldId ),\n\t\t\t\t};\n\t\t\t}\n\n\t\t\treturn {\n\t\t\t\t...prev,\n\t\t\t\tfields: [ ...( prev.fields || [] ), fieldId ],\n\t\t\t};\n\t\t} );\n\t};\n\n\treturn (\n\t\t<div\n\t\t\tclassName=\"block-editor-block-fields__container\"\n\t\t\tonMouseEnter={\n\t\t\t\tisMultiBlock\n\t\t\t\t\t? () => debouncedToggleBlockHighlight( clientId, true )\n\t\t\t\t\t: undefined\n\t\t\t}\n\t\t\tonMouseLeave={ () =>\n\t\t\t\tisMultiBlock\n\t\t\t\t\t? debouncedToggleBlockHighlight( clientId, false )\n\t\t\t\t\t: undefined\n\t\t\t}\n\t\t\tonFocus={\n\t\t\t\tisMultiBlock\n\t\t\t\t\t? () => {\n\t\t\t\t\t\t\tselectBlock(\n\t\t\t\t\t\t\t\tclientId,\n\t\t\t\t\t\t\t\tnull /* null to avoid focus on the block in the canvas */\n\t\t\t\t\t\t\t);\n\t\t\t\t\t }\n\t\t\t\t\t: undefined\n\t\t\t}\n\t\t>\n\t\t\t<div className=\"block-editor-block-fields__header\">\n\t\t\t\t<HStack spacing={ 1 }>\n\t\t\t\t\t{ isMultiBlock && (\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t<BlockIcon\n\t\t\t\t\t\t\t\tclassName=\"block-editor-block-fields__header-icon\"\n\t\t\t\t\t\t\t\ticon={ blockInformation?.icon }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t<h2 className=\"block-editor-block-fields__header-title\">\n\t\t\t\t\t\t\t\t<Truncate numberOfLines={ 1 }>\n\t\t\t\t\t\t\t\t\t{ blockTitle }\n\t\t\t\t\t\t\t\t</Truncate>\n\t\t\t\t\t\t\t</h2>\n\t\t\t\t\t\t\t<FieldsDropdownMenu\n\t\t\t\t\t\t\t\tfields={ dataFormFields }\n\t\t\t\t\t\t\t\tvisibleFields={ form.fields }\n\t\t\t\t\t\t\t\tonToggleField={ handleToggleField }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</>\n\t\t\t\t\t) }\n\t\t\t\t\t{ ! isMultiBlock && (\n\t\t\t\t\t\t<h2 className=\"block-editor-block-fields__header-title\">\n\t\t\t\t\t\t\t{ __( 'Content' ) }\n\t\t\t\t\t\t</h2>\n\t\t\t\t\t) }\n\t\t\t\t</HStack>\n\t\t\t</div>\n\t\t\t<DataForm\n\t\t\t\tdata={ attributes }\n\t\t\t\tfields={ dataFormFields }\n\t\t\t\tform={ form }\n\t\t\t\tonChange={ setAttributes }\n\t\t\t/>\n\t\t</div>\n\t);\n}\n\nfunction hasBlockFieldsSupport( blockName ) {\n\treturn !! (\n\t\twindow?.__experimentalContentOnlyInspectorFields &&\n\t\tgetBlockType( blockName )?.[ fieldsKey ]\n\t);\n}\n\nexport function BlockFieldsPanel( props ) {\n\tconst { blockType, isSelectionWithinCurrentSection } =\n\t\tuseContext( PrivateBlockContext );\n\n\treturn (\n\t\t<InspectorControls group=\"content\">\n\t\t\t<BlockFields\n\t\t\t\t{ ...props }\n\t\t\t\tblockType={ blockType }\n\t\t\t\tisMultiBlock={ isSelectionWithinCurrentSection }\n\t\t\t/>\n\t\t</InspectorControls>\n\t);\n}\n\n/**\n * Export block support definition.\n */\nexport default {\n\tedit: BlockFieldsPanel,\n\thasSupport: hasBlockFieldsSupport,\n\tattributeKeys: [],\n\tsupportsPatternEditing: true,\n};\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["blocksPrivateApis", "useBlockDisplayTitle", "useBlockDisplayInformation", "BlockContext", "blockEditorStore", "blocksStore", "RichText", "Link", "Media", "HStack", "BlockIcon", "Truncate", "FieldsDropdownMenu", "InspectorControls"]
|
|
7
7
|
}
|
package/build/hooks/color.cjs
CHANGED
|
@@ -31,7 +31,6 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
|
|
|
31
31
|
var color_exports = {};
|
|
32
32
|
__export(color_exports, {
|
|
33
33
|
COLOR_SUPPORT_KEY: () => COLOR_SUPPORT_KEY,
|
|
34
|
-
ColorEdit: () => ColorEdit,
|
|
35
34
|
addSaveProps: () => addSaveProps,
|
|
36
35
|
addTransforms: () => addTransforms,
|
|
37
36
|
default: () => color_default
|
|
@@ -41,19 +40,11 @@ var import_clsx = __toESM(require("clsx"));
|
|
|
41
40
|
var import_hooks = require("@wordpress/hooks");
|
|
42
41
|
var import_blocks = require("@wordpress/blocks");
|
|
43
42
|
var import_element = require("@wordpress/element");
|
|
44
|
-
var import_data = require("@wordpress/data");
|
|
45
43
|
var import_colors = require("../components/colors/index.cjs");
|
|
46
44
|
var import_gradients = require("../components/gradients/index.cjs");
|
|
47
45
|
var import_utils = require("./utils.cjs");
|
|
48
46
|
var import_background = require("./background.cjs");
|
|
49
47
|
var import_use_settings = require("../components/use-settings/index.cjs");
|
|
50
|
-
var import_inspector_controls = __toESM(require("../components/inspector-controls/index.cjs"));
|
|
51
|
-
var import_color_panel = __toESM(require("../components/global-styles/color-panel.cjs"));
|
|
52
|
-
var import_color_values = require("../utils/color-values.cjs");
|
|
53
|
-
var import_contrast_checker = __toESM(require("./contrast-checker.cjs"));
|
|
54
|
-
var import_store = require("../store/index.cjs");
|
|
55
|
-
var import_block_style_state = require("./block-style-state.cjs");
|
|
56
|
-
var import_jsx_runtime = require("react/jsx-runtime");
|
|
57
48
|
var COLOR_SUPPORT_KEY = "color";
|
|
58
49
|
var hasColorSupport = (blockNameOrType) => {
|
|
59
50
|
const colorSupport = (0, import_blocks.getBlockSupport)(blockNameOrType, COLOR_SUPPORT_KEY);
|
|
@@ -128,158 +119,6 @@ function addSaveProps(props, blockNameOrType, attributes) {
|
|
|
128
119
|
props.className = newClassName ? newClassName : void 0;
|
|
129
120
|
return props;
|
|
130
121
|
}
|
|
131
|
-
function styleToAttributes(style) {
|
|
132
|
-
const textColorValue = style?.color?.text;
|
|
133
|
-
const textColorSlug = (0, import_color_values.extractPresetSlug)(textColorValue, "color");
|
|
134
|
-
const backgroundColorValue = style?.color?.background;
|
|
135
|
-
const backgroundColorSlug = (0, import_color_values.extractPresetSlug)(
|
|
136
|
-
backgroundColorValue,
|
|
137
|
-
"color"
|
|
138
|
-
);
|
|
139
|
-
const gradientValue = style?.color?.gradient;
|
|
140
|
-
const gradientSlug = (0, import_color_values.extractPresetSlug)(gradientValue, "gradient");
|
|
141
|
-
const updatedStyle = { ...style };
|
|
142
|
-
updatedStyle.color = {
|
|
143
|
-
...updatedStyle.color,
|
|
144
|
-
text: textColorSlug ? void 0 : textColorValue,
|
|
145
|
-
background: backgroundColorSlug ? void 0 : backgroundColorValue,
|
|
146
|
-
gradient: gradientSlug ? void 0 : gradientValue
|
|
147
|
-
};
|
|
148
|
-
return {
|
|
149
|
-
style: (0, import_utils.cleanEmptyObject)(updatedStyle),
|
|
150
|
-
textColor: textColorSlug,
|
|
151
|
-
backgroundColor: backgroundColorSlug,
|
|
152
|
-
gradient: gradientSlug
|
|
153
|
-
};
|
|
154
|
-
}
|
|
155
|
-
function attributesToStyle(attributes) {
|
|
156
|
-
return {
|
|
157
|
-
...attributes.style,
|
|
158
|
-
color: {
|
|
159
|
-
...attributes.style?.color,
|
|
160
|
-
text: attributes.textColor ? "var:preset|color|" + attributes.textColor : attributes.style?.color?.text,
|
|
161
|
-
background: attributes.backgroundColor ? "var:preset|color|" + attributes.backgroundColor : attributes.style?.color?.background,
|
|
162
|
-
gradient: attributes.gradient ? "var:preset|gradient|" + attributes.gradient : attributes.style?.color?.gradient
|
|
163
|
-
}
|
|
164
|
-
};
|
|
165
|
-
}
|
|
166
|
-
function ColorInspectorControl({ children, resetAllFilter }) {
|
|
167
|
-
const attributesResetAllFilter = (0, import_element.useCallback)(
|
|
168
|
-
(attributes) => {
|
|
169
|
-
const existingStyle = attributesToStyle(attributes);
|
|
170
|
-
const updatedStyle = resetAllFilter(existingStyle);
|
|
171
|
-
return {
|
|
172
|
-
...attributes,
|
|
173
|
-
...styleToAttributes(updatedStyle)
|
|
174
|
-
};
|
|
175
|
-
},
|
|
176
|
-
[resetAllFilter]
|
|
177
|
-
);
|
|
178
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
179
|
-
import_inspector_controls.default,
|
|
180
|
-
{
|
|
181
|
-
group: "color",
|
|
182
|
-
resetAllFilter: attributesResetAllFilter,
|
|
183
|
-
children
|
|
184
|
-
}
|
|
185
|
-
);
|
|
186
|
-
}
|
|
187
|
-
function ColorEdit({
|
|
188
|
-
clientId,
|
|
189
|
-
name,
|
|
190
|
-
setAttributes,
|
|
191
|
-
settings,
|
|
192
|
-
asWrapper,
|
|
193
|
-
label,
|
|
194
|
-
defaultControls
|
|
195
|
-
}) {
|
|
196
|
-
const selectedState = (0, import_block_style_state.useBlockStyleState)();
|
|
197
|
-
const isEnabled = (0, import_color_panel.useHasColorPanel)(settings);
|
|
198
|
-
const { style, textColor, backgroundColor, gradient } = (0, import_data.useSelect)(
|
|
199
|
-
(select) => {
|
|
200
|
-
if (!isEnabled) {
|
|
201
|
-
return {};
|
|
202
|
-
}
|
|
203
|
-
const {
|
|
204
|
-
style: _style,
|
|
205
|
-
textColor: _textColor,
|
|
206
|
-
backgroundColor: _backgroundColor,
|
|
207
|
-
gradient: _gradient
|
|
208
|
-
} = select(import_store.store).getBlockAttributes(clientId) || {};
|
|
209
|
-
return {
|
|
210
|
-
style: _style,
|
|
211
|
-
textColor: _textColor,
|
|
212
|
-
backgroundColor: _backgroundColor,
|
|
213
|
-
gradient: _gradient
|
|
214
|
-
};
|
|
215
|
-
},
|
|
216
|
-
[clientId, isEnabled]
|
|
217
|
-
);
|
|
218
|
-
const isStateSelected = !(0, import_block_style_state.isDefaultBlockStyleState)(selectedState);
|
|
219
|
-
const value = (0, import_element.useMemo)(() => {
|
|
220
|
-
if (isStateSelected) {
|
|
221
|
-
return (0, import_block_style_state.getStyleForState)(style, selectedState);
|
|
222
|
-
}
|
|
223
|
-
return attributesToStyle({
|
|
224
|
-
style,
|
|
225
|
-
textColor,
|
|
226
|
-
backgroundColor,
|
|
227
|
-
gradient
|
|
228
|
-
});
|
|
229
|
-
}, [
|
|
230
|
-
isStateSelected,
|
|
231
|
-
selectedState,
|
|
232
|
-
style,
|
|
233
|
-
textColor,
|
|
234
|
-
backgroundColor,
|
|
235
|
-
gradient
|
|
236
|
-
]);
|
|
237
|
-
const onChange = isStateSelected ? (newStyle) => {
|
|
238
|
-
setAttributes({
|
|
239
|
-
style: (0, import_block_style_state.setStyleForState)(style, selectedState, newStyle)
|
|
240
|
-
});
|
|
241
|
-
} : (newStyle) => {
|
|
242
|
-
setAttributes(styleToAttributes(newStyle));
|
|
243
|
-
};
|
|
244
|
-
const Wrapper = asWrapper || ColorInspectorControl;
|
|
245
|
-
if (!isEnabled) {
|
|
246
|
-
return null;
|
|
247
|
-
}
|
|
248
|
-
defaultControls = defaultControls ? defaultControls : (0, import_blocks.getBlockSupport)(name, [
|
|
249
|
-
COLOR_SUPPORT_KEY,
|
|
250
|
-
"__experimentalDefaultControls"
|
|
251
|
-
]);
|
|
252
|
-
const enableContrastChecking = !isStateSelected && !value?.color?.gradient && (settings?.color?.text || settings?.color?.link) && // Contrast checking is enabled by default.
|
|
253
|
-
// Deactivating it requires `enableContrastChecker` to have
|
|
254
|
-
// an explicit value of `false`.
|
|
255
|
-
false !== (0, import_blocks.getBlockSupport)(name, [
|
|
256
|
-
COLOR_SUPPORT_KEY,
|
|
257
|
-
"enableContrastChecker"
|
|
258
|
-
]);
|
|
259
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
260
|
-
import_color_panel.default,
|
|
261
|
-
{
|
|
262
|
-
as: Wrapper,
|
|
263
|
-
panelId: clientId,
|
|
264
|
-
settings,
|
|
265
|
-
value,
|
|
266
|
-
onChange,
|
|
267
|
-
defaultControls,
|
|
268
|
-
label,
|
|
269
|
-
enableContrastChecker: false !== (0, import_blocks.getBlockSupport)(name, [
|
|
270
|
-
COLOR_SUPPORT_KEY,
|
|
271
|
-
"enableContrastChecker"
|
|
272
|
-
]),
|
|
273
|
-
children: enableContrastChecking && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
274
|
-
import_contrast_checker.default,
|
|
275
|
-
{
|
|
276
|
-
clientId,
|
|
277
|
-
name
|
|
278
|
-
}
|
|
279
|
-
)
|
|
280
|
-
}
|
|
281
|
-
);
|
|
282
|
-
}
|
|
283
122
|
function useBlockProps({
|
|
284
123
|
name,
|
|
285
124
|
backgroundColor,
|
|
@@ -377,7 +216,6 @@ function addTransforms(result, source, index, results) {
|
|
|
377
216
|
// Annotate the CommonJS export names for ESM import in node:
|
|
378
217
|
0 && (module.exports = {
|
|
379
218
|
COLOR_SUPPORT_KEY,
|
|
380
|
-
ColorEdit,
|
|
381
219
|
addSaveProps,
|
|
382
220
|
addTransforms
|
|
383
221
|
});
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/hooks/color.js"],
|
|
4
|
-
"sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { addFilter } from '@wordpress/hooks';\nimport { getBlockSupport } from '@wordpress/blocks';\nimport { useMemo, useCallback } from '@wordpress/element';\nimport { useSelect } from '@wordpress/data';\n\n/**\n * Internal dependencies\n */\nimport {\n\tgetColorClassName,\n\tgetColorObjectByAttributeValues,\n} from '../components/colors';\nimport { __experimentalGetGradientClass } from '../components/gradients';\nimport {\n\tcleanEmptyObject,\n\ttransformStyles,\n\tshouldSkipSerialization,\n} from './utils';\nimport { getBackgroundImageClasses } from './background';\nimport { useSettings } from '../components/use-settings';\nimport InspectorControls from '../components/inspector-controls';\nimport {\n\tuseHasColorPanel,\n\tdefault as StylesColorPanel,\n} from '../components/global-styles/color-panel';\nimport { extractPresetSlug } from '../utils/color-values';\nimport BlockColorContrastChecker from './contrast-checker';\nimport { store as blockEditorStore } from '../store';\nimport {\n\tgetStyleForState,\n\tisDefaultBlockStyleState,\n\tsetStyleForState,\n\tuseBlockStyleState,\n} from './block-style-state';\n\nexport const COLOR_SUPPORT_KEY = 'color';\n\nconst hasColorSupport = ( blockNameOrType ) => {\n\tconst colorSupport = getBlockSupport( blockNameOrType, COLOR_SUPPORT_KEY );\n\treturn (\n\t\tcolorSupport &&\n\t\t( colorSupport.link === true ||\n\t\t\tcolorSupport.gradient === true ||\n\t\t\tcolorSupport.background !== false ||\n\t\t\tcolorSupport.text !== false )\n\t);\n};\n\nconst hasLinkColorSupport = ( blockType ) => {\n\tconst colorSupport = getBlockSupport( blockType, COLOR_SUPPORT_KEY );\n\n\treturn (\n\t\tcolorSupport !== null &&\n\t\ttypeof colorSupport === 'object' &&\n\t\t!! colorSupport.link\n\t);\n};\n\nconst hasGradientSupport = ( blockNameOrType ) => {\n\tconst colorSupport = getBlockSupport( blockNameOrType, COLOR_SUPPORT_KEY );\n\n\treturn (\n\t\tcolorSupport !== null &&\n\t\ttypeof colorSupport === 'object' &&\n\t\t!! colorSupport.gradients\n\t);\n};\n\nconst hasBackgroundColorSupport = ( blockType ) => {\n\tconst colorSupport = getBlockSupport( blockType, COLOR_SUPPORT_KEY );\n\n\treturn colorSupport && colorSupport.background !== false;\n};\n\nconst hasTextColorSupport = ( blockType ) => {\n\tconst colorSupport = getBlockSupport( blockType, COLOR_SUPPORT_KEY );\n\n\treturn colorSupport && colorSupport.text !== false;\n};\n\n/**\n * Filters registered block settings, extending attributes to include\n * `backgroundColor` and `textColor` attribute.\n *\n * @param {Object} settings Original block settings.\n *\n * @return {Object} Filtered block settings.\n */\nfunction addAttributes( settings ) {\n\tif ( ! hasColorSupport( settings ) ) {\n\t\treturn settings;\n\t}\n\n\t// Allow blocks to specify their own attribute definition with default values if needed.\n\tif ( ! settings.attributes.backgroundColor ) {\n\t\tObject.assign( settings.attributes, {\n\t\t\tbackgroundColor: {\n\t\t\t\ttype: 'string',\n\t\t\t},\n\t\t} );\n\t}\n\tif ( ! settings.attributes.textColor ) {\n\t\tObject.assign( settings.attributes, {\n\t\t\ttextColor: {\n\t\t\t\ttype: 'string',\n\t\t\t},\n\t\t} );\n\t}\n\n\tif ( hasGradientSupport( settings ) && ! settings.attributes.gradient ) {\n\t\tObject.assign( settings.attributes, {\n\t\t\tgradient: {\n\t\t\t\ttype: 'string',\n\t\t\t},\n\t\t} );\n\t}\n\n\treturn settings;\n}\n\n/**\n * Override props assigned to save component to inject colors classnames.\n *\n * @param {Object} props Additional props applied to save element.\n * @param {Object|string} blockNameOrType Block type.\n * @param {Object} attributes Block attributes.\n *\n * @return {Object} Filtered props applied to save element.\n */\nexport function addSaveProps( props, blockNameOrType, attributes ) {\n\tif (\n\t\t! hasColorSupport( blockNameOrType ) ||\n\t\tshouldSkipSerialization( blockNameOrType, COLOR_SUPPORT_KEY )\n\t) {\n\t\treturn props;\n\t}\n\n\tconst hasGradient = hasGradientSupport( blockNameOrType );\n\n\t// I'd have preferred to avoid the \"style\" attribute usage here\n\tconst { backgroundColor, textColor, gradient, style } = attributes;\n\n\tconst shouldSerialize = ( feature ) =>\n\t\t! shouldSkipSerialization(\n\t\t\tblockNameOrType,\n\t\t\tCOLOR_SUPPORT_KEY,\n\t\t\tfeature\n\t\t);\n\n\t// Primary color classes must come before the `has-text-color`,\n\t// `has-background` and `has-link-color` classes to maintain backwards\n\t// compatibility and avoid block invalidations.\n\tconst textClass = shouldSerialize( 'text' )\n\t\t? getColorClassName( 'color', textColor )\n\t\t: undefined;\n\n\tconst gradientClass = shouldSerialize( 'gradients' )\n\t\t? __experimentalGetGradientClass( gradient )\n\t\t: undefined;\n\n\tconst backgroundClass = shouldSerialize( 'background' )\n\t\t? getColorClassName( 'background-color', backgroundColor )\n\t\t: undefined;\n\n\tconst serializeHasBackground =\n\t\tshouldSerialize( 'background' ) || shouldSerialize( 'gradients' );\n\tconst hasBackground =\n\t\tbackgroundColor ||\n\t\tstyle?.color?.background ||\n\t\t( hasGradient && ( gradient || style?.color?.gradient ) );\n\n\tconst newClassName = clsx( props.className, textClass, gradientClass, {\n\t\t// Don't apply the background class if there's a custom gradient.\n\t\t[ backgroundClass ]:\n\t\t\t( ! hasGradient || ! style?.color?.gradient ) && !! backgroundClass,\n\t\t'has-text-color':\n\t\t\tshouldSerialize( 'text' ) && ( textColor || style?.color?.text ),\n\t\t'has-background': serializeHasBackground && hasBackground,\n\t\t'has-link-color':\n\t\t\tshouldSerialize( 'link' ) && style?.elements?.link?.color,\n\t} );\n\tprops.className = newClassName ? newClassName : undefined;\n\n\treturn props;\n}\n\nfunction styleToAttributes( style ) {\n\tconst textColorValue = style?.color?.text;\n\tconst textColorSlug = extractPresetSlug( textColorValue, 'color' );\n\tconst backgroundColorValue = style?.color?.background;\n\tconst backgroundColorSlug = extractPresetSlug(\n\t\tbackgroundColorValue,\n\t\t'color'\n\t);\n\tconst gradientValue = style?.color?.gradient;\n\tconst gradientSlug = extractPresetSlug( gradientValue, 'gradient' );\n\tconst updatedStyle = { ...style };\n\tupdatedStyle.color = {\n\t\t...updatedStyle.color,\n\t\ttext: textColorSlug ? undefined : textColorValue,\n\t\tbackground: backgroundColorSlug ? undefined : backgroundColorValue,\n\t\tgradient: gradientSlug ? undefined : gradientValue,\n\t};\n\treturn {\n\t\tstyle: cleanEmptyObject( updatedStyle ),\n\t\ttextColor: textColorSlug,\n\t\tbackgroundColor: backgroundColorSlug,\n\t\tgradient: gradientSlug,\n\t};\n}\n\nfunction attributesToStyle( attributes ) {\n\treturn {\n\t\t...attributes.style,\n\t\tcolor: {\n\t\t\t...attributes.style?.color,\n\t\t\ttext: attributes.textColor\n\t\t\t\t? 'var:preset|color|' + attributes.textColor\n\t\t\t\t: attributes.style?.color?.text,\n\t\t\tbackground: attributes.backgroundColor\n\t\t\t\t? 'var:preset|color|' + attributes.backgroundColor\n\t\t\t\t: attributes.style?.color?.background,\n\t\t\tgradient: attributes.gradient\n\t\t\t\t? 'var:preset|gradient|' + attributes.gradient\n\t\t\t\t: attributes.style?.color?.gradient,\n\t\t},\n\t};\n}\n\nfunction ColorInspectorControl( { children, resetAllFilter } ) {\n\tconst attributesResetAllFilter = useCallback(\n\t\t( attributes ) => {\n\t\t\tconst existingStyle = attributesToStyle( attributes );\n\t\t\tconst updatedStyle = resetAllFilter( existingStyle );\n\t\t\treturn {\n\t\t\t\t...attributes,\n\t\t\t\t...styleToAttributes( updatedStyle ),\n\t\t\t};\n\t\t},\n\t\t[ resetAllFilter ]\n\t);\n\n\treturn (\n\t\t<InspectorControls\n\t\t\tgroup=\"color\"\n\t\t\tresetAllFilter={ attributesResetAllFilter }\n\t\t>\n\t\t\t{ children }\n\t\t</InspectorControls>\n\t);\n}\n\nexport function ColorEdit( {\n\tclientId,\n\tname,\n\tsetAttributes,\n\tsettings,\n\tasWrapper,\n\tlabel,\n\tdefaultControls,\n} ) {\n\tconst selectedState = useBlockStyleState();\n\tconst isEnabled = useHasColorPanel( settings );\n\n\tconst { style, textColor, backgroundColor, gradient } = useSelect(\n\t\t( select ) => {\n\t\t\t// Early return to avoid subscription when disabled\n\t\t\tif ( ! isEnabled ) {\n\t\t\t\treturn {};\n\t\t\t}\n\t\t\tconst {\n\t\t\t\tstyle: _style,\n\t\t\t\ttextColor: _textColor,\n\t\t\t\tbackgroundColor: _backgroundColor,\n\t\t\t\tgradient: _gradient,\n\t\t\t} = select( blockEditorStore ).getBlockAttributes( clientId ) || {};\n\t\t\treturn {\n\t\t\t\tstyle: _style,\n\t\t\t\ttextColor: _textColor,\n\t\t\t\tbackgroundColor: _backgroundColor,\n\t\t\t\tgradient: _gradient,\n\t\t\t};\n\t\t},\n\t\t[ clientId, isEnabled ]\n\t);\n\n\tconst isStateSelected = ! isDefaultBlockStyleState( selectedState );\n\n\tconst value = useMemo( () => {\n\t\tif ( isStateSelected ) {\n\t\t\treturn getStyleForState( style, selectedState );\n\t\t}\n\t\treturn attributesToStyle( {\n\t\t\tstyle,\n\t\t\ttextColor,\n\t\t\tbackgroundColor,\n\t\t\tgradient,\n\t\t} );\n\t}, [\n\t\tisStateSelected,\n\t\tselectedState,\n\t\tstyle,\n\t\ttextColor,\n\t\tbackgroundColor,\n\t\tgradient,\n\t] );\n\n\tconst onChange = isStateSelected\n\t\t? ( newStyle ) => {\n\t\t\t\tsetAttributes( {\n\t\t\t\t\tstyle: setStyleForState( style, selectedState, newStyle ),\n\t\t\t\t} );\n\t\t }\n\t\t: ( newStyle ) => {\n\t\t\t\tsetAttributes( styleToAttributes( newStyle ) );\n\t\t };\n\n\tconst Wrapper = asWrapper || ColorInspectorControl;\n\n\tif ( ! isEnabled ) {\n\t\treturn null;\n\t}\n\n\tdefaultControls = defaultControls\n\t\t? defaultControls\n\t\t: getBlockSupport( name, [\n\t\t\t\tCOLOR_SUPPORT_KEY,\n\t\t\t\t'__experimentalDefaultControls',\n\t\t ] );\n\n\tconst enableContrastChecking =\n\t\t! isStateSelected &&\n\t\t! value?.color?.gradient &&\n\t\t( settings?.color?.text || settings?.color?.link ) &&\n\t\t// Contrast checking is enabled by default.\n\t\t// Deactivating it requires `enableContrastChecker` to have\n\t\t// an explicit value of `false`.\n\t\tfalse !==\n\t\t\tgetBlockSupport( name, [\n\t\t\t\tCOLOR_SUPPORT_KEY,\n\t\t\t\t'enableContrastChecker',\n\t\t\t] );\n\n\treturn (\n\t\t<StylesColorPanel\n\t\t\tas={ Wrapper }\n\t\t\tpanelId={ clientId }\n\t\t\tsettings={ settings }\n\t\t\tvalue={ value }\n\t\t\tonChange={ onChange }\n\t\t\tdefaultControls={ defaultControls }\n\t\t\tlabel={ label }\n\t\t\tenableContrastChecker={\n\t\t\t\tfalse !==\n\t\t\t\tgetBlockSupport( name, [\n\t\t\t\t\tCOLOR_SUPPORT_KEY,\n\t\t\t\t\t'enableContrastChecker',\n\t\t\t\t] )\n\t\t\t}\n\t\t>\n\t\t\t{ enableContrastChecking && (\n\t\t\t\t<BlockColorContrastChecker\n\t\t\t\t\tclientId={ clientId }\n\t\t\t\t\tname={ name }\n\t\t\t\t/>\n\t\t\t) }\n\t\t</StylesColorPanel>\n\t);\n}\n\nfunction useBlockProps( {\n\tname,\n\tbackgroundColor,\n\ttextColor,\n\tgradient,\n\tstyle,\n} ) {\n\tconst [ userPalette, themePalette, defaultPalette ] = useSettings(\n\t\t'color.palette.custom',\n\t\t'color.palette.theme',\n\t\t'color.palette.default'\n\t);\n\n\tconst colors = useMemo(\n\t\t() => [\n\t\t\t...( userPalette || [] ),\n\t\t\t...( themePalette || [] ),\n\t\t\t...( defaultPalette || [] ),\n\t\t],\n\t\t[ userPalette, themePalette, defaultPalette ]\n\t);\n\tif (\n\t\t! hasColorSupport( name ) ||\n\t\tshouldSkipSerialization( name, COLOR_SUPPORT_KEY )\n\t) {\n\t\treturn {};\n\t}\n\tconst extraStyles = {};\n\n\tif (\n\t\ttextColor &&\n\t\t! shouldSkipSerialization( name, COLOR_SUPPORT_KEY, 'text' )\n\t) {\n\t\textraStyles.color = getColorObjectByAttributeValues(\n\t\t\tcolors,\n\t\t\ttextColor\n\t\t)?.color;\n\t}\n\tif (\n\t\tbackgroundColor &&\n\t\t! shouldSkipSerialization( name, COLOR_SUPPORT_KEY, 'background' )\n\t) {\n\t\textraStyles.backgroundColor = getColorObjectByAttributeValues(\n\t\t\tcolors,\n\t\t\tbackgroundColor\n\t\t)?.color;\n\t}\n\n\tconst saveProps = addSaveProps( { style: extraStyles }, name, {\n\t\ttextColor,\n\t\tbackgroundColor,\n\t\tgradient,\n\t\tstyle,\n\t} );\n\n\tconst hasBackgroundValue =\n\t\tbackgroundColor ||\n\t\tstyle?.color?.background ||\n\t\tgradient ||\n\t\tstyle?.color?.gradient;\n\n\treturn {\n\t\t...saveProps,\n\t\tclassName: clsx(\n\t\t\tsaveProps.className,\n\t\t\t// Add background image classes in the editor, if not already handled by background color values.\n\t\t\t! hasBackgroundValue && getBackgroundImageClasses( style )\n\t\t),\n\t};\n}\n\nexport default {\n\tuseBlockProps,\n\taddSaveProps,\n\tattributeKeys: [ 'backgroundColor', 'textColor', 'gradient', 'style' ],\n\thasSupport: hasColorSupport,\n};\n\nconst MIGRATION_PATHS = {\n\tlinkColor: [ [ 'style', 'elements', 'link', 'color', 'text' ] ],\n\ttextColor: [ [ 'textColor' ], [ 'style', 'color', 'text' ] ],\n\tbackgroundColor: [\n\t\t[ 'backgroundColor' ],\n\t\t[ 'style', 'color', 'background' ],\n\t],\n\tgradient: [ [ 'gradient' ], [ 'style', 'color', 'gradient' ] ],\n};\n\nexport function addTransforms( result, source, index, results ) {\n\tconst destinationBlockType = result.name;\n\tconst activeSupports = {\n\t\tlinkColor: hasLinkColorSupport( destinationBlockType ),\n\t\ttextColor: hasTextColorSupport( destinationBlockType ),\n\t\tbackgroundColor: hasBackgroundColorSupport( destinationBlockType ),\n\t\tgradient: hasGradientSupport( destinationBlockType ),\n\t};\n\treturn transformStyles(\n\t\tactiveSupports,\n\t\tMIGRATION_PATHS,\n\t\tresult,\n\t\tsource,\n\t\tindex,\n\t\tresults\n\t);\n}\n\naddFilter(\n\t'blocks.registerBlockType',\n\t'core/color/addAttribute',\n\taddAttributes\n);\n\naddFilter(\n\t'blocks.switchToBlockType.transformedBlock',\n\t'core/color/addTransforms',\n\taddTransforms\n);\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;
|
|
6
|
-
"names": ["clsx"
|
|
4
|
+
"sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { addFilter } from '@wordpress/hooks';\nimport { getBlockSupport } from '@wordpress/blocks';\nimport { useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport {\n\tgetColorClassName,\n\tgetColorObjectByAttributeValues,\n} from '../components/colors';\nimport { __experimentalGetGradientClass } from '../components/gradients';\nimport { transformStyles, shouldSkipSerialization } from './utils';\nimport { getBackgroundImageClasses } from './background';\nimport { useSettings } from '../components/use-settings';\n\nexport const COLOR_SUPPORT_KEY = 'color';\n\nconst hasColorSupport = ( blockNameOrType ) => {\n\tconst colorSupport = getBlockSupport( blockNameOrType, COLOR_SUPPORT_KEY );\n\treturn (\n\t\tcolorSupport &&\n\t\t( colorSupport.link === true ||\n\t\t\tcolorSupport.gradient === true ||\n\t\t\tcolorSupport.background !== false ||\n\t\t\tcolorSupport.text !== false )\n\t);\n};\n\nconst hasLinkColorSupport = ( blockType ) => {\n\tconst colorSupport = getBlockSupport( blockType, COLOR_SUPPORT_KEY );\n\n\treturn (\n\t\tcolorSupport !== null &&\n\t\ttypeof colorSupport === 'object' &&\n\t\t!! colorSupport.link\n\t);\n};\n\nconst hasGradientSupport = ( blockNameOrType ) => {\n\tconst colorSupport = getBlockSupport( blockNameOrType, COLOR_SUPPORT_KEY );\n\n\treturn (\n\t\tcolorSupport !== null &&\n\t\ttypeof colorSupport === 'object' &&\n\t\t!! colorSupport.gradients\n\t);\n};\n\nconst hasBackgroundColorSupport = ( blockType ) => {\n\tconst colorSupport = getBlockSupport( blockType, COLOR_SUPPORT_KEY );\n\n\treturn colorSupport && colorSupport.background !== false;\n};\n\nconst hasTextColorSupport = ( blockType ) => {\n\tconst colorSupport = getBlockSupport( blockType, COLOR_SUPPORT_KEY );\n\n\treturn colorSupport && colorSupport.text !== false;\n};\n\n/**\n * Filters registered block settings, extending attributes to include\n * `backgroundColor` and `textColor` attribute.\n *\n * @param {Object} settings Original block settings.\n *\n * @return {Object} Filtered block settings.\n */\nfunction addAttributes( settings ) {\n\tif ( ! hasColorSupport( settings ) ) {\n\t\treturn settings;\n\t}\n\n\t// Allow blocks to specify their own attribute definition with default values if needed.\n\tif ( ! settings.attributes.backgroundColor ) {\n\t\tObject.assign( settings.attributes, {\n\t\t\tbackgroundColor: {\n\t\t\t\ttype: 'string',\n\t\t\t},\n\t\t} );\n\t}\n\tif ( ! settings.attributes.textColor ) {\n\t\tObject.assign( settings.attributes, {\n\t\t\ttextColor: {\n\t\t\t\ttype: 'string',\n\t\t\t},\n\t\t} );\n\t}\n\n\tif ( hasGradientSupport( settings ) && ! settings.attributes.gradient ) {\n\t\tObject.assign( settings.attributes, {\n\t\t\tgradient: {\n\t\t\t\ttype: 'string',\n\t\t\t},\n\t\t} );\n\t}\n\n\treturn settings;\n}\n\n/**\n * Override props assigned to save component to inject colors classnames.\n *\n * @param {Object} props Additional props applied to save element.\n * @param {Object|string} blockNameOrType Block type.\n * @param {Object} attributes Block attributes.\n *\n * @return {Object} Filtered props applied to save element.\n */\nexport function addSaveProps( props, blockNameOrType, attributes ) {\n\tif (\n\t\t! hasColorSupport( blockNameOrType ) ||\n\t\tshouldSkipSerialization( blockNameOrType, COLOR_SUPPORT_KEY )\n\t) {\n\t\treturn props;\n\t}\n\n\tconst hasGradient = hasGradientSupport( blockNameOrType );\n\n\t// I'd have preferred to avoid the \"style\" attribute usage here\n\tconst { backgroundColor, textColor, gradient, style } = attributes;\n\n\tconst shouldSerialize = ( feature ) =>\n\t\t! shouldSkipSerialization(\n\t\t\tblockNameOrType,\n\t\t\tCOLOR_SUPPORT_KEY,\n\t\t\tfeature\n\t\t);\n\n\t// Primary color classes must come before the `has-text-color`,\n\t// `has-background` and `has-link-color` classes to maintain backwards\n\t// compatibility and avoid block invalidations.\n\tconst textClass = shouldSerialize( 'text' )\n\t\t? getColorClassName( 'color', textColor )\n\t\t: undefined;\n\n\tconst gradientClass = shouldSerialize( 'gradients' )\n\t\t? __experimentalGetGradientClass( gradient )\n\t\t: undefined;\n\n\tconst backgroundClass = shouldSerialize( 'background' )\n\t\t? getColorClassName( 'background-color', backgroundColor )\n\t\t: undefined;\n\n\tconst serializeHasBackground =\n\t\tshouldSerialize( 'background' ) || shouldSerialize( 'gradients' );\n\tconst hasBackground =\n\t\tbackgroundColor ||\n\t\tstyle?.color?.background ||\n\t\t( hasGradient && ( gradient || style?.color?.gradient ) );\n\n\tconst newClassName = clsx( props.className, textClass, gradientClass, {\n\t\t// Don't apply the background class if there's a custom gradient.\n\t\t[ backgroundClass ]:\n\t\t\t( ! hasGradient || ! style?.color?.gradient ) && !! backgroundClass,\n\t\t'has-text-color':\n\t\t\tshouldSerialize( 'text' ) && ( textColor || style?.color?.text ),\n\t\t'has-background': serializeHasBackground && hasBackground,\n\t\t'has-link-color':\n\t\t\tshouldSerialize( 'link' ) && style?.elements?.link?.color,\n\t} );\n\tprops.className = newClassName ? newClassName : undefined;\n\n\treturn props;\n}\n\nfunction useBlockProps( {\n\tname,\n\tbackgroundColor,\n\ttextColor,\n\tgradient,\n\tstyle,\n} ) {\n\tconst [ userPalette, themePalette, defaultPalette ] = useSettings(\n\t\t'color.palette.custom',\n\t\t'color.palette.theme',\n\t\t'color.palette.default'\n\t);\n\n\tconst colors = useMemo(\n\t\t() => [\n\t\t\t...( userPalette || [] ),\n\t\t\t...( themePalette || [] ),\n\t\t\t...( defaultPalette || [] ),\n\t\t],\n\t\t[ userPalette, themePalette, defaultPalette ]\n\t);\n\tif (\n\t\t! hasColorSupport( name ) ||\n\t\tshouldSkipSerialization( name, COLOR_SUPPORT_KEY )\n\t) {\n\t\treturn {};\n\t}\n\tconst extraStyles = {};\n\n\tif (\n\t\ttextColor &&\n\t\t! shouldSkipSerialization( name, COLOR_SUPPORT_KEY, 'text' )\n\t) {\n\t\textraStyles.color = getColorObjectByAttributeValues(\n\t\t\tcolors,\n\t\t\ttextColor\n\t\t)?.color;\n\t}\n\tif (\n\t\tbackgroundColor &&\n\t\t! shouldSkipSerialization( name, COLOR_SUPPORT_KEY, 'background' )\n\t) {\n\t\textraStyles.backgroundColor = getColorObjectByAttributeValues(\n\t\t\tcolors,\n\t\t\tbackgroundColor\n\t\t)?.color;\n\t}\n\n\tconst saveProps = addSaveProps( { style: extraStyles }, name, {\n\t\ttextColor,\n\t\tbackgroundColor,\n\t\tgradient,\n\t\tstyle,\n\t} );\n\n\tconst hasBackgroundValue =\n\t\tbackgroundColor ||\n\t\tstyle?.color?.background ||\n\t\tgradient ||\n\t\tstyle?.color?.gradient;\n\n\treturn {\n\t\t...saveProps,\n\t\tclassName: clsx(\n\t\t\tsaveProps.className,\n\t\t\t// Add background image classes in the editor, if not already handled by background color values.\n\t\t\t! hasBackgroundValue && getBackgroundImageClasses( style )\n\t\t),\n\t};\n}\n\nexport default {\n\tuseBlockProps,\n\taddSaveProps,\n\tattributeKeys: [ 'backgroundColor', 'textColor', 'gradient', 'style' ],\n\thasSupport: hasColorSupport,\n};\n\nconst MIGRATION_PATHS = {\n\tlinkColor: [ [ 'style', 'elements', 'link', 'color', 'text' ] ],\n\ttextColor: [ [ 'textColor' ], [ 'style', 'color', 'text' ] ],\n\tbackgroundColor: [\n\t\t[ 'backgroundColor' ],\n\t\t[ 'style', 'color', 'background' ],\n\t],\n\tgradient: [ [ 'gradient' ], [ 'style', 'color', 'gradient' ] ],\n};\n\nexport function addTransforms( result, source, index, results ) {\n\tconst destinationBlockType = result.name;\n\tconst activeSupports = {\n\t\tlinkColor: hasLinkColorSupport( destinationBlockType ),\n\t\ttextColor: hasTextColorSupport( destinationBlockType ),\n\t\tbackgroundColor: hasBackgroundColorSupport( destinationBlockType ),\n\t\tgradient: hasGradientSupport( destinationBlockType ),\n\t};\n\treturn transformStyles(\n\t\tactiveSupports,\n\t\tMIGRATION_PATHS,\n\t\tresult,\n\t\tsource,\n\t\tindex,\n\t\tresults\n\t);\n}\n\naddFilter(\n\t'blocks.registerBlockType',\n\t'core/color/addAttribute',\n\taddAttributes\n);\n\naddFilter(\n\t'blocks.switchToBlockType.transformedBlock',\n\t'core/color/addTransforms',\n\taddTransforms\n);\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": ["clsx"]
|
|
7
7
|
}
|
|
@@ -1,9 +1,7 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
var __create = Object.create;
|
|
3
2
|
var __defProp = Object.defineProperty;
|
|
4
3
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
4
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
6
|
-
var __getProtoOf = Object.getPrototypeOf;
|
|
7
5
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
8
6
|
var __export = (target, all) => {
|
|
9
7
|
for (var name in all)
|
|
@@ -17,29 +15,21 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
17
15
|
}
|
|
18
16
|
return to;
|
|
19
17
|
};
|
|
20
|
-
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
-
// If the importer is in node compatibility mode or this is not an ESM
|
|
22
|
-
// file that has been converted to a CommonJS file using a Babel-
|
|
23
|
-
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
24
|
-
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
25
|
-
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
26
|
-
mod
|
|
27
|
-
));
|
|
28
18
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
29
19
|
|
|
30
20
|
// packages/block-editor/src/hooks/contrast-checker.js
|
|
31
21
|
var contrast_checker_exports = {};
|
|
32
22
|
__export(contrast_checker_exports, {
|
|
33
|
-
default: () =>
|
|
23
|
+
default: () => useBlockColorContrastWarning
|
|
34
24
|
});
|
|
35
25
|
module.exports = __toCommonJS(contrast_checker_exports);
|
|
36
26
|
var import_element = require("@wordpress/element");
|
|
37
27
|
var import_data = require("@wordpress/data");
|
|
38
28
|
var import_blocks = require("@wordpress/blocks");
|
|
39
29
|
var import_global_styles_engine = require("@wordpress/global-styles-engine");
|
|
40
|
-
var
|
|
30
|
+
var import_a11y = require("@wordpress/a11y");
|
|
31
|
+
var import_contrast_checker = require("../components/contrast-checker/index.cjs");
|
|
41
32
|
var import_use_block_refs = require("../components/block-list/use-block-props/use-block-refs.cjs");
|
|
42
|
-
var import_jsx_runtime = require("react/jsx-runtime");
|
|
43
33
|
function getComputedValue(node, property) {
|
|
44
34
|
return node.ownerDocument.defaultView.getComputedStyle(node).getPropertyValue(property);
|
|
45
35
|
}
|
|
@@ -84,17 +74,24 @@ function reducer(prevColors, newColors) {
|
|
|
84
74
|
);
|
|
85
75
|
return hasChanged ? newColors : prevColors;
|
|
86
76
|
}
|
|
87
|
-
function
|
|
77
|
+
function useBlockColorContrastWarning({
|
|
78
|
+
clientId,
|
|
79
|
+
name,
|
|
80
|
+
enabled = true,
|
|
81
|
+
checkTextColor = true,
|
|
82
|
+
checkLinkColor = true,
|
|
83
|
+
messageOverride
|
|
84
|
+
}) {
|
|
88
85
|
const blockEl = (0, import_use_block_refs.useBlockElement)(clientId);
|
|
89
86
|
const [colors, setColors] = (0, import_element.useReducer)(reducer, {});
|
|
90
87
|
const blockType = (0, import_data.useSelect)(
|
|
91
88
|
(select) => {
|
|
92
|
-
return name ? select(import_blocks.store).getBlockType(name) : void 0;
|
|
89
|
+
return name && enabled ? select(import_blocks.store).getBlockType(name) : void 0;
|
|
93
90
|
},
|
|
94
|
-
[name]
|
|
91
|
+
[name, enabled]
|
|
95
92
|
);
|
|
96
93
|
(0, import_element.useLayoutEffect)(() => {
|
|
97
|
-
if (!blockEl || !blockType) {
|
|
94
|
+
if (!enabled || !blockEl || !blockType) {
|
|
98
95
|
return;
|
|
99
96
|
}
|
|
100
97
|
window.requestAnimationFrame(
|
|
@@ -104,7 +101,7 @@ function BlockColorContrastChecker({ clientId, name }) {
|
|
|
104
101
|
);
|
|
105
102
|
});
|
|
106
103
|
(0, import_element.useLayoutEffect)(() => {
|
|
107
|
-
if (!blockEl || !blockType) {
|
|
104
|
+
if (!enabled || !blockEl || !blockType) {
|
|
108
105
|
return;
|
|
109
106
|
}
|
|
110
107
|
const observer = new window.MutationObserver(() => {
|
|
@@ -112,20 +109,26 @@ function BlockColorContrastChecker({ clientId, name }) {
|
|
|
112
109
|
});
|
|
113
110
|
observer.observe(blockEl, {
|
|
114
111
|
attributes: true,
|
|
115
|
-
attributeFilter: ["class", "style"]
|
|
112
|
+
attributeFilter: ["class", "style"],
|
|
113
|
+
subtree: true
|
|
116
114
|
});
|
|
117
115
|
return () => {
|
|
118
116
|
observer.disconnect();
|
|
119
117
|
};
|
|
120
|
-
}, [blockEl, blockType]);
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
118
|
+
}, [enabled, blockEl, blockType]);
|
|
119
|
+
const warning = enabled ? (0, import_contrast_checker.getContrastWarning)({
|
|
120
|
+
backgroundColor: colors.backgroundColor,
|
|
121
|
+
textColor: checkTextColor ? colors.textColor : void 0,
|
|
122
|
+
linkColor: checkLinkColor ? colors.linkColor : void 0,
|
|
123
|
+
messageOverride,
|
|
124
|
+
enableAlphaChecker: true
|
|
125
|
+
}) : null;
|
|
126
|
+
const speakMessage = warning?.speakMessage;
|
|
127
|
+
(0, import_element.useEffect)(() => {
|
|
128
|
+
if (speakMessage) {
|
|
129
|
+
(0, import_a11y.speak)(speakMessage);
|
|
128
130
|
}
|
|
129
|
-
);
|
|
131
|
+
}, [speakMessage]);
|
|
132
|
+
return warning?.message;
|
|
130
133
|
}
|
|
131
134
|
//# sourceMappingURL=contrast-checker.cjs.map
|