fix: nested class value type (#9)

src/__tests__/tv.test.ts

@@ -1016,4 +1016,43 @@ describe("Tailwind Variants (TV)", () => {
       "wrapper--size--medium",
     ]);
   });
+
+  test("should work with nested arrays", () => {
+    const menu = tv({
+      base: ["base--styles-1", ["base--styles-2", ["base--styles-3"]]],
+      slots: {
+        item: ["slots--item-1", ["slots--item-2", ["slots--item-3"]]],
+      },
+      variants: {
+        color: {
+          primary: {
+            item: [
+              "item--color--primary-1",
+              ["item--color--primary-2", ["item--color--primary-3"]],
+            ],
+          },
+        },
+      },
+    });
+
+    const popover = tv({
+      variants: {
+        isOpen: {
+          true: ["isOpen--true-1", ["isOpen--true-2", ["isOpen--true-3"]]],
+          false: ["isOpen--false-1", ["isOpen--false-2", ["isOpen--false-3"]]],
+        },
+      },
+    });
+
+    const {base, item} = menu({color: "primary"});
+
+    expectTv(base(), ["base--styles-1", "base--styles-2", "base--styles-3"]);
+    expectTv(item(), [
+      "item--color--primary-1",
+      "item--color--primary-2",
+      "item--color--primary-3",
+    ]);
+    expectTv(popover({isOpen: true}), ["isOpen--true-1", "isOpen--true-2", "isOpen--true-3"]);
+    expectTv(popover({isOpen: false}), ["isOpen--false-1", "isOpen--false-2", "isOpen--false-3"]);
+  });
 });

src/utils.d.ts

@@ -1,6 +1,6 @@
 import {TVConfig} from "./config";
 
-export declare type ClassValue = string | string[] | null | undefined;
+export declare type ClassValue = string | string[] | null | undefined | ClassValue[];
 
 export declare type ClassProp<V extends unknown = ClassValue> =
   | {