@flexnative/theme-context/dist/colors-utilities.js

React ThemeContext

import * as Color from "color-bits";
const LIGHT_HOVER_OPACITY = 0.075;
const LIGHT_ACTIVE_OPACITY = 0.15;
const DARK_HOVER_OPACITY = 0.03;
const DARK_ACTIVE_OPACITY = 0.075;
const SUBTLE_OPACITY = 0.9;
const SUBTLE_HOVER_OPACITY = 0.8;
const SUBTLE_ACTIVE_OPACITY = 0.77;
/**
 * Generates a hover color based on the color scheme.
 * For dark mode, it lightens the color. For light mode, it darkens the color.
 *
 * @param baseColor - The starting color string.
 * @param modification - The current color scheme ('light', 'dark', or null).
 * @returns The modified hover color string.
 */
export const applyHoverColor = (baseColor, modification) => {
    const parsedColor = Color.parse(baseColor);
    const modifiedColor = modification === "dark"
        ? Color.lighten(parsedColor, LIGHT_HOVER_OPACITY)
        : Color.darken(parsedColor, DARK_HOVER_OPACITY);
    return Color.format(modifiedColor);
};
/**
 * Generates an active (pressed) color based on the color scheme.
 * For dark mode, it lightens the color. For light mode, it darkens the color.
 *
 * @param baseColor - The starting color string or ColorValue.
 * @param modification - The current color scheme ('light', 'dark', or null).
 * @returns The modified active color string.
 */
export const applyActiveColor = (baseColor, modification) => {
    const parsedColor = Color.parse(baseColor);
    const modifiedColor = modification === "dark"
        ? Color.lighten(parsedColor, LIGHT_ACTIVE_OPACITY)
        : Color.darken(parsedColor, DARK_ACTIVE_OPACITY);
    return Color.format(modifiedColor);
};
/**
 * Generates a subtle color by lightening the base color.
 *
 * @param baseColor - The starting color string.
 * @returns The lightened subtle color.
 */
export const subtleColor = (baseColor) => Color.format(Color.lighten(Color.parse(baseColor), SUBTLE_OPACITY));
/**
 * Generates a subtle hover color by lightening the base color.
 *
 * @param baseColor - The starting color string.
 * @returns The lightened subtle hover color.
 */
export const subtleHoverColor = (baseColor) => Color.format(Color.lighten(Color.parse(baseColor), SUBTLE_HOVER_OPACITY));
/**
 * Generates a subtle active (pressed) color by lightening the base color.
 *
 * @param baseColor - The starting color string.
 * @returns The lightened subtle active color.
 */
export const subtleActiveColor = (baseColor) => Color.format(Color.lighten(Color.parse(baseColor), SUBTLE_ACTIVE_OPACITY));
//# sourceMappingURL=colors-utilities.js.map