@utilitywarehouse/hearth-react-native 0.4.0 → 0.4.2

package/src/legacyTokens/light/grey.ts

@@ -0,0 +1,62 @@
+// HEY, DON'T EDIT THIS FILE DIRECTLY, IT'S BEEN MAGICALLY GENERATED.
+
+/**
+ * @deprecated This will be removed in the next major version. This is kept for backward compatibility.
+ */
+export const grey25 = '#fafafa';
+/**
+ * @deprecated This will be removed in the next major version. This is kept for backward compatibility.
+ */
+export const grey50 = '#f5f5f5';
+/**
+ * @deprecated This will be removed in the next major version. This is kept for backward compatibility.
+ */
+export const grey75 = '#f0f0f0';
+/**
+ * @deprecated This will be removed in the next major version. This is kept for backward compatibility.
+ */
+export const grey100 = '#e3e3e3';
+/**
+ * @deprecated This will be removed in the next major version. This is kept for backward compatibility.
+ */
+export const grey150 = '#d8d8d8';
+/**
+ * @deprecated This will be removed in the next major version. This is kept for backward compatibility.
+ */
+export const grey175 = '#cccccc';
+/**
+ * @deprecated This will be removed in the next major version. This is kept for backward compatibility.
+ */
+export const grey200 = '#c1c1c1';
+/**
+ * @deprecated This will be removed in the next major version. This is kept for backward compatibility.
+ */
+export const grey300 = '#b8b8b8';
+/**
+ * @deprecated This will be removed in the next major version. This is kept for backward compatibility.
+ */
+export const grey400 = '#a0a0a0';
+/**
+ * @deprecated This will be removed in the next major version. This is kept for backward compatibility.
+ */
+export const grey500 = '#888888';
+/**
+ * @deprecated This will be removed in the next major version. This is kept for backward compatibility.
+ */
+export const grey600 = '#707070';
+/**
+ * @deprecated This will be removed in the next major version. This is kept for backward compatibility.
+ */
+export const grey700 = '#585858';
+/**
+ * @deprecated This will be removed in the next major version. This is kept for backward compatibility.
+ */
+export const grey800 = '#414141';
+/**
+ * @deprecated This will be removed in the next major version. This is kept for backward compatibility.
+ */
+export const grey900 = '#242424';
+/**
+ * @deprecated This will be removed in the next major version. This is kept for backward compatibility.
+ */
+export const grey1000 = '#121212';

package/src/legacyTokens/light/index.ts

@@ -0,0 +1,42 @@
+// HEY, DON'T EDIT THIS FILE DIRECTLY, IT'S BEEN MAGICALLY GENERATED.
+
+/**
+ * @deprecated This will be removed in the next major version. This is kept for backward compatibility.
+ */
+export * from './red';
+/**
+ * @deprecated This will be removed in the next major version. This is kept for backward compatibility.
+ */
+export * from './pink';
+/**
+ * @deprecated This will be removed in the next major version. This is kept for backward compatibility.
+ */
+export * from './grey';
+/**
+ * @deprecated This will be removed in the next major version. This is kept for backward compatibility.
+ */
+export * from './apple';
+/**
+ * @deprecated This will be removed in the next major version. This is kept for backward compatibility.
+ */
+export * from './cyan';
+/**
+ * @deprecated This will be removed in the next major version. This is kept for backward compatibility.
+ */
+export * from './gold';
+/**
+ * @deprecated This will be removed in the next major version. This is kept for backward compatibility.
+ */
+export * from './green';
+/**
+ * @deprecated This will be removed in the next major version. This is kept for backward compatibility.
+ */
+export * from './grape';
+/**
+ * @deprecated This will be removed in the next major version. This is kept for backward compatibility.
+ */
+export * from './rose';
+/**
+ * @deprecated This will be removed in the next major version. This is kept for backward compatibility.
+ */
+export * from './purple';

package/src/legacyTokens/light/pink.ts

