@mgcrea/react-native-tailwind 0.6.1 → 0.8.0

package/dist/utils/modifiers.d.ts

@@ -0,0 +1,29 @@
+/**
+ * Shared utilities for parsing state modifiers (active:, focus:, disabled:)
+ * Used by both runtime parser and Babel plugin
+ */
+export declare const SUPPORTED_MODIFIERS: readonly ["active", "focus", "disabled"];
+export type SupportedModifier = (typeof SUPPORTED_MODIFIERS)[number];
+/**
+ * Detect if a className contains any state modifiers (active:, focus:, disabled:)
+ */
+export declare function hasModifiers(className: string): boolean;
+/**
+ * Split className into base classes and modifier-specific classes
+ * Returns: { base: string[], modifiers: Map<modifier, string[]> }
+ *
+ * @example
+ * splitModifierClasses('bg-blue-500 active:bg-blue-700 disabled:bg-gray-300')
+ * // Returns:
+ * // {
+ * //   base: ['bg-blue-500'],
+ * //   modifiers: Map {
+ * //     'active' => ['bg-blue-700'],
+ * //     'disabled' => ['bg-gray-300']
+ * //   }
+ * // }
+ */
+export declare function splitModifierClasses(className: string): {
+    base: string[];
+    modifiers: Map<SupportedModifier, string[]>;
+};

package/dist/utils/modifiers.js

@@ -0,0 +1 @@
+Object.defineProperty(exports,"__esModule",{value:true});exports.SUPPORTED_MODIFIERS=void 0;exports.hasModifiers=hasModifiers;exports.splitModifierClasses=splitModifierClasses;var SUPPORTED_MODIFIERS=exports.SUPPORTED_MODIFIERS=["active","focus","disabled"];function hasModifiers(className){return SUPPORTED_MODIFIERS.some(function(modifier){return className.includes(`${modifier}:`);});}function splitModifierClasses(className){var classes=className.split(/\s+/).filter(Boolean);var base=[];var modifiers=new Map();for(var cls of classes){var matched=false;for(var modifier of SUPPORTED_MODIFIERS){var prefix=`${modifier}:`;if(cls.startsWith(prefix)){var cleanClass=cls.slice(prefix.length);if(!modifiers.has(modifier)){modifiers.set(modifier,[]);}var modifierClasses=modifiers.get(modifier);if(modifierClasses){modifierClasses.push(cleanClass);}matched=true;break;}}if(!matched){base.push(cls);}}return{base:base,modifiers:modifiers};}

package/dist/utils/modifiers.test.js

