feat(css): improve autocomplete resolution

Tahul · Sep 8, 2022 · 1861864 · 1861864
1 parent 35e5b89
commit 1861864
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 3 deletions.
diff --git a/src/types/theme.ts b/src/types/theme.ts
@@ -1,4 +1,4 @@
-import type { NestedKeyOf, WrapUnion } from '.'
+import type { FilterStartingWith, WrapUnion } from '.'
 // eslint-disable-next-line @typescript-eslint/prefer-ts-expect-error
 // @ts-ignore - Can be not found
 import type { GeneratedPinceauTheme, GeneratedTokensPaths } from '#pinceau/types'
@@ -237,9 +237,13 @@ export interface DefaultThemeMap {
 
 export interface PinceauTheme extends GeneratedPinceauTheme, Omit<GlobalTokens, keyof GeneratedPinceauTheme>, PinceauTokens {}
 
-export type PinceauThemePaths = {} & GeneratedTokensPaths
+export type PinceauThemePaths = GeneratedTokensPaths
 
-export type ThemeKey<K extends keyof DefaultThemeMap> = WrapUnion<NestedKeyOf<PinceauTheme[DefaultThemeMap[K]]>, `{${DefaultThemeMap[K]}.`, '}'>
+// Old version; slower and relying on recursively walking through typing object
+// export type ThemeKey<K extends keyof DefaultThemeMap> = WrapUnion<NestedKeyOf<PinceauTheme[DefaultThemeMap[K]]>, `{${DefaultThemeMap[K]}.`, '}'>
+
+// Resolve available theme tokens for a key from theme map and generated theme paths
+export type ThemeKey<K extends keyof DefaultThemeMap> = WrapUnion<FilterStartingWith<PinceauThemePaths, DefaultThemeMap[K]>, '{', '}'>
 
 export interface TokensFunctionOptions {
   /**

diff --git a/src/types/utils.ts b/src/types/utils.ts
@@ -53,6 +53,9 @@ export type NestedKeyOf<TObject> =
   : `${Key}`
 }[keyof TObject & (string | number)]
 
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+export type FilterStartingWith<Set, Needle extends string> = Set extends `${Needle}${infer _X}` ? Set : never
+
 export type WrapUnion<
   TObject extends string,
   TPrefix extends string,