DocSpace-client/packages/shared/components/text
2023-12-20 17:00:10 +03:00
..
index.tsx Shared: refactoring and apply code guide style 2023-12-05 19:52:30 +03:00
README.md Shared: refactoring and apply code guide style 2023-12-05 19:52:30 +03:00
text.stories.tsx Shared: refactoring and apply code guide style 2023-12-05 19:52:30 +03:00
Text.styled.ts Shared: fix imports 2023-12-06 21:11:14 +03:00
text.test.tsx Shared:Components:Text: rewrite to typescript 2023-11-24 12:25:22 +03:00
Text.tsx Shared:Components:Table\ColorTheme: rewrite to typescript 2023-12-20 12:14:18 +03:00
Text.types.ts Shared:Components:FieldContainer: rewrite to typescript 2023-12-20 17:00:10 +03:00

Text

Component that displays plain text

Usage

import {Text} from "@docspace/shared/components";
<Text as="p" title="Some title">
  Some text
</Text>

If you need to override styles add forwardedAs instead of as

const StyledText = styled(Text)`
  &:hover {
    border-bottom: 1px dotted;
  }
`;
<StyledText forwardedAs="span" title="Some title">
  Some text
</StyledText>

Properties

Props Type Required Values Default Description
as string - - p Sets the tag through which to render the component
backgroundColor string - - - Sets background color
color string - - #333333 Specifies the text color
display string - - - Sets the 'display' property
fontSize string - - 13px Sets the font size
fontWeight oneOfType(number, string) - - - Sets the font weight
isBold bool - - false Sets font weight value to bold
isInline bool - - false Sets the 'display: inline-block' property
isItalic bool - - false Sets the font style
title bool - - - Title
truncate bool - - false Disables word wrapping