@@ -0,0 +1 @@
+var _vitest=require("vitest");var _modifiers=require("./modifiers");(0,_vitest.describe)("SUPPORTED_MODIFIERS",function(){(0,_vitest.it)("should export list of supported modifiers",function(){(0,_vitest.expect)(_modifiers.SUPPORTED_MODIFIERS).toEqual(["active","focus","disabled"]);});(0,_vitest.it)("should be readonly",function(){(0,_vitest.expect)(Array.isArray(_modifiers.SUPPORTED_MODIFIERS)).toBe(true);});});(0,_vitest.describe)("hasModifiers",function(){(0,_vitest.it)("should return true for active modifier",function(){(0,_vitest.expect)((0,_modifiers.hasModifiers)("active:bg-blue-500")).toBe(true);(0,_vitest.expect)((0,_modifiers.hasModifiers)("m-4 active:bg-blue-500")).toBe(true);(0,_vitest.expect)((0,_modifiers.hasModifiers)("active:bg-blue-500 active:text-white")).toBe(true);});(0,_vitest.it)("should return true for focus modifier",function(){(0,_vitest.expect)((0,_modifiers.hasModifiers)("focus:border-blue-500")).toBe(true);(0,_vitest.expect)((0,_modifiers.hasModifiers)("p-2 focus:border-blue-500")).toBe(true);(0,_vitest.expect)((0,_modifiers.hasModifiers)("focus:bg-blue-500 focus:text-white")).toBe(true);});(0,_vitest.it)("should return true for disabled modifier",function(){(0,_vitest.expect)((0,_modifiers.hasModifiers)("disabled:opacity-50")).toBe(true);(0,_vitest.expect)((0,_modifiers.hasModifiers)("bg-blue-500 disabled:opacity-50")).toBe(true);(0,_vitest.expect)((0,_modifiers.hasModifiers)("disabled:bg-gray-300 disabled:text-gray-500")).toBe(true);});(0,_vitest.it)("should return true for multiple different modifiers",function(){(0,_vitest.expect)((0,_modifiers.hasModifiers)("active:bg-blue-700 focus:border-blue-500")).toBe(true);(0,_vitest.expect)((0,_modifiers.hasModifiers)("bg-blue-500 active:bg-blue-700 disabled:opacity-50")).toBe(true);(0,_vitest.expect)((0,_modifiers.hasModifiers)("focus:border-blue-500 disabled:bg-gray-300")).toBe(true);});(0,_vitest.it)("should return false for no modifiers",function(){(0,_vitest.expect)((0,_modifiers.hasModifiers)("bg-blue-500")).toBe(false);(0,_vitest.expect)((0,_modifiers.hasModifiers)("m-4 p-2 text-white")).toBe(false);(0,_vitest.expect)((0,_modifiers.hasModifiers)("flex items-center justify-center")).toBe(false);});(0,_vitest.it)("should return false for empty string",function(){(0,_vitest.expect)((0,_modifiers.hasModifiers)("")).toBe(false);});(0,_vitest.it)("should return false for partial matches",function(){(0,_vitest.expect)((0,_modifiers.hasModifiers)("active")).toBe(false);(0,_vitest.expect)((0,_modifiers.hasModifiers)("focus")).toBe(false);(0,_vitest.expect)((0,_modifiers.hasModifiers)("disabled")).toBe(false);(0,_vitest.expect)((0,_modifiers.hasModifiers)("active-bg-blue-500")).toBe(false);(0,_vitest.expect)((0,_modifiers.hasModifiers)("focusborder-blue-500")).toBe(false);});(0,_vitest.it)("should detect modifiers anywhere in the string",function(){(0,_vitest.expect)((0,_modifiers.hasModifiers)("bg-blue-500 active:bg-blue-700 text-white")).toBe(true);(0,_vitest.expect)((0,_modifiers.hasModifiers)("flex items-center focus:border-blue-500 p-4")).toBe(true);});(0,_vitest.it)("should handle whitespace variations",function(){(0,_vitest.expect)((0,_modifiers.hasModifiers)("  active:bg-blue-500  ")).toBe(true);(0,_vitest.expect)((0,_modifiers.hasModifiers)("\tactive:bg-blue-500\n")).toBe(true);(0,_vitest.expect)((0,_modifiers.hasModifiers)("m-4  active:bg-blue-500  p-2")).toBe(true);});(0,_vitest.it)("should be case-sensitive",function(){(0,_vitest.expect)((0,_modifiers.hasModifiers)("Active:bg-blue-500")).toBe(false);(0,_vitest.expect)((0,_modifiers.hasModifiers)("ACTIVE:bg-blue-500")).toBe(false);(0,_vitest.expect)((0,_modifiers.hasModifiers)("Focus:border-blue-500")).toBe(false);});});(0,_vitest.describe)("splitModifierClasses",function(){(0,_vitest.it)("should split base classes without modifiers",function(){var result=(0,_modifiers.splitModifierClasses)("m-4 p-2 bg-blue-500");(0,_vitest.expect)(result.base).toEqual(["m-4","p-2","bg-blue-500"]);(0,_vitest.expect)(result.modifiers.size).toBe(0);});(0,_vitest.it)("should split active modifier classes",function(){var result=(0,_modifiers.splitModifierClasses)("bg-blue-500 active:bg-blue-700");(0,_vitest.expect)(result.base).toEqual(["bg-blue-500"]);(0,_vitest.expect)(result.modifiers.get("active")).toEqual(["bg-blue-700"]);});(0,_vitest.it)("should split focus modifier classes",function(){var result=(0,_modifiers.splitModifierClasses)("border-gray-300 focus:border-blue-500");(0,_vitest.expect)(result.base).toEqual(["border-gray-300"]);(0,_vitest.expect)(result.modifiers.get("focus")).toEqual(["border-blue-500"]);});(0,_vitest.it)("should split disabled modifier classes",function(){var result=(0,_modifiers.splitModifierClasses)("bg-blue-500 disabled:bg-gray-300");(0,_vitest.expect)(result.base).toEqual(["bg-blue-500"]);(0,_vitest.expect)(result.modifiers.get("disabled")).toEqual(["bg-gray-300"]);});(0,_vitest.it)("should split multiple classes with same modifier",function(){var result=(0,_modifiers.splitModifierClasses)("bg-blue-500 active:bg-blue-700 active:text-white active:border-blue-900");(0,_vitest.expect)(result.base).toEqual(["bg-blue-500"]);(0,_vitest.expect)(result.modifiers.get("active")).toEqual(["bg-blue-700","text-white","border-blue-900"]);});(0,_vitest.it)("should split multiple different modifiers",function(){var result=(0,_modifiers.splitModifierClasses)("bg-blue-500 active:bg-blue-700 focus:border-blue-500 disabled:opacity-50");(0,_vitest.expect)(result.base).toEqual(["bg-blue-500"]);(0,_vitest.expect)(result.modifiers.get("active")).toEqual(["bg-blue-700"]);(0,_vitest.expect)(result.modifiers.get("focus")).toEqual(["border-blue-500"]);(0,_vitest.expect)(result.modifiers.get("disabled")).toEqual(["opacity-50"]);});(0,_vitest.it)("should handle complex combination of base and modifier classes",function(){var result=(0,_modifiers.splitModifierClasses)("m-4 p-2 bg-blue-500 text-white rounded-lg active:bg-blue-700 active:text-gray-100 focus:border-blue-500 disabled:opacity-50 disabled:bg-gray-300");(0,_vitest.expect)(result.base).toEqual(["m-4","p-2","bg-blue-500","text-white","rounded-lg"]);(0,_vitest.expect)(result.modifiers.get("active")).toEqual(["bg-blue-700","text-gray-100"]);(0,_vitest.expect)(result.modifiers.get("focus")).toEqual(["border-blue-500"]);(0,_vitest.expect)(result.modifiers.get("disabled")).toEqual(["opacity-50","bg-gray-300"]);});(0,_vitest.it)("should handle empty string",function(){var result=(0,_modifiers.splitModifierClasses)("");(0,_vitest.expect)(result.base).toEqual([]);(0,_vitest.expect)(result.modifiers.size).toBe(0);});(0,_vitest.it)("should handle whitespace-only string",function(){var result=(0,_modifiers.splitModifierClasses)("   ");(0,_vitest.expect)(result.base).toEqual([]);(0,_vitest.expect)(result.modifiers.size).toBe(0);});(0,_vitest.it)("should handle only modifier classes",function(){var result=(0,_modifiers.splitModifierClasses)("active:bg-blue-700 focus:border-blue-500");(0,_vitest.expect)(result.base).toEqual([]);(0,_vitest.expect)(result.modifiers.get("active")).toEqual(["bg-blue-700"]);(0,_vitest.expect)(result.modifiers.get("focus")).toEqual(["border-blue-500"]);});(0,_vitest.it)("should filter out empty strings from split",function(){var result=(0,_modifiers.splitModifierClasses)("m-4  p-2   bg-blue-500");(0,_vitest.expect)(result.base).toEqual(["m-4","p-2","bg-blue-500"]);(0,_vitest.expect)(result.modifiers.size).toBe(0);});(0,_vitest.it)("should handle leading and trailing whitespace",function(){var result=(0,_modifiers.splitModifierClasses)("  m-4 active:bg-blue-700  ");(0,_vitest.expect)(result.base).toEqual(["m-4"]);(0,_vitest.expect)(result.modifiers.get("active")).toEqual(["bg-blue-700"]);});(0,_vitest.it)("should handle arbitrary values with modifiers",function(){var result=(0,_modifiers.splitModifierClasses)("bg-[#ff0000] active:bg-[#00ff00] text-[14px]");(0,_vitest.expect)(result.base).toEqual(["bg-[#ff0000]","text-[14px]"]);(0,_vitest.expect)(result.modifiers.get("active")).toEqual(["bg-[#00ff00]"]);});(0,_vitest.it)("should handle opacity modifiers with state modifiers",function(){var result=(0,_modifiers.splitModifierClasses)("bg-black/50 active:bg-black/80 text-white/90");(0,_vitest.expect)(result.base).toEqual(["bg-black/50","text-white/90"]);(0,_vitest.expect)(result.modifiers.get("active")).toEqual(["bg-black/80"]);});(0,_vitest.it)("should preserve order of base classes",function(){var result=(0,_modifiers.splitModifierClasses)("z-10 m-4 a-1 p-2");(0,_vitest.expect)(result.base).toEqual(["z-10","m-4","a-1","p-2"]);});(0,_vitest.it)("should preserve order of modifier classes",function(){var result=(0,_modifiers.splitModifierClasses)("active:z-10 active:m-4 active:a-1 active:p-2");(0,_vitest.expect)(result.modifiers.get("active")).toEqual(["z-10","m-4","a-1","p-2"]);});(0,_vitest.it)("should not match modifiers without colon",function(){var result=(0,_modifiers.splitModifierClasses)("active bg-blue-500 focus border-blue-500");(0,_vitest.expect)(result.base).toEqual(["active","bg-blue-500","focus","border-blue-500"]);(0,_vitest.expect)(result.modifiers.size).toBe(0);});(0,_vitest.it)("should not match partial modifier names",function(){var result=(0,_modifiers.splitModifierClasses)("reactive:bg-blue-500 prefocus:border-blue-500");(0,_vitest.expect)(result.base).toEqual(["reactive:bg-blue-500","prefocus:border-blue-500"]);(0,_vitest.expect)(result.modifiers.size).toBe(0);});(0,_vitest.it)("should handle modifiers at different positions",function(){var result=(0,_modifiers.splitModifierClasses)("active:bg-blue-700 m-4 focus:border-blue-500 p-2 disabled:opacity-50");(0,_vitest.expect)(result.base).toEqual(["m-4","p-2"]);(0,_vitest.expect)(result.modifiers.get("active")).toEqual(["bg-blue-700"]);(0,_vitest.expect)(result.modifiers.get("focus")).toEqual(["border-blue-500"]);(0,_vitest.expect)(result.modifiers.get("disabled")).toEqual(["opacity-50"]);});(0,_vitest.it)("should return empty Map when no modifiers present",function(){var result=(0,_modifiers.splitModifierClasses)("m-4 p-2 bg-blue-500");(0,_vitest.expect)(result.modifiers).toBeInstanceOf(Map);(0,_vitest.expect)(result.modifiers.size).toBe(0);(0,_vitest.expect)(result.modifiers.get("active")).toBeUndefined();(0,_vitest.expect)(result.modifiers.get("focus")).toBeUndefined();(0,_vitest.expect)(result.modifiers.get("disabled")).toBeUndefined();});(0,_vitest.it)("should return Map with only present modifiers",function(){var result=(0,_modifiers.splitModifierClasses)("bg-blue-500 active:bg-blue-700");(0,_vitest.expect)(result.modifiers.has("active")).toBe(true);(0,_vitest.expect)(result.modifiers.has("focus")).toBe(false);(0,_vitest.expect)(result.modifiers.has("disabled")).toBe(false);});(0,_vitest.it)("should handle real-world button example",function(){var result=(0,_modifiers.splitModifierClasses)("px-4 py-2 bg-blue-500 text-white rounded-lg active:bg-blue-700 disabled:bg-gray-300 disabled:text-gray-500");(0,_vitest.expect)(result.base).toEqual(["px-4","py-2","bg-blue-500","text-white","rounded-lg"]);(0,_vitest.expect)(result.modifiers.get("active")).toEqual(["bg-blue-700"]);(0,_vitest.expect)(result.modifiers.get("disabled")).toEqual(["bg-gray-300","text-gray-500"]);(0,_vitest.expect)(result.modifiers.get("focus")).toBeUndefined();});(0,_vitest.it)("should handle real-world input example",function(){var result=(0,_modifiers.splitModifierClasses)("border border-gray-300 rounded p-2 focus:border-blue-500 focus:outline-none disabled:bg-gray-100 disabled:text-gray-400");(0,_vitest.expect)(result.base).toEqual(["border","border-gray-300","rounded","p-2"]);(0,_vitest.expect)(result.modifiers.get("focus")).toEqual(["border-blue-500","outline-none"]);(0,_vitest.expect)(result.modifiers.get("disabled")).toEqual(["bg-gray-100","text-gray-400"]);(0,_vitest.expect)(result.modifiers.get("active")).toBeUndefined();});(0,_vitest.it)("should be consistent across multiple calls",function(){var className="m-4 active:bg-blue-700 focus:border-blue-500";var result1=(0,_modifiers.splitModifierClasses)(className);var result2=(0,_modifiers.splitModifierClasses)(className);(0,_vitest.expect)(result1.base).toEqual(result2.base);(0,_vitest.expect)(result1.modifiers.get("active")).toEqual(result2.modifiers.get("active"));(0,_vitest.expect)(result1.modifiers.get("focus")).toEqual(result2.modifiers.get("focus"));});(0,_vitest.it)("should handle negative values with modifiers",function(){var result=(0,_modifiers.splitModifierClasses)("-m-4 active:-m-8 -translate-x-2");(0,_vitest.expect)(result.base).toEqual(["-m-4","-translate-x-2"]);(0,_vitest.expect)(result.modifiers.get("active")).toEqual(["-m-8"]);});(0,_vitest.it)("should handle transform classes with modifiers",function(){var result=(0,_modifiers.splitModifierClasses)("scale-100 active:scale-110 rotate-0 active:rotate-45");(0,_vitest.expect)(result.base).toEqual(["scale-100","rotate-0"]);(0,_vitest.expect)(result.modifiers.get("active")).toEqual(["scale-110","rotate-45"]);});});