@@ -0,0 +1,30 @@
+// HEY, DON'T EDIT THIS FILE DIRECTLY, IT'S BEEN MAGICALLY GENERATED.
+
+/**
+ * @deprecated This will be removed in the next major version. This is kept for backward compatibility.
+ */
+export const pink50 = '#fde6fb';
+/**
+ * @deprecated This will be removed in the next major version. This is kept for backward compatibility.
+ */
+export const pink100 = '#fccff9';
+/**
+ * @deprecated This will be removed in the next major version. This is kept for backward compatibility.
+ */
+export const pink200 = '#f9bdfa';
+/**
+ * @deprecated This will be removed in the next major version. This is kept for backward compatibility.
+ */
+export const pink300 = '#f495f9';
+/**
+ * @deprecated This will be removed in the next major version. This is kept for backward compatibility.
+ */
+export const pink500 = '#c933d1';
+/**
+ * @deprecated This will be removed in the next major version. This is kept for backward compatibility.
+ */
+export const pink700 = '#8f248f';
+/**
+ * @deprecated This will be removed in the next major version. This is kept for backward compatibility.
+ */
+export const pink900 = '#48104b';

package/src/legacyTokens/light/purple.ts

@@ -0,0 +1,50 @@
+// HEY, DON'T EDIT THIS FILE DIRECTLY, IT'S BEEN MAGICALLY GENERATED.
+
+/**
+ * @deprecated This will be removed in the next major version. This is kept for backward compatibility.
+ */
+export const purple50 = '#f8f5fe';
+/**
+ * @deprecated This will be removed in the next major version. This is kept for backward compatibility.
+ */
+export const purple75 = '#f1ebfe';
+/**
+ * @deprecated This will be removed in the next major version. This is kept for backward compatibility.
+ */
+export const purple100 = '#e5d7fe';
+/**
+ * @deprecated This will be removed in the next major version. This is kept for backward compatibility.
+ */
+export const purple200 = '#cfadff';
+/**
+ * @deprecated This will be removed in the next major version. This is kept for backward compatibility.
+ */
+export const purple300 = '#c08dfc';
+/**
+ * @deprecated This will be removed in the next major version. This is kept for backward compatibility.
+ */
+export const purple400 = '#b46ef7';
+/**
+ * @deprecated This will be removed in the next major version. This is kept for backward compatibility.
+ */
+export const purple500 = '#9d38f0';
+/**
+ * @deprecated This will be removed in the next major version. This is kept for backward compatibility.
+ */
+export const purple600 = '#8f23e7';
+/**
+ * @deprecated This will be removed in the next major version. This is kept for backward compatibility.
+ */
+export const purple700 = '#7415c1';
+/**
+ * @deprecated This will be removed in the next major version. This is kept for backward compatibility.
+ */
+export const purple800 = '#550091';
+/**
+ * @deprecated This will be removed in the next major version. This is kept for backward compatibility.
+ */
+export const purple900 = '#48007a';
+/**
+ * @deprecated This will be removed in the next major version. This is kept for backward compatibility.
+ */
+export const purple1000 = '#35005c';

package/src/legacyTokens/light/red.ts

@@ -0,0 +1,42 @@
+// HEY, DON'T EDIT THIS FILE DIRECTLY, IT'S BEEN MAGICALLY GENERATED.
+
+/**
+ * @deprecated This will be removed in the next major version. This is kept for backward compatibility.
+ */
+export const red50 = '#ffebeb';
+/**
+ * @deprecated This will be removed in the next major version. This is kept for backward compatibility.
+ */
+export const red100 = '#ffd8d9';
+/**
+ * @deprecated This will be removed in the next major version. This is kept for backward compatibility.
+ */
+export const red200 = '#ffb3b4';
+/**
+ * @deprecated This will be removed in the next major version. This is kept for backward compatibility.
+ */
+export const red300 = '#f58e92';
+/**
+ * @deprecated This will be removed in the next major version. This is kept for backward compatibility.
+ */
+export const red400 = '#ec515d';
+/**
+ * @deprecated This will be removed in the next major version. This is kept for backward compatibility.
+ */
+export const red500 = '#df2a38';
+/**
+ * @deprecated This will be removed in the next major version. This is kept for backward compatibility.
+ */
+export const red600 = '#c31d2a';
+/**
+ * @deprecated This will be removed in the next major version. This is kept for backward compatibility.
+ */
+export const red700 = '#891e27';
+/**
+ * @deprecated This will be removed in the next major version. This is kept for backward compatibility.
+ */
+export const red800 = '#611a20';
+/**
+ * @deprecated This will be removed in the next major version. This is kept for backward compatibility.
+ */
+export const red900 = '#3b1216';

