@wordpress/edit-site 5.6.0 → 5.7.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (122) hide show
  1. package/CHANGELOG.md +2 -0
  2. package/build/components/add-new-template/new-template-part.js +3 -11
  3. package/build/components/add-new-template/new-template-part.js.map +1 -1
  4. package/build/components/add-new-template/new-template.js +7 -7
  5. package/build/components/add-new-template/new-template.js.map +1 -1
  6. package/build/components/add-new-template/utils.js +1 -1
  7. package/build/components/add-new-template/utils.js.map +1 -1
  8. package/build/components/block-editor/editor-canvas.js +7 -10
  9. package/build/components/block-editor/editor-canvas.js.map +1 -1
  10. package/build/components/global-styles/context-menu.js +2 -3
  11. package/build/components/global-styles/context-menu.js.map +1 -1
  12. package/build/components/global-styles/hooks.js +1 -58
  13. package/build/components/global-styles/hooks.js.map +1 -1
  14. package/build/components/global-styles/preview.js +3 -4
  15. package/build/components/global-styles/preview.js.map +1 -1
  16. package/build/components/global-styles/screen-block-list.js +3 -4
  17. package/build/components/global-styles/screen-block-list.js.map +1 -1
  18. package/build/components/global-styles/screen-colors.js +22 -211
  19. package/build/components/global-styles/screen-colors.js.map +1 -1
  20. package/build/components/global-styles/screen-typography-element.js +4 -0
  21. package/build/components/global-styles/screen-typography-element.js.map +1 -1
  22. package/build/components/global-styles/screen-typography.js +5 -0
  23. package/build/components/global-styles/screen-typography.js.map +1 -1
  24. package/build/components/global-styles/ui.js +5 -35
  25. package/build/components/global-styles/ui.js.map +1 -1
  26. package/build/components/global-styles-renderer/index.js +1 -2
  27. package/build/components/global-styles-renderer/index.js.map +1 -1
  28. package/build/components/secondary-sidebar/list-view-sidebar.js +6 -1
  29. package/build/components/secondary-sidebar/list-view-sidebar.js.map +1 -1
  30. package/build/components/start-template-options/index.js +44 -9
  31. package/build/components/start-template-options/index.js.map +1 -1
  32. package/build/components/style-book/index.js +6 -7
  33. package/build/components/style-book/index.js.map +1 -1
  34. package/build/hooks/push-changes-to-global-styles/index.js +1 -0
  35. package/build/hooks/push-changes-to-global-styles/index.js.map +1 -1
  36. package/build-module/components/add-new-template/new-template-part.js +3 -9
  37. package/build-module/components/add-new-template/new-template-part.js.map +1 -1
  38. package/build-module/components/add-new-template/new-template.js +7 -7
  39. package/build-module/components/add-new-template/new-template.js.map +1 -1
  40. package/build-module/components/add-new-template/utils.js +1 -1
  41. package/build-module/components/add-new-template/utils.js.map +1 -1
  42. package/build-module/components/block-editor/editor-canvas.js +8 -11
  43. package/build-module/components/block-editor/editor-canvas.js.map +1 -1
  44. package/build-module/components/global-styles/context-menu.js +2 -2
  45. package/build-module/components/global-styles/context-menu.js.map +1 -1
  46. package/build-module/components/global-styles/hooks.js +1 -52
  47. package/build-module/components/global-styles/hooks.js.map +1 -1
  48. package/build-module/components/global-styles/preview.js +3 -4
  49. package/build-module/components/global-styles/preview.js.map +1 -1
  50. package/build-module/components/global-styles/screen-block-list.js +3 -3
  51. package/build-module/components/global-styles/screen-block-list.js.map +1 -1
  52. package/build-module/components/global-styles/screen-colors.js +23 -208
  53. package/build-module/components/global-styles/screen-colors.js.map +1 -1
  54. package/build-module/components/global-styles/screen-typography-element.js +4 -0
  55. package/build-module/components/global-styles/screen-typography-element.js.map +1 -1
  56. package/build-module/components/global-styles/screen-typography.js +5 -0
  57. package/build-module/components/global-styles/screen-typography.js.map +1 -1
  58. package/build-module/components/global-styles/ui.js +5 -30
  59. package/build-module/components/global-styles/ui.js.map +1 -1
  60. package/build-module/components/global-styles-renderer/index.js +1 -2
  61. package/build-module/components/global-styles-renderer/index.js.map +1 -1
  62. package/build-module/components/secondary-sidebar/list-view-sidebar.js +6 -2
  63. package/build-module/components/secondary-sidebar/list-view-sidebar.js.map +1 -1
  64. package/build-module/components/start-template-options/index.js +45 -10
  65. package/build-module/components/start-template-options/index.js.map +1 -1
  66. package/build-module/components/style-book/index.js +7 -8
  67. package/build-module/components/style-book/index.js.map +1 -1
  68. package/build-module/hooks/push-changes-to-global-styles/index.js +1 -0
  69. package/build-module/hooks/push-changes-to-global-styles/index.js.map +1 -1
  70. package/build-style/style-rtl.css +4 -17
  71. package/build-style/style.css +4 -17
  72. package/package.json +31 -31
  73. package/src/components/add-new-template/new-template-part.js +1 -6
  74. package/src/components/add-new-template/new-template.js +3 -6
  75. package/src/components/add-new-template/utils.js +1 -1
  76. package/src/components/block-editor/editor-canvas.js +13 -23
  77. package/src/components/global-styles/context-menu.js +2 -2
  78. package/src/components/global-styles/hooks.js +1 -78
  79. package/src/components/global-styles/preview.js +1 -1
  80. package/src/components/global-styles/screen-block-list.js +2 -2
  81. package/src/components/global-styles/screen-colors.js +25 -229
  82. package/src/components/global-styles/screen-typography-element.js +4 -0
  83. package/src/components/global-styles/screen-typography.js +6 -0
  84. package/src/components/global-styles/stories/index.js +425 -0
  85. package/src/components/global-styles/style.scss +4 -18
  86. package/src/components/global-styles/ui.js +6 -31
  87. package/src/components/global-styles-renderer/index.js +1 -2
  88. package/src/components/secondary-sidebar/list-view-sidebar.js +4 -3
  89. package/src/components/start-template-options/index.js +40 -8
  90. package/src/components/style-book/index.js +10 -16
  91. package/src/components/style-book/style.scss +1 -1
  92. package/src/hooks/push-changes-to-global-styles/index.js +1 -0
  93. package/build/components/global-styles/color-utils.js +0 -17
  94. package/build/components/global-styles/color-utils.js.map +0 -1
  95. package/build/components/global-styles/screen-background-color.js +0 -114
  96. package/build/components/global-styles/screen-background-color.js.map +0 -1
  97. package/build/components/global-styles/screen-button-color.js +0 -88
  98. package/build/components/global-styles/screen-button-color.js.map +0 -1
  99. package/build/components/global-styles/screen-heading-color.js +0 -165
  100. package/build/components/global-styles/screen-heading-color.js.map +0 -1
  101. package/build/components/global-styles/screen-link-color.js +0 -105
  102. package/build/components/global-styles/screen-link-color.js.map +0 -1
  103. package/build/components/global-styles/screen-text-color.js +0 -71
  104. package/build/components/global-styles/screen-text-color.js.map +0 -1
  105. package/build-module/components/global-styles/color-utils.js +0 -9
  106. package/build-module/components/global-styles/color-utils.js.map +0 -1
  107. package/build-module/components/global-styles/screen-background-color.js +0 -97
  108. package/build-module/components/global-styles/screen-background-color.js.map +0 -1
  109. package/build-module/components/global-styles/screen-button-color.js +0 -73
  110. package/build-module/components/global-styles/screen-button-color.js.map +0 -1
  111. package/build-module/components/global-styles/screen-heading-color.js +0 -149
  112. package/build-module/components/global-styles/screen-heading-color.js.map +0 -1
  113. package/build-module/components/global-styles/screen-link-color.js +0 -89
  114. package/build-module/components/global-styles/screen-link-color.js.map +0 -1
  115. package/build-module/components/global-styles/screen-text-color.js +0 -56
  116. package/build-module/components/global-styles/screen-text-color.js.map +0 -1
  117. package/src/components/global-styles/color-utils.js +0 -14
  118. package/src/components/global-styles/screen-background-color.js +0 -132
  119. package/src/components/global-styles/screen-button-color.js +0 -104
  120. package/src/components/global-styles/screen-heading-color.js +0 -206
  121. package/src/components/global-styles/screen-link-color.js +0 -124
  122. package/src/components/global-styles/screen-text-color.js +0 -62
