react-native-uikit-colors/dist/colors-Bj0EF6KW.mjs

react native ui kit colors

import { useColorScheme, vars } from "nativewind";
import { useMemo } from "react";
import { Appearance, StyleSheet } from "react-native";
import { darkElements, darkPalette, lightElements, lightPalette } from "apple-uikit-colors";

//#region src/utils.ts
const getCurrentColors = () => {
	const colorScheme = Appearance.getColorScheme() || "light";
	return StyleSheet.compose(colorVariants[colorScheme], palette[colorScheme]);
};
const getSystemBackgroundColor = () => {
	return getColor("systemBackground");
};
const mergedColorsLight = {
	...lightElements,
	...lightPalette
};
const mergedColorsDark = {
	...darkElements,
	...darkPalette
};
const getColor = (color) => {
	const colorScheme = Appearance.getColorScheme() || "light";
	const colors = colorScheme === "light" ? mergedColorsLight : mergedColorsDark;
	return rgbStringToRgb(colors[color]);
};
const rgbStringToRgb = (input) => {
	let rgbPart = input;
	let alpha = 1;
	if (input.includes("/")) {
		const [rgb, a] = input.split("/");
		rgbPart = rgb.trim();
		alpha = Number.parseFloat(a.trim());
	} else {
		const parts = input.trim().split(/\s+/);
		if (parts.length === 4) {
			alpha = Number.parseFloat(parts[3]);
			rgbPart = parts.slice(0, 3).join(" ");
		}
	}
	const [r, g, b] = rgbPart.split(/\s+/).map((s) => Number.parseFloat(s));
	return `rgba(${r}, ${g}, ${b}, ${alpha})`;
};

//#endregion
//#region src/colors.ts
const IS_DOM = typeof ReactNativeWebView !== "undefined";
const varPrefix = "--color";
const buildVars = (_vars) => {
	const cssVars = {};
	for (const [key, value] of Object.entries(_vars)) cssVars[`${varPrefix}-${key}`] = value;
	return IS_DOM ? cssVars : vars(cssVars);
};
const palette = {
	light: buildVars(lightPalette),
	dark: buildVars(darkPalette)
};
const mergedLightColors = {
	...lightElements,
	...lightPalette
};
const mergedDarkColors = {
	...darkElements,
	...darkPalette
};
const mergedColors = {
	light: mergedLightColors,
	dark: mergedDarkColors
};
const mergedColorsHex = {
	light: Object.fromEntries(Object.entries(mergedLightColors).map(([key, value]) => [key, rgbStringToRgb(value)])),
	dark: Object.fromEntries(Object.entries(mergedDarkColors).map(([key, value]) => [key, rgbStringToRgb(value)]))
};
const colorVariants = {
	light: buildVars(lightElements),
	dark: buildVars(darkElements)
};
const useColor = (color) => {
	const { colorScheme } = useColorScheme();
	const colors = mergedColorsHex[colorScheme || "light"];
	return useMemo(() => colors[color], [color, colors]);
};
const useColorsVariants = () => {
	const { colorScheme } = useColorScheme();
	return mergedColors[colorScheme || "light"];
};
const useColors = () => {
	const { colorScheme } = useColorScheme();
	return mergedColorsHex[colorScheme || "light"];
};
const useCurrentColorsVariants = () => {
	useColorScheme();
	return getCurrentColors();
};

//#endregion
export { colorVariants, getColor, getCurrentColors, getSystemBackgroundColor, palette, rgbStringToRgb, useColor, useColors, useColorsVariants, useCurrentColorsVariants };