Skip to content

Commit c9ca1b6

Browse files
youknowriadyouknowriad
authored
Merge edb19ea into cb91273 
2 parents cb91273 + edb19ea commit c9ca1b6

7 files changed

Lines changed: 13 additions & 86 deletions

File tree

‎lib/experimental/editor-settings.php‎

Lines changed: 0 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -11,9 +11,6 @@
1111
function gutenberg_enable_experiments() {
1212
global $pagenow;
1313

14-
if ( gutenberg_is_experiment_enabled( 'gutenberg-color-randomizer' ) ) {
15-
wp_add_inline_script( 'wp-block-editor', 'window.__experimentalEnableColorRandomizer = true', 'before' );
16-
}
1714
if ( gutenberg_is_experiment_enabled( 'gutenberg-grid-interactivity' ) ) {
1815
wp_add_inline_script( 'wp-block-editor', 'window.__experimentalEnableGridInteractivity = true', 'before' );
1916
}

‎lib/experimental/experiments/load.php‎

Lines changed: 0 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -94,11 +94,6 @@ function gutenberg_initialize_experiments_settings() {
9494
'slug' => 'other',
9595
'label' => _x( 'Other', 'experiments group name', 'gutenberg' ),
9696
'items' => array(
97-
array(
98-
'id' => 'gutenberg-color-randomizer',
99-
'label' => __( 'Color randomizer', 'gutenberg' ),
100-
'description' => __( 'Enables the Global Styles color randomizer in the Site Editor; a utility that lets you mix the current color palette pseudo-randomly.', 'gutenberg' ),
101-
),
10297
array(
10398
'id' => 'gutenberg-workflow-palette',
10499
'label' => __( 'Workflow Palette', 'gutenberg' ),

‎package-lock.json‎

Lines changed: 1 addition & 2 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎packages/global-styles-ui/CHANGELOG.md‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -34,6 +34,7 @@
3434

3535
### Internal
3636

37+
- Remove the experimental color randomizer from the palette editor, along with the `colord` dependency it used ([#82452](https://github.com/WordPress/gutenberg/pull/82452)).
3738
- Exclude the JavaScript tests and story from the build project so their declarations are not published. ([#81516](https://github.com/WordPress/gutenberg/pull/81516))
3839

3940
## 1.20.0 (2026-08-12)

‎packages/global-styles-ui/package.json‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -61,8 +61,7 @@
6161
"@wordpress/keycodes": "file:../keycodes",
6262
"@wordpress/private-apis": "file:../private-apis",
6363
"@wordpress/ui": "file:../ui",
64-
"clsx": "^2.1.1",
65-
"colord": "^2.9.3"
64+
"clsx": "^2.1.1"
6665
},
6766
"devDependencies": {
6867
"@testing-library/dom": "^10.4.1",

‎packages/global-styles-ui/src/color-palette-panel.tsx‎

Lines changed: 10 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -3,11 +3,9 @@ import { useViewportMatch } from '@wordpress/compose';
33
import {
44
__experimentalPaletteEdit as PaletteEdit,
55
__experimentalVStack as VStack,
6-
Button,
76
} from '@wordpress/components';
87
import { __ } from '@wordpress/i18n';
9-
import { shuffle } from '@wordpress/icons';
10-
import { useSetting, useColorRandomizer } from './hooks';
8+
import { useSetting } from './hooks';
119
import ColorVariations from './variations/variations-color';
1210

1311
const mobilePopoverProps = { placement: 'bottom-start' as const, offset: 8 };
@@ -48,35 +46,18 @@ export default function ColorPalettePanel( { name }: ColorPalettePanelProps ) {
4846
const isMobileViewport = useViewportMatch( 'small', '<' );
4947
const popoverProps = isMobileViewport ? mobilePopoverProps : undefined;
5048

51-
const [ randomizeThemeColors ] = useColorRandomizer( name );
52-
5349
return (
5450
<VStack className="global-styles-ui-color-palette-panel" spacing={ 8 }>
55-
{ /* Both children need theme colors, so without them the wrapper
56-
renders empty and still takes a slot in the parent's gap. */ }
5751
{ !! themeColors?.length && (
58-
<VStack spacing={ 4 }>
59-
<PaletteEdit
60-
canReset={ themeColors !== baseThemeColors }
61-
canOnlyChangeValues
62-
colors={ themeColors }
63-
onChange={ setThemeColors }
64-
paletteLabel={ __( 'Theme' ) }
65-
paletteLabelHeadingLevel={ 3 }
66-
popoverProps={ popoverProps }
67-
/>
68-
{ ( window as any ).__experimentalEnableColorRandomizer &&
69-
randomizeThemeColors && (
70-
<Button
71-
__next40pxDefaultSize
72-
variant="secondary"
73-
icon={ shuffle }
74-
onClick={ randomizeThemeColors }
75-
>
76-
{ __( 'Randomize colors' ) }
77-
</Button>
78-
) }
79-
</VStack>
52+
<PaletteEdit
53+
canReset={ themeColors !== baseThemeColors }
54+
canOnlyChangeValues
55+
colors={ themeColors }
56+
onChange={ setThemeColors }
57+
paletteLabel={ __( 'Theme' ) }
58+
paletteLabelHeadingLevel={ 3 }
59+
popoverProps={ popoverProps }
60+
/>
8061
) }
8162
{ !! defaultColors &&
8263
!! defaultColors.length &&

‎packages/global-styles-ui/src/hooks.ts‎

Lines changed: 0 additions & 45 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,3 @@
1-
import { colord, extend } from 'colord';
2-
import a11yPlugin from 'colord/plugins/a11y';
31
import { useCallback, useContext, useMemo } from '@wordpress/element';
42
import { useSelect } from '@wordpress/data';
53
import { store as coreStore } from '@wordpress/core-data';
@@ -15,14 +13,10 @@ import {
1513
import type {
1614
GlobalStylesConfig,
1715
StyleVariation,
18-
Color,
1916
} from '@wordpress/global-styles-engine';
2017
import { GlobalStylesContext } from './context';
2118
import { removePropertiesFromObject, isVariationWithProperties } from './utils';
2219

23-
// Enable colord's a11y plugin.
24-
extend( [ a11yPlugin ] );
25-
2620
/**
2721
* Hook to get and set style values with memoization.
2822
*
@@ -251,45 +245,6 @@ export function useColorVariations(): StyleVariation[] {
251245
);
252246
}
253247

254-
/**
255-
* Hook to randomize theme colors using color rotation.
256-
*
257-
* @param blockName The name of the block, if applicable.
258-
* @return Array containing the randomize function if feature is enabled, empty array otherwise.
259-
*/
260-
export function useColorRandomizer( blockName?: string ): [ () => void ] | [] {
261-
const [ themeColors, setThemeColors ] = useSetting< Color[] >(
262-
'color.palette.theme',
263-
blockName
264-
);
265-
266-
const randomizeColors = useCallback( () => {
267-
if ( ! themeColors || ! themeColors.length ) {
268-
return;
269-
}
270-
271-
const randomRotationValue = Math.floor( Math.random() * 225 );
272-
273-
const newColors = themeColors.map( ( colorObject ) => {
274-
const { color } = colorObject;
275-
const newColor = colord( color )
276-
.rotate( randomRotationValue )
277-
.toHex();
278-
279-
return {
280-
...colorObject,
281-
color: newColor,
282-
};
283-
} );
284-
285-
setThemeColors( newColors );
286-
}, [ themeColors, setThemeColors ] );
287-
288-
return ( window as any ).__experimentalEnableColorRandomizer
289-
? [ randomizeColors ]
290-
: [];
291-
}
292-
293248
/**
294249
* Resolves `ref` pointers and theme-relative (`file:./…`) URLs in a style
295250
* object's `background` sub-tree, for display. The Global Styles screens

0 commit comments

Comments
 (0)