DocSpace-buildtools/packages/components/heading

Heading

Heading text structured in levels.

Usage

import Heading from "@docspace/components/heading";

<Heading level={1} title="Some title">
  Some text
</Heading>

If you need to override styles add forwardedAs instead of as

const StyledHeading = styled(Heading)`
  &:hover {
    border-bottom: 1px dotted;
  }
`;

<StyledHeading forwardedAs="h2" title="Some title">
  Some text
</StyledHeading>

Properties

Props	Type	Required	Values	Default	Description
color	string	-	-	#333333	Specifies the headline color
isInline	bool	-	-	false	Sets the 'display: inline-block' property
level	oneOf	-	1, 2, 3, 4, 5, 6	1	The heading level. It corresponds to the number after the 'H' for the DOM tag. Set the level for semantic accuracy and accessibility.
size	oneOF	-	xsmall, small, medium, large, xlarge	large	Sets the size of headline
title	bool	-	-	-	Title
truncate	bool	-	-	false	Disables word wrapping