package/dist/utils/styleKey.test.js

@@ -0,0 +1 @@
+var _vitest=require("vitest");var _styleKey=require("./styleKey");(0,_vitest.describe)("generateStyleKey",function(){(0,_vitest.it)("should generate key with leading underscore",function(){(0,_vitest.expect)((0,_styleKey.generateStyleKey)("m-4")).toBe("_m_4");(0,_vitest.expect)((0,_styleKey.generateStyleKey)("p-2")).toBe("_p_2");(0,_vitest.expect)((0,_styleKey.generateStyleKey)("bg-blue-500")).toBe("_bg_blue_500");});(0,_vitest.it)("should sort classes alphabetically for consistency",function(){(0,_vitest.expect)((0,_styleKey.generateStyleKey)("m-4 p-2")).toBe((0,_styleKey.generateStyleKey)("p-2 m-4"));(0,_vitest.expect)((0,_styleKey.generateStyleKey)("bg-blue-500 text-white")).toBe((0,_styleKey.generateStyleKey)("text-white bg-blue-500"));(0,_vitest.expect)((0,_styleKey.generateStyleKey)("flex items-center justify-center")).toBe((0,_styleKey.generateStyleKey)("justify-center flex items-center"));});(0,_vitest.it)("should handle single class",function(){(0,_vitest.expect)((0,_styleKey.generateStyleKey)("flex")).toBe("_flex");(0,_vitest.expect)((0,_styleKey.generateStyleKey)("hidden")).toBe("_hidden");(0,_vitest.expect)((0,_styleKey.generateStyleKey)("absolute")).toBe("_absolute");});(0,_vitest.it)("should handle multiple classes",function(){(0,_vitest.expect)((0,_styleKey.generateStyleKey)("m-4 p-2 bg-blue-500")).toBe("_bg_blue_500_m_4_p_2");(0,_vitest.expect)((0,_styleKey.generateStyleKey)("flex items-center justify-center")).toBe("_flex_items_center_justify_center");});(0,_vitest.it)("should replace special characters with underscores",function(){(0,_vitest.expect)((0,_styleKey.generateStyleKey)("bg-[#ff0000]")).toBe("_bg_ff0000_");(0,_vitest.expect)((0,_styleKey.generateStyleKey)("text-[14px]")).toBe("_text_14px_");(0,_vitest.expect)((0,_styleKey.generateStyleKey)("m-[16px]")).toBe("_m_16px_");});(0,_vitest.it)("should collapse multiple underscores",function(){(0,_vitest.expect)((0,_styleKey.generateStyleKey)("bg-[#ff0000]")).toBe("_bg_ff0000_");(0,_vitest.expect)((0,_styleKey.generateStyleKey)("w-[100%]")).toBe("_w_100_");});(0,_vitest.it)("should handle classes with hyphens",function(){(0,_vitest.expect)((0,_styleKey.generateStyleKey)("bg-blue-500")).toBe("_bg_blue_500");(0,_vitest.expect)((0,_styleKey.generateStyleKey)("text-gray-700")).toBe("_text_gray_700");(0,_vitest.expect)((0,_styleKey.generateStyleKey)("border-red-300")).toBe("_border_red_300");});(0,_vitest.it)("should handle classes with numbers",function(){(0,_vitest.expect)((0,_styleKey.generateStyleKey)("m-4")).toBe("_m_4");(0,_vitest.expect)((0,_styleKey.generateStyleKey)("p-8")).toBe("_p_8");(0,_vitest.expect)((0,_styleKey.generateStyleKey)("gap-96")).toBe("_gap_96");(0,_vitest.expect)((0,_styleKey.generateStyleKey)("text-2xl")).toBe("_text_2xl");});(0,_vitest.it)("should handle classes with decimals",function(){(0,_vitest.expect)((0,_styleKey.generateStyleKey)("m-0.5")).toBe("_m_0_5");(0,_vitest.expect)((0,_styleKey.generateStyleKey)("p-1.5")).toBe("_p_1_5");(0,_vitest.expect)((0,_styleKey.generateStyleKey)("gap-2.5")).toBe("_gap_2_5");});(0,_vitest.it)("should handle empty string",function(){(0,_vitest.expect)((0,_styleKey.generateStyleKey)("")).toBe("_");});(0,_vitest.it)("should handle whitespace-only string",function(){(0,_vitest.expect)((0,_styleKey.generateStyleKey)("   ")).toBe("_");(0,_vitest.expect)((0,_styleKey.generateStyleKey)("\t\n")).toBe("_");});(0,_vitest.it)("should handle multiple consecutive spaces",function(){(0,_vitest.expect)((0,_styleKey.generateStyleKey)("m-4  p-2   bg-blue-500")).toBe("_bg_blue_500_m_4_p_2");(0,_vitest.expect)((0,_styleKey.generateStyleKey)("flex    items-center")).toBe("_flex_items_center");});(0,_vitest.it)("should handle leading and trailing spaces",function(){(0,_vitest.expect)((0,_styleKey.generateStyleKey)("  m-4 p-2  ")).toBe("_m_4_p_2");(0,_vitest.expect)((0,_styleKey.generateStyleKey)("\tflex items-center\n")).toBe("_flex_items_center");});(0,_vitest.it)("should handle opacity modifiers",function(){(0,_vitest.expect)((0,_styleKey.generateStyleKey)("bg-black/50")).toBe("_bg_black_50");(0,_vitest.expect)((0,_styleKey.generateStyleKey)("text-white/80")).toBe("_text_white_80");(0,_vitest.expect)((0,_styleKey.generateStyleKey)("border-blue-500/30")).toBe("_border_blue_500_30");});(0,_vitest.it)("should handle state modifiers",function(){(0,_vitest.expect)((0,_styleKey.generateStyleKey)("active:bg-blue-700")).toBe("_active_bg_blue_700");(0,_vitest.expect)((0,_styleKey.generateStyleKey)("focus:border-blue-500")).toBe("_focus_border_blue_500");(0,_vitest.expect)((0,_styleKey.generateStyleKey)("disabled:opacity-50")).toBe("_disabled_opacity_50");});(0,_vitest.it)("should handle complex combinations",function(){(0,_vitest.expect)((0,_styleKey.generateStyleKey)("m-4 p-2 bg-blue-500 text-white rounded-lg")).toBe("_bg_blue_500_m_4_p_2_rounded_lg_text_white");(0,_vitest.expect)((0,_styleKey.generateStyleKey)("flex items-center justify-between p-4 bg-gray-100 border-b-2")).toBe("_bg_gray_100_border_b_2_flex_items_center_justify_between_p_4");});(0,_vitest.it)("should handle arbitrary values in complex scenarios",function(){(0,_vitest.expect)((0,_styleKey.generateStyleKey)("m-[16px] p-[8px] bg-[#ff0000]")).toBe("_bg_ff0000_m_16px_p_8px_");(0,_vitest.expect)((0,_styleKey.generateStyleKey)("w-[100%] h-[50px] text-[14px]")).toBe("_h_50px_text_14px_w_100_");});(0,_vitest.it)("should produce consistent keys regardless of class order",function(){var combinations=["m-4 p-2 bg-blue-500","p-2 m-4 bg-blue-500","bg-blue-500 m-4 p-2","bg-blue-500 p-2 m-4","m-4 bg-blue-500 p-2","p-2 bg-blue-500 m-4"];var keys=combinations.map(_styleKey.generateStyleKey);var firstKey=keys[0];keys.forEach(function(key){(0,_vitest.expect)(key).toBe(firstKey);});});(0,_vitest.it)("should handle duplicate classes",function(){(0,_vitest.expect)((0,_styleKey.generateStyleKey)("m-4 m-4")).toBe("_m_4_m_4");(0,_vitest.expect)((0,_styleKey.generateStyleKey)("flex flex flex")).toBe("_flex_flex_flex");});(0,_vitest.it)("should handle transform classes",function(){(0,_vitest.expect)((0,_styleKey.generateStyleKey)("scale-110")).toBe("_scale_110");(0,_vitest.expect)((0,_styleKey.generateStyleKey)("rotate-45")).toBe("_rotate_45");(0,_vitest.expect)((0,_styleKey.generateStyleKey)("translate-x-4")).toBe("_translate_x_4");(0,_vitest.expect)((0,_styleKey.generateStyleKey)("-rotate-90")).toBe("__rotate_90");});(0,_vitest.it)("should handle negative values",function(){(0,_vitest.expect)((0,_styleKey.generateStyleKey)("-m-4")).toBe("__m_4");(0,_vitest.expect)((0,_styleKey.generateStyleKey)("-translate-x-8")).toBe("__translate_x_8");(0,_vitest.expect)((0,_styleKey.generateStyleKey)("-rotate-180")).toBe("__rotate_180");});(0,_vitest.it)("should be deterministic",function(){var className="m-4 p-2 bg-blue-500 text-white rounded-lg flex items-center";var key1=(0,_styleKey.generateStyleKey)(className);var key2=(0,_styleKey.generateStyleKey)(className);var key3=(0,_styleKey.generateStyleKey)(className);(0,_vitest.expect)(key1).toBe(key2);(0,_vitest.expect)(key2).toBe(key3);});(0,_vitest.it)("should create valid JavaScript identifiers",function(){var keys=[(0,_styleKey.generateStyleKey)("m-4"),(0,_styleKey.generateStyleKey)("bg-blue-500"),(0,_styleKey.generateStyleKey)("text-[14px]"),(0,_styleKey.generateStyleKey)("flex items-center"),(0,_styleKey.generateStyleKey)("active:bg-red-500")];keys.forEach(function(key){(0,_vitest.expect)(key).toMatch(/^_/);(0,_vitest.expect)(key).toMatch(/^[_a-zA-Z0-9]+$/);});});});

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mgcrea/react-native-tailwind",
-  "version": "0.6.1",
+  "version": "0.8.0",
   "description": "Compile-time Tailwind CSS for React Native with zero runtime overhead",
   "author": "Olivier Louvignes <olivier@mgcrea.io> (https://github.com/mgcrea)",
   "homepage": "https://github.com/mgcrea/react-native-tailwind#readme",
