From 88690372210c925726138c02564f06950a941900 Mon Sep 17 00:00:00 2001
From: siriwatknp <siriwatkunaporn@gmail.com>
Date: Mon, 8 Jan 2024 18:21:24 +0700
Subject: [PATCH] simplify types and add more tests

---
 packages/serialize/types/index.d.ts | 6 ++----
 packages/serialize/types/tests.ts   | 9 +++++++--
 2 files changed, 9 insertions(+), 6 deletions(-)

diff --git a/packages/serialize/types/index.d.ts b/packages/serialize/types/index.d.ts
index 24bcb270b..b9971baee 100644
--- a/packages/serialize/types/index.d.ts
+++ b/packages/serialize/types/index.d.ts
@@ -10,10 +10,8 @@ export type CSSProperties = CSS.PropertiesFallback<number | string>
 export type CSSPropertiesWithMultiValues<Props = unknown> = {
   [K in keyof CSSProperties]:
     | CSSProperties[K]
-    | ReadonlyArray<Extract<CSSProperties[K], string>>
-    | ((
-        props: Props
-      ) => CSSProperties[K] | ReadonlyArray<Extract<CSSProperties[K], string>>)
+    | ReadonlyArray<CSSProperties[K]>
+    | ((props: Props) => CSSProperties[K] | ReadonlyArray<CSSProperties[K]>)
 }
 
 export type CSSPseudos<Props = unknown> = {
diff --git a/packages/serialize/types/tests.ts b/packages/serialize/types/tests.ts
index 21eb33496..3a7ae79e0 100644
--- a/packages/serialize/types/tests.ts
+++ b/packages/serialize/types/tests.ts
@@ -37,13 +37,16 @@ serializeStyles(
   {}
 )
 // $ExpectType SerializedStyles
-serializeStyles<{ vars: { background: string; foreground: string } }>([
+serializeStyles<{
+  vars: { background: string; foreground: string; step: number }
+}>([
   {
     display: () => ['-webkit-flex', 'flex'],
     backgroundColor: ({ vars }) => vars.background,
     color: ({ vars }) => vars.foreground,
     lineHeight: ({ vars }) => 1.2,
-    '--css-var': ({ vars }) => vars.foreground,
+    '--spacing': () => 1,
+    '--step': ({ vars }) => `calc(${vars.step} * var(--spacing))`,
     '&:hover': {
       backgroundColor: ({ vars }) => vars.foreground,
       color: ({ vars }) => vars.background
@@ -58,6 +61,8 @@ serializeStyles()
 // $ExpectError
 serializeStyles({})
 // $ExpectError
+serializeStyles([{ borderCollapse: () => 'unknown' }])
+// $ExpectError
 serializeStyles({}, {})
 
 let cssObject: CSSObject = {