clava 0.4.2 → 0.6.0

package/tests/variants-inference.test.ts

@@ -1,6 +1,8 @@
 import { describe, expectTypeOf, test } from "vitest";
 import { cv } from "../src/index.ts";
 
+const callback = (value: string) => value.toUpperCase();
+
 describe("variants type inference", () => {
   test("function variant infers parameter type as prop type", () => {
     const button = cv({
@@ -18,6 +20,25 @@ describe("variants type inference", () => {
     });
   });
 
+  test("method variant infers optional parameter type as prop type", () => {
+    const grid = cv({
+      variants: {
+        columns(value?: number) {
+          return `columns-${value}`;
+        },
+      },
+    });
+    expectTypeOf(grid.getVariants()).branded.toEqualTypeOf<{
+      columns?: number;
+    }>();
+    grid({ columns: 3 });
+    grid({ columns: undefined });
+    grid({
+      // @ts-expect-error string is not assignable to number
+      columns: "3",
+    });
+  });
+
   test("function variant infers union parameter type", () => {
     const button = cv({
       variants: {
@@ -173,6 +194,116 @@ describe("variants type inference", () => {
     });
   });
 
+  test("computed defaultVariants infer defaultValue and variants", () => {
+    cv({
+      variants: {
+        size: (value: number) => `s-${value}`,
+        color: { red: "r", blue: "b" },
+      },
+      defaultVariants: {
+        size: (defaultValue, variants) => {
+          expectTypeOf(defaultValue).toEqualTypeOf<number | undefined>();
+          expectTypeOf(variants.color).toEqualTypeOf<
+            "red" | "blue" | undefined
+          >();
+          return variants.color === "red" ? 10 : defaultValue;
+        },
+      },
+    });
+    cv({
+      variants: { size: (value: number) => `s-${value}` },
+      defaultVariants: {
+        // @ts-expect-error string is not assignable to number
+        size: () => "10",
+      },
+    });
+  });
+
+  test("computed defaultVariants method infers defaultValue and variants", () => {
+    cv({
+      variants: {
+        compact: { true: "compact", false: "" },
+        size(value?: number) {
+          return `s-${value}`;
+        },
+      },
+      defaultVariants: {
+        size(defaultValue, variants) {
+          expectTypeOf(defaultValue).toEqualTypeOf<number | undefined>();
+          expectTypeOf(variants.compact).toEqualTypeOf<boolean | undefined>();
+          return variants.compact ? 2 : defaultValue;
+        },
+      },
+    });
+    cv({
+      variants: {
+        size(value?: number) {
+          return `s-${value}`;
+        },
+      },
+      defaultVariants: {
+        // @ts-expect-error string is not assignable to number
+        size() {
+          return "10";
+        },
+      },
+    });
+  });
+
+  test("function-valued defaultVariants must return the function", () => {
+    cv({
+      variants: {
+        transform: (value: (value: string) => string) => value("a"),
+      },
+      defaultVariants: {
+        transform: () => callback,
+      },
+    });
+    cv({
+      variants: {
+        transform: (value: (value: string) => string) => value("a"),
+      },
+      defaultVariants: {
+        // @ts-expect-error function values must be returned from a computed default
+        transform: callback,
+      },
+    });
+  });
+
+  test("mixed function-valued defaultVariants must return the function", () => {
+    cv({
+      variants: {
+        transform: (value: ((value: string) => string) | "none") => {
+          return value === "none" ? "none" : value("a");
+        },
+      },
+      defaultVariants: {
+        transform: "none",
+      },
+    });
+    cv({
+      variants: {
+        transform: (value: ((value: string) => string) | "none") => {
+          return value === "none" ? "none" : value("a");
+        },
+      },
+      defaultVariants: {
+        transform: () => callback,
+      },
+    });
+    cv({
+      variants: {
+        transform: (value: ((value: string) => string) | "none") => {
+          return value === "none" ? "none" : value("a");
+        },
+      },
+      defaultVariants: {
+        // @ts-expect-error function values must be returned from a computed default
+        transform: callback,
+      },
+    });
+  });
+
   test("refine callback sees function variant param type", () => {
     cv({
       variants: { size: (value: number) => `s-${value}` },
@@ -187,6 +318,24 @@ describe("variants type inference", () => {
     });
   });
 
+  test("refine method infers context from method variants", () => {
+    cv({
+      variants: {
+        size(value?: number) {
+          return `s-${value}`;
+        },
+      },
+      refine({ variants, setVariants }) {
+        expectTypeOf(variants.size).toEqualTypeOf<number | undefined>();
+        setVariants({ size: 10 });
+        setVariants({
+          // @ts-expect-error string not assignable to number
+          size: "10",
+        });
+      },
+    });
+  });
+
   test("function variant return type accepts ClassValue and StyleClassValue", () => {
     cv({
       variants: {