@@ -19,6 +19,11 @@
       "import": "./dist/babel/index.cjs",
       "require": "./dist/babel/index.cjs"
     },
+    "./runtime": {
+      "types": "./dist/runtime.d.ts",
+      "import": "./dist/runtime.js",
+      "require": "./dist/runtime.cjs"
+    },
     "./react-native": {
       "types": "./dist/react-native.d.ts"
     }
@@ -31,16 +36,17 @@
   ],
   "scripts": {
     "dev": "cd example; npm run dev",
-    "build": "npm run build:babel && npm run build:babel-plugin && npm run build:types",
+    "build": "npm run build:babel && npm run build:babel-plugin && npm run build:runtime && npm run build:types",
     "build:babel": "babel src --out-dir dist --extensions \".ts,.tsx,.js,.jsx\" --copy-files --ignore 'src/babel/**' --ignore '**/*.d.ts'",
     "build:babel-plugin": "node --experimental-strip-types scripts/bundle-babel-plugin.ts",
+    "build:runtime": "node --experimental-strip-types scripts/bundle-runtime.ts",
     "build:types": "tsc --project tsconfig.build.json --emitDeclarationOnly && node --experimental-strip-types scripts/post-build-types.ts",
     "install:ios": "cd example; npm run install:ios",
     "open:ios": "cd example; npm run open:ios",
     "lint": "eslint src/",
     "prettify": "prettier --write src/",
     "check": "tsc --noEmit",
-    "spec": "vitest",
+    "spec": "vitest --run",
     "test": "npm run lint && npm run check && npm run spec",
     "prepare": "npm run build"
   },
