Merge pull request nullstack#364 from GuiDevloper/types-improvements

Sync `ref` types in JSX & Context

Author: Mortaro

types/ClientContext.d.ts

@@ -11,7 +11,7 @@ import { NullstackWorker } from './Worker'
 /**
  * @see https://nullstack.app/context
  */
-interface BaseNullstackClientContext {
+interface BaseNullstackClientContext<TProps = unknown> {
   /**
    * Callback function that bootstrap the context for the application.
    */
@@ -120,15 +120,17 @@ interface BaseNullstackClientContext {
    *
    * @see https://nullstack.app/refs#complex-refable-components
    */
-  ref?: { property?: string | number; object?: any } | ((context: NullstackClientContext) => void)
+  ref?: TProps extends { ref: any } ? TProps['ref'] : {
+    object: any
+    property: string | number
+  }
 
   /**
    * Ref element.
    *
    * @see https://nullstack.app/refs#complex-refable-components
    */
-
   element?: HTMLElement
 }
 
-export type NullstackClientContext<TProps = unknown> = BaseNullstackClientContext & TProps
+export type NullstackClientContext<TProps = unknown> = BaseNullstackClientContext<TProps> & TProps

types/JSX.d.ts

@@ -44,22 +44,22 @@ type Booleanish = boolean | 'true' | 'false'
 // Nullstack Elements
 // ----------------------------------------------------------------------
 
-export interface Attributes<HTMLElementType> {
+export interface Attributes<HTMLElementType = unknown> {
   html?: string
   source?: object
   bind?: any
   debounce?: number
-  ref?: HTMLElementType | ((context?: Partial<NullstackClientContext>) => void)
+  ref?: HTMLElementType | ((context?: Partial<NullstackClientContext>) => void) | NullstackClientContext['ref']
   'data-'?: any
   children?: NullstackNode
   route?: string
   persistent?: boolean
   [key: string]: any
 }
 
-export interface NullstackAttributes<T> extends Attributes<T> {}
+export interface NullstackAttributes extends Attributes {}
 
-export interface ClassAttributes<T> extends Attributes<T> {
+export interface ClassAttributes<T = unknown> extends Attributes<T> {
   key?: string
 }
 
@@ -1233,18 +1233,18 @@ export interface SVGAttributes<T> extends AriaAttributes, DOMAttributes<T> {
   y?: number | string
 }
 
-export type ElementTagHTMLAttributes = AllHTMLAttributes<'div'> & {
+export type ElementTagHTMLAttributes = AllHTMLAttributes<HTMLDivElement> & {
   tag?: string
 }
 
-type ExoticElements = Record<string, DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>>
+type ExoticElements = Record<string, DetailedHTMLProps<HTMLAttributes<HTMLElement> | SVGProps<any> | ElementTagHTMLAttributes, HTMLElement>>
 
 declare global {
   namespace JSX {
     type Element = NullstackNode
 
-    type IntrinsicAttributes = NullstackAttributes<unknown>
-    type IntrinsicClassAttributes = ClassAttributes<unknown>
+    type IntrinsicAttributes = NullstackAttributes
+    type IntrinsicClassAttributes = ClassAttributes
 
     interface AllElements {
       // HTML