Dynamic Heading

This package provides a component capable of rendering text as any heading level (h1 through h6) or as a span element, depending on the provided props. It's designed for dynamic text content where the semantic importance might vary based on context.

Component Properties

| Property Name | Property description | Property Type | IsRequired | | ------------- | ---------------------------------------------------------------------------------- | ----------------- | ---------- | | type | Specifies the heading level (h1-h6) or none for a span. Default is none. | string | | | children | The text content or other React nodes to be rendered inside the heading or span. | React.ReactNode | |

Props Example:

<DynamicHeading
  type="h2"
  className="customClass"
>
    Heading of h2 level
</DynamicHeading>

Usage:

Install the package by running: npm i @squiz/xaccel-dynamic-heading

import { DynamicHeading } from '@squiz/xaccel-dynamic-heading';

function SomeReactComponent({ content }) {
    return <DynamicHeading type="h3">{content}</DynamicHeading>;
}