Skip to content

Commit

Permalink
Refactor
Browse files Browse the repository at this point in the history
  • Loading branch information
dmt0 committed Mar 1, 2023
1 parent ebdadaa commit 1c9e21a
Show file tree
Hide file tree
Showing 2 changed files with 16 additions and 105 deletions.
107 changes: 2 additions & 105 deletions src/components/widgets/ColorPicker.js
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@ import tinycolor from 'tinycolor2';
import {CustomPicker as customPicker, CompactPicker} from 'react-color';
import Fields from 'react-color/lib/components/sketch/SketchFields';
import {Hue, Saturation} from 'react-color/lib/components/common';
import {COLOR_PICKER_SWATCH} from 'lib/constants';

// Utility functions for converting ColorPicker color objects or raw strings into TinyColor objects.
const extractRGB = (c) => c.rgb || c;
Expand All @@ -26,111 +27,7 @@ const Custom = (props) => (
<Fields {...props} onChange={props.onChangeComplete} />
</div>
<div className="colorpicker__swatches">
<CompactPicker
{...props}
colors={[
'#b71c1c',
'#d32f2f',
'#f44336',
'#e57373',
'#ffcdd2',
'#33691e',
'#689f38',
'#8bc34a',
'#aed581',
'#dcedc8',
'#880e4f',
'#c2185b',
'#e91e63',
'#f06292',
'#f8bbd0',
'#827717',
'#afb42b',
'#cddc39',
'#dce775',
'#f0f4c3',
'#4a148c',
'#7b1fa2',
'#9c27b0',
'#ba68c8',
'#e1bee7',
'#f57f17',
'#fbc02d',
'#ffeb3b',
'#fff176',
'#fff9c4',
'#311b92',
'#512da8',
'#673ab7',
'#9575cd',
'#d1c4e9',
'#ff6f00',
'#ffa000',
'#ffc107',
'#ffd54f',
'#ffecb3',
'#1a237e',
'#303f9f',
'#3f51b5',
'#7986cb',
'#c5cae9',
'#e65100',
'#f57c00',
'#ff9800',
'#ffb74d',
'#ffe0b2',
'#0d47a1',
'#1976d2',
'#2196f3',
'#64b5f6',
'#bbdefb',
'#bf360c',
'#e64a19',
'#ff5722',
'#ff8a65',
'#ffccbc',
'#01579b',
'#0288d1',
'#03a9f4',
'#4fc3f7',
'#b3e5fc',
'#3e2723',
'#5d4037',
'#795548',
'#a1887f',
'#d7ccc8',
'#006064',
'#0097a7',
'#00bcd4',
'#4dd0e1',
'#b2ebf2',
'#263238',
'#455a64',
'#607d8b',
'#90a4ae',
'#cfd8dc',
'#004d40',
'#00796b',
'#009688',
'#4db6ac',
'#b2dfdb',
'#000000',
'#1a1a1a',
'#333333',
'#4d4d4d',
'#666666',
'#194D33',
'#388e3c',
'#4caf50',
'#81c784',
'#c8e6c9',
'#7f7f7f',
'#999999',
'#b2b2b2',
'#cccccc',
'#ffffff',
]}
/>
<CompactPicker {...props} colors={COLOR_PICKER_SWATCH} />
</div>
</div>
);
Expand Down
14 changes: 14 additions & 0 deletions src/lib/constants.js
Original file line number Diff line number Diff line change
Expand Up @@ -143,4 +143,18 @@ export const COLORS = {
black: '#000000',
};

// prettier-ignore
export const COLOR_PICKER_SWATCH = [
'#b71c1c','#d32f2f','#f44336','#e57373','#ffcdd2','#33691e','#689f38','#8bc34a','#aed581','#dcedc8',
'#880e4f','#c2185b','#e91e63','#f06292','#f8bbd0','#827717','#afb42b','#cddc39','#dce775','#f0f4c3',
'#4a148c','#7b1fa2','#9c27b0','#ba68c8','#e1bee7','#f57f17','#fbc02d','#ffeb3b','#fff176','#fff9c4',
'#311b92','#512da8','#673ab7','#9575cd','#d1c4e9','#ff6f00','#ffa000','#ffc107','#ffd54f','#ffecb3',
'#1a237e','#303f9f','#3f51b5','#7986cb','#c5cae9','#e65100','#f57c00','#ff9800','#ffb74d','#ffe0b2',
'#0d47a1','#1976d2','#2196f3','#64b5f6','#bbdefb','#bf360c','#e64a19','#ff5722','#ff8a65','#ffccbc',
'#01579b','#0288d1','#03a9f4','#4fc3f7','#b3e5fc','#3e2723','#5d4037','#795548','#a1887f','#d7ccc8',
'#006064','#0097a7','#00bcd4','#4dd0e1','#b2ebf2','#263238','#455a64','#607d8b','#90a4ae','#cfd8dc',
'#004d40','#00796b','#009688','#4db6ac','#b2dfdb','#000000','#1a1a1a','#333333','#4d4d4d','#666666',
'#194D33','#388e3c','#4caf50','#81c784','#c8e6c9','#7f7f7f','#999999','#b2b2b2','#cccccc','#ffffff',
];

export const DEFAULT_COLORS = Object.values(COLORS);

0 comments on commit 1c9e21a

Please sign in to comment.