React UI kit

The React UI kit is a library that you can add to your new or existing React application. The UI kit consists of various UI components for the different Weavy apps available. In contrast to the Drop-in UI, the React UI kit uses the Weavy Rest API to consume the data.

Pre-requisites

If you're already familiar with JavaScript and React then you'll be able to use the React UI kit with ease! If not, we recommend you to learn the basics first.

Here are some resources to help you out:

Minimum requirements

  • React >= 18.0.0
  • Weavy Backend >= 11.0.0

Installation

Install the required packages in your React Native project:

npm install @weavy/uikit-react

The React UI kit is also dependant of the theme library that are shared by all our ui kits.

Installing dependencies

In your project directory, run:

npm install @weavy/themes

Wrapping the components in <WeavyProvider>

The Weavy UI kit components that you decide to use must be wrapped in the <WeavyProvider> component. The <WeavyProvider> handles all the common functionality for all the Weavy React UI components.

import React from 'react';
import { WeavyProvider } from '@weavy/uikit-react';

export default function App() {
   return (        
       <WeavyProvider>
           <!-- Weavy components goes here -->
       </WeavyProvider>        
   )
}
Weavy Docs