refactor: make WithEscapeHatch<T> much more performant (#2816)

chakra-ui · Aug 25, 2024 · 8c276ff · 8c276ff
1 parent bf488fe
commit 8c276ff
Show file tree

Hide file tree

Showing 4 changed files with 21 additions and 8 deletions.
diff --git a/.changeset/fresh-dodos-return.md b/.changeset/fresh-dodos-return.md
@@ -0,0 +1,13 @@
+---
+'@pandacss/generator': patch
+'@pandacss/studio': patch
+---
+
+make `WithEscapeHatch<T>` much more performant
+
+This pull request is a follow-up pull request to #2466.
+
+Make `WithEscapeHatch<T>` much more performant and typescript happy by updating the type signature of `WithImportant<T>`
+and `WithColorOpacityModifier<T>` to use _branded type_ and _non-distributive conditional types_, while keeping such
+tokens valid and also not appearing in autocompletions to prevent them from polluting autocompletion result (which is
+the current behavior).
diff --git a/packages/generator/__tests__/generate-prop-types.test.ts b/packages/generator/__tests__/generate-prop-types.test.ts
@@ -211,12 +211,12 @@ describe('generate property types', () => {
 
 
 
-      type WithColorOpacityModifier<T> = T extends string ? \`\${T}/\${string}\` : T
+      type WithColorOpacityModifier<T> = [T] extends [string] ? \`\${T}/\${string}\` & { __colorOpacityModifier?: true } : never
 
       type ImportantMark = "!" | "!important"
       type WhitespaceImportant = \` \${ImportantMark}\`
       type Important = ImportantMark | WhitespaceImportant
-      type WithImportant<T> = T extends string ? \`\${T}\${Important}\` & { __important?: true } : T;
+      type WithImportant<T> = [T] extends [string] ? \`\${T}\${Important}\` & { __important?: true } : never
 
       /**
        * Only relevant when using \`strictTokens\` or \`strictPropertyValues\` in your config.
@@ -283,12 +283,12 @@ describe('generate property types', () => {
 
 
 
-      type WithColorOpacityModifier<T> = T extends string ? \`\${T}/\${string}\` : T
+      type WithColorOpacityModifier<T> = [T] extends [string] ? \`\${T}/\${string}\` & { __colorOpacityModifier?: true } : never
 
       type ImportantMark = "!" | "!important"
       type WhitespaceImportant = \` \${ImportantMark}\`
       type Important = ImportantMark | WhitespaceImportant
-      type WithImportant<T> = T extends string ? \`\${T}\${Important}\` & { __important?: true } : T;
+      type WithImportant<T> = [T] extends [string] ? \`\${T}\${Important}\` & { __important?: true } : never
 
       /**
        * Only relevant when using \`strictTokens\` or \`strictPropertyValues\` in your config.

diff --git a/packages/generator/src/artifacts/types/prop-types.ts b/packages/generator/src/artifacts/types/prop-types.ts
@@ -24,12 +24,12 @@ export function generatePropTypes(ctx: Context) {
   return outdent`
   ${result.join('\n')}
 
-  type WithColorOpacityModifier<T> = T extends string ? \`$\{T}/\${string}\` : T
+  type WithColorOpacityModifier<T> = [T] extends [string] ? \`$\{T}/\${string}\` & { __colorOpacityModifier?: true } : never
 
   type ImportantMark = "!" | "!important"
   type WhitespaceImportant = \` \${ImportantMark}\`
   type Important = ImportantMark | WhitespaceImportant
-  type WithImportant<T> = T extends string ? \`\${T}\${Important}\` & { __important?: true } : T;
+  type WithImportant<T> = [T] extends [string] ? \`\${T}\${Important}\` & { __important?: true } : never
 
   /**
    * Only relevant when using \`strictTokens\` or \`strictPropertyValues\` in your config.

diff --git a/packages/studio/styled-system/types/prop-type.d.ts b/packages/studio/styled-system/types/prop-type.d.ts
@@ -207,12 +207,12 @@ export interface UtilityValues {
 
 
 
-type WithColorOpacityModifier<T> = T extends string ? `${T}/${string}` : T
+type WithColorOpacityModifier<T> = [T] extends [string] ? `${T}/${string}` & { __colorOpacityModifier?: true } : never
 
 type ImportantMark = "!" | "!important"
 type WhitespaceImportant = ` ${ImportantMark}`
 type Important = ImportantMark | WhitespaceImportant
-type WithImportant<T> = T extends string ? `${T}${Important}` & { __important?: true } : T;
+type WithImportant<T> = [T] extends [string] ? `${T}${Important}` & { __important?: true } : never
 
 /**
  * Only relevant when using `strictTokens` or `strictPropertyValues` in your config.