@mgcrea/react-native-tailwind 0.6.0 → 0.6.1

package/dist/parser/typography.js

@@ -1 +1 @@
-Object.defineProperty(exports,"__esModule",{value:true});exports.LETTER_SPACING_SCALE=exports.FONT_SIZES=void 0;exports.parseTypography=parseTypography;var FONT_SIZES=exports.FONT_SIZES={xs:12,sm:14,base:16,lg:18,xl:20,"2xl":24,"3xl":30,"4xl":36,"5xl":48,"6xl":60,"7xl":72,"8xl":96,"9xl":128};var LETTER_SPACING_SCALE=exports.LETTER_SPACING_SCALE={tighter:-0.8,tight:-0.4,normal:0,wide:0.4,wider:0.8,widest:1.6};var FONT_WEIGHT_MAP={"font-thin":{fontWeight:"100"},"font-extralight":{fontWeight:"200"},"font-light":{fontWeight:"300"},"font-normal":{fontWeight:"400"},"font-medium":{fontWeight:"500"},"font-semibold":{fontWeight:"600"},"font-bold":{fontWeight:"700"},"font-extrabold":{fontWeight:"800"},"font-black":{fontWeight:"900"}};var FONT_STYLE_MAP={italic:{fontStyle:"italic"},"not-italic":{fontStyle:"normal"}};var TEXT_ALIGN_MAP={"text-left":{textAlign:"left"},"text-center":{textAlign:"center"},"text-right":{textAlign:"right"},"text-justify":{textAlign:"justify"}};var TEXT_DECORATION_MAP={underline:{textDecorationLine:"underline"},"line-through":{textDecorationLine:"line-through"},"no-underline":{textDecorationLine:"none"}};var TEXT_TRANSFORM_MAP={uppercase:{textTransform:"uppercase"},lowercase:{textTransform:"lowercase"},capitalize:{textTransform:"capitalize"},"normal-case":{textTransform:"none"}};var LINE_HEIGHT_MAP={"leading-none":{lineHeight:16},"leading-tight":{lineHeight:20},"leading-snug":{lineHeight:22},"leading-normal":{lineHeight:24},"leading-relaxed":{lineHeight:28},"leading-loose":{lineHeight:32}};var TRACKING_MAP={"tracking-tighter":{letterSpacing:-0.8},"tracking-tight":{letterSpacing:-0.4},"tracking-normal":{letterSpacing:0},"tracking-wide":{letterSpacing:0.4},"tracking-wider":{letterSpacing:0.8},"tracking-widest":{letterSpacing:1.6}};function parseArbitraryFontSize(value){var pxMatch=value.match(/^\[(\d+)(?:px)?\]$/);if(pxMatch){return parseInt(pxMatch[1],10);}if(value.startsWith("[")&&value.endsWith("]")){if(process.env.NODE_ENV!=="production"){console.warn(`[react-native-tailwind] Unsupported arbitrary font size value: ${value}. Only px values are supported (e.g., [18px] or [18]).`);}return null;}return null;}function parseArbitraryLineHeight(value){var pxMatch=value.match(/^\[(\d+)(?:px)?\]$/);if(pxMatch){return parseInt(pxMatch[1],10);}if(value.startsWith("[")&&value.endsWith("]")){if(process.env.NODE_ENV!=="production"){console.warn(`[react-native-tailwind] Unsupported arbitrary line height value: ${value}. Only px values are supported (e.g., [24px] or [24]).`);}return null;}return null;}function parseTypography(cls){var _ref,_ref2,_ref3,_ref4,_ref5,_ref6,_FONT_WEIGHT_MAP$cls;if(cls.startsWith("text-")){var sizeKey=cls.substring(5);var arbitraryValue=parseArbitraryFontSize(sizeKey);if(arbitraryValue!==null){return{fontSize:arbitraryValue};}var fontSize=FONT_SIZES[sizeKey];if(fontSize!==undefined){return{fontSize:fontSize};}}if(cls.startsWith("leading-")){var heightKey=cls.substring(8);var _arbitraryValue=parseArbitraryLineHeight(heightKey);if(_arbitraryValue!==null){return{lineHeight:_arbitraryValue};}}return(_ref=(_ref2=(_ref3=(_ref4=(_ref5=(_ref6=(_FONT_WEIGHT_MAP$cls=FONT_WEIGHT_MAP[cls])!=null?_FONT_WEIGHT_MAP$cls:FONT_STYLE_MAP[cls])!=null?_ref6:TEXT_ALIGN_MAP[cls])!=null?_ref5:TEXT_DECORATION_MAP[cls])!=null?_ref4:TEXT_TRANSFORM_MAP[cls])!=null?_ref3:LINE_HEIGHT_MAP[cls])!=null?_ref2:TRACKING_MAP[cls])!=null?_ref:null;}
+Object.defineProperty(exports,"__esModule",{value:true});exports.LETTER_SPACING_SCALE=exports.FONT_SIZES=void 0;exports.parseTypography=parseTypography;var FONT_SIZES=exports.FONT_SIZES={xs:12,sm:14,base:16,lg:18,xl:20,"2xl":24,"3xl":30,"4xl":36,"5xl":48,"6xl":60,"7xl":72,"8xl":96,"9xl":128};var LETTER_SPACING_SCALE=exports.LETTER_SPACING_SCALE={tighter:-0.8,tight:-0.4,normal:0,wide:0.4,wider:0.8,widest:1.6};var FONT_FAMILY_MAP={"font-sans":{fontFamily:"System"},"font-serif":{fontFamily:"serif"},"font-mono":{fontFamily:"Courier"}};var FONT_WEIGHT_MAP={"font-thin":{fontWeight:"100"},"font-extralight":{fontWeight:"200"},"font-light":{fontWeight:"300"},"font-normal":{fontWeight:"400"},"font-medium":{fontWeight:"500"},"font-semibold":{fontWeight:"600"},"font-bold":{fontWeight:"700"},"font-extrabold":{fontWeight:"800"},"font-black":{fontWeight:"900"}};var FONT_STYLE_MAP={italic:{fontStyle:"italic"},"not-italic":{fontStyle:"normal"}};var TEXT_ALIGN_MAP={"text-left":{textAlign:"left"},"text-center":{textAlign:"center"},"text-right":{textAlign:"right"},"text-justify":{textAlign:"justify"}};var TEXT_DECORATION_MAP={underline:{textDecorationLine:"underline"},"line-through":{textDecorationLine:"line-through"},"no-underline":{textDecorationLine:"none"}};var TEXT_TRANSFORM_MAP={uppercase:{textTransform:"uppercase"},lowercase:{textTransform:"lowercase"},capitalize:{textTransform:"capitalize"},"normal-case":{textTransform:"none"}};var LINE_HEIGHT_MAP={"leading-none":{lineHeight:16},"leading-tight":{lineHeight:20},"leading-snug":{lineHeight:22},"leading-normal":{lineHeight:24},"leading-relaxed":{lineHeight:28},"leading-loose":{lineHeight:32}};var TRACKING_MAP={"tracking-tighter":{letterSpacing:-0.8},"tracking-tight":{letterSpacing:-0.4},"tracking-normal":{letterSpacing:0},"tracking-wide":{letterSpacing:0.4},"tracking-wider":{letterSpacing:0.8},"tracking-widest":{letterSpacing:1.6}};function parseArbitraryFontSize(value){var pxMatch=value.match(/^\[(\d+)(?:px)?\]$/);if(pxMatch){return parseInt(pxMatch[1],10);}if(value.startsWith("[")&&value.endsWith("]")){if(process.env.NODE_ENV!=="production"){console.warn(`[react-native-tailwind] Unsupported arbitrary font size value: ${value}. Only px values are supported (e.g., [18px] or [18]).`);}return null;}return null;}function parseArbitraryLineHeight(value){var pxMatch=value.match(/^\[(\d+)(?:px)?\]$/);if(pxMatch){return parseInt(pxMatch[1],10);}if(value.startsWith("[")&&value.endsWith("]")){if(process.env.NODE_ENV!=="production"){console.warn(`[react-native-tailwind] Unsupported arbitrary line height value: ${value}. Only px values are supported (e.g., [24px] or [24]).`);}return null;}return null;}function parseTypography(cls){var _ref,_ref2,_ref3,_ref4,_ref5,_ref6,_ref7,_FONT_FAMILY_MAP$cls;if(cls.startsWith("text-")){var sizeKey=cls.substring(5);var arbitraryValue=parseArbitraryFontSize(sizeKey);if(arbitraryValue!==null){return{fontSize:arbitraryValue};}var fontSize=FONT_SIZES[sizeKey];if(fontSize!==undefined){return{fontSize:fontSize};}}if(cls.startsWith("leading-")){var heightKey=cls.substring(8);var _arbitraryValue=parseArbitraryLineHeight(heightKey);if(_arbitraryValue!==null){return{lineHeight:_arbitraryValue};}}return(_ref=(_ref2=(_ref3=(_ref4=(_ref5=(_ref6=(_ref7=(_FONT_FAMILY_MAP$cls=FONT_FAMILY_MAP[cls])!=null?_FONT_FAMILY_MAP$cls:FONT_WEIGHT_MAP[cls])!=null?_ref7:FONT_STYLE_MAP[cls])!=null?_ref6:TEXT_ALIGN_MAP[cls])!=null?_ref5:TEXT_DECORATION_MAP[cls])!=null?_ref4:TEXT_TRANSFORM_MAP[cls])!=null?_ref3:LINE_HEIGHT_MAP[cls])!=null?_ref2:TRACKING_MAP[cls])!=null?_ref:null;}

