feat(types): support custom values from app.config.ts (#863)

src/runtime/types/alert.d.ts

@@ -0,0 +1,7 @@
+import { alert } from '../ui.config'
+import type { NestedKeyOf, ExtractDeepKey, ExtractDeepObject } from '.'
+import colors from '#ui-colors'
+import type { AppConfig } from 'nuxt/schema'
+
+export type AlertColor = keyof typeof alert.color | ExtractDeepKey<AppConfig, ['ui', 'alert', 'color']> | typeof colors[number]
+export type AlertVariant = keyof typeof alert.variant | ExtractDeepKey<AppConfig, ['ui', 'alert', 'variant']> | NestedKeyOf<typeof alert.color> | NestedKeyOf<ExtractDeepObject<AppConfig, ['ui', 'alert', 'color']>>

src/runtime/types/avatar.d.ts

@@ -1,7 +1,9 @@
 import { avatar } from '../ui.config'
+import type { ExtractDeepKey } from '.'
 import colors from '#ui-colors'
+import type { AppConfig } from 'nuxt/schema'
 
-export type AvatarSize = keyof typeof avatar.size
+export type AvatarSize = keyof typeof avatar.size | ExtractDeepKey<AppConfig, ['ui', 'avatar', 'size']>
 export type AvatarChipColor = 'gray' | typeof colors[number]
 export type AvatarChipPosition = keyof typeof avatar.chip.position
 

src/runtime/types/badge.d.ts

@@ -1,10 +1,11 @@
 import { badge } from '../ui.config'
-import type { NestedKeyOf } from '.'
+import type { NestedKeyOf, ExtractDeepKey, ExtractDeepObject } from '.'
 import colors from '#ui-colors'
+import type { AppConfig } from 'nuxt/schema'
 
-export type BadgeSize = keyof typeof badge.size
-export type BadgeColor = keyof typeof badge.color | typeof colors[number]
-export type BadgeVariant = keyof typeof badge.variant | NestedKeyOf<typeof badge.color>
+export type BadgeSize = keyof typeof badge.size | ExtractDeepKey<AppConfig, ['ui', 'badge', 'size']>
+export type BadgeColor = keyof typeof badge.color | ExtractDeepKey<AppConfig, ['ui', 'badge', 'color']> | typeof colors[number]
+export type BadgeVariant = keyof typeof badge.variant | ExtractDeepKey<AppConfig, ['ui', 'badge', 'variant']> | NestedKeyOf<typeof badge.color> | NestedKeyOf<ExtractDeepObject<AppConfig, ['ui', 'badge', 'color']>>
 
 export interface Badge {
   label?: string

src/runtime/types/button.d.ts

@@ -1,11 +1,12 @@
 import type { Link } from './link'
 import { button } from '../ui.config'
-import type { NestedKeyOf } from '.'
+import type { NestedKeyOf, ExtractDeepKey, ExtractDeepObject } from '.'
 import colors from '#ui-colors'
+import type { AppConfig } from 'nuxt/schema'
 
-export type ButtonSize = keyof typeof button.size
-export type ButtonColor = keyof typeof button.color | typeof colors[number]
-export type ButtonVariant = keyof typeof button.variant | NestedKeyOf<typeof button.color>
+export type ButtonSize = keyof typeof button.size | ExtractDeepKey<AppConfig, ['ui', 'button', 'size']>
+export type ButtonColor = keyof typeof button.color | ExtractDeepKey<AppConfig, ['ui', 'button', 'color']> | typeof colors[number]
+export type ButtonVariant = keyof typeof button.variant | ExtractDeepKey<AppConfig, ['ui', 'button', 'variant']> | NestedKeyOf<typeof button.color> | NestedKeyOf<ExtractDeepObject<AppConfig, ['ui', 'button', 'color']>>
 
 export interface Button extends Link {
   type?: string

src/runtime/types/form-group.d.ts

@@ -0,0 +1,5 @@
+import { formGroup } from '../ui.config'
+import type { ExtractDeepKey } from '.'
+import type { AppConfig } from 'nuxt/schema'
+
+export type FormGroupSize = keyof typeof formGroup.size | ExtractDeepKey<AppConfig, ['ui', 'formGroup', 'size']>

src/runtime/types/form.d.ts

@@ -1,4 +1,4 @@
-import { Ref } from 'vue'
+import type { Ref } from 'vue'
 
 export interface FormError<T extends string = string> {
   path: T

src/runtime/types/index.d.ts

@@ -1,4 +1,5 @@
 export * from './accordion'
+export * from './alert'
 export * from './avatar'
 export * from './badge'
 export * from './breadcrumb'
@@ -6,12 +7,19 @@ export * from './button'
 export * from './clipboard'
 export * from './command-palette'
 export * from './dropdown'
+export * from './form-group'
 export * from './form'
+export * from './input'
+export * from './kbd'
 export * from './link'
 export * from './meter'
 export * from './notification'
 export * from './popper'
 export * from './progress'
+export * from './range'
+export * from './select'
 export * from './tabs'
+export * from './textarea'
+export * from './toggle'
 export * from './vertical-navigation'
 export * from './utils'

src/runtime/types/input.d.ts

@@ -0,0 +1,8 @@
+import { input } from '../ui.config'
+import type { NestedKeyOf, ExtractDeepKey, ExtractDeepObject } from '.'
+import colors from '#ui-colors'
+import type { AppConfig } from 'nuxt/schema'
+
+export type InputSize = keyof typeof input.size | ExtractDeepKey<AppConfig, ['ui', 'input', 'size']>
+export type InputColor = keyof typeof input.color | ExtractDeepKey<AppConfig, ['ui', 'input', 'color']> | typeof colors[number]
+export type InputVariant = keyof typeof input.variant | ExtractDeepKey<AppConfig, ['ui', 'input', 'variant']> | NestedKeyOf<typeof input.color> | NestedKeyOf<ExtractDeepObject<AppConfig, ['ui', 'input', 'color']>>

src/runtime/types/kbd.d.ts

@@ -0,0 +1,5 @@
+import { kbd } from '../ui.config'
+import type { ExtractDeepKey } from '.'
+import type { AppConfig } from 'nuxt/schema'
+
+export type KbdSize = keyof typeof kbd.size | ExtractDeepKey<AppConfig, ['ui', 'kbd', 'size']>

src/runtime/types/range.d.ts

@@ -0,0 +1,5 @@
+import { range } from '../ui.config'
+import type { ExtractDeepKey } from '.'
+import type { AppConfig } from 'nuxt/schema'
+
+export type RangeSize = keyof typeof range.size | ExtractDeepKey<AppConfig, ['ui', 'range', 'size']>

src/runtime/types/select.d.ts

@@ -0,0 +1,8 @@
+import { select } from '../ui.config'
+import type { NestedKeyOf, ExtractDeepKey, ExtractDeepObject } from '.'
+import colors from '#ui-colors'
+import type { AppConfig } from 'nuxt/schema'
+
+export type SelectSize = keyof typeof select.size | ExtractDeepKey<AppConfig, ['ui', 'select', 'size']>
+export type SelectColor = keyof typeof select.color | ExtractDeepKey<AppConfig, ['ui', 'select', 'color']> | typeof colors[number]
+export type SelectVariant = keyof typeof select.variant | ExtractDeepKey<AppConfig, ['ui', 'select', 'variant']> | NestedKeyOf<typeof select.color> | NestedKeyOf<ExtractDeepObject<AppConfig, ['ui', 'select', 'color']>>

src/runtime/types/textarea.d.ts

@@ -0,0 +1,8 @@
+import { textarea } from '../ui.config'
+import type { NestedKeyOf, ExtractDeepKey, ExtractDeepObject } from '.'
+import colors from '#ui-colors'
+import type { AppConfig } from 'nuxt/schema'
+
+export type TextareaSize = keyof typeof textarea.size | ExtractDeepKey<AppConfig, ['ui', 'textarea', 'size']>
+export type TextareaColor = keyof typeof textarea.color | ExtractDeepKey<AppConfig, ['ui', 'textarea', 'color']> | typeof colors[number]
+export type TextareaVariant = keyof typeof textarea.variant | ExtractDeepKey<AppConfig, ['ui', 'textarea', 'variant']> | NestedKeyOf<typeof textarea.color> | NestedKeyOf<ExtractDeepObject<AppConfig, ['ui', 'textarea', 'color']>>

src/runtime/types/toggle.d.ts

@@ -0,0 +1,5 @@
+import { toggle } from '../ui.config'
+import type { ExtractDeepKey } from '.'
+import type { AppConfig } from 'nuxt/schema'
+
+export type ToggleSize = keyof typeof toggle.size | ExtractDeepKey<AppConfig, ['ui', 'toggle', 'size']>

src/runtime/types/utils.d.ts

@@ -1,11 +1,28 @@
-export type Strategy = 'merge' | 'override';
+export type Strategy = 'merge' | 'override'
 
 export type NestedKeyOf<ObjectType extends object> = {
   [Key in keyof ObjectType]: ObjectType[Key] extends object
   ? NestedKeyOf<ObjectType[Key]>
-  : Key;
-}[keyof ObjectType];
+  : Key
+}[keyof ObjectType]
 
 export type DeepPartial<T> = Partial<{
-  [P in keyof T]: DeepPartial<T[P]> | { [key: string]: string | object };
-}>;
+  [P in keyof T]: DeepPartial<T[P]> | { [key: string]: string | object }
+}>
+
+type DeepKey<T, Keys extends string[]> =
+  Keys extends [infer First, ...infer Rest]
+    ? First extends keyof T
+      ? Rest extends string[]
+        ? DeepKey<T[First], Rest>
+        : never
+      : never
+    : T
+
+export type ExtractDeepKey<T, Path extends string[]> = DeepKey<T, Path> extends infer Result
+  ? Result extends object ? keyof Result : never
+  : never
+
+export type ExtractDeepObject<T, Path extends string[]> = DeepKey<T, Path> extends infer Result
+  ? Result extends object ? Result : never
+  : never