-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
b4d427a
commit 54b8e08
Showing
14 changed files
with
857 additions
and
31,173 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,65 +1,73 @@ | ||
| import { BaseColors, ColorMode, RGB, RawColor } from "@/types/app"; | ||
| import tinycolor from "tinycolor2"; | ||
| import { BaseColors, ColorMode, ColorOptions, RGB, RawColor } from '@/types/app' | ||
| import tinycolor from 'tinycolor2' | ||
|
|
||
| const toHex = (color: string | RawColor): string => | ||
| tinycolor(color).toHexString(); | ||
| const toRgba = (color: string | RawColor): string => | ||
| tinycolor(color).toRgbString(); | ||
| const toHsla = (color: string | RawColor): string => | ||
| tinycolor(color).toHslString(); | ||
| const toRgb = (color: string | RawColor): RGB => tinycolor(color).toRgb(); | ||
| const toHex = (color: RawColor | string): string => tinycolor(color).toHexString() | ||
| const toRgba = (color: RawColor | string): string => tinycolor(color).toRgbString() | ||
| const toHsla = (color: RawColor | string): string => tinycolor(color).toHslString() | ||
| const toRgb = (color: RawColor | string): RGB => tinycolor(color).toRgb() | ||
|
|
||
| const toColorMode = (color: any, mode: ColorMode): string => { | ||
| if (!tinycolor(color).isValid) return "#000"; | ||
| if (!tinycolor(color).isValid) return '#000' | ||
| switch (mode) { | ||
| case ColorMode.HEX: | ||
| return toHex(color); | ||
| return toHex(color) | ||
| case ColorMode.RGB: | ||
| return toRgba(color); | ||
| return toRgba(color) | ||
| case ColorMode.HSL: | ||
| return toHsla(color); | ||
| return toHsla(color) | ||
| } | ||
| }; | ||
| } | ||
|
|
||
| /** | ||
| * Returns a color that is suitable for use as a foreground color | ||
| * @param color | ||
| */ | ||
| const toForeground = (color: string | RawColor): string => { | ||
| const hsl = tinycolor(color).toHsl(); | ||
| const { h, s, l } = hsl; | ||
| const lRounded = Math.round(l * 100); | ||
| const toForeground = (color: RawColor | string): string => { | ||
| const hsl = tinycolor(color).toHsl() | ||
| const { h, l, s } = hsl | ||
| const lRounded = Math.round(l * 100) | ||
| if (lRounded > 50) { | ||
| return tinycolor(color).darken(35).toHslString(); | ||
| return tinycolor(color).darken(35).toHslString() | ||
| } else { | ||
| return tinycolor(color).lighten(35).toHslString(); | ||
| return tinycolor(color).lighten(35).toHslString() | ||
| } | ||
| }; | ||
| } | ||
|
|
||
| const toRaw = (color: string): RawColor => { | ||
| const { h, s, l, a } = tinycolor(color).toHsl(); | ||
| return { h, s, l, a }; | ||
| }; | ||
| const { a, h, l, s } = tinycolor(color).toHsl() | ||
| return { a, h, l, s } | ||
| } | ||
|
|
||
| const colorStringToBaseColors = ( | ||
| colorString: string, | ||
| ): Omit<BaseColors, "gray"> => { | ||
| const colors = colorString.split(","); | ||
| const colorStringToBaseColors = (colorString: string): Omit<BaseColors, 'gray'> => { | ||
| const colors = colorString.split(',') | ||
| const baseColors = { | ||
| accent: colorHelper.toRaw(colors[2]), | ||
| primary: colorHelper.toRaw(colors[0]), | ||
| secondary: colorHelper.toRaw(colors[1]), | ||
| accent: colorHelper.toRaw(colors[2]), | ||
| }; | ||
| return baseColors; | ||
| }; | ||
| } | ||
| return baseColors | ||
| } | ||
|
|
||
| export const isValidBaseColorType = (color: string): boolean => ['accent', 'primary', 'secondary'].includes(color) | ||
|
|
||
| export const isValidBaseColors = (colors: ColorOptions): boolean => { | ||
| const isKeyValid = Object.keys(colors).every(isValidBaseColorType) | ||
| if (!isKeyValid) return false | ||
| return Object.values(colors).every((color) => tinycolor(color).isValid()) | ||
| } | ||
|
|
||
| export const areSearchParamColorsValid = (primary?: string, secondary?: string, accent?: string) => { | ||
| if (!primary || !secondary || !accent) return false | ||
| return tinycolor(primary).isValid() && tinycolor(secondary).isValid() && tinycolor(accent).isValid() | ||
| } | ||
|
|
||
| export const colorHelper = { | ||
| toHex, | ||
| toRgba, | ||
| toRgb, | ||
| toHsla, | ||
| colorStringToBaseColors, | ||
| toColorMode, | ||
| toForeground, | ||
| toHex, | ||
| toHsla, | ||
| toRaw, | ||
| colorStringToBaseColors, | ||
| }; | ||
| toRgb, | ||
| toRgba, | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.