package/src/legacyTokens/light/rose.ts

@@ -0,0 +1,34 @@
+// HEY, DON'T EDIT THIS FILE DIRECTLY, IT'S BEEN MAGICALLY GENERATED.
+
+/**
+ * @deprecated This will be removed in the next major version. This is kept for backward compatibility.
+ */
+export const rose50 = '#fde2ec';
+/**
+ * @deprecated This will be removed in the next major version. This is kept for backward compatibility.
+ */
+export const rose200 = '#f9b6d0';
+/**
+ * @deprecated This will be removed in the next major version. This is kept for backward compatibility.
+ */
+export const rose300 = '#f586b1';
+/**
+ * @deprecated This will be removed in the next major version. This is kept for backward compatibility.
+ */
+export const rose400 = '#f25192';
+/**
+ * @deprecated This will be removed in the next major version. This is kept for backward compatibility.
+ */
+export const rose500 = '#ed176c';
+/**
+ * @deprecated This will be removed in the next major version. This is kept for backward compatibility.
+ */
+export const rose700 = '#c8185c';
+/**
+ * @deprecated This will be removed in the next major version. This is kept for backward compatibility.
+ */
+export const rose800 = '#9f1446';
+/**
+ * @deprecated This will be removed in the next major version. This is kept for backward compatibility.
+ */
+export const rose900 = '#4a1125';

package/src/utils/getFlattenedColorValue.ts

@@ -1,4 +1,5 @@
 import { ColorValue } from '../types';
+import { resolveThemeValue } from './themeValueHelpers';
 
 type ThemeColor = string | { [key: string]: string | ThemeColor };
 
@@ -8,25 +9,5 @@ export default function getFlattenedColorValue(
 ): ColorValue {
   if (!value) return undefined;
 
-  if (colors?.[value] && typeof colors?.[value] === 'string') {
-    return colors?.[value] as ColorValue;
-  }
-
-  // Extract trailing digits as shade
-  const shadeMatch = value.match(/\d+$/);
-
-  if (!shadeMatch) return value as ColorValue;
-  const shade = shadeMatch[0];
-  const base = value.slice(0, -shade.length);
-
-  if (shade && typeof base !== 'string') return value as ColorValue;
-
-  const colorEntry = colors?.[base];
-
-  if (typeof colorEntry === 'object') {
-    return (colorEntry[shade] ?? value) as ColorValue;
-  } else if (typeof colorEntry === 'string') {
-    return colorEntry as ColorValue;
-  }
-  return value as ColorValue;
+  return resolveThemeValue(value, colors) as ColorValue;
 }

package/src/utils/getStyleValue.ts