@@ -52,6 +58,7 @@
     "@babel/cli": "^7.28.3",
     "@babel/core": "^7.28.5",
     "@babel/plugin-transform-modules-commonjs": "^7.27.1",
+    "@babel/preset-react": "^7.28.5",
     "@babel/preset-typescript": "^7.28.5",
     "@babel/runtime": "^7.28.4",
     "@babel/types": "^7.28.5",
@@ -80,5 +87,10 @@
   "packageManager": "pnpm@10.22.0",
   "publishConfig": {
     "access": "public"
+  },
+  "pnpm": {
+    "onlyBuiltDependencies": [
+      "esbuild"
+    ]
   }
 }

package/src/babel/config-loader.ts

@@ -7,6 +7,7 @@
 
 import * as fs from "fs";
 import * as path from "path";
+import { flattenColors } from "../utils/flattenColors";
 
 export type TailwindConfig = {
   theme?: {
@@ -79,29 +80,6 @@ export function loadTailwindConfig(configPath: string): TailwindConfig | null {
   }
 }
 
-/**
- * Flatten nested color objects into dot notation
- * Example: { brand: { light: '#fff', dark: '#000' } } -> { 'brand-light': '#fff', 'brand-dark': '#000' }
- */
-function flattenColors(
-  colors: Record<string, string | Record<string, string>>,
-  prefix = "",
-): Record<string, string> {
-  const result: Record<string, string> = {};
-
-  for (const [key, value] of Object.entries(colors)) {
-    const newKey = prefix ? `${prefix}-${key}` : key;
-
-    if (typeof value === "string") {
-      result[newKey] = value;
-    } else if (typeof value === "object" && value !== null) {
-      Object.assign(result, flattenColors(value, newKey));
-    }
-  }
-
-  return result;
-}
-
 /**
  * Extract custom colors from tailwind config
  * Prefers theme.extend.colors over theme.colors to avoid overriding defaults