apphouse

import { ThemeColors } from '../../styles/defaults/themes.interface'; import { Color } from '../Color'; import { Palette } from '../Palette'; import { ApphouseRGBColorFormat } from '../../utils/color/names'; import { ColorDefinition, HslaColor, RgbaColor } from './color.interface'; import { PaletteType } from '../palette.interface'; export declare const WHITE = "rgba(255,255,255,1)"; export declare const BLACK = "rgba(0,0,0,1)"; export declare const WHITE_ = "rgba(255, 255, 255, 1)"; export declare const BLACK_ = "rgba(0, 0, 0, 1)"; export declare function rgba2hex(color: string): string; export declare const ensureHexColor: (color: string) => string | undefined; export declare const fromHexStringToRgbaObject: (color: string) => RgbaColor | undefined; export declare const fromColorStringToRgbaObject: (color: string) => RgbaColor | undefined; export declare const fromColorToRgbaString: (color: Color) => string | undefined; /** * Convert palette into consumable objects with simple key value pairs * with only the rgba string * @param palette * @returns */ export declare const objectifyPaletteColorsFlat: (palette: Palette) => Record<string, string>; export declare const toColorsObjectFlat: (palettes: Record<string, Palette>) => Record<string, Record<string, string>>; export declare const toColorsObjectFull: (palettes: Record<string, Palette>) => Record<string, PaletteType>; export declare const toApphouseColors: (palette: Palette) => ThemeColors; export declare function getOpacity(str: string): number; export declare const getColorFromColorString: (color: string, key: string) => Color | undefined; export declare function ensureFullHex(hex: string): string | undefined; /** * * @param rgbaString in the format 'rgba(r,g,b,a)' * @returns */ export declare function rbgaStringToHex(rgbaString: string): string | undefined; export declare const hslStringToRgba: (hsl: string) => string | undefined; export declare const hslToRgba: (hsl: HslaColor) => RgbaColor; export declare const getNameForColor: (color: string) => string; export declare const getColorId: (color: string) => string; export declare const sortColorsByRgb: (sortBy: 'r' | 'g' | 'b', colors: ApphouseRGBColorFormat[]) => ApphouseRGBColorFormat[]; export declare function moveCursorToEndAndFocus(inputId: string): void; export default class ColorUtils { /** * Get the complementary color for a given color * A complementary color is a direct opposite of a color on the color wheel * @param color a color in string format * @returns the complementary color in #hex format */ static getComplementaryColor: (color: string) => string; /** * Get the a significantly lighter/darker shade of a color * @param color a color in string format * @returns */ static getInverseColor: (color: string) => string; /** * A function to that creates shaded or tinted colors * based on a single color. The way it decides on tinted vs * shaded is based how close the surface color is to "white" or * "black". If it is closer to "white", it creates shades and if its * closer to "black" it creates tints * @param variants number of variants to create * @param color a color used for a background * @returns an array of colors */ static getSurfaceColors: (variants: number, color: string) => string[]; /** * Pair background colors with their respective foreground colors * @param colors a list of colors to be paired * @returns a list of matching colors, Color[][] where the first color * in the pair is the background and the second color is the foreground */ static getPairedColors: (colors: Color[]) => Color[][]; /** * Get onColors based on a list of colors * @param colors a list of colors to extract the onColors from * @returns a hashed object containing a list of colors with the key being the color the onColor would pair with */ static getOnColors: (colors: Color[]) => { [wantsToMatchWith: string]: Color[]; }; /** * Convert rgba string to rgba object * @param color color in rgba() string format * @returns Rgba Object */ static toRgbaObjectFromRgbaString: (color: string) => RgbaColor | undefined; /** * Helper function to transform a hex color into RGB numbers into a comma * separated string. Example: #FFFFFF will return '255,255,255' * @param hex color string in hex * @returns string in the format 'number, number, number' */ static toRgbValues: (hex: string) => string; /** * Convert hex color to Rgba string * @param hex hex color * @returns rgba string color */ static toRgbaStringFromHex: (hex: string) => string; /** * Get white or black foreground color based on a background color. * (it not always works when the color has opacity < 1) * @param backgroundColor the background color you want the foreground color for * @returns the foreground color with enough contrast from the original color * it will be either white or black */ static getColorForeground: (backgroundColor?: string) => string; /** * Convert a color name from theme.dark.colorname to color name * Strips out the "colorname" from theme.dark.colorname * @param colorNameToken a string in the format of theme.colorname or theme.dark.colorname * @returns the last part of the string after the last dot */ static getColorTitleFromTokenString: (colorNameToken: string) => string; /** * Converts an RGBA oject to a rgba string * @param rgba RgbaColor * @returns string rgba color in the format rgba(r, g, b, a) */ static toRgbaStringFromRgbaObject: (rgba?: RgbaColor) => string | undefined; /** * Convert string color to rgba object * @param color color string to be converted, it can be a hex or rgba color * @returns */ static toRgbaObjectFromColorString: (color: string) => RgbaColor | undefined; static toHslaObjectFromHslaString: (hsla: string) => { h: number; s: number; l: number; a: number; }; static toRgbaObjectFromHslaString: (hsla: string) => RgbaColor | undefined; static toHslaObjectFromHex: (hex: string) => HslaColor; static toHslaFromColorString: (colorStr: string) => HslaColor; static toColorDefinitionFromColorString: (colorStr: string) => ColorDefinition; static toHexFromColorString: (color: string) => string | undefined; static toHexFromRgbaObject: (rgbaObject: RgbaColor) => string; /** * Get color shades from a color * A shade is produced by "darkening" a hue or "adding black" * @param color the hex or rgb string color you want shades from * @param variations the number of shades * @param multiplier how close together you want the color shades to be (the lower the number the closer) * @returns an array of color strings with shaded variations of the original color */ static getColorShades: (color: string, variations: number, multiplier?: number) => string[]; /** * Get color tints from a color * A tint is produced by "lightening" a hue or "adding white" * @param color the hex or rgb string color you want shades from * @param variations the number of shades * @param multiplier how close together you want the color tints to be (the lower the number the closer) * @returns an array of color strings with shaded variations of the original color */ static getColorTints: (color: string, variations: number, multiplier?: number) => string[]; /** * Calculate contrast ratio number for colors * @param colors Array of 2 colors, the first color being the background and second the foreground * @returns the contrast ratio number */ static getContrastRatioForColors: (colors: Color[]) => number | undefined; /** * Function to calculate the contrast ratio between two colors. * @param lightestColor * @param darkestColor * @returns */ static getContrastRatio: (lightestColor: string, darkestColor: string) => number | undefined; /** * Calculate brightness value by RGB or HEX color. * @param color (String) The color value in RGB or HEX (for example: #000000 || #000 || rgb(0,0,0) || rgba(0,0,0,0)) * @returns (Number) The brightness value (dark) 0 ... 255 (light) */ static getLuminance: (color: string) => number | undefined; /** * * @param c a number from 0 to 255 * @returns srgb equivalent */ static getsRGB: (c: number) => number; static getMatchingColorPair: (color: Color, paletteColors: Color[]) => Color[]; }