From f34fb60230510e1bf53c23c271209ce30fcaed75 Mon Sep 17 00:00:00 2001 From: case Date: Mon, 29 Apr 2019 16:24:34 -0700 Subject: [PATCH] Export Helpers (#613) --- src/helpers/color.js | 108 +++++++++++++++++++++---------------------- src/helpers/index.js | 2 + 2 files changed, 56 insertions(+), 54 deletions(-) create mode 100644 src/helpers/index.js diff --git a/src/helpers/color.js b/src/helpers/color.js index bc20465e..9420fc7d 100644 --- a/src/helpers/color.js +++ b/src/helpers/color.js @@ -1,67 +1,65 @@ import each from 'lodash/each' import tinycolor from 'tinycolor2' -export default { - simpleCheckForValidColor(data) { - const keysToCheck = ['r', 'g', 'b', 'a', 'h', 's', 'l', 'v'] - let checked = 0 - let passed = 0 - each(keysToCheck, (letter) => { - if (data[letter]) { - checked += 1 - if (!isNaN(data[letter])) { +export const simpleCheckForValidColor = (data) => { + const keysToCheck = ['r', 'g', 'b', 'a', 'h', 's', 'l', 'v'] + let checked = 0 + let passed = 0 + each(keysToCheck, (letter) => { + if (data[letter]) { + checked += 1 + if (!isNaN(data[letter])) { + passed += 1 + } + if (letter === 's' || letter === 'l') { + const percentPatt = /^\d+%$/ + if (percentPatt.test(data[letter])) { passed += 1 } - if (letter === 's' || letter === 'l') { - const percentPatt = /^\d+%$/ - if (percentPatt.test(data[letter])) { - passed += 1 - } - } } - }) - return (checked === passed) ? data : false - }, - - toState(data, oldHue) { - const color = data.hex ? tinycolor(data.hex) : tinycolor(data) - const hsl = color.toHsl() - const hsv = color.toHsv() - const rgb = color.toRgb() - const hex = color.toHex() - if (hsl.s === 0) { - hsl.h = oldHue || 0 - hsv.h = oldHue || 0 } - const transparent = hex === '000000' && rgb.a === 0 + }) + return (checked === passed) ? data : false +} - return { - hsl, - hex: transparent ? 'transparent' : `#${ hex }`, - rgb, - hsv, - oldHue: data.h || oldHue || hsl.h, - source: data.source, - } - }, +export const toState = (data, oldHue) => { + const color = data.hex ? tinycolor(data.hex) : tinycolor(data) + const hsl = color.toHsl() + const hsv = color.toHsv() + const rgb = color.toRgb() + const hex = color.toHex() + if (hsl.s === 0) { + hsl.h = oldHue || 0 + hsv.h = oldHue || 0 + } + const transparent = hex === '000000' && rgb.a === 0 - isValidHex(hex) { - // disable hex4 and hex8 - const lh = (String(hex).charAt(0) === '#') ? 1 : 0 - return hex.length !== (4 + lh) && hex.length < (7 + lh) && tinycolor(hex).isValid() - }, + return { + hsl, + hex: transparent ? 'transparent' : `#${ hex }`, + rgb, + hsv, + oldHue: data.h || oldHue || hsl.h, + source: data.source, + } +} - getContrastingColor(data) { - if (!data) { - return '#fff' - } - const col = this.toState(data) - if (col.hex === 'transparent') { - return 'rgba(0,0,0,0.4)' - } - const yiq = ((col.rgb.r * 299) + (col.rgb.g * 587) + (col.rgb.b * 114)) / 1000 - return (yiq >= 128) ? '#000' : '#fff' - }, +export const isValidHex = (hex) => { + // disable hex4 and hex8 + const lh = (String(hex).charAt(0) === '#') ? 1 : 0 + return hex.length !== (4 + lh) && hex.length < (7 + lh) && tinycolor(hex).isValid() +} + +export const getContrastingColor = (data) => { + if (!data) { + return '#fff' + } + const col = toState(data) + if (col.hex === 'transparent') { + return 'rgba(0,0,0,0.4)' + } + const yiq = ((col.rgb.r * 299) + (col.rgb.g * 587) + (col.rgb.b * 114)) / 1000 + return (yiq >= 128) ? '#000' : '#fff' } export const red = { @@ -70,3 +68,5 @@ export const red = { rgb: { r: 255, g: 0, b: 0, a: 1 }, hsv: { h: 0, s: 1, v: 1, a: 1 }, } + +export default exports diff --git a/src/helpers/index.js b/src/helpers/index.js new file mode 100644 index 00000000..cd34e534 --- /dev/null +++ b/src/helpers/index.js @@ -0,0 +1,2 @@ +export * from './checkboard' +export * from './color'