Row - Plain Docs

The row component has the following properties:

rowMainContent (min 1): an array of row components
rowAsideContent (min 1): an array of row components

The following components can be used in a row:

Badge
CopyButton
Divider
LinkButton
Spacer
Text
PlainText

For example:

Typescript SDK
GraphQL

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

uiComponent.row({
  mainContent: [uiComponent.text({ text: 'Membership' })],
  asideContent: [uiComponent.badge({ label: 'Premium plan', color: 'BLUE' })],
});

{
  "componentRow": {
    "rowMainContent": [
      {
        "componentText": {
          "text": "Membership"
        }
      }
    ],
    "rowAsideContent": [
      {
        "componentBadge": {
          "badgeLabel": "Premium plan",
          "badgeColor": "BLUE"
        }
      }
    ]
  }
}