Getting Started

Installation

To install the Sovryn UI Libraryarrow-up-right follow these steps:

  1. Install the packagearrow-up-right via npm or yarn:

npm install @sovryn/ui

or

yarn add @sovryn/ui
  1. Import the desired components from the Sovryn UI Library:

import { Button, Form, Modal } from '@sovryn/ui';

Basic Usage

The Sovryn UI Library provides a wide range of reusable UI components that can be easily integrated into your application. Here are a few examples of basic usage:

  1. Using Buttons:

import { Button, FormGroup, Dialog } from '@sovryn/ui';

const App = () => (
  <>
    <Button
      style={ButtonStyle.primary}
      text="Click Me"
    />
    <FormGroup>
      {/* Form fields */}
    </FormGroup>
    <Dialog isOpen={true}>
      {/* Dialog content */}
    </Modal>
  </>
);
  1. Working with Inputs:

To make the most of the UI Library and access additional resources, refer to the following helpful links:

  1. Storybook: Explore the interactive Storybook, a playground showcasing the UI Library's components with live examples and configurations, allowing you to experiment and understand their behavior. Sovryn Storybookarrow-up-right

  2. Sovryn-dapp: Monorepo that contains the UI Library, you can find all sorts of useful information there, including the overview of all the Sovryn packages. Sovryn-dapp repositoryarrow-up-right

  3. Tailwind CSS: If you want to customize the styles of the Sovryn UI components or learn more about the underlying CSS utility classes, refer to the official Tailwind CSS documentation.

    Tailwind CSS Documentationarrow-up-right

Last updated