@@ -1,6 +1,3 @@
- 
- 
-
 const getStyleValue = (value: any, type: Record<string, any>) => {
   if (typeof value === 'string') {
     const key = value;

package/src/utils/index.ts

@@ -5,3 +5,4 @@ export { default as getStyleValue } from './getStyleValue';
 export { default as hexWithOpacity } from './hexWithOpacity';
 export { default as isEqual } from './isEqual';
 export * from './styleUtils';
+export * from './themeValueHelpers';

package/src/utils/styleUtils.ts

@@ -231,60 +231,3 @@ export const viewStyleProps = new Set<string>([
   // Z-index
   'zIndex',
 ]);
-
-/**
- * Helper function to convert camelCase back to nested object path
- * e.g., feedbackDangerSurfaceDefault -> ['feedback', 'danger', 'surface', 'default']
- */
-const camelCaseToPath = (camelCased: string): string[] => {
-  // Split on uppercase letters but keep them
-  const parts = camelCased.split(/(?=[A-Z])/).map(part => part.toLowerCase());
-  return parts;
-};
-
-/**
- * Helper function to get nested value from object using path array
- */
-const getNestedValue = (obj: any, path: string[]): any => {
-  return path.reduce((current, key) => {
-    return current && typeof current === 'object' ? current[key] : undefined;
-  }, obj);
-};
-
-/**
- * Helper function to resolve a theme value
- */
-export const resolveThemeValue = (value: any, themeMapping: any): any => {
-  if (typeof value !== 'string' || !themeMapping || typeof themeMapping !== 'object') {
-    return value;
-  }
-
-  // First, try direct lookup for simple values
-  if (themeMapping[value] !== undefined) {
-    return themeMapping[value];
-  }
-
-  // Try camelCase to nested path conversion (e.g., feedbackDangerSurfaceDefault)
-  if (/^[a-z][a-zA-Z]*$/.test(value)) {
-    // Only camelCase strings without numbers
-    const path = camelCaseToPath(value);
-    const nestedValue = getNestedValue(themeMapping, path);
-    if (nestedValue !== undefined) {
-      return nestedValue;
-    }
-  }
-
-  // Then, try the existing numeric suffix pattern (e.g., broadbandBlue100)
-  const shadeMatch = value.match(/\d+$/);
-  if (shadeMatch) {
-    const shade = shadeMatch[0];
-    const base = value.slice(0, -shade.length);
-    const nested = themeMapping[base];
-    if (nested && typeof nested === 'object') {
-      return nested[shade] ?? value;
-    }
-  }
-
-  // If none of the approaches work, return the original value
-  return value;
-};

package/src/utils/themeValueHelpers.ts

@@ -0,0 +1,60 @@
+/**
+ * Helper function to convert camelCase back to nested object path
+ * e.g., feedbackDangerSurfaceDefault -> ['feedback', 'danger', 'surface', 'default']
+ */
+export const camelCaseToPath = (camelCased: string): string[] => {
+  // Split on uppercase letters but keep them
+  const parts = camelCased.split(/(?=[A-Z])/).map(part => part.toLowerCase());
+  return parts;
+};
+
+/**
+ * Helper function to get nested value from object using path array
+ */
+export const getNestedValue = (obj: any, path: string[]): any => {
+  return path.reduce((current, key) => {
+    return current && typeof current === 'object' ? current[key] : undefined;
+  }, obj);
+};
+
+/**
+ * Helper function to resolve a theme value
+ * Supports:
+ * - Direct lookup (value -> themeMapping[value])
+ * - Camel case to nested path (feedbackDangerSurfaceDefault -> themeMapping.feedback.danger.surface.default)
+ * - Numeric suffix pattern (broadbandBlue100 -> themeMapping.broadbandBlue[100])
+ */
+export const resolveThemeValue = (value: any, themeMapping: any): any => {
+  if (typeof value !== 'string' || !themeMapping || typeof themeMapping !== 'object') {
+    return value;
+  }
+
+  // First, try direct lookup for simple values
+  if (themeMapping[value] !== undefined) {
+    return themeMapping[value];
+  }
+
+  // Try camelCase to nested path conversion (e.g., feedbackDangerSurfaceDefault)
+  if (/^[a-z][a-zA-Z]*$/.test(value)) {
+    // Only camelCase strings without numbers
+    const path = camelCaseToPath(value);
+    const nestedValue = getNestedValue(themeMapping, path);
+    if (nestedValue !== undefined) {
+      return nestedValue;
+    }
+  }
+
+  // Then, try the existing numeric suffix pattern (e.g., broadbandBlue100)
+  const shadeMatch = value.match(/\d+$/);
+  if (shadeMatch) {
+    const shade = shadeMatch[0];
+    const base = value.slice(0, -shade.length);
+    const nested = themeMapping[base];
+    if (nested && typeof nested === 'object') {
+      return nested[shade] ?? value;
+    }
+  }
+
+  // If none of the approaches work, return the original value
+  return value;
+};