@navinc/base-react-components/src/types.ts

Nav's Pattern Library

import type { ComponentType, ComponentProps, JSXElementConstructor } from 'react'
import type {
  AnyStyledComponent,
  StyledComponent,
  StyledComponentProps,
  StyledComponentInnerComponent,
  StyledComponentInnerOtherProps,
  StyledComponentInnerAttrs,
} from 'styled-components'

type InferStyledComponentProps<C extends AnyStyledComponent> = StyledComponentProps<
  StyledComponentInnerComponent<C>,
  any,
  StyledComponentInnerOtherProps<C>,
  StyledComponentInnerAttrs<C>
> & { as?: never | undefined; forwardedAs?: never | undefined }

export type InferComponentProps<T> = Omit<
  T extends AnyStyledComponent
    ? InferStyledComponentProps<T>
    : T extends keyof JSX.IntrinsicElements | JSXElementConstructor<any>
    ? ComponentProps<T>
    : never,
  'ref'
>

export type PolymorphicStyledComponent<
  BaseComponent extends AnyStyledComponent,
  AsComponent extends ComponentType<any>
> = StyledComponent<StyledComponentInnerComponent<AsComponent>, any, InferStyledComponentProps<BaseComponent>, never>