Heading

Component

Title

Storybook

Figma Demo

Content

API

• as: string | Default: undefined
  The heading element to be used (e.g., h1, h2, h3, h4).

• class: string | Default: undefined
  Extra classes provided to the component.

• size: string | Default: undefined
  The size of the heading element. Can be separate from the as prop.

• testId: string | Default: undefined
  The test id of the component.

Example

<script>
	import { Heading } from '@getprovi/craft-svelte';
</script>

<Heading>Title</Heading>
<!-- will be h1 -->
<Heading as="h2" size="h3">h2 but h3 size</Heading>

Types

type Headings = 'h1' | 'h2' | 'h3' | 'h4';

interface Props extends Omit<ComponentProps<Frame>, 'role'> {
	as?: Headings;
	size?: Headings | undefined;
	testId?: string | undefined;
}