fix: support decimal values in arbitrary font-size and line-height

Update parseArbitraryFontSize and parseArbitraryLineHeight to accept
decimal values like text-[13.5px] and leading-[21.5px], matching the
pattern already used in parseArbitraryLetterSpacing.

Changes:
- Update regex to match decimals: /^\[(-?\d+(?:\.\d+)?|-?\.\d+)(?:px)?\]$/
- Change from parseInt to parseFloat
- Support Tailwind shorthand decimals like text-[.5]
- Add comprehensive test coverage for decimal values

Author: mgcrea

src/parser/typography.test.ts

@@ -39,6 +39,20 @@ describe("parseTypography - font size", () => {
     expect(parseTypography("text-[22]")).toEqual({ fontSize: 22 });
     expect(parseTypography("text-[100px]")).toEqual({ fontSize: 100 });
   });
+
+  it("should parse font size with decimal arbitrary values", () => {
+    expect(parseTypography("text-[13.5px]")).toEqual({ fontSize: 13.5 });
+    expect(parseTypography("text-[13.5]")).toEqual({ fontSize: 13.5 });
+    expect(parseTypography("text-[18.75px]")).toEqual({ fontSize: 18.75 });
+    expect(parseTypography("text-[18.75]")).toEqual({ fontSize: 18.75 });
+    expect(parseTypography("text-[22.5]")).toEqual({ fontSize: 22.5 });
+  });
+
+  it("should parse font size with Tailwind shorthand decimals", () => {
+    expect(parseTypography("text-[.5]")).toEqual({ fontSize: 0.5 });
+    expect(parseTypography("text-[.75px]")).toEqual({ fontSize: 0.75 });
+    expect(parseTypography("text-[.5px]")).toEqual({ fontSize: 0.5 });
+  });
 });
 
 describe("parseTypography - font family", () => {
@@ -136,6 +150,20 @@ describe("parseTypography - line height", () => {
     expect(parseTypography("leading-[30]")).toEqual({ lineHeight: 30 });
     expect(parseTypography("leading-[50px]")).toEqual({ lineHeight: 50 });
   });
+
+  it("should parse line height with decimal arbitrary values", () => {
+    expect(parseTypography("leading-[21.5px]")).toEqual({ lineHeight: 21.5 });
+    expect(parseTypography("leading-[21.5]")).toEqual({ lineHeight: 21.5 });
+    expect(parseTypography("leading-[28.75px]")).toEqual({ lineHeight: 28.75 });
+    expect(parseTypography("leading-[28.75]")).toEqual({ lineHeight: 28.75 });
+    expect(parseTypography("leading-[32.5]")).toEqual({ lineHeight: 32.5 });
+  });
+
+  it("should parse line height with Tailwind shorthand decimals", () => {
+    expect(parseTypography("leading-[.5]")).toEqual({ lineHeight: 0.5 });
+    expect(parseTypography("leading-[.75px]")).toEqual({ lineHeight: 0.75 });
+    expect(parseTypography("leading-[.5px]")).toEqual({ lineHeight: 0.5 });
+  });
 });
 
 describe("parseTypography - letter spacing", () => {

src/parser/typography.ts

@@ -113,22 +113,22 @@ const TRACKING_MAP: Record<string, StyleObject> = {
 };
 
 /**
- * Parse arbitrary font size value: [18px], [20]
- * Returns number for px values, null for unsupported formats
+ * Parse arbitrary font size value: [18px], [20], [13.5px], [.5]
+ * Returns number for px values (including decimals), null for unsupported formats
  */
 function parseArbitraryFontSize(value: string): number | null {
-  // Match: [18px] or [18] (pixels only)
-  const pxMatch = value.match(/^\[(\d+)(?:px)?\]$/);
+  // Match: [18px], [18], [13.5px], [13.5], [.5] (pixels, including decimals)
+  const pxMatch = value.match(/^\[(-?\d+(?:\.\d+)?|-?\.\d+)(?:px)?\]$/);
   if (pxMatch) {
-    return parseInt(pxMatch[1], 10);
+    return parseFloat(pxMatch[1]);
   }
 
   // Warn about unsupported formats
   if (value.startsWith("[") && value.endsWith("]")) {
     /* v8 ignore next 5 */
     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]).`,
+        `[react-native-tailwind] Unsupported arbitrary font size value: ${value}. Only px values are supported (e.g., [18px], [13.5px], [.5]).`,
       );
     }
     return null;
@@ -138,22 +138,22 @@ function parseArbitraryFontSize(value: string): number | null {
 }
 
 /**
- * Parse arbitrary line height value: [24px], [28]
- * Returns number for px values, null for unsupported formats
+ * Parse arbitrary line height value: [24px], [28], [21.5px], [.5]
+ * Returns number for px values (including decimals), null for unsupported formats
  */
 function parseArbitraryLineHeight(value: string): number | null {
-  // Match: [24px] or [24] (pixels only)
-  const pxMatch = value.match(/^\[(\d+)(?:px)?\]$/);
+  // Match: [24px], [24], [21.5px], [21.5], [.5] (pixels, including decimals)
+  const pxMatch = value.match(/^\[(-?\d+(?:\.\d+)?|-?\.\d+)(?:px)?\]$/);
   if (pxMatch) {
-    return parseInt(pxMatch[1], 10);
+    return parseFloat(pxMatch[1]);
   }
 
   // Warn about unsupported formats
   if (value.startsWith("[") && value.endsWith("]")) {
     /* v8 ignore next 5 */
     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]).`,
+        `[react-native-tailwind] Unsupported arbitrary line height value: ${value}. Only px values are supported (e.g., [24px], [21.5px], [.5]).`,
       );
     }
     return null;