@mgcrea/react-native-tailwind 0.8.0 → 0.8.1

package/dist/utils/flattenColors.d.ts

@@ -7,6 +7,7 @@ type NestedColors = {
 /**
  * Flatten nested color objects into flat key-value map
  * Example: { brand: { light: '#fff', dark: '#000' } } => { 'brand-light': '#fff', 'brand-dark': '#000' }
+ * Special handling for DEFAULT: { primary: { DEFAULT: '#000', 500: '#333' } } => { 'primary': '#000', 'primary-500': '#333' }
  *
  * @param colors - Nested color object where values can be strings or objects
  * @param prefix - Optional prefix for nested keys (used for recursion)

package/dist/utils/flattenColors.js

@@ -1 +1 @@
-var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.flattenColors=flattenColors;var _slicedToArray2=_interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));function flattenColors(colors){var prefix=arguments.length>1&&arguments[1]!==undefined?arguments[1]:"";var result={};for(var _ref of Object.entries(colors)){var _ref2=(0,_slicedToArray2.default)(_ref,2);var _key=_ref2[0];var value=_ref2[1];var 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;}
+var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.flattenColors=flattenColors;var _slicedToArray2=_interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));function flattenColors(colors){var prefix=arguments.length>1&&arguments[1]!==undefined?arguments[1]:"";var result={};for(var _ref of Object.entries(colors)){var _ref2=(0,_slicedToArray2.default)(_ref,2);var _key=_ref2[0];var value=_ref2[1];var newKey=_key==="DEFAULT"&&prefix?prefix: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;}

package/dist/utils/flattenColors.test.js

@@ -1 +1 @@
-var _vitest=require("vitest");var _flattenColors=require("./flattenColors");(0,_vitest.describe)("flattenColors",function(){(0,_vitest.it)("should handle flat color objects",function(){var colors={red:"#ff0000",blue:"#0000ff",green:"#00ff00"};(0,_vitest.expect)((0,_flattenColors.flattenColors)(colors)).toEqual({red:"#ff0000",blue:"#0000ff",green:"#00ff00"});});(0,_vitest.it)("should flatten single-level nested objects",function(){var colors={brand:{primary:"#ff6b6b",secondary:"#4ecdc4"}};(0,_vitest.expect)((0,_flattenColors.flattenColors)(colors)).toEqual({"brand-primary":"#ff6b6b","brand-secondary":"#4ecdc4"});});(0,_vitest.it)("should flatten multi-level nested objects",function(){var colors={brand:{light:{primary:"#ffcccc",secondary:"#ccffff"},dark:{primary:"#990000",secondary:"#006666"}}};(0,_vitest.expect)((0,_flattenColors.flattenColors)(colors)).toEqual({"brand-light-primary":"#ffcccc","brand-light-secondary":"#ccffff","brand-dark-primary":"#990000","brand-dark-secondary":"#006666"});});(0,_vitest.it)("should handle mixed flat and nested objects",function(){var colors={white:"#ffffff",black:"#000000",brand:{primary:"#ff6b6b",secondary:"#4ecdc4"},accent:"#ffe66d"};(0,_vitest.expect)((0,_flattenColors.flattenColors)(colors)).toEqual({white:"#ffffff",black:"#000000","brand-primary":"#ff6b6b","brand-secondary":"#4ecdc4",accent:"#ffe66d"});});(0,_vitest.it)("should handle Tailwind-style color scale objects",function(){var colors={gray:{"50":"#f9fafb","100":"#f3f4f6","200":"#e5e7eb","500":"#6b7280","900":"#111827"}};(0,_vitest.expect)((0,_flattenColors.flattenColors)(colors)).toEqual({"gray-50":"#f9fafb","gray-100":"#f3f4f6","gray-200":"#e5e7eb","gray-500":"#6b7280","gray-900":"#111827"});});(0,_vitest.it)("should handle empty object",function(){(0,_vitest.expect)((0,_flattenColors.flattenColors)({})).toEqual({});});(0,_vitest.it)("should handle single color",function(){var colors={primary:"#ff0000"};(0,_vitest.expect)((0,_flattenColors.flattenColors)(colors)).toEqual({primary:"#ff0000"});});(0,_vitest.it)("should handle deeply nested objects (3+ levels)",function(){var colors={theme:{light:{brand:{primary:"#ff6b6b",secondary:"#4ecdc4"}},dark:{brand:{primary:"#990000",secondary:"#006666"}}}};(0,_vitest.expect)((0,_flattenColors.flattenColors)(colors)).toEqual({"theme-light-brand-primary":"#ff6b6b","theme-light-brand-secondary":"#4ecdc4","theme-dark-brand-primary":"#990000","theme-dark-brand-secondary":"#006666"});});(0,_vitest.it)("should handle numeric keys",function(){var colors={blue:{"100":"#dbeafe","500":"#3b82f6","900":"#1e3a8a"}};(0,_vitest.expect)((0,_flattenColors.flattenColors)(colors)).toEqual({"blue-100":"#dbeafe","blue-500":"#3b82f6","blue-900":"#1e3a8a"});});(0,_vitest.it)("should handle keys with hyphens",function(){var colors={"brand-primary":"#ff0000","brand-secondary":{light:"#00ff00",dark:"#006600"}};(0,_vitest.expect)((0,_flattenColors.flattenColors)(colors)).toEqual({"brand-primary":"#ff0000","brand-secondary-light":"#00ff00","brand-secondary-dark":"#006600"});});(0,_vitest.it)("should handle uppercase and lowercase hex values",function(){var colors={red:"#FF0000",blue:"#0000ff",green:"#00Ff00"};(0,_vitest.expect)((0,_flattenColors.flattenColors)(colors)).toEqual({red:"#FF0000",blue:"#0000ff",green:"#00Ff00"});});(0,_vitest.it)("should handle 3-digit hex values",function(){var colors={red:"#f00",blue:"#00f",green:"#0f0"};(0,_vitest.expect)((0,_flattenColors.flattenColors)(colors)).toEqual({red:"#f00",blue:"#00f",green:"#0f0"});});(0,_vitest.it)("should handle 8-digit hex values (with alpha)",function(){var colors={"red-50":"#ff000080","blue-50":"#0000ff80"};(0,_vitest.expect)((0,_flattenColors.flattenColors)(colors)).toEqual({"red-50":"#ff000080","blue-50":"#0000ff80"});});(0,_vitest.it)("should handle complex real-world Tailwind config",function(){var colors={transparent:"transparent",current:"currentColor",white:"#ffffff",black:"#000000",gray:{"50":"#f9fafb","100":"#f3f4f6","500":"#6b7280","900":"#111827"},brand:{primary:"#ff6b6b",secondary:"#4ecdc4",accent:{light:"#ffe66d",dark:"#ffb900"}}};(0,_vitest.expect)((0,_flattenColors.flattenColors)(colors)).toEqual({transparent:"transparent",current:"currentColor",white:"#ffffff",black:"#000000","gray-50":"#f9fafb","gray-100":"#f3f4f6","gray-500":"#6b7280","gray-900":"#111827","brand-primary":"#ff6b6b","brand-secondary":"#4ecdc4","brand-accent-light":"#ffe66d","brand-accent-dark":"#ffb900"});});(0,_vitest.it)("should not mutate input object",function(){var colors={brand:{primary:"#ff6b6b",secondary:"#4ecdc4"}};var original=JSON.parse(JSON.stringify(colors));(0,_flattenColors.flattenColors)(colors);(0,_vitest.expect)(colors).toEqual(original);});(0,_vitest.it)("should handle undefined values gracefully",function(){var colors={red:"#ff0000",blue:undefined,green:"#00ff00"};(0,_vitest.expect)((0,_flattenColors.flattenColors)(colors)).toEqual({red:"#ff0000",green:"#00ff00"});});(0,_vitest.it)("should handle special color keywords",function(){var colors={transparent:"transparent",current:"currentColor",inherit:"inherit"};(0,_vitest.expect)((0,_flattenColors.flattenColors)(colors)).toEqual({transparent:"transparent",current:"currentColor",inherit:"inherit"});});(0,_vitest.it)("should handle RGB/RGBA color values",function(){var colors={primary:"rgb(255, 0, 0)",secondary:"rgba(0, 255, 0, 0.5)"};(0,_vitest.expect)((0,_flattenColors.flattenColors)(colors)).toEqual({primary:"rgb(255, 0, 0)",secondary:"rgba(0, 255, 0, 0.5)"});});(0,_vitest.it)("should handle very deeply nested structures (stress test)",function(){var colors={level1:{level2:{level3:{level4:{level5:"#ff0000"}}}}};(0,_vitest.expect)((0,_flattenColors.flattenColors)(colors)).toEqual({"level1-level2-level3-level4-level5":"#ff0000"});});(0,_vitest.it)("should handle camelCase keys",function(){var colors={brandPrimary:"#ff0000",accentColor:{lightShade:"#ffcccc",darkShade:"#cc0000"}};(0,_vitest.expect)((0,_flattenColors.flattenColors)(colors)).toEqual({brandPrimary:"#ff0000","accentColor-lightShade":"#ffcccc","accentColor-darkShade":"#cc0000"});});(0,_vitest.it)("should produce consistent output",function(){var colors={brand:{primary:"#ff6b6b",secondary:"#4ecdc4"}};var result1=(0,_flattenColors.flattenColors)(colors);var result2=(0,_flattenColors.flattenColors)(colors);var result3=(0,_flattenColors.flattenColors)(colors);(0,_vitest.expect)(result1).toEqual(result2);(0,_vitest.expect)(result2).toEqual(result3);});(0,_vitest.it)("should maintain key order (insertion order)",function(){var colors={z:"#000001",a:"#000002",m:"#000003"};var flattened=(0,_flattenColors.flattenColors)(colors);var keys=Object.keys(flattened);(0,_vitest.expect)(keys).toEqual(["z","a","m"]);});});
+var _vitest=require("vitest");var _flattenColors=require("./flattenColors");(0,_vitest.describe)("flattenColors",function(){(0,_vitest.it)("should handle flat color objects",function(){var colors={red:"#ff0000",blue:"#0000ff",green:"#00ff00"};(0,_vitest.expect)((0,_flattenColors.flattenColors)(colors)).toEqual({red:"#ff0000",blue:"#0000ff",green:"#00ff00"});});(0,_vitest.it)("should flatten single-level nested objects",function(){var colors={brand:{primary:"#ff6b6b",secondary:"#4ecdc4"}};(0,_vitest.expect)((0,_flattenColors.flattenColors)(colors)).toEqual({"brand-primary":"#ff6b6b","brand-secondary":"#4ecdc4"});});(0,_vitest.it)("should flatten multi-level nested objects",function(){var colors={brand:{light:{primary:"#ffcccc",secondary:"#ccffff"},dark:{primary:"#990000",secondary:"#006666"}}};(0,_vitest.expect)((0,_flattenColors.flattenColors)(colors)).toEqual({"brand-light-primary":"#ffcccc","brand-light-secondary":"#ccffff","brand-dark-primary":"#990000","brand-dark-secondary":"#006666"});});(0,_vitest.it)("should handle mixed flat and nested objects",function(){var colors={white:"#ffffff",black:"#000000",brand:{primary:"#ff6b6b",secondary:"#4ecdc4"},accent:"#ffe66d"};(0,_vitest.expect)((0,_flattenColors.flattenColors)(colors)).toEqual({white:"#ffffff",black:"#000000","brand-primary":"#ff6b6b","brand-secondary":"#4ecdc4",accent:"#ffe66d"});});(0,_vitest.it)("should handle Tailwind-style color scale objects",function(){var colors={gray:{"50":"#f9fafb","100":"#f3f4f6","200":"#e5e7eb","500":"#6b7280","900":"#111827"}};(0,_vitest.expect)((0,_flattenColors.flattenColors)(colors)).toEqual({"gray-50":"#f9fafb","gray-100":"#f3f4f6","gray-200":"#e5e7eb","gray-500":"#6b7280","gray-900":"#111827"});});(0,_vitest.it)("should handle empty object",function(){(0,_vitest.expect)((0,_flattenColors.flattenColors)({})).toEqual({});});(0,_vitest.it)("should handle single color",function(){var colors={primary:"#ff0000"};(0,_vitest.expect)((0,_flattenColors.flattenColors)(colors)).toEqual({primary:"#ff0000"});});(0,_vitest.it)("should handle deeply nested objects (3+ levels)",function(){var colors={theme:{light:{brand:{primary:"#ff6b6b",secondary:"#4ecdc4"}},dark:{brand:{primary:"#990000",secondary:"#006666"}}}};(0,_vitest.expect)((0,_flattenColors.flattenColors)(colors)).toEqual({"theme-light-brand-primary":"#ff6b6b","theme-light-brand-secondary":"#4ecdc4","theme-dark-brand-primary":"#990000","theme-dark-brand-secondary":"#006666"});});(0,_vitest.it)("should handle numeric keys",function(){var colors={blue:{"100":"#dbeafe","500":"#3b82f6","900":"#1e3a8a"}};(0,_vitest.expect)((0,_flattenColors.flattenColors)(colors)).toEqual({"blue-100":"#dbeafe","blue-500":"#3b82f6","blue-900":"#1e3a8a"});});(0,_vitest.it)("should handle keys with hyphens",function(){var colors={"brand-primary":"#ff0000","brand-secondary":{light:"#00ff00",dark:"#006600"}};(0,_vitest.expect)((0,_flattenColors.flattenColors)(colors)).toEqual({"brand-primary":"#ff0000","brand-secondary-light":"#00ff00","brand-secondary-dark":"#006600"});});(0,_vitest.it)("should handle uppercase and lowercase hex values",function(){var colors={red:"#FF0000",blue:"#0000ff",green:"#00Ff00"};(0,_vitest.expect)((0,_flattenColors.flattenColors)(colors)).toEqual({red:"#FF0000",blue:"#0000ff",green:"#00Ff00"});});(0,_vitest.it)("should handle 3-digit hex values",function(){var colors={red:"#f00",blue:"#00f",green:"#0f0"};(0,_vitest.expect)((0,_flattenColors.flattenColors)(colors)).toEqual({red:"#f00",blue:"#00f",green:"#0f0"});});(0,_vitest.it)("should handle 8-digit hex values (with alpha)",function(){var colors={"red-50":"#ff000080","blue-50":"#0000ff80"};(0,_vitest.expect)((0,_flattenColors.flattenColors)(colors)).toEqual({"red-50":"#ff000080","blue-50":"#0000ff80"});});(0,_vitest.it)("should handle complex real-world Tailwind config",function(){var colors={transparent:"transparent",current:"currentColor",white:"#ffffff",black:"#000000",gray:{"50":"#f9fafb","100":"#f3f4f6","500":"#6b7280","900":"#111827"},brand:{primary:"#ff6b6b",secondary:"#4ecdc4",accent:{light:"#ffe66d",dark:"#ffb900"}}};(0,_vitest.expect)((0,_flattenColors.flattenColors)(colors)).toEqual({transparent:"transparent",current:"currentColor",white:"#ffffff",black:"#000000","gray-50":"#f9fafb","gray-100":"#f3f4f6","gray-500":"#6b7280","gray-900":"#111827","brand-primary":"#ff6b6b","brand-secondary":"#4ecdc4","brand-accent-light":"#ffe66d","brand-accent-dark":"#ffb900"});});(0,_vitest.it)("should not mutate input object",function(){var colors={brand:{primary:"#ff6b6b",secondary:"#4ecdc4"}};var original=JSON.parse(JSON.stringify(colors));(0,_flattenColors.flattenColors)(colors);(0,_vitest.expect)(colors).toEqual(original);});(0,_vitest.it)("should handle undefined values gracefully",function(){var colors={red:"#ff0000",blue:undefined,green:"#00ff00"};(0,_vitest.expect)((0,_flattenColors.flattenColors)(colors)).toEqual({red:"#ff0000",green:"#00ff00"});});(0,_vitest.it)("should handle special color keywords",function(){var colors={transparent:"transparent",current:"currentColor",inherit:"inherit"};(0,_vitest.expect)((0,_flattenColors.flattenColors)(colors)).toEqual({transparent:"transparent",current:"currentColor",inherit:"inherit"});});(0,_vitest.it)("should handle RGB/RGBA color values",function(){var colors={primary:"rgb(255, 0, 0)",secondary:"rgba(0, 255, 0, 0.5)"};(0,_vitest.expect)((0,_flattenColors.flattenColors)(colors)).toEqual({primary:"rgb(255, 0, 0)",secondary:"rgba(0, 255, 0, 0.5)"});});(0,_vitest.it)("should handle very deeply nested structures (stress test)",function(){var colors={level1:{level2:{level3:{level4:{level5:"#ff0000"}}}}};(0,_vitest.expect)((0,_flattenColors.flattenColors)(colors)).toEqual({"level1-level2-level3-level4-level5":"#ff0000"});});(0,_vitest.it)("should handle camelCase keys",function(){var colors={brandPrimary:"#ff0000",accentColor:{lightShade:"#ffcccc",darkShade:"#cc0000"}};(0,_vitest.expect)((0,_flattenColors.flattenColors)(colors)).toEqual({brandPrimary:"#ff0000","accentColor-lightShade":"#ffcccc","accentColor-darkShade":"#cc0000"});});(0,_vitest.it)("should produce consistent output",function(){var colors={brand:{primary:"#ff6b6b",secondary:"#4ecdc4"}};var result1=(0,_flattenColors.flattenColors)(colors);var result2=(0,_flattenColors.flattenColors)(colors);var result3=(0,_flattenColors.flattenColors)(colors);(0,_vitest.expect)(result1).toEqual(result2);(0,_vitest.expect)(result2).toEqual(result3);});(0,_vitest.it)("should maintain key order (insertion order)",function(){var colors={z:"#000001",a:"#000002",m:"#000003"};var flattened=(0,_flattenColors.flattenColors)(colors);var keys=Object.keys(flattened);(0,_vitest.expect)(keys).toEqual(["z","a","m"]);});(0,_vitest.it)("should handle DEFAULT key in color scale objects",function(){var colors={primary:{"50":"#eefdfd","100":"#d4f9f9","200":"#aef2f3","500":"#1bacb5","900":"#1e4f5b",DEFAULT:"#1bacb5"}};(0,_vitest.expect)((0,_flattenColors.flattenColors)(colors)).toEqual({primary:"#1bacb5","primary-50":"#eefdfd","primary-100":"#d4f9f9","primary-200":"#aef2f3","primary-500":"#1bacb5","primary-900":"#1e4f5b"});});(0,_vitest.it)("should handle DEFAULT key with multiple color scales",function(){var colors={primary:{DEFAULT:"#1bacb5","500":"#1bacb5"},secondary:{DEFAULT:"#ff6b6b","500":"#ff6b6b"}};(0,_vitest.expect)((0,_flattenColors.flattenColors)(colors)).toEqual({primary:"#1bacb5","primary-500":"#1bacb5",secondary:"#ff6b6b","secondary-500":"#ff6b6b"});});(0,_vitest.it)("should handle DEFAULT key in nested structures",function(){var colors={brand:{primary:{DEFAULT:"#1bacb5",light:"#d4f9f9",dark:"#0e343e"}}};(0,_vitest.expect)((0,_flattenColors.flattenColors)(colors)).toEqual({"brand-primary":"#1bacb5","brand-primary-light":"#d4f9f9","brand-primary-dark":"#0e343e"});});(0,_vitest.it)("should handle DEFAULT at top level (edge case)",function(){var colors={DEFAULT:"#000000",primary:"#ff0000"};(0,_vitest.expect)((0,_flattenColors.flattenColors)(colors)).toEqual({DEFAULT:"#000000",primary:"#ff0000"});});(0,_vitest.it)("should handle mixed DEFAULT and regular keys",function(){var colors={gray:{"50":"#f9fafb","100":"#f3f4f6",DEFAULT:"#6b7280","500":"#6b7280","900":"#111827"},white:"#ffffff",brand:{DEFAULT:"#ff6b6b",accent:"#4ecdc4"}};(0,_vitest.expect)((0,_flattenColors.flattenColors)(colors)).toEqual({"gray-50":"#f9fafb","gray-100":"#f3f4f6",gray:"#6b7280","gray-500":"#6b7280","gray-900":"#111827",white:"#ffffff",brand:"#ff6b6b","brand-accent":"#4ecdc4"});});});

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mgcrea/react-native-tailwind",
-  "version": "0.8.0",
+  "version": "0.8.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/babel/utils/attributeMatchers.test.ts

@@ -0,0 +1,294 @@
+import { describe, expect, it } from "vitest";
+import {
+  DEFAULT_CLASS_ATTRIBUTES,
+  buildAttributeMatchers,
+  getTargetStyleProp,
+  isAttributeSupported,
+} from "./attributeMatchers";
+
+describe("DEFAULT_CLASS_ATTRIBUTES", () => {
+  it("should contain standard className attributes", () => {
+    expect(DEFAULT_CLASS_ATTRIBUTES).toEqual([
+      "className",
+      "contentContainerClassName",
+      "columnWrapperClassName",
+      "ListHeaderComponentClassName",
+      "ListFooterComponentClassName",
+    ]);
+  });
+
+  it("should be a readonly array", () => {
+    // TypeScript compile-time check - if this compiles, the const assertion works
+    const _typeCheck: readonly string[] = DEFAULT_CLASS_ATTRIBUTES;
+    expect(_typeCheck).toBeDefined();
+  });
+});
+
+describe("buildAttributeMatchers", () => {
+  it("should separate exact matches from patterns", () => {
+    const attributes = ["className", "containerClassName", "*Style", "custom*"];
+    const result = buildAttributeMatchers(attributes);
+
+    // Exact matches should be in a Set
+    expect(result.exactMatches).toBeInstanceOf(Set);
+    expect(result.exactMatches.has("className")).toBe(true);
+    expect(result.exactMatches.has("containerClassName")).toBe(true);
+    expect(result.exactMatches.size).toBe(2);
+
+    // Patterns should be RegExp objects
+    expect(result.patterns).toHaveLength(2);
+    expect(result.patterns[0]).toBeInstanceOf(RegExp);
+    expect(result.patterns[1]).toBeInstanceOf(RegExp);
+  });
+
+  it("should handle only exact matches", () => {
+    const attributes = ["className", "customClass", "anotherClass"];
+    const result = buildAttributeMatchers(attributes);
+
+    expect(result.exactMatches.size).toBe(3);
+    expect(result.patterns).toHaveLength(0);
+  });
+
+  it("should handle only patterns", () => {
+    const attributes = ["*ClassName", "container*", "*Style*"];
+    const result = buildAttributeMatchers(attributes);
+
+    expect(result.exactMatches.size).toBe(0);
+    expect(result.patterns).toHaveLength(3);
+  });
+
+  it("should handle empty array", () => {
+    const result = buildAttributeMatchers([]);
+
+    expect(result.exactMatches.size).toBe(0);
+    expect(result.patterns).toHaveLength(0);
+  });
+
+  it("should convert glob patterns to regex correctly", () => {
+    const attributes = ["*ClassName", "container*", "*custom*"];
+    const result = buildAttributeMatchers(attributes);
+
+    // Test that patterns match expected strings
+    expect(result.patterns[0]?.test("myClassName")).toBe(true);
+    expect(result.patterns[0]?.test("fooClassName")).toBe(true);
+    expect(result.patterns[0]?.test("className")).toBe(false); // Doesn't start with anything
+
+    expect(result.patterns[1]?.test("containerStyle")).toBe(true);
+    expect(result.patterns[1]?.test("containerFoo")).toBe(true);
+    expect(result.patterns[1]?.test("myContainer")).toBe(false);
+
+    expect(result.patterns[2]?.test("mycustomattr")).toBe(true);
+    expect(result.patterns[2]?.test("customattr")).toBe(true);
+    expect(result.patterns[2]?.test("attrcustom")).toBe(true);
+  });
+
+  it("should handle multiple wildcards in same pattern", () => {
+    const attributes = ["*custom*Class*"];
+    const result = buildAttributeMatchers(attributes);
+
+    expect(result.patterns[0]?.test("mycustomFooClassName")).toBe(true);
+    expect(result.patterns[0]?.test("customClassName")).toBe(true);
+    expect(result.patterns[0]?.test("foocustombarClassbaz")).toBe(true);
+  });
+});
+
+describe("isAttributeSupported", () => {
+  it("should match exact attributes", () => {
+    const { exactMatches, patterns } = buildAttributeMatchers(["className", "customClass"]);
+
+    expect(isAttributeSupported("className", exactMatches, patterns)).toBe(true);
+    expect(isAttributeSupported("customClass", exactMatches, patterns)).toBe(true);
+    expect(isAttributeSupported("otherClass", exactMatches, patterns)).toBe(false);
+  });
+
+  it("should match pattern-based attributes", () => {
+    const { exactMatches, patterns } = buildAttributeMatchers(["*ClassName", "container*"]);
+
+    expect(isAttributeSupported("myClassName", exactMatches, patterns)).toBe(true);
+    expect(isAttributeSupported("fooClassName", exactMatches, patterns)).toBe(true);
+    expect(isAttributeSupported("containerStyle", exactMatches, patterns)).toBe(true);
+    expect(isAttributeSupported("containerFoo", exactMatches, patterns)).toBe(true);
+    expect(isAttributeSupported("randomAttr", exactMatches, patterns)).toBe(false);
+  });
+
+  it("should match both exact and pattern attributes", () => {
+    const { exactMatches, patterns } = buildAttributeMatchers(["className", "*Style"]);
+
+    // Exact match
+    expect(isAttributeSupported("className", exactMatches, patterns)).toBe(true);
+
+    // Pattern match
+    expect(isAttributeSupported("containerStyle", exactMatches, patterns)).toBe(true);
+    expect(isAttributeSupported("customStyle", exactMatches, patterns)).toBe(true);
+
+    // No match
+    expect(isAttributeSupported("otherAttr", exactMatches, patterns)).toBe(false);
+  });
+
+  it("should prioritize exact matches (performance)", () => {
+    // Even if a pattern would match, exact match should work
+    const { exactMatches, patterns } = buildAttributeMatchers(["className", "*Name"]);
+
+    expect(isAttributeSupported("className", exactMatches, patterns)).toBe(true);
+  });
+
+  it("should handle empty matchers", () => {
+    const { exactMatches, patterns } = buildAttributeMatchers([]);
+
+    expect(isAttributeSupported("className", exactMatches, patterns)).toBe(false);
+    expect(isAttributeSupported("anyAttr", exactMatches, patterns)).toBe(false);
+  });
+
+  it("should be case-sensitive", () => {
+    const { exactMatches, patterns } = buildAttributeMatchers(["className"]);
+
+    expect(isAttributeSupported("className", exactMatches, patterns)).toBe(true);
+    expect(isAttributeSupported("ClassName", exactMatches, patterns)).toBe(false);
+    expect(isAttributeSupported("classname", exactMatches, patterns)).toBe(false);
+  });
+
+  it("should match default React Native FlatList attributes", () => {
+    const { exactMatches, patterns } = buildAttributeMatchers([...DEFAULT_CLASS_ATTRIBUTES]);
+
+    expect(isAttributeSupported("className", exactMatches, patterns)).toBe(true);
+    expect(isAttributeSupported("contentContainerClassName", exactMatches, patterns)).toBe(true);
+    expect(isAttributeSupported("columnWrapperClassName", exactMatches, patterns)).toBe(true);
+    expect(isAttributeSupported("ListHeaderComponentClassName", exactMatches, patterns)).toBe(true);
+    expect(isAttributeSupported("ListFooterComponentClassName", exactMatches, patterns)).toBe(true);
+  });
+
+  it("should work with complex glob patterns", () => {
+    const { exactMatches, patterns } = buildAttributeMatchers(["*Container*Class*"]);
+
+    expect(isAttributeSupported("myContainerFooClassName", exactMatches, patterns)).toBe(true);
+    expect(isAttributeSupported("ContainerClassName", exactMatches, patterns)).toBe(true);
+    expect(isAttributeSupported("fooContainerBarClassBaz", exactMatches, patterns)).toBe(true);
+    expect(isAttributeSupported("ContainerStyle", exactMatches, patterns)).toBe(false);
+  });
+});
+
+describe("getTargetStyleProp", () => {
+  it("should convert className to style", () => {
+    expect(getTargetStyleProp("className")).toBe("style");
+  });
+
+  it("should convert *ClassName to *Style", () => {
+    expect(getTargetStyleProp("contentContainerClassName")).toBe("contentContainerStyle");
+    expect(getTargetStyleProp("columnWrapperClassName")).toBe("columnWrapperStyle");
+    expect(getTargetStyleProp("ListHeaderComponentClassName")).toBe("ListHeaderComponentStyle");
+    expect(getTargetStyleProp("ListFooterComponentClassName")).toBe("ListFooterComponentStyle");
+  });
+
+  it("should handle custom className attributes", () => {
+    expect(getTargetStyleProp("customClassName")).toBe("customStyle");
+    expect(getTargetStyleProp("myCustomClassName")).toBe("myCustomStyle");
+    expect(getTargetStyleProp("fooBarClassName")).toBe("fooBarStyle");
+  });
+
+  it("should return style for attributes not ending in ClassName", () => {
+    expect(getTargetStyleProp("customClass")).toBe("style");
+    expect(getTargetStyleProp("class")).toBe("style");
+    expect(getTargetStyleProp("myAttr")).toBe("style");
+    expect(getTargetStyleProp("")).toBe("style");
+  });
+
+  it("should handle edge cases", () => {
+    // Attribute IS exactly "ClassName"
+    expect(getTargetStyleProp("ClassName")).toBe("Style");
+
+    // Multiple "ClassName" occurrences (only last one replaced)
+    expect(getTargetStyleProp("classNameClassName")).toBe("classNameStyle");
+  });
+
+  it("should be case-sensitive", () => {
+    expect(getTargetStyleProp("classname")).toBe("style");
+    expect(getTargetStyleProp("CLASSNAME")).toBe("style");
+    expect(getTargetStyleProp("classNamee")).toBe("style");
+  });
+
+  it("should handle all default attributes correctly", () => {
+    const expectedMappings = [
+      ["className", "style"],
+      ["contentContainerClassName", "contentContainerStyle"],
+      ["columnWrapperClassName", "columnWrapperStyle"],
+      ["ListHeaderComponentClassName", "ListHeaderComponentStyle"],
+      ["ListFooterComponentClassName", "ListFooterComponentStyle"],
+    ] as const;
+
+    for (const [input, expected] of expectedMappings) {
+      expect(getTargetStyleProp(input)).toBe(expected);
+    }
+  });
+});
+
+describe("Integration - Real-world scenarios", () => {
+  it("should handle FlatList with multiple className attributes", () => {
+    const { exactMatches, patterns } = buildAttributeMatchers([...DEFAULT_CLASS_ATTRIBUTES]);
+
+    // All FlatList className props should be supported
+    const flatListAttrs = [
+      ["className", "style"],
+      ["contentContainerClassName", "contentContainerStyle"],
+      ["columnWrapperClassName", "columnWrapperStyle"],
+      ["ListHeaderComponentClassName", "ListHeaderComponentStyle"],
+      ["ListFooterComponentClassName", "ListFooterComponentStyle"],
+    ] as const;
+
+    for (const [attr, expectedStyle] of flatListAttrs) {
+      expect(isAttributeSupported(attr, exactMatches, patterns)).toBe(true);
+      expect(getTargetStyleProp(attr)).toBe(expectedStyle);
+    }
+  });
+
+  it("should support custom wildcard pattern for all *ClassName attributes", () => {
+    const { exactMatches, patterns } = buildAttributeMatchers(["*ClassName"]);
+
+    // Should match any attribute ending in ClassName (with at least one char before)
+    // Note: The regex ^.*ClassName$ requires at least one character due to .*
+    expect(isAttributeSupported("myCustomClassName", exactMatches, patterns)).toBe(true);
+    expect(isAttributeSupported("fooBarBazClassName", exactMatches, patterns)).toBe(true);
+    expect(isAttributeSupported("xClassName", exactMatches, patterns)).toBe(true);
+
+    // Edge case: bare "className" needs at least one char before it for .* to match
+    // If you want to include "className", add it explicitly or use a different pattern
+    expect(isAttributeSupported("className", exactMatches, patterns)).toBe(false);
+
+    // Should convert to corresponding style prop
+    expect(getTargetStyleProp("myCustomClassName")).toBe("myCustomStyle");
+
+    // Should not match non-className attributes
+    expect(isAttributeSupported("myCustomClass", exactMatches, patterns)).toBe(false);
+  });
+
+  it("should support combining exact matches with patterns", () => {
+    const { exactMatches, patterns } = buildAttributeMatchers([
+      "className",
+      "customClass",
+      "*ClassName",
+      "container*",
+    ]);
+
+    // Exact matches
+    expect(isAttributeSupported("className", exactMatches, patterns)).toBe(true);
+    expect(isAttributeSupported("customClass", exactMatches, patterns)).toBe(true);
+
+    // Pattern matches
+    expect(isAttributeSupported("myClassName", exactMatches, patterns)).toBe(true);
+    expect(isAttributeSupported("containerStyle", exactMatches, patterns)).toBe(true);
+
+    // No matches
+    expect(isAttributeSupported("randomAttr", exactMatches, patterns)).toBe(false);
+  });
+
+  it("should handle empty configuration gracefully", () => {
+    const { exactMatches, patterns } = buildAttributeMatchers([]);
+
+    // Nothing should be supported
+    expect(isAttributeSupported("className", exactMatches, patterns)).toBe(false);
+    expect(isAttributeSupported("anything", exactMatches, patterns)).toBe(false);
+
+    // getTargetStyleProp should still work
+    expect(getTargetStyleProp("className")).toBe("style");
+    expect(getTargetStyleProp("customClassName")).toBe("customStyle");
+  });
+});