/
with-colors.js
43 lines (40 loc) · 1.18 KB
/
with-colors.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
/**
* External dependencies
*/
import { get } from 'lodash';
/**
* WordPress dependencies
*/
import { createHigherOrderComponent } from '@wordpress/element';
/**
* Internal dependencies
*/
import { getColorValue, getColorClass, setColorValue } from './utils';
import { withEditorSettings } from '../editor-settings';
import './style.scss';
/**
* Higher-order component, which handles color logic for class generation
* color value, retrieval and color attribute setting.
*
* @param {WPElement} WrappedComponent The wrapped component.
*
* @return {Component} Component with a new colors prop.
*/
export default createHigherOrderComponent(
withEditorSettings(
( settings, props ) => {
const colors = get( settings, [ 'colors' ], [] );
return {
initializeColor: ( { colorContext, colorAttribute, customColorAttribute } ) => ( {
value: getColorValue(
colors,
props.attributes[ colorAttribute ],
props.attributes[ customColorAttribute ]
),
class: getColorClass( colorContext, props.attributes[ colorAttribute ] ),
set: setColorValue( colors, colorAttribute, customColorAttribute, props.setAttributes ),
} ),
};
} ),
'withColors'
);