/** * Converts the provided hex to a rgba value * @param {string} hex to set. * @param {number} opacity to use * @returns {string} converted rgba */ export declare function hexToRgba(hex: string, opacity?: number): string; /** * Converts the provided rgba to a hex value * @param {string} rgba to set * @param {boolean} forceRemoveAlpha remove alpha * @returns {string} converted hex */ export declare function rgbaToHex(rgba: string, forceRemoveAlpha?: boolean): string; /** * Picks a light or dark color based on a background * @param {string} bgColor The hex background color * @param {string} lightColor The hex light color * @param {string} darkColor The hex dark color * @returns {string} the contrasting color */ export declare function contrastColor(bgColor: string, lightColor: string, darkColor: string): string; /** * Converts the provided "built in" human-readable color to an RGB(A?) value * @private * @param {string} colorName any valid CSS color value, including "built-in". * @param {number} [opacity] optional opacity value. If included, causes the return value to be RGBA. * If omitted, causes the return value to be RGB. * @returns {string} converted rgb(a) */ export declare function builtinToRgba(colorName: string, opacity?: number): string; /** * Converts any valid CSS color into an RGB(A?) value * @param {string} colorName any valid CSS color * @param {number} opacity optional opacity value. If included, causes the return value to be RGBA. * If omitted, causes the return value to be RGB. * @returns {string} RGB(A?) value of the original color */ export declare function colorNameToRgba(colorName: string, opacity?: number): string; /** * Shade a color up or down given a hex color * @param {string} hexColor hex color to use * @param {number} magnitude the percent as a number or negative * @returns {string} the new hex */ export declare function adjustColor(hexColor: string, magnitude: number): string; /** * Converts a "status" keyword provided to a color attribute into its corresponding * IDS theme color CSS variable. * @param {string} statusName the status keyword provided * @returns {string} containing the CSS variable name, or the original status if it cannot be corrected */ export declare function statusToIDSColor(statusName: string): string; export type IdsColorValueHex = `#${string}`; export type IdsColorValueEmpty = null | '' | undefined; export type IdsColorValueStatus = 'error' | 'warning' | 'caution' | 'info' | 'success' | 'neutral'; export type IdsColorValueCategories = 'red' | 'yellow' | 'orange' | 'green' | 'blue' | 'teal' | 'purple' | 'neutral' | 'grey' | 'white' | 'black'; export type IdsColorValueNames = `red-${IdsColorValueNumbers}` | `yellow-${IdsColorValueNumbers}` | `orange-${IdsColorValueNumbers}` | `green-${IdsColorValueNumbers}` | `blue-${IdsColorValueNumbers}` | `teal-${IdsColorValueNumbers}` | `purple-${IdsColorValueNumbers}` | `neutral-${IdsColorValueNumbers}`; export type IdsColorValueNumbers = '10' | '20' | '30' | '40' | '50' | '60' | '70' | '80' | '90' | '100'; export type IdsColorValue = IdsColorValueHex | IdsColorValueEmpty | IdsColorValueStatus | IdsColorValueNames; /** * Helps ensure color settings all use the same colors, adds a type and keeps them consistent * @param {IdsColorValue} color the status keyword provided * @param {HTMLElement} elem the element that needs setting on * @param {string} cssVar the status keyword provided */ export declare function applyColorValue(color: IdsColorValue, elem: HTMLElement, cssVar?: string): void; /** * Helps ensure text color settings use consistent IDS design tokens and color values // eslint-disable-next-line max-len * @param {IdsColorValue | IdsColorValueCategories | string} value Use design tokens (e.g. 'blue-60', 'error'), status colors, or hex codes (e.g. '#FF0000') * @param {HTMLElement} elem The element to apply the text color to */ export declare function applyTextColorValue(value: IdsColorValue | IdsColorValueCategories | string, elem: HTMLElement): void; /** * Checks if a given color string is a valid IDS color token * @param {string} color The color string to validate * @returns {boolean} True if the color is a valid color token, otherwise false */ export declare function isColorToken(color: string): boolean; /** * Checks if a given color string is a valid hex color * @param {string} color The color string to validate * @returns {boolean} True if the color is a valid hex color, otherwise false */ export declare function isColorHex(color: string): boolean; /** * Checks if a given color is a valid CSS variable or a valid hex code. * @param {string} color The color string to validate. * @returns {boolean} True if valid, otherwise false. */ export declare function isValidColor(color: string): boolean; /** * Converts IDS color value to CSS variable or returns hex as-is * @param {IdsColorValue | IdsColorValueCategories | string} color The color value to convert * @returns {string} The converted color value as CSS variable or hex */ export declare function convertColorValue(color: IdsColorValue | IdsColorValueCategories | string): string;