@@ -45,6 +45,7 @@ const STYLE_PATH_TO_CSS_VAR_INFIX = {
45
45
  'elements.button.color.background': 'color',
46
46
  'elements.button.typography.fontFamily': 'font-family',
47
47
  'elements.button.typography.fontSize': 'font-size',
48
+ 'elements.caption.color.text': 'color',
48
49
  'elements.heading.color': 'color',
49
50
  'elements.heading.color.background': 'color',
50
51
  'elements.heading.typography.fontFamily': 'font-family',
@@ -1,17 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.useHasColorPanel = useHasColorPanel;
7
-
8
- var _hooks = require("./hooks");
9
-
10
- /**
11
- * Internal dependencies
12
- */
13
- function useHasColorPanel(name) {
14
- const supports = (0, _hooks.useSupportedStyles)(name);
15
- return supports.includes('color') || supports.includes('backgroundColor') || supports.includes('background') || supports.includes('linkColor');
16
- }
17
- //# sourceMappingURL=color-utils.js.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["@wordpress/edit-site/src/components/global-styles/color-utils.js"],"names":["useHasColorPanel","name","supports","includes"],"mappings":";;;;;;;AAGA;;AAHA;AACA;AACA;AAGO,SAASA,gBAAT,CAA2BC,IAA3B,EAAkC;AACxC,QAAMC,QAAQ,GAAG,+BAAoBD,IAApB,CAAjB;AACA,SACCC,QAAQ,CAACC,QAAT,CAAmB,OAAnB,KACAD,QAAQ,CAACC,QAAT,CAAmB,iBAAnB,CADA,IAEAD,QAAQ,CAACC,QAAT,CAAmB,YAAnB,CAFA,IAGAD,QAAQ,CAACC,QAAT,CAAmB,WAAnB,CAJD;AAMA","sourcesContent":["/**\n * Internal dependencies\n */\nimport { useSupportedStyles } from './hooks';\n\nexport function useHasColorPanel( name ) {\n\tconst supports = useSupportedStyles( name );\n\treturn (\n\t\tsupports.includes( 'color' ) ||\n\t\tsupports.includes( 'backgroundColor' ) ||\n\t\tsupports.includes( 'background' ) ||\n\t\tsupports.includes( 'linkColor' )\n\t);\n}\n"]}
@@ -1,114 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
-
5
- Object.defineProperty(exports, "__esModule", {
6
- value: true
7
- });
8
- exports.default = void 0;
9
-
10
- var _element = require("@wordpress/element");
11
-
12
- var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
13
-
14
- var _classnames = _interopRequireDefault(require("classnames"));
15
-
16
- var _i18n = require("@wordpress/i18n");
17
-
18
- var _blockEditor = require("@wordpress/block-editor");
19
-
20
- var _header = _interopRequireDefault(require("./header"));
21
-
22
- var _hooks = require("./hooks");
23
-
24
- var _privateApis = require("../../private-apis");
25
-
26
- /**
27
- * External dependencies
28
- */
29
-
30
- /**
31
- * WordPress dependencies
32
- */
33
-
34
- /**
35
- * Internal dependencies
36
- */
37
- const {
38
- useGlobalSetting,
39
- useGlobalStyle
40
- } = (0, _privateApis.unlock)(_blockEditor.privateApis);
41
-
42
- function ScreenBackgroundColor(_ref) {
43
- let {
44
- name,
45
- variation = ''
46
- } = _ref;
47
- const prefix = variation ? `variations.${variation}.` : '';
48
- const supports = (0, _hooks.useSupportedStyles)(name);
49
- const [areCustomSolidsEnabled] = useGlobalSetting('color.custom', name);
50
- const [areCustomGradientsEnabled] = useGlobalSetting('color.customGradient', name);
51
- const colorsPerOrigin = (0, _hooks.useColorsPerOrigin)(name);
52
- const gradientsPerOrigin = (0, _hooks.useGradientsPerOrigin)(name);
53
- const [isBackgroundEnabled] = useGlobalSetting('color.background', name);
54
- const hasBackgroundColor = supports.includes('backgroundColor') && isBackgroundEnabled && (colorsPerOrigin.length > 0 || areCustomSolidsEnabled);
55
- const hasGradientColor = supports.includes('background') && (gradientsPerOrigin.length > 0 || areCustomGradientsEnabled);
56
- const [backgroundColor, setBackgroundColor] = useGlobalStyle(prefix + 'color.background', name);
57
- const [userBackgroundColor] = useGlobalStyle(prefix + 'color.background', name, 'user');
58
- const [gradient, setGradient] = useGlobalStyle(prefix + 'color.gradient', name);
59
- const [userGradient] = useGlobalStyle(prefix + 'color.gradient', name, 'user');
60
-
61
- if (!hasBackgroundColor && !hasGradientColor) {
62
- return null;
63
- }
64
-
65
- let backgroundSettings = {};
66
-
67
- if (hasBackgroundColor) {
68
- backgroundSettings = {
69
- colorValue: backgroundColor,
70
- onColorChange: setBackgroundColor
71
- };
72
-
73
- if (backgroundColor) {
74
- backgroundSettings.clearable = backgroundColor === userBackgroundColor;
75
- }
76
- }
77
-
78
- let gradientSettings = {};
79
-
80
- if (hasGradientColor) {
81
- gradientSettings = {
82
- gradientValue: gradient,
83
- onGradientChange: setGradient
84
- };
85
-
86
- if (gradient) {
87
- gradientSettings.clearable = gradient === userGradient;
88
- }
89
- }
90
-
91
- const controlProps = { ...backgroundSettings,
92
- ...gradientSettings
93
- };
94
- return (0, _element.createElement)(_element.Fragment, null, (0, _element.createElement)(_header.default, {
95
- title: (0, _i18n.__)('Background'),
96
- description: (0, _i18n.__)('Set a background color or gradient for the whole site.')
97
- }), (0, _element.createElement)(_blockEditor.__experimentalColorGradientControl, (0, _extends2.default)({
98
- className: (0, _classnames.default)('edit-site-screen-background-color__control', {
99
- 'has-no-tabs': !hasBackgroundColor || !hasGradientColor
100
- }),
101
- colors: colorsPerOrigin,
102
- gradients: gradientsPerOrigin,
103
- disableCustomColors: !areCustomSolidsEnabled,
104
- disableCustomGradients: !areCustomGradientsEnabled,
105
- showTitle: false,
106
- enableAlpha: true,
107
- __experimentalIsRenderedInSidebar: true,
108
- headingLevel: 3
109
- }, controlProps)));
110
- }
111
-
112
- var _default = ScreenBackgroundColor;
113
- exports.default = _default;
114
- //# sourceMappingURL=screen-background-color.js.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["@wordpress/edit-site/src/components/global-styles/screen-background-color.js"],"names":["useGlobalSetting","useGlobalStyle","blockEditorPrivateApis","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\tuseSupportedStyles,\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 = useSupportedStyles( 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\theadingLevel={ 3 }\n\t\t\t\t{ ...controlProps }\n\t\t\t/>\n\t\t</>\n\t);\n}\n\nexport default ScreenBackgroundColor;\n"]}
@@ -1,88 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
-
5
- Object.defineProperty(exports, "__esModule", {
6
- value: true
7
- });
8
- exports.default = void 0;
9
-
10
- var _element = require("@wordpress/element");
11
-
12
- var _i18n = require("@wordpress/i18n");
13
-
14
- var _blockEditor = require("@wordpress/block-editor");
15
-
16
- var _header = _interopRequireDefault(require("./header"));
17
-
18
- var _hooks = require("./hooks");
19
-
20
- var _privateApis = require("../../private-apis");
21
-
22
- /**
23
- * WordPress dependencies
24
- */
25
-
26
- /**
27
- * Internal dependencies
28
- */
29
- const {
30
- useGlobalSetting,
31
- useGlobalStyle
32
- } = (0, _privateApis.unlock)(_blockEditor.privateApis);
33
-
34
- function ScreenButtonColor(_ref) {
35
- let {
36
- name,
37
- variation = ''
38
- } = _ref;
39
- const prefix = variation ? `variations.${variation}.` : '';
40
- const supports = (0, _hooks.useSupportedStyles)(name);
41
- const colorsPerOrigin = (0, _hooks.useColorsPerOrigin)(name);
42
- const [areCustomSolidsEnabled] = useGlobalSetting('color.custom', name);
43
- const [isBackgroundEnabled] = useGlobalSetting('color.background', name);
44
- const hasButtonColor = supports.includes('buttonColor') && isBackgroundEnabled && (colorsPerOrigin.length > 0 || areCustomSolidsEnabled);
45
- const [buttonTextColor, setButtonTextColor] = useGlobalStyle(prefix + 'elements.button.color.text', name);
46
- const [userButtonTextColor] = useGlobalStyle('elements.button.color.text', name, 'user');
47
- const [buttonBgColor, setButtonBgColor] = useGlobalStyle('elements.button.color.background', name);
48
- const [userButtonBgColor] = useGlobalStyle('elements.button.color.background', name, 'user');
49
-
50
- if (!hasButtonColor) {
51
- return null;
52
- }
53
-
54
- return (0, _element.createElement)(_element.Fragment, null, (0, _element.createElement)(_header.default, {
55
- title: (0, _i18n.__)('Buttons'),
56
- description: (0, _i18n.__)('Set the default colors used for buttons across the site.')
57
- }), (0, _element.createElement)("h3", {
58
- className: "edit-site-global-styles-section-title"
59
- }, (0, _i18n.__)('Text color')), (0, _element.createElement)(_blockEditor.__experimentalColorGradientControl, {
60
- className: "edit-site-screen-button-color__control",
61
- colors: colorsPerOrigin,
62
- disableCustomColors: !areCustomSolidsEnabled,
63
- showTitle: false,
64
- enableAlpha: true,
65
- __experimentalIsRenderedInSidebar: true,
66
- colorValue: buttonTextColor,
67
- onColorChange: setButtonTextColor,
68
- clearable: buttonTextColor === userButtonTextColor,
69
- headingLevel: 4
70
- }), (0, _element.createElement)("h3", {
71
- className: "edit-site-global-styles-section-title"
72
- }, (0, _i18n.__)('Background color')), (0, _element.createElement)(_blockEditor.__experimentalColorGradientControl, {
73
- className: "edit-site-screen-button-color__control",
74
- colors: colorsPerOrigin,
75
- disableCustomColors: !areCustomSolidsEnabled,
76
- showTitle: false,
77
- enableAlpha: true,
78
- __experimentalIsRenderedInSidebar: true,
79
- colorValue: buttonBgColor,
80
- onColorChange: setButtonBgColor,
81
- clearable: buttonBgColor === userButtonBgColor,
82
- headingLevel: 4
83
- }));
84
- }
85
-
86
- var _default = ScreenButtonColor;
87
- exports.default = _default;
88
- //# sourceMappingURL=screen-button-color.js.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["@wordpress/edit-site/src/components/global-styles/screen-button-color.js"],"names":["useGlobalSetting","useGlobalStyle","blockEditorPrivateApis","ScreenButtonColor","name","variation","prefix","supports","colorsPerOrigin","areCustomSolidsEnabled","isBackgroundEnabled","hasButtonColor","includes","length","buttonTextColor","setButtonTextColor","userButtonTextColor","buttonBgColor","setButtonBgColor","userButtonBgColor"],"mappings":";;;;;;;;;;;AAGA;;AACA;;AAQA;;AACA;;AACA;;AAdA;AACA;AACA;;AAOA;AACA;AACA;AAKA,MAAM;AAAEA,EAAAA,gBAAF;AAAoBC,EAAAA;AAApB,IAAuC,yBAAQC,wBAAR,CAA7C;;AAEA,SAASC,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,GAAG,+BAAoBH,IAApB,CAAjB;AACA,QAAMI,eAAe,GAAG,+BAAoBJ,IAApB,CAAxB;AACA,QAAM,CAAEK,sBAAF,IAA6BT,gBAAgB,CAAE,cAAF,EAAkBI,IAAlB,CAAnD;AACA,QAAM,CAAEM,mBAAF,IAA0BV,gBAAgB,CAC/C,kBAD+C,EAE/CI,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,IAA0Cd,cAAc,CAC7DK,MAAM,GAAG,4BADoD,EAE7DF,IAF6D,CAA9D;AAIA,QAAM,CAAEY,mBAAF,IAA0Bf,cAAc,CAC7C,4BAD6C,EAE7CG,IAF6C,EAG7C,MAH6C,CAA9C;AAMA,QAAM,CAAEa,aAAF,EAAiBC,gBAAjB,IAAsCjB,cAAc,CACzD,kCADyD,EAEzDG,IAFyD,CAA1D;AAIA,QAAM,CAAEe,iBAAF,IAAwBlB,cAAc,CAC3C,kCAD2C,EAE3CG,IAF2C,EAG3C,MAH2C,CAA5C;;AAMA,MAAK,CAAEO,cAAP,EAAwB;AACvB,WAAO,IAAP;AACA;;AAED,SACC,qDACC,4BAAC,eAAD;AACC,IAAA,KAAK,EAAG,cAAI,SAAJ,CADT;AAEC,IAAA,WAAW,EAAG,cACb,0DADa;AAFf,IADD,EAQC;AAAI,IAAA,SAAS,EAAC;AAAd,KACG,cAAI,YAAJ,CADH,CARD,EAYC,4BAAC,+CAAD;AACC,IAAA,SAAS,EAAC,wCADX;AAEC,IAAA,MAAM,EAAGH,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,mBATjC;AAUC,IAAA,YAAY,EAAG;AAVhB,IAZD,EAyBC;AAAI,IAAA,SAAS,EAAC;AAAd,KACG,cAAI,kBAAJ,CADH,CAzBD,EA6BC,4BAAC,+CAAD;AACC,IAAA,SAAS,EAAC,wCADX;AAEC,IAAA,MAAM,EAAGR,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,iBAT/B;AAUC,IAAA,YAAY,EAAG;AAVhB,IA7BD,CADD;AA4CA;;eAEchB,iB","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 { useSupportedStyles, 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 = useSupportedStyles( 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<h3 className=\"edit-site-global-styles-section-title\">\n\t\t\t\t{ __( 'Text color' ) }\n\t\t\t</h3>\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\theadingLevel={ 4 }\n\t\t\t/>\n\n\t\t\t<h3 className=\"edit-site-global-styles-section-title\">\n\t\t\t\t{ __( 'Background color' ) }\n\t\t\t</h3>\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\theadingLevel={ 4 }\n\t\t\t/>\n\t\t</>\n\t);\n}\n\nexport default ScreenButtonColor;\n"]}
@@ -1,165 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
-
5
- Object.defineProperty(exports, "__esModule", {
6
- value: true
7
- });
8
- exports.default = void 0;
9
-
10
- var _element = require("@wordpress/element");
11
-
12
- var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
13
-
14
- var _i18n = require("@wordpress/i18n");
15
-
16
- var _components = require("@wordpress/components");
17
-
18
- var _blockEditor = require("@wordpress/block-editor");
19
-
20
- var _header = _interopRequireDefault(require("./header"));
21
-
22
- var _hooks = require("./hooks");
23
-
24
- var _privateApis = require("../../private-apis");
25
-
26
- /**
27
- * WordPress dependencies
28
- */
29
-
30
- /**
31
- * Internal dependencies
32
- */
33
- const {
34
- useGlobalSetting,
35
- useGlobalStyle
36
- } = (0, _privateApis.unlock)(_blockEditor.privateApis);
37
-
38
- function ScreenHeadingColor(_ref) {
39
- let {
40
- name,
41
- variation = ''
42
- } = _ref;
43
- const prefix = variation ? `variations.${variation}.` : '';
44
- const [selectedLevel, setCurrentTab] = (0, _element.useState)('heading');
45
- const supports = (0, _hooks.useSupportedStyles)(name);
46
- const [areCustomSolidsEnabled] = useGlobalSetting('color.custom', name);
47
- const [areCustomGradientsEnabled] = useGlobalSetting('color.customGradient', name);
48
- const [isTextEnabled] = useGlobalSetting('color.text', name);
49
- const [isBackgroundEnabled] = useGlobalSetting('color.background', name);
50
- const colorsPerOrigin = (0, _hooks.useColorsPerOrigin)(name);
51
- const gradientsPerOrigin = (0, _hooks.useGradientsPerOrigin)(name);
52
- const hasTextColor = supports.includes('color') && isTextEnabled && (colorsPerOrigin.length > 0 || areCustomSolidsEnabled);
53
- const hasBackgroundColor = supports.includes('backgroundColor') && isBackgroundEnabled && (colorsPerOrigin.length > 0 || areCustomSolidsEnabled);
54
- const hasGradientColor = supports.includes('background') && (gradientsPerOrigin.length > 0 || areCustomGradientsEnabled);
55
- const [color, setColor] = useGlobalStyle(prefix + 'elements.' + selectedLevel + '.color.text', name);
56
- const [userColor] = useGlobalStyle(prefix + 'elements.' + selectedLevel + '.color.text', name, 'user');
57
- const [backgroundColor, setBackgroundColor] = useGlobalStyle(prefix + 'elements.' + selectedLevel + '.color.background', name);
58
- const [userBackgroundColor] = useGlobalStyle(prefix + 'elements.' + selectedLevel + '.color.background', name, 'user');
59
- const [gradient, setGradient] = useGlobalStyle(prefix + 'elements.' + selectedLevel + '.color.gradient', name);
60
- const [userGradient] = useGlobalStyle(prefix + 'elements.' + selectedLevel + '.color.gradient', name, 'user');
61
-
62
- if (!hasTextColor && !hasBackgroundColor && !hasGradientColor) {
63
- return null;
64
- }
65
-
66
- let backgroundSettings = {};
67
-
68
- if (hasBackgroundColor) {
69
- backgroundSettings = {
70
- colorValue: backgroundColor,
71
- onColorChange: setBackgroundColor
72
- };
73
-
74
- if (backgroundColor) {
75
- backgroundSettings.clearable = backgroundColor === userBackgroundColor;
76
- }
77
- }
78
-
79
- let gradientSettings = {};
80
-
81
- if (hasGradientColor) {
82
- gradientSettings = {
83
- gradientValue: gradient,
84
- onGradientChange: setGradient
85
- };
86
-
87
- if (gradient) {
88
- gradientSettings.clearable = gradient === userGradient;
89
- }
90
- }
91
-
92
- const controlProps = { ...backgroundSettings,
93
- ...gradientSettings
94
- };
95
- return (0, _element.createElement)(_element.Fragment, null, (0, _element.createElement)(_header.default, {
96
- title: (0, _i18n.__)('Headings'),
97
- description: (0, _i18n.__)('Set the default color used for headings across the site.')
98
- }), (0, _element.createElement)("div", {
99
- className: "edit-site-global-styles-screen-heading-color"
100
- }, (0, _element.createElement)("h3", null, (0, _i18n.__)('Select heading level')), (0, _element.createElement)(_components.__experimentalToggleGroupControl, {
101
- __nextHasNoMarginBottom: true,
102
- label: (0, _i18n.__)('Select heading level'),
103
- hideLabelFromVision: true,
104
- value: selectedLevel,
105
- onChange: setCurrentTab,
106
- isBlock: true
107
- }, (0, _element.createElement)(_components.__experimentalToggleGroupControlOption, {
108
- value: "heading"
109
- /* translators: 'All' refers to selecting all heading levels
110
- and applying the same style to h1-h6. */
111
- ,
112
- label: (0, _i18n.__)('All')
113
- }), (0, _element.createElement)(_components.__experimentalToggleGroupControlOption, {
114
- value: "h1",
115
- label: (0, _i18n.__)('H1')
116
- }), (0, _element.createElement)(_components.__experimentalToggleGroupControlOption, {
117
- value: "h2",
118
- label: (0, _i18n.__)('H2')
119
- }), (0, _element.createElement)(_components.__experimentalToggleGroupControlOption, {
120
- value: "h3",
121
- label: (0, _i18n.__)('H3')
122
- }), (0, _element.createElement)(_components.__experimentalToggleGroupControlOption, {
123
- value: "h4",
124
- label: (0, _i18n.__)('H4')
125
- }), (0, _element.createElement)(_components.__experimentalToggleGroupControlOption, {
126
- value: "h5",
127
- label: (0, _i18n.__)('H5')
128
- }), (0, _element.createElement)(_components.__experimentalToggleGroupControlOption, {
129
- value: "h6",
130
- label: (0, _i18n.__)('H6')
131
- }))), hasTextColor && (0, _element.createElement)("div", {
132
- className: "edit-site-global-styles-screen-heading-color"
133
- }, (0, _element.createElement)("h3", null, selectedLevel === 'heading' ? (0, _i18n.__)('Text color for all heading levels') : (0, _i18n.sprintf)(
134
- /* translators: %s: heading level (h1-h6) */
135
- (0, _i18n.__)('Text color for %s'), selectedLevel.toUpperCase())), (0, _element.createElement)(_blockEditor.__experimentalColorGradientControl, {
136
- className: "edit-site-screen-heading-text-color__control",
137
- colors: colorsPerOrigin,
138
- disableCustomColors: !areCustomSolidsEnabled,
139
- showTitle: false,
140
- enableAlpha: true,
141
- __experimentalIsRenderedInSidebar: true,
142
- colorValue: color,
143
- onColorChange: setColor,
144
- clearable: color === userColor,
145
- headingLevel: 4
146
- })), hasBackgroundColor && (0, _element.createElement)("div", {
147
- className: "edit-site-global-styles-screen-heading-color"
148
- }, (0, _element.createElement)("h3", null, selectedLevel === 'heading' ? (0, _i18n.__)('Background color for all heading levels') : (0, _i18n.sprintf)(
149
- /* translators: %s: heading level (h1-h6) */
150
- (0, _i18n.__)('Background color for %s'), selectedLevel.toUpperCase())), (0, _element.createElement)(_blockEditor.__experimentalColorGradientControl, (0, _extends2.default)({
151
- className: "edit-site-screen-heading-background-color__control",
152
- colors: colorsPerOrigin,
153
- gradients: gradientsPerOrigin,
154
- disableCustomColors: !areCustomSolidsEnabled,
155
- disableCustomGradients: !areCustomGradientsEnabled,
156
- showTitle: false,
157
- enableAlpha: true,
158
- __experimentalIsRenderedInSidebar: true,
159
- headingLevel: 4
160
- }, controlProps))));
161
- }
162
-
163
- var _default = ScreenHeadingColor;
164
- exports.default = _default;
165
- //# sourceMappingURL=screen-heading-color.js.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["@wordpress/edit-site/src/components/global-styles/screen-heading-color.js"],"names":["useGlobalSetting","useGlobalStyle","blockEditorPrivateApis","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\tuseSupportedStyles,\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 = useSupportedStyles( 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<h3>{ __( 'Select heading level' ) }</h3>\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<h3>\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</h3>\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\theadingLevel={ 4 }\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<h3>\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</h3>\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\theadingLevel={ 4 }\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,105 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
-
5
- Object.defineProperty(exports, "__esModule", {
6
- value: true
7
- });
8
- exports.default = void 0;
9
-
10
- var _element = require("@wordpress/element");
11
-
12
- var _i18n = require("@wordpress/i18n");
13
-
14
- var _blockEditor = require("@wordpress/block-editor");
15
-
16
- var _components = require("@wordpress/components");
17
-
18
- var _header = _interopRequireDefault(require("./header"));
19
-
20
- var _hooks = require("./hooks");
21
-
22
- var _privateApis = require("../../private-apis");
23
-
24
- /**
25
- * WordPress dependencies
26
- */
27
-
28
- /**
29
- * Internal dependencies
30
- */
31
- const {
32
- useGlobalSetting,
33
- useGlobalStyle
34
- } = (0, _privateApis.unlock)(_blockEditor.privateApis);
35
-
36
- function ScreenLinkColor(_ref) {
37
- let {
38
- name,
39
- variation = ''
40
- } = _ref;
41
- const prefix = variation ? `variations.${variation}.` : '';
42
- const supports = (0, _hooks.useSupportedStyles)(name);
43
- const [areCustomSolidsEnabled] = useGlobalSetting('color.custom', name);
44
- const colorsPerOrigin = (0, _hooks.useColorsPerOrigin)(name);
45
- const [isLinkEnabled] = useGlobalSetting('color.link', name);
46
- const hasLinkColor = supports.includes('linkColor') && isLinkEnabled && (colorsPerOrigin.length > 0 || areCustomSolidsEnabled);
47
- const pseudoStates = {
48
- default: {
49
- label: (0, _i18n.__)('Default'),
50
- value: useGlobalStyle(prefix + 'elements.link.color.text', name)[0],
51
- handler: useGlobalStyle(prefix + 'elements.link.color.text', name)[1],
52
- userValue: useGlobalStyle(prefix + 'elements.link.color.text', name, 'user')[0]
53
- },
54
- hover: {
55
- label: (0, _i18n.__)('Hover'),
56
- value: useGlobalStyle(prefix + 'elements.link.:hover.color.text', name)[0],
57
- handler: useGlobalStyle(prefix + 'elements.link.:hover.color.text', name)[1],
58
- userValue: useGlobalStyle(prefix + 'elements.link.:hover.color.text', name, 'user')[0]
59
- }
60
- };
61
-
62
- if (!hasLinkColor) {
63
- return null;
64
- }
65
-
66
- const tabs = Object.entries(pseudoStates).map(_ref2 => {
67
- let [selector, config] = _ref2;
68
- return {
69
- name: selector,
70
- title: config.label,
71
- className: `color-text-${selector}`
72
- };
73
- });
74
- return (0, _element.createElement)(_element.Fragment, null, (0, _element.createElement)(_header.default, {
75
- title: (0, _i18n.__)('Links'),
76
- description: (0, _i18n.__)('Set the colors used for links across the site.')
77
- }), (0, _element.createElement)(_components.TabPanel, {
78
- tabs: tabs
79
- }, tab => {
80
- var _pseudoStates$tab$nam;
81
-
82
- const pseudoSelectorConfig = (_pseudoStates$tab$nam = pseudoStates[tab.name]) !== null && _pseudoStates$tab$nam !== void 0 ? _pseudoStates$tab$nam : null;
83
-
84
- if (!pseudoSelectorConfig) {
85
- return null;
86
- }
87
-
88
- return (0, _element.createElement)(_element.Fragment, null, (0, _element.createElement)(_blockEditor.__experimentalColorGradientControl, {
89
- className: "edit-site-screen-link-color__control",
90
- colors: colorsPerOrigin,
91
- disableCustomColors: !areCustomSolidsEnabled,
92
- showTitle: false,
93
- enableAlpha: true,
94
- __experimentalIsRenderedInSidebar: true,
95
- colorValue: pseudoSelectorConfig.value,
96
- onColorChange: pseudoSelectorConfig.handler,
97
- clearable: pseudoSelectorConfig.value === pseudoSelectorConfig.userValue,
98
- headingLevel: 3
99
- }));
100
- }));
101
- }
102
-
103
- var _default = ScreenLinkColor;
104
- exports.default = _default;
105
- //# sourceMappingURL=screen-link-color.js.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["@wordpress/edit-site/src/components/global-styles/screen-link-color.js"],"names":["useGlobalSetting","useGlobalStyle","blockEditorPrivateApis","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 { useSupportedStyles, 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 = useSupportedStyles( 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\theadingLevel={ 3 }\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"]}
@@ -1,71 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
-
5
- Object.defineProperty(exports, "__esModule", {
6
- value: true
7
- });
8
- exports.default = void 0;
9
-
10
- var _element = require("@wordpress/element");
11
-
12
- var _i18n = require("@wordpress/i18n");
13
-
14
- var _blockEditor = require("@wordpress/block-editor");
15
-
16
- var _header = _interopRequireDefault(require("./header"));
17
-
18
- var _hooks = require("./hooks");
19
-
20
- var _privateApis = require("../../private-apis");
21
-
22
- /**
23
- * WordPress dependencies
24
- */
25
-
26
- /**
27
- * Internal dependencies
28
- */
29
- const {
30
- useGlobalSetting,
31
- useGlobalStyle
32
- } = (0, _privateApis.unlock)(_blockEditor.privateApis);
33
-
34
- function ScreenTextColor(_ref) {
35
- let {
36
- name,
37
- variation = ''
38
- } = _ref;
39
- const prefix = variation ? `variations.${variation}.` : '';
40
- const supports = (0, _hooks.useSupportedStyles)(name);
41
- const [areCustomSolidsEnabled] = useGlobalSetting('color.custom', name);
42
- const [isTextEnabled] = useGlobalSetting('color.text', name);
43
- const colorsPerOrigin = (0, _hooks.useColorsPerOrigin)(name);
44
- const hasTextColor = supports.includes('color') && isTextEnabled && (colorsPerOrigin.length > 0 || areCustomSolidsEnabled);
45
- const [color, setColor] = useGlobalStyle(prefix + 'color.text', name);
46
- const [userColor] = useGlobalStyle(prefix + 'color.text', name, 'user');
47
-
48
- if (!hasTextColor) {
49
- return null;
50
- }
51
-
52
- return (0, _element.createElement)(_element.Fragment, null, (0, _element.createElement)(_header.default, {
53
- title: (0, _i18n.__)('Text'),
54
- description: (0, _i18n.__)('Set the default color used for text across the site.')
55
- }), (0, _element.createElement)(_blockEditor.__experimentalColorGradientControl, {
56
- className: "edit-site-screen-text-color__control",
57
- colors: colorsPerOrigin,
58
- disableCustomColors: !areCustomSolidsEnabled,
59
- showTitle: false,
60
- enableAlpha: true,
61
- __experimentalIsRenderedInSidebar: true,
62
- colorValue: color,
63
- onColorChange: setColor,
64
- clearable: color === userColor,
65
- headingLevel: 3
66
- }));
67
- }
68
-
69
- var _default = ScreenTextColor;
70
- exports.default = _default;
71
- //# sourceMappingURL=screen-text-color.js.map