# FloColorPicker

Flo Color Picker is a component to choose color from theme style kit or custom color

## Usage

``` declare variable in php
'color' => array(
    'type'    => 'object',
    'default' => array(
            'custom' => '',
            'theme' => ''
    ),
),

```jsx edit
import { FloColorPicker } from "components"

<FloColorPicker  
        title = {__( 'Color' )}
        value = { color }
        onChange = { ( value ) => setAttributes( { color: value } ) }
/>

```jsx view
import { getColorByValue } from 'components/color-picker/utils';

const style = {
    '--color': getColorByValue(color), 
}


``` in php view

--color-overlay: <?php echo Flo_Guten_Blocks_Helper::get_style_color( $color)?>; 

```

## Props

### `title`

-   Type: `Text`
-   Required: Yes

Title of component

### `value`

-   Type: `Object`
-   Required: Yes

Color. Should be an object containing `custom` and `theme` params.

### `onChange`

-   Type: `Function`
-   Required: Yes

Callback which is called when the color changes.