@rapido/components

This package includes a library of common primitive components used in Rapido apps.

Please refer to the Rapido documentation:

• Getting Started – How to create a new app.
• User Guide – How to develop apps bootstrapped with Rapido.

Installation

yarn add @rapido/components

Getting Started

import React from 'react';
import { Box, Heading, Button } from '@rapido/components';

export default props => (
  <Box>
    <Heading>Hello</Heading>
    <Button>Rapido</Button>
  </Box>
);

API

This package includes the following availble components:

• Box - Responsive box-model layout component
• Text - Responsive typography component
• Button - Button component with variants
• Image - Responsive image component with variants

Box

For full usage guide see the documentation.

<Box p={5} fontSize={4} color="white" bg="primary">
  <Text>Box</Text>
</Box>

Text

For full usage guide see the documentation.

<Text fontWeight="bold" color="primary">
  Text
</Text>

Button

For full usage guide see the documentation.

<Box>
  <Button variant="primary" mr={2}>
    Primary
  </Button>
  <Button variant="secondary" mr={2}>
    Secondary
  </Button>
  <Button variant="outline" mr={2}>
    Outline
  </Button>
</Box>

Image

For full usage guide see the documentation.

<Image width={100} height={100} src={props.image} />