Type alias PolymorphicComponent<Default>

Type declaration

• • <As>(props: PolymorphicProps<As>): React.ReactElement | null

  • Component that can be polymorphic and handle as-prop

    Components, that are only used as layout component or not necessarily need to be a specific element, could be polymorphic. Types for these components are a bit more complicated. So here is an example of how to handle polymorphic as-prop in react components.

    Example

    import type { PolymorphicComponent } from "@dnshpf/ts-utils";
    
    const Box: PolymorphicComponent<"div"> = ({ as: As, ...props }) => {
     const Component = As || "div";
     return <Component {...props} />;
    }
    

    Type Parameters

    Type Parameters

    • As extends React.ElementType = Default

    Parameters

    • props: PolymorphicProps<As>

    Returns React.ReactElement | null