vira 32.0.0-beta.0 → 32.0.0

package/dist/styles/vira-color-theme-object.d.ts

@@ -0,0 +1,65 @@
+import { type RemovePrefix, type RemoveSuffix, type UnionToTuple } from '@augment-vir/common';
+import { ContrastLevelName } from '@electrovir/color/dist/data/contrast/contrast.js';
+import { type ColorThemeColor, type themeDefaultKey } from 'theme-vir/dist/color-theme/color-theme.js';
+import { viraTheme } from './vira-color-theme.js';
+/**
+ * `ContrastLevelName` values with the values containing internal dashes to the beginning so they
+ * can be correctly used with `RemoveSuffix`.
+ *
+ * @category Internal
+ */
+export type SortedContrastLevelName = [
+    'highest-contrast',
+    'lowest-contrast',
+    ...UnionToTuple<Extract<ContrastLevelName, `${string}-${string}`>>,
+    ...UnionToTuple<Exclude<ContrastLevelName, `${string}-${string}`>>
+];
+/**
+ * The names of all colors in {@link viraTheme}.
+ *
+ * @category Internal
+ */
+export type ViraThemeColorName = Extract<keyof typeof viraTheme.colors, `vira-${string}`> extends `vira-${infer ColorPart}-${string}` ? ColorPart : never;
+/**
+ * An enum of {@link ViraThemeColorName}.
+ *
+ * @category Internal
+ */
+export declare const ViraThemeColorName: { [Key in ViraThemeColorName]: Key; };
+/**
+ * All {@link viraTheme} color pair keys.
+ *
+ * @category Internal
+ */
+export type AllViraThemeKeys = keyof typeof viraTheme.colors;
+/**
+ * All {@link viraTheme} color pair keys.
+ *
+ * @category Internal
+ */
+export declare const allViraThemeKeys: ("vira-red-foreground-highest-contrast" | "vira-red-foreground-small-body" | "vira-red-foreground-body" | "vira-red-foreground-non-body" | "vira-red-foreground-header" | "vira-red-foreground-placeholder" | "vira-red-foreground-decoration" | "vira-red-foreground-invisible" | "vira-red-foreground-lowest-contrast" | "vira-red-behind-bg-highest-contrast" | "vira-red-behind-bg-small-body" | "vira-red-behind-bg-body" | "vira-red-behind-bg-non-body" | "vira-red-behind-bg-header" | "vira-red-behind-bg-placeholder" | "vira-red-behind-bg-decoration" | "vira-red-behind-bg-invisible" | "vira-red-behind-bg-lowest-contrast" | "vira-red-behind-fg-highest-contrast" | "vira-red-behind-fg-small-body" | "vira-red-behind-fg-body" | "vira-red-behind-fg-non-body" | "vira-red-behind-fg-header" | "vira-red-behind-fg-placeholder" | "vira-red-behind-fg-decoration" | "vira-red-behind-fg-invisible" | "vira-red-behind-fg-lowest-contrast" | "vira-red-on-self-highest-contrast" | "vira-red-on-self-small-body" | "vira-red-on-self-body" | "vira-red-on-self-non-body" | "vira-red-on-self-header" | "vira-red-on-self-placeholder" | "vira-red-on-self-decoration" | "vira-red-on-self-invisible" | "vira-red-on-self-lowest-contrast" | "vira-yellow-foreground-highest-contrast" | "vira-yellow-foreground-small-body" | "vira-yellow-foreground-body" | "vira-yellow-foreground-non-body" | "vira-yellow-foreground-header" | "vira-yellow-foreground-placeholder" | "vira-yellow-foreground-decoration" | "vira-yellow-foreground-invisible" | "vira-yellow-foreground-lowest-contrast" | "vira-yellow-behind-bg-highest-contrast" | "vira-yellow-behind-bg-small-body" | "vira-yellow-behind-bg-body" | "vira-yellow-behind-bg-non-body" | "vira-yellow-behind-bg-header" | "vira-yellow-behind-bg-placeholder" | "vira-yellow-behind-bg-decoration" | "vira-yellow-behind-bg-invisible" | "vira-yellow-behind-bg-lowest-contrast" | "vira-yellow-behind-fg-highest-contrast" | "vira-yellow-behind-fg-small-body" | "vira-yellow-behind-fg-body" | "vira-yellow-behind-fg-non-body" | "vira-yellow-behind-fg-header" | "vira-yellow-behind-fg-placeholder" | "vira-yellow-behind-fg-decoration" | "vira-yellow-behind-fg-invisible" | "vira-yellow-behind-fg-lowest-contrast" | "vira-yellow-on-self-highest-contrast" | "vira-yellow-on-self-small-body" | "vira-yellow-on-self-body" | "vira-yellow-on-self-non-body" | "vira-yellow-on-self-header" | "vira-yellow-on-self-placeholder" | "vira-yellow-on-self-decoration" | "vira-yellow-on-self-invisible" | "vira-yellow-on-self-lowest-contrast" | "vira-green-foreground-highest-contrast" | "vira-green-foreground-small-body" | "vira-green-foreground-body" | "vira-green-foreground-non-body" | "vira-green-foreground-header" | "vira-green-foreground-placeholder" | "vira-green-foreground-decoration" | "vira-green-foreground-invisible" | "vira-green-foreground-lowest-contrast" | "vira-green-behind-bg-highest-contrast" | "vira-green-behind-bg-small-body" | "vira-green-behind-bg-body" | "vira-green-behind-bg-non-body" | "vira-green-behind-bg-header" | "vira-green-behind-bg-placeholder" | "vira-green-behind-bg-decoration" | "vira-green-behind-bg-invisible" | "vira-green-behind-bg-lowest-contrast" | "vira-green-behind-fg-highest-contrast" | "vira-green-behind-fg-small-body" | "vira-green-behind-fg-body" | "vira-green-behind-fg-non-body" | "vira-green-behind-fg-header" | "vira-green-behind-fg-placeholder" | "vira-green-behind-fg-decoration" | "vira-green-behind-fg-invisible" | "vira-green-behind-fg-lowest-contrast" | "vira-green-on-self-highest-contrast" | "vira-green-on-self-small-body" | "vira-green-on-self-body" | "vira-green-on-self-non-body" | "vira-green-on-self-header" | "vira-green-on-self-placeholder" | "vira-green-on-self-decoration" | "vira-green-on-self-invisible" | "vira-green-on-self-lowest-contrast" | "vira-teal-foreground-highest-contrast" | "vira-teal-foreground-small-body" | "vira-teal-foreground-body" | "vira-teal-foreground-non-body" | "vira-teal-foreground-header" | "vira-teal-foreground-placeholder" | "vira-teal-foreground-decoration" | "vira-teal-foreground-invisible" | "vira-teal-foreground-lowest-contrast" | "vira-teal-behind-bg-highest-contrast" | "vira-teal-behind-bg-small-body" | "vira-teal-behind-bg-body" | "vira-teal-behind-bg-non-body" | "vira-teal-behind-bg-header" | "vira-teal-behind-bg-placeholder" | "vira-teal-behind-bg-decoration" | "vira-teal-behind-bg-invisible" | "vira-teal-behind-bg-lowest-contrast" | "vira-teal-behind-fg-highest-contrast" | "vira-teal-behind-fg-small-body" | "vira-teal-behind-fg-body" | "vira-teal-behind-fg-non-body" | "vira-teal-behind-fg-header" | "vira-teal-behind-fg-placeholder" | "vira-teal-behind-fg-decoration" | "vira-teal-behind-fg-invisible" | "vira-teal-behind-fg-lowest-contrast" | "vira-teal-on-self-highest-contrast" | "vira-teal-on-self-small-body" | "vira-teal-on-self-body" | "vira-teal-on-self-non-body" | "vira-teal-on-self-header" | "vira-teal-on-self-placeholder" | "vira-teal-on-self-decoration" | "vira-teal-on-self-invisible" | "vira-teal-on-self-lowest-contrast" | "vira-blue-foreground-highest-contrast" | "vira-blue-foreground-small-body" | "vira-blue-foreground-body" | "vira-blue-foreground-non-body" | "vira-blue-foreground-header" | "vira-blue-foreground-placeholder" | "vira-blue-foreground-decoration" | "vira-blue-foreground-invisible" | "vira-blue-foreground-lowest-contrast" | "vira-blue-behind-bg-highest-contrast" | "vira-blue-behind-bg-small-body" | "vira-blue-behind-bg-body" | "vira-blue-behind-bg-non-body" | "vira-blue-behind-bg-header" | "vira-blue-behind-bg-placeholder" | "vira-blue-behind-bg-decoration" | "vira-blue-behind-bg-invisible" | "vira-blue-behind-bg-lowest-contrast" | "vira-blue-behind-fg-highest-contrast" | "vira-blue-behind-fg-small-body" | "vira-blue-behind-fg-body" | "vira-blue-behind-fg-non-body" | "vira-blue-behind-fg-header" | "vira-blue-behind-fg-placeholder" | "vira-blue-behind-fg-decoration" | "vira-blue-behind-fg-invisible" | "vira-blue-behind-fg-lowest-contrast" | "vira-blue-on-self-highest-contrast" | "vira-blue-on-self-small-body" | "vira-blue-on-self-body" | "vira-blue-on-self-non-body" | "vira-blue-on-self-header" | "vira-blue-on-self-placeholder" | "vira-blue-on-self-decoration" | "vira-blue-on-self-invisible" | "vira-blue-on-self-lowest-contrast" | "vira-brand-foreground-highest-contrast" | "vira-brand-foreground-small-body" | "vira-brand-foreground-body" | "vira-brand-foreground-non-body" | "vira-brand-foreground-header" | "vira-brand-foreground-placeholder" | "vira-brand-foreground-decoration" | "vira-brand-foreground-invisible" | "vira-brand-foreground-lowest-contrast" | "vira-brand-behind-bg-highest-contrast" | "vira-brand-behind-bg-small-body" | "vira-brand-behind-bg-body" | "vira-brand-behind-bg-non-body" | "vira-brand-behind-bg-header" | "vira-brand-behind-bg-placeholder" | "vira-brand-behind-bg-decoration" | "vira-brand-behind-bg-invisible" | "vira-brand-behind-bg-lowest-contrast" | "vira-brand-behind-fg-highest-contrast" | "vira-brand-behind-fg-small-body" | "vira-brand-behind-fg-body" | "vira-brand-behind-fg-non-body" | "vira-brand-behind-fg-header" | "vira-brand-behind-fg-placeholder" | "vira-brand-behind-fg-decoration" | "vira-brand-behind-fg-invisible" | "vira-brand-behind-fg-lowest-contrast" | "vira-brand-on-self-highest-contrast" | "vira-brand-on-self-small-body" | "vira-brand-on-self-body" | "vira-brand-on-self-non-body" | "vira-brand-on-self-header" | "vira-brand-on-self-placeholder" | "vira-brand-on-self-decoration" | "vira-brand-on-self-invisible" | "vira-brand-on-self-lowest-contrast" | "vira-purple-foreground-highest-contrast" | "vira-purple-foreground-small-body" | "vira-purple-foreground-body" | "vira-purple-foreground-non-body" | "vira-purple-foreground-header" | "vira-purple-foreground-placeholder" | "vira-purple-foreground-decoration" | "vira-purple-foreground-invisible" | "vira-purple-foreground-lowest-contrast" | "vira-purple-behind-bg-highest-contrast" | "vira-purple-behind-bg-small-body" | "vira-purple-behind-bg-body" | "vira-purple-behind-bg-non-body" | "vira-purple-behind-bg-header" | "vira-purple-behind-bg-placeholder" | "vira-purple-behind-bg-decoration" | "vira-purple-behind-bg-invisible" | "vira-purple-behind-bg-lowest-contrast" | "vira-purple-behind-fg-highest-contrast" | "vira-purple-behind-fg-small-body" | "vira-purple-behind-fg-body" | "vira-purple-behind-fg-non-body" | "vira-purple-behind-fg-header" | "vira-purple-behind-fg-placeholder" | "vira-purple-behind-fg-decoration" | "vira-purple-behind-fg-invisible" | "vira-purple-behind-fg-lowest-contrast" | "vira-purple-on-self-highest-contrast" | "vira-purple-on-self-small-body" | "vira-purple-on-self-body" | "vira-purple-on-self-non-body" | "vira-purple-on-self-header" | "vira-purple-on-self-placeholder" | "vira-purple-on-self-decoration" | "vira-purple-on-self-invisible" | "vira-purple-on-self-lowest-contrast" | "vira-pink-foreground-highest-contrast" | "vira-pink-foreground-small-body" | "vira-pink-foreground-body" | "vira-pink-foreground-non-body" | "vira-pink-foreground-header" | "vira-pink-foreground-placeholder" | "vira-pink-foreground-decoration" | "vira-pink-foreground-invisible" | "vira-pink-foreground-lowest-contrast" | "vira-pink-behind-bg-highest-contrast" | "vira-pink-behind-bg-small-body" | "vira-pink-behind-bg-body" | "vira-pink-behind-bg-non-body" | "vira-pink-behind-bg-header" | "vira-pink-behind-bg-placeholder" | "vira-pink-behind-bg-decoration" | "vira-pink-behind-bg-invisible" | "vira-pink-behind-bg-lowest-contrast" | "vira-pink-behind-fg-highest-contrast" | "vira-pink-behind-fg-small-body" | "vira-pink-behind-fg-body" | "vira-pink-behind-fg-non-body" | "vira-pink-behind-fg-header" | "vira-pink-behind-fg-placeholder" | "vira-pink-behind-fg-decoration" | "vira-pink-behind-fg-invisible" | "vira-pink-behind-fg-lowest-contrast" | "vira-pink-on-self-highest-contrast" | "vira-pink-on-self-small-body" | "vira-pink-on-self-body" | "vira-pink-on-self-non-body" | "vira-pink-on-self-header" | "vira-pink-on-self-placeholder" | "vira-pink-on-self-decoration" | "vira-pink-on-self-invisible" | "vira-pink-on-self-lowest-contrast" | "vira-grey-foreground-highest-contrast" | "vira-grey-foreground-small-body" | "vira-grey-foreground-body" | "vira-grey-foreground-non-body" | "vira-grey-foreground-header" | "vira-grey-foreground-placeholder" | "vira-grey-foreground-decoration" | "vira-grey-foreground-invisible" | "vira-grey-foreground-lowest-contrast" | "vira-grey-behind-bg-highest-contrast" | "vira-grey-behind-bg-small-body" | "vira-grey-behind-bg-body" | "vira-grey-behind-bg-non-body" | "vira-grey-behind-bg-header" | "vira-grey-behind-bg-placeholder" | "vira-grey-behind-bg-decoration" | "vira-grey-behind-bg-invisible" | "vira-grey-behind-bg-lowest-contrast" | "vira-grey-behind-fg-highest-contrast" | "vira-grey-behind-fg-small-body" | "vira-grey-behind-fg-body" | "vira-grey-behind-fg-non-body" | "vira-grey-behind-fg-header" | "vira-grey-behind-fg-placeholder" | "vira-grey-behind-fg-decoration" | "vira-grey-behind-fg-invisible" | "vira-grey-behind-fg-lowest-contrast" | "vira-grey-on-self-highest-contrast" | "vira-grey-on-self-small-body" | "vira-grey-on-self-body" | "vira-grey-on-self-non-body" | "vira-grey-on-self-header" | "vira-grey-on-self-placeholder" | "vira-grey-on-self-decoration" | "vira-grey-on-self-invisible" | "vira-grey-on-self-lowest-contrast" | "theme-default")[];
+/**
+ * All {@link viraTheme} color pair keys with the contrast level suffix removed.
+ *
+ * @category Internal
+ */
+export type ViraThemeKeysWithoutContrastLevel = Exclude<RemoveSuffix<RemoveSuffix<AllViraThemeKeys, SortedContrastLevelName>, ['-']>, typeof themeDefaultKey>;
+/**
+ * All {@link viraTheme} color pair grouped by their color name, pair name, and contrast level.
+ *
+ * @category Internal
+ */
+export type ViraThemeByKeys = {
+    [ColorName in ViraThemeColorName]: {
+        [PairName in RemovePrefix<ViraThemeKeysWithoutContrastLevel, `vira-${ColorName}-`>]: {
+            [ContrastLevel in RemovePrefix<AllViraThemeKeys, `vira-${ColorName}-${PairName}-`>]: ColorThemeColor;
+        };
+    };
+};
+/**
+ * All {@link viraTheme} color pair grouped by their color name, pair name, and contrast level. See
+ * {@link viraTheme} for extensive documentation on what the colors pairs mean.
+ *
+ * @category Internal
+ */
+export declare const viraThemeByKeys: ViraThemeByKeys;

package/dist/styles/vira-color-theme-object.js

@@ -0,0 +1,65 @@
+import { check } from '@augment-vir/assert';
+import { arrayToObject, filterMap, getEnumValues, getObjectTypedKeys, mapEnumToObject, removeDuplicates, removePrefix, removeSuffix, } from '@augment-vir/common';
+import { ContrastLevelName } from '@electrovir/color/dist/data/contrast/contrast.js';
+import { viraTheme } from './vira-color-theme.js';
+const sortedContrastLevelNames = [
+    'highest-contrast',
+    'lowest-contrast',
+    ...getEnumValues(ContrastLevelName).sort((a, b) => Number(b.includes('-')) - Number(a.includes('-'))),
+];
+const viraThemeColorNames = removeDuplicates(filterMap(Object.keys(viraTheme.colors), (key) => key.split('-')[1], (mappedKey) => mappedKey !== 'default')).filter(check.isTruthy);
+/**
+ * An enum of {@link ViraThemeColorName}.
+ *
+ * @category Internal
+ */
+export const ViraThemeColorName = arrayToObject(viraThemeColorNames, (colorKey) => {
+    return {
+        key: colorKey,
+        value: colorKey,
+    };
+}, {
+    useRequired: true,
+});
+/**
+ * All {@link viraTheme} color pair keys.
+ *
+ * @category Internal
+ */
+export const allViraThemeKeys = getObjectTypedKeys(viraTheme.colors);
+/**
+ * All {@link viraTheme} color pair grouped by their color name, pair name, and contrast level. See
+ * {@link viraTheme} for extensive documentation on what the colors pairs mean.
+ *
+ * @category Internal
+ */
+export const viraThemeByKeys = mapEnumToObject(ViraThemeColorName, (colorName) => {
+    const colorPairKeys = removeDuplicates(filterMap(allViraThemeKeys, (key) => {
+        return sortedContrastLevelNames.reduce((final, current) => {
+            return removeSuffix({
+                value: final,
+                suffix: `-${current}`,
+            });
+        }, removePrefix({
+            value: key,
+            prefix: `vira-${colorName}-`,
+        }));
+    }, (mappedKey, originalKey) => {
+        return originalKey.startsWith(`vira-${colorName}-`);
+    }));
+    return arrayToObject(colorPairKeys, (colorPairKey) => {
+        return {
+            key: colorPairKey,
+            value: arrayToObject(sortedContrastLevelNames, (contrastLevel) => {
+                const finalKey = `vira-${colorName}-${colorPairKey}-${contrastLevel}`;
+                if (!check.hasKey(viraTheme.colors, finalKey)) {
+                    return undefined;
+                }
+                return {
+                    key: contrastLevel,
+                    value: viraTheme.colors[finalKey],
+                };
+            }),
+        };
+    });
+});