DocSpace-client/packages/shared/components/text
2024-03-12 15:00:53 +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 Web: Files: fix 2024-03-12 15:00:53 +03:00
text.test.tsx Shared:Components:Text: rewrite to typescript 2023-11-24 12:25:22 +03:00
Text.tsx merge develop + merge fix 2024-03-01 02:18:24 +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