DocSpace-client/packages/components/text
2023-07-11 13:57:11 +02:00
..
common-text-styles.js Web: Components: Move getCorrectTextAlign, getCorrectFourValuesStyle and getCorrectBorderRadius to rtlUtils 2023-06-02 12:10:29 +02:00
index.js Web: Components: Fix wrong LTR text truncation in RTL mode 2023-07-04 17:58:14 +02:00
README.md Web: Moved all clients app to packages directory 2022-07-22 22:01:25 +03:00
styled-text.js Web: Components: Remove unnecessary defaultProps expanding 2023-07-11 13:57:11 +02:00
text.stories.js Web: Component: hide storybook control 2023-05-25 17:48:09 +05:00
text.test.js Web: Moved all clients app to packages directory 2022-07-22 22:01:25 +03:00

Text

Component that displays plain text

Usage

import Text from "@docspace/components/text";
<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