package/dist/parser/typography.test.js

@@ -1 +1 @@
-var _vitest=require("vitest");var _typography=require("./typography");(0,_vitest.describe)("FONT_SIZES",function(){(0,_vitest.it)("should export complete font size scale",function(){(0,_vitest.expect)(_typography.FONT_SIZES).toMatchSnapshot();});});(0,_vitest.describe)("LETTER_SPACING_SCALE",function(){(0,_vitest.it)("should export complete letter spacing scale",function(){(0,_vitest.expect)(_typography.LETTER_SPACING_SCALE).toMatchSnapshot();});});(0,_vitest.describe)("parseTypography - font size",function(){(0,_vitest.it)("should parse font size with preset values",function(){(0,_vitest.expect)((0,_typography.parseTypography)("text-xs")).toEqual({fontSize:12});(0,_vitest.expect)((0,_typography.parseTypography)("text-sm")).toEqual({fontSize:14});(0,_vitest.expect)((0,_typography.parseTypography)("text-base")).toEqual({fontSize:16});(0,_vitest.expect)((0,_typography.parseTypography)("text-lg")).toEqual({fontSize:18});(0,_vitest.expect)((0,_typography.parseTypography)("text-xl")).toEqual({fontSize:20});(0,_vitest.expect)((0,_typography.parseTypography)("text-2xl")).toEqual({fontSize:24});(0,_vitest.expect)((0,_typography.parseTypography)("text-3xl")).toEqual({fontSize:30});(0,_vitest.expect)((0,_typography.parseTypography)("text-4xl")).toEqual({fontSize:36});(0,_vitest.expect)((0,_typography.parseTypography)("text-5xl")).toEqual({fontSize:48});(0,_vitest.expect)((0,_typography.parseTypography)("text-6xl")).toEqual({fontSize:60});(0,_vitest.expect)((0,_typography.parseTypography)("text-7xl")).toEqual({fontSize:72});(0,_vitest.expect)((0,_typography.parseTypography)("text-8xl")).toEqual({fontSize:96});(0,_vitest.expect)((0,_typography.parseTypography)("text-9xl")).toEqual({fontSize:128});});(0,_vitest.it)("should parse font size with arbitrary pixel values",function(){(0,_vitest.expect)((0,_typography.parseTypography)("text-[13px]")).toEqual({fontSize:13});(0,_vitest.expect)((0,_typography.parseTypography)("text-[13]")).toEqual({fontSize:13});(0,_vitest.expect)((0,_typography.parseTypography)("text-[18px]")).toEqual({fontSize:18});(0,_vitest.expect)((0,_typography.parseTypography)("text-[18]")).toEqual({fontSize:18});(0,_vitest.expect)((0,_typography.parseTypography)("text-[22px]")).toEqual({fontSize:22});(0,_vitest.expect)((0,_typography.parseTypography)("text-[22]")).toEqual({fontSize:22});(0,_vitest.expect)((0,_typography.parseTypography)("text-[100px]")).toEqual({fontSize:100});});});(0,_vitest.describe)("parseTypography - font weight",function(){(0,_vitest.it)("should parse font weight values",function(){(0,_vitest.expect)((0,_typography.parseTypography)("font-thin")).toEqual({fontWeight:"100"});(0,_vitest.expect)((0,_typography.parseTypography)("font-extralight")).toEqual({fontWeight:"200"});(0,_vitest.expect)((0,_typography.parseTypography)("font-light")).toEqual({fontWeight:"300"});(0,_vitest.expect)((0,_typography.parseTypography)("font-normal")).toEqual({fontWeight:"400"});(0,_vitest.expect)((0,_typography.parseTypography)("font-medium")).toEqual({fontWeight:"500"});(0,_vitest.expect)((0,_typography.parseTypography)("font-semibold")).toEqual({fontWeight:"600"});(0,_vitest.expect)((0,_typography.parseTypography)("font-bold")).toEqual({fontWeight:"700"});(0,_vitest.expect)((0,_typography.parseTypography)("font-extrabold")).toEqual({fontWeight:"800"});(0,_vitest.expect)((0,_typography.parseTypography)("font-black")).toEqual({fontWeight:"900"});});});(0,_vitest.describe)("parseTypography - font style",function(){(0,_vitest.it)("should parse font style values",function(){(0,_vitest.expect)((0,_typography.parseTypography)("italic")).toEqual({fontStyle:"italic"});(0,_vitest.expect)((0,_typography.parseTypography)("not-italic")).toEqual({fontStyle:"normal"});});});(0,_vitest.describe)("parseTypography - text alignment",function(){(0,_vitest.it)("should parse text alignment values",function(){(0,_vitest.expect)((0,_typography.parseTypography)("text-left")).toEqual({textAlign:"left"});(0,_vitest.expect)((0,_typography.parseTypography)("text-center")).toEqual({textAlign:"center"});(0,_vitest.expect)((0,_typography.parseTypography)("text-right")).toEqual({textAlign:"right"});(0,_vitest.expect)((0,_typography.parseTypography)("text-justify")).toEqual({textAlign:"justify"});});});(0,_vitest.describe)("parseTypography - text decoration",function(){(0,_vitest.it)("should parse text decoration values",function(){(0,_vitest.expect)((0,_typography.parseTypography)("underline")).toEqual({textDecorationLine:"underline"});(0,_vitest.expect)((0,_typography.parseTypography)("line-through")).toEqual({textDecorationLine:"line-through"});(0,_vitest.expect)((0,_typography.parseTypography)("no-underline")).toEqual({textDecorationLine:"none"});});});(0,_vitest.describe)("parseTypography - text transform",function(){(0,_vitest.it)("should parse text transform values",function(){(0,_vitest.expect)((0,_typography.parseTypography)("uppercase")).toEqual({textTransform:"uppercase"});(0,_vitest.expect)((0,_typography.parseTypography)("lowercase")).toEqual({textTransform:"lowercase"});(0,_vitest.expect)((0,_typography.parseTypography)("capitalize")).toEqual({textTransform:"capitalize"});(0,_vitest.expect)((0,_typography.parseTypography)("normal-case")).toEqual({textTransform:"none"});});});(0,_vitest.describe)("parseTypography - line height",function(){(0,_vitest.it)("should parse line height with preset values",function(){(0,_vitest.expect)((0,_typography.parseTypography)("leading-none")).toEqual({lineHeight:16});(0,_vitest.expect)((0,_typography.parseTypography)("leading-tight")).toEqual({lineHeight:20});(0,_vitest.expect)((0,_typography.parseTypography)("leading-snug")).toEqual({lineHeight:22});(0,_vitest.expect)((0,_typography.parseTypography)("leading-normal")).toEqual({lineHeight:24});(0,_vitest.expect)((0,_typography.parseTypography)("leading-relaxed")).toEqual({lineHeight:28});(0,_vitest.expect)((0,_typography.parseTypography)("leading-loose")).toEqual({lineHeight:32});});(0,_vitest.it)("should parse line height with arbitrary pixel values",function(){(0,_vitest.expect)((0,_typography.parseTypography)("leading-[24px]")).toEqual({lineHeight:24});(0,_vitest.expect)((0,_typography.parseTypography)("leading-[24]")).toEqual({lineHeight:24});(0,_vitest.expect)((0,_typography.parseTypography)("leading-[30px]")).toEqual({lineHeight:30});(0,_vitest.expect)((0,_typography.parseTypography)("leading-[30]")).toEqual({lineHeight:30});(0,_vitest.expect)((0,_typography.parseTypography)("leading-[50px]")).toEqual({lineHeight:50});});});(0,_vitest.describe)("parseTypography - letter spacing",function(){(0,_vitest.it)("should parse letter spacing with preset values",function(){(0,_vitest.expect)((0,_typography.parseTypography)("tracking-tighter")).toEqual({letterSpacing:-0.8});(0,_vitest.expect)((0,_typography.parseTypography)("tracking-tight")).toEqual({letterSpacing:-0.4});(0,_vitest.expect)((0,_typography.parseTypography)("tracking-normal")).toEqual({letterSpacing:0});(0,_vitest.expect)((0,_typography.parseTypography)("tracking-wide")).toEqual({letterSpacing:0.4});(0,_vitest.expect)((0,_typography.parseTypography)("tracking-wider")).toEqual({letterSpacing:0.8});(0,_vitest.expect)((0,_typography.parseTypography)("tracking-widest")).toEqual({letterSpacing:1.6});});});(0,_vitest.describe)("parseTypography - edge cases",function(){(0,_vitest.it)("should return null for invalid classes",function(){(0,_vitest.expect)((0,_typography.parseTypography)("invalid")).toBeNull();(0,_vitest.expect)((0,_typography.parseTypography)("text")).toBeNull();(0,_vitest.expect)((0,_typography.parseTypography)("font")).toBeNull();(0,_vitest.expect)((0,_typography.parseTypography)("leading")).toBeNull();(0,_vitest.expect)((0,_typography.parseTypography)("tracking")).toBeNull();});(0,_vitest.it)("should return null for invalid font size values",function(){(0,_vitest.expect)((0,_typography.parseTypography)("text-invalid")).toBeNull();(0,_vitest.expect)((0,_typography.parseTypography)("text-10xl")).toBeNull();});(0,_vitest.it)("should return null for invalid font weight values",function(){(0,_vitest.expect)((0,_typography.parseTypography)("font-invalid")).toBeNull();(0,_vitest.expect)((0,_typography.parseTypography)("font-100")).toBeNull();});(0,_vitest.it)("should return null for arbitrary values with unsupported units",function(){(0,_vitest.expect)((0,_typography.parseTypography)("text-[16rem]")).toBeNull();(0,_vitest.expect)((0,_typography.parseTypography)("text-[2em]")).toBeNull();(0,_vitest.expect)((0,_typography.parseTypography)("leading-[2rem]")).toBeNull();(0,_vitest.expect)((0,_typography.parseTypography)("leading-[1.5em]")).toBeNull();});(0,_vitest.it)("should return null for malformed arbitrary values",function(){(0,_vitest.expect)((0,_typography.parseTypography)("text-[16")).toBeNull();(0,_vitest.expect)((0,_typography.parseTypography)("text-16]")).toBeNull();(0,_vitest.expect)((0,_typography.parseTypography)("text-[]")).toBeNull();(0,_vitest.expect)((0,_typography.parseTypography)("leading-[24")).toBeNull();(0,_vitest.expect)((0,_typography.parseTypography)("leading-24]")).toBeNull();});(0,_vitest.it)("should not match partial class names",function(){(0,_vitest.expect)((0,_typography.parseTypography)("mytext-lg")).toBeNull();(0,_vitest.expect)((0,_typography.parseTypography)("font-bold-extra")).toBeNull();(0,_vitest.expect)((0,_typography.parseTypography)("italic-text")).toBeNull();});});(0,_vitest.describe)("parseTypography - comprehensive coverage",function(){(0,_vitest.it)("should handle all typography categories independently",function(){(0,_vitest.expect)((0,_typography.parseTypography)("text-base")).toEqual({fontSize:16});(0,_vitest.expect)((0,_typography.parseTypography)("font-bold")).toEqual({fontWeight:"700"});(0,_vitest.expect)((0,_typography.parseTypography)("italic")).toEqual({fontStyle:"italic"});(0,_vitest.expect)((0,_typography.parseTypography)("text-center")).toEqual({textAlign:"center"});(0,_vitest.expect)((0,_typography.parseTypography)("underline")).toEqual({textDecorationLine:"underline"});(0,_vitest.expect)((0,_typography.parseTypography)("uppercase")).toEqual({textTransform:"uppercase"});(0,_vitest.expect)((0,_typography.parseTypography)("leading-normal")).toEqual({lineHeight:24});(0,_vitest.expect)((0,_typography.parseTypography)("tracking-wide")).toEqual({letterSpacing:0.4});});(0,_vitest.it)("should handle arbitrary values for font size and line height",function(){(0,_vitest.expect)((0,_typography.parseTypography)("text-[19px]")).toEqual({fontSize:19});(0,_vitest.expect)((0,_typography.parseTypography)("text-[19]")).toEqual({fontSize:19});(0,_vitest.expect)((0,_typography.parseTypography)("leading-[26px]")).toEqual({lineHeight:26});(0,_vitest.expect)((0,_typography.parseTypography)("leading-[26]")).toEqual({lineHeight:26});});(0,_vitest.it)("should handle edge case values",function(){(0,_vitest.expect)((0,_typography.parseTypography)("text-xs")).toEqual({fontSize:12});(0,_vitest.expect)((0,_typography.parseTypography)("text-9xl")).toEqual({fontSize:128});(0,_vitest.expect)((0,_typography.parseTypography)("leading-none")).toEqual({lineHeight:16});(0,_vitest.expect)((0,_typography.parseTypography)("leading-loose")).toEqual({lineHeight:32});(0,_vitest.expect)((0,_typography.parseTypography)("tracking-tighter")).toEqual({letterSpacing:-0.8});(0,_vitest.expect)((0,_typography.parseTypography)("tracking-widest")).toEqual({letterSpacing:1.6});});});
+var _vitest=require("vitest");var _typography=require("./typography");(0,_vitest.describe)("FONT_SIZES",function(){(0,_vitest.it)("should export complete font size scale",function(){(0,_vitest.expect)(_typography.FONT_SIZES).toMatchSnapshot();});});(0,_vitest.describe)("LETTER_SPACING_SCALE",function(){(0,_vitest.it)("should export complete letter spacing scale",function(){(0,_vitest.expect)(_typography.LETTER_SPACING_SCALE).toMatchSnapshot();});});(0,_vitest.describe)("parseTypography - font size",function(){(0,_vitest.it)("should parse font size with preset values",function(){(0,_vitest.expect)((0,_typography.parseTypography)("text-xs")).toEqual({fontSize:12});(0,_vitest.expect)((0,_typography.parseTypography)("text-sm")).toEqual({fontSize:14});(0,_vitest.expect)((0,_typography.parseTypography)("text-base")).toEqual({fontSize:16});(0,_vitest.expect)((0,_typography.parseTypography)("text-lg")).toEqual({fontSize:18});(0,_vitest.expect)((0,_typography.parseTypography)("text-xl")).toEqual({fontSize:20});(0,_vitest.expect)((0,_typography.parseTypography)("text-2xl")).toEqual({fontSize:24});(0,_vitest.expect)((0,_typography.parseTypography)("text-3xl")).toEqual({fontSize:30});(0,_vitest.expect)((0,_typography.parseTypography)("text-4xl")).toEqual({fontSize:36});(0,_vitest.expect)((0,_typography.parseTypography)("text-5xl")).toEqual({fontSize:48});(0,_vitest.expect)((0,_typography.parseTypography)("text-6xl")).toEqual({fontSize:60});(0,_vitest.expect)((0,_typography.parseTypography)("text-7xl")).toEqual({fontSize:72});(0,_vitest.expect)((0,_typography.parseTypography)("text-8xl")).toEqual({fontSize:96});(0,_vitest.expect)((0,_typography.parseTypography)("text-9xl")).toEqual({fontSize:128});});(0,_vitest.it)("should parse font size with arbitrary pixel values",function(){(0,_vitest.expect)((0,_typography.parseTypography)("text-[13px]")).toEqual({fontSize:13});(0,_vitest.expect)((0,_typography.parseTypography)("text-[13]")).toEqual({fontSize:13});(0,_vitest.expect)((0,_typography.parseTypography)("text-[18px]")).toEqual({fontSize:18});(0,_vitest.expect)((0,_typography.parseTypography)("text-[18]")).toEqual({fontSize:18});(0,_vitest.expect)((0,_typography.parseTypography)("text-[22px]")).toEqual({fontSize:22});(0,_vitest.expect)((0,_typography.parseTypography)("text-[22]")).toEqual({fontSize:22});(0,_vitest.expect)((0,_typography.parseTypography)("text-[100px]")).toEqual({fontSize:100});});});(0,_vitest.describe)("parseTypography - font family",function(){(0,_vitest.it)("should parse font family values",function(){(0,_vitest.expect)((0,_typography.parseTypography)("font-sans")).toEqual({fontFamily:"System"});(0,_vitest.expect)((0,_typography.parseTypography)("font-serif")).toEqual({fontFamily:"serif"});(0,_vitest.expect)((0,_typography.parseTypography)("font-mono")).toEqual({fontFamily:"Courier"});});});(0,_vitest.describe)("parseTypography - font weight",function(){(0,_vitest.it)("should parse font weight values",function(){(0,_vitest.expect)((0,_typography.parseTypography)("font-thin")).toEqual({fontWeight:"100"});(0,_vitest.expect)((0,_typography.parseTypography)("font-extralight")).toEqual({fontWeight:"200"});(0,_vitest.expect)((0,_typography.parseTypography)("font-light")).toEqual({fontWeight:"300"});(0,_vitest.expect)((0,_typography.parseTypography)("font-normal")).toEqual({fontWeight:"400"});(0,_vitest.expect)((0,_typography.parseTypography)("font-medium")).toEqual({fontWeight:"500"});(0,_vitest.expect)((0,_typography.parseTypography)("font-semibold")).toEqual({fontWeight:"600"});(0,_vitest.expect)((0,_typography.parseTypography)("font-bold")).toEqual({fontWeight:"700"});(0,_vitest.expect)((0,_typography.parseTypography)("font-extrabold")).toEqual({fontWeight:"800"});(0,_vitest.expect)((0,_typography.parseTypography)("font-black")).toEqual({fontWeight:"900"});});});(0,_vitest.describe)("parseTypography - font style",function(){(0,_vitest.it)("should parse font style values",function(){(0,_vitest.expect)((0,_typography.parseTypography)("italic")).toEqual({fontStyle:"italic"});(0,_vitest.expect)((0,_typography.parseTypography)("not-italic")).toEqual({fontStyle:"normal"});});});(0,_vitest.describe)("parseTypography - text alignment",function(){(0,_vitest.it)("should parse text alignment values",function(){(0,_vitest.expect)((0,_typography.parseTypography)("text-left")).toEqual({textAlign:"left"});(0,_vitest.expect)((0,_typography.parseTypography)("text-center")).toEqual({textAlign:"center"});(0,_vitest.expect)((0,_typography.parseTypography)("text-right")).toEqual({textAlign:"right"});(0,_vitest.expect)((0,_typography.parseTypography)("text-justify")).toEqual({textAlign:"justify"});});});(0,_vitest.describe)("parseTypography - text decoration",function(){(0,_vitest.it)("should parse text decoration values",function(){(0,_vitest.expect)((0,_typography.parseTypography)("underline")).toEqual({textDecorationLine:"underline"});(0,_vitest.expect)((0,_typography.parseTypography)("line-through")).toEqual({textDecorationLine:"line-through"});(0,_vitest.expect)((0,_typography.parseTypography)("no-underline")).toEqual({textDecorationLine:"none"});});});(0,_vitest.describe)("parseTypography - text transform",function(){(0,_vitest.it)("should parse text transform values",function(){(0,_vitest.expect)((0,_typography.parseTypography)("uppercase")).toEqual({textTransform:"uppercase"});(0,_vitest.expect)((0,_typography.parseTypography)("lowercase")).toEqual({textTransform:"lowercase"});(0,_vitest.expect)((0,_typography.parseTypography)("capitalize")).toEqual({textTransform:"capitalize"});(0,_vitest.expect)((0,_typography.parseTypography)("normal-case")).toEqual({textTransform:"none"});});});(0,_vitest.describe)("parseTypography - line height",function(){(0,_vitest.it)("should parse line height with preset values",function(){(0,_vitest.expect)((0,_typography.parseTypography)("leading-none")).toEqual({lineHeight:16});(0,_vitest.expect)((0,_typography.parseTypography)("leading-tight")).toEqual({lineHeight:20});(0,_vitest.expect)((0,_typography.parseTypography)("leading-snug")).toEqual({lineHeight:22});(0,_vitest.expect)((0,_typography.parseTypography)("leading-normal")).toEqual({lineHeight:24});(0,_vitest.expect)((0,_typography.parseTypography)("leading-relaxed")).toEqual({lineHeight:28});(0,_vitest.expect)((0,_typography.parseTypography)("leading-loose")).toEqual({lineHeight:32});});(0,_vitest.it)("should parse line height with arbitrary pixel values",function(){(0,_vitest.expect)((0,_typography.parseTypography)("leading-[24px]")).toEqual({lineHeight:24});(0,_vitest.expect)((0,_typography.parseTypography)("leading-[24]")).toEqual({lineHeight:24});(0,_vitest.expect)((0,_typography.parseTypography)("leading-[30px]")).toEqual({lineHeight:30});(0,_vitest.expect)((0,_typography.parseTypography)("leading-[30]")).toEqual({lineHeight:30});(0,_vitest.expect)((0,_typography.parseTypography)("leading-[50px]")).toEqual({lineHeight:50});});});(0,_vitest.describe)("parseTypography - letter spacing",function(){(0,_vitest.it)("should parse letter spacing with preset values",function(){(0,_vitest.expect)((0,_typography.parseTypography)("tracking-tighter")).toEqual({letterSpacing:-0.8});(0,_vitest.expect)((0,_typography.parseTypography)("tracking-tight")).toEqual({letterSpacing:-0.4});(0,_vitest.expect)((0,_typography.parseTypography)("tracking-normal")).toEqual({letterSpacing:0});(0,_vitest.expect)((0,_typography.parseTypography)("tracking-wide")).toEqual({letterSpacing:0.4});(0,_vitest.expect)((0,_typography.parseTypography)("tracking-wider")).toEqual({letterSpacing:0.8});(0,_vitest.expect)((0,_typography.parseTypography)("tracking-widest")).toEqual({letterSpacing:1.6});});});(0,_vitest.describe)("parseTypography - edge cases",function(){(0,_vitest.it)("should return null for invalid classes",function(){(0,_vitest.expect)((0,_typography.parseTypography)("invalid")).toBeNull();(0,_vitest.expect)((0,_typography.parseTypography)("text")).toBeNull();(0,_vitest.expect)((0,_typography.parseTypography)("font")).toBeNull();(0,_vitest.expect)((0,_typography.parseTypography)("leading")).toBeNull();(0,_vitest.expect)((0,_typography.parseTypography)("tracking")).toBeNull();});(0,_vitest.it)("should return null for invalid font size values",function(){(0,_vitest.expect)((0,_typography.parseTypography)("text-invalid")).toBeNull();(0,_vitest.expect)((0,_typography.parseTypography)("text-10xl")).toBeNull();});(0,_vitest.it)("should return null for invalid font weight values",function(){(0,_vitest.expect)((0,_typography.parseTypography)("font-invalid")).toBeNull();(0,_vitest.expect)((0,_typography.parseTypography)("font-100")).toBeNull();});(0,_vitest.it)("should return null for arbitrary values with unsupported units",function(){(0,_vitest.expect)((0,_typography.parseTypography)("text-[16rem]")).toBeNull();(0,_vitest.expect)((0,_typography.parseTypography)("text-[2em]")).toBeNull();(0,_vitest.expect)((0,_typography.parseTypography)("leading-[2rem]")).toBeNull();(0,_vitest.expect)((0,_typography.parseTypography)("leading-[1.5em]")).toBeNull();});(0,_vitest.it)("should return null for malformed arbitrary values",function(){(0,_vitest.expect)((0,_typography.parseTypography)("text-[16")).toBeNull();(0,_vitest.expect)((0,_typography.parseTypography)("text-16]")).toBeNull();(0,_vitest.expect)((0,_typography.parseTypography)("text-[]")).toBeNull();(0,_vitest.expect)((0,_typography.parseTypography)("leading-[24")).toBeNull();(0,_vitest.expect)((0,_typography.parseTypography)("leading-24]")).toBeNull();});(0,_vitest.it)("should not match partial class names",function(){(0,_vitest.expect)((0,_typography.parseTypography)("mytext-lg")).toBeNull();(0,_vitest.expect)((0,_typography.parseTypography)("font-bold-extra")).toBeNull();(0,_vitest.expect)((0,_typography.parseTypography)("italic-text")).toBeNull();});});(0,_vitest.describe)("parseTypography - comprehensive coverage",function(){(0,_vitest.it)("should handle all typography categories independently",function(){(0,_vitest.expect)((0,_typography.parseTypography)("text-base")).toEqual({fontSize:16});(0,_vitest.expect)((0,_typography.parseTypography)("font-mono")).toEqual({fontFamily:"Courier"});(0,_vitest.expect)((0,_typography.parseTypography)("font-bold")).toEqual({fontWeight:"700"});(0,_vitest.expect)((0,_typography.parseTypography)("italic")).toEqual({fontStyle:"italic"});(0,_vitest.expect)((0,_typography.parseTypography)("text-center")).toEqual({textAlign:"center"});(0,_vitest.expect)((0,_typography.parseTypography)("underline")).toEqual({textDecorationLine:"underline"});(0,_vitest.expect)((0,_typography.parseTypography)("uppercase")).toEqual({textTransform:"uppercase"});(0,_vitest.expect)((0,_typography.parseTypography)("leading-normal")).toEqual({lineHeight:24});(0,_vitest.expect)((0,_typography.parseTypography)("tracking-wide")).toEqual({letterSpacing:0.4});});(0,_vitest.it)("should handle arbitrary values for font size and line height",function(){(0,_vitest.expect)((0,_typography.parseTypography)("text-[19px]")).toEqual({fontSize:19});(0,_vitest.expect)((0,_typography.parseTypography)("text-[19]")).toEqual({fontSize:19});(0,_vitest.expect)((0,_typography.parseTypography)("leading-[26px]")).toEqual({lineHeight:26});(0,_vitest.expect)((0,_typography.parseTypography)("leading-[26]")).toEqual({lineHeight:26});});(0,_vitest.it)("should handle edge case values",function(){(0,_vitest.expect)((0,_typography.parseTypography)("text-xs")).toEqual({fontSize:12});(0,_vitest.expect)((0,_typography.parseTypography)("text-9xl")).toEqual({fontSize:128});(0,_vitest.expect)((0,_typography.parseTypography)("leading-none")).toEqual({lineHeight:16});(0,_vitest.expect)((0,_typography.parseTypography)("leading-loose")).toEqual({lineHeight:32});(0,_vitest.expect)((0,_typography.parseTypography)("tracking-tighter")).toEqual({letterSpacing:-0.8});(0,_vitest.expect)((0,_typography.parseTypography)("tracking-widest")).toEqual({letterSpacing:1.6});});});

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mgcrea/react-native-tailwind",
-  "version": "0.6.0",
+  "version": "0.6.1",
   "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",

package/src/components/Pressable.tsx

@@ -21,6 +21,7 @@ export type PressableProps = Omit<RNPressableProps, "style"> & {
    * Style can be a static style object/array or a function that receives Pressable state + disabled
    */
   style?: StyleProp<ViewStyle> | ((state: EnhancedPressableState) => StyleProp<ViewStyle>);
+  className?: string; // compile-time only
 };
 
 /**

package/src/components/TextInput.tsx

@@ -30,6 +30,7 @@ export type TextInputProps = Omit<RNTextInputProps, "style"> & {
   style?:
     | RNTextInputProps["style"]
     | ((state: { focused: boolean; disabled: boolean }) => RNTextInputProps["style"]);
+  className?: string; // compile-time only
   /**
    * Convenience prop for disabled state (overrides editable if provided)
    * When true, sets editable to false

package/src/config/palettes.ts

@@ -0,0 +1,304 @@
+export type TailwindPalette = {
+  "50": string;
+  "100": string;
+  "200": string;
+  "300": string;
+  "400": string;
+  "500": string;
+  "600": string;
+  "700": string;
+  "800": string;
+  "900": string;
+  "950": string;
+};
+
+export const TAILWIND_PALETTES = {
+  red: {
+    "50": "#fef2f2",
+    "100": "#ffe2e2",
+    "200": "#ffc9c9",
+    "300": "#ffa2a2",
+    "400": "#ff6467",
+    "500": "#fb2c36",
+    "600": "#e7000b",
+    "700": "#c10007",
+    "800": "#9f0712",
+    "900": "#82181a",
+    "950": "#460809",
+  },
+  orange: {
+    "50": "#fff7ed",
+    "100": "#ffedd4",
+    "200": "#ffd6a7",
+    "300": "#ffb86a",
+    "400": "#ff8904",
+    "500": "#ff6900",
+    "600": "#f54900",
+    "700": "#ca3500",
+    "800": "#9f2d00",
+    "900": "#7e2a0c",
+    "950": "#441306",
+  },
+  amber: {
+    "50": "#fffbeb",
+    "100": "#fef3c6",
+    "200": "#fee685",
+    "300": "#ffd230",
+    "400": "#ffb900",
+    "500": "#fe9a00",
+    "600": "#e17100",
+    "700": "#bb4d00",
+    "800": "#973c00",
+    "900": "#7b3306",
+    "950": "#461901",
+  },
+  yellow: {
+    "50": "#fefce8",
+    "100": "#fef9c2",
+    "200": "#fff085",
+    "300": "#ffdf20",
+    "400": "#fdc700",
+    "500": "#f0b100",
+    "600": "#d08700",
+    "700": "#a65f00",
+    "800": "#894b00",
+    "900": "#733e0a",
+    "950": "#432004",
+  },
+  lime: {
+    "50": "#f7fee7",
+    "100": "#ecfcca",
+    "200": "#d8f999",
+    "300": "#bbf451",
+    "400": "#9ae600",
+    "500": "#7ccf00",
+    "600": "#5ea500",
+    "700": "#497d00",
+    "800": "#3c6300",
+    "900": "#35530e",
+    "950": "#192e03",
+  },
+  green: {
+    "50": "#f0fdf4",
+    "100": "#dcfce7",
+    "200": "#b9f8cf",
+    "300": "#7bf1a8",
+    "400": "#05df72",
+    "500": "#00c950",
+    "600": "#00a63e",
+    "700": "#008236",
+    "800": "#016630",
+    "900": "#0d542b",
+    "950": "#032e15",
+  },
+  emerald: {
+    "50": "#ecfdf5",
+    "100": "#d0fae5",
+    "200": "#a4f4cf",
+    "300": "#5ee9b5",
+    "400": "#00d492",
+    "500": "#00bc7d",
+    "600": "#009966",
+    "700": "#007a55",
+    "800": "#006045",
+    "900": "#004f3b",
+    "950": "#002c22",
+  },
+  teal: {
+    "50": "#f0fdfa",
+    "100": "#cbfbf1",
+    "200": "#96f7e4",
+    "300": "#46ecd5",
+    "400": "#00d5be",
+    "500": "#00bba7",
+    "600": "#009689",
+    "700": "#00786f",
+    "800": "#005f5a",
+    "900": "#0b4f4a",
+    "950": "#022f2e",
+  },
+  cyan: {
+    "50": "#ecfeff",
+    "100": "#cefafe",
+    "200": "#a2f4fd",
+    "300": "#53eafd",
+    "400": "#00d3f2",
+    "500": "#00b8db",
+    "600": "#0092b8",
+    "700": "#007595",
+    "800": "#005f78",
+    "900": "#104e64",
+    "950": "#053345",
+  },
+  sky: {
+    "50": "#f0f9ff",
+    "100": "#dff2fe",
+    "200": "#b8e6fe",
+    "300": "#74d4ff",
+    "400": "#00bcff",
+    "500": "#00a6f4",
+    "600": "#0084d1",
+    "700": "#0069a8",
+    "800": "#00598a",
+    "900": "#024a70",
+    "950": "#052f4a",
+  },
+  blue: {
+    "50": "#eff6ff",
+    "100": "#dbeafe",
+    "200": "#bedbff",
+    "300": "#8ec5ff",
+    "400": "#51a2ff",
+    "500": "#2b7fff",
+    "600": "#155dfc",
+    "700": "#1447e6",
+    "800": "#193cb8",
+    "900": "#1c398e",
+    "950": "#162456",
+  },
+  indigo: {
+    "50": "#eef2ff",
+    "100": "#e0e7ff",
+    "200": "#c6d2ff",
+    "300": "#a3b3ff",
+    "400": "#7c86ff",
+    "500": "#615fff",
+    "600": "#4f39f6",
+    "700": "#432dd7",
+    "800": "#372aac",
+    "900": "#312c85",
+    "950": "#1e1a4d",
+  },
+  violet: {
+    "50": "#f5f3ff",
+    "100": "#ede9fe",
+    "200": "#ddd6ff",
+    "300": "#c4b4ff",
+    "400": "#a684ff",
+    "500": "#8e51ff",
+    "600": "#7f22fe",
+    "700": "#7008e7",
+    "800": "#5d0ec0",
+    "900": "#4d179a",
+    "950": "#2f0d68",
+  },
+  purple: {
+    "50": "#faf5ff",
+    "100": "#f3e8ff",
+    "200": "#e9d4ff",
+    "300": "#dab2ff",
+    "400": "#c27aff",
+    "500": "#ad46ff",
+    "600": "#9810fa",
+    "700": "#8200db",
+    "800": "#6e11b0",
+    "900": "#59168b",
+    "950": "#3c0366",
+  },
+  fuchsia: {
+    "50": "#fdf4ff",
+    "100": "#fae8ff",
+    "200": "#f6cfff",
+    "300": "#f4a8ff",
+    "400": "#ed6aff",
+    "500": "#e12afb",
+    "600": "#c800de",
+    "700": "#a800b7",
+    "800": "#8a0194",
+    "900": "#721378",
+    "950": "#4b004f",
+  },
+  pink: {
+    "50": "#fdf2f8",
+    "100": "#fce7f3",
+    "200": "#fccee8",
+    "300": "#fda5d5",
+    "400": "#fb64b6",
+    "500": "#f6339a",
+    "600": "#e60076",
+    "700": "#c6005c",
+    "800": "#a3004c",
+    "900": "#861043",
+    "950": "#510424",
+  },
+  rose: {
+    "50": "#fff1f2",
+    "100": "#ffe4e6",
+    "200": "#ffccd3",
+    "300": "#ffa1ad",
+    "400": "#ff637e",
+    "500": "#ff2056",
+    "600": "#ec003f",
+    "700": "#c70036",
+    "800": "#a50036",
+    "900": "#8b0836",
+    "950": "#4d0218",
+  },
+  slate: {
+    "50": "#f8fafc",
+    "100": "#f1f5f9",
+    "200": "#e2e8f0",
+    "300": "#cad5e2",
+    "400": "#90a1b9",
+    "500": "#62748e",
+    "600": "#45556c",
+    "700": "#314158",
+    "800": "#1d293d",
+    "900": "#0f172b",
+    "950": "#020618",
+  },
+  gray: {
+    "50": "#f9fafb",
+    "100": "#f3f4f6",
+    "200": "#e5e7eb",
+    "300": "#d1d5dc",
+    "400": "#99a1af",
+    "500": "#6a7282",
+    "600": "#4a5565",
+    "700": "#364153",
+    "800": "#1e2939",
+    "900": "#101828",
+    "950": "#030712",
+  },
+  zinc: {
+    "50": "#fafafa",
+    "100": "#f4f4f5",
+    "200": "#e4e4e7",
+    "300": "#d4d4d8",
+    "400": "#9f9fa9",
+    "500": "#71717b",
+    "600": "#52525c",
+    "700": "#3f3f46",
+    "800": "#27272a",
+    "900": "#18181b",
+    "950": "#09090b",
+  },
+  neutral: {
+    "50": "#fafafa",
+    "100": "#f5f5f5",
+    "200": "#e5e5e5",
+    "300": "#d4d4d4",
+    "400": "#a1a1a1",
+    "500": "#737373",
+    "600": "#525252",
+    "700": "#404040",
+    "800": "#262626",
+    "900": "#171717",
+    "950": "#0a0a0a",
+  },
+  stone: {
+    "50": "#fafaf9",
+    "100": "#f5f5f4",
+    "200": "#e7e5e4",
+    "300": "#d6d3d1",
+    "400": "#a6a09b",
+    "500": "#79716b",
+    "600": "#57534d",
+    "700": "#44403b",
+    "800": "#292524",
+    "900": "#1c1917",
+    "950": "#0c0a09",
+  },
+} satisfies Record<string, TailwindPalette>;
+
+export type TailwindColor = keyof typeof TAILWIND_PALETTES;

package/src/parser/colors.test.ts

@@ -1,6 +1,22 @@
 import { describe, expect, it } from "vitest";
 import { COLORS, parseColor } from "./colors";
 
+// Helper to apply opacity to hex color for testing
+function applyOpacity(hex: string, opacity: number): string {
+  if (hex === "transparent") return "transparent";
+  const cleanHex = hex.replace(/^#/, "");
+  const fullHex =
+    cleanHex.length === 3
+      ? cleanHex
+          .split("")
+          .map((char) => char + char)
+          .join("")
+      : cleanHex;
+  const alpha = Math.round((opacity / 100) * 255);
+  const alphaHex = alpha.toString(16).padStart(2, "0").toUpperCase();
+  return `#${fullHex.toUpperCase()}${alphaHex}`;
+}
+
 describe("COLORS", () => {
   it("should export complete color palette", () => {
     expect(COLORS).toMatchSnapshot();
@@ -9,10 +25,10 @@ describe("COLORS", () => {
 
 describe("parseColor - background colors", () => {
   it("should parse background colors with preset values", () => {
-    expect(parseColor("bg-blue-500")).toEqual({ backgroundColor: "#3B82F6" });
-    expect(parseColor("bg-red-500")).toEqual({ backgroundColor: "#EF4444" });
-    expect(parseColor("bg-green-500")).toEqual({ backgroundColor: "#22C55E" });
-    expect(parseColor("bg-gray-300")).toEqual({ backgroundColor: "#D1D5DB" });
+    expect(parseColor("bg-blue-500")).toEqual({ backgroundColor: COLORS["blue-500"] });
+    expect(parseColor("bg-red-500")).toEqual({ backgroundColor: COLORS["red-500"] });
+    expect(parseColor("bg-green-500")).toEqual({ backgroundColor: COLORS["green-500"] });
+    expect(parseColor("bg-gray-300")).toEqual({ backgroundColor: COLORS["gray-300"] });
   });
 
   it("should parse background colors with basic values", () => {
@@ -57,10 +73,10 @@ describe("parseColor - background colors", () => {
 
 describe("parseColor - text colors", () => {
   it("should parse text colors with preset values", () => {
-    expect(parseColor("text-blue-500")).toEqual({ color: "#3B82F6" });
-    expect(parseColor("text-red-500")).toEqual({ color: "#EF4444" });
-    expect(parseColor("text-green-500")).toEqual({ color: "#22C55E" });
-    expect(parseColor("text-gray-700")).toEqual({ color: "#374151" });
+    expect(parseColor("text-blue-500")).toEqual({ color: COLORS["blue-500"] });
+    expect(parseColor("text-red-500")).toEqual({ color: COLORS["red-500"] });
+    expect(parseColor("text-green-500")).toEqual({ color: COLORS["green-500"] });
+    expect(parseColor("text-gray-700")).toEqual({ color: COLORS["gray-700"] });
   });
 
   it("should parse text colors with basic values", () => {
@@ -88,10 +104,10 @@ describe("parseColor - text colors", () => {
 
 describe("parseColor - border colors", () => {
   it("should parse border colors with preset values", () => {
-    expect(parseColor("border-blue-500")).toEqual({ borderColor: "#3B82F6" });
-    expect(parseColor("border-red-500")).toEqual({ borderColor: "#EF4444" });
-    expect(parseColor("border-green-500")).toEqual({ borderColor: "#22C55E" });
-    expect(parseColor("border-gray-200")).toEqual({ borderColor: "#E5E7EB" });
+    expect(parseColor("border-blue-500")).toEqual({ borderColor: COLORS["blue-500"] });
+    expect(parseColor("border-red-500")).toEqual({ borderColor: COLORS["red-500"] });
+    expect(parseColor("border-green-500")).toEqual({ borderColor: COLORS["green-500"] });
+    expect(parseColor("border-gray-200")).toEqual({ borderColor: COLORS["gray-200"] });
   });
 
   it("should parse border colors with basic values", () => {
@@ -153,7 +169,7 @@ describe("parseColor - custom colors", () => {
   });
 
   it("should fallback to preset colors when custom color not found", () => {
-    expect(parseColor("bg-red-500", customColors)).toEqual({ backgroundColor: "#EF4444" });
+    expect(parseColor("bg-red-500", customColors)).toEqual({ backgroundColor: COLORS["red-500"] });
   });
 });
 
@@ -220,9 +236,9 @@ describe("parseColor - edge cases", () => {
 
 describe("parseColor - comprehensive coverage", () => {
   it("should parse all color types with same preset color", () => {
-    expect(parseColor("bg-blue-500")).toEqual({ backgroundColor: "#3B82F6" });
-    expect(parseColor("text-blue-500")).toEqual({ color: "#3B82F6" });
-    expect(parseColor("border-blue-500")).toEqual({ borderColor: "#3B82F6" });
+    expect(parseColor("bg-blue-500")).toEqual({ backgroundColor: COLORS["blue-500"] });
+    expect(parseColor("text-blue-500")).toEqual({ color: COLORS["blue-500"] });
+    expect(parseColor("border-blue-500")).toEqual({ borderColor: COLORS["blue-500"] });
   });
 
   it("should parse all color types with same arbitrary hex", () => {
@@ -261,23 +277,23 @@ describe("parseColor - comprehensive coverage", () => {
 
 describe("parseColor - opacity modifiers", () => {
   it("should parse background colors with opacity modifiers", () => {
-    expect(parseColor("bg-black/50")).toEqual({ backgroundColor: "#00000080" });
-    expect(parseColor("bg-white/50")).toEqual({ backgroundColor: "#FFFFFF80" });
-    expect(parseColor("bg-blue-500/80")).toEqual({ backgroundColor: "#3B82F6CC" });
-    expect(parseColor("bg-red-500/30")).toEqual({ backgroundColor: "#EF44444D" });
+    expect(parseColor("bg-black/50")).toEqual({ backgroundColor: applyOpacity(COLORS.black, 50) });
+    expect(parseColor("bg-white/50")).toEqual({ backgroundColor: applyOpacity(COLORS.white, 50) });
+    expect(parseColor("bg-blue-500/80")).toEqual({ backgroundColor: applyOpacity(COLORS["blue-500"], 80) });
+    expect(parseColor("bg-red-500/30")).toEqual({ backgroundColor: applyOpacity(COLORS["red-500"], 30) });
   });
 
   it("should parse text colors with opacity modifiers", () => {
-    expect(parseColor("text-black/80")).toEqual({ color: "#000000CC" });
-    expect(parseColor("text-white/90")).toEqual({ color: "#FFFFFFE6" });
-    expect(parseColor("text-gray-900/70")).toEqual({ color: "#111827B3" });
-    expect(parseColor("text-blue-500/50")).toEqual({ color: "#3B82F680" });
+    expect(parseColor("text-black/80")).toEqual({ color: applyOpacity(COLORS.black, 80) });
+    expect(parseColor("text-white/90")).toEqual({ color: applyOpacity(COLORS.white, 90) });
+    expect(parseColor("text-gray-900/70")).toEqual({ color: applyOpacity(COLORS["gray-900"], 70) });
+    expect(parseColor("text-blue-500/50")).toEqual({ color: applyOpacity(COLORS["blue-500"], 50) });
   });
 
   it("should parse border colors with opacity modifiers", () => {
-    expect(parseColor("border-black/25")).toEqual({ borderColor: "#00000040" });
-    expect(parseColor("border-red-500/60")).toEqual({ borderColor: "#EF444499" });
-    expect(parseColor("border-gray-200/40")).toEqual({ borderColor: "#E5E7EB66" });
+    expect(parseColor("border-black/25")).toEqual({ borderColor: applyOpacity(COLORS.black, 25) });
+    expect(parseColor("border-red-500/60")).toEqual({ borderColor: applyOpacity(COLORS["red-500"], 60) });
+    expect(parseColor("border-gray-200/40")).toEqual({ borderColor: applyOpacity(COLORS["gray-200"], 40) });
   });
 
   it("should handle opacity modifier with arbitrary hex colors", () => {
@@ -293,13 +309,13 @@ describe("parseColor - opacity modifiers", () => {
   });
 
   it("should handle opacity 0 (fully transparent)", () => {
-    expect(parseColor("bg-black/0")).toEqual({ backgroundColor: "#00000000" });
-    expect(parseColor("text-red-500/0")).toEqual({ color: "#EF444400" });
+    expect(parseColor("bg-black/0")).toEqual({ backgroundColor: applyOpacity(COLORS.black, 0) });
+    expect(parseColor("text-red-500/0")).toEqual({ color: applyOpacity(COLORS["red-500"], 0) });
   });
 
   it("should handle opacity 100 (fully opaque)", () => {
-    expect(parseColor("bg-black/100")).toEqual({ backgroundColor: "#000000FF" });
-    expect(parseColor("text-blue-500/100")).toEqual({ color: "#3B82F6FF" });
+    expect(parseColor("bg-black/100")).toEqual({ backgroundColor: applyOpacity(COLORS.black, 100) });
+    expect(parseColor("text-blue-500/100")).toEqual({ color: applyOpacity(COLORS["blue-500"], 100) });
   });
 
   it("should handle transparent color with opacity modifier", () => {