@kadconsulting/dry/dist/src/internal/constants/color.js

KAD Reusable Component Library

import { SemanticColorsEnum, SecondaryColorsEnum } from '../../types';
// TODO-p4: we could probably update all of these const to map over the values of New Enum like we're doing with the two below to create less inconsistency
export const SEMANTIC_COLORS = Object.values(SemanticColorsEnum);
export const SECONDARY_COLORS = Object.values(SecondaryColorsEnum);
export const SECONDARY_CONTRAST_COLORS = [
    'gray', // Untitled UI primary gray,
    'grayBlueContrast',
    'grayCoolContrast',
    'grayModernContrast',
    'grayNeutralContrast',
    'grayIronContrast',
    'grayTrueContrast',
    'grayWarmContrast',
    'mossContrast',
    'greenLightContrast',
    'greenContrast',
    'tealContrast',
    'cyanContrast',
    'blueLightContrast',
    'blueContrast',
    'blueDarkContrast',
    'indigoContrast',
    'violetContrast',
    'purpleContrast',
    'fuchsiaContrast',
    'pinkContrast',
    'roseContrast',
    'orangeDarkContrast',
    'orangeContrast',
    'yellowContrast',
];
export const BACKGROUND_COLORS = [
    'background',
    'backgroundContrast',
    'backgroundContrast_hue',
];
export const SURFACE_BACKGROUND_COLORS = [
    'surfaceBackground',
    'surfaceBackgroundContrast',
    'surfaceBackgroundContrast_hue',
];
export const SURFACE_ON_PRIMARY_BACKGROUND_COLORS = [
    'surfaceOnPrimaryBackground',
    'surfaceOnPrimaryBackgroundContrast',
    'surfaceOnPrimaryBackgroundContrast_hue',
];
export const SURFACE_ON_PRIMARY_DULL_BACKGROUND_COLORS = [
    'surfaceOnPrimaryDullBackground',
    'surfaceOnPrimaryDullBackgroundContrast',
    'surfaceOnPrimaryDullBackgroundContrast_hue',
];
export const SURFACE_ON_PRIMARY_DISTINCT_BACKGROUND_COLORS = [
    'surfaceOnPrimaryDistinctBackground',
    'surfaceOnPrimaryDistinctBackgroundContrast',
    'surfaceOnPrimaryDistinctBackgroundContrast_hue',
];
export const GRAY_COLOR_STEPS = [
    'gray-25',
    'gray-50',
    'gray-100',
    'gray-200',
    'gray-300',
    'gray-400',
    'gray-500',
    'gray-600',
    'gray-700',
    'gray-800',
    'gray-900',
    'gray-25-contrast',
    'gray-50-contrast',
    'gray-100-contrast',
    'gray-200-contrast',
    'gray-300-contrast',
    'gray-400-contrast',
    'gray-500-contrast',
    'gray-600-contrast',
    'gray-700-contrast',
    'gray-800-contrast',
    'gray-900-contrast',
];
export const PRIMARY_COLOR_STEPS = [
    'primary-25',
    'primary-50',
    'primary-100',
    'primary-200',
    'primary-300',
    'primary-400',
    'primary-500',
    'primary-600',
    'primary-700',
    'primary-800',
    'primary-900',
    'primary-25-contrast',
    'primary-50-contrast',
    'primary-100-contrast',
    'primary-200-contrast',
    'primary-300-contrast',
    'primary-400-contrast',
    'primary-500-contrast',
    'primary-600-contrast',
    'primary-700-contrast',
    'primary-800-contrast',
    'primary-900-contrast',
];
export const ERROR_COLOR_STEPS = [
    'error-25',
    'error-50',
    'error-100',
    'error-200',
    'error-300',
    'error-400',
    'error-500',
    'error-600',
    'error-700',
    'error-800',
    'error-900',
    'error-25-contrast',
    'error-50-contrast',
    'error-100-contrast',
    'error-200-contrast',
    'error-300-contrast',
    'error-400-contrast',
    'error-500-contrast',
    'error-600-contrast',
    'error-700-contrast',
    'error-800-contrast',
    'error-900-contrast',
];
export const WARNING_COLOR_STEPS = [
    'warning-25',
    'warning-50',
    'warning-100',
    'warning-200',
    'warning-300',
    'warning-400',
    'warning-500',
    'warning-600',
    'warning-700',
    'warning-800',
    'warning-900',
    'warning-25-contrast',
    'warning-50-contrast',
    'warning-100-contrast',
    'warning-200-contrast',
    'warning-300-contrast',
    'warning-400-contrast',
    'warning-500-contrast',
    'warning-600-contrast',
    'warning-700-contrast',
    'warning-800-contrast',
    'warning-900-contrast',
];
export const SUCCESS_COLOR_STEPS = [
    'success-25',
    'success-50',
    'success-100',
    'success-200',
    'success-300',
    'success-400',
    'success-500',
    'success-600',
    'success-700',
    'success-800',
    'success-900',
    'success-25-contrast',
    'success-50-contrast',
    'success-100-contrast',
    'success-200-contrast',
    'success-300-contrast',
    'success-400-contrast',
    'success-500-contrast',
    'success-600-contrast',
    'success-700-contrast',
    'success-800-contrast',
    'success-900-contrast',
];
export const ALL_COLORS = [
    'transparent',
    ...SEMANTIC_COLORS,
    ...SECONDARY_COLORS,
    ...SECONDARY_CONTRAST_COLORS,
    ...SURFACE_BACKGROUND_COLORS,
    ...SURFACE_ON_PRIMARY_BACKGROUND_COLORS,
    ...SURFACE_ON_PRIMARY_DULL_BACKGROUND_COLORS,
    ...SURFACE_ON_PRIMARY_DISTINCT_BACKGROUND_COLORS,
    ...GRAY_COLOR_STEPS,
    ...PRIMARY_COLOR_STEPS,
    ...ERROR_COLOR_STEPS,
    ...WARNING_COLOR_STEPS,
    ...SUCCESS_COLOR_STEPS,
];
//# sourceMappingURL=color.js.map