@wordpress/block-editor 16.2.0 → 17.0.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 +39 -0
- package/build/components/block-inspector/index.cjs +9 -6
- package/build/components/block-inspector/index.cjs.map +2 -2
- package/build/components/block-keyboard-shortcuts/index.cjs +201 -0
- package/build/components/block-keyboard-shortcuts/index.cjs.map +7 -0
- package/build/components/block-list/block.cjs +10 -3
- package/build/components/block-list/block.cjs.map +2 -2
- package/build/components/block-list/index.cjs +6 -1
- package/build/components/block-list/index.cjs.map +2 -2
- package/build/components/block-list/use-block-props/use-focus-first-element.cjs +4 -0
- package/build/components/block-list/use-block-props/use-focus-first-element.cjs.map +2 -2
- package/build/components/block-list/use-block-props/use-selected-block-event-handlers.cjs +6 -7
- package/build/components/block-list/use-block-props/use-selected-block-event-handlers.cjs.map +2 -2
- package/build/components/block-parent-selector/index.cjs +98 -29
- package/build/components/block-parent-selector/index.cjs.map +3 -3
- package/build/components/block-popover/inbetween.cjs +2 -2
- package/build/components/block-popover/inbetween.cjs.map +2 -2
- package/build/components/block-preview/index.cjs +0 -4
- package/build/components/block-preview/index.cjs.map +2 -2
- package/build/components/block-styles/index.cjs +77 -33
- package/build/components/block-styles/index.cjs.map +3 -3
- package/build/components/block-visibility/constants.cjs.map +2 -2
- package/build/components/child-layout-control/index.cjs.map +2 -2
- package/build/components/colors/with-colors.cjs +55 -71
- package/build/components/colors/with-colors.cjs.map +2 -2
- package/build/components/dimensions-tool/aspect-ratio-tool.cjs +4 -2
- package/build/components/dimensions-tool/aspect-ratio-tool.cjs.map +2 -2
- package/build/components/dimensions-tool/index.cjs +18 -16
- package/build/components/dimensions-tool/index.cjs.map +2 -2
- package/build/components/dimensions-tool/utils.cjs +61 -0
- package/build/components/dimensions-tool/utils.cjs.map +7 -0
- package/build/components/duotone-control/index.cjs +2 -0
- package/build/components/duotone-control/index.cjs.map +2 -2
- package/build/components/global-styles/advanced-panel.cjs.map +3 -3
- package/build/components/global-styles/border-panel.cjs +2 -5
- package/build/components/global-styles/border-panel.cjs.map +2 -2
- package/build/components/global-styles/color-panel.cjs +14 -2
- package/build/components/global-styles/color-panel.cjs.map +2 -2
- package/build/components/global-styles/dimensions-panel.cjs +9 -5
- package/build/components/global-styles/dimensions-panel.cjs.map +2 -2
- package/build/components/global-styles/filters-panel.cjs +12 -8
- package/build/components/global-styles/filters-panel.cjs.map +2 -2
- package/build/components/global-styles/shadow-panel-components.cjs +16 -11
- package/build/components/global-styles/shadow-panel-components.cjs.map +2 -2
- package/build/components/global-styles/utils.cjs +9 -0
- package/build/components/global-styles/utils.cjs.map +2 -2
- package/build/components/inner-blocks/index.cjs +5 -3
- package/build/components/inner-blocks/index.cjs.map +2 -2
- package/build/components/inserter/block-patterns-explorer/index.cjs +39 -22
- package/build/components/inserter/block-patterns-explorer/index.cjs.map +2 -2
- package/build/components/inserter/block-patterns-explorer/pattern-explorer-sidebar.cjs +21 -55
- package/build/components/inserter/block-patterns-explorer/pattern-explorer-sidebar.cjs.map +2 -2
- package/build/components/inserter/block-patterns-explorer/pattern-list.cjs +19 -44
- package/build/components/inserter/block-patterns-explorer/pattern-list.cjs.map +3 -3
- package/build/components/inserter/hooks/use-insertion-point.cjs +4 -4
- package/build/components/inserter/hooks/use-insertion-point.cjs.map +2 -2
- package/build/components/inserter/menu.cjs +18 -7
- package/build/components/inserter/menu.cjs.map +2 -2
- package/build/components/inserter/quick-inserter.cjs +30 -27
- package/build/components/inserter/quick-inserter.cjs.map +2 -2
- package/build/components/inspector-controls-tabs/styles-tab.cjs +1 -1
- package/build/components/inspector-controls-tabs/styles-tab.cjs.map +2 -2
- package/build/components/list-view/index.cjs +31 -5
- package/build/components/list-view/index.cjs.map +3 -3
- package/build/components/list-view/utils.cjs +13 -1
- package/build/components/list-view/utils.cjs.map +2 -2
- package/build/components/media-placeholder/index.cjs +1 -1
- package/build/components/media-placeholder/index.cjs.map +3 -3
- package/build/components/provider/index.cjs +5 -1
- package/build/components/provider/index.cjs.map +3 -3
- package/build/components/publish-date-time-picker/index.cjs +3 -2
- package/build/components/publish-date-time-picker/index.cjs.map +2 -2
- package/build/components/rich-text/event-listeners/enter.cjs +46 -39
- package/build/components/rich-text/event-listeners/enter.cjs.map +2 -2
- package/build/components/rich-text/index.cjs +7 -5
- package/build/components/rich-text/index.cjs.map +2 -2
- package/build/components/rich-text/multiline.cjs +105 -70
- package/build/components/rich-text/multiline.cjs.map +3 -3
- package/build/components/url-input/index.cjs.map +2 -2
- package/build/components/writing-flow/use-input.cjs +65 -13
- package/build/components/writing-flow/use-input.cjs.map +3 -3
- package/build/hooks/border.cjs +25 -3
- package/build/hooks/border.cjs.map +2 -2
- package/build/hooks/dimensions.cjs +9 -2
- package/build/hooks/dimensions.cjs.map +2 -2
- package/build/hooks/duotone.cjs +4 -3
- package/build/hooks/duotone.cjs.map +2 -2
- package/build/hooks/gap.cjs +8 -2
- package/build/hooks/gap.cjs.map +2 -2
- package/build/hooks/layout-child.cjs +35 -13
- package/build/hooks/layout-child.cjs.map +2 -2
- package/build/hooks/layout.cjs +23 -1
- package/build/hooks/layout.cjs.map +2 -2
- package/build/hooks/states.cjs +7 -4
- package/build/hooks/states.cjs.map +2 -2
- package/build/layouts/constrained.cjs +8 -1
- package/build/layouts/constrained.cjs.map +2 -2
- package/build/layouts/flex.cjs +9 -0
- package/build/layouts/flex.cjs.map +2 -2
- package/build/layouts/flow.cjs +4 -1
- package/build/layouts/flow.cjs.map +2 -2
- package/build/layouts/grid.cjs +5 -1
- package/build/layouts/grid.cjs.map +2 -2
- package/build/private-apis.cjs +3 -1
- package/build/private-apis.cjs.map +2 -2
- package/build/store/actions.cjs +1 -1
- package/build/store/actions.cjs.map +2 -2
- package/build-module/components/block-inspector/index.mjs +9 -6
- package/build-module/components/block-inspector/index.mjs.map +2 -2
- package/build-module/components/block-keyboard-shortcuts/index.mjs +173 -0
- package/build-module/components/block-keyboard-shortcuts/index.mjs.map +7 -0
- package/build-module/components/block-list/block.mjs +10 -3
- package/build-module/components/block-list/block.mjs.map +2 -2
- package/build-module/components/block-list/index.mjs +6 -1
- package/build-module/components/block-list/index.mjs.map +2 -2
- package/build-module/components/block-list/use-block-props/use-focus-first-element.mjs +4 -0
- package/build-module/components/block-list/use-block-props/use-focus-first-element.mjs.map +2 -2
- package/build-module/components/block-list/use-block-props/use-selected-block-event-handlers.mjs +6 -7
- package/build-module/components/block-list/use-block-props/use-selected-block-event-handlers.mjs.map +2 -2
- package/build-module/components/block-parent-selector/index.mjs +101 -32
- package/build-module/components/block-parent-selector/index.mjs.map +2 -2
- package/build-module/components/block-popover/inbetween.mjs +2 -2
- package/build-module/components/block-popover/inbetween.mjs.map +2 -2
- package/build-module/components/block-preview/index.mjs +0 -4
- package/build-module/components/block-preview/index.mjs.map +2 -2
- package/build-module/components/block-styles/index.mjs +79 -35
- package/build-module/components/block-styles/index.mjs.map +2 -2
- package/build-module/components/block-visibility/constants.mjs.map +2 -2
- package/build-module/components/child-layout-control/index.mjs +5 -5
- package/build-module/components/child-layout-control/index.mjs.map +1 -1
- package/build-module/components/colors/with-colors.mjs +56 -72
- package/build-module/components/colors/with-colors.mjs.map +2 -2
- package/build-module/components/dimensions-tool/aspect-ratio-tool.mjs +4 -2
- package/build-module/components/dimensions-tool/aspect-ratio-tool.mjs.map +2 -2
- package/build-module/components/dimensions-tool/index.mjs +19 -17
- package/build-module/components/dimensions-tool/index.mjs.map +2 -2
- package/build-module/components/dimensions-tool/utils.mjs +35 -0
- package/build-module/components/dimensions-tool/utils.mjs.map +7 -0
- package/build-module/components/duotone-control/index.mjs +2 -0
- package/build-module/components/duotone-control/index.mjs.map +2 -2
- package/build-module/components/global-styles/advanced-panel.mjs +5 -2
- package/build-module/components/global-styles/advanced-panel.mjs.map +2 -2
- package/build-module/components/global-styles/border-panel.mjs +2 -5
- package/build-module/components/global-styles/border-panel.mjs.map +2 -2
- package/build-module/components/global-styles/color-panel.mjs +14 -2
- package/build-module/components/global-styles/color-panel.mjs.map +2 -2
- package/build-module/components/global-styles/dimensions-panel.mjs +9 -5
- package/build-module/components/global-styles/dimensions-panel.mjs.map +2 -2
- package/build-module/components/global-styles/filters-panel.mjs +16 -9
- package/build-module/components/global-styles/filters-panel.mjs.map +2 -2
- package/build-module/components/global-styles/shadow-panel-components.mjs +16 -11
- package/build-module/components/global-styles/shadow-panel-components.mjs.map +2 -2
- package/build-module/components/global-styles/utils.mjs +8 -0
- package/build-module/components/global-styles/utils.mjs.map +2 -2
- package/build-module/components/inner-blocks/index.mjs +5 -3
- package/build-module/components/inner-blocks/index.mjs.map +2 -2
- package/build-module/components/inserter/block-patterns-explorer/index.mjs +39 -22
- package/build-module/components/inserter/block-patterns-explorer/index.mjs.map +2 -2
- package/build-module/components/inserter/block-patterns-explorer/pattern-explorer-sidebar.mjs +22 -56
- package/build-module/components/inserter/block-patterns-explorer/pattern-explorer-sidebar.mjs.map +2 -2
- package/build-module/components/inserter/block-patterns-explorer/pattern-list.mjs +20 -45
- package/build-module/components/inserter/block-patterns-explorer/pattern-list.mjs.map +2 -2
- package/build-module/components/inserter/hooks/use-insertion-point.mjs +4 -4
- package/build-module/components/inserter/hooks/use-insertion-point.mjs.map +2 -2
- package/build-module/components/inserter/menu.mjs +19 -8
- package/build-module/components/inserter/menu.mjs.map +2 -2
- package/build-module/components/inserter/quick-inserter.mjs +30 -27
- package/build-module/components/inserter/quick-inserter.mjs.map +2 -2
- package/build-module/components/inspector-controls-tabs/styles-tab.mjs +1 -1
- package/build-module/components/inspector-controls-tabs/styles-tab.mjs.map +2 -2
- package/build-module/components/list-view/index.mjs +32 -5
- package/build-module/components/list-view/index.mjs.map +3 -3
- package/build-module/components/list-view/utils.mjs +13 -1
- package/build-module/components/list-view/utils.mjs.map +2 -2
- package/build-module/components/media-placeholder/index.mjs +3 -3
- package/build-module/components/media-placeholder/index.mjs.map +2 -2
- package/build-module/components/provider/index.mjs +6 -2
- package/build-module/components/provider/index.mjs.map +2 -2
- package/build-module/components/publish-date-time-picker/index.mjs +3 -2
- package/build-module/components/publish-date-time-picker/index.mjs.map +2 -2
- package/build-module/components/rich-text/event-listeners/enter.mjs +46 -39
- package/build-module/components/rich-text/event-listeners/enter.mjs.map +2 -2
- package/build-module/components/rich-text/index.mjs +7 -5
- package/build-module/components/rich-text/index.mjs.map +2 -2
- package/build-module/components/rich-text/multiline.mjs +112 -72
- package/build-module/components/rich-text/multiline.mjs.map +2 -2
- package/build-module/components/url-input/index.mjs +2 -2
- package/build-module/components/url-input/index.mjs.map +1 -1
- package/build-module/components/writing-flow/use-input.mjs +66 -14
- package/build-module/components/writing-flow/use-input.mjs.map +3 -3
- package/build-module/hooks/border.mjs +26 -8
- package/build-module/hooks/border.mjs.map +2 -2
- package/build-module/hooks/dimensions.mjs +9 -2
- package/build-module/hooks/dimensions.mjs.map +2 -2
- package/build-module/hooks/duotone.mjs +8 -4
- package/build-module/hooks/duotone.mjs.map +2 -2
- package/build-module/hooks/gap.mjs +6 -1
- package/build-module/hooks/gap.mjs.map +2 -2
- package/build-module/hooks/layout-child.mjs +36 -13
- package/build-module/hooks/layout-child.mjs.map +2 -2
- package/build-module/hooks/layout.mjs +22 -1
- package/build-module/hooks/layout.mjs.map +2 -2
- package/build-module/hooks/states.mjs +8 -5
- package/build-module/hooks/states.mjs.map +2 -2
- package/build-module/layouts/constrained.mjs +8 -1
- package/build-module/layouts/constrained.mjs.map +2 -2
- package/build-module/layouts/flex.mjs +9 -0
- package/build-module/layouts/flex.mjs.map +2 -2
- package/build-module/layouts/flow.mjs +4 -1
- package/build-module/layouts/flow.mjs.map +2 -2
- package/build-module/layouts/grid.mjs +5 -1
- package/build-module/layouts/grid.mjs.map +2 -2
- package/build-module/private-apis.mjs +3 -1
- package/build-module/private-apis.mjs.map +2 -2
- package/build-module/store/actions.mjs +1 -1
- package/build-module/store/actions.mjs.map +2 -2
- package/build-style/style-rtl.css +108 -71
- package/build-style/style.css +108 -71
- package/build-types/components/block-visibility/constants.d.ts +4 -3
- package/build-types/components/block-visibility/constants.d.ts.map +1 -1
- package/package.json +43 -43
- package/src/components/background-image-control/README.md +122 -0
- package/src/components/block-edit-visually-button/README.md +39 -0
- package/src/components/block-editing-mode/README.md +72 -0
- package/src/components/block-inspector/index.js +6 -6
- package/src/components/block-keyboard-shortcuts/index.js +256 -0
- package/src/components/block-list/block.js +7 -0
- package/src/components/block-list/index.js +7 -1
- package/src/components/block-list/use-block-props/use-focus-first-element.js +5 -0
- package/src/components/block-list/use-block-props/use-selected-block-event-handlers.js +6 -8
- package/src/components/block-parent-selector/index.js +111 -30
- package/src/components/block-popover/README.md +10 -3
- package/src/components/block-popover/inbetween.js +8 -2
- package/src/components/block-popover/stories/index.story.jsx +143 -0
- package/src/components/block-preview/index.js +0 -2
- package/src/components/block-styles/index.js +95 -43
- package/src/components/block-styles/style.scss +5 -34
- package/src/components/block-tools/style.scss +94 -0
- package/src/components/block-visibility/constants.ts +4 -3
- package/src/components/child-layout-control/index.js +5 -5
- package/src/components/color-palette/test/__snapshots__/control.js.snap +3 -29
- package/src/components/colors/test/with-colors.js +6 -7
- package/src/components/colors/with-colors.js +79 -105
- package/src/components/dimensions-tool/aspect-ratio-tool.js +16 -4
- package/src/components/dimensions-tool/index.js +34 -22
- package/src/components/dimensions-tool/test/index.js +166 -2
- package/src/components/dimensions-tool/test/utils.js +51 -0
- package/src/components/dimensions-tool/utils.js +67 -0
- package/src/components/duotone-control/index.js +2 -0
- package/src/components/duotone-control/test/index.js +100 -0
- package/src/components/global-styles/advanced-panel.js +5 -2
- package/src/components/global-styles/border-panel.js +11 -9
- package/src/components/global-styles/color-panel.js +13 -1
- package/src/components/global-styles/dimensions-panel.js +17 -5
- package/src/components/global-styles/filters-panel.js +24 -10
- package/src/components/global-styles/shadow-panel-components.js +38 -11
- package/src/components/global-styles/test/border-panel.js +230 -0
- package/src/components/global-styles/test/color-panel.js +24 -0
- package/src/components/global-styles/test/dimensions-panel.js +98 -7
- package/src/components/global-styles/test/filters-panel.js +84 -0
- package/src/components/global-styles/test/utils.js +30 -0
- package/src/components/global-styles/utils.js +23 -0
- package/src/components/inner-blocks/index.js +11 -2
- package/src/components/inner-blocks/stories/index.story.jsx +246 -0
- package/src/components/inserter/block-patterns-explorer/index.js +24 -11
- package/src/components/inserter/block-patterns-explorer/pattern-explorer-sidebar.js +18 -56
- package/src/components/inserter/block-patterns-explorer/pattern-list.js +22 -47
- package/src/components/inserter/hooks/use-insertion-point.js +9 -4
- package/src/components/inserter/menu.js +23 -10
- package/src/components/inserter/quick-inserter.js +15 -13
- package/src/components/inserter/style.scss +44 -62
- package/src/components/inspector-controls-tabs/README.md +92 -0
- package/src/components/inspector-controls-tabs/styles-tab.js +1 -1
- package/src/components/link-control/test/index.js +5 -0
- package/src/components/list-view/index.js +50 -7
- package/src/components/list-view/utils.js +16 -1
- package/src/components/media-placeholder/index.js +9 -4
- package/src/components/plain-text/stories/index.story.jsx +3 -0
- package/src/components/provider/index.js +7 -1
- package/src/components/publish-date-time-picker/README.md +10 -0
- package/src/components/publish-date-time-picker/index.js +17 -14
- package/src/components/rich-text/event-listeners/enter.js +58 -45
- package/src/components/rich-text/index.js +9 -4
- package/src/components/rich-text/multiline.js +126 -86
- package/src/components/url-input/index.js +2 -2
- package/src/components/url-input/test/fixtures/validated-input-control-deprecation.js +27 -0
- package/src/components/url-input/test/index.js +5 -0
- package/src/components/url-popover/README.md +7 -0
- package/src/components/url-popover/stories/index.story.jsx +133 -47
- package/src/components/writing-flow/use-input.js +105 -15
- package/src/hooks/border.js +27 -8
- package/src/hooks/dimensions.js +8 -1
- package/src/hooks/duotone.js +23 -7
- package/src/hooks/gap.js +16 -0
- package/src/hooks/layout-child.js +41 -9
- package/src/hooks/layout.js +117 -71
- package/src/hooks/states.js +8 -5
- package/src/hooks/test/gap.js +31 -1
- package/src/hooks/test/layout-child.js +60 -1
- package/src/hooks/test/layout.js +27 -0
- package/src/layouts/constrained.js +9 -1
- package/src/layouts/flex.js +15 -0
- package/src/layouts/flow.js +4 -1
- package/src/layouts/grid.js +9 -1
- package/src/layouts/test/constrained.js +26 -0
- package/src/layouts/test/flow.js +26 -0
- package/src/layouts/test/grid.js +46 -0
- package/src/private-apis.js +2 -0
- package/src/store/actions.js +14 -1
- package/build/components/floating-toolbar/nav-up-icon.cjs +0 -52
- package/build/components/floating-toolbar/nav-up-icon.cjs.map +0 -7
- package/build/components/gradients/with-gradient.cjs +0 -36
- package/build/components/gradients/with-gradient.cjs.map +0 -7
- package/build/components/inserter-button/sparkles.cjs +0 -36
- package/build/components/inserter-button/sparkles.cjs.map +0 -7
- package/build-module/components/floating-toolbar/nav-up-icon.mjs +0 -31
- package/build-module/components/floating-toolbar/nav-up-icon.mjs.map +0 -7
- package/build-module/components/gradients/with-gradient.mjs +0 -11
- package/build-module/components/gradients/with-gradient.mjs.map +0 -7
- package/build-module/components/inserter-button/sparkles.mjs +0 -15
- package/build-module/components/inserter-button/sparkles.mjs.map +0 -7
- package/build-style/default-editor-styles-rtl.css +0 -68
- package/build-style/default-editor-styles.css +0 -68
- package/src/components/floating-toolbar/nav-up-icon.js +0 -22
- package/src/components/gradients/with-gradient.js +0 -9
- package/src/components/inserter-button/README.md +0 -62
- package/src/components/inserter-button/sparkles.js +0 -12
- package/src/default-editor-styles.scss +0 -25
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/duotone-control/index.js"],
|
|
4
|
-
"sourcesContent": ["import {\n\tColorIndicator,\n\tDropdown,\n\tDuotonePicker,\n\tDuotoneSwatch,\n\tMenuGroup,\n\tToolbarButton,\n} from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { DOWN } from '@wordpress/keycodes';\nimport { Icon, filter } from '@wordpress/icons';\nimport { useInstanceId } from '@wordpress/compose';\n\nfunction DuotoneControl( {\n\tid: idProp,\n\tcolorPalette,\n\tduotonePalette,\n\tdisableCustomColors,\n\tdisableCustomDuotone,\n\tvalue,\n\tonChange,\n} ) {\n\tlet toolbarIcon;\n\tif ( value === 'unset' ) {\n\t\ttoolbarIcon = (\n\t\t\t<ColorIndicator className=\"block-editor-duotone-control__unset-indicator\" />\n\t\t);\n\t} else if ( value ) {\n\t\ttoolbarIcon = <DuotoneSwatch values={ value } />;\n\t} else {\n\t\ttoolbarIcon = <Icon icon={ filter } />;\n\t}\n\n\tconst actionLabel = __( 'Apply duotone filter' );\n\tconst id = useInstanceId( DuotoneControl, 'duotone-control', idProp );\n\tconst descriptionId = `${ id }__description`;\n\n\treturn (\n\t\t<Dropdown\n\t\t\tpopoverProps={ {\n\t\t\t\tclassName: 'block-editor-duotone-control__popover',\n\t\t\t\theaderTitle: __( 'Duotone' ),\n\t\t\t} }\n\t\t\trenderToggle={ ( { isOpen, onToggle } ) => {\n\t\t\t\tconst openOnArrowDown = ( event ) => {\n\t\t\t\t\tif ( ! isOpen && event.keyCode === DOWN ) {\n\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\tonToggle();\n\t\t\t\t\t}\n\t\t\t\t};\n\t\t\t\treturn (\n\t\t\t\t\t<ToolbarButton\n\t\t\t\t\t\tshowTooltip\n\t\t\t\t\t\tonClick={ onToggle }\n\t\t\t\t\t\taria-haspopup=\"true\"\n\t\t\t\t\t\taria-expanded={ isOpen }\n\t\t\t\t\t\tonKeyDown={ openOnArrowDown }\n\t\t\t\t\t\tlabel={ actionLabel }\n\t\t\t\t\t\ticon={ toolbarIcon }\n\t\t\t\t\t/>\n\t\t\t\t);\n\t\t\t} }\n\t\t\trenderContent={ () => (\n\t\t\t\t<MenuGroup label={ __( 'Duotone' ) }>\n\t\t\t\t\t<p>\n\t\t\t\t\t\t{ __(\n\t\t\t\t\t\t\t'Create a two-tone color effect without losing your original image.'\n\t\t\t\t\t\t) }\n\t\t\t\t\t</p>\n\t\t\t\t\t<DuotonePicker\n\t\t\t\t\t\taria-label={ actionLabel }\n\t\t\t\t\t\taria-describedby={ descriptionId }\n\t\t\t\t\t\tcolorPalette={ colorPalette }\n\t\t\t\t\t\tduotonePalette={ duotonePalette }\n\t\t\t\t\t\tdisableCustomColors={ disableCustomColors }\n\t\t\t\t\t\tdisableCustomDuotone={ disableCustomDuotone }\n\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\t/>\n\t\t\t\t</MenuGroup>\n\t\t\t) }\n\t\t/>\n\t);\n}\n\nexport default DuotoneControl;\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wBAOO;AACP,kBAAmB;AACnB,sBAAqB;AACrB,mBAA6B;AAC7B,qBAA8B;
|
|
4
|
+
"sourcesContent": ["import {\n\tColorIndicator,\n\tDropdown,\n\tDuotonePicker,\n\tDuotoneSwatch,\n\tMenuGroup,\n\tToolbarButton,\n} from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { DOWN } from '@wordpress/keycodes';\nimport { Icon, filter } from '@wordpress/icons';\nimport { useInstanceId } from '@wordpress/compose';\n\nfunction DuotoneControl( {\n\tid: idProp,\n\tcolorPalette,\n\tduotonePalette,\n\tdisableCustomColors,\n\tdisableCustomDuotone,\n\tvalue,\n\tselectedSlug,\n\tonChange,\n} ) {\n\tlet toolbarIcon;\n\tif ( value === 'unset' ) {\n\t\ttoolbarIcon = (\n\t\t\t<ColorIndicator className=\"block-editor-duotone-control__unset-indicator\" />\n\t\t);\n\t} else if ( value ) {\n\t\ttoolbarIcon = <DuotoneSwatch values={ value } />;\n\t} else {\n\t\ttoolbarIcon = <Icon icon={ filter } />;\n\t}\n\n\tconst actionLabel = __( 'Apply duotone filter' );\n\tconst id = useInstanceId( DuotoneControl, 'duotone-control', idProp );\n\tconst descriptionId = `${ id }__description`;\n\n\treturn (\n\t\t<Dropdown\n\t\t\tpopoverProps={ {\n\t\t\t\tclassName: 'block-editor-duotone-control__popover',\n\t\t\t\theaderTitle: __( 'Duotone' ),\n\t\t\t} }\n\t\t\trenderToggle={ ( { isOpen, onToggle } ) => {\n\t\t\t\tconst openOnArrowDown = ( event ) => {\n\t\t\t\t\tif ( ! isOpen && event.keyCode === DOWN ) {\n\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\tonToggle();\n\t\t\t\t\t}\n\t\t\t\t};\n\t\t\t\treturn (\n\t\t\t\t\t<ToolbarButton\n\t\t\t\t\t\tshowTooltip\n\t\t\t\t\t\tonClick={ onToggle }\n\t\t\t\t\t\taria-haspopup=\"true\"\n\t\t\t\t\t\taria-expanded={ isOpen }\n\t\t\t\t\t\tonKeyDown={ openOnArrowDown }\n\t\t\t\t\t\tlabel={ actionLabel }\n\t\t\t\t\t\ticon={ toolbarIcon }\n\t\t\t\t\t/>\n\t\t\t\t);\n\t\t\t} }\n\t\t\trenderContent={ () => (\n\t\t\t\t<MenuGroup label={ __( 'Duotone' ) }>\n\t\t\t\t\t<p>\n\t\t\t\t\t\t{ __(\n\t\t\t\t\t\t\t'Create a two-tone color effect without losing your original image.'\n\t\t\t\t\t\t) }\n\t\t\t\t\t</p>\n\t\t\t\t\t<DuotonePicker\n\t\t\t\t\t\taria-label={ actionLabel }\n\t\t\t\t\t\taria-describedby={ descriptionId }\n\t\t\t\t\t\tcolorPalette={ colorPalette }\n\t\t\t\t\t\tduotonePalette={ duotonePalette }\n\t\t\t\t\t\tdisableCustomColors={ disableCustomColors }\n\t\t\t\t\t\tdisableCustomDuotone={ disableCustomDuotone }\n\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t\tselectedSlug={ selectedSlug }\n\t\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\t/>\n\t\t\t\t</MenuGroup>\n\t\t\t) }\n\t\t/>\n\t);\n}\n\nexport default DuotoneControl;\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wBAOO;AACP,kBAAmB;AACnB,sBAAqB;AACrB,mBAA6B;AAC7B,qBAA8B;AAe3B;AAbH,SAAS,eAAgB;AAAA,EACxB,IAAI;AAAA,EACJ;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAAI;AACH,MAAI;AACJ,MAAK,UAAU,SAAU;AACxB,kBACC,4CAAC,oCAAe,WAAU,iDAAgD;AAAA,EAE5E,WAAY,OAAQ;AACnB,kBAAc,4CAAC,mCAAc,QAAS,OAAQ;AAAA,EAC/C,OAAO;AACN,kBAAc,4CAAC,qBAAK,MAAO,qBAAS;AAAA,EACrC;AAEA,QAAM,kBAAc,gBAAI,sBAAuB;AAC/C,QAAM,SAAK,8BAAe,gBAAgB,mBAAmB,MAAO;AACpE,QAAM,gBAAgB,GAAI,EAAG;AAE7B,SACC;AAAA,IAAC;AAAA;AAAA,MACA,cAAe;AAAA,QACd,WAAW;AAAA,QACX,iBAAa,gBAAI,SAAU;AAAA,MAC5B;AAAA,MACA,cAAe,CAAE,EAAE,QAAQ,SAAS,MAAO;AAC1C,cAAM,kBAAkB,CAAE,UAAW;AACpC,cAAK,CAAE,UAAU,MAAM,YAAY,sBAAO;AACzC,kBAAM,eAAe;AACrB,qBAAS;AAAA,UACV;AAAA,QACD;AACA,eACC;AAAA,UAAC;AAAA;AAAA,YACA,aAAW;AAAA,YACX,SAAU;AAAA,YACV,iBAAc;AAAA,YACd,iBAAgB;AAAA,YAChB,WAAY;AAAA,YACZ,OAAQ;AAAA,YACR,MAAO;AAAA;AAAA,QACR;AAAA,MAEF;AAAA,MACA,eAAgB,MACf,6CAAC,+BAAU,WAAQ,gBAAI,SAAU,GAChC;AAAA,oDAAC,OACE;AAAA,UACD;AAAA,QACD,GACD;AAAA,QACA;AAAA,UAAC;AAAA;AAAA,YACA,cAAa;AAAA,YACb,oBAAmB;AAAA,YACnB;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA;AAAA,QACD;AAAA,SACD;AAAA;AAAA,EAEF;AAEF;AAEA,IAAO,0BAAQ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/global-styles/advanced-panel.js"],
|
|
4
|
-
"sourcesContent": ["import {
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,
|
|
6
|
-
"names": ["transformStyles"]
|
|
4
|
+
"sourcesContent": ["import {\n\tTextareaControl as WCTextareaControl,\n\tNotice,\n} from '@wordpress/components';\nimport { Stack } from '@wordpress/ui';\nimport { useState } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\nimport { default as transformStyles } from '../../utils/transform-styles';\n\n/**\n * Validates that a CSS string doesn't contain HTML markup.\n * Uses the same validation as the PHP/global styles REST API.\n *\n * @param {string} css The CSS string to validate.\n * @return {boolean} True if the CSS is valid, false otherwise.\n */\nexport function validateCSS( css ) {\n\t// Check for HTML markup.\n\tif ( typeof css === 'string' && /<\\/?\\w/.test( css ) ) {\n\t\treturn false;\n\t}\n\treturn true;\n}\n\n/**\n * Returns the error message string if the CSS contains HTML markup, or null if it is clean.\n *\n * @param {string} css The CSS string to check.\n * @return {string|null} An error message, or null if the CSS is valid.\n */\nfunction getMarkupValidationError( css ) {\n\treturn validateCSS( css )\n\t\t? null\n\t\t: __( 'The custom CSS is invalid. Do not use <> markup.' );\n}\n\n/**\n * Full CSS validation: markup check first (fast), then a CSS parser (slower).\n *\n * @param {string} css The CSS string to validate.\n * @return {string|null} An error message, or null if the CSS is valid.\n */\nfunction getCSSValidationError( css ) {\n\tif ( ! css ) {\n\t\treturn null;\n\t}\n\tconst markupError = getMarkupValidationError( css );\n\tif ( markupError ) {\n\t\treturn markupError;\n\t}\n\tconst [ transformed ] = transformStyles(\n\t\t[ { css } ],\n\t\t'.for-validation-only'\n\t);\n\treturn transformed === null\n\t\t? __( 'There is an error with your CSS structure.' )\n\t\t: null;\n}\n\nexport default function AdvancedPanel( {\n\tvalue,\n\tonChange,\n\tinheritedValue = value,\n\thelp,\n} ) {\n\t// Custom CSS\n\tconst customCSS = inheritedValue?.css;\n\tconst [ cssError, setCSSError ] = useState( () =>\n\t\tgetCSSValidationError( customCSS )\n\t);\n\tfunction handleOnChange( newValue ) {\n\t\tonChange( {\n\t\t\t...value,\n\t\t\tcss: newValue,\n\t\t} );\n\n\t\tsetCSSError( getMarkupValidationError( newValue ) );\n\t}\n\tfunction handleOnBlur( event ) {\n\t\tsetCSSError( getCSSValidationError( event?.target?.value ) );\n\t}\n\n\treturn (\n\t\t<Stack\n\t\t\tdirection=\"column\"\n\t\t\tgap=\"md\"\n\t\t\tclassName=\"block-editor-global-styles-advanced-panel\"\n\t\t>\n\t\t\t{ cssError && (\n\t\t\t\t<Notice status=\"error\" onRemove={ () => setCSSError( null ) }>\n\t\t\t\t\t{ cssError }\n\t\t\t\t</Notice>\n\t\t\t) }\n\t\t\t<WCTextareaControl\n\t\t\t\tlabel={ __( 'Additional CSS' ) }\n\t\t\t\tvalue={ customCSS }\n\t\t\t\tonChange={ ( newValue ) => handleOnChange( newValue ) }\n\t\t\t\tonBlur={ handleOnBlur }\n\t\t\t\tclassName=\"block-editor-global-styles-advanced-panel__custom-css-input\"\n\t\t\t\tspellCheck={ false }\n\t\t\t\thelp={ help }\n\t\t\t/>\n\t\t</Stack>\n\t);\n}\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wBAGO;AACP,gBAAsB;AACtB,qBAAyB;AACzB,kBAAmB;AACnB,8BAA2C;AA4EzC;AAnEK,SAAS,YAAa,KAAM;AAElC,MAAK,OAAO,QAAQ,YAAY,SAAS,KAAM,GAAI,GAAI;AACtD,WAAO;AAAA,EACR;AACA,SAAO;AACR;AAQA,SAAS,yBAA0B,KAAM;AACxC,SAAO,YAAa,GAAI,IACrB,WACA,gBAAI,kDAAmD;AAC3D;AAQA,SAAS,sBAAuB,KAAM;AACrC,MAAK,CAAE,KAAM;AACZ,WAAO;AAAA,EACR;AACA,QAAM,cAAc,yBAA0B,GAAI;AAClD,MAAK,aAAc;AAClB,WAAO;AAAA,EACR;AACA,QAAM,CAAE,WAAY,QAAI,wBAAAA;AAAA,IACvB,CAAE,EAAE,IAAI,CAAE;AAAA,IACV;AAAA,EACD;AACA,SAAO,gBAAgB,WACpB,gBAAI,4CAA6C,IACjD;AACJ;AAEe,SAAR,cAAgC;AAAA,EACtC;AAAA,EACA;AAAA,EACA,iBAAiB;AAAA,EACjB;AACD,GAAI;AAEH,QAAM,YAAY,gBAAgB;AAClC,QAAM,CAAE,UAAU,WAAY,QAAI;AAAA,IAAU,MAC3C,sBAAuB,SAAU;AAAA,EAClC;AACA,WAAS,eAAgB,UAAW;AACnC,aAAU;AAAA,MACT,GAAG;AAAA,MACH,KAAK;AAAA,IACN,CAAE;AAEF,gBAAa,yBAA0B,QAAS,CAAE;AAAA,EACnD;AACA,WAAS,aAAc,OAAQ;AAC9B,gBAAa,sBAAuB,OAAO,QAAQ,KAAM,CAAE;AAAA,EAC5D;AAEA,SACC;AAAA,IAAC;AAAA;AAAA,MACA,WAAU;AAAA,MACV,KAAI;AAAA,MACJ,WAAU;AAAA,MAER;AAAA,oBACD,4CAAC,4BAAO,QAAO,SAAQ,UAAW,MAAM,YAAa,IAAK,GACvD,oBACH;AAAA,QAED;AAAA,UAAC,kBAAAC;AAAA,UAAA;AAAA,YACA,WAAQ,gBAAI,gBAAiB;AAAA,YAC7B,OAAQ;AAAA,YACR,UAAW,CAAE,aAAc,eAAgB,QAAS;AAAA,YACpD,QAAS;AAAA,YACT,WAAU;AAAA,YACV,YAAa;AAAA,YACb;AAAA;AAAA,QACD;AAAA;AAAA;AAAA,EACD;AAEF;",
|
|
6
|
+
"names": ["transformStyles", "WCTextareaControl"]
|
|
7
7
|
}
|
|
@@ -114,7 +114,6 @@ function BorderPanel({
|
|
|
114
114
|
inheritedValue = value,
|
|
115
115
|
settings,
|
|
116
116
|
panelId,
|
|
117
|
-
name,
|
|
118
117
|
defaultControls = DEFAULT_CONTROLS,
|
|
119
118
|
showInheritanceLabelIndicators = (0, import_inheritance.isGlobalStylesInheritanceEnabled)()
|
|
120
119
|
}) {
|
|
@@ -230,10 +229,9 @@ function BorderPanel({
|
|
|
230
229
|
const inheritedShadow = decodeValue(inheritedValue?.shadow);
|
|
231
230
|
const isShadowPlaceholder = localShadow === void 0 && inheritedShadow !== void 0 && inheritedShadow !== "";
|
|
232
231
|
const shadow = isShadowPlaceholder ? inheritedShadow : localShadow;
|
|
233
|
-
const shadowPresets = settings
|
|
234
|
-
const mergedShadowPresets = shadowPresets.custom ?? shadowPresets.theme ?? shadowPresets.default ?? [];
|
|
232
|
+
const shadowPresets = (0, import_shadow_panel_components.useShadowPresets)(settings);
|
|
235
233
|
const setShadow = (newValue) => {
|
|
236
|
-
const slug =
|
|
234
|
+
const slug = shadowPresets.findLast(
|
|
237
235
|
({ shadow: shadowName }) => shadowName === newValue
|
|
238
236
|
)?.slug;
|
|
239
237
|
onChange(
|
|
@@ -289,7 +287,6 @@ function BorderPanel({
|
|
|
289
287
|
const showBorderByDefault = defaultControls?.color || defaultControls?.width;
|
|
290
288
|
const hasBorderControl = showBorderColor || showBorderStyle || showBorderWidth || showBorderRadius;
|
|
291
289
|
const label = (0, import_border.useBorderPanelLabel)({
|
|
292
|
-
blockName: name,
|
|
293
290
|
hasShadowControl,
|
|
294
291
|
hasBorderControl
|
|
295
292
|
});
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/global-styles/border-panel.js"],
|
|
4
|
-
"sourcesContent": ["import {\n\tBorderBoxControl,\n\t__experimentalHasSplitBorders as hasSplitBorders,\n\t__experimentalIsDefinedBorder as isDefinedBorder,\n\t__experimentalToolsPanel as ToolsPanel,\n\tBaseControl,\n} from '@wordpress/components';\nimport { useCallback, useMemo } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\nimport { getValueFromVariable } from '@wordpress/global-styles-engine';\nimport BorderRadiusControl from '../border-radius-control';\nimport { useColorsPerOrigin } from './hooks';\nimport { useToolsPanelDropdownMenuProps } from './utils';\nimport { setImmutably } from '../../utils/object';\nimport { useBorderPanelLabel } from '../../hooks/border';\nimport { ShadowPopover, useShadowPresets } from './shadow-panel-components';\nimport {\n\tgetInheritanceProps,\n\tInheritanceToolsPanelItem,\n\tisGlobalStylesInheritanceEnabled,\n} from './inheritance';\n\nexport function useHasBorderPanel( settings ) {\n\tconst controls = Object.values( useHasBorderPanelControls( settings ) );\n\treturn controls.some( Boolean );\n}\n\nexport function useHasBorderPanelControls( settings ) {\n\tconst controls = {\n\t\thasBorderColor: useHasBorderColorControl( settings ),\n\t\thasBorderRadius: useHasBorderRadiusControl( settings ),\n\t\thasBorderStyle: useHasBorderStyleControl( settings ),\n\t\thasBorderWidth: useHasBorderWidthControl( settings ),\n\t\thasShadow: useHasShadowControl( settings ),\n\t};\n\n\treturn controls;\n}\n\nfunction useHasBorderColorControl( settings ) {\n\treturn settings?.border?.color;\n}\n\nfunction useHasBorderRadiusControl( settings ) {\n\treturn settings?.border?.radius;\n}\n\nfunction useHasBorderStyleControl( settings ) {\n\treturn settings?.border?.style;\n}\n\nfunction useHasBorderWidthControl( settings ) {\n\treturn settings?.border?.width;\n}\n\nfunction useHasShadowControl( settings ) {\n\tconst shadows = useShadowPresets( settings );\n\treturn !! settings?.shadow && shadows.length > 0;\n}\n\nfunction BorderToolsPanel( {\n\tresetAllFilter,\n\tonChange,\n\tvalue,\n\tpanelId,\n\tchildren,\n\tlabel,\n} ) {\n\tconst dropdownMenuProps = useToolsPanelDropdownMenuProps();\n\tconst resetAll = () => {\n\t\tconst updatedValue = resetAllFilter( value );\n\t\tonChange( updatedValue );\n\t};\n\n\treturn (\n\t\t<ToolsPanel\n\t\t\tlabel={ label }\n\t\t\tresetAll={ resetAll }\n\t\t\tpanelId={ panelId }\n\t\t\tdropdownMenuProps={ dropdownMenuProps }\n\t\t>\n\t\t\t{ children }\n\t\t</ToolsPanel>\n\t);\n}\n\nconst DEFAULT_CONTROLS = {\n\tradius: true,\n\tcolor: true,\n\twidth: true,\n\tshadow: true,\n};\n\nexport default function BorderPanel( {\n\tas: Wrapper = BorderToolsPanel,\n\tvalue,\n\tonChange,\n\tinheritedValue = value,\n\tsettings,\n\tpanelId,\n\tname,\n\tdefaultControls = DEFAULT_CONTROLS,\n\tshowInheritanceLabelIndicators = isGlobalStylesInheritanceEnabled(),\n} ) {\n\tconst colors = useColorsPerOrigin( settings );\n\tconst areCustomSolidsEnabled = settings?.color?.custom;\n\tconst decodeValue = useCallback(\n\t\t( rawValue ) => getValueFromVariable( { settings }, '', rawValue ),\n\t\t[ settings ]\n\t);\n\t// Always keep the layout className (e.g. `single-column`); only the\n\t// inheritance treatment is gated on `showInheritanceLabelIndicators`.\n\tconst inheritanceProps = ( isInherited, hasLocalOverride, className ) =>\n\t\tgetInheritanceProps(\n\t\t\tshowInheritanceLabelIndicators && isInherited,\n\t\t\tshowInheritanceLabelIndicators && hasLocalOverride,\n\t\t\tclassName\n\t\t);\n\tconst encodeColorValue = ( colorValue ) => {\n\t\tconst allColors = colors.flatMap(\n\t\t\t( { colors: originColors } ) => originColors\n\t\t);\n\t\tconst colorObject = allColors.find(\n\t\t\t( { color } ) => color === colorValue\n\t\t);\n\t\treturn colorObject\n\t\t\t? 'var:preset|color|' + colorObject.slug\n\t\t\t: colorValue;\n\t};\n\t// Decode a `border` sub-tree (handles split borders + flat shape).\n\tconst decodeBorder = useCallback(\n\t\t( source ) => {\n\t\t\tif ( ! source ) {\n\t\t\t\treturn undefined;\n\t\t\t}\n\t\t\tif ( hasSplitBorders( source ) ) {\n\t\t\t\tconst out = { ...source };\n\t\t\t\t[ 'top', 'right', 'bottom', 'left' ].forEach( ( side ) => {\n\t\t\t\t\tout[ side ] = {\n\t\t\t\t\t\t...out[ side ],\n\t\t\t\t\t\tcolor: decodeValue( out[ side ]?.color ),\n\t\t\t\t\t};\n\t\t\t\t} );\n\t\t\t\treturn out;\n\t\t\t}\n\t\t\treturn {\n\t\t\t\t...source,\n\t\t\t\tcolor: source.color ? decodeValue( source.color ) : undefined,\n\t\t\t};\n\t\t},\n\t\t[ decodeValue ]\n\t);\n\t// Local-then-inherited: prefer the user's locally-set border (whether\n\t// flat or split) when defined, otherwise fall back to the inherited\n\t// Global Styles border. The merge happens at the sub-tree root, not\n\t// at the leaf level — borders are commonly authored as a single\n\t// affordance in the inspector, so partial leaf merges would be\n\t// surprising.\n\tconst localBorder = useMemo(\n\t\t() => decodeBorder( value?.border ),\n\t\t[ value?.border, decodeBorder ]\n\t);\n\tconst inheritedBorder = useMemo(\n\t\t() => decodeBorder( inheritedValue?.border ),\n\t\t[ inheritedValue?.border, decodeBorder ]\n\t);\n\tconst isBorderPlaceholder =\n\t\t! isDefinedBorder( value?.border ) &&\n\t\t!! inheritedBorder &&\n\t\tisDefinedBorder( inheritedBorder );\n\tconst border = isBorderPlaceholder ? inheritedBorder : localBorder;\n\tconst setBorder = ( newBorder ) =>\n\t\tonChange( { ...value, border: newBorder } );\n\tconst showBorderColor = useHasBorderColorControl( settings );\n\tconst showBorderStyle = useHasBorderStyleControl( settings );\n\tconst showBorderWidth = useHasBorderWidthControl( settings );\n\n\t// Border radius. Display inherited values through the control's `values`\n\t// prop when local values are empty so UnitControl can parse the numeric\n\t// quantity and selected unit normally (e.g. `2.5em` -> `2.5` + `em`).\n\t// `hasBorderRadius` remains local-only, so displaying the inherited value\n\t// does not mark the ToolsPanel item as customised or commit on mount.\n\tconst showBorderRadius = useHasBorderRadiusControl( settings );\n\tconst localBorderRadius = useMemo( () => {\n\t\tif ( typeof value?.border?.radius !== 'object' ) {\n\t\t\treturn decodeValue( value?.border?.radius );\n\t\t}\n\t\treturn {\n\t\t\ttopLeft: decodeValue( value?.border?.radius?.topLeft ),\n\t\t\ttopRight: decodeValue( value?.border?.radius?.topRight ),\n\t\t\tbottomLeft: decodeValue( value?.border?.radius?.bottomLeft ),\n\t\t\tbottomRight: decodeValue( value?.border?.radius?.bottomRight ),\n\t\t};\n\t}, [ value?.border?.radius, decodeValue ] );\n\tconst inheritedBorderRadius = useMemo( () => {\n\t\tconst rawRadius = inheritedValue?.border?.radius;\n\t\tif ( typeof rawRadius !== 'object' ) {\n\t\t\treturn decodeValue( rawRadius );\n\t\t}\n\t\treturn {\n\t\t\ttopLeft: decodeValue( rawRadius?.topLeft ),\n\t\t\ttopRight: decodeValue( rawRadius?.topRight ),\n\t\t\tbottomLeft: decodeValue( rawRadius?.bottomLeft ),\n\t\t\tbottomRight: decodeValue( rawRadius?.bottomRight ),\n\t\t};\n\t}, [ inheritedValue?.border?.radius, decodeValue ] );\n\t// Spread the local border, not the merged display value, or setting a\n\t// radius bakes the inherited border into the local override. Mirror of\n\t// the guard in `onBorderChange`.\n\tconst setBorderRadius = ( newBorderRadius ) =>\n\t\tsetBorder( { ...value?.border, radius: newBorderRadius } );\n\tconst hasBorderRadius = () => {\n\t\tconst borderValues = value?.border?.radius;\n\t\tif ( typeof borderValues === 'object' ) {\n\t\t\treturn Object.entries( borderValues ).some( ( [ , v ] ) => !! v );\n\t\t}\n\t\treturn !! borderValues;\n\t};\n\tconst isBorderRadiusPlaceholder =\n\t\t! hasBorderRadius() &&\n\t\tinheritedBorderRadius !== undefined &&\n\t\tinheritedBorderRadius !== '';\n\t// Build an object value so unlinked-mode shows per-corner inherited\n\t// values. The control accepts either a string or an object; passing the\n\t// object form is correct in both modes (the control collapses to the\n\t// `all`/first corner in linked mode).\n\tconst borderRadius = useMemo( () => {\n\t\tif ( ! isBorderRadiusPlaceholder ) {\n\t\t\treturn localBorderRadius;\n\t\t}\n\t\tif ( typeof inheritedBorderRadius === 'string' ) {\n\t\t\treturn inheritedBorderRadius;\n\t\t}\n\t\tconst obj = inheritedBorderRadius;\n\t\tif ( ! obj ) {\n\t\t\treturn localBorderRadius;\n\t\t}\n\t\tconst all =\n\t\t\tobj.topLeft &&\n\t\t\tobj.topLeft === obj.topRight &&\n\t\t\tobj.topLeft === obj.bottomLeft &&\n\t\t\tobj.topLeft === obj.bottomRight\n\t\t\t\t? obj.topLeft\n\t\t\t\t: undefined;\n\t\treturn { all, ...obj };\n\t}, [\n\t\tisBorderRadiusPlaceholder,\n\t\tlocalBorderRadius,\n\t\tinheritedBorderRadius,\n\t] );\n\tconst hasShadowControl = useHasShadowControl( settings );\n\n\t// Shadow. At rest, the popover toggle button uses the placeholder\n\t// treatment, and the popover preset list pre-selects the inherited shadow.\n\t// The interceptor below recognises the user's \"accept inherited\" click as\n\t// an explicit commit, mirroring the ToggleGroup pattern in the typography\n\t// panel.\n\tconst localShadow = decodeValue( value?.shadow );\n\tconst inheritedShadow = decodeValue( inheritedValue?.shadow );\n\tconst isShadowPlaceholder =\n\t\tlocalShadow === undefined &&\n\t\tinheritedShadow !== undefined &&\n\t\tinheritedShadow !== '';\n\tconst shadow = isShadowPlaceholder ? inheritedShadow : localShadow;\n\tconst shadowPresets = settings?.shadow?.presets ?? {};\n\tconst mergedShadowPresets =\n\t\tshadowPresets.custom ??\n\t\tshadowPresets.theme ??\n\t\tshadowPresets.default ??\n\t\t[];\n\tconst setShadow = ( newValue ) => {\n\t\tconst slug = mergedShadowPresets?.find(\n\t\t\t( { shadow: shadowName } ) => shadowName === newValue\n\t\t)?.slug;\n\n\t\tonChange(\n\t\t\tsetImmutably(\n\t\t\t\tvalue,\n\t\t\t\t[ 'shadow' ],\n\t\t\t\tslug ? `var:preset|shadow|${ slug }` : newValue || undefined\n\t\t\t)\n\t\t);\n\t};\n\t// Display-without-commit interceptor for the shadow preset list. When the\n\t// user is at the at-rest preselect (local is undefined, inherited is the\n\t// active shadow), `ShadowPresets`' default toggle-off behaviour would\n\t// interpret the click on the highlighted preset as `undefined` (clear).\n\t// Re-route it to an explicit commit of the inherited value, so clicking\n\t// the visible preselected preset is the user's \"accept this inherited\n\t// value\" affordance.\n\tconst setShadowWithInheritedCommit = ( newValue ) => {\n\t\tif ( isShadowPlaceholder && newValue === undefined ) {\n\t\t\tsetShadow( inheritedShadow );\n\t\t\treturn;\n\t\t}\n\t\tsetShadow( newValue );\n\t};\n\tconst hasShadow = () => !! value?.shadow;\n\tconst resetShadow = () => setShadow( undefined );\n\t// A local override exists when the user has set a shadow that shadows an\n\t// inherited one. Only then does the toggle render the blue-dot reset\n\t// affordance (mirroring the color/gradient controls); a merely-inherited\n\t// value at rest shows no reset button.\n\tconst hasShadowLocalOverride =\n\t\tshowInheritanceLabelIndicators &&\n\t\thasShadow() &&\n\t\tinheritedShadow !== undefined;\n\n\tconst resetBorder = () => {\n\t\tif ( hasBorderRadius() ) {\n\t\t\treturn setBorder( { radius: value?.border?.radius } );\n\t\t}\n\n\t\tsetBorder( undefined );\n\t};\n\n\tconst onBorderChange = ( newBorder ) => {\n\t\t// Ensure we have a visible border style when a border width or\n\t\t// color is being selected.\n\t\tconst updatedBorder = { ...newBorder };\n\n\t\tif ( hasSplitBorders( updatedBorder ) ) {\n\t\t\t[ 'top', 'right', 'bottom', 'left' ].forEach( ( side ) => {\n\t\t\t\tif ( updatedBorder[ side ] ) {\n\t\t\t\t\tupdatedBorder[ side ] = {\n\t\t\t\t\t\t...updatedBorder[ side ],\n\t\t\t\t\t\tcolor: encodeColorValue( updatedBorder[ side ]?.color ),\n\t\t\t\t\t};\n\t\t\t\t}\n\t\t\t} );\n\t\t} else if ( updatedBorder ) {\n\t\t\tupdatedBorder.color = encodeColorValue( updatedBorder.color );\n\t\t}\n\n\t\t// As radius is maintained separately to color, style, and width\n\t\t// maintain its value. Read from `value` (local-only) rather than\n\t\t// `border` (the merged display value), otherwise an inherited\n\t\t// radius gets baked into the local override every time the\n\t\t// user touches color/style/width — which both pollutes the\n\t\t// stored attribute and causes the radius `ToolsPanelItem` to\n\t\t// flip into the `has-local-override-from-global-styles` state\n\t\t// even though the user never customised the radius. The\n\t\t// `radius` key must come after the spread so it wins over any\n\t\t// `radius` field forwarded by `BorderBoxControl`'s inner\n\t\t// `BorderControl`, which merges its incoming `value` with the\n\t\t// changed prop. Undefined values here will be cleaned when\n\t\t// global styles are saved.\n\t\tsetBorder( {\n\t\t\t...updatedBorder,\n\t\t\tradius: value?.border?.radius,\n\t\t} );\n\t};\n\n\tconst resetAllFilter = useCallback( ( previousValue ) => {\n\t\treturn {\n\t\t\t...previousValue,\n\t\t\tborder: undefined,\n\t\t\tshadow: undefined,\n\t\t};\n\t}, [] );\n\n\tconst showBorderByDefault =\n\t\tdefaultControls?.color || defaultControls?.width;\n\n\tconst hasBorderControl =\n\t\tshowBorderColor ||\n\t\tshowBorderStyle ||\n\t\tshowBorderWidth ||\n\t\tshowBorderRadius;\n\n\tconst label = useBorderPanelLabel( {\n\t\tblockName: name,\n\t\thasShadowControl,\n\t\thasBorderControl,\n\t} );\n\n\treturn (\n\t\t<Wrapper\n\t\t\tresetAllFilter={ resetAllFilter }\n\t\t\tvalue={ value }\n\t\t\tonChange={ onChange }\n\t\t\tpanelId={ panelId }\n\t\t\tlabel={ label }\n\t\t>\n\t\t\t{ ( showBorderWidth || showBorderColor ) && (\n\t\t\t\t<InheritanceToolsPanelItem\n\t\t\t\t\t{ ...inheritanceProps(\n\t\t\t\t\t\tisBorderPlaceholder,\n\t\t\t\t\t\tisDefinedBorder( value?.border ) &&\n\t\t\t\t\t\t\t!! inheritedBorder &&\n\t\t\t\t\t\t\tisDefinedBorder( inheritedBorder )\n\t\t\t\t\t) }\n\t\t\t\t\thasValue={ () => isDefinedBorder( value?.border ) }\n\t\t\t\t\tlabel={ __( 'Border' ) }\n\t\t\t\t\tonDeselect={ () => resetBorder() }\n\t\t\t\t\tisShownByDefault={ showBorderByDefault }\n\t\t\t\t\tpanelId={ panelId }\n\t\t\t\t>\n\t\t\t\t\t{ ( showInheritanceLabelIndicators ||\n\t\t\t\t\t\thasShadowControl ) && (\n\t\t\t\t\t\t// Render the visible label as `BaseControl.VisualLabel`\n\t\t\t\t\t\t// (which produces `.components-base-control__label`)\n\t\t\t\t\t\t// rather than passing `label` to `BorderBoxControl`,\n\t\t\t\t\t\t// whose internal `<StyledLabel>` carries no stable\n\t\t\t\t\t\t// className. The inheritance treatment and the\n\t\t\t\t\t\t// local-override reset affordance both target\n\t\t\t\t\t\t// `.components-base-control__label`, so the visible\n\t\t\t\t\t\t// \"Border\" label has to be a `BaseControl` label to\n\t\t\t\t\t\t// receive them.\n\t\t\t\t\t\t//\n\t\t\t\t\t\t// Render it whenever a Shadow control is also present so\n\t\t\t\t\t\t// the two controls stay disambiguated (mirrors the\n\t\t\t\t\t\t// Shadow label's `hasBorderControl` guard below, and\n\t\t\t\t\t\t// trunk's `hideLabelFromVision={ ! hasShadowControl }`),\n\t\t\t\t\t\t// even when inheritance indicators are off (e.g. in\n\t\t\t\t\t\t// Global Styles).\n\t\t\t\t\t\t<BaseControl.VisualLabel as=\"legend\">\n\t\t\t\t\t\t\t{ __( 'Border' ) }\n\t\t\t\t\t\t</BaseControl.VisualLabel>\n\t\t\t\t\t) }\n\t\t\t\t\t<BorderBoxControl\n\t\t\t\t\t\tcolors={ colors }\n\t\t\t\t\t\tdisableCustomColors={ ! areCustomSolidsEnabled }\n\t\t\t\t\t\tenableAlpha\n\t\t\t\t\t\tenableStyle={ showBorderStyle }\n\t\t\t\t\t\tonChange={ onBorderChange }\n\t\t\t\t\t\tpopoverOffset={ 40 }\n\t\t\t\t\t\tpopoverPlacement=\"left-start\"\n\t\t\t\t\t\tvalue={ border }\n\t\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t\t/>\n\t\t\t\t</InheritanceToolsPanelItem>\n\t\t\t) }\n\t\t\t{ showBorderRadius && (\n\t\t\t\t<InheritanceToolsPanelItem\n\t\t\t\t\t{ ...inheritanceProps(\n\t\t\t\t\t\tisBorderRadiusPlaceholder,\n\t\t\t\t\t\thasBorderRadius() && inheritedBorderRadius !== undefined\n\t\t\t\t\t) }\n\t\t\t\t\thasValue={ hasBorderRadius }\n\t\t\t\t\tlabel={ __( 'Radius' ) }\n\t\t\t\t\thasInlineEndToggle\n\t\t\t\t\tonDeselect={ () => setBorderRadius( undefined ) }\n\t\t\t\t\tisShownByDefault={ defaultControls.radius }\n\t\t\t\t\tpanelId={ panelId }\n\t\t\t\t>\n\t\t\t\t\t<BorderRadiusControl\n\t\t\t\t\t\tpresets={ settings?.border?.radiusSizes }\n\t\t\t\t\t\tvalues={ borderRadius }\n\t\t\t\t\t\tonChange={ ( newValue ) => {\n\t\t\t\t\t\t\tsetBorderRadius( newValue || undefined );\n\t\t\t\t\t\t} }\n\t\t\t\t\t/>\n\t\t\t\t</InheritanceToolsPanelItem>\n\t\t\t) }\n\t\t\t{ hasShadowControl && (\n\t\t\t\t<InheritanceToolsPanelItem\n\t\t\t\t\t{ ...inheritanceProps(\n\t\t\t\t\t\tisShadowPlaceholder,\n\t\t\t\t\t\thasShadow() && inheritedShadow !== undefined\n\t\t\t\t\t) }\n\t\t\t\t\tlabel={ __( 'Shadow' ) }\n\t\t\t\t\thasValue={ hasShadow }\n\t\t\t\t\tonDeselect={ resetShadow }\n\t\t\t\t\tisShownByDefault={ defaultControls.shadow }\n\t\t\t\t\t// The shadow toggle renders its own reset affordance (blue\n\t\t\t\t\t// dot for a local override, default reset otherwise) inside\n\t\t\t\t\t// the control, mirroring the color/gradient controls, so the\n\t\t\t\t\t// panel item must not render a second sibling reset dot.\n\t\t\t\t\tshowLocalOverrideActionsInLabel={ false }\n\t\t\t\t\tpanelId={ panelId }\n\t\t\t\t>\n\t\t\t\t\t{ hasBorderControl ? (\n\t\t\t\t\t\t<BaseControl.VisualLabel as=\"legend\">\n\t\t\t\t\t\t\t{ __( 'Shadow' ) }\n\t\t\t\t\t\t</BaseControl.VisualLabel>\n\t\t\t\t\t) : null }\n\n\t\t\t\t\t<ShadowPopover\n\t\t\t\t\t\tshadow={ shadow }\n\t\t\t\t\t\tonShadowChange={ setShadowWithInheritedCommit }\n\t\t\t\t\t\tsettings={ settings }\n\t\t\t\t\t\thasLocalValue={ hasShadow() }\n\t\t\t\t\t\thasLocalOverride={ hasShadowLocalOverride }\n\t\t\t\t\t\tonReset={ resetShadow }\n\t\t\t\t\t/>\n\t\t\t\t</InheritanceToolsPanelItem>\n\t\t\t) }\n\t\t</Wrapper>\n\t);\n}\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wBAMO;AACP,qBAAqC;AACrC,kBAAmB;AACnB,kCAAqC;AACrC,mCAAgC;AAChC,mBAAmC;AACnC,mBAA+C;AAC/C,oBAA6B;AAC7B,oBAAoC;AACpC,qCAAgD;AAChD,yBAIO;AAuDL;AArDK,SAAS,kBAAmB,UAAW;AAC7C,QAAM,WAAW,OAAO,OAAQ,0BAA2B,QAAS,CAAE;AACtE,SAAO,SAAS,KAAM,OAAQ;AAC/B;AAEO,SAAS,0BAA2B,UAAW;AACrD,QAAM,WAAW;AAAA,IAChB,gBAAgB,yBAA0B,QAAS;AAAA,IACnD,iBAAiB,0BAA2B,QAAS;AAAA,IACrD,gBAAgB,yBAA0B,QAAS;AAAA,IACnD,gBAAgB,yBAA0B,QAAS;AAAA,IACnD,WAAW,oBAAqB,QAAS;AAAA,EAC1C;AAEA,SAAO;AACR;AAEA,SAAS,yBAA0B,UAAW;AAC7C,SAAO,UAAU,QAAQ;AAC1B;AAEA,SAAS,0BAA2B,UAAW;AAC9C,SAAO,UAAU,QAAQ;AAC1B;AAEA,SAAS,yBAA0B,UAAW;AAC7C,SAAO,UAAU,QAAQ;AAC1B;AAEA,SAAS,yBAA0B,UAAW;AAC7C,SAAO,UAAU,QAAQ;AAC1B;AAEA,SAAS,oBAAqB,UAAW;AACxC,QAAM,cAAU,iDAAkB,QAAS;AAC3C,SAAO,CAAC,CAAE,UAAU,UAAU,QAAQ,SAAS;AAChD;AAEA,SAAS,iBAAkB;AAAA,EAC1B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAAI;AACH,QAAM,wBAAoB,6CAA+B;AACzD,QAAM,WAAW,MAAM;AACtB,UAAM,eAAe,eAAgB,KAAM;AAC3C,aAAU,YAAa;AAAA,EACxB;AAEA,SACC;AAAA,IAAC,kBAAAA;AAAA,IAAA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MAEE;AAAA;AAAA,EACH;AAEF;AAEA,IAAM,mBAAmB;AAAA,EACxB,QAAQ;AAAA,EACR,OAAO;AAAA,EACP,OAAO;AAAA,EACP,QAAQ;AACT;AAEe,SAAR,YAA8B;AAAA,EACpC,IAAI,UAAU;AAAA,EACd;AAAA,EACA;AAAA,EACA,iBAAiB;AAAA,EACjB;AAAA,EACA;AAAA,EACA
|
|
4
|
+
"sourcesContent": ["import {\n\tBorderBoxControl,\n\t__experimentalHasSplitBorders as hasSplitBorders,\n\t__experimentalIsDefinedBorder as isDefinedBorder,\n\t__experimentalToolsPanel as ToolsPanel,\n\tBaseControl,\n} from '@wordpress/components';\nimport { useCallback, useMemo } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\nimport { getValueFromVariable } from '@wordpress/global-styles-engine';\nimport BorderRadiusControl from '../border-radius-control';\nimport { useColorsPerOrigin } from './hooks';\nimport { useToolsPanelDropdownMenuProps } from './utils';\nimport { setImmutably } from '../../utils/object';\nimport { useBorderPanelLabel } from '../../hooks/border';\nimport { ShadowPopover, useShadowPresets } from './shadow-panel-components';\nimport {\n\tgetInheritanceProps,\n\tInheritanceToolsPanelItem,\n\tisGlobalStylesInheritanceEnabled,\n} from './inheritance';\n\nexport function useHasBorderPanel( settings ) {\n\tconst controls = Object.values( useHasBorderPanelControls( settings ) );\n\treturn controls.some( Boolean );\n}\n\nexport function useHasBorderPanelControls( settings ) {\n\tconst controls = {\n\t\thasBorderColor: useHasBorderColorControl( settings ),\n\t\thasBorderRadius: useHasBorderRadiusControl( settings ),\n\t\thasBorderStyle: useHasBorderStyleControl( settings ),\n\t\thasBorderWidth: useHasBorderWidthControl( settings ),\n\t\thasShadow: useHasShadowControl( settings ),\n\t};\n\n\treturn controls;\n}\n\nfunction useHasBorderColorControl( settings ) {\n\treturn settings?.border?.color;\n}\n\nfunction useHasBorderRadiusControl( settings ) {\n\treturn settings?.border?.radius;\n}\n\nfunction useHasBorderStyleControl( settings ) {\n\treturn settings?.border?.style;\n}\n\nfunction useHasBorderWidthControl( settings ) {\n\treturn settings?.border?.width;\n}\n\nfunction useHasShadowControl( settings ) {\n\tconst shadows = useShadowPresets( settings );\n\treturn !! settings?.shadow && shadows.length > 0;\n}\n\nfunction BorderToolsPanel( {\n\tresetAllFilter,\n\tonChange,\n\tvalue,\n\tpanelId,\n\tchildren,\n\tlabel,\n} ) {\n\tconst dropdownMenuProps = useToolsPanelDropdownMenuProps();\n\tconst resetAll = () => {\n\t\tconst updatedValue = resetAllFilter( value );\n\t\tonChange( updatedValue );\n\t};\n\n\treturn (\n\t\t<ToolsPanel\n\t\t\tlabel={ label }\n\t\t\tresetAll={ resetAll }\n\t\t\tpanelId={ panelId }\n\t\t\tdropdownMenuProps={ dropdownMenuProps }\n\t\t>\n\t\t\t{ children }\n\t\t</ToolsPanel>\n\t);\n}\n\nconst DEFAULT_CONTROLS = {\n\tradius: true,\n\tcolor: true,\n\twidth: true,\n\tshadow: true,\n};\n\nexport default function BorderPanel( {\n\tas: Wrapper = BorderToolsPanel,\n\tvalue,\n\tonChange,\n\tinheritedValue = value,\n\tsettings,\n\tpanelId,\n\tdefaultControls = DEFAULT_CONTROLS,\n\tshowInheritanceLabelIndicators = isGlobalStylesInheritanceEnabled(),\n} ) {\n\tconst colors = useColorsPerOrigin( settings );\n\tconst areCustomSolidsEnabled = settings?.color?.custom;\n\tconst decodeValue = useCallback(\n\t\t( rawValue ) => getValueFromVariable( { settings }, '', rawValue ),\n\t\t[ settings ]\n\t);\n\t// Always keep the layout className (e.g. `single-column`); only the\n\t// inheritance treatment is gated on `showInheritanceLabelIndicators`.\n\tconst inheritanceProps = ( isInherited, hasLocalOverride, className ) =>\n\t\tgetInheritanceProps(\n\t\t\tshowInheritanceLabelIndicators && isInherited,\n\t\t\tshowInheritanceLabelIndicators && hasLocalOverride,\n\t\t\tclassName\n\t\t);\n\tconst encodeColorValue = ( colorValue ) => {\n\t\tconst allColors = colors.flatMap(\n\t\t\t( { colors: originColors } ) => originColors\n\t\t);\n\t\tconst colorObject = allColors.find(\n\t\t\t( { color } ) => color === colorValue\n\t\t);\n\t\treturn colorObject\n\t\t\t? 'var:preset|color|' + colorObject.slug\n\t\t\t: colorValue;\n\t};\n\t// Decode a `border` sub-tree (handles split borders + flat shape).\n\tconst decodeBorder = useCallback(\n\t\t( source ) => {\n\t\t\tif ( ! source ) {\n\t\t\t\treturn undefined;\n\t\t\t}\n\t\t\tif ( hasSplitBorders( source ) ) {\n\t\t\t\tconst out = { ...source };\n\t\t\t\t[ 'top', 'right', 'bottom', 'left' ].forEach( ( side ) => {\n\t\t\t\t\tout[ side ] = {\n\t\t\t\t\t\t...out[ side ],\n\t\t\t\t\t\tcolor: decodeValue( out[ side ]?.color ),\n\t\t\t\t\t};\n\t\t\t\t} );\n\t\t\t\treturn out;\n\t\t\t}\n\t\t\treturn {\n\t\t\t\t...source,\n\t\t\t\tcolor: source.color ? decodeValue( source.color ) : undefined,\n\t\t\t};\n\t\t},\n\t\t[ decodeValue ]\n\t);\n\t// Local-then-inherited: prefer the user's locally-set border (whether\n\t// flat or split) when defined, otherwise fall back to the inherited\n\t// Global Styles border. The merge happens at the sub-tree root, not\n\t// at the leaf level — borders are commonly authored as a single\n\t// affordance in the inspector, so partial leaf merges would be\n\t// surprising.\n\tconst localBorder = useMemo(\n\t\t() => decodeBorder( value?.border ),\n\t\t[ value?.border, decodeBorder ]\n\t);\n\tconst inheritedBorder = useMemo(\n\t\t() => decodeBorder( inheritedValue?.border ),\n\t\t[ inheritedValue?.border, decodeBorder ]\n\t);\n\tconst isBorderPlaceholder =\n\t\t! isDefinedBorder( value?.border ) &&\n\t\t!! inheritedBorder &&\n\t\tisDefinedBorder( inheritedBorder );\n\tconst border = isBorderPlaceholder ? inheritedBorder : localBorder;\n\tconst setBorder = ( newBorder ) =>\n\t\tonChange( { ...value, border: newBorder } );\n\tconst showBorderColor = useHasBorderColorControl( settings );\n\tconst showBorderStyle = useHasBorderStyleControl( settings );\n\tconst showBorderWidth = useHasBorderWidthControl( settings );\n\n\t// Border radius. Display inherited values through the control's `values`\n\t// prop when local values are empty so UnitControl can parse the numeric\n\t// quantity and selected unit normally (e.g. `2.5em` -> `2.5` + `em`).\n\t// `hasBorderRadius` remains local-only, so displaying the inherited value\n\t// does not mark the ToolsPanel item as customised or commit on mount.\n\tconst showBorderRadius = useHasBorderRadiusControl( settings );\n\tconst localBorderRadius = useMemo( () => {\n\t\tif ( typeof value?.border?.radius !== 'object' ) {\n\t\t\treturn decodeValue( value?.border?.radius );\n\t\t}\n\t\treturn {\n\t\t\ttopLeft: decodeValue( value?.border?.radius?.topLeft ),\n\t\t\ttopRight: decodeValue( value?.border?.radius?.topRight ),\n\t\t\tbottomLeft: decodeValue( value?.border?.radius?.bottomLeft ),\n\t\t\tbottomRight: decodeValue( value?.border?.radius?.bottomRight ),\n\t\t};\n\t}, [ value?.border?.radius, decodeValue ] );\n\tconst inheritedBorderRadius = useMemo( () => {\n\t\tconst rawRadius = inheritedValue?.border?.radius;\n\t\tif ( typeof rawRadius !== 'object' ) {\n\t\t\treturn decodeValue( rawRadius );\n\t\t}\n\t\treturn {\n\t\t\ttopLeft: decodeValue( rawRadius?.topLeft ),\n\t\t\ttopRight: decodeValue( rawRadius?.topRight ),\n\t\t\tbottomLeft: decodeValue( rawRadius?.bottomLeft ),\n\t\t\tbottomRight: decodeValue( rawRadius?.bottomRight ),\n\t\t};\n\t}, [ inheritedValue?.border?.radius, decodeValue ] );\n\t// Spread the local border, not the merged display value, or setting a\n\t// radius bakes the inherited border into the local override. Mirror of\n\t// the guard in `onBorderChange`.\n\tconst setBorderRadius = ( newBorderRadius ) =>\n\t\tsetBorder( { ...value?.border, radius: newBorderRadius } );\n\tconst hasBorderRadius = () => {\n\t\tconst borderValues = value?.border?.radius;\n\t\tif ( typeof borderValues === 'object' ) {\n\t\t\treturn Object.entries( borderValues ).some( ( [ , v ] ) => !! v );\n\t\t}\n\t\treturn !! borderValues;\n\t};\n\tconst isBorderRadiusPlaceholder =\n\t\t! hasBorderRadius() &&\n\t\tinheritedBorderRadius !== undefined &&\n\t\tinheritedBorderRadius !== '';\n\t// Build an object value so unlinked-mode shows per-corner inherited\n\t// values. The control accepts either a string or an object; passing the\n\t// object form is correct in both modes (the control collapses to the\n\t// `all`/first corner in linked mode).\n\tconst borderRadius = useMemo( () => {\n\t\tif ( ! isBorderRadiusPlaceholder ) {\n\t\t\treturn localBorderRadius;\n\t\t}\n\t\tif ( typeof inheritedBorderRadius === 'string' ) {\n\t\t\treturn inheritedBorderRadius;\n\t\t}\n\t\tconst obj = inheritedBorderRadius;\n\t\tif ( ! obj ) {\n\t\t\treturn localBorderRadius;\n\t\t}\n\t\tconst all =\n\t\t\tobj.topLeft &&\n\t\t\tobj.topLeft === obj.topRight &&\n\t\t\tobj.topLeft === obj.bottomLeft &&\n\t\t\tobj.topLeft === obj.bottomRight\n\t\t\t\t? obj.topLeft\n\t\t\t\t: undefined;\n\t\treturn { all, ...obj };\n\t}, [\n\t\tisBorderRadiusPlaceholder,\n\t\tlocalBorderRadius,\n\t\tinheritedBorderRadius,\n\t] );\n\tconst hasShadowControl = useHasShadowControl( settings );\n\n\t// Shadow. At rest, the popover toggle button uses the placeholder\n\t// treatment, and the popover preset list pre-selects the inherited shadow.\n\t// The interceptor below recognises the user's \"accept inherited\" click as\n\t// an explicit commit, mirroring the ToggleGroup pattern in the typography\n\t// panel.\n\tconst localShadow = decodeValue( value?.shadow );\n\tconst inheritedShadow = decodeValue( inheritedValue?.shadow );\n\tconst isShadowPlaceholder =\n\t\tlocalShadow === undefined &&\n\t\tinheritedShadow !== undefined &&\n\t\tinheritedShadow !== '';\n\tconst shadow = isShadowPlaceholder ? inheritedShadow : localShadow;\n\t// The presets the popover offers, from every origin. A preset the user\n\t// picked has to be stored as a reference to its CSS variable rather than as\n\t// the value it resolves to today, otherwise it stops tracking later edits\n\t// to the preset. Reading the same list the popover renders is what keeps\n\t// the two in step.\n\tconst shadowPresets = useShadowPresets( settings );\n\tconst setShadow = ( newValue ) => {\n\t\t// The list runs default, theme, custom, so searching backwards picks\n\t\t// the most specific origin when more than one defines the same shadow\n\t\t// value — a newly added custom preset starts out identical to the\n\t\t// `natural` default one, and it is the custom slug the user means.\n\t\tconst slug = shadowPresets.findLast(\n\t\t\t( { shadow: shadowName } ) => shadowName === newValue\n\t\t)?.slug;\n\n\t\tonChange(\n\t\t\tsetImmutably(\n\t\t\t\tvalue,\n\t\t\t\t[ 'shadow' ],\n\t\t\t\tslug ? `var:preset|shadow|${ slug }` : newValue || undefined\n\t\t\t)\n\t\t);\n\t};\n\t// Display-without-commit interceptor for the shadow preset list. When the\n\t// user is at the at-rest preselect (local is undefined, inherited is the\n\t// active shadow), `ShadowPresets`' default toggle-off behaviour would\n\t// interpret the click on the highlighted preset as `undefined` (clear).\n\t// Re-route it to an explicit commit of the inherited value, so clicking\n\t// the visible preselected preset is the user's \"accept this inherited\n\t// value\" affordance.\n\tconst setShadowWithInheritedCommit = ( newValue ) => {\n\t\tif ( isShadowPlaceholder && newValue === undefined ) {\n\t\t\tsetShadow( inheritedShadow );\n\t\t\treturn;\n\t\t}\n\t\tsetShadow( newValue );\n\t};\n\tconst hasShadow = () => !! value?.shadow;\n\tconst resetShadow = () => setShadow( undefined );\n\t// A local override exists when the user has set a shadow that shadows an\n\t// inherited one. Only then does the toggle render the blue-dot reset\n\t// affordance (mirroring the color/gradient controls); a merely-inherited\n\t// value at rest shows no reset button.\n\tconst hasShadowLocalOverride =\n\t\tshowInheritanceLabelIndicators &&\n\t\thasShadow() &&\n\t\tinheritedShadow !== undefined;\n\n\tconst resetBorder = () => {\n\t\tif ( hasBorderRadius() ) {\n\t\t\treturn setBorder( { radius: value?.border?.radius } );\n\t\t}\n\n\t\tsetBorder( undefined );\n\t};\n\n\tconst onBorderChange = ( newBorder ) => {\n\t\t// Ensure we have a visible border style when a border width or\n\t\t// color is being selected.\n\t\tconst updatedBorder = { ...newBorder };\n\n\t\tif ( hasSplitBorders( updatedBorder ) ) {\n\t\t\t[ 'top', 'right', 'bottom', 'left' ].forEach( ( side ) => {\n\t\t\t\tif ( updatedBorder[ side ] ) {\n\t\t\t\t\tupdatedBorder[ side ] = {\n\t\t\t\t\t\t...updatedBorder[ side ],\n\t\t\t\t\t\tcolor: encodeColorValue( updatedBorder[ side ]?.color ),\n\t\t\t\t\t};\n\t\t\t\t}\n\t\t\t} );\n\t\t} else if ( updatedBorder ) {\n\t\t\tupdatedBorder.color = encodeColorValue( updatedBorder.color );\n\t\t}\n\n\t\t// As radius is maintained separately to color, style, and width\n\t\t// maintain its value. Read from `value` (local-only) rather than\n\t\t// `border` (the merged display value), otherwise an inherited\n\t\t// radius gets baked into the local override every time the\n\t\t// user touches color/style/width — which both pollutes the\n\t\t// stored attribute and causes the radius `ToolsPanelItem` to\n\t\t// flip into the `has-local-override-from-global-styles` state\n\t\t// even though the user never customised the radius. The\n\t\t// `radius` key must come after the spread so it wins over any\n\t\t// `radius` field forwarded by `BorderBoxControl`'s inner\n\t\t// `BorderControl`, which merges its incoming `value` with the\n\t\t// changed prop. Undefined values here will be cleaned when\n\t\t// global styles are saved.\n\t\tsetBorder( {\n\t\t\t...updatedBorder,\n\t\t\tradius: value?.border?.radius,\n\t\t} );\n\t};\n\n\tconst resetAllFilter = useCallback( ( previousValue ) => {\n\t\treturn {\n\t\t\t...previousValue,\n\t\t\tborder: undefined,\n\t\t\tshadow: undefined,\n\t\t};\n\t}, [] );\n\n\tconst showBorderByDefault =\n\t\tdefaultControls?.color || defaultControls?.width;\n\n\tconst hasBorderControl =\n\t\tshowBorderColor ||\n\t\tshowBorderStyle ||\n\t\tshowBorderWidth ||\n\t\tshowBorderRadius;\n\n\tconst label = useBorderPanelLabel( {\n\t\thasShadowControl,\n\t\thasBorderControl,\n\t} );\n\n\treturn (\n\t\t<Wrapper\n\t\t\tresetAllFilter={ resetAllFilter }\n\t\t\tvalue={ value }\n\t\t\tonChange={ onChange }\n\t\t\tpanelId={ panelId }\n\t\t\tlabel={ label }\n\t\t>\n\t\t\t{ ( showBorderWidth || showBorderColor ) && (\n\t\t\t\t<InheritanceToolsPanelItem\n\t\t\t\t\t{ ...inheritanceProps(\n\t\t\t\t\t\tisBorderPlaceholder,\n\t\t\t\t\t\tisDefinedBorder( value?.border ) &&\n\t\t\t\t\t\t\t!! inheritedBorder &&\n\t\t\t\t\t\t\tisDefinedBorder( inheritedBorder )\n\t\t\t\t\t) }\n\t\t\t\t\thasValue={ () => isDefinedBorder( value?.border ) }\n\t\t\t\t\tlabel={ __( 'Border' ) }\n\t\t\t\t\tonDeselect={ () => resetBorder() }\n\t\t\t\t\tisShownByDefault={ showBorderByDefault }\n\t\t\t\t\tpanelId={ panelId }\n\t\t\t\t>\n\t\t\t\t\t{ ( showInheritanceLabelIndicators ||\n\t\t\t\t\t\thasShadowControl ) && (\n\t\t\t\t\t\t// Render the visible label as `BaseControl.VisualLabel`\n\t\t\t\t\t\t// (which produces `.components-base-control__label`)\n\t\t\t\t\t\t// rather than passing `label` to `BorderBoxControl`,\n\t\t\t\t\t\t// whose internal `<StyledLabel>` carries no stable\n\t\t\t\t\t\t// className. The inheritance treatment and the\n\t\t\t\t\t\t// local-override reset affordance both target\n\t\t\t\t\t\t// `.components-base-control__label`, so the visible\n\t\t\t\t\t\t// \"Border\" label has to be a `BaseControl` label to\n\t\t\t\t\t\t// receive them.\n\t\t\t\t\t\t//\n\t\t\t\t\t\t// Render it whenever a Shadow control is also present so\n\t\t\t\t\t\t// the two controls stay disambiguated (mirrors the\n\t\t\t\t\t\t// Shadow label's `hasBorderControl` guard below, and\n\t\t\t\t\t\t// trunk's `hideLabelFromVision={ ! hasShadowControl }`),\n\t\t\t\t\t\t// even when inheritance indicators are off (e.g. in\n\t\t\t\t\t\t// Global Styles).\n\t\t\t\t\t\t<BaseControl.VisualLabel as=\"legend\">\n\t\t\t\t\t\t\t{ __( 'Border' ) }\n\t\t\t\t\t\t</BaseControl.VisualLabel>\n\t\t\t\t\t) }\n\t\t\t\t\t<BorderBoxControl\n\t\t\t\t\t\tcolors={ colors }\n\t\t\t\t\t\tdisableCustomColors={ ! areCustomSolidsEnabled }\n\t\t\t\t\t\tenableAlpha\n\t\t\t\t\t\tenableStyle={ showBorderStyle }\n\t\t\t\t\t\tonChange={ onBorderChange }\n\t\t\t\t\t\tpopoverOffset={ 40 }\n\t\t\t\t\t\tpopoverPlacement=\"left-start\"\n\t\t\t\t\t\tvalue={ border }\n\t\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t\t/>\n\t\t\t\t</InheritanceToolsPanelItem>\n\t\t\t) }\n\t\t\t{ showBorderRadius && (\n\t\t\t\t<InheritanceToolsPanelItem\n\t\t\t\t\t{ ...inheritanceProps(\n\t\t\t\t\t\tisBorderRadiusPlaceholder,\n\t\t\t\t\t\thasBorderRadius() && inheritedBorderRadius !== undefined\n\t\t\t\t\t) }\n\t\t\t\t\thasValue={ hasBorderRadius }\n\t\t\t\t\tlabel={ __( 'Radius' ) }\n\t\t\t\t\thasInlineEndToggle\n\t\t\t\t\tonDeselect={ () => setBorderRadius( undefined ) }\n\t\t\t\t\tisShownByDefault={ defaultControls.radius }\n\t\t\t\t\tpanelId={ panelId }\n\t\t\t\t>\n\t\t\t\t\t<BorderRadiusControl\n\t\t\t\t\t\tpresets={ settings?.border?.radiusSizes }\n\t\t\t\t\t\tvalues={ borderRadius }\n\t\t\t\t\t\tonChange={ ( newValue ) => {\n\t\t\t\t\t\t\tsetBorderRadius( newValue || undefined );\n\t\t\t\t\t\t} }\n\t\t\t\t\t/>\n\t\t\t\t</InheritanceToolsPanelItem>\n\t\t\t) }\n\t\t\t{ hasShadowControl && (\n\t\t\t\t<InheritanceToolsPanelItem\n\t\t\t\t\t{ ...inheritanceProps(\n\t\t\t\t\t\tisShadowPlaceholder,\n\t\t\t\t\t\thasShadow() && inheritedShadow !== undefined\n\t\t\t\t\t) }\n\t\t\t\t\tlabel={ __( 'Shadow' ) }\n\t\t\t\t\thasValue={ hasShadow }\n\t\t\t\t\tonDeselect={ resetShadow }\n\t\t\t\t\tisShownByDefault={ defaultControls.shadow }\n\t\t\t\t\t// The shadow toggle renders its own reset affordance (blue\n\t\t\t\t\t// dot for a local override, default reset otherwise) inside\n\t\t\t\t\t// the control, mirroring the color/gradient controls, so the\n\t\t\t\t\t// panel item must not render a second sibling reset dot.\n\t\t\t\t\tshowLocalOverrideActionsInLabel={ false }\n\t\t\t\t\tpanelId={ panelId }\n\t\t\t\t>\n\t\t\t\t\t{ hasBorderControl ? (\n\t\t\t\t\t\t<BaseControl.VisualLabel as=\"legend\">\n\t\t\t\t\t\t\t{ __( 'Shadow' ) }\n\t\t\t\t\t\t</BaseControl.VisualLabel>\n\t\t\t\t\t) : null }\n\n\t\t\t\t\t<ShadowPopover\n\t\t\t\t\t\tshadow={ shadow }\n\t\t\t\t\t\tonShadowChange={ setShadowWithInheritedCommit }\n\t\t\t\t\t\tsettings={ settings }\n\t\t\t\t\t\thasLocalValue={ hasShadow() }\n\t\t\t\t\t\thasLocalOverride={ hasShadowLocalOverride }\n\t\t\t\t\t\tonReset={ resetShadow }\n\t\t\t\t\t/>\n\t\t\t\t</InheritanceToolsPanelItem>\n\t\t\t) }\n\t\t</Wrapper>\n\t);\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["ToolsPanel", "hasSplitBorders", "isDefinedBorder", "BorderRadiusControl"]
|
|
7
7
|
}
|
|
@@ -132,6 +132,7 @@ function ColorPanel({
|
|
|
132
132
|
label,
|
|
133
133
|
children,
|
|
134
134
|
contrastWarning,
|
|
135
|
+
additionalElements,
|
|
135
136
|
showInheritanceLabelIndicators = (0, import_inheritance.isGlobalStylesInheritanceEnabled)()
|
|
136
137
|
}) {
|
|
137
138
|
const {
|
|
@@ -238,9 +239,20 @@ function ColorPanel({
|
|
|
238
239
|
name: "h6",
|
|
239
240
|
label: (0, import_i18n.__)("H6"),
|
|
240
241
|
showPanel: showHeadingPanel
|
|
241
|
-
}
|
|
242
|
+
},
|
|
243
|
+
...additionalElements?.map((element) => ({
|
|
244
|
+
...element,
|
|
245
|
+
showPanel: hasSolidColors || hasGradientColors
|
|
246
|
+
})) ?? []
|
|
242
247
|
],
|
|
243
|
-
[
|
|
248
|
+
[
|
|
249
|
+
additionalElements,
|
|
250
|
+
hasGradientColors,
|
|
251
|
+
hasSolidColors,
|
|
252
|
+
showCaptionPanel,
|
|
253
|
+
showButtonPanel,
|
|
254
|
+
showHeadingPanel
|
|
255
|
+
]
|
|
244
256
|
);
|
|
245
257
|
const resetAllFilter = (0, import_element.useCallback)(
|
|
246
258
|
(previousValue) => {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/global-styles/color-panel.js"],
|
|
4
|
-
"sourcesContent": ["import { __experimentalToolsPanel as ToolsPanel } from '@wordpress/components';\nimport { useCallback, useMemo } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\nimport { getCSSValueFromRawStyle } from '@wordpress/style-engine';\nimport ColorGradientDropdownItem from './color-gradient-dropdown-item';\nimport {\n\tuseColorsPerOrigin,\n\tuseGradientsPerOrigin,\n\tuseColorGradientSettings,\n} from './hooks';\nimport { useToolsPanelDropdownMenuProps } from './utils';\nimport { setImmutably } from '../../utils/object';\nimport {\n\textractPresetSlug,\n\tencodeColorValueWithPalette,\n} from '../../utils/color-values';\nimport { isGlobalStylesInheritanceEnabled } from './inheritance';\n\n// Despite the \"ColorPanel\" name, this gates only the element-level color\n// controls (link, heading, button, caption, h1–h6) — surfaced as the\n// \"Elements\" panel in the block inspector and the \"Colors\" screen in\n// Global Styles. Top-level text and background color moved to the\n// Typography and Background panels, so this returns false for blocks\n// whose only color support is text and/or background.\nexport function useHasColorPanel( settings ) {\n\tconst hasLinkPanel = useHasLinkPanel( settings );\n\tconst hasHeadingPanel = useHasHeadingPanel( settings );\n\tconst hasButtonPanel = useHasButtonPanel( settings );\n\tconst hasCaptionPanel = useHasCaptionPanel( settings );\n\n\treturn hasLinkPanel || hasHeadingPanel || hasButtonPanel || hasCaptionPanel;\n}\n\nexport function useHasTextPanel( settings ) {\n\tconst colors = useColorsPerOrigin( settings );\n\treturn (\n\t\tsettings?.color?.text &&\n\t\t( colors?.length > 0 || settings?.color?.custom )\n\t);\n}\n\nexport function useHasLinkPanel( settings ) {\n\tconst colors = useColorsPerOrigin( settings );\n\treturn (\n\t\tsettings?.color?.link &&\n\t\t( colors?.length > 0 || settings?.color?.custom )\n\t);\n}\n\nexport function useHasCaptionPanel( settings ) {\n\tconst colors = useColorsPerOrigin( settings );\n\treturn (\n\t\tsettings?.color?.caption &&\n\t\t( colors?.length > 0 || settings?.color?.custom )\n\t);\n}\n\nexport function useHasHeadingPanel( settings ) {\n\tconst colors = useColorsPerOrigin( settings );\n\tconst gradients = useGradientsPerOrigin( settings );\n\treturn (\n\t\tsettings?.color?.heading &&\n\t\t( colors?.length > 0 ||\n\t\t\tsettings?.color?.custom ||\n\t\t\tgradients?.length > 0 ||\n\t\t\tsettings?.color?.customGradient )\n\t);\n}\n\nexport function useHasButtonPanel( settings ) {\n\tconst colors = useColorsPerOrigin( settings );\n\tconst gradients = useGradientsPerOrigin( settings );\n\treturn (\n\t\tsettings?.color?.button &&\n\t\t( colors?.length > 0 ||\n\t\t\tsettings?.color?.custom ||\n\t\t\tgradients?.length > 0 ||\n\t\t\tsettings?.color?.customGradient )\n\t);\n}\n\nexport function useHasBackgroundColorPanel( settings ) {\n\tconst colors = useColorsPerOrigin( settings );\n\tconst gradients = useGradientsPerOrigin( settings );\n\treturn (\n\t\tsettings?.color?.background &&\n\t\t( colors?.length > 0 ||\n\t\t\tsettings?.color?.custom ||\n\t\t\tgradients?.length > 0 ||\n\t\t\tsettings?.color?.customGradient )\n\t);\n}\n\nexport function ColorToolsPanel( {\n\tresetAllFilter,\n\tonChange,\n\tvalue,\n\tpanelId,\n\tchildren,\n\tlabel,\n} ) {\n\tconst dropdownMenuProps = useToolsPanelDropdownMenuProps();\n\tconst resetAll = () => {\n\t\tconst updatedValue = resetAllFilter( value );\n\t\tonChange( updatedValue );\n\t};\n\n\treturn (\n\t\t<ToolsPanel\n\t\t\tlabel={ label || __( 'Elements' ) }\n\t\t\tresetAll={ resetAll }\n\t\t\tpanelId={ panelId }\n\t\t\thasInnerWrapper\n\t\t\theadingLevel={ 3 }\n\t\t\tclassName=\"color-block-support-panel\"\n\t\t\t__experimentalFirstVisibleItemClass=\"first\"\n\t\t\t__experimentalLastVisibleItemClass=\"last\"\n\t\t\tdropdownMenuProps={ dropdownMenuProps }\n\t\t>\n\t\t\t<div className=\"color-block-support-panel__inner-wrapper\">\n\t\t\t\t{ children }\n\t\t\t</div>\n\t\t</ToolsPanel>\n\t);\n}\n\nconst DEFAULT_CONTROLS = {\n\tlink: true,\n\theading: true,\n\tbutton: true,\n\tcaption: true,\n};\n\nexport default function ColorPanel( {\n\tas: Wrapper = ColorToolsPanel,\n\tvalue,\n\tonChange,\n\tinheritedValue = value,\n\tsettings,\n\tpanelId,\n\tdefaultControls = DEFAULT_CONTROLS,\n\tlabel,\n\tchildren,\n\tcontrastWarning,\n\tshowInheritanceLabelIndicators = isGlobalStylesInheritanceEnabled(),\n} ) {\n\tconst {\n\t\tcolors,\n\t\tgradients,\n\t\tareCustomSolidsEnabled,\n\t\tareCustomGradientsEnabled,\n\t\thasSolidColors,\n\t\thasGradientColors,\n\t\tallColors,\n\t\tdecodeValue,\n\t\tencodeGradientValue,\n\t} = useColorGradientSettings( settings );\n\n\t// When an inherited preset isn't in the panel's palette, `decodeValue`\n\t// returns the raw `var:preset|…` token rather than a paintable colour.\n\t// Fall back to its CSS custom property so the swatch still renders.\n\tconst decodeInheritedColor = ( rawValue ) =>\n\t\tgetCSSValueFromRawStyle( decodeValue( rawValue ) );\n\n\t// Links\n\tconst showLinkPanel = useHasLinkPanel( settings );\n\tconst linkColor = decodeInheritedColor(\n\t\tinheritedValue?.elements?.link?.color?.text\n\t);\n\tconst userLinkColor = decodeValue( value?.elements?.link?.color?.text );\n\tconst setLinkColor = ( newColor, newSlug ) => {\n\t\tonChange(\n\t\t\tsetImmutably(\n\t\t\t\tvalue,\n\t\t\t\t[ 'elements', 'link', 'color', 'text' ],\n\t\t\t\tencodeColorValueWithPalette( allColors, newColor, newSlug )\n\t\t\t)\n\t\t);\n\t};\n\tconst hoverLinkColor = decodeInheritedColor(\n\t\tinheritedValue?.elements?.link?.[ ':hover' ]?.color?.text\n\t);\n\tconst userHoverLinkColor = decodeValue(\n\t\tvalue?.elements?.link?.[ ':hover' ]?.color?.text\n\t);\n\tconst setHoverLinkColor = ( newColor, newSlug ) => {\n\t\tonChange(\n\t\t\tsetImmutably(\n\t\t\t\tvalue,\n\t\t\t\t[ 'elements', 'link', ':hover', 'color', 'text' ],\n\t\t\t\tencodeColorValueWithPalette( allColors, newColor, newSlug )\n\t\t\t)\n\t\t);\n\t};\n\tconst hasLink = () => !! userLinkColor || !! userHoverLinkColor;\n\tconst resetLink = () => {\n\t\tlet newValue = setImmutably(\n\t\t\tvalue,\n\t\t\t[ 'elements', 'link', ':hover', 'color', 'text' ],\n\t\t\tundefined\n\t\t);\n\t\tnewValue = setImmutably(\n\t\t\tnewValue,\n\t\t\t[ 'elements', 'link', 'color', 'text' ],\n\t\t\tundefined\n\t\t);\n\t\tonChange( newValue );\n\t};\n\n\tconst showCaptionPanel = useHasCaptionPanel( settings );\n\tconst showButtonPanel = useHasButtonPanel( settings );\n\tconst showHeadingPanel = useHasHeadingPanel( settings );\n\n\t// Elements\n\tconst elements = useMemo(\n\t\t() => [\n\t\t\t{\n\t\t\t\tname: 'caption',\n\t\t\t\tlabel: __( 'Captions' ),\n\t\t\t\tshowPanel: showCaptionPanel,\n\t\t\t},\n\t\t\t{\n\t\t\t\tname: 'button',\n\t\t\t\tlabel: __( 'Button' ),\n\t\t\t\tshowPanel: showButtonPanel,\n\t\t\t},\n\t\t\t{\n\t\t\t\tname: 'heading',\n\t\t\t\tlabel: __( 'Heading' ),\n\t\t\t\tshowPanel: showHeadingPanel,\n\t\t\t},\n\t\t\t{\n\t\t\t\tname: 'h1',\n\t\t\t\tlabel: __( 'H1' ),\n\t\t\t\tshowPanel: showHeadingPanel,\n\t\t\t},\n\t\t\t{\n\t\t\t\tname: 'h2',\n\t\t\t\tlabel: __( 'H2' ),\n\t\t\t\tshowPanel: showHeadingPanel,\n\t\t\t},\n\t\t\t{\n\t\t\t\tname: 'h3',\n\t\t\t\tlabel: __( 'H3' ),\n\t\t\t\tshowPanel: showHeadingPanel,\n\t\t\t},\n\t\t\t{\n\t\t\t\tname: 'h4',\n\t\t\t\tlabel: __( 'H4' ),\n\t\t\t\tshowPanel: showHeadingPanel,\n\t\t\t},\n\t\t\t{\n\t\t\t\tname: 'h5',\n\t\t\t\tlabel: __( 'H5' ),\n\t\t\t\tshowPanel: showHeadingPanel,\n\t\t\t},\n\t\t\t{\n\t\t\t\tname: 'h6',\n\t\t\t\tlabel: __( 'H6' ),\n\t\t\t\tshowPanel: showHeadingPanel,\n\t\t\t},\n\t\t],\n\t\t[ showCaptionPanel, showButtonPanel, showHeadingPanel ]\n\t);\n\n\tconst resetAllFilter = useCallback(\n\t\t( previousValue ) => {\n\t\t\treturn {\n\t\t\t\t...previousValue,\n\t\t\t\telements: {\n\t\t\t\t\t...previousValue?.elements,\n\t\t\t\t\tlink: {\n\t\t\t\t\t\t...previousValue?.elements?.link,\n\t\t\t\t\t\tcolor: undefined,\n\t\t\t\t\t\t':hover': {\n\t\t\t\t\t\t\tcolor: undefined,\n\t\t\t\t\t\t},\n\t\t\t\t\t},\n\t\t\t\t\t...elements.reduce( ( acc, element ) => {\n\t\t\t\t\t\treturn {\n\t\t\t\t\t\t\t...acc,\n\t\t\t\t\t\t\t[ element.name ]: {\n\t\t\t\t\t\t\t\t...previousValue?.elements?.[ element.name ],\n\t\t\t\t\t\t\t\tcolor: undefined,\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},\n\t\t\t};\n\t\t},\n\t\t[ elements ]\n\t);\n\n\tconst items = [\n\t\tshowLinkPanel && {\n\t\t\tkey: 'link',\n\t\t\tlabel: __( 'Link' ),\n\t\t\thasValue: hasLink,\n\t\t\tresetValue: resetLink,\n\t\t\tisShownByDefault: defaultControls.link,\n\t\t\tindicators: [\n\t\t\t\tuserLinkColor ?? linkColor,\n\t\t\t\tuserHoverLinkColor ?? hoverLinkColor,\n\t\t\t],\n\t\t\tisPlaceholder:\n\t\t\t\tuserLinkColor === undefined &&\n\t\t\t\tuserHoverLinkColor === undefined &&\n\t\t\t\t( linkColor !== undefined || hoverLinkColor !== undefined ),\n\t\t\thasInheritedValue:\n\t\t\t\tlinkColor !== undefined || hoverLinkColor !== undefined,\n\t\t\tcontrastWarning,\n\t\t\ttabs: [\n\t\t\t\t{\n\t\t\t\t\tkey: 'link',\n\t\t\t\t\tlabel: __( 'Default' ),\n\t\t\t\t\tinheritedValue: linkColor,\n\t\t\t\t\tinheritedSlug: extractPresetSlug(\n\t\t\t\t\t\tinheritedValue?.elements?.link?.color?.text,\n\t\t\t\t\t\t'color'\n\t\t\t\t\t),\n\t\t\t\t\tuserSlug: extractPresetSlug(\n\t\t\t\t\t\tvalue?.elements?.link?.color?.text,\n\t\t\t\t\t\t'color'\n\t\t\t\t\t),\n\t\t\t\t\tsetValue: setLinkColor,\n\t\t\t\t\tuserValue: userLinkColor,\n\t\t\t\t\tisPlaceholder:\n\t\t\t\t\t\tuserLinkColor === undefined && linkColor !== undefined,\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\tkey: 'hover',\n\t\t\t\t\tlabel: __( 'Hover' ),\n\t\t\t\t\tinheritedValue: hoverLinkColor,\n\t\t\t\t\tinheritedSlug: extractPresetSlug(\n\t\t\t\t\t\tinheritedValue?.elements?.link?.[ ':hover' ]?.color\n\t\t\t\t\t\t\t?.text,\n\t\t\t\t\t\t'color'\n\t\t\t\t\t),\n\t\t\t\t\tuserSlug: extractPresetSlug(\n\t\t\t\t\t\tvalue?.elements?.link?.[ ':hover' ]?.color?.text,\n\t\t\t\t\t\t'color'\n\t\t\t\t\t),\n\t\t\t\t\tsetValue: setHoverLinkColor,\n\t\t\t\t\tuserValue: userHoverLinkColor,\n\t\t\t\t\tisPlaceholder:\n\t\t\t\t\t\tuserHoverLinkColor === undefined &&\n\t\t\t\t\t\thoverLinkColor !== undefined,\n\t\t\t\t},\n\t\t\t],\n\t\t},\n\t].filter( Boolean );\n\n\telements.forEach( ( { name, label: elementLabel, showPanel } ) => {\n\t\tif ( ! showPanel ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst elementBackgroundColor = decodeInheritedColor(\n\t\t\tinheritedValue?.elements?.[ name ]?.color?.background\n\t\t);\n\t\tconst elementGradient = decodeInheritedColor(\n\t\t\tinheritedValue?.elements?.[ name ]?.color?.gradient\n\t\t);\n\t\tconst elementTextColor = decodeInheritedColor(\n\t\t\tinheritedValue?.elements?.[ name ]?.color?.text\n\t\t);\n\t\tconst elementBackgroundUserColor = decodeValue(\n\t\t\tvalue?.elements?.[ name ]?.color?.background\n\t\t);\n\t\tconst elementGradientUserColor = decodeValue(\n\t\t\tvalue?.elements?.[ name ]?.color?.gradient\n\t\t);\n\t\tconst elementTextUserColor = decodeValue(\n\t\t\tvalue?.elements?.[ name ]?.color?.text\n\t\t);\n\t\tconst hasElement = () =>\n\t\t\t!! (\n\t\t\t\telementTextUserColor ||\n\t\t\t\telementBackgroundUserColor ||\n\t\t\t\telementGradientUserColor\n\t\t\t);\n\t\tconst resetElement = () => {\n\t\t\tconst newValue = setImmutably(\n\t\t\t\tvalue,\n\t\t\t\t[ 'elements', name, 'color', 'background' ],\n\t\t\t\tundefined\n\t\t\t);\n\t\t\tnewValue.elements[ name ].color.gradient = undefined;\n\t\t\tnewValue.elements[ name ].color.text = undefined;\n\t\t\tonChange( newValue );\n\t\t};\n\n\t\tconst setElementTextColor = ( newTextColor, newSlug ) => {\n\t\t\tonChange(\n\t\t\t\tsetImmutably(\n\t\t\t\t\tvalue,\n\t\t\t\t\t[ 'elements', name, 'color', 'text' ],\n\t\t\t\t\tencodeColorValueWithPalette(\n\t\t\t\t\t\tallColors,\n\t\t\t\t\t\tnewTextColor,\n\t\t\t\t\t\tnewSlug\n\t\t\t\t\t)\n\t\t\t\t)\n\t\t\t);\n\t\t};\n\t\tconst setElementBackgroundColor = ( newBackgroundColor, newSlug ) => {\n\t\t\tconst newValue = setImmutably(\n\t\t\t\tvalue,\n\t\t\t\t[ 'elements', name, 'color', 'background' ],\n\t\t\t\tencodeColorValueWithPalette(\n\t\t\t\t\tallColors,\n\t\t\t\t\tnewBackgroundColor,\n\t\t\t\t\tnewSlug\n\t\t\t\t)\n\t\t\t);\n\t\t\tnewValue.elements[ name ].color.gradient = undefined;\n\t\t\tonChange( newValue );\n\t\t};\n\t\tconst setElementGradient = ( newGradient, newSlug ) => {\n\t\t\tconst newValue = setImmutably(\n\t\t\t\tvalue,\n\t\t\t\t[ 'elements', name, 'color', 'gradient' ],\n\t\t\t\tencodeGradientValue( newGradient, newSlug )\n\t\t\t);\n\t\t\tnewValue.elements[ name ].color.background = undefined;\n\t\t\tonChange( newValue );\n\t\t};\n\t\t// Background color is not supported for `caption`\n\t\t// as there isn't yet a way to set padding for the element.\n\t\tconst supportsBackground = name !== 'caption';\n\n\t\t// Per-tab placeholder flags. The item-level placeholder is active when\n\t\t// there is no local color on any axis and at least one inherited color.\n\t\tconst isElementTextPlaceholder =\n\t\t\telementTextUserColor === undefined &&\n\t\t\telementTextColor !== undefined;\n\t\tconst isElementBackgroundPlaceholder =\n\t\t\telementBackgroundUserColor === undefined &&\n\t\t\telementBackgroundColor !== undefined;\n\t\tconst isElementGradientPlaceholder =\n\t\t\telementGradientUserColor === undefined &&\n\t\t\telementGradient !== undefined;\n\t\tconst isElementPlaceholder =\n\t\t\telementTextUserColor === undefined &&\n\t\t\telementBackgroundUserColor === undefined &&\n\t\t\telementGradientUserColor === undefined &&\n\t\t\t( elementTextColor !== undefined ||\n\t\t\t\telementBackgroundColor !== undefined ||\n\t\t\t\telementGradient !== undefined );\n\t\tconst hasElementInheritedValue =\n\t\t\telementTextColor !== undefined ||\n\t\t\telementBackgroundColor !== undefined ||\n\t\t\telementGradient !== undefined;\n\n\t\titems.push( {\n\t\t\tkey: name,\n\t\t\tlabel: elementLabel,\n\t\t\thasValue: hasElement,\n\t\t\tresetValue: resetElement,\n\t\t\tisShownByDefault: defaultControls[ name ],\n\t\t\tindicators: supportsBackground\n\t\t\t\t? [\n\t\t\t\t\t\telementTextUserColor ?? elementTextColor,\n\t\t\t\t\t\telementGradientUserColor ??\n\t\t\t\t\t\t\telementGradient ??\n\t\t\t\t\t\t\telementBackgroundUserColor ??\n\t\t\t\t\t\t\telementBackgroundColor,\n\t\t\t\t ]\n\t\t\t\t: [ elementTextUserColor ?? elementTextColor ],\n\t\t\tisPlaceholder: isElementPlaceholder,\n\t\t\thasInheritedValue: hasElementInheritedValue,\n\t\t\ttabs: [\n\t\t\t\thasSolidColors && {\n\t\t\t\t\tkey: 'text',\n\t\t\t\t\tlabel: __( 'Text' ),\n\t\t\t\t\tinheritedValue: elementTextColor,\n\t\t\t\t\tinheritedSlug: extractPresetSlug(\n\t\t\t\t\t\tinheritedValue?.elements?.[ name ]?.color?.text,\n\t\t\t\t\t\t'color'\n\t\t\t\t\t),\n\t\t\t\t\tuserSlug: extractPresetSlug(\n\t\t\t\t\t\tvalue?.elements?.[ name ]?.color?.text,\n\t\t\t\t\t\t'color'\n\t\t\t\t\t),\n\t\t\t\t\tsetValue: setElementTextColor,\n\t\t\t\t\tuserValue: elementTextUserColor,\n\t\t\t\t\tisPlaceholder: isElementTextPlaceholder,\n\t\t\t\t},\n\t\t\t\thasSolidColors &&\n\t\t\t\t\tsupportsBackground && {\n\t\t\t\t\t\tkey: 'background',\n\t\t\t\t\t\tlabel: __( 'Background' ),\n\t\t\t\t\t\tinheritedValue: elementBackgroundColor,\n\t\t\t\t\t\tinheritedSlug: extractPresetSlug(\n\t\t\t\t\t\t\tinheritedValue?.elements?.[ name ]?.color\n\t\t\t\t\t\t\t\t?.background,\n\t\t\t\t\t\t\t'color'\n\t\t\t\t\t\t),\n\t\t\t\t\t\tuserSlug: extractPresetSlug(\n\t\t\t\t\t\t\tvalue?.elements?.[ name ]?.color?.background,\n\t\t\t\t\t\t\t'color'\n\t\t\t\t\t\t),\n\t\t\t\t\t\tsetValue: setElementBackgroundColor,\n\t\t\t\t\t\tuserValue: elementBackgroundUserColor,\n\t\t\t\t\t\tisPlaceholder: isElementBackgroundPlaceholder,\n\t\t\t\t\t},\n\t\t\t\thasGradientColors &&\n\t\t\t\t\tsupportsBackground && {\n\t\t\t\t\t\tkey: 'gradient',\n\t\t\t\t\t\tlabel: __( 'Gradient' ),\n\t\t\t\t\t\tinheritedValue: elementGradient,\n\t\t\t\t\t\tinheritedSlug: extractPresetSlug(\n\t\t\t\t\t\t\tinheritedValue?.elements?.[ name ]?.color?.gradient,\n\t\t\t\t\t\t\t'gradient'\n\t\t\t\t\t\t),\n\t\t\t\t\t\tuserSlug: extractPresetSlug(\n\t\t\t\t\t\t\tvalue?.elements?.[ name ]?.color?.gradient,\n\t\t\t\t\t\t\t'gradient'\n\t\t\t\t\t\t),\n\t\t\t\t\t\tsetValue: setElementGradient,\n\t\t\t\t\t\tuserValue: elementGradientUserColor,\n\t\t\t\t\t\tisGradient: true,\n\t\t\t\t\t\tisPlaceholder: isElementGradientPlaceholder,\n\t\t\t\t\t},\n\t\t\t].filter( Boolean ),\n\t\t} );\n\t} );\n\n\treturn (\n\t\t<Wrapper\n\t\t\tresetAllFilter={ resetAllFilter }\n\t\t\tvalue={ value }\n\t\t\tonChange={ onChange }\n\t\t\tpanelId={ panelId }\n\t\t\tlabel={ label }\n\t\t>\n\t\t\t{ items.map( ( item ) => {\n\t\t\t\tconst { key, ...restItem } = item;\n\t\t\t\treturn (\n\t\t\t\t\t<ColorGradientDropdownItem\n\t\t\t\t\t\tkey={ key }\n\t\t\t\t\t\t{ ...restItem }\n\t\t\t\t\t\tshowInheritanceLabelIndicators={\n\t\t\t\t\t\t\tshowInheritanceLabelIndicators\n\t\t\t\t\t\t}\n\t\t\t\t\t\tcolorGradientControlSettings={ {\n\t\t\t\t\t\t\tcolors,\n\t\t\t\t\t\t\tdisableCustomColors: ! areCustomSolidsEnabled,\n\t\t\t\t\t\t\tgradients,\n\t\t\t\t\t\t\tdisableCustomGradients: ! areCustomGradientsEnabled,\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tpanelId={ panelId }\n\t\t\t\t\t/>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t\t{ children }\n\t\t</Wrapper>\n\t);\n}\n"],
|
|
5
|
-
"mappings": "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
|
|
4
|
+
"sourcesContent": ["import { __experimentalToolsPanel as ToolsPanel } from '@wordpress/components';\nimport { useCallback, useMemo } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\nimport { getCSSValueFromRawStyle } from '@wordpress/style-engine';\nimport ColorGradientDropdownItem from './color-gradient-dropdown-item';\nimport {\n\tuseColorsPerOrigin,\n\tuseGradientsPerOrigin,\n\tuseColorGradientSettings,\n} from './hooks';\nimport { useToolsPanelDropdownMenuProps } from './utils';\nimport { setImmutably } from '../../utils/object';\nimport {\n\textractPresetSlug,\n\tencodeColorValueWithPalette,\n} from '../../utils/color-values';\nimport { isGlobalStylesInheritanceEnabled } from './inheritance';\n\n// Despite the \"ColorPanel\" name, this gates only the element-level color\n// controls (link, heading, button, caption, h1–h6) — surfaced as the\n// \"Elements\" panel in the block inspector and the \"Colors\" screen in\n// Global Styles. Top-level text and background color moved to the\n// Typography and Background panels, so this returns false for blocks\n// whose only color support is text and/or background.\nexport function useHasColorPanel( settings ) {\n\tconst hasLinkPanel = useHasLinkPanel( settings );\n\tconst hasHeadingPanel = useHasHeadingPanel( settings );\n\tconst hasButtonPanel = useHasButtonPanel( settings );\n\tconst hasCaptionPanel = useHasCaptionPanel( settings );\n\n\treturn hasLinkPanel || hasHeadingPanel || hasButtonPanel || hasCaptionPanel;\n}\n\nexport function useHasTextPanel( settings ) {\n\tconst colors = useColorsPerOrigin( settings );\n\treturn (\n\t\tsettings?.color?.text &&\n\t\t( colors?.length > 0 || settings?.color?.custom )\n\t);\n}\n\nexport function useHasLinkPanel( settings ) {\n\tconst colors = useColorsPerOrigin( settings );\n\treturn (\n\t\tsettings?.color?.link &&\n\t\t( colors?.length > 0 || settings?.color?.custom )\n\t);\n}\n\nexport function useHasCaptionPanel( settings ) {\n\tconst colors = useColorsPerOrigin( settings );\n\treturn (\n\t\tsettings?.color?.caption &&\n\t\t( colors?.length > 0 || settings?.color?.custom )\n\t);\n}\n\nexport function useHasHeadingPanel( settings ) {\n\tconst colors = useColorsPerOrigin( settings );\n\tconst gradients = useGradientsPerOrigin( settings );\n\treturn (\n\t\tsettings?.color?.heading &&\n\t\t( colors?.length > 0 ||\n\t\t\tsettings?.color?.custom ||\n\t\t\tgradients?.length > 0 ||\n\t\t\tsettings?.color?.customGradient )\n\t);\n}\n\nexport function useHasButtonPanel( settings ) {\n\tconst colors = useColorsPerOrigin( settings );\n\tconst gradients = useGradientsPerOrigin( settings );\n\treturn (\n\t\tsettings?.color?.button &&\n\t\t( colors?.length > 0 ||\n\t\t\tsettings?.color?.custom ||\n\t\t\tgradients?.length > 0 ||\n\t\t\tsettings?.color?.customGradient )\n\t);\n}\n\nexport function useHasBackgroundColorPanel( settings ) {\n\tconst colors = useColorsPerOrigin( settings );\n\tconst gradients = useGradientsPerOrigin( settings );\n\treturn (\n\t\tsettings?.color?.background &&\n\t\t( colors?.length > 0 ||\n\t\t\tsettings?.color?.custom ||\n\t\t\tgradients?.length > 0 ||\n\t\t\tsettings?.color?.customGradient )\n\t);\n}\n\nexport function ColorToolsPanel( {\n\tresetAllFilter,\n\tonChange,\n\tvalue,\n\tpanelId,\n\tchildren,\n\tlabel,\n} ) {\n\tconst dropdownMenuProps = useToolsPanelDropdownMenuProps();\n\tconst resetAll = () => {\n\t\tconst updatedValue = resetAllFilter( value );\n\t\tonChange( updatedValue );\n\t};\n\n\treturn (\n\t\t<ToolsPanel\n\t\t\tlabel={ label || __( 'Elements' ) }\n\t\t\tresetAll={ resetAll }\n\t\t\tpanelId={ panelId }\n\t\t\thasInnerWrapper\n\t\t\theadingLevel={ 3 }\n\t\t\tclassName=\"color-block-support-panel\"\n\t\t\t__experimentalFirstVisibleItemClass=\"first\"\n\t\t\t__experimentalLastVisibleItemClass=\"last\"\n\t\t\tdropdownMenuProps={ dropdownMenuProps }\n\t\t>\n\t\t\t<div className=\"color-block-support-panel__inner-wrapper\">\n\t\t\t\t{ children }\n\t\t\t</div>\n\t\t</ToolsPanel>\n\t);\n}\n\nconst DEFAULT_CONTROLS = {\n\tlink: true,\n\theading: true,\n\tbutton: true,\n\tcaption: true,\n};\n\nexport default function ColorPanel( {\n\tas: Wrapper = ColorToolsPanel,\n\tvalue,\n\tonChange,\n\tinheritedValue = value,\n\tsettings,\n\tpanelId,\n\tdefaultControls = DEFAULT_CONTROLS,\n\tlabel,\n\tchildren,\n\tcontrastWarning,\n\tadditionalElements,\n\tshowInheritanceLabelIndicators = isGlobalStylesInheritanceEnabled(),\n} ) {\n\tconst {\n\t\tcolors,\n\t\tgradients,\n\t\tareCustomSolidsEnabled,\n\t\tareCustomGradientsEnabled,\n\t\thasSolidColors,\n\t\thasGradientColors,\n\t\tallColors,\n\t\tdecodeValue,\n\t\tencodeGradientValue,\n\t} = useColorGradientSettings( settings );\n\n\t// When an inherited preset isn't in the panel's palette, `decodeValue`\n\t// returns the raw `var:preset|…` token rather than a paintable colour.\n\t// Fall back to its CSS custom property so the swatch still renders.\n\tconst decodeInheritedColor = ( rawValue ) =>\n\t\tgetCSSValueFromRawStyle( decodeValue( rawValue ) );\n\n\t// Links\n\tconst showLinkPanel = useHasLinkPanel( settings );\n\tconst linkColor = decodeInheritedColor(\n\t\tinheritedValue?.elements?.link?.color?.text\n\t);\n\tconst userLinkColor = decodeValue( value?.elements?.link?.color?.text );\n\tconst setLinkColor = ( newColor, newSlug ) => {\n\t\tonChange(\n\t\t\tsetImmutably(\n\t\t\t\tvalue,\n\t\t\t\t[ 'elements', 'link', 'color', 'text' ],\n\t\t\t\tencodeColorValueWithPalette( allColors, newColor, newSlug )\n\t\t\t)\n\t\t);\n\t};\n\tconst hoverLinkColor = decodeInheritedColor(\n\t\tinheritedValue?.elements?.link?.[ ':hover' ]?.color?.text\n\t);\n\tconst userHoverLinkColor = decodeValue(\n\t\tvalue?.elements?.link?.[ ':hover' ]?.color?.text\n\t);\n\tconst setHoverLinkColor = ( newColor, newSlug ) => {\n\t\tonChange(\n\t\t\tsetImmutably(\n\t\t\t\tvalue,\n\t\t\t\t[ 'elements', 'link', ':hover', 'color', 'text' ],\n\t\t\t\tencodeColorValueWithPalette( allColors, newColor, newSlug )\n\t\t\t)\n\t\t);\n\t};\n\tconst hasLink = () => !! userLinkColor || !! userHoverLinkColor;\n\tconst resetLink = () => {\n\t\tlet newValue = setImmutably(\n\t\t\tvalue,\n\t\t\t[ 'elements', 'link', ':hover', 'color', 'text' ],\n\t\t\tundefined\n\t\t);\n\t\tnewValue = setImmutably(\n\t\t\tnewValue,\n\t\t\t[ 'elements', 'link', 'color', 'text' ],\n\t\t\tundefined\n\t\t);\n\t\tonChange( newValue );\n\t};\n\n\tconst showCaptionPanel = useHasCaptionPanel( settings );\n\tconst showButtonPanel = useHasButtonPanel( settings );\n\tconst showHeadingPanel = useHasHeadingPanel( settings );\n\n\t// Elements\n\tconst elements = useMemo(\n\t\t() => [\n\t\t\t{\n\t\t\t\tname: 'caption',\n\t\t\t\tlabel: __( 'Captions' ),\n\t\t\t\tshowPanel: showCaptionPanel,\n\t\t\t},\n\t\t\t{\n\t\t\t\tname: 'button',\n\t\t\t\tlabel: __( 'Button' ),\n\t\t\t\tshowPanel: showButtonPanel,\n\t\t\t},\n\t\t\t{\n\t\t\t\tname: 'heading',\n\t\t\t\tlabel: __( 'Heading' ),\n\t\t\t\tshowPanel: showHeadingPanel,\n\t\t\t},\n\t\t\t{\n\t\t\t\tname: 'h1',\n\t\t\t\tlabel: __( 'H1' ),\n\t\t\t\tshowPanel: showHeadingPanel,\n\t\t\t},\n\t\t\t{\n\t\t\t\tname: 'h2',\n\t\t\t\tlabel: __( 'H2' ),\n\t\t\t\tshowPanel: showHeadingPanel,\n\t\t\t},\n\t\t\t{\n\t\t\t\tname: 'h3',\n\t\t\t\tlabel: __( 'H3' ),\n\t\t\t\tshowPanel: showHeadingPanel,\n\t\t\t},\n\t\t\t{\n\t\t\t\tname: 'h4',\n\t\t\t\tlabel: __( 'H4' ),\n\t\t\t\tshowPanel: showHeadingPanel,\n\t\t\t},\n\t\t\t{\n\t\t\t\tname: 'h5',\n\t\t\t\tlabel: __( 'H5' ),\n\t\t\t\tshowPanel: showHeadingPanel,\n\t\t\t},\n\t\t\t{\n\t\t\t\tname: 'h6',\n\t\t\t\tlabel: __( 'H6' ),\n\t\t\t\tshowPanel: showHeadingPanel,\n\t\t\t},\n\t\t\t...( additionalElements?.map( ( element ) => ( {\n\t\t\t\t...element,\n\t\t\t\tshowPanel: hasSolidColors || hasGradientColors,\n\t\t\t} ) ) ?? [] ),\n\t\t],\n\t\t[\n\t\t\tadditionalElements,\n\t\t\thasGradientColors,\n\t\t\thasSolidColors,\n\t\t\tshowCaptionPanel,\n\t\t\tshowButtonPanel,\n\t\t\tshowHeadingPanel,\n\t\t]\n\t);\n\n\tconst resetAllFilter = useCallback(\n\t\t( previousValue ) => {\n\t\t\treturn {\n\t\t\t\t...previousValue,\n\t\t\t\telements: {\n\t\t\t\t\t...previousValue?.elements,\n\t\t\t\t\tlink: {\n\t\t\t\t\t\t...previousValue?.elements?.link,\n\t\t\t\t\t\tcolor: undefined,\n\t\t\t\t\t\t':hover': {\n\t\t\t\t\t\t\tcolor: undefined,\n\t\t\t\t\t\t},\n\t\t\t\t\t},\n\t\t\t\t\t...elements.reduce( ( acc, element ) => {\n\t\t\t\t\t\treturn {\n\t\t\t\t\t\t\t...acc,\n\t\t\t\t\t\t\t[ element.name ]: {\n\t\t\t\t\t\t\t\t...previousValue?.elements?.[ element.name ],\n\t\t\t\t\t\t\t\tcolor: undefined,\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},\n\t\t\t};\n\t\t},\n\t\t[ elements ]\n\t);\n\n\tconst items = [\n\t\tshowLinkPanel && {\n\t\t\tkey: 'link',\n\t\t\tlabel: __( 'Link' ),\n\t\t\thasValue: hasLink,\n\t\t\tresetValue: resetLink,\n\t\t\tisShownByDefault: defaultControls.link,\n\t\t\tindicators: [\n\t\t\t\tuserLinkColor ?? linkColor,\n\t\t\t\tuserHoverLinkColor ?? hoverLinkColor,\n\t\t\t],\n\t\t\tisPlaceholder:\n\t\t\t\tuserLinkColor === undefined &&\n\t\t\t\tuserHoverLinkColor === undefined &&\n\t\t\t\t( linkColor !== undefined || hoverLinkColor !== undefined ),\n\t\t\thasInheritedValue:\n\t\t\t\tlinkColor !== undefined || hoverLinkColor !== undefined,\n\t\t\tcontrastWarning,\n\t\t\ttabs: [\n\t\t\t\t{\n\t\t\t\t\tkey: 'link',\n\t\t\t\t\tlabel: __( 'Default' ),\n\t\t\t\t\tinheritedValue: linkColor,\n\t\t\t\t\tinheritedSlug: extractPresetSlug(\n\t\t\t\t\t\tinheritedValue?.elements?.link?.color?.text,\n\t\t\t\t\t\t'color'\n\t\t\t\t\t),\n\t\t\t\t\tuserSlug: extractPresetSlug(\n\t\t\t\t\t\tvalue?.elements?.link?.color?.text,\n\t\t\t\t\t\t'color'\n\t\t\t\t\t),\n\t\t\t\t\tsetValue: setLinkColor,\n\t\t\t\t\tuserValue: userLinkColor,\n\t\t\t\t\tisPlaceholder:\n\t\t\t\t\t\tuserLinkColor === undefined && linkColor !== undefined,\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\tkey: 'hover',\n\t\t\t\t\tlabel: __( 'Hover' ),\n\t\t\t\t\tinheritedValue: hoverLinkColor,\n\t\t\t\t\tinheritedSlug: extractPresetSlug(\n\t\t\t\t\t\tinheritedValue?.elements?.link?.[ ':hover' ]?.color\n\t\t\t\t\t\t\t?.text,\n\t\t\t\t\t\t'color'\n\t\t\t\t\t),\n\t\t\t\t\tuserSlug: extractPresetSlug(\n\t\t\t\t\t\tvalue?.elements?.link?.[ ':hover' ]?.color?.text,\n\t\t\t\t\t\t'color'\n\t\t\t\t\t),\n\t\t\t\t\tsetValue: setHoverLinkColor,\n\t\t\t\t\tuserValue: userHoverLinkColor,\n\t\t\t\t\tisPlaceholder:\n\t\t\t\t\t\tuserHoverLinkColor === undefined &&\n\t\t\t\t\t\thoverLinkColor !== undefined,\n\t\t\t\t},\n\t\t\t],\n\t\t},\n\t].filter( Boolean );\n\n\telements.forEach( ( { name, label: elementLabel, showPanel } ) => {\n\t\tif ( ! showPanel ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst elementBackgroundColor = decodeInheritedColor(\n\t\t\tinheritedValue?.elements?.[ name ]?.color?.background\n\t\t);\n\t\tconst elementGradient = decodeInheritedColor(\n\t\t\tinheritedValue?.elements?.[ name ]?.color?.gradient\n\t\t);\n\t\tconst elementTextColor = decodeInheritedColor(\n\t\t\tinheritedValue?.elements?.[ name ]?.color?.text\n\t\t);\n\t\tconst elementBackgroundUserColor = decodeValue(\n\t\t\tvalue?.elements?.[ name ]?.color?.background\n\t\t);\n\t\tconst elementGradientUserColor = decodeValue(\n\t\t\tvalue?.elements?.[ name ]?.color?.gradient\n\t\t);\n\t\tconst elementTextUserColor = decodeValue(\n\t\t\tvalue?.elements?.[ name ]?.color?.text\n\t\t);\n\t\tconst hasElement = () =>\n\t\t\t!! (\n\t\t\t\telementTextUserColor ||\n\t\t\t\telementBackgroundUserColor ||\n\t\t\t\telementGradientUserColor\n\t\t\t);\n\t\tconst resetElement = () => {\n\t\t\tconst newValue = setImmutably(\n\t\t\t\tvalue,\n\t\t\t\t[ 'elements', name, 'color', 'background' ],\n\t\t\t\tundefined\n\t\t\t);\n\t\t\tnewValue.elements[ name ].color.gradient = undefined;\n\t\t\tnewValue.elements[ name ].color.text = undefined;\n\t\t\tonChange( newValue );\n\t\t};\n\n\t\tconst setElementTextColor = ( newTextColor, newSlug ) => {\n\t\t\tonChange(\n\t\t\t\tsetImmutably(\n\t\t\t\t\tvalue,\n\t\t\t\t\t[ 'elements', name, 'color', 'text' ],\n\t\t\t\t\tencodeColorValueWithPalette(\n\t\t\t\t\t\tallColors,\n\t\t\t\t\t\tnewTextColor,\n\t\t\t\t\t\tnewSlug\n\t\t\t\t\t)\n\t\t\t\t)\n\t\t\t);\n\t\t};\n\t\tconst setElementBackgroundColor = ( newBackgroundColor, newSlug ) => {\n\t\t\tconst newValue = setImmutably(\n\t\t\t\tvalue,\n\t\t\t\t[ 'elements', name, 'color', 'background' ],\n\t\t\t\tencodeColorValueWithPalette(\n\t\t\t\t\tallColors,\n\t\t\t\t\tnewBackgroundColor,\n\t\t\t\t\tnewSlug\n\t\t\t\t)\n\t\t\t);\n\t\t\tnewValue.elements[ name ].color.gradient = undefined;\n\t\t\tonChange( newValue );\n\t\t};\n\t\tconst setElementGradient = ( newGradient, newSlug ) => {\n\t\t\tconst newValue = setImmutably(\n\t\t\t\tvalue,\n\t\t\t\t[ 'elements', name, 'color', 'gradient' ],\n\t\t\t\tencodeGradientValue( newGradient, newSlug )\n\t\t\t);\n\t\t\tnewValue.elements[ name ].color.background = undefined;\n\t\t\tonChange( newValue );\n\t\t};\n\t\t// Background color is not supported for `caption`\n\t\t// as there isn't yet a way to set padding for the element.\n\t\tconst supportsBackground = name !== 'caption';\n\n\t\t// Per-tab placeholder flags. The item-level placeholder is active when\n\t\t// there is no local color on any axis and at least one inherited color.\n\t\tconst isElementTextPlaceholder =\n\t\t\telementTextUserColor === undefined &&\n\t\t\telementTextColor !== undefined;\n\t\tconst isElementBackgroundPlaceholder =\n\t\t\telementBackgroundUserColor === undefined &&\n\t\t\telementBackgroundColor !== undefined;\n\t\tconst isElementGradientPlaceholder =\n\t\t\telementGradientUserColor === undefined &&\n\t\t\telementGradient !== undefined;\n\t\tconst isElementPlaceholder =\n\t\t\telementTextUserColor === undefined &&\n\t\t\telementBackgroundUserColor === undefined &&\n\t\t\telementGradientUserColor === undefined &&\n\t\t\t( elementTextColor !== undefined ||\n\t\t\t\telementBackgroundColor !== undefined ||\n\t\t\t\telementGradient !== undefined );\n\t\tconst hasElementInheritedValue =\n\t\t\telementTextColor !== undefined ||\n\t\t\telementBackgroundColor !== undefined ||\n\t\t\telementGradient !== undefined;\n\n\t\titems.push( {\n\t\t\tkey: name,\n\t\t\tlabel: elementLabel,\n\t\t\thasValue: hasElement,\n\t\t\tresetValue: resetElement,\n\t\t\tisShownByDefault: defaultControls[ name ],\n\t\t\tindicators: supportsBackground\n\t\t\t\t? [\n\t\t\t\t\t\telementTextUserColor ?? elementTextColor,\n\t\t\t\t\t\telementGradientUserColor ??\n\t\t\t\t\t\t\telementGradient ??\n\t\t\t\t\t\t\telementBackgroundUserColor ??\n\t\t\t\t\t\t\telementBackgroundColor,\n\t\t\t\t ]\n\t\t\t\t: [ elementTextUserColor ?? elementTextColor ],\n\t\t\tisPlaceholder: isElementPlaceholder,\n\t\t\thasInheritedValue: hasElementInheritedValue,\n\t\t\ttabs: [\n\t\t\t\thasSolidColors && {\n\t\t\t\t\tkey: 'text',\n\t\t\t\t\tlabel: __( 'Text' ),\n\t\t\t\t\tinheritedValue: elementTextColor,\n\t\t\t\t\tinheritedSlug: extractPresetSlug(\n\t\t\t\t\t\tinheritedValue?.elements?.[ name ]?.color?.text,\n\t\t\t\t\t\t'color'\n\t\t\t\t\t),\n\t\t\t\t\tuserSlug: extractPresetSlug(\n\t\t\t\t\t\tvalue?.elements?.[ name ]?.color?.text,\n\t\t\t\t\t\t'color'\n\t\t\t\t\t),\n\t\t\t\t\tsetValue: setElementTextColor,\n\t\t\t\t\tuserValue: elementTextUserColor,\n\t\t\t\t\tisPlaceholder: isElementTextPlaceholder,\n\t\t\t\t},\n\t\t\t\thasSolidColors &&\n\t\t\t\t\tsupportsBackground && {\n\t\t\t\t\t\tkey: 'background',\n\t\t\t\t\t\tlabel: __( 'Background' ),\n\t\t\t\t\t\tinheritedValue: elementBackgroundColor,\n\t\t\t\t\t\tinheritedSlug: extractPresetSlug(\n\t\t\t\t\t\t\tinheritedValue?.elements?.[ name ]?.color\n\t\t\t\t\t\t\t\t?.background,\n\t\t\t\t\t\t\t'color'\n\t\t\t\t\t\t),\n\t\t\t\t\t\tuserSlug: extractPresetSlug(\n\t\t\t\t\t\t\tvalue?.elements?.[ name ]?.color?.background,\n\t\t\t\t\t\t\t'color'\n\t\t\t\t\t\t),\n\t\t\t\t\t\tsetValue: setElementBackgroundColor,\n\t\t\t\t\t\tuserValue: elementBackgroundUserColor,\n\t\t\t\t\t\tisPlaceholder: isElementBackgroundPlaceholder,\n\t\t\t\t\t},\n\t\t\t\thasGradientColors &&\n\t\t\t\t\tsupportsBackground && {\n\t\t\t\t\t\tkey: 'gradient',\n\t\t\t\t\t\tlabel: __( 'Gradient' ),\n\t\t\t\t\t\tinheritedValue: elementGradient,\n\t\t\t\t\t\tinheritedSlug: extractPresetSlug(\n\t\t\t\t\t\t\tinheritedValue?.elements?.[ name ]?.color?.gradient,\n\t\t\t\t\t\t\t'gradient'\n\t\t\t\t\t\t),\n\t\t\t\t\t\tuserSlug: extractPresetSlug(\n\t\t\t\t\t\t\tvalue?.elements?.[ name ]?.color?.gradient,\n\t\t\t\t\t\t\t'gradient'\n\t\t\t\t\t\t),\n\t\t\t\t\t\tsetValue: setElementGradient,\n\t\t\t\t\t\tuserValue: elementGradientUserColor,\n\t\t\t\t\t\tisGradient: true,\n\t\t\t\t\t\tisPlaceholder: isElementGradientPlaceholder,\n\t\t\t\t\t},\n\t\t\t].filter( Boolean ),\n\t\t} );\n\t} );\n\n\treturn (\n\t\t<Wrapper\n\t\t\tresetAllFilter={ resetAllFilter }\n\t\t\tvalue={ value }\n\t\t\tonChange={ onChange }\n\t\t\tpanelId={ panelId }\n\t\t\tlabel={ label }\n\t\t>\n\t\t\t{ items.map( ( item ) => {\n\t\t\t\tconst { key, ...restItem } = item;\n\t\t\t\treturn (\n\t\t\t\t\t<ColorGradientDropdownItem\n\t\t\t\t\t\tkey={ key }\n\t\t\t\t\t\t{ ...restItem }\n\t\t\t\t\t\tshowInheritanceLabelIndicators={\n\t\t\t\t\t\t\tshowInheritanceLabelIndicators\n\t\t\t\t\t\t}\n\t\t\t\t\t\tcolorGradientControlSettings={ {\n\t\t\t\t\t\t\tcolors,\n\t\t\t\t\t\t\tdisableCustomColors: ! areCustomSolidsEnabled,\n\t\t\t\t\t\t\tgradients,\n\t\t\t\t\t\t\tdisableCustomGradients: ! areCustomGradientsEnabled,\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tpanelId={ panelId }\n\t\t\t\t\t/>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t\t{ children }\n\t\t</Wrapper>\n\t);\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["ToolsPanel", "ColorGradientDropdownItem"]
|
|
7
7
|
}
|
|
@@ -244,6 +244,7 @@ function DimensionsPanel({
|
|
|
244
244
|
// Special case because the layout controls are not part of the dimensions panel
|
|
245
245
|
// in global styles but not in block inspector.
|
|
246
246
|
includeLayoutControls = false,
|
|
247
|
+
allowAxialBlockGap = true,
|
|
247
248
|
styleState = import_block_style_state.DEFAULT_BLOCK_STYLE_STATE,
|
|
248
249
|
showInheritanceLabelIndicators = (0, import_inheritance.isGlobalStylesInheritanceEnabled)()
|
|
249
250
|
}) {
|
|
@@ -394,12 +395,14 @@ function DimensionsPanel({
|
|
|
394
395
|
const onMouseOverMargin = () => onVisualize("margin");
|
|
395
396
|
const showGapControl = hasGap(settings);
|
|
396
397
|
const gapSides = Array.isArray(settings?.spacing?.blockGap) ? settings?.spacing?.blockGap : settings?.spacing?.blockGap?.sides;
|
|
397
|
-
const isAxialGap = gapSides && gapSides.some((side) => AXIAL_SIDES.includes(side));
|
|
398
|
+
const isAxialGap = allowAxialBlockGap && gapSides && gapSides.some((side) => AXIAL_SIDES.includes(side));
|
|
398
399
|
const localGapRaw = decodeValue(value?.spacing?.blockGap);
|
|
399
400
|
const inheritedGapRaw = decodeValue(inheritedValue?.spacing?.blockGap);
|
|
401
|
+
const localGapForSingleInput = !isAxialGap && typeof localGapRaw === "object" ? localGapRaw?.top : localGapRaw;
|
|
402
|
+
const inheritedGapForSingleInput = !isAxialGap && typeof inheritedGapRaw === "object" ? inheritedGapRaw?.top : inheritedGapRaw;
|
|
400
403
|
const gapRawForDisplay = hasValue(value?.spacing?.blockGap) ? localGapRaw : inheritedGapRaw;
|
|
401
404
|
const gapValues = splitGapValue(gapRawForDisplay, isAxialGap);
|
|
402
|
-
const isGapPlaceholder = !hasValue(value?.spacing?.blockGap) && typeof
|
|
405
|
+
const isGapPlaceholder = !hasValue(value?.spacing?.blockGap) && typeof inheritedGapForSingleInput === "string" && inheritedGapForSingleInput !== "";
|
|
403
406
|
const setGapValue = (newGapValue) => {
|
|
404
407
|
onChange(
|
|
405
408
|
(0, import_object.setImmutably)(value, ["spacing", "blockGap"], newGapValue)
|
|
@@ -749,8 +752,8 @@ function DimensionsPanel({
|
|
|
749
752
|
min: 0,
|
|
750
753
|
onChange: setGapValue,
|
|
751
754
|
units,
|
|
752
|
-
value:
|
|
753
|
-
placeholder: isGapPlaceholder ?
|
|
755
|
+
value: localGapForSingleInput ?? void 0,
|
|
756
|
+
placeholder: isGapPlaceholder ? inheritedGapForSingleInput : void 0
|
|
754
757
|
}
|
|
755
758
|
)),
|
|
756
759
|
showSpacingPresetsControl && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
@@ -763,7 +766,8 @@ function DimensionsPanel({
|
|
|
763
766
|
sides: isAxialGap ? gapSides : ["top"],
|
|
764
767
|
values: gapValues,
|
|
765
768
|
allowReset: false
|
|
766
|
-
}
|
|
769
|
+
},
|
|
770
|
+
isAxialGap ? "axial-gap" : "single-gap"
|
|
767
771
|
)
|
|
768
772
|
]
|
|
769
773
|
}
|