@lumx/react 3.13.2 → 3.13.3-alpha.1

package/src/utils/type/color/index.ts

@@ -0,0 +1,43 @@
+import type { ValueOf } from '@lumx/react/utils/type';
+
+/**
+ * See SCSS variable $lumx-color-palette
+ */
+export const ColorPalette = {
+    primary: 'primary',
+    secondary: 'secondary',
+    blue: 'blue',
+    dark: 'dark',
+    green: 'green',
+    yellow: 'yellow',
+    red: 'red',
+    light: 'light',
+    grey: 'grey',
+} as const;
+export type ColorPalette = ValueOf<typeof ColorPalette>;
+export type Color = ColorPalette | string;
+
+/**
+ * See SCSS variable $lumx-color-variants
+ */
+export const ColorVariant = {
+    D1: 'D1',
+    D2: 'D2',
+    L1: 'L1',
+    L2: 'L2',
+    L3: 'L3',
+    L4: 'L4',
+    L5: 'L5',
+    L6: 'L6',
+    N: 'N',
+} as const;
+export type ColorVariant = ValueOf<typeof ColorVariant>;
+
+/** ColorPalette with all possible color variant combination */
+export type ColorWithVariants =
+    | ColorPalette
+    | Exclude<
+          `${ColorPalette}-${ColorVariant}`,
+          // No dark variant for light and dark
+          `light-D${number}` | `dark-D${number}`
+      >;

package/src/utils/className/getFontColorClassName.test.ts

@@ -1,11 +0,0 @@
-import { getFontColorClassName } from '@lumx/react/utils/className/getFontColorClassName';
-
-describe(getFontColorClassName, () => {
-    it('should get lumx class for font color', () => {
-        expect(getFontColorClassName('dark')).toBe('lumx-color-font-dark-N');
-    });
-
-    it('should get lumx class for font color with variant', () => {
-        expect(getFontColorClassName('red', 'L2')).toBe('lumx-color-font-red-L2');
-    });
-});

package/src/utils/className/getFontColorClassName.ts

@@ -1,9 +0,0 @@
-import { ColorPalette, ColorVariant } from '@lumx/react';
-
-/**
- * Returns the classname associated to the given color and variant.
- * For example, for 'dark' and 'L2' it returns `lumx-color-font-dark-l2`
- */
-export const getFontColorClassName = (color: ColorPalette, colorVariant: ColorVariant = ColorVariant.N) => {
-    return `lumx-color-font-${color}-${colorVariant}`;
-};