Sprinkles: Refactor responsive array type to use Tuple generic (#150)

Author: markdalgleish

.changeset/cuddly-scissors-occur.md

@@ -0,0 +1,5 @@
+---
+'@vanilla-extract/sprinkles': patch
+---
+
+Refactor responsive array type to use Tuple generic

.github/workflows/validate.yml

@@ -11,9 +11,6 @@ jobs:
     steps:
       - name: Checkout Repo
         uses: actions/checkout@main
-        with:
-          # This makes Actions fetch all Git history so that chromatic can diff against previous commits
-          fetch-depth: 0
 
       - name: Setup Node.js 14.x
         uses: actions/setup-node@main

packages/sprinkles/src/types.ts

@@ -1,65 +1,20 @@
-export type RA1<Value> = readonly [Value];
-export type RA2<Value> = readonly [Value, Value];
-export type RA3<Value> = readonly [Value, Value, Value];
-export type RA4<Value> = readonly [Value, Value, Value, Value];
-export type RA5<Value> = readonly [Value, Value, Value, Value, Value];
-export type RA6<Value> = readonly [Value, Value, Value, Value, Value, Value];
-export type RA7<Value> = readonly [
-  Value,
-  Value,
-  Value,
-  Value,
-  Value,
-  Value,
-  Value,
-];
-export type RA8<Value> = readonly [
-  Value,
-  Value,
-  Value,
-  Value,
-  Value,
-  Value,
-  Value,
-  Value,
-];
+interface Tuple<Length extends number, Value> extends ReadonlyArray<Value> {
+  0: Value;
+  length: Length;
+}
 
-export type ResponsiveArrayConfig<Value> =
-  | RA2<Value>
-  | RA3<Value>
-  | RA4<Value>
-  | RA5<Value>
-  | RA6<Value>
-  | RA7<Value>
-  | RA8<Value>;
+export type ResponsiveArrayConfig<Value> = Tuple<2 | 3 | 5 | 6 | 7 | 8, Value>;
 
 export type ResponsiveArray<Count extends number, Value> = [
   never,
-  RA1<Value>,
-  RA1<Value> | RA2<Value>,
-  RA1<Value> | RA2<Value> | RA3<Value>,
-  RA1<Value> | RA2<Value> | RA3<Value> | RA4<Value>,
-  RA1<Value> | RA2<Value> | RA3<Value> | RA4<Value> | RA5<Value>,
-  RA1<Value> | RA2<Value> | RA3<Value> | RA4<Value> | RA5<Value> | RA6<Value>,
-  (
-    | RA1<Value>
-    | RA2<Value>
-    | RA3<Value>
-    | RA4<Value>
-    | RA5<Value>
-    | RA6<Value>
-    | RA7<Value>
-  ),
-  (
-    | RA1<Value>
-    | RA2<Value>
-    | RA3<Value>
-    | RA4<Value>
-    | RA5<Value>
-    | RA6<Value>
-    | RA7<Value>
-    | RA8<Value>
-  ),
+  Tuple<1, Value>,
+  Tuple<1 | 2, Value>,
+  Tuple<1 | 2 | 3, Value>,
+  Tuple<1 | 2 | 3 | 4, Value>,
+  Tuple<1 | 2 | 3 | 4 | 5, Value>,
+  Tuple<1 | 2 | 3 | 4 | 5 | 6, Value>,
+  Tuple<1 | 2 | 3 | 4 | 5 | 6 | 7, Value>,
+  Tuple<1 | 2 | 3 | 4 | 5 | 6 | 7 | 8, Value>,
 ][Count];
 
 export type ConditionalPropertyValue = {