Text - Plain Docs

The text component has the following properties:

text: the text. Can include a subset of markdown (bold, italic, and links).
textSize (optional): one of S, M, L, defaults to M
textColor (optional): one of NORMAL, MUTED, SUCCESS, WARNING, ERROR, defaults to NORMAL

For example:

Typescript SDK
GraphQL

import { uiComponent } from '@team-plain/typescript-sdk';

[
  uiComponent.text({
    text: 'The **quick** brown fox _jumps_ over the [lazy link](https://plain.com)',
  }),

  uiComponent.text({ text: 'Small text', size: 'S' }),

  uiComponent.text({ text: 'Medium text', size: 'M' }),

  uiComponent.text({ text: 'Large text', size: 'L' }),

  uiComponent.text({ text: 'Normal text', color: 'NORMAL' }),

  uiComponent.text({ text: 'Muted text', color: 'MUTED' }),

  uiComponent.text({ text: 'Success text', color: 'SUCCESS' }),

  uiComponent.text({ text: 'Warning text', color: 'WARNING' }),

  uiComponent.text({ text: 'Error text', color: 'ERROR' }),
];

[
  {
    "componentText": {
      "text": "The **quick** brown fox _jumps_ over the [lazy link](https://plain.com)"
    }
  },
  {
    "componentText": {
      "text": "Small text",
      "textSize": "S"
    }
  },
  {
    "componentText": {
      "text": "Medium text",
      "textSize": "M"
    }
  },
  {
    "componentText": {
      "text": "Large text",
      "textSize": "L"
    }
  },
  {
    "componentText": {
      "text": "Normal text",
      "textColor": "NORMAL"
    }
  },
  {
    "componentText": {
      "text": "Muted text",
      "textColor": "MUTED"
    }
  },
  {
    "componentText": {
      "text": "Success text",
      "textColor": "SUCCESS"
    }
  },
  {
    "componentText": {
      "text": "Warning text",
      "textColor": "WARNING"
    }
  },
  {
    "componentText": {
      "text": "Error text",
      "textColor": "ERROR"
    }
  }
]