ComponentProps

Since 1.2.0

Extract props from a React component or intrinsic element.

Signature

type ComponentProps<T> = T extends keyof JSX.IntrinsicElements
  ? JSX.IntrinsicElements[T]
  : T extends ReactComponentType<infer P>
    ? P
    : never

Parameters

Parameter	Description
T	Component type or intrinsic element key

Examples

Intrinsic Elements

import type { ComponentProps } from 'uni-types'

type ButtonProps = ComponentProps<'button'>
type InputProps = ComponentProps<'input'>
type DivProps = ComponentProps<'div'>

Custom Components

import type { ComponentProps } from 'uni-types'

const MyButton = (props: { variant: 'primary' | 'secondary'; onClick: () => void }) => null

type Props = ComponentProps<typeof MyButton>
// { variant: 'primary' | 'secondary'; onClick: () => void }

Extending Props

interface CustomButtonProps extends ComponentProps<'button'> {
  variant: 'primary' | 'secondary'
}

Related

• PropsWithChildren - Add children prop
• RequiredProps - Get required prop keys
• OptionalProps - Get optional prop keys