@wordpress/edit-site 5.3.2 → 5.3.3
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 +1 -0
- package/build/components/add-new-template/new-template-part.js +8 -5
- package/build/components/add-new-template/new-template-part.js.map +1 -1
- package/build/components/add-new-template/new-template.js +8 -5
- package/build/components/add-new-template/new-template.js.map +1 -1
- package/build/components/block-editor/editor-canvas.js +3 -3
- package/build/components/block-editor/editor-canvas.js.map +1 -1
- package/build/components/block-editor/index.js +3 -3
- package/build/components/block-editor/index.js.map +1 -1
- package/build/components/editor/index.js +25 -23
- package/build/components/editor/index.js.map +1 -1
- package/build/components/global-styles/border-panel.js +2 -2
- package/build/components/global-styles/border-panel.js.map +1 -1
- package/build/components/global-styles/color-palette-panel.js +2 -2
- package/build/components/global-styles/color-palette-panel.js.map +1 -1
- package/build/components/global-styles/custom-css.js +2 -2
- package/build/components/global-styles/custom-css.js.map +1 -1
- package/build/components/global-styles/dimensions-panel.js +2 -2
- package/build/components/global-styles/dimensions-panel.js.map +1 -1
- package/build/components/global-styles/global-styles-provider.js +2 -2
- package/build/components/global-styles/global-styles-provider.js.map +1 -1
- package/build/components/global-styles/gradients-palette-panel.js +2 -2
- package/build/components/global-styles/gradients-palette-panel.js.map +1 -1
- package/build/components/global-styles/header.js +1 -1
- package/build/components/global-styles/header.js.map +1 -1
- package/build/components/global-styles/hooks.js +2 -2
- package/build/components/global-styles/hooks.js.map +1 -1
- package/build/components/global-styles/navigation-button.js +1 -1
- package/build/components/global-styles/navigation-button.js.map +1 -1
- package/build/components/global-styles/palette.js +2 -2
- package/build/components/global-styles/palette.js.map +1 -1
- package/build/components/global-styles/preview.js +2 -2
- package/build/components/global-styles/preview.js.map +1 -1
- package/build/components/global-styles/screen-background-color.js +2 -2
- package/build/components/global-styles/screen-background-color.js.map +1 -1
- package/build/components/global-styles/screen-button-color.js +2 -2
- package/build/components/global-styles/screen-button-color.js.map +1 -1
- package/build/components/global-styles/screen-colors.js +2 -2
- package/build/components/global-styles/screen-colors.js.map +1 -1
- package/build/components/global-styles/screen-css.js +5 -5
- package/build/components/global-styles/screen-css.js.map +1 -1
- package/build/components/global-styles/screen-heading-color.js +2 -2
- package/build/components/global-styles/screen-heading-color.js.map +1 -1
- package/build/components/global-styles/screen-link-color.js +2 -2
- package/build/components/global-styles/screen-link-color.js.map +1 -1
- package/build/components/global-styles/screen-root.js +2 -2
- package/build/components/global-styles/screen-root.js.map +1 -1
- package/build/components/global-styles/screen-style-variations.js +2 -2
- package/build/components/global-styles/screen-style-variations.js.map +1 -1
- package/build/components/global-styles/screen-text-color.js +2 -2
- package/build/components/global-styles/screen-text-color.js.map +1 -1
- package/build/components/global-styles/screen-typography.js +2 -2
- package/build/components/global-styles/screen-typography.js.map +1 -1
- package/build/components/global-styles/shadow-panel.js +2 -2
- package/build/components/global-styles/shadow-panel.js.map +1 -1
- package/build/components/global-styles/typography-panel.js +2 -2
- package/build/components/global-styles/typography-panel.js.map +1 -1
- package/build/components/global-styles/typography-preview.js +2 -2
- package/build/components/global-styles/typography-preview.js.map +1 -1
- package/build/components/global-styles/ui.js +3 -10
- package/build/components/global-styles/ui.js.map +1 -1
- package/build/components/global-styles-renderer/index.js +2 -2
- package/build/components/global-styles-renderer/index.js.map +1 -1
- package/build/components/header-edit-mode/index.js +6 -3
- package/build/components/header-edit-mode/index.js.map +1 -1
- package/build/components/keyboard-shortcut-help-modal/config.js +1 -1
- package/build/components/keyboard-shortcut-help-modal/config.js.map +1 -1
- package/build/components/layout/index.js +10 -23
- package/build/components/layout/index.js.map +1 -1
- package/build/components/list/actions/rename-menu-item.js +1 -1
- package/build/components/list/actions/rename-menu-item.js.map +1 -1
- package/build/components/list/table.js +1 -0
- package/build/components/list/table.js.map +1 -1
- package/build/components/navigation-inspector/navigation-menu.js +2 -2
- package/build/components/navigation-inspector/navigation-menu.js.map +1 -1
- package/build/components/save-panel/index.js +4 -3
- package/build/components/save-panel/index.js.map +1 -1
- package/build/components/sidebar/index.js +17 -3
- package/build/components/sidebar/index.js.map +1 -1
- package/build/components/sidebar-navigation-screen/index.js +28 -7
- package/build/components/sidebar-navigation-screen/index.js.map +1 -1
- package/build/components/sidebar-navigation-screen-navigation-item/index.js +72 -0
- package/build/components/sidebar-navigation-screen-navigation-item/index.js.map +1 -0
- package/build/components/sidebar-navigation-screen-navigation-menus/index.js +2 -2
- package/build/components/sidebar-navigation-screen-navigation-menus/index.js.map +1 -1
- package/build/components/sidebar-navigation-screen-template/index.js +70 -0
- package/build/components/sidebar-navigation-screen-template/index.js.map +1 -0
- package/build/components/sidebar-navigation-screen-templates/index.js +32 -82
- package/build/components/sidebar-navigation-screen-templates/index.js.map +1 -1
- package/build/components/sidebar-navigation-screen-templates-browse/index.js +43 -0
- package/build/components/sidebar-navigation-screen-templates-browse/index.js.map +1 -0
- package/build/components/site-hub/index.js +14 -49
- package/build/components/site-hub/index.js.map +1 -1
- package/build/components/style-book/index.js +10 -3
- package/build/components/style-book/index.js.map +1 -1
- package/build/components/sync-state-with-url/use-init-edited-entity-from-url.js +55 -20
- package/build/components/sync-state-with-url/use-init-edited-entity-from-url.js.map +1 -1
- package/build/components/sync-state-with-url/use-sync-canvas-mode-with-url.js +3 -3
- package/build/components/sync-state-with-url/use-sync-canvas-mode-with-url.js.map +1 -1
- package/build/components/sync-state-with-url/{use-sync-sidebar-path-with-url.js → use-sync-path-with-url.js} +12 -12
- package/build/components/sync-state-with-url/use-sync-path-with-url.js.map +1 -0
- package/build/components/use-edited-entity-record/index.js +6 -2
- package/build/components/use-edited-entity-record/index.js.map +1 -1
- package/build/hooks/push-changes-to-global-styles/index.js +2 -2
- package/build/hooks/push-changes-to-global-styles/index.js.map +1 -1
- package/build/{experiments.js → private-apis.js} +3 -3
- package/build/private-apis.js.map +1 -0
- package/build/store/index.js +3 -3
- package/build/store/index.js.map +1 -1
- package/build/utils/get-is-list-page.js +5 -6
- package/build/utils/get-is-list-page.js.map +1 -1
- package/build-module/components/add-new-template/new-template-part.js +7 -4
- package/build-module/components/add-new-template/new-template-part.js.map +1 -1
- package/build-module/components/add-new-template/new-template.js +7 -4
- package/build-module/components/add-new-template/new-template.js.map +1 -1
- package/build-module/components/block-editor/editor-canvas.js +1 -1
- package/build-module/components/block-editor/editor-canvas.js.map +1 -1
- package/build-module/components/block-editor/index.js +3 -3
- package/build-module/components/block-editor/index.js.map +1 -1
- package/build-module/components/editor/index.js +25 -24
- package/build-module/components/editor/index.js.map +1 -1
- package/build-module/components/global-styles/border-panel.js +3 -3
- package/build-module/components/global-styles/border-panel.js.map +1 -1
- package/build-module/components/global-styles/color-palette-panel.js +3 -3
- package/build-module/components/global-styles/color-palette-panel.js.map +1 -1
- package/build-module/components/global-styles/custom-css.js +3 -3
- package/build-module/components/global-styles/custom-css.js.map +1 -1
- package/build-module/components/global-styles/dimensions-panel.js +3 -3
- package/build-module/components/global-styles/dimensions-panel.js.map +1 -1
- package/build-module/components/global-styles/global-styles-provider.js +3 -3
- package/build-module/components/global-styles/global-styles-provider.js.map +1 -1
- package/build-module/components/global-styles/gradients-palette-panel.js +3 -3
- package/build-module/components/global-styles/gradients-palette-panel.js.map +1 -1
- package/build-module/components/global-styles/header.js +2 -2
- package/build-module/components/global-styles/header.js.map +1 -1
- package/build-module/components/global-styles/hooks.js +3 -3
- package/build-module/components/global-styles/hooks.js.map +1 -1
- package/build-module/components/global-styles/navigation-button.js +2 -2
- package/build-module/components/global-styles/navigation-button.js.map +1 -1
- package/build-module/components/global-styles/palette.js +3 -3
- package/build-module/components/global-styles/palette.js.map +1 -1
- package/build-module/components/global-styles/preview.js +3 -3
- package/build-module/components/global-styles/preview.js.map +1 -1
- package/build-module/components/global-styles/screen-background-color.js +3 -3
- package/build-module/components/global-styles/screen-background-color.js.map +1 -1
- package/build-module/components/global-styles/screen-button-color.js +3 -3
- package/build-module/components/global-styles/screen-button-color.js.map +1 -1
- package/build-module/components/global-styles/screen-colors.js +3 -3
- package/build-module/components/global-styles/screen-colors.js.map +1 -1
- package/build-module/components/global-styles/screen-css.js +5 -5
- package/build-module/components/global-styles/screen-css.js.map +1 -1
- package/build-module/components/global-styles/screen-heading-color.js +3 -3
- package/build-module/components/global-styles/screen-heading-color.js.map +1 -1
- package/build-module/components/global-styles/screen-link-color.js +3 -3
- package/build-module/components/global-styles/screen-link-color.js.map +1 -1
- package/build-module/components/global-styles/screen-root.js +3 -3
- package/build-module/components/global-styles/screen-root.js.map +1 -1
- package/build-module/components/global-styles/screen-style-variations.js +3 -3
- package/build-module/components/global-styles/screen-style-variations.js.map +1 -1
- package/build-module/components/global-styles/screen-text-color.js +3 -3
- package/build-module/components/global-styles/screen-text-color.js.map +1 -1
- package/build-module/components/global-styles/screen-typography.js +3 -3
- package/build-module/components/global-styles/screen-typography.js.map +1 -1
- package/build-module/components/global-styles/shadow-panel.js +3 -3
- package/build-module/components/global-styles/shadow-panel.js.map +1 -1
- package/build-module/components/global-styles/typography-panel.js +3 -3
- package/build-module/components/global-styles/typography-panel.js.map +1 -1
- package/build-module/components/global-styles/typography-preview.js +3 -3
- package/build-module/components/global-styles/typography-preview.js.map +1 -1
- package/build-module/components/global-styles/ui.js +4 -11
- package/build-module/components/global-styles/ui.js.map +1 -1
- package/build-module/components/global-styles-renderer/index.js +3 -3
- package/build-module/components/global-styles-renderer/index.js.map +1 -1
- package/build-module/components/header-edit-mode/index.js +6 -3
- package/build-module/components/header-edit-mode/index.js.map +1 -1
- package/build-module/components/keyboard-shortcut-help-modal/config.js +1 -1
- package/build-module/components/keyboard-shortcut-help-modal/config.js.map +1 -1
- package/build-module/components/layout/index.js +10 -23
- package/build-module/components/layout/index.js.map +1 -1
- package/build-module/components/list/actions/rename-menu-item.js +1 -1
- package/build-module/components/list/actions/rename-menu-item.js.map +1 -1
- package/build-module/components/list/table.js +1 -0
- package/build-module/components/list/table.js.map +1 -1
- package/build-module/components/navigation-inspector/navigation-menu.js +3 -3
- package/build-module/components/navigation-inspector/navigation-menu.js.map +1 -1
- package/build-module/components/save-panel/index.js +3 -2
- package/build-module/components/save-panel/index.js.map +1 -1
- package/build-module/components/sidebar/index.js +14 -3
- package/build-module/components/sidebar/index.js.map +1 -1
- package/build-module/components/sidebar-navigation-screen/index.js +27 -9
- package/build-module/components/sidebar-navigation-screen/index.js.map +1 -1
- package/build-module/components/sidebar-navigation-screen-navigation-item/index.js +55 -0
- package/build-module/components/sidebar-navigation-screen-navigation-item/index.js.map +1 -0
- package/build-module/components/sidebar-navigation-screen-navigation-menus/index.js +2 -2
- package/build-module/components/sidebar-navigation-screen-navigation-menus/index.js.map +1 -1
- package/build-module/components/sidebar-navigation-screen-template/index.js +53 -0
- package/build-module/components/sidebar-navigation-screen-template/index.js.map +1 -0
- package/build-module/components/sidebar-navigation-screen-templates/index.js +34 -81
- package/build-module/components/sidebar-navigation-screen-templates/index.js.map +1 -1
- package/build-module/components/sidebar-navigation-screen-templates-browse/index.js +31 -0
- package/build-module/components/sidebar-navigation-screen-templates-browse/index.js.map +1 -0
- package/build-module/components/site-hub/index.js +14 -46
- package/build-module/components/site-hub/index.js.map +1 -1
- package/build-module/components/style-book/index.js +11 -4
- package/build-module/components/style-book/index.js.map +1 -1
- package/build-module/components/sync-state-with-url/use-init-edited-entity-from-url.js +55 -21
- package/build-module/components/sync-state-with-url/use-init-edited-entity-from-url.js.map +1 -1
- package/build-module/components/sync-state-with-url/use-sync-canvas-mode-with-url.js +1 -1
- package/build-module/components/sync-state-with-url/use-sync-canvas-mode-with-url.js.map +1 -1
- package/build-module/components/sync-state-with-url/{use-sync-sidebar-path-with-url.js → use-sync-path-with-url.js} +11 -11
- package/build-module/components/sync-state-with-url/use-sync-path-with-url.js.map +1 -0
- package/build-module/components/use-edited-entity-record/index.js +6 -2
- package/build-module/components/use-edited-entity-record/index.js.map +1 -1
- package/build-module/hooks/push-changes-to-global-styles/index.js +3 -3
- package/build-module/hooks/push-changes-to-global-styles/index.js.map +1 -1
- package/build-module/{experiments.js → private-apis.js} +2 -2
- package/build-module/private-apis.js.map +1 -0
- package/build-module/store/index.js +1 -1
- package/build-module/store/index.js.map +1 -1
- package/build-module/utils/get-is-list-page.js +5 -6
- package/build-module/utils/get-is-list-page.js.map +1 -1
- package/build-style/style-rtl.css +18 -37
- package/build-style/style.css +18 -37
- package/package.json +20 -20
- package/src/components/add-new-template/new-template-part.js +7 -4
- package/src/components/add-new-template/new-template.js +8 -6
- package/src/components/block-editor/editor-canvas.js +1 -1
- package/src/components/block-editor/index.js +3 -3
- package/src/components/editor/index.js +29 -28
- package/src/components/global-styles/border-panel.js +3 -3
- package/src/components/global-styles/color-palette-panel.js +3 -3
- package/src/components/global-styles/custom-css.js +3 -3
- package/src/components/global-styles/dimensions-panel.js +3 -3
- package/src/components/global-styles/global-styles-provider.js +3 -3
- package/src/components/global-styles/gradients-palette-panel.js +3 -3
- package/src/components/global-styles/header.js +2 -2
- package/src/components/global-styles/hooks.js +3 -3
- package/src/components/global-styles/navigation-button.js +4 -2
- package/src/components/global-styles/palette.js +3 -3
- package/src/components/global-styles/preview.js +3 -3
- package/src/components/global-styles/screen-background-color.js +3 -3
- package/src/components/global-styles/screen-button-color.js +3 -3
- package/src/components/global-styles/screen-colors.js +3 -3
- package/src/components/global-styles/screen-css.js +14 -7
- package/src/components/global-styles/screen-heading-color.js +3 -3
- package/src/components/global-styles/screen-link-color.js +3 -3
- package/src/components/global-styles/screen-root.js +3 -3
- package/src/components/global-styles/screen-style-variations.js +3 -3
- package/src/components/global-styles/screen-text-color.js +3 -3
- package/src/components/global-styles/screen-typography.js +3 -3
- package/src/components/global-styles/shadow-panel.js +3 -3
- package/src/components/global-styles/style.scss +2 -1
- package/src/components/global-styles/typography-panel.js +3 -3
- package/src/components/global-styles/typography-preview.js +3 -3
- package/src/components/global-styles/ui.js +3 -8
- package/src/components/global-styles-renderer/index.js +3 -3
- package/src/components/header-edit-mode/index.js +6 -3
- package/src/components/keyboard-shortcut-help-modal/config.js +1 -1
- package/src/components/layout/index.js +35 -48
- package/src/components/layout/style.scss +11 -23
- package/src/components/list/actions/rename-menu-item.js +1 -1
- package/src/components/list/table.js +4 -0
- package/src/components/navigation-inspector/navigation-menu.js +3 -3
- package/src/components/save-panel/index.js +4 -1
- package/src/components/sidebar/index.js +10 -2
- package/src/components/sidebar-navigation-screen/index.js +27 -11
- package/src/components/sidebar-navigation-screen/style.scss +4 -6
- package/src/components/sidebar-navigation-screen-navigation-item/index.js +52 -0
- package/src/components/sidebar-navigation-screen-navigation-menus/index.js +1 -1
- package/src/components/sidebar-navigation-screen-template/index.js +52 -0
- package/src/components/sidebar-navigation-screen-templates/index.js +49 -83
- package/src/components/sidebar-navigation-screen-templates-browse/index.js +31 -0
- package/src/components/site-hub/index.js +67 -122
- package/src/components/site-hub/style.scss +1 -11
- package/src/components/style-book/index.js +11 -7
- package/src/components/sync-state-with-url/use-init-edited-entity-from-url.js +48 -14
- package/src/components/sync-state-with-url/use-sync-canvas-mode-with-url.js +1 -1
- package/src/components/sync-state-with-url/{use-sync-sidebar-path-with-url.js → use-sync-path-with-url.js} +10 -10
- package/src/components/use-edited-entity-record/index.js +6 -2
- package/src/hooks/push-changes-to-global-styles/index.js +3 -3
- package/src/{experiments.js → private-apis.js} +1 -1
- package/src/store/index.js +1 -1
- package/src/utils/get-is-list-page.js +5 -5
- package/build/components/sync-state-with-url/use-sync-sidebar-path-with-url.js.map +0 -1
- package/build/experiments.js.map +0 -1
- package/build-module/components/sync-state-with-url/use-sync-sidebar-path-with-url.js.map +0 -1
- package/build-module/experiments.js.map +0 -1
|
@@ -3,7 +3,7 @@ import { createElement } from "@wordpress/element";
|
|
|
3
3
|
/**
|
|
4
4
|
* WordPress dependencies
|
|
5
5
|
*/
|
|
6
|
-
import { __unstableIframe as Iframe, __unstableEditorStyles as EditorStyles,
|
|
6
|
+
import { __unstableIframe as Iframe, __unstableEditorStyles as EditorStyles, privateApis as blockEditorPrivateApis } from '@wordpress/block-editor';
|
|
7
7
|
import { __unstableMotion as motion, __experimentalHStack as HStack, __experimentalVStack as VStack } from '@wordpress/components';
|
|
8
8
|
import { useReducedMotion, useResizeObserver } from '@wordpress/compose';
|
|
9
9
|
import { useState, useMemo } from '@wordpress/element';
|
|
@@ -11,12 +11,12 @@ import { useState, useMemo } from '@wordpress/element';
|
|
|
11
11
|
* Internal dependencies
|
|
12
12
|
*/
|
|
13
13
|
|
|
14
|
-
import { unlock } from '../../
|
|
14
|
+
import { unlock } from '../../private-apis';
|
|
15
15
|
const {
|
|
16
16
|
useGlobalSetting,
|
|
17
17
|
useGlobalStyle,
|
|
18
18
|
useGlobalStylesOutput
|
|
19
|
-
} = unlock(
|
|
19
|
+
} = unlock(blockEditorPrivateApis);
|
|
20
20
|
const firstFrame = {
|
|
21
21
|
start: {
|
|
22
22
|
scale: 1,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["@wordpress/edit-site/src/components/global-styles/preview.js"],"names":["__unstableIframe","Iframe","__unstableEditorStyles","EditorStyles","experiments","blockEditorExperiments","__unstableMotion","motion","__experimentalHStack","HStack","__experimentalVStack","VStack","useReducedMotion","useResizeObserver","useState","useMemo","unlock","useGlobalSetting","useGlobalStyle","useGlobalStylesOutput","firstFrame","start","scale","opacity","hover","midFrame","secondFrame","normalizedWidth","normalizedHeight","normalizedColorSwatchSize","StylesPreview","label","isFocused","withHoverView","fontWeight","fontFamily","headingFontFamily","headingFontWeight","textColor","headingColor","backgroundColor","gradientValue","styles","disableMotion","coreColors","themeColors","customColors","isHovered","setIsHovered","containerResizeListener","width","ratio","paletteColors","concat","highlightedColors","filter","color","slice","editorStyles","css","isGlobalStyles","height","visibility","background","cursor","overflow","fontSize","delay","type","map","index","slug","borderRadius","position","top","flexGrow","padding","boxSizing","lineHeight","textAlign"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\t__unstableIframe as Iframe,\n\t__unstableEditorStyles as EditorStyles,\n\texperiments as blockEditorExperiments,\n} from '@wordpress/block-editor';\nimport {\n\t__unstableMotion as motion,\n\t__experimentalHStack as HStack,\n\t__experimentalVStack as VStack,\n} from '@wordpress/components';\nimport { useReducedMotion, useResizeObserver } from '@wordpress/compose';\nimport { useState, useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { unlock } from '../../experiments';\n\nconst { useGlobalSetting, useGlobalStyle, useGlobalStylesOutput } = unlock(\n\tblockEditorExperiments\n);\n\nconst firstFrame = {\n\tstart: {\n\t\tscale: 1,\n\t\topacity: 1,\n\t},\n\thover: {\n\t\tscale: 0,\n\t\topacity: 0,\n\t},\n};\n\nconst midFrame = {\n\thover: {\n\t\topacity: 1,\n\t},\n\tstart: {\n\t\topacity: 0.5,\n\t},\n};\n\nconst secondFrame = {\n\thover: {\n\t\tscale: 1,\n\t\topacity: 1,\n\t},\n\tstart: {\n\t\tscale: 0,\n\t\topacity: 0,\n\t},\n};\n\nconst normalizedWidth = 248;\nconst normalizedHeight = 152;\n\nconst normalizedColorSwatchSize = 32;\n\nconst StylesPreview = ( { label, isFocused, withHoverView } ) => {\n\tconst [ fontWeight ] = useGlobalStyle( 'typography.fontWeight' );\n\tconst [ fontFamily = 'serif' ] = useGlobalStyle( 'typography.fontFamily' );\n\tconst [ headingFontFamily = fontFamily ] = useGlobalStyle(\n\t\t'elements.h1.typography.fontFamily'\n\t);\n\tconst [ headingFontWeight = fontWeight ] = useGlobalStyle(\n\t\t'elements.h1.typography.fontWeight'\n\t);\n\tconst [ textColor = 'black' ] = useGlobalStyle( 'color.text' );\n\tconst [ headingColor = textColor ] = useGlobalStyle(\n\t\t'elements.h1.color.text'\n\t);\n\tconst [ backgroundColor = 'white' ] = useGlobalStyle( 'color.background' );\n\tconst [ gradientValue ] = useGlobalStyle( 'color.gradient' );\n\tconst [ styles ] = useGlobalStylesOutput();\n\tconst disableMotion = useReducedMotion();\n\tconst [ coreColors ] = useGlobalSetting( 'color.palette.core' );\n\tconst [ themeColors ] = useGlobalSetting( 'color.palette.theme' );\n\tconst [ customColors ] = useGlobalSetting( 'color.palette.custom' );\n\tconst [ isHovered, setIsHovered ] = useState( false );\n\tconst [ containerResizeListener, { width } ] = useResizeObserver();\n\tconst ratio = width ? width / normalizedWidth : 1;\n\n\tconst paletteColors = ( themeColors ?? [] )\n\t\t.concat( customColors ?? [] )\n\t\t.concat( coreColors ?? [] );\n\tconst highlightedColors = paletteColors\n\t\t.filter(\n\t\t\t// we exclude these two colors because they are already visible in the preview.\n\t\t\t( { color } ) => color !== backgroundColor && color !== headingColor\n\t\t)\n\t\t.slice( 0, 2 );\n\n\t// Reset leaked styles from WP common.css and remove main content layout padding and border.\n\tconst editorStyles = useMemo( () => {\n\t\tif ( styles ) {\n\t\t\treturn [\n\t\t\t\t...styles,\n\t\t\t\t{\n\t\t\t\t\tcss: 'html{overflow:hidden}body{min-width: 0;padding: 0;border: none;}',\n\t\t\t\t\tisGlobalStyles: true,\n\t\t\t\t},\n\t\t\t];\n\t\t}\n\n\t\treturn styles;\n\t}, [ styles ] );\n\n\treturn (\n\t\t<Iframe\n\t\t\tclassName=\"edit-site-global-styles-preview__iframe\"\n\t\t\thead={ <EditorStyles styles={ editorStyles } /> }\n\t\t\tstyle={ {\n\t\t\t\theight: normalizedHeight * ratio,\n\t\t\t\tvisibility: ! width ? 'hidden' : 'visible',\n\t\t\t} }\n\t\t\tonMouseEnter={ () => setIsHovered( true ) }\n\t\t\tonMouseLeave={ () => setIsHovered( false ) }\n\t\t\ttabIndex={ -1 }\n\t\t>\n\t\t\t{ containerResizeListener }\n\t\t\t<motion.div\n\t\t\t\tstyle={ {\n\t\t\t\t\theight: normalizedHeight * ratio,\n\t\t\t\t\twidth: '100%',\n\t\t\t\t\tbackground: gradientValue ?? backgroundColor,\n\t\t\t\t\tcursor: 'pointer',\n\t\t\t\t} }\n\t\t\t\tinitial=\"start\"\n\t\t\t\tanimate={\n\t\t\t\t\t( isHovered || isFocused ) && ! disableMotion && label\n\t\t\t\t\t\t? 'hover'\n\t\t\t\t\t\t: 'start'\n\t\t\t\t}\n\t\t\t>\n\t\t\t\t<motion.div\n\t\t\t\t\tvariants={ firstFrame }\n\t\t\t\t\tstyle={ {\n\t\t\t\t\t\theight: '100%',\n\t\t\t\t\t\toverflow: 'hidden',\n\t\t\t\t\t} }\n\t\t\t\t>\n\t\t\t\t\t<HStack\n\t\t\t\t\t\tspacing={ 10 * ratio }\n\t\t\t\t\t\tjustify=\"center\"\n\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\theight: '100%',\n\t\t\t\t\t\t\toverflow: 'hidden',\n\t\t\t\t\t\t} }\n\t\t\t\t\t>\n\t\t\t\t\t\t<motion.div\n\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\tfontFamily: headingFontFamily,\n\t\t\t\t\t\t\t\tfontSize: 65 * ratio,\n\t\t\t\t\t\t\t\tcolor: headingColor,\n\t\t\t\t\t\t\t\tfontWeight: headingFontWeight,\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tanimate={ { scale: 1, opacity: 1 } }\n\t\t\t\t\t\t\tinitial={ { scale: 0.1, opacity: 0 } }\n\t\t\t\t\t\t\ttransition={ { delay: 0.3, type: 'tween' } }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\tAa\n\t\t\t\t\t\t</motion.div>\n\t\t\t\t\t\t<VStack spacing={ 4 * ratio }>\n\t\t\t\t\t\t\t{ highlightedColors.map(\n\t\t\t\t\t\t\t\t( { slug, color }, index ) => (\n\t\t\t\t\t\t\t\t\t<motion.div\n\t\t\t\t\t\t\t\t\t\tkey={ slug }\n\t\t\t\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\t\t\t\theight:\n\t\t\t\t\t\t\t\t\t\t\t\tnormalizedColorSwatchSize *\n\t\t\t\t\t\t\t\t\t\t\t\tratio,\n\t\t\t\t\t\t\t\t\t\t\twidth:\n\t\t\t\t\t\t\t\t\t\t\t\tnormalizedColorSwatchSize *\n\t\t\t\t\t\t\t\t\t\t\t\tratio,\n\t\t\t\t\t\t\t\t\t\t\tbackground: color,\n\t\t\t\t\t\t\t\t\t\t\tborderRadius:\n\t\t\t\t\t\t\t\t\t\t\t\t( normalizedColorSwatchSize *\n\t\t\t\t\t\t\t\t\t\t\t\t\tratio ) /\n\t\t\t\t\t\t\t\t\t\t\t\t2,\n\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\tanimate={ { scale: 1, opacity: 1 } }\n\t\t\t\t\t\t\t\t\t\tinitial={ { scale: 0.1, opacity: 0 } }\n\t\t\t\t\t\t\t\t\t\ttransition={ {\n\t\t\t\t\t\t\t\t\t\t\tdelay: index === 1 ? 0.2 : 0.1,\n\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</VStack>\n\t\t\t\t\t</HStack>\n\t\t\t\t</motion.div>\n\t\t\t\t<motion.div\n\t\t\t\t\tvariants={ withHoverView && midFrame }\n\t\t\t\t\tstyle={ {\n\t\t\t\t\t\theight: '100%',\n\t\t\t\t\t\twidth: '100%',\n\t\t\t\t\t\tposition: 'absolute',\n\t\t\t\t\t\ttop: 0,\n\t\t\t\t\t\toverflow: 'hidden',\n\t\t\t\t\t\tfilter: 'blur(60px)',\n\t\t\t\t\t\topacity: 0.1,\n\t\t\t\t\t} }\n\t\t\t\t>\n\t\t\t\t\t<HStack\n\t\t\t\t\t\tspacing={ 0 }\n\t\t\t\t\t\tjustify=\"flex-start\"\n\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\theight: '100%',\n\t\t\t\t\t\t\toverflow: 'hidden',\n\t\t\t\t\t\t} }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ paletteColors\n\t\t\t\t\t\t\t.slice( 0, 4 )\n\t\t\t\t\t\t\t.map( ( { color }, index ) => (\n\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\tkey={ index }\n\t\t\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\t\t\theight: '100%',\n\t\t\t\t\t\t\t\t\t\tbackground: color,\n\t\t\t\t\t\t\t\t\t\tflexGrow: 1,\n\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t) ) }\n\t\t\t\t\t</HStack>\n\t\t\t\t</motion.div>\n\t\t\t\t<motion.div\n\t\t\t\t\tvariants={ secondFrame }\n\t\t\t\t\tstyle={ {\n\t\t\t\t\t\theight: '100%',\n\t\t\t\t\t\twidth: '100%',\n\t\t\t\t\t\toverflow: 'hidden',\n\t\t\t\t\t\tposition: 'absolute',\n\t\t\t\t\t\ttop: 0,\n\t\t\t\t\t} }\n\t\t\t\t>\n\t\t\t\t\t<VStack\n\t\t\t\t\t\tspacing={ 3 * ratio }\n\t\t\t\t\t\tjustify=\"center\"\n\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\theight: '100%',\n\t\t\t\t\t\t\toverflow: 'hidden',\n\t\t\t\t\t\t\tpadding: 10 * ratio,\n\t\t\t\t\t\t\tboxSizing: 'border-box',\n\t\t\t\t\t\t} }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ label && (\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\t\tfontSize: 40 * ratio,\n\t\t\t\t\t\t\t\t\tfontFamily: headingFontFamily,\n\t\t\t\t\t\t\t\t\tcolor: headingColor,\n\t\t\t\t\t\t\t\t\tfontWeight: headingFontWeight,\n\t\t\t\t\t\t\t\t\tlineHeight: '1em',\n\t\t\t\t\t\t\t\t\ttextAlign: 'center',\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ label }\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t) }\n\t\t\t\t\t</VStack>\n\t\t\t\t</motion.div>\n\t\t\t</motion.div>\n\t\t</Iframe>\n\t);\n};\n\nexport default StylesPreview;\n"]}
|
|
1
|
+
{"version":3,"sources":["@wordpress/edit-site/src/components/global-styles/preview.js"],"names":["__unstableIframe","Iframe","__unstableEditorStyles","EditorStyles","privateApis","blockEditorPrivateApis","__unstableMotion","motion","__experimentalHStack","HStack","__experimentalVStack","VStack","useReducedMotion","useResizeObserver","useState","useMemo","unlock","useGlobalSetting","useGlobalStyle","useGlobalStylesOutput","firstFrame","start","scale","opacity","hover","midFrame","secondFrame","normalizedWidth","normalizedHeight","normalizedColorSwatchSize","StylesPreview","label","isFocused","withHoverView","fontWeight","fontFamily","headingFontFamily","headingFontWeight","textColor","headingColor","backgroundColor","gradientValue","styles","disableMotion","coreColors","themeColors","customColors","isHovered","setIsHovered","containerResizeListener","width","ratio","paletteColors","concat","highlightedColors","filter","color","slice","editorStyles","css","isGlobalStyles","height","visibility","background","cursor","overflow","fontSize","delay","type","map","index","slug","borderRadius","position","top","flexGrow","padding","boxSizing","lineHeight","textAlign"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\t__unstableIframe as Iframe,\n\t__unstableEditorStyles as EditorStyles,\n\tprivateApis as blockEditorPrivateApis,\n} from '@wordpress/block-editor';\nimport {\n\t__unstableMotion as motion,\n\t__experimentalHStack as HStack,\n\t__experimentalVStack as VStack,\n} from '@wordpress/components';\nimport { useReducedMotion, useResizeObserver } from '@wordpress/compose';\nimport { useState, useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { unlock } from '../../private-apis';\n\nconst { useGlobalSetting, useGlobalStyle, useGlobalStylesOutput } = unlock(\n\tblockEditorPrivateApis\n);\n\nconst firstFrame = {\n\tstart: {\n\t\tscale: 1,\n\t\topacity: 1,\n\t},\n\thover: {\n\t\tscale: 0,\n\t\topacity: 0,\n\t},\n};\n\nconst midFrame = {\n\thover: {\n\t\topacity: 1,\n\t},\n\tstart: {\n\t\topacity: 0.5,\n\t},\n};\n\nconst secondFrame = {\n\thover: {\n\t\tscale: 1,\n\t\topacity: 1,\n\t},\n\tstart: {\n\t\tscale: 0,\n\t\topacity: 0,\n\t},\n};\n\nconst normalizedWidth = 248;\nconst normalizedHeight = 152;\n\nconst normalizedColorSwatchSize = 32;\n\nconst StylesPreview = ( { label, isFocused, withHoverView } ) => {\n\tconst [ fontWeight ] = useGlobalStyle( 'typography.fontWeight' );\n\tconst [ fontFamily = 'serif' ] = useGlobalStyle( 'typography.fontFamily' );\n\tconst [ headingFontFamily = fontFamily ] = useGlobalStyle(\n\t\t'elements.h1.typography.fontFamily'\n\t);\n\tconst [ headingFontWeight = fontWeight ] = useGlobalStyle(\n\t\t'elements.h1.typography.fontWeight'\n\t);\n\tconst [ textColor = 'black' ] = useGlobalStyle( 'color.text' );\n\tconst [ headingColor = textColor ] = useGlobalStyle(\n\t\t'elements.h1.color.text'\n\t);\n\tconst [ backgroundColor = 'white' ] = useGlobalStyle( 'color.background' );\n\tconst [ gradientValue ] = useGlobalStyle( 'color.gradient' );\n\tconst [ styles ] = useGlobalStylesOutput();\n\tconst disableMotion = useReducedMotion();\n\tconst [ coreColors ] = useGlobalSetting( 'color.palette.core' );\n\tconst [ themeColors ] = useGlobalSetting( 'color.palette.theme' );\n\tconst [ customColors ] = useGlobalSetting( 'color.palette.custom' );\n\tconst [ isHovered, setIsHovered ] = useState( false );\n\tconst [ containerResizeListener, { width } ] = useResizeObserver();\n\tconst ratio = width ? width / normalizedWidth : 1;\n\n\tconst paletteColors = ( themeColors ?? [] )\n\t\t.concat( customColors ?? [] )\n\t\t.concat( coreColors ?? [] );\n\tconst highlightedColors = paletteColors\n\t\t.filter(\n\t\t\t// we exclude these two colors because they are already visible in the preview.\n\t\t\t( { color } ) => color !== backgroundColor && color !== headingColor\n\t\t)\n\t\t.slice( 0, 2 );\n\n\t// Reset leaked styles from WP common.css and remove main content layout padding and border.\n\tconst editorStyles = useMemo( () => {\n\t\tif ( styles ) {\n\t\t\treturn [\n\t\t\t\t...styles,\n\t\t\t\t{\n\t\t\t\t\tcss: 'html{overflow:hidden}body{min-width: 0;padding: 0;border: none;}',\n\t\t\t\t\tisGlobalStyles: true,\n\t\t\t\t},\n\t\t\t];\n\t\t}\n\n\t\treturn styles;\n\t}, [ styles ] );\n\n\treturn (\n\t\t<Iframe\n\t\t\tclassName=\"edit-site-global-styles-preview__iframe\"\n\t\t\thead={ <EditorStyles styles={ editorStyles } /> }\n\t\t\tstyle={ {\n\t\t\t\theight: normalizedHeight * ratio,\n\t\t\t\tvisibility: ! width ? 'hidden' : 'visible',\n\t\t\t} }\n\t\t\tonMouseEnter={ () => setIsHovered( true ) }\n\t\t\tonMouseLeave={ () => setIsHovered( false ) }\n\t\t\ttabIndex={ -1 }\n\t\t>\n\t\t\t{ containerResizeListener }\n\t\t\t<motion.div\n\t\t\t\tstyle={ {\n\t\t\t\t\theight: normalizedHeight * ratio,\n\t\t\t\t\twidth: '100%',\n\t\t\t\t\tbackground: gradientValue ?? backgroundColor,\n\t\t\t\t\tcursor: 'pointer',\n\t\t\t\t} }\n\t\t\t\tinitial=\"start\"\n\t\t\t\tanimate={\n\t\t\t\t\t( isHovered || isFocused ) && ! disableMotion && label\n\t\t\t\t\t\t? 'hover'\n\t\t\t\t\t\t: 'start'\n\t\t\t\t}\n\t\t\t>\n\t\t\t\t<motion.div\n\t\t\t\t\tvariants={ firstFrame }\n\t\t\t\t\tstyle={ {\n\t\t\t\t\t\theight: '100%',\n\t\t\t\t\t\toverflow: 'hidden',\n\t\t\t\t\t} }\n\t\t\t\t>\n\t\t\t\t\t<HStack\n\t\t\t\t\t\tspacing={ 10 * ratio }\n\t\t\t\t\t\tjustify=\"center\"\n\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\theight: '100%',\n\t\t\t\t\t\t\toverflow: 'hidden',\n\t\t\t\t\t\t} }\n\t\t\t\t\t>\n\t\t\t\t\t\t<motion.div\n\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\tfontFamily: headingFontFamily,\n\t\t\t\t\t\t\t\tfontSize: 65 * ratio,\n\t\t\t\t\t\t\t\tcolor: headingColor,\n\t\t\t\t\t\t\t\tfontWeight: headingFontWeight,\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tanimate={ { scale: 1, opacity: 1 } }\n\t\t\t\t\t\t\tinitial={ { scale: 0.1, opacity: 0 } }\n\t\t\t\t\t\t\ttransition={ { delay: 0.3, type: 'tween' } }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\tAa\n\t\t\t\t\t\t</motion.div>\n\t\t\t\t\t\t<VStack spacing={ 4 * ratio }>\n\t\t\t\t\t\t\t{ highlightedColors.map(\n\t\t\t\t\t\t\t\t( { slug, color }, index ) => (\n\t\t\t\t\t\t\t\t\t<motion.div\n\t\t\t\t\t\t\t\t\t\tkey={ slug }\n\t\t\t\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\t\t\t\theight:\n\t\t\t\t\t\t\t\t\t\t\t\tnormalizedColorSwatchSize *\n\t\t\t\t\t\t\t\t\t\t\t\tratio,\n\t\t\t\t\t\t\t\t\t\t\twidth:\n\t\t\t\t\t\t\t\t\t\t\t\tnormalizedColorSwatchSize *\n\t\t\t\t\t\t\t\t\t\t\t\tratio,\n\t\t\t\t\t\t\t\t\t\t\tbackground: color,\n\t\t\t\t\t\t\t\t\t\t\tborderRadius:\n\t\t\t\t\t\t\t\t\t\t\t\t( normalizedColorSwatchSize *\n\t\t\t\t\t\t\t\t\t\t\t\t\tratio ) /\n\t\t\t\t\t\t\t\t\t\t\t\t2,\n\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\tanimate={ { scale: 1, opacity: 1 } }\n\t\t\t\t\t\t\t\t\t\tinitial={ { scale: 0.1, opacity: 0 } }\n\t\t\t\t\t\t\t\t\t\ttransition={ {\n\t\t\t\t\t\t\t\t\t\t\tdelay: index === 1 ? 0.2 : 0.1,\n\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</VStack>\n\t\t\t\t\t</HStack>\n\t\t\t\t</motion.div>\n\t\t\t\t<motion.div\n\t\t\t\t\tvariants={ withHoverView && midFrame }\n\t\t\t\t\tstyle={ {\n\t\t\t\t\t\theight: '100%',\n\t\t\t\t\t\twidth: '100%',\n\t\t\t\t\t\tposition: 'absolute',\n\t\t\t\t\t\ttop: 0,\n\t\t\t\t\t\toverflow: 'hidden',\n\t\t\t\t\t\tfilter: 'blur(60px)',\n\t\t\t\t\t\topacity: 0.1,\n\t\t\t\t\t} }\n\t\t\t\t>\n\t\t\t\t\t<HStack\n\t\t\t\t\t\tspacing={ 0 }\n\t\t\t\t\t\tjustify=\"flex-start\"\n\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\theight: '100%',\n\t\t\t\t\t\t\toverflow: 'hidden',\n\t\t\t\t\t\t} }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ paletteColors\n\t\t\t\t\t\t\t.slice( 0, 4 )\n\t\t\t\t\t\t\t.map( ( { color }, index ) => (\n\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\tkey={ index }\n\t\t\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\t\t\theight: '100%',\n\t\t\t\t\t\t\t\t\t\tbackground: color,\n\t\t\t\t\t\t\t\t\t\tflexGrow: 1,\n\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t) ) }\n\t\t\t\t\t</HStack>\n\t\t\t\t</motion.div>\n\t\t\t\t<motion.div\n\t\t\t\t\tvariants={ secondFrame }\n\t\t\t\t\tstyle={ {\n\t\t\t\t\t\theight: '100%',\n\t\t\t\t\t\twidth: '100%',\n\t\t\t\t\t\toverflow: 'hidden',\n\t\t\t\t\t\tposition: 'absolute',\n\t\t\t\t\t\ttop: 0,\n\t\t\t\t\t} }\n\t\t\t\t>\n\t\t\t\t\t<VStack\n\t\t\t\t\t\tspacing={ 3 * ratio }\n\t\t\t\t\t\tjustify=\"center\"\n\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\theight: '100%',\n\t\t\t\t\t\t\toverflow: 'hidden',\n\t\t\t\t\t\t\tpadding: 10 * ratio,\n\t\t\t\t\t\t\tboxSizing: 'border-box',\n\t\t\t\t\t\t} }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ label && (\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\t\tfontSize: 40 * ratio,\n\t\t\t\t\t\t\t\t\tfontFamily: headingFontFamily,\n\t\t\t\t\t\t\t\t\tcolor: headingColor,\n\t\t\t\t\t\t\t\t\tfontWeight: headingFontWeight,\n\t\t\t\t\t\t\t\t\tlineHeight: '1em',\n\t\t\t\t\t\t\t\t\ttextAlign: 'center',\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ label }\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t) }\n\t\t\t\t\t</VStack>\n\t\t\t\t</motion.div>\n\t\t\t</motion.div>\n\t\t</Iframe>\n\t);\n};\n\nexport default StylesPreview;\n"]}
|
|
@@ -10,18 +10,18 @@ import classnames from 'classnames';
|
|
|
10
10
|
*/
|
|
11
11
|
|
|
12
12
|
import { __ } from '@wordpress/i18n';
|
|
13
|
-
import { __experimentalColorGradientControl as ColorGradientControl,
|
|
13
|
+
import { __experimentalColorGradientControl as ColorGradientControl, privateApis as blockEditorPrivateApis } from '@wordpress/block-editor';
|
|
14
14
|
/**
|
|
15
15
|
* Internal dependencies
|
|
16
16
|
*/
|
|
17
17
|
|
|
18
18
|
import ScreenHeader from './header';
|
|
19
19
|
import { getSupportedGlobalStylesPanels, useColorsPerOrigin, useGradientsPerOrigin } from './hooks';
|
|
20
|
-
import { unlock } from '../../
|
|
20
|
+
import { unlock } from '../../private-apis';
|
|
21
21
|
const {
|
|
22
22
|
useGlobalSetting,
|
|
23
23
|
useGlobalStyle
|
|
24
|
-
} = unlock(
|
|
24
|
+
} = unlock(blockEditorPrivateApis);
|
|
25
25
|
|
|
26
26
|
function ScreenBackgroundColor(_ref) {
|
|
27
27
|
let {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["@wordpress/edit-site/src/components/global-styles/screen-background-color.js"],"names":["classnames","__","__experimentalColorGradientControl","ColorGradientControl","
|
|
1
|
+
{"version":3,"sources":["@wordpress/edit-site/src/components/global-styles/screen-background-color.js"],"names":["classnames","__","__experimentalColorGradientControl","ColorGradientControl","privateApis","blockEditorPrivateApis","ScreenHeader","getSupportedGlobalStylesPanels","useColorsPerOrigin","useGradientsPerOrigin","unlock","useGlobalSetting","useGlobalStyle","ScreenBackgroundColor","name","variation","prefix","supports","areCustomSolidsEnabled","areCustomGradientsEnabled","colorsPerOrigin","gradientsPerOrigin","isBackgroundEnabled","hasBackgroundColor","includes","length","hasGradientColor","backgroundColor","setBackgroundColor","userBackgroundColor","gradient","setGradient","userGradient","backgroundSettings","colorValue","onColorChange","clearable","gradientSettings","gradientValue","onGradientChange","controlProps"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport {\n\t__experimentalColorGradientControl as ColorGradientControl,\n\tprivateApis as blockEditorPrivateApis,\n} from '@wordpress/block-editor';\n\n/**\n * Internal dependencies\n */\nimport ScreenHeader from './header';\nimport {\n\tgetSupportedGlobalStylesPanels,\n\tuseColorsPerOrigin,\n\tuseGradientsPerOrigin,\n} from './hooks';\nimport { unlock } from '../../private-apis';\n\nconst { useGlobalSetting, useGlobalStyle } = unlock( blockEditorPrivateApis );\n\nfunction ScreenBackgroundColor( { name, variation = '' } ) {\n\tconst prefix = variation ? `variations.${ variation }.` : '';\n\tconst supports = getSupportedGlobalStylesPanels( name );\n\tconst [ areCustomSolidsEnabled ] = useGlobalSetting( 'color.custom', name );\n\tconst [ areCustomGradientsEnabled ] = useGlobalSetting(\n\t\t'color.customGradient',\n\t\tname\n\t);\n\tconst colorsPerOrigin = useColorsPerOrigin( name );\n\tconst gradientsPerOrigin = useGradientsPerOrigin( name );\n\n\tconst [ isBackgroundEnabled ] = useGlobalSetting(\n\t\t'color.background',\n\t\tname\n\t);\n\n\tconst hasBackgroundColor =\n\t\tsupports.includes( 'backgroundColor' ) &&\n\t\tisBackgroundEnabled &&\n\t\t( colorsPerOrigin.length > 0 || areCustomSolidsEnabled );\n\tconst hasGradientColor =\n\t\tsupports.includes( 'background' ) &&\n\t\t( gradientsPerOrigin.length > 0 || areCustomGradientsEnabled );\n\tconst [ backgroundColor, setBackgroundColor ] = useGlobalStyle(\n\t\tprefix + 'color.background',\n\t\tname\n\t);\n\tconst [ userBackgroundColor ] = useGlobalStyle(\n\t\tprefix + 'color.background',\n\t\tname,\n\t\t'user'\n\t);\n\tconst [ gradient, setGradient ] = useGlobalStyle(\n\t\tprefix + 'color.gradient',\n\t\tname\n\t);\n\tconst [ userGradient ] = useGlobalStyle(\n\t\tprefix + 'color.gradient',\n\t\tname,\n\t\t'user'\n\t);\n\n\tif ( ! hasBackgroundColor && ! hasGradientColor ) {\n\t\treturn null;\n\t}\n\n\tlet backgroundSettings = {};\n\tif ( hasBackgroundColor ) {\n\t\tbackgroundSettings = {\n\t\t\tcolorValue: backgroundColor,\n\t\t\tonColorChange: setBackgroundColor,\n\t\t};\n\t\tif ( backgroundColor ) {\n\t\t\tbackgroundSettings.clearable =\n\t\t\t\tbackgroundColor === userBackgroundColor;\n\t\t}\n\t}\n\n\tlet gradientSettings = {};\n\tif ( hasGradientColor ) {\n\t\tgradientSettings = {\n\t\t\tgradientValue: gradient,\n\t\t\tonGradientChange: setGradient,\n\t\t};\n\t\tif ( gradient ) {\n\t\t\tgradientSettings.clearable = gradient === userGradient;\n\t\t}\n\t}\n\n\tconst controlProps = {\n\t\t...backgroundSettings,\n\t\t...gradientSettings,\n\t};\n\n\treturn (\n\t\t<>\n\t\t\t<ScreenHeader\n\t\t\t\ttitle={ __( 'Background' ) }\n\t\t\t\tdescription={ __(\n\t\t\t\t\t'Set a background color or gradient for the whole site.'\n\t\t\t\t) }\n\t\t\t/>\n\t\t\t<ColorGradientControl\n\t\t\t\tclassName={ classnames(\n\t\t\t\t\t'edit-site-screen-background-color__control',\n\t\t\t\t\t{\n\t\t\t\t\t\t'has-no-tabs':\n\t\t\t\t\t\t\t! hasBackgroundColor || ! hasGradientColor,\n\t\t\t\t\t}\n\t\t\t\t) }\n\t\t\t\tcolors={ colorsPerOrigin }\n\t\t\t\tgradients={ gradientsPerOrigin }\n\t\t\t\tdisableCustomColors={ ! areCustomSolidsEnabled }\n\t\t\t\tdisableCustomGradients={ ! areCustomGradientsEnabled }\n\t\t\t\tshowTitle={ false }\n\t\t\t\tenableAlpha\n\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t{ ...controlProps }\n\t\t\t/>\n\t\t</>\n\t);\n}\n\nexport default ScreenBackgroundColor;\n"]}
|
|
@@ -4,18 +4,18 @@ import { createElement, Fragment } from "@wordpress/element";
|
|
|
4
4
|
* WordPress dependencies
|
|
5
5
|
*/
|
|
6
6
|
import { __ } from '@wordpress/i18n';
|
|
7
|
-
import { __experimentalColorGradientControl as ColorGradientControl,
|
|
7
|
+
import { __experimentalColorGradientControl as ColorGradientControl, privateApis as blockEditorPrivateApis } from '@wordpress/block-editor';
|
|
8
8
|
/**
|
|
9
9
|
* Internal dependencies
|
|
10
10
|
*/
|
|
11
11
|
|
|
12
12
|
import ScreenHeader from './header';
|
|
13
13
|
import { getSupportedGlobalStylesPanels, useColorsPerOrigin } from './hooks';
|
|
14
|
-
import { unlock } from '../../
|
|
14
|
+
import { unlock } from '../../private-apis';
|
|
15
15
|
const {
|
|
16
16
|
useGlobalSetting,
|
|
17
17
|
useGlobalStyle
|
|
18
|
-
} = unlock(
|
|
18
|
+
} = unlock(blockEditorPrivateApis);
|
|
19
19
|
|
|
20
20
|
function ScreenButtonColor(_ref) {
|
|
21
21
|
let {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["@wordpress/edit-site/src/components/global-styles/screen-button-color.js"],"names":["__","__experimentalColorGradientControl","ColorGradientControl","
|
|
1
|
+
{"version":3,"sources":["@wordpress/edit-site/src/components/global-styles/screen-button-color.js"],"names":["__","__experimentalColorGradientControl","ColorGradientControl","privateApis","blockEditorPrivateApis","ScreenHeader","getSupportedGlobalStylesPanels","useColorsPerOrigin","unlock","useGlobalSetting","useGlobalStyle","ScreenButtonColor","name","variation","prefix","supports","colorsPerOrigin","areCustomSolidsEnabled","isBackgroundEnabled","hasButtonColor","includes","length","buttonTextColor","setButtonTextColor","userButtonTextColor","buttonBgColor","setButtonBgColor","userButtonBgColor"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,EAAT,QAAmB,iBAAnB;AACA,SACCC,kCAAkC,IAAIC,oBADvC,EAECC,WAAW,IAAIC,sBAFhB,QAGO,yBAHP;AAKA;AACA;AACA;;AACA,OAAOC,YAAP,MAAyB,UAAzB;AACA,SAASC,8BAAT,EAAyCC,kBAAzC,QAAmE,SAAnE;AACA,SAASC,MAAT,QAAuB,oBAAvB;AAEA,MAAM;AAAEC,EAAAA,gBAAF;AAAoBC,EAAAA;AAApB,IAAuCF,MAAM,CAAEJ,sBAAF,CAAnD;;AAEA,SAASO,iBAAT,OAAuD;AAAA,MAA3B;AAAEC,IAAAA,IAAF;AAAQC,IAAAA,SAAS,GAAG;AAApB,GAA2B;AACtD,QAAMC,MAAM,GAAGD,SAAS,GAAI,cAAcA,SAAW,GAA7B,GAAkC,EAA1D;AACA,QAAME,QAAQ,GAAGT,8BAA8B,CAAEM,IAAF,CAA/C;AACA,QAAMI,eAAe,GAAGT,kBAAkB,CAAEK,IAAF,CAA1C;AACA,QAAM,CAAEK,sBAAF,IAA6BR,gBAAgB,CAAE,cAAF,EAAkBG,IAAlB,CAAnD;AACA,QAAM,CAAEM,mBAAF,IAA0BT,gBAAgB,CAC/C,kBAD+C,EAE/CG,IAF+C,CAAhD;AAKA,QAAMO,cAAc,GACnBJ,QAAQ,CAACK,QAAT,CAAmB,aAAnB,KACAF,mBADA,KAEEF,eAAe,CAACK,MAAhB,GAAyB,CAAzB,IAA8BJ,sBAFhC,CADD;AAKA,QAAM,CAAEK,eAAF,EAAmBC,kBAAnB,IAA0Cb,cAAc,CAC7DI,MAAM,GAAG,4BADoD,EAE7DF,IAF6D,CAA9D;AAIA,QAAM,CAAEY,mBAAF,IAA0Bd,cAAc,CAC7C,4BAD6C,EAE7CE,IAF6C,EAG7C,MAH6C,CAA9C;AAMA,QAAM,CAAEa,aAAF,EAAiBC,gBAAjB,IAAsChB,cAAc,CACzD,kCADyD,EAEzDE,IAFyD,CAA1D;AAIA,QAAM,CAAEe,iBAAF,IAAwBjB,cAAc,CAC3C,kCAD2C,EAE3CE,IAF2C,EAG3C,MAH2C,CAA5C;;AAMA,MAAK,CAAEO,cAAP,EAAwB;AACvB,WAAO,IAAP;AACA;;AAED,SACC,8BACC,cAAC,YAAD;AACC,IAAA,KAAK,EAAGnB,EAAE,CAAE,SAAF,CADX;AAEC,IAAA,WAAW,EAAGA,EAAE,CACf,0DADe;AAFjB,IADD,EAQC;AAAI,IAAA,SAAS,EAAC;AAAd,KACGA,EAAE,CAAE,YAAF,CADL,CARD,EAYC,cAAC,oBAAD;AACC,IAAA,SAAS,EAAC,wCADX;AAEC,IAAA,MAAM,EAAGgB,eAFV;AAGC,IAAA,mBAAmB,EAAG,CAAEC,sBAHzB;AAIC,IAAA,SAAS,EAAG,KAJb;AAKC,IAAA,WAAW,MALZ;AAMC,IAAA,iCAAiC,MANlC;AAOC,IAAA,UAAU,EAAGK,eAPd;AAQC,IAAA,aAAa,EAAGC,kBARjB;AASC,IAAA,SAAS,EAAGD,eAAe,KAAKE;AATjC,IAZD,EAwBC;AAAI,IAAA,SAAS,EAAC;AAAd,KACGxB,EAAE,CAAE,kBAAF,CADL,CAxBD,EA4BC,cAAC,oBAAD;AACC,IAAA,SAAS,EAAC,wCADX;AAEC,IAAA,MAAM,EAAGgB,eAFV;AAGC,IAAA,mBAAmB,EAAG,CAAEC,sBAHzB;AAIC,IAAA,SAAS,EAAG,KAJb;AAKC,IAAA,WAAW,MALZ;AAMC,IAAA,iCAAiC,MANlC;AAOC,IAAA,UAAU,EAAGQ,aAPd;AAQC,IAAA,aAAa,EAAGC,gBARjB;AASC,IAAA,SAAS,EAAGD,aAAa,KAAKE;AAT/B,IA5BD,CADD;AA0CA;;AAED,eAAehB,iBAAf","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport {\n\t__experimentalColorGradientControl as ColorGradientControl,\n\tprivateApis as blockEditorPrivateApis,\n} from '@wordpress/block-editor';\n\n/**\n * Internal dependencies\n */\nimport ScreenHeader from './header';\nimport { getSupportedGlobalStylesPanels, useColorsPerOrigin } from './hooks';\nimport { unlock } from '../../private-apis';\n\nconst { useGlobalSetting, useGlobalStyle } = unlock( blockEditorPrivateApis );\n\nfunction ScreenButtonColor( { name, variation = '' } ) {\n\tconst prefix = variation ? `variations.${ variation }.` : '';\n\tconst supports = getSupportedGlobalStylesPanels( name );\n\tconst colorsPerOrigin = useColorsPerOrigin( name );\n\tconst [ areCustomSolidsEnabled ] = useGlobalSetting( 'color.custom', name );\n\tconst [ isBackgroundEnabled ] = useGlobalSetting(\n\t\t'color.background',\n\t\tname\n\t);\n\n\tconst hasButtonColor =\n\t\tsupports.includes( 'buttonColor' ) &&\n\t\tisBackgroundEnabled &&\n\t\t( colorsPerOrigin.length > 0 || areCustomSolidsEnabled );\n\n\tconst [ buttonTextColor, setButtonTextColor ] = useGlobalStyle(\n\t\tprefix + 'elements.button.color.text',\n\t\tname\n\t);\n\tconst [ userButtonTextColor ] = useGlobalStyle(\n\t\t'elements.button.color.text',\n\t\tname,\n\t\t'user'\n\t);\n\n\tconst [ buttonBgColor, setButtonBgColor ] = useGlobalStyle(\n\t\t'elements.button.color.background',\n\t\tname\n\t);\n\tconst [ userButtonBgColor ] = useGlobalStyle(\n\t\t'elements.button.color.background',\n\t\tname,\n\t\t'user'\n\t);\n\n\tif ( ! hasButtonColor ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<>\n\t\t\t<ScreenHeader\n\t\t\t\ttitle={ __( 'Buttons' ) }\n\t\t\t\tdescription={ __(\n\t\t\t\t\t'Set the default colors used for buttons across the site.'\n\t\t\t\t) }\n\t\t\t/>\n\n\t\t\t<h4 className=\"edit-site-global-styles-section-title\">\n\t\t\t\t{ __( 'Text color' ) }\n\t\t\t</h4>\n\n\t\t\t<ColorGradientControl\n\t\t\t\tclassName=\"edit-site-screen-button-color__control\"\n\t\t\t\tcolors={ colorsPerOrigin }\n\t\t\t\tdisableCustomColors={ ! areCustomSolidsEnabled }\n\t\t\t\tshowTitle={ false }\n\t\t\t\tenableAlpha\n\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\tcolorValue={ buttonTextColor }\n\t\t\t\tonColorChange={ setButtonTextColor }\n\t\t\t\tclearable={ buttonTextColor === userButtonTextColor }\n\t\t\t/>\n\n\t\t\t<h4 className=\"edit-site-global-styles-section-title\">\n\t\t\t\t{ __( 'Background color' ) }\n\t\t\t</h4>\n\n\t\t\t<ColorGradientControl\n\t\t\t\tclassName=\"edit-site-screen-button-color__control\"\n\t\t\t\tcolors={ colorsPerOrigin }\n\t\t\t\tdisableCustomColors={ ! areCustomSolidsEnabled }\n\t\t\t\tshowTitle={ false }\n\t\t\t\tenableAlpha\n\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\tcolorValue={ buttonBgColor }\n\t\t\t\tonColorChange={ setButtonBgColor }\n\t\t\t\tclearable={ buttonBgColor === userButtonBgColor }\n\t\t\t/>\n\t\t</>\n\t);\n}\n\nexport default ScreenButtonColor;\n"]}
|
|
@@ -5,7 +5,7 @@ import { createElement, Fragment } from "@wordpress/element";
|
|
|
5
5
|
*/
|
|
6
6
|
import { __ } from '@wordpress/i18n';
|
|
7
7
|
import { __experimentalItemGroup as ItemGroup, __experimentalHStack as HStack, __experimentalVStack as VStack, __experimentalZStack as ZStack, FlexItem, ColorIndicator } from '@wordpress/components';
|
|
8
|
-
import {
|
|
8
|
+
import { privateApis as blockEditorPrivateApis } from '@wordpress/block-editor';
|
|
9
9
|
/**
|
|
10
10
|
* Internal dependencies
|
|
11
11
|
*/
|
|
@@ -18,10 +18,10 @@ import Subtitle from './subtitle';
|
|
|
18
18
|
import ColorIndicatorWrapper from './color-indicator-wrapper';
|
|
19
19
|
import BlockPreviewPanel from './block-preview-panel';
|
|
20
20
|
import { getVariationClassName } from './utils';
|
|
21
|
-
import { unlock } from '../../
|
|
21
|
+
import { unlock } from '../../private-apis';
|
|
22
22
|
const {
|
|
23
23
|
useGlobalStyle
|
|
24
|
-
} = unlock(
|
|
24
|
+
} = unlock(blockEditorPrivateApis);
|
|
25
25
|
|
|
26
26
|
function BackgroundColorItem(_ref) {
|
|
27
27
|
let {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["@wordpress/edit-site/src/components/global-styles/screen-colors.js"],"names":["__","__experimentalItemGroup","ItemGroup","__experimentalHStack","HStack","__experimentalVStack","VStack","__experimentalZStack","ZStack","FlexItem","ColorIndicator","experiments","blockEditorExperiments","ScreenHeader","Palette","NavigationButtonAsItem","getSupportedGlobalStylesPanels","Subtitle","ColorIndicatorWrapper","BlockPreviewPanel","getVariationClassName","unlock","useGlobalStyle","BackgroundColorItem","name","parentMenu","variation","prefix","urlPrefix","supports","hasSupport","includes","backgroundColor","gradientValue","TextColorItem","color","LinkColorItem","colorHover","HeadingColorItem","bgColor","ButtonColorItem","ScreenColors","undefined","encodeURIComponent","variationClassName"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport {\n\t__experimentalItemGroup as ItemGroup,\n\t__experimentalHStack as HStack,\n\t__experimentalVStack as VStack,\n\t__experimentalZStack as ZStack,\n\tFlexItem,\n\tColorIndicator,\n} from '@wordpress/components';\nimport { experiments as blockEditorExperiments } from '@wordpress/block-editor';\n\n/**\n * Internal dependencies\n */\nimport ScreenHeader from './header';\nimport Palette from './palette';\nimport { NavigationButtonAsItem } from './navigation-button';\nimport { getSupportedGlobalStylesPanels } from './hooks';\nimport Subtitle from './subtitle';\nimport ColorIndicatorWrapper from './color-indicator-wrapper';\nimport BlockPreviewPanel from './block-preview-panel';\nimport { getVariationClassName } from './utils';\nimport { unlock } from '../../experiments';\n\nconst { useGlobalStyle } = unlock( blockEditorExperiments );\n\nfunction BackgroundColorItem( { name, parentMenu, variation = '' } ) {\n\tconst prefix = variation ? `variations.${ variation }.` : '';\n\tconst urlPrefix = variation ? `/variations/${ variation }` : '';\n\tconst supports = getSupportedGlobalStylesPanels( name );\n\tconst hasSupport =\n\t\tsupports.includes( 'backgroundColor' ) ||\n\t\tsupports.includes( 'background' );\n\tconst [ backgroundColor ] = useGlobalStyle(\n\t\tprefix + 'color.background',\n\t\tname\n\t);\n\tconst [ gradientValue ] = useGlobalStyle( prefix + 'color.gradient', name );\n\n\tif ( ! hasSupport ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<NavigationButtonAsItem\n\t\t\tpath={ parentMenu + urlPrefix + '/colors/background' }\n\t\t\taria-label={ __( 'Colors background styles' ) }\n\t\t>\n\t\t\t<HStack justify=\"flex-start\">\n\t\t\t\t<ColorIndicatorWrapper expanded={ false }>\n\t\t\t\t\t<ColorIndicator\n\t\t\t\t\t\tcolorValue={ gradientValue ?? backgroundColor }\n\t\t\t\t\t\tdata-testid=\"background-color-indicator\"\n\t\t\t\t\t/>\n\t\t\t\t</ColorIndicatorWrapper>\n\t\t\t\t<FlexItem className=\"edit-site-global-styles__color-label\">\n\t\t\t\t\t{ __( 'Background' ) }\n\t\t\t\t</FlexItem>\n\t\t\t</HStack>\n\t\t</NavigationButtonAsItem>\n\t);\n}\n\nfunction TextColorItem( { name, parentMenu, variation = '' } ) {\n\tconst prefix = variation ? `variations.${ variation }.` : '';\n\tconst urlPrefix = variation ? `/variations/${ variation }` : '';\n\tconst supports = getSupportedGlobalStylesPanels( name );\n\tconst hasSupport = supports.includes( 'color' );\n\tconst [ color ] = useGlobalStyle( prefix + 'color.text', name );\n\n\tif ( ! hasSupport ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<NavigationButtonAsItem\n\t\t\tpath={ parentMenu + urlPrefix + '/colors/text' }\n\t\t\taria-label={ __( 'Colors text styles' ) }\n\t\t>\n\t\t\t<HStack justify=\"flex-start\">\n\t\t\t\t<ColorIndicatorWrapper expanded={ false }>\n\t\t\t\t\t<ColorIndicator\n\t\t\t\t\t\tcolorValue={ color }\n\t\t\t\t\t\tdata-testid=\"text-color-indicator\"\n\t\t\t\t\t/>\n\t\t\t\t</ColorIndicatorWrapper>\n\t\t\t\t<FlexItem className=\"edit-site-global-styles__color-label\">\n\t\t\t\t\t{ __( 'Text' ) }\n\t\t\t\t</FlexItem>\n\t\t\t</HStack>\n\t\t</NavigationButtonAsItem>\n\t);\n}\n\nfunction LinkColorItem( { name, parentMenu, variation = '' } ) {\n\tconst prefix = variation ? `variations.${ variation }.` : '';\n\tconst urlPrefix = variation ? `/variations/${ variation }` : '';\n\tconst supports = getSupportedGlobalStylesPanels( name );\n\tconst hasSupport = supports.includes( 'linkColor' );\n\tconst [ color ] = useGlobalStyle(\n\t\tprefix + 'elements.link.color.text',\n\t\tname\n\t);\n\tconst [ colorHover ] = useGlobalStyle(\n\t\tprefix + 'elements.link.:hover.color.text',\n\t\tname\n\t);\n\n\tif ( ! hasSupport ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<NavigationButtonAsItem\n\t\t\tpath={ parentMenu + urlPrefix + '/colors/link' }\n\t\t\taria-label={ __( 'Colors link styles' ) }\n\t\t>\n\t\t\t<HStack justify=\"flex-start\">\n\t\t\t\t<ZStack isLayered={ false } offset={ -8 }>\n\t\t\t\t\t<ColorIndicatorWrapper expanded={ false }>\n\t\t\t\t\t\t<ColorIndicator colorValue={ color } />\n\t\t\t\t\t</ColorIndicatorWrapper>\n\t\t\t\t\t<ColorIndicatorWrapper expanded={ false }>\n\t\t\t\t\t\t<ColorIndicator colorValue={ colorHover } />\n\t\t\t\t\t</ColorIndicatorWrapper>\n\t\t\t\t</ZStack>\n\t\t\t\t<FlexItem className=\"edit-site-global-styles__color-label\">\n\t\t\t\t\t{ __( 'Links' ) }\n\t\t\t\t</FlexItem>\n\t\t\t</HStack>\n\t\t</NavigationButtonAsItem>\n\t);\n}\n\nfunction HeadingColorItem( { name, parentMenu, variation = '' } ) {\n\tconst prefix = variation ? `variations.${ variation }.` : '';\n\tconst urlPrefix = variation ? `/variations/${ variation }` : '';\n\tconst supports = getSupportedGlobalStylesPanels( name );\n\tconst hasSupport = supports.includes( 'color' );\n\tconst [ color ] = useGlobalStyle(\n\t\tprefix + 'elements.heading.color.text',\n\t\tname\n\t);\n\tconst [ bgColor ] = useGlobalStyle(\n\t\tprefix + 'elements.heading.color.background',\n\t\tname\n\t);\n\n\tif ( ! hasSupport ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<NavigationButtonAsItem\n\t\t\tpath={ parentMenu + urlPrefix + '/colors/heading' }\n\t\t\taria-label={ __( 'Colors heading styles' ) }\n\t\t>\n\t\t\t<HStack justify=\"flex-start\">\n\t\t\t\t<ZStack isLayered={ false } offset={ -8 }>\n\t\t\t\t\t<ColorIndicatorWrapper expanded={ false }>\n\t\t\t\t\t\t<ColorIndicator colorValue={ bgColor } />\n\t\t\t\t\t</ColorIndicatorWrapper>\n\t\t\t\t\t<ColorIndicatorWrapper expanded={ false }>\n\t\t\t\t\t\t<ColorIndicator colorValue={ color } />\n\t\t\t\t\t</ColorIndicatorWrapper>\n\t\t\t\t</ZStack>\n\t\t\t\t<FlexItem>{ __( 'Headings' ) }</FlexItem>\n\t\t\t</HStack>\n\t\t</NavigationButtonAsItem>\n\t);\n}\n\nfunction ButtonColorItem( { name, parentMenu, variation = '' } ) {\n\tconst prefix = variation ? `variations.${ variation }.` : '';\n\tconst urlPrefix = variation ? `/variations/${ variation }` : '';\n\tconst supports = getSupportedGlobalStylesPanels( name );\n\tconst hasSupport = supports.includes( 'buttonColor' );\n\tconst [ color ] = useGlobalStyle(\n\t\tprefix + 'elements.button.color.text',\n\t\tname\n\t);\n\tconst [ bgColor ] = useGlobalStyle(\n\t\tprefix + 'elements.button.color.background',\n\t\tname\n\t);\n\n\tif ( ! hasSupport ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<NavigationButtonAsItem\n\t\t\tpath={ parentMenu + urlPrefix + '/colors/button' }\n\t\t>\n\t\t\t<HStack justify=\"flex-start\">\n\t\t\t\t<ZStack isLayered={ false } offset={ -8 }>\n\t\t\t\t\t<ColorIndicatorWrapper expanded={ false }>\n\t\t\t\t\t\t<ColorIndicator colorValue={ bgColor } />\n\t\t\t\t\t</ColorIndicatorWrapper>\n\t\t\t\t\t<ColorIndicatorWrapper expanded={ false }>\n\t\t\t\t\t\t<ColorIndicator colorValue={ color } />\n\t\t\t\t\t</ColorIndicatorWrapper>\n\t\t\t\t</ZStack>\n\t\t\t\t<FlexItem className=\"edit-site-global-styles__color-label\">\n\t\t\t\t\t{ __( 'Buttons' ) }\n\t\t\t\t</FlexItem>\n\t\t\t</HStack>\n\t\t</NavigationButtonAsItem>\n\t);\n}\n\nfunction ScreenColors( { name, variation = '' } ) {\n\tconst parentMenu =\n\t\tname === undefined ? '' : '/blocks/' + encodeURIComponent( name );\n\tconst variationClassName = getVariationClassName( variation );\n\n\treturn (\n\t\t<>\n\t\t\t<ScreenHeader\n\t\t\t\ttitle={ __( 'Colors' ) }\n\t\t\t\tdescription={ __(\n\t\t\t\t\t'Manage palettes and the default color of different global elements on the site.'\n\t\t\t\t) }\n\t\t\t/>\n\n\t\t\t<BlockPreviewPanel name={ name } variation={ variationClassName } />\n\n\t\t\t<div className=\"edit-site-global-styles-screen-colors\">\n\t\t\t\t<VStack spacing={ 10 }>\n\t\t\t\t\t<Palette name={ name } />\n\n\t\t\t\t\t<VStack spacing={ 3 }>\n\t\t\t\t\t\t<Subtitle>{ __( 'Elements' ) }</Subtitle>\n\t\t\t\t\t\t<ItemGroup isBordered isSeparated>\n\t\t\t\t\t\t\t<BackgroundColorItem\n\t\t\t\t\t\t\t\tname={ name }\n\t\t\t\t\t\t\t\tparentMenu={ parentMenu }\n\t\t\t\t\t\t\t\tvariation={ variation }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t<TextColorItem\n\t\t\t\t\t\t\t\tname={ name }\n\t\t\t\t\t\t\t\tparentMenu={ parentMenu }\n\t\t\t\t\t\t\t\tvariation={ variation }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t<LinkColorItem\n\t\t\t\t\t\t\t\tname={ name }\n\t\t\t\t\t\t\t\tparentMenu={ parentMenu }\n\t\t\t\t\t\t\t\tvariation={ variation }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t<HeadingColorItem\n\t\t\t\t\t\t\t\tname={ name }\n\t\t\t\t\t\t\t\tparentMenu={ parentMenu }\n\t\t\t\t\t\t\t\tvariation={ variation }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t<ButtonColorItem\n\t\t\t\t\t\t\t\tname={ name }\n\t\t\t\t\t\t\t\tparentMenu={ parentMenu }\n\t\t\t\t\t\t\t\tvariation={ variation }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</ItemGroup>\n\t\t\t\t\t</VStack>\n\t\t\t\t</VStack>\n\t\t\t</div>\n\t\t</>\n\t);\n}\n\nexport default ScreenColors;\n"]}
|
|
1
|
+
{"version":3,"sources":["@wordpress/edit-site/src/components/global-styles/screen-colors.js"],"names":["__","__experimentalItemGroup","ItemGroup","__experimentalHStack","HStack","__experimentalVStack","VStack","__experimentalZStack","ZStack","FlexItem","ColorIndicator","privateApis","blockEditorPrivateApis","ScreenHeader","Palette","NavigationButtonAsItem","getSupportedGlobalStylesPanels","Subtitle","ColorIndicatorWrapper","BlockPreviewPanel","getVariationClassName","unlock","useGlobalStyle","BackgroundColorItem","name","parentMenu","variation","prefix","urlPrefix","supports","hasSupport","includes","backgroundColor","gradientValue","TextColorItem","color","LinkColorItem","colorHover","HeadingColorItem","bgColor","ButtonColorItem","ScreenColors","undefined","encodeURIComponent","variationClassName"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,EAAT,QAAmB,iBAAnB;AACA,SACCC,uBAAuB,IAAIC,SAD5B,EAECC,oBAAoB,IAAIC,MAFzB,EAGCC,oBAAoB,IAAIC,MAHzB,EAICC,oBAAoB,IAAIC,MAJzB,EAKCC,QALD,EAMCC,cAND,QAOO,uBAPP;AAQA,SAASC,WAAW,IAAIC,sBAAxB,QAAsD,yBAAtD;AAEA;AACA;AACA;;AACA,OAAOC,YAAP,MAAyB,UAAzB;AACA,OAAOC,OAAP,MAAoB,WAApB;AACA,SAASC,sBAAT,QAAuC,qBAAvC;AACA,SAASC,8BAAT,QAA+C,SAA/C;AACA,OAAOC,QAAP,MAAqB,YAArB;AACA,OAAOC,qBAAP,MAAkC,2BAAlC;AACA,OAAOC,iBAAP,MAA8B,uBAA9B;AACA,SAASC,qBAAT,QAAsC,SAAtC;AACA,SAASC,MAAT,QAAuB,oBAAvB;AAEA,MAAM;AAAEC,EAAAA;AAAF,IAAqBD,MAAM,CAAET,sBAAF,CAAjC;;AAEA,SAASW,mBAAT,OAAqE;AAAA,MAAvC;AAAEC,IAAAA,IAAF;AAAQC,IAAAA,UAAR;AAAoBC,IAAAA,SAAS,GAAG;AAAhC,GAAuC;AACpE,QAAMC,MAAM,GAAGD,SAAS,GAAI,cAAcA,SAAW,GAA7B,GAAkC,EAA1D;AACA,QAAME,SAAS,GAAGF,SAAS,GAAI,eAAeA,SAAW,EAA9B,GAAkC,EAA7D;AACA,QAAMG,QAAQ,GAAGb,8BAA8B,CAAEQ,IAAF,CAA/C;AACA,QAAMM,UAAU,GACfD,QAAQ,CAACE,QAAT,CAAmB,iBAAnB,KACAF,QAAQ,CAACE,QAAT,CAAmB,YAAnB,CAFD;AAGA,QAAM,CAAEC,eAAF,IAAsBV,cAAc,CACzCK,MAAM,GAAG,kBADgC,EAEzCH,IAFyC,CAA1C;AAIA,QAAM,CAAES,aAAF,IAAoBX,cAAc,CAAEK,MAAM,GAAG,gBAAX,EAA6BH,IAA7B,CAAxC;;AAEA,MAAK,CAAEM,UAAP,EAAoB;AACnB,WAAO,IAAP;AACA;;AAED,SACC,cAAC,sBAAD;AACC,IAAA,IAAI,EAAGL,UAAU,GAAGG,SAAb,GAAyB,oBADjC;AAEC,kBAAa5B,EAAE,CAAE,0BAAF;AAFhB,KAIC,cAAC,MAAD;AAAQ,IAAA,OAAO,EAAC;AAAhB,KACC,cAAC,qBAAD;AAAuB,IAAA,QAAQ,EAAG;AAAlC,KACC,cAAC,cAAD;AACC,IAAA,UAAU,EAAGiC,aAAH,aAAGA,aAAH,cAAGA,aAAH,GAAoBD,eAD/B;AAEC,mBAAY;AAFb,IADD,CADD,EAOC,cAAC,QAAD;AAAU,IAAA,SAAS,EAAC;AAApB,KACGhC,EAAE,CAAE,YAAF,CADL,CAPD,CAJD,CADD;AAkBA;;AAED,SAASkC,aAAT,QAA+D;AAAA,MAAvC;AAAEV,IAAAA,IAAF;AAAQC,IAAAA,UAAR;AAAoBC,IAAAA,SAAS,GAAG;AAAhC,GAAuC;AAC9D,QAAMC,MAAM,GAAGD,SAAS,GAAI,cAAcA,SAAW,GAA7B,GAAkC,EAA1D;AACA,QAAME,SAAS,GAAGF,SAAS,GAAI,eAAeA,SAAW,EAA9B,GAAkC,EAA7D;AACA,QAAMG,QAAQ,GAAGb,8BAA8B,CAAEQ,IAAF,CAA/C;AACA,QAAMM,UAAU,GAAGD,QAAQ,CAACE,QAAT,CAAmB,OAAnB,CAAnB;AACA,QAAM,CAAEI,KAAF,IAAYb,cAAc,CAAEK,MAAM,GAAG,YAAX,EAAyBH,IAAzB,CAAhC;;AAEA,MAAK,CAAEM,UAAP,EAAoB;AACnB,WAAO,IAAP;AACA;;AAED,SACC,cAAC,sBAAD;AACC,IAAA,IAAI,EAAGL,UAAU,GAAGG,SAAb,GAAyB,cADjC;AAEC,kBAAa5B,EAAE,CAAE,oBAAF;AAFhB,KAIC,cAAC,MAAD;AAAQ,IAAA,OAAO,EAAC;AAAhB,KACC,cAAC,qBAAD;AAAuB,IAAA,QAAQ,EAAG;AAAlC,KACC,cAAC,cAAD;AACC,IAAA,UAAU,EAAGmC,KADd;AAEC,mBAAY;AAFb,IADD,CADD,EAOC,cAAC,QAAD;AAAU,IAAA,SAAS,EAAC;AAApB,KACGnC,EAAE,CAAE,MAAF,CADL,CAPD,CAJD,CADD;AAkBA;;AAED,SAASoC,aAAT,QAA+D;AAAA,MAAvC;AAAEZ,IAAAA,IAAF;AAAQC,IAAAA,UAAR;AAAoBC,IAAAA,SAAS,GAAG;AAAhC,GAAuC;AAC9D,QAAMC,MAAM,GAAGD,SAAS,GAAI,cAAcA,SAAW,GAA7B,GAAkC,EAA1D;AACA,QAAME,SAAS,GAAGF,SAAS,GAAI,eAAeA,SAAW,EAA9B,GAAkC,EAA7D;AACA,QAAMG,QAAQ,GAAGb,8BAA8B,CAAEQ,IAAF,CAA/C;AACA,QAAMM,UAAU,GAAGD,QAAQ,CAACE,QAAT,CAAmB,WAAnB,CAAnB;AACA,QAAM,CAAEI,KAAF,IAAYb,cAAc,CAC/BK,MAAM,GAAG,0BADsB,EAE/BH,IAF+B,CAAhC;AAIA,QAAM,CAAEa,UAAF,IAAiBf,cAAc,CACpCK,MAAM,GAAG,iCAD2B,EAEpCH,IAFoC,CAArC;;AAKA,MAAK,CAAEM,UAAP,EAAoB;AACnB,WAAO,IAAP;AACA;;AAED,SACC,cAAC,sBAAD;AACC,IAAA,IAAI,EAAGL,UAAU,GAAGG,SAAb,GAAyB,cADjC;AAEC,kBAAa5B,EAAE,CAAE,oBAAF;AAFhB,KAIC,cAAC,MAAD;AAAQ,IAAA,OAAO,EAAC;AAAhB,KACC,cAAC,MAAD;AAAQ,IAAA,SAAS,EAAG,KAApB;AAA4B,IAAA,MAAM,EAAG,CAAC;AAAtC,KACC,cAAC,qBAAD;AAAuB,IAAA,QAAQ,EAAG;AAAlC,KACC,cAAC,cAAD;AAAgB,IAAA,UAAU,EAAGmC;AAA7B,IADD,CADD,EAIC,cAAC,qBAAD;AAAuB,IAAA,QAAQ,EAAG;AAAlC,KACC,cAAC,cAAD;AAAgB,IAAA,UAAU,EAAGE;AAA7B,IADD,CAJD,CADD,EASC,cAAC,QAAD;AAAU,IAAA,SAAS,EAAC;AAApB,KACGrC,EAAE,CAAE,OAAF,CADL,CATD,CAJD,CADD;AAoBA;;AAED,SAASsC,gBAAT,QAAkE;AAAA,MAAvC;AAAEd,IAAAA,IAAF;AAAQC,IAAAA,UAAR;AAAoBC,IAAAA,SAAS,GAAG;AAAhC,GAAuC;AACjE,QAAMC,MAAM,GAAGD,SAAS,GAAI,cAAcA,SAAW,GAA7B,GAAkC,EAA1D;AACA,QAAME,SAAS,GAAGF,SAAS,GAAI,eAAeA,SAAW,EAA9B,GAAkC,EAA7D;AACA,QAAMG,QAAQ,GAAGb,8BAA8B,CAAEQ,IAAF,CAA/C;AACA,QAAMM,UAAU,GAAGD,QAAQ,CAACE,QAAT,CAAmB,OAAnB,CAAnB;AACA,QAAM,CAAEI,KAAF,IAAYb,cAAc,CAC/BK,MAAM,GAAG,6BADsB,EAE/BH,IAF+B,CAAhC;AAIA,QAAM,CAAEe,OAAF,IAAcjB,cAAc,CACjCK,MAAM,GAAG,mCADwB,EAEjCH,IAFiC,CAAlC;;AAKA,MAAK,CAAEM,UAAP,EAAoB;AACnB,WAAO,IAAP;AACA;;AAED,SACC,cAAC,sBAAD;AACC,IAAA,IAAI,EAAGL,UAAU,GAAGG,SAAb,GAAyB,iBADjC;AAEC,kBAAa5B,EAAE,CAAE,uBAAF;AAFhB,KAIC,cAAC,MAAD;AAAQ,IAAA,OAAO,EAAC;AAAhB,KACC,cAAC,MAAD;AAAQ,IAAA,SAAS,EAAG,KAApB;AAA4B,IAAA,MAAM,EAAG,CAAC;AAAtC,KACC,cAAC,qBAAD;AAAuB,IAAA,QAAQ,EAAG;AAAlC,KACC,cAAC,cAAD;AAAgB,IAAA,UAAU,EAAGuC;AAA7B,IADD,CADD,EAIC,cAAC,qBAAD;AAAuB,IAAA,QAAQ,EAAG;AAAlC,KACC,cAAC,cAAD;AAAgB,IAAA,UAAU,EAAGJ;AAA7B,IADD,CAJD,CADD,EASC,cAAC,QAAD,QAAYnC,EAAE,CAAE,UAAF,CAAd,CATD,CAJD,CADD;AAkBA;;AAED,SAASwC,eAAT,QAAiE;AAAA,MAAvC;AAAEhB,IAAAA,IAAF;AAAQC,IAAAA,UAAR;AAAoBC,IAAAA,SAAS,GAAG;AAAhC,GAAuC;AAChE,QAAMC,MAAM,GAAGD,SAAS,GAAI,cAAcA,SAAW,GAA7B,GAAkC,EAA1D;AACA,QAAME,SAAS,GAAGF,SAAS,GAAI,eAAeA,SAAW,EAA9B,GAAkC,EAA7D;AACA,QAAMG,QAAQ,GAAGb,8BAA8B,CAAEQ,IAAF,CAA/C;AACA,QAAMM,UAAU,GAAGD,QAAQ,CAACE,QAAT,CAAmB,aAAnB,CAAnB;AACA,QAAM,CAAEI,KAAF,IAAYb,cAAc,CAC/BK,MAAM,GAAG,4BADsB,EAE/BH,IAF+B,CAAhC;AAIA,QAAM,CAAEe,OAAF,IAAcjB,cAAc,CACjCK,MAAM,GAAG,kCADwB,EAEjCH,IAFiC,CAAlC;;AAKA,MAAK,CAAEM,UAAP,EAAoB;AACnB,WAAO,IAAP;AACA;;AAED,SACC,cAAC,sBAAD;AACC,IAAA,IAAI,EAAGL,UAAU,GAAGG,SAAb,GAAyB;AADjC,KAGC,cAAC,MAAD;AAAQ,IAAA,OAAO,EAAC;AAAhB,KACC,cAAC,MAAD;AAAQ,IAAA,SAAS,EAAG,KAApB;AAA4B,IAAA,MAAM,EAAG,CAAC;AAAtC,KACC,cAAC,qBAAD;AAAuB,IAAA,QAAQ,EAAG;AAAlC,KACC,cAAC,cAAD;AAAgB,IAAA,UAAU,EAAGW;AAA7B,IADD,CADD,EAIC,cAAC,qBAAD;AAAuB,IAAA,QAAQ,EAAG;AAAlC,KACC,cAAC,cAAD;AAAgB,IAAA,UAAU,EAAGJ;AAA7B,IADD,CAJD,CADD,EASC,cAAC,QAAD;AAAU,IAAA,SAAS,EAAC;AAApB,KACGnC,EAAE,CAAE,SAAF,CADL,CATD,CAHD,CADD;AAmBA;;AAED,SAASyC,YAAT,QAAkD;AAAA,MAA3B;AAAEjB,IAAAA,IAAF;AAAQE,IAAAA,SAAS,GAAG;AAApB,GAA2B;AACjD,QAAMD,UAAU,GACfD,IAAI,KAAKkB,SAAT,GAAqB,EAArB,GAA0B,aAAaC,kBAAkB,CAAEnB,IAAF,CAD1D;AAEA,QAAMoB,kBAAkB,GAAGxB,qBAAqB,CAAEM,SAAF,CAAhD;AAEA,SACC,8BACC,cAAC,YAAD;AACC,IAAA,KAAK,EAAG1B,EAAE,CAAE,QAAF,CADX;AAEC,IAAA,WAAW,EAAGA,EAAE,CACf,iFADe;AAFjB,IADD,EAQC,cAAC,iBAAD;AAAmB,IAAA,IAAI,EAAGwB,IAA1B;AAAiC,IAAA,SAAS,EAAGoB;AAA7C,IARD,EAUC;AAAK,IAAA,SAAS,EAAC;AAAf,KACC,cAAC,MAAD;AAAQ,IAAA,OAAO,EAAG;AAAlB,KACC,cAAC,OAAD;AAAS,IAAA,IAAI,EAAGpB;AAAhB,IADD,EAGC,cAAC,MAAD;AAAQ,IAAA,OAAO,EAAG;AAAlB,KACC,cAAC,QAAD,QAAYxB,EAAE,CAAE,UAAF,CAAd,CADD,EAEC,cAAC,SAAD;AAAW,IAAA,UAAU,MAArB;AAAsB,IAAA,WAAW;AAAjC,KACC,cAAC,mBAAD;AACC,IAAA,IAAI,EAAGwB,IADR;AAEC,IAAA,UAAU,EAAGC,UAFd;AAGC,IAAA,SAAS,EAAGC;AAHb,IADD,EAMC,cAAC,aAAD;AACC,IAAA,IAAI,EAAGF,IADR;AAEC,IAAA,UAAU,EAAGC,UAFd;AAGC,IAAA,SAAS,EAAGC;AAHb,IAND,EAWC,cAAC,aAAD;AACC,IAAA,IAAI,EAAGF,IADR;AAEC,IAAA,UAAU,EAAGC,UAFd;AAGC,IAAA,SAAS,EAAGC;AAHb,IAXD,EAgBC,cAAC,gBAAD;AACC,IAAA,IAAI,EAAGF,IADR;AAEC,IAAA,UAAU,EAAGC,UAFd;AAGC,IAAA,SAAS,EAAGC;AAHb,IAhBD,EAqBC,cAAC,eAAD;AACC,IAAA,IAAI,EAAGF,IADR;AAEC,IAAA,UAAU,EAAGC,UAFd;AAGC,IAAA,SAAS,EAAGC;AAHb,IArBD,CAFD,CAHD,CADD,CAVD,CADD;AAiDA;;AAED,eAAee,YAAf","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport {\n\t__experimentalItemGroup as ItemGroup,\n\t__experimentalHStack as HStack,\n\t__experimentalVStack as VStack,\n\t__experimentalZStack as ZStack,\n\tFlexItem,\n\tColorIndicator,\n} from '@wordpress/components';\nimport { privateApis as blockEditorPrivateApis } from '@wordpress/block-editor';\n\n/**\n * Internal dependencies\n */\nimport ScreenHeader from './header';\nimport Palette from './palette';\nimport { NavigationButtonAsItem } from './navigation-button';\nimport { getSupportedGlobalStylesPanels } from './hooks';\nimport Subtitle from './subtitle';\nimport ColorIndicatorWrapper from './color-indicator-wrapper';\nimport BlockPreviewPanel from './block-preview-panel';\nimport { getVariationClassName } from './utils';\nimport { unlock } from '../../private-apis';\n\nconst { useGlobalStyle } = unlock( blockEditorPrivateApis );\n\nfunction BackgroundColorItem( { name, parentMenu, variation = '' } ) {\n\tconst prefix = variation ? `variations.${ variation }.` : '';\n\tconst urlPrefix = variation ? `/variations/${ variation }` : '';\n\tconst supports = getSupportedGlobalStylesPanels( name );\n\tconst hasSupport =\n\t\tsupports.includes( 'backgroundColor' ) ||\n\t\tsupports.includes( 'background' );\n\tconst [ backgroundColor ] = useGlobalStyle(\n\t\tprefix + 'color.background',\n\t\tname\n\t);\n\tconst [ gradientValue ] = useGlobalStyle( prefix + 'color.gradient', name );\n\n\tif ( ! hasSupport ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<NavigationButtonAsItem\n\t\t\tpath={ parentMenu + urlPrefix + '/colors/background' }\n\t\t\taria-label={ __( 'Colors background styles' ) }\n\t\t>\n\t\t\t<HStack justify=\"flex-start\">\n\t\t\t\t<ColorIndicatorWrapper expanded={ false }>\n\t\t\t\t\t<ColorIndicator\n\t\t\t\t\t\tcolorValue={ gradientValue ?? backgroundColor }\n\t\t\t\t\t\tdata-testid=\"background-color-indicator\"\n\t\t\t\t\t/>\n\t\t\t\t</ColorIndicatorWrapper>\n\t\t\t\t<FlexItem className=\"edit-site-global-styles__color-label\">\n\t\t\t\t\t{ __( 'Background' ) }\n\t\t\t\t</FlexItem>\n\t\t\t</HStack>\n\t\t</NavigationButtonAsItem>\n\t);\n}\n\nfunction TextColorItem( { name, parentMenu, variation = '' } ) {\n\tconst prefix = variation ? `variations.${ variation }.` : '';\n\tconst urlPrefix = variation ? `/variations/${ variation }` : '';\n\tconst supports = getSupportedGlobalStylesPanels( name );\n\tconst hasSupport = supports.includes( 'color' );\n\tconst [ color ] = useGlobalStyle( prefix + 'color.text', name );\n\n\tif ( ! hasSupport ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<NavigationButtonAsItem\n\t\t\tpath={ parentMenu + urlPrefix + '/colors/text' }\n\t\t\taria-label={ __( 'Colors text styles' ) }\n\t\t>\n\t\t\t<HStack justify=\"flex-start\">\n\t\t\t\t<ColorIndicatorWrapper expanded={ false }>\n\t\t\t\t\t<ColorIndicator\n\t\t\t\t\t\tcolorValue={ color }\n\t\t\t\t\t\tdata-testid=\"text-color-indicator\"\n\t\t\t\t\t/>\n\t\t\t\t</ColorIndicatorWrapper>\n\t\t\t\t<FlexItem className=\"edit-site-global-styles__color-label\">\n\t\t\t\t\t{ __( 'Text' ) }\n\t\t\t\t</FlexItem>\n\t\t\t</HStack>\n\t\t</NavigationButtonAsItem>\n\t);\n}\n\nfunction LinkColorItem( { name, parentMenu, variation = '' } ) {\n\tconst prefix = variation ? `variations.${ variation }.` : '';\n\tconst urlPrefix = variation ? `/variations/${ variation }` : '';\n\tconst supports = getSupportedGlobalStylesPanels( name );\n\tconst hasSupport = supports.includes( 'linkColor' );\n\tconst [ color ] = useGlobalStyle(\n\t\tprefix + 'elements.link.color.text',\n\t\tname\n\t);\n\tconst [ colorHover ] = useGlobalStyle(\n\t\tprefix + 'elements.link.:hover.color.text',\n\t\tname\n\t);\n\n\tif ( ! hasSupport ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<NavigationButtonAsItem\n\t\t\tpath={ parentMenu + urlPrefix + '/colors/link' }\n\t\t\taria-label={ __( 'Colors link styles' ) }\n\t\t>\n\t\t\t<HStack justify=\"flex-start\">\n\t\t\t\t<ZStack isLayered={ false } offset={ -8 }>\n\t\t\t\t\t<ColorIndicatorWrapper expanded={ false }>\n\t\t\t\t\t\t<ColorIndicator colorValue={ color } />\n\t\t\t\t\t</ColorIndicatorWrapper>\n\t\t\t\t\t<ColorIndicatorWrapper expanded={ false }>\n\t\t\t\t\t\t<ColorIndicator colorValue={ colorHover } />\n\t\t\t\t\t</ColorIndicatorWrapper>\n\t\t\t\t</ZStack>\n\t\t\t\t<FlexItem className=\"edit-site-global-styles__color-label\">\n\t\t\t\t\t{ __( 'Links' ) }\n\t\t\t\t</FlexItem>\n\t\t\t</HStack>\n\t\t</NavigationButtonAsItem>\n\t);\n}\n\nfunction HeadingColorItem( { name, parentMenu, variation = '' } ) {\n\tconst prefix = variation ? `variations.${ variation }.` : '';\n\tconst urlPrefix = variation ? `/variations/${ variation }` : '';\n\tconst supports = getSupportedGlobalStylesPanels( name );\n\tconst hasSupport = supports.includes( 'color' );\n\tconst [ color ] = useGlobalStyle(\n\t\tprefix + 'elements.heading.color.text',\n\t\tname\n\t);\n\tconst [ bgColor ] = useGlobalStyle(\n\t\tprefix + 'elements.heading.color.background',\n\t\tname\n\t);\n\n\tif ( ! hasSupport ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<NavigationButtonAsItem\n\t\t\tpath={ parentMenu + urlPrefix + '/colors/heading' }\n\t\t\taria-label={ __( 'Colors heading styles' ) }\n\t\t>\n\t\t\t<HStack justify=\"flex-start\">\n\t\t\t\t<ZStack isLayered={ false } offset={ -8 }>\n\t\t\t\t\t<ColorIndicatorWrapper expanded={ false }>\n\t\t\t\t\t\t<ColorIndicator colorValue={ bgColor } />\n\t\t\t\t\t</ColorIndicatorWrapper>\n\t\t\t\t\t<ColorIndicatorWrapper expanded={ false }>\n\t\t\t\t\t\t<ColorIndicator colorValue={ color } />\n\t\t\t\t\t</ColorIndicatorWrapper>\n\t\t\t\t</ZStack>\n\t\t\t\t<FlexItem>{ __( 'Headings' ) }</FlexItem>\n\t\t\t</HStack>\n\t\t</NavigationButtonAsItem>\n\t);\n}\n\nfunction ButtonColorItem( { name, parentMenu, variation = '' } ) {\n\tconst prefix = variation ? `variations.${ variation }.` : '';\n\tconst urlPrefix = variation ? `/variations/${ variation }` : '';\n\tconst supports = getSupportedGlobalStylesPanels( name );\n\tconst hasSupport = supports.includes( 'buttonColor' );\n\tconst [ color ] = useGlobalStyle(\n\t\tprefix + 'elements.button.color.text',\n\t\tname\n\t);\n\tconst [ bgColor ] = useGlobalStyle(\n\t\tprefix + 'elements.button.color.background',\n\t\tname\n\t);\n\n\tif ( ! hasSupport ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<NavigationButtonAsItem\n\t\t\tpath={ parentMenu + urlPrefix + '/colors/button' }\n\t\t>\n\t\t\t<HStack justify=\"flex-start\">\n\t\t\t\t<ZStack isLayered={ false } offset={ -8 }>\n\t\t\t\t\t<ColorIndicatorWrapper expanded={ false }>\n\t\t\t\t\t\t<ColorIndicator colorValue={ bgColor } />\n\t\t\t\t\t</ColorIndicatorWrapper>\n\t\t\t\t\t<ColorIndicatorWrapper expanded={ false }>\n\t\t\t\t\t\t<ColorIndicator colorValue={ color } />\n\t\t\t\t\t</ColorIndicatorWrapper>\n\t\t\t\t</ZStack>\n\t\t\t\t<FlexItem className=\"edit-site-global-styles__color-label\">\n\t\t\t\t\t{ __( 'Buttons' ) }\n\t\t\t\t</FlexItem>\n\t\t\t</HStack>\n\t\t</NavigationButtonAsItem>\n\t);\n}\n\nfunction ScreenColors( { name, variation = '' } ) {\n\tconst parentMenu =\n\t\tname === undefined ? '' : '/blocks/' + encodeURIComponent( name );\n\tconst variationClassName = getVariationClassName( variation );\n\n\treturn (\n\t\t<>\n\t\t\t<ScreenHeader\n\t\t\t\ttitle={ __( 'Colors' ) }\n\t\t\t\tdescription={ __(\n\t\t\t\t\t'Manage palettes and the default color of different global elements on the site.'\n\t\t\t\t) }\n\t\t\t/>\n\n\t\t\t<BlockPreviewPanel name={ name } variation={ variationClassName } />\n\n\t\t\t<div className=\"edit-site-global-styles-screen-colors\">\n\t\t\t\t<VStack spacing={ 10 }>\n\t\t\t\t\t<Palette name={ name } />\n\n\t\t\t\t\t<VStack spacing={ 3 }>\n\t\t\t\t\t\t<Subtitle>{ __( 'Elements' ) }</Subtitle>\n\t\t\t\t\t\t<ItemGroup isBordered isSeparated>\n\t\t\t\t\t\t\t<BackgroundColorItem\n\t\t\t\t\t\t\t\tname={ name }\n\t\t\t\t\t\t\t\tparentMenu={ parentMenu }\n\t\t\t\t\t\t\t\tvariation={ variation }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t<TextColorItem\n\t\t\t\t\t\t\t\tname={ name }\n\t\t\t\t\t\t\t\tparentMenu={ parentMenu }\n\t\t\t\t\t\t\t\tvariation={ variation }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t<LinkColorItem\n\t\t\t\t\t\t\t\tname={ name }\n\t\t\t\t\t\t\t\tparentMenu={ parentMenu }\n\t\t\t\t\t\t\t\tvariation={ variation }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t<HeadingColorItem\n\t\t\t\t\t\t\t\tname={ name }\n\t\t\t\t\t\t\t\tparentMenu={ parentMenu }\n\t\t\t\t\t\t\t\tvariation={ variation }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t<ButtonColorItem\n\t\t\t\t\t\t\t\tname={ name }\n\t\t\t\t\t\t\t\tparentMenu={ parentMenu }\n\t\t\t\t\t\t\t\tvariation={ variation }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</ItemGroup>\n\t\t\t\t\t</VStack>\n\t\t\t\t</VStack>\n\t\t\t</div>\n\t\t</>\n\t);\n}\n\nexport default ScreenColors;\n"]}
|
|
@@ -25,11 +25,11 @@ function ScreenCSS(_ref) {
|
|
|
25
25
|
__('Add your own CSS to customize the appearance of the %s block.'), title) : __('Add your own CSS to customize the appearance and layout of your site.');
|
|
26
26
|
return createElement(Fragment, null, createElement(ScreenHeader, {
|
|
27
27
|
title: __('CSS'),
|
|
28
|
-
description: description
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
}
|
|
28
|
+
description: createElement(Fragment, null, description, createElement(ExternalLink, {
|
|
29
|
+
href: "https://wordpress.org/support/article/css/",
|
|
30
|
+
className: "edit-site-global-styles-screen-css-help-link"
|
|
31
|
+
}, __('Learn more about CSS')))
|
|
32
|
+
}), createElement("div", {
|
|
33
33
|
className: "edit-site-global-styles-screen-css"
|
|
34
34
|
}, createElement(CustomCSSControl, {
|
|
35
35
|
blockName: name
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["@wordpress/edit-site/src/components/global-styles/screen-css.js"],"names":["sprintf","__","ExternalLink","getBlockType","ScreenHeader","CustomCSSControl","ScreenCSS","name","blockType","title","description","undefined"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,OAAT,EAAkBC,EAAlB,QAA4B,iBAA5B;AACA,SAASC,YAAT,QAA6B,uBAA7B;AACA,SAASC,YAAT,QAA6B,mBAA7B;AAEA;AACA;AACA;;AACA,OAAOC,YAAP,MAAyB,UAAzB;AACA,OAAOC,gBAAP,MAA6B,cAA7B;;AAEA,SAASC,SAAT,OAA+B;AAAA,MAAX;AAAEC,IAAAA;AAAF,GAAW;AAC9B;AACA;AACA,QAAMC,SAAS,GAAGL,YAAY,CAAEI,IAAF,CAA9B;AACA,QAAME,KAAK,GAAGD,SAAH,aAAGA,SAAH,uBAAGA,SAAS,CAAEC,KAAzB;AAEA,QAAMC,WAAW,GAChBD,KAAK,KAAKE,SAAV,GACGX,OAAO,EACP;AACAC,EAAAA,EAAE,CACD,+DADC,CAFK,EAKPQ,KALO,CADV,GAQGR,EAAE,CACF,uEADE,CATN;AAaA,SACC,8BACC,cAAC,YAAD;
|
|
1
|
+
{"version":3,"sources":["@wordpress/edit-site/src/components/global-styles/screen-css.js"],"names":["sprintf","__","ExternalLink","getBlockType","ScreenHeader","CustomCSSControl","ScreenCSS","name","blockType","title","description","undefined"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,OAAT,EAAkBC,EAAlB,QAA4B,iBAA5B;AACA,SAASC,YAAT,QAA6B,uBAA7B;AACA,SAASC,YAAT,QAA6B,mBAA7B;AAEA;AACA;AACA;;AACA,OAAOC,YAAP,MAAyB,UAAzB;AACA,OAAOC,gBAAP,MAA6B,cAA7B;;AAEA,SAASC,SAAT,OAA+B;AAAA,MAAX;AAAEC,IAAAA;AAAF,GAAW;AAC9B;AACA;AACA,QAAMC,SAAS,GAAGL,YAAY,CAAEI,IAAF,CAA9B;AACA,QAAME,KAAK,GAAGD,SAAH,aAAGA,SAAH,uBAAGA,SAAS,CAAEC,KAAzB;AAEA,QAAMC,WAAW,GAChBD,KAAK,KAAKE,SAAV,GACGX,OAAO,EACP;AACAC,EAAAA,EAAE,CACD,+DADC,CAFK,EAKPQ,KALO,CADV,GAQGR,EAAE,CACF,uEADE,CATN;AAaA,SACC,8BACC,cAAC,YAAD;AACC,IAAA,KAAK,EAAGA,EAAE,CAAE,KAAF,CADX;AAEC,IAAA,WAAW,EACV,8BACGS,WADH,EAEC,cAAC,YAAD;AACC,MAAA,IAAI,EAAC,4CADN;AAEC,MAAA,SAAS,EAAC;AAFX,OAIGT,EAAE,CAAE,sBAAF,CAJL,CAFD;AAHF,IADD,EAeC;AAAK,IAAA,SAAS,EAAC;AAAf,KACC,cAAC,gBAAD;AAAkB,IAAA,SAAS,EAAGM;AAA9B,IADD,CAfD,CADD;AAqBA;;AAED,eAAeD,SAAf","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { sprintf, __ } from '@wordpress/i18n';\nimport { ExternalLink } from '@wordpress/components';\nimport { getBlockType } from '@wordpress/blocks';\n\n/**\n * Internal dependencies\n */\nimport ScreenHeader from './header';\nimport CustomCSSControl from './custom-css';\n\nfunction ScreenCSS( { name } ) {\n\t// If name is defined, we are customizing CSS at the block level.\n\t// Display the block title in the description.\n\tconst blockType = getBlockType( name );\n\tconst title = blockType?.title;\n\n\tconst description =\n\t\ttitle !== undefined\n\t\t\t? sprintf(\n\t\t\t\t\t// translators: %s: is the name of a block e.g., 'Image' or 'Table'.\n\t\t\t\t\t__(\n\t\t\t\t\t\t'Add your own CSS to customize the appearance of the %s block.'\n\t\t\t\t\t),\n\t\t\t\t\ttitle\n\t\t\t )\n\t\t\t: __(\n\t\t\t\t\t'Add your own CSS to customize the appearance and layout of your site.'\n\t\t\t );\n\n\treturn (\n\t\t<>\n\t\t\t<ScreenHeader\n\t\t\t\ttitle={ __( 'CSS' ) }\n\t\t\t\tdescription={\n\t\t\t\t\t<>\n\t\t\t\t\t\t{ description }\n\t\t\t\t\t\t<ExternalLink\n\t\t\t\t\t\t\thref=\"https://wordpress.org/support/article/css/\"\n\t\t\t\t\t\t\tclassName=\"edit-site-global-styles-screen-css-help-link\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ __( 'Learn more about CSS' ) }\n\t\t\t\t\t\t</ExternalLink>\n\t\t\t\t\t</>\n\t\t\t\t}\n\t\t\t/>\n\t\t\t<div className=\"edit-site-global-styles-screen-css\">\n\t\t\t\t<CustomCSSControl blockName={ name } />\n\t\t\t</div>\n\t\t</>\n\t);\n}\n\nexport default ScreenCSS;\n"]}
|
|
@@ -6,7 +6,7 @@ import { createElement, Fragment } from "@wordpress/element";
|
|
|
6
6
|
*/
|
|
7
7
|
import { sprintf, __ } from '@wordpress/i18n';
|
|
8
8
|
import { __experimentalToggleGroupControl as ToggleGroupControl, __experimentalToggleGroupControlOption as ToggleGroupControlOption } from '@wordpress/components';
|
|
9
|
-
import { __experimentalColorGradientControl as ColorGradientControl,
|
|
9
|
+
import { __experimentalColorGradientControl as ColorGradientControl, privateApis as blockEditorPrivateApis } from '@wordpress/block-editor';
|
|
10
10
|
import { useState } from '@wordpress/element';
|
|
11
11
|
/**
|
|
12
12
|
* Internal dependencies
|
|
@@ -14,11 +14,11 @@ import { useState } from '@wordpress/element';
|
|
|
14
14
|
|
|
15
15
|
import ScreenHeader from './header';
|
|
16
16
|
import { getSupportedGlobalStylesPanels, useColorsPerOrigin, useGradientsPerOrigin } from './hooks';
|
|
17
|
-
import { unlock } from '../../
|
|
17
|
+
import { unlock } from '../../private-apis';
|
|
18
18
|
const {
|
|
19
19
|
useGlobalSetting,
|
|
20
20
|
useGlobalStyle
|
|
21
|
-
} = unlock(
|
|
21
|
+
} = unlock(blockEditorPrivateApis);
|
|
22
22
|
|
|
23
23
|
function ScreenHeadingColor(_ref) {
|
|
24
24
|
let {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["@wordpress/edit-site/src/components/global-styles/screen-heading-color.js"],"names":["sprintf","__","__experimentalToggleGroupControl","ToggleGroupControl","__experimentalToggleGroupControlOption","ToggleGroupControlOption","__experimentalColorGradientControl","ColorGradientControl","experiments","blockEditorExperiments","useState","ScreenHeader","getSupportedGlobalStylesPanels","useColorsPerOrigin","useGradientsPerOrigin","unlock","useGlobalSetting","useGlobalStyle","ScreenHeadingColor","name","variation","prefix","selectedLevel","setCurrentTab","supports","areCustomSolidsEnabled","areCustomGradientsEnabled","isTextEnabled","isBackgroundEnabled","colorsPerOrigin","gradientsPerOrigin","hasTextColor","includes","length","hasBackgroundColor","hasGradientColor","color","setColor","userColor","backgroundColor","setBackgroundColor","userBackgroundColor","gradient","setGradient","userGradient","backgroundSettings","colorValue","onColorChange","clearable","gradientSettings","gradientValue","onGradientChange","controlProps","toUpperCase"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { sprintf, __ } from '@wordpress/i18n';\nimport {\n\t__experimentalToggleGroupControl as ToggleGroupControl,\n\t__experimentalToggleGroupControlOption as ToggleGroupControlOption,\n} from '@wordpress/components';\nimport {\n\t__experimentalColorGradientControl as ColorGradientControl,\n\texperiments as blockEditorExperiments,\n} from '@wordpress/block-editor';\nimport { useState } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport ScreenHeader from './header';\nimport {\n\tgetSupportedGlobalStylesPanels,\n\tuseColorsPerOrigin,\n\tuseGradientsPerOrigin,\n} from './hooks';\nimport { unlock } from '../../experiments';\n\nconst { useGlobalSetting, useGlobalStyle } = unlock( blockEditorExperiments );\n\nfunction ScreenHeadingColor( { name, variation = '' } ) {\n\tconst prefix = variation ? `variations.${ variation }.` : '';\n\tconst [ selectedLevel, setCurrentTab ] = useState( 'heading' );\n\tconst supports = getSupportedGlobalStylesPanels( name );\n\tconst [ areCustomSolidsEnabled ] = useGlobalSetting( 'color.custom', name );\n\tconst [ areCustomGradientsEnabled ] = useGlobalSetting(\n\t\t'color.customGradient',\n\t\tname\n\t);\n\tconst [ isTextEnabled ] = useGlobalSetting( 'color.text', name );\n\tconst [ isBackgroundEnabled ] = useGlobalSetting(\n\t\t'color.background',\n\t\tname\n\t);\n\tconst colorsPerOrigin = useColorsPerOrigin( name );\n\tconst gradientsPerOrigin = useGradientsPerOrigin( name );\n\n\tconst hasTextColor =\n\t\tsupports.includes( 'color' ) &&\n\t\tisTextEnabled &&\n\t\t( colorsPerOrigin.length > 0 || areCustomSolidsEnabled );\n\n\tconst hasBackgroundColor =\n\t\tsupports.includes( 'backgroundColor' ) &&\n\t\tisBackgroundEnabled &&\n\t\t( colorsPerOrigin.length > 0 || areCustomSolidsEnabled );\n\tconst hasGradientColor =\n\t\tsupports.includes( 'background' ) &&\n\t\t( gradientsPerOrigin.length > 0 || areCustomGradientsEnabled );\n\n\tconst [ color, setColor ] = useGlobalStyle(\n\t\tprefix + 'elements.' + selectedLevel + '.color.text',\n\t\tname\n\t);\n\tconst [ userColor ] = useGlobalStyle(\n\t\tprefix + 'elements.' + selectedLevel + '.color.text',\n\t\tname,\n\t\t'user'\n\t);\n\n\tconst [ backgroundColor, setBackgroundColor ] = useGlobalStyle(\n\t\tprefix + 'elements.' + selectedLevel + '.color.background',\n\t\tname\n\t);\n\tconst [ userBackgroundColor ] = useGlobalStyle(\n\t\tprefix + 'elements.' + selectedLevel + '.color.background',\n\t\tname,\n\t\t'user'\n\t);\n\tconst [ gradient, setGradient ] = useGlobalStyle(\n\t\tprefix + 'elements.' + selectedLevel + '.color.gradient',\n\t\tname\n\t);\n\tconst [ userGradient ] = useGlobalStyle(\n\t\tprefix + 'elements.' + selectedLevel + '.color.gradient',\n\t\tname,\n\t\t'user'\n\t);\n\n\tif ( ! hasTextColor && ! hasBackgroundColor && ! hasGradientColor ) {\n\t\treturn null;\n\t}\n\n\tlet backgroundSettings = {};\n\tif ( hasBackgroundColor ) {\n\t\tbackgroundSettings = {\n\t\t\tcolorValue: backgroundColor,\n\t\t\tonColorChange: setBackgroundColor,\n\t\t};\n\t\tif ( backgroundColor ) {\n\t\t\tbackgroundSettings.clearable =\n\t\t\t\tbackgroundColor === userBackgroundColor;\n\t\t}\n\t}\n\n\tlet gradientSettings = {};\n\tif ( hasGradientColor ) {\n\t\tgradientSettings = {\n\t\t\tgradientValue: gradient,\n\t\t\tonGradientChange: setGradient,\n\t\t};\n\t\tif ( gradient ) {\n\t\t\tgradientSettings.clearable = gradient === userGradient;\n\t\t}\n\t}\n\n\tconst controlProps = {\n\t\t...backgroundSettings,\n\t\t...gradientSettings,\n\t};\n\n\treturn (\n\t\t<>\n\t\t\t<ScreenHeader\n\t\t\t\ttitle={ __( 'Headings' ) }\n\t\t\t\tdescription={ __(\n\t\t\t\t\t'Set the default color used for headings across the site.'\n\t\t\t\t) }\n\t\t\t/>\n\t\t\t<div className=\"edit-site-global-styles-screen-heading-color\">\n\t\t\t\t<h4>{ __( 'Select heading level' ) }</h4>\n\n\t\t\t\t<ToggleGroupControl\n\t\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\t\tlabel={ __( 'Select heading level' ) }\n\t\t\t\t\thideLabelFromVision={ true }\n\t\t\t\t\tvalue={ selectedLevel }\n\t\t\t\t\tonChange={ setCurrentTab }\n\t\t\t\t\tisBlock\n\t\t\t\t>\n\t\t\t\t\t<ToggleGroupControlOption\n\t\t\t\t\t\tvalue=\"heading\"\n\t\t\t\t\t\t/* translators: 'All' refers to selecting all heading levels\n\t\t\t\t\t\tand applying the same style to h1-h6. */\n\t\t\t\t\t\tlabel={ __( 'All' ) }\n\t\t\t\t\t/>\n\t\t\t\t\t<ToggleGroupControlOption value=\"h1\" label={ __( 'H1' ) } />\n\t\t\t\t\t<ToggleGroupControlOption value=\"h2\" label={ __( 'H2' ) } />\n\t\t\t\t\t<ToggleGroupControlOption value=\"h3\" label={ __( 'H3' ) } />\n\t\t\t\t\t<ToggleGroupControlOption value=\"h4\" label={ __( 'H4' ) } />\n\t\t\t\t\t<ToggleGroupControlOption value=\"h5\" label={ __( 'H5' ) } />\n\t\t\t\t\t<ToggleGroupControlOption value=\"h6\" label={ __( 'H6' ) } />\n\t\t\t\t</ToggleGroupControl>\n\t\t\t</div>\n\t\t\t{ hasTextColor && (\n\t\t\t\t<div className=\"edit-site-global-styles-screen-heading-color\">\n\t\t\t\t\t<h4>\n\t\t\t\t\t\t{ selectedLevel === 'heading'\n\t\t\t\t\t\t\t? __( 'Text color for all heading levels' )\n\t\t\t\t\t\t\t: sprintf(\n\t\t\t\t\t\t\t\t\t/* translators: %s: heading level (h1-h6) */\n\t\t\t\t\t\t\t\t\t__( 'Text color for %s' ),\n\t\t\t\t\t\t\t\t\tselectedLevel.toUpperCase()\n\t\t\t\t\t\t\t ) }\n\t\t\t\t\t</h4>\n\t\t\t\t\t<ColorGradientControl\n\t\t\t\t\t\tclassName=\"edit-site-screen-heading-text-color__control\"\n\t\t\t\t\t\tcolors={ colorsPerOrigin }\n\t\t\t\t\t\tdisableCustomColors={ ! areCustomSolidsEnabled }\n\t\t\t\t\t\tshowTitle={ false }\n\t\t\t\t\t\tenableAlpha\n\t\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t\t\tcolorValue={ color }\n\t\t\t\t\t\tonColorChange={ setColor }\n\t\t\t\t\t\tclearable={ color === userColor }\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t) }\n\t\t\t{ hasBackgroundColor && (\n\t\t\t\t<div className=\"edit-site-global-styles-screen-heading-color\">\n\t\t\t\t\t<h4>\n\t\t\t\t\t\t{ selectedLevel === 'heading'\n\t\t\t\t\t\t\t? __( 'Background color for all heading levels' )\n\t\t\t\t\t\t\t: sprintf(\n\t\t\t\t\t\t\t\t\t/* translators: %s: heading level (h1-h6) */\n\t\t\t\t\t\t\t\t\t__( 'Background color for %s' ),\n\t\t\t\t\t\t\t\t\tselectedLevel.toUpperCase()\n\t\t\t\t\t\t\t ) }\n\t\t\t\t\t</h4>\n\t\t\t\t\t<ColorGradientControl\n\t\t\t\t\t\tclassName=\"edit-site-screen-heading-background-color__control\"\n\t\t\t\t\t\tcolors={ colorsPerOrigin }\n\t\t\t\t\t\tgradients={ gradientsPerOrigin }\n\t\t\t\t\t\tdisableCustomColors={ ! areCustomSolidsEnabled }\n\t\t\t\t\t\tdisableCustomGradients={ ! areCustomGradientsEnabled }\n\t\t\t\t\t\tshowTitle={ false }\n\t\t\t\t\t\tenableAlpha\n\t\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t\t\t{ ...controlProps }\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t) }\n\t\t</>\n\t);\n}\n\nexport default ScreenHeadingColor;\n"]}
|
|
1
|
+
{"version":3,"sources":["@wordpress/edit-site/src/components/global-styles/screen-heading-color.js"],"names":["sprintf","__","__experimentalToggleGroupControl","ToggleGroupControl","__experimentalToggleGroupControlOption","ToggleGroupControlOption","__experimentalColorGradientControl","ColorGradientControl","privateApis","blockEditorPrivateApis","useState","ScreenHeader","getSupportedGlobalStylesPanels","useColorsPerOrigin","useGradientsPerOrigin","unlock","useGlobalSetting","useGlobalStyle","ScreenHeadingColor","name","variation","prefix","selectedLevel","setCurrentTab","supports","areCustomSolidsEnabled","areCustomGradientsEnabled","isTextEnabled","isBackgroundEnabled","colorsPerOrigin","gradientsPerOrigin","hasTextColor","includes","length","hasBackgroundColor","hasGradientColor","color","setColor","userColor","backgroundColor","setBackgroundColor","userBackgroundColor","gradient","setGradient","userGradient","backgroundSettings","colorValue","onColorChange","clearable","gradientSettings","gradientValue","onGradientChange","controlProps","toUpperCase"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { sprintf, __ } from '@wordpress/i18n';\nimport {\n\t__experimentalToggleGroupControl as ToggleGroupControl,\n\t__experimentalToggleGroupControlOption as ToggleGroupControlOption,\n} from '@wordpress/components';\nimport {\n\t__experimentalColorGradientControl as ColorGradientControl,\n\tprivateApis as blockEditorPrivateApis,\n} from '@wordpress/block-editor';\nimport { useState } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport ScreenHeader from './header';\nimport {\n\tgetSupportedGlobalStylesPanels,\n\tuseColorsPerOrigin,\n\tuseGradientsPerOrigin,\n} from './hooks';\nimport { unlock } from '../../private-apis';\n\nconst { useGlobalSetting, useGlobalStyle } = unlock( blockEditorPrivateApis );\n\nfunction ScreenHeadingColor( { name, variation = '' } ) {\n\tconst prefix = variation ? `variations.${ variation }.` : '';\n\tconst [ selectedLevel, setCurrentTab ] = useState( 'heading' );\n\tconst supports = getSupportedGlobalStylesPanels( name );\n\tconst [ areCustomSolidsEnabled ] = useGlobalSetting( 'color.custom', name );\n\tconst [ areCustomGradientsEnabled ] = useGlobalSetting(\n\t\t'color.customGradient',\n\t\tname\n\t);\n\tconst [ isTextEnabled ] = useGlobalSetting( 'color.text', name );\n\tconst [ isBackgroundEnabled ] = useGlobalSetting(\n\t\t'color.background',\n\t\tname\n\t);\n\tconst colorsPerOrigin = useColorsPerOrigin( name );\n\tconst gradientsPerOrigin = useGradientsPerOrigin( name );\n\n\tconst hasTextColor =\n\t\tsupports.includes( 'color' ) &&\n\t\tisTextEnabled &&\n\t\t( colorsPerOrigin.length > 0 || areCustomSolidsEnabled );\n\n\tconst hasBackgroundColor =\n\t\tsupports.includes( 'backgroundColor' ) &&\n\t\tisBackgroundEnabled &&\n\t\t( colorsPerOrigin.length > 0 || areCustomSolidsEnabled );\n\tconst hasGradientColor =\n\t\tsupports.includes( 'background' ) &&\n\t\t( gradientsPerOrigin.length > 0 || areCustomGradientsEnabled );\n\n\tconst [ color, setColor ] = useGlobalStyle(\n\t\tprefix + 'elements.' + selectedLevel + '.color.text',\n\t\tname\n\t);\n\tconst [ userColor ] = useGlobalStyle(\n\t\tprefix + 'elements.' + selectedLevel + '.color.text',\n\t\tname,\n\t\t'user'\n\t);\n\n\tconst [ backgroundColor, setBackgroundColor ] = useGlobalStyle(\n\t\tprefix + 'elements.' + selectedLevel + '.color.background',\n\t\tname\n\t);\n\tconst [ userBackgroundColor ] = useGlobalStyle(\n\t\tprefix + 'elements.' + selectedLevel + '.color.background',\n\t\tname,\n\t\t'user'\n\t);\n\tconst [ gradient, setGradient ] = useGlobalStyle(\n\t\tprefix + 'elements.' + selectedLevel + '.color.gradient',\n\t\tname\n\t);\n\tconst [ userGradient ] = useGlobalStyle(\n\t\tprefix + 'elements.' + selectedLevel + '.color.gradient',\n\t\tname,\n\t\t'user'\n\t);\n\n\tif ( ! hasTextColor && ! hasBackgroundColor && ! hasGradientColor ) {\n\t\treturn null;\n\t}\n\n\tlet backgroundSettings = {};\n\tif ( hasBackgroundColor ) {\n\t\tbackgroundSettings = {\n\t\t\tcolorValue: backgroundColor,\n\t\t\tonColorChange: setBackgroundColor,\n\t\t};\n\t\tif ( backgroundColor ) {\n\t\t\tbackgroundSettings.clearable =\n\t\t\t\tbackgroundColor === userBackgroundColor;\n\t\t}\n\t}\n\n\tlet gradientSettings = {};\n\tif ( hasGradientColor ) {\n\t\tgradientSettings = {\n\t\t\tgradientValue: gradient,\n\t\t\tonGradientChange: setGradient,\n\t\t};\n\t\tif ( gradient ) {\n\t\t\tgradientSettings.clearable = gradient === userGradient;\n\t\t}\n\t}\n\n\tconst controlProps = {\n\t\t...backgroundSettings,\n\t\t...gradientSettings,\n\t};\n\n\treturn (\n\t\t<>\n\t\t\t<ScreenHeader\n\t\t\t\ttitle={ __( 'Headings' ) }\n\t\t\t\tdescription={ __(\n\t\t\t\t\t'Set the default color used for headings across the site.'\n\t\t\t\t) }\n\t\t\t/>\n\t\t\t<div className=\"edit-site-global-styles-screen-heading-color\">\n\t\t\t\t<h4>{ __( 'Select heading level' ) }</h4>\n\n\t\t\t\t<ToggleGroupControl\n\t\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\t\tlabel={ __( 'Select heading level' ) }\n\t\t\t\t\thideLabelFromVision={ true }\n\t\t\t\t\tvalue={ selectedLevel }\n\t\t\t\t\tonChange={ setCurrentTab }\n\t\t\t\t\tisBlock\n\t\t\t\t>\n\t\t\t\t\t<ToggleGroupControlOption\n\t\t\t\t\t\tvalue=\"heading\"\n\t\t\t\t\t\t/* translators: 'All' refers to selecting all heading levels\n\t\t\t\t\t\tand applying the same style to h1-h6. */\n\t\t\t\t\t\tlabel={ __( 'All' ) }\n\t\t\t\t\t/>\n\t\t\t\t\t<ToggleGroupControlOption value=\"h1\" label={ __( 'H1' ) } />\n\t\t\t\t\t<ToggleGroupControlOption value=\"h2\" label={ __( 'H2' ) } />\n\t\t\t\t\t<ToggleGroupControlOption value=\"h3\" label={ __( 'H3' ) } />\n\t\t\t\t\t<ToggleGroupControlOption value=\"h4\" label={ __( 'H4' ) } />\n\t\t\t\t\t<ToggleGroupControlOption value=\"h5\" label={ __( 'H5' ) } />\n\t\t\t\t\t<ToggleGroupControlOption value=\"h6\" label={ __( 'H6' ) } />\n\t\t\t\t</ToggleGroupControl>\n\t\t\t</div>\n\t\t\t{ hasTextColor && (\n\t\t\t\t<div className=\"edit-site-global-styles-screen-heading-color\">\n\t\t\t\t\t<h4>\n\t\t\t\t\t\t{ selectedLevel === 'heading'\n\t\t\t\t\t\t\t? __( 'Text color for all heading levels' )\n\t\t\t\t\t\t\t: sprintf(\n\t\t\t\t\t\t\t\t\t/* translators: %s: heading level (h1-h6) */\n\t\t\t\t\t\t\t\t\t__( 'Text color for %s' ),\n\t\t\t\t\t\t\t\t\tselectedLevel.toUpperCase()\n\t\t\t\t\t\t\t ) }\n\t\t\t\t\t</h4>\n\t\t\t\t\t<ColorGradientControl\n\t\t\t\t\t\tclassName=\"edit-site-screen-heading-text-color__control\"\n\t\t\t\t\t\tcolors={ colorsPerOrigin }\n\t\t\t\t\t\tdisableCustomColors={ ! areCustomSolidsEnabled }\n\t\t\t\t\t\tshowTitle={ false }\n\t\t\t\t\t\tenableAlpha\n\t\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t\t\tcolorValue={ color }\n\t\t\t\t\t\tonColorChange={ setColor }\n\t\t\t\t\t\tclearable={ color === userColor }\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t) }\n\t\t\t{ hasBackgroundColor && (\n\t\t\t\t<div className=\"edit-site-global-styles-screen-heading-color\">\n\t\t\t\t\t<h4>\n\t\t\t\t\t\t{ selectedLevel === 'heading'\n\t\t\t\t\t\t\t? __( 'Background color for all heading levels' )\n\t\t\t\t\t\t\t: sprintf(\n\t\t\t\t\t\t\t\t\t/* translators: %s: heading level (h1-h6) */\n\t\t\t\t\t\t\t\t\t__( 'Background color for %s' ),\n\t\t\t\t\t\t\t\t\tselectedLevel.toUpperCase()\n\t\t\t\t\t\t\t ) }\n\t\t\t\t\t</h4>\n\t\t\t\t\t<ColorGradientControl\n\t\t\t\t\t\tclassName=\"edit-site-screen-heading-background-color__control\"\n\t\t\t\t\t\tcolors={ colorsPerOrigin }\n\t\t\t\t\t\tgradients={ gradientsPerOrigin }\n\t\t\t\t\t\tdisableCustomColors={ ! areCustomSolidsEnabled }\n\t\t\t\t\t\tdisableCustomGradients={ ! areCustomGradientsEnabled }\n\t\t\t\t\t\tshowTitle={ false }\n\t\t\t\t\t\tenableAlpha\n\t\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t\t\t{ ...controlProps }\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t) }\n\t\t</>\n\t);\n}\n\nexport default ScreenHeadingColor;\n"]}
|
|
@@ -4,7 +4,7 @@ import { createElement, Fragment } from "@wordpress/element";
|
|
|
4
4
|
* WordPress dependencies
|
|
5
5
|
*/
|
|
6
6
|
import { __ } from '@wordpress/i18n';
|
|
7
|
-
import { __experimentalColorGradientControl as ColorGradientControl,
|
|
7
|
+
import { __experimentalColorGradientControl as ColorGradientControl, privateApis as blockEditorPrivateApis } from '@wordpress/block-editor';
|
|
8
8
|
import { TabPanel } from '@wordpress/components';
|
|
9
9
|
/**
|
|
10
10
|
* Internal dependencies
|
|
@@ -12,11 +12,11 @@ import { TabPanel } from '@wordpress/components';
|
|
|
12
12
|
|
|
13
13
|
import ScreenHeader from './header';
|
|
14
14
|
import { getSupportedGlobalStylesPanels, useColorsPerOrigin } from './hooks';
|
|
15
|
-
import { unlock } from '../../
|
|
15
|
+
import { unlock } from '../../private-apis';
|
|
16
16
|
const {
|
|
17
17
|
useGlobalSetting,
|
|
18
18
|
useGlobalStyle
|
|
19
|
-
} = unlock(
|
|
19
|
+
} = unlock(blockEditorPrivateApis);
|
|
20
20
|
|
|
21
21
|
function ScreenLinkColor(_ref) {
|
|
22
22
|
let {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["@wordpress/edit-site/src/components/global-styles/screen-link-color.js"],"names":["__","__experimentalColorGradientControl","ColorGradientControl","
|
|
1
|
+
{"version":3,"sources":["@wordpress/edit-site/src/components/global-styles/screen-link-color.js"],"names":["__","__experimentalColorGradientControl","ColorGradientControl","privateApis","blockEditorPrivateApis","TabPanel","ScreenHeader","getSupportedGlobalStylesPanels","useColorsPerOrigin","unlock","useGlobalSetting","useGlobalStyle","ScreenLinkColor","name","variation","prefix","supports","areCustomSolidsEnabled","colorsPerOrigin","isLinkEnabled","hasLinkColor","includes","length","pseudoStates","default","label","value","handler","userValue","hover","tabs","Object","entries","map","selector","config","title","className","tab","pseudoSelectorConfig"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport {\n\t__experimentalColorGradientControl as ColorGradientControl,\n\tprivateApis as blockEditorPrivateApis,\n} from '@wordpress/block-editor';\nimport { TabPanel } from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport ScreenHeader from './header';\nimport { getSupportedGlobalStylesPanels, useColorsPerOrigin } from './hooks';\nimport { unlock } from '../../private-apis';\n\nconst { useGlobalSetting, useGlobalStyle } = unlock( blockEditorPrivateApis );\n\nfunction ScreenLinkColor( { name, variation = '' } ) {\n\tconst prefix = variation ? `variations.${ variation }.` : '';\n\tconst supports = getSupportedGlobalStylesPanels( name );\n\tconst [ areCustomSolidsEnabled ] = useGlobalSetting( 'color.custom', name );\n\tconst colorsPerOrigin = useColorsPerOrigin( name );\n\tconst [ isLinkEnabled ] = useGlobalSetting( 'color.link', name );\n\n\tconst hasLinkColor =\n\t\tsupports.includes( 'linkColor' ) &&\n\t\tisLinkEnabled &&\n\t\t( colorsPerOrigin.length > 0 || areCustomSolidsEnabled );\n\n\tconst pseudoStates = {\n\t\tdefault: {\n\t\t\tlabel: __( 'Default' ),\n\t\t\tvalue: useGlobalStyle(\n\t\t\t\tprefix + 'elements.link.color.text',\n\t\t\t\tname\n\t\t\t)[ 0 ],\n\t\t\thandler: useGlobalStyle(\n\t\t\t\tprefix + 'elements.link.color.text',\n\t\t\t\tname\n\t\t\t)[ 1 ],\n\t\t\tuserValue: useGlobalStyle(\n\t\t\t\tprefix + 'elements.link.color.text',\n\t\t\t\tname,\n\t\t\t\t'user'\n\t\t\t)[ 0 ],\n\t\t},\n\t\thover: {\n\t\t\tlabel: __( 'Hover' ),\n\t\t\tvalue: useGlobalStyle(\n\t\t\t\tprefix + 'elements.link.:hover.color.text',\n\t\t\t\tname\n\t\t\t)[ 0 ],\n\t\t\thandler: useGlobalStyle(\n\t\t\t\tprefix + 'elements.link.:hover.color.text',\n\t\t\t\tname\n\t\t\t)[ 1 ],\n\t\t\tuserValue: useGlobalStyle(\n\t\t\t\tprefix + 'elements.link.:hover.color.text',\n\t\t\t\tname,\n\t\t\t\t'user'\n\t\t\t)[ 0 ],\n\t\t},\n\t};\n\n\tif ( ! hasLinkColor ) {\n\t\treturn null;\n\t}\n\n\tconst tabs = Object.entries( pseudoStates ).map(\n\t\t( [ selector, config ] ) => {\n\t\t\treturn {\n\t\t\t\tname: selector,\n\t\t\t\ttitle: config.label,\n\t\t\t\tclassName: `color-text-${ selector }`,\n\t\t\t};\n\t\t}\n\t);\n\n\treturn (\n\t\t<>\n\t\t\t<ScreenHeader\n\t\t\t\ttitle={ __( 'Links' ) }\n\t\t\t\tdescription={ __(\n\t\t\t\t\t'Set the colors used for links across the site.'\n\t\t\t\t) }\n\t\t\t/>\n\n\t\t\t<TabPanel tabs={ tabs }>\n\t\t\t\t{ ( tab ) => {\n\t\t\t\t\tconst pseudoSelectorConfig =\n\t\t\t\t\t\tpseudoStates[ tab.name ] ?? null;\n\n\t\t\t\t\tif ( ! pseudoSelectorConfig ) {\n\t\t\t\t\t\treturn null;\n\t\t\t\t\t}\n\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t<ColorGradientControl\n\t\t\t\t\t\t\t\tclassName=\"edit-site-screen-link-color__control\"\n\t\t\t\t\t\t\t\tcolors={ colorsPerOrigin }\n\t\t\t\t\t\t\t\tdisableCustomColors={ ! areCustomSolidsEnabled }\n\t\t\t\t\t\t\t\tshowTitle={ false }\n\t\t\t\t\t\t\t\tenableAlpha\n\t\t\t\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t\t\t\t\tcolorValue={ pseudoSelectorConfig.value }\n\t\t\t\t\t\t\t\tonColorChange={ pseudoSelectorConfig.handler }\n\t\t\t\t\t\t\t\tclearable={\n\t\t\t\t\t\t\t\t\tpseudoSelectorConfig.value ===\n\t\t\t\t\t\t\t\t\tpseudoSelectorConfig.userValue\n\t\t\t\t\t\t\t\t}\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</TabPanel>\n\t\t</>\n\t);\n}\n\nexport default ScreenLinkColor;\n"]}
|
|
@@ -8,7 +8,7 @@ import { isRTL, __ } from '@wordpress/i18n';
|
|
|
8
8
|
import { chevronLeft, chevronRight } from '@wordpress/icons';
|
|
9
9
|
import { useSelect } from '@wordpress/data';
|
|
10
10
|
import { store as coreStore } from '@wordpress/core-data';
|
|
11
|
-
import {
|
|
11
|
+
import { privateApis as blockEditorPrivateApis } from '@wordpress/block-editor';
|
|
12
12
|
/**
|
|
13
13
|
* Internal dependencies
|
|
14
14
|
*/
|
|
@@ -17,12 +17,12 @@ import { IconWithCurrentColor } from './icon-with-current-color';
|
|
|
17
17
|
import { NavigationButtonAsItem } from './navigation-button';
|
|
18
18
|
import ContextMenu from './context-menu';
|
|
19
19
|
import StylesPreview from './preview';
|
|
20
|
-
import { unlock } from '../../
|
|
20
|
+
import { unlock } from '../../private-apis';
|
|
21
21
|
|
|
22
22
|
function ScreenRoot() {
|
|
23
23
|
const {
|
|
24
24
|
useGlobalStyle
|
|
25
|
-
} = unlock(
|
|
25
|
+
} = unlock(blockEditorPrivateApis);
|
|
26
26
|
const [customCSS] = useGlobalStyle('css');
|
|
27
27
|
const {
|
|
28
28
|
variations,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["@wordpress/edit-site/src/components/global-styles/screen-root.js"],"names":["__experimentalItemGroup","ItemGroup","__experimentalHStack","HStack","__experimentalSpacer","Spacer","__experimentalVStack","VStack","FlexItem","CardBody","Card","CardDivider","CardMedia","isRTL","__","chevronLeft","chevronRight","useSelect","store","coreStore","
|
|
1
|
+
{"version":3,"sources":["@wordpress/edit-site/src/components/global-styles/screen-root.js"],"names":["__experimentalItemGroup","ItemGroup","__experimentalHStack","HStack","__experimentalSpacer","Spacer","__experimentalVStack","VStack","FlexItem","CardBody","Card","CardDivider","CardMedia","isRTL","__","chevronLeft","chevronRight","useSelect","store","coreStore","privateApis","blockEditorPrivateApis","IconWithCurrentColor","NavigationButtonAsItem","ContextMenu","StylesPreview","unlock","ScreenRoot","useGlobalStyle","customCSS","variations","canEditCSS","select","getEntityRecord","__experimentalGetCurrentGlobalStylesId","__experimentalGetCurrentThemeGlobalStylesVariations","globalStylesId","globalStyles","undefined","_links","length"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\t__experimentalItemGroup as ItemGroup,\n\t__experimentalHStack as HStack,\n\t__experimentalSpacer as Spacer,\n\t__experimentalVStack as VStack,\n\tFlexItem,\n\tCardBody,\n\tCard,\n\tCardDivider,\n\tCardMedia,\n} from '@wordpress/components';\nimport { isRTL, __ } from '@wordpress/i18n';\nimport { chevronLeft, chevronRight } from '@wordpress/icons';\nimport { useSelect } from '@wordpress/data';\nimport { store as coreStore } from '@wordpress/core-data';\nimport { privateApis as blockEditorPrivateApis } from '@wordpress/block-editor';\n\n/**\n * Internal dependencies\n */\nimport { IconWithCurrentColor } from './icon-with-current-color';\nimport { NavigationButtonAsItem } from './navigation-button';\nimport ContextMenu from './context-menu';\nimport StylesPreview from './preview';\nimport { unlock } from '../../private-apis';\n\nfunction ScreenRoot() {\n\tconst { useGlobalStyle } = unlock( blockEditorPrivateApis );\n\tconst [ customCSS ] = useGlobalStyle( 'css' );\n\n\tconst { variations, canEditCSS } = useSelect( ( select ) => {\n\t\tconst {\n\t\t\tgetEntityRecord,\n\t\t\t__experimentalGetCurrentGlobalStylesId,\n\t\t\t__experimentalGetCurrentThemeGlobalStylesVariations,\n\t\t} = select( coreStore );\n\n\t\tconst globalStylesId = __experimentalGetCurrentGlobalStylesId();\n\t\tconst globalStyles = globalStylesId\n\t\t\t? getEntityRecord( 'root', 'globalStyles', globalStylesId )\n\t\t\t: undefined;\n\n\t\treturn {\n\t\t\tvariations: __experimentalGetCurrentThemeGlobalStylesVariations(),\n\t\t\tcanEditCSS:\n\t\t\t\t!! globalStyles?._links?.[ 'wp:action-edit-css' ] ?? false,\n\t\t};\n\t}, [] );\n\n\treturn (\n\t\t<Card size=\"small\">\n\t\t\t<CardBody>\n\t\t\t\t<VStack spacing={ 4 }>\n\t\t\t\t\t<Card>\n\t\t\t\t\t\t<CardMedia>\n\t\t\t\t\t\t\t<StylesPreview />\n\t\t\t\t\t\t</CardMedia>\n\t\t\t\t\t</Card>\n\t\t\t\t\t{ !! variations?.length && (\n\t\t\t\t\t\t<ItemGroup>\n\t\t\t\t\t\t\t<NavigationButtonAsItem\n\t\t\t\t\t\t\t\tpath=\"/variations\"\n\t\t\t\t\t\t\t\taria-label={ __( 'Browse styles' ) }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<HStack justify=\"space-between\">\n\t\t\t\t\t\t\t\t\t<FlexItem>\n\t\t\t\t\t\t\t\t\t\t{ __( 'Browse styles' ) }\n\t\t\t\t\t\t\t\t\t</FlexItem>\n\t\t\t\t\t\t\t\t\t<IconWithCurrentColor\n\t\t\t\t\t\t\t\t\t\ticon={\n\t\t\t\t\t\t\t\t\t\t\tisRTL() ? chevronLeft : chevronRight\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t</HStack>\n\t\t\t\t\t\t\t</NavigationButtonAsItem>\n\t\t\t\t\t\t</ItemGroup>\n\t\t\t\t\t) }\n\t\t\t\t\t<ContextMenu />\n\t\t\t\t</VStack>\n\t\t\t</CardBody>\n\n\t\t\t<CardDivider />\n\n\t\t\t<CardBody>\n\t\t\t\t<Spacer\n\t\t\t\t\tas=\"p\"\n\t\t\t\t\tpaddingTop={ 2 }\n\t\t\t\t\t/*\n\t\t\t\t\t * 13px matches the text inset of the NavigationButton (12px padding, plus the width of the button's border).\n\t\t\t\t\t * This is an ad hoc override for this instance and the Addtional CSS option below. Other options for matching the\n\t\t\t\t\t * the nav button inset should be looked at before reusing further.\n\t\t\t\t\t */\n\t\t\t\t\tpaddingX=\"13px\"\n\t\t\t\t\tmarginBottom={ 4 }\n\t\t\t\t>\n\t\t\t\t\t{ __(\n\t\t\t\t\t\t'Customize the appearance of specific blocks for the whole site.'\n\t\t\t\t\t) }\n\t\t\t\t</Spacer>\n\t\t\t\t<ItemGroup>\n\t\t\t\t\t<NavigationButtonAsItem\n\t\t\t\t\t\tpath=\"/blocks\"\n\t\t\t\t\t\taria-label={ __( 'Blocks styles' ) }\n\t\t\t\t\t>\n\t\t\t\t\t\t<HStack justify=\"space-between\">\n\t\t\t\t\t\t\t<FlexItem>{ __( 'Blocks' ) }</FlexItem>\n\t\t\t\t\t\t\t<IconWithCurrentColor\n\t\t\t\t\t\t\t\ticon={ isRTL() ? chevronLeft : chevronRight }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</HStack>\n\t\t\t\t\t</NavigationButtonAsItem>\n\t\t\t\t</ItemGroup>\n\t\t\t</CardBody>\n\n\t\t\t{ canEditCSS && !! customCSS && (\n\t\t\t\t<>\n\t\t\t\t\t<CardDivider />\n\t\t\t\t\t<CardBody>\n\t\t\t\t\t\t<Spacer\n\t\t\t\t\t\t\tas=\"p\"\n\t\t\t\t\t\t\tpaddingTop={ 2 }\n\t\t\t\t\t\t\tpaddingX=\"13px\"\n\t\t\t\t\t\t\tmarginBottom={ 4 }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ __(\n\t\t\t\t\t\t\t\t'Add your own CSS to customize the appearance and layout of your site.'\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</Spacer>\n\t\t\t\t\t\t<ItemGroup>\n\t\t\t\t\t\t\t<NavigationButtonAsItem\n\t\t\t\t\t\t\t\tpath=\"/css\"\n\t\t\t\t\t\t\t\taria-label={ __( 'Additional CSS' ) }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<HStack justify=\"space-between\">\n\t\t\t\t\t\t\t\t\t<FlexItem>\n\t\t\t\t\t\t\t\t\t\t{ __( 'Additional CSS' ) }\n\t\t\t\t\t\t\t\t\t</FlexItem>\n\t\t\t\t\t\t\t\t\t<IconWithCurrentColor\n\t\t\t\t\t\t\t\t\t\ticon={\n\t\t\t\t\t\t\t\t\t\t\tisRTL() ? chevronLeft : chevronRight\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t</HStack>\n\t\t\t\t\t\t\t</NavigationButtonAsItem>\n\t\t\t\t\t\t</ItemGroup>\n\t\t\t\t\t</CardBody>\n\t\t\t\t</>\n\t\t\t) }\n\t\t</Card>\n\t);\n}\n\nexport default ScreenRoot;\n"]}
|