Ampersand React library

Overview

Ampersand is a declarative platform for SaaS builders who are creating product integrations.

This repository contains the Ampersand React library, a set of React components that allow your end users to install and manage Ampersand integrations.

Prerequisites

- React version 18+

$3

Requires
- Chakra 2.4.4 - 2.10 (https://chakra-ui.com/getting-started)
- Chakra peer dependencies: @emotion/react, @emotion/styled, framer-motion

Installation

In your repo, use npm or yarn to install the package @amp-labs/react:

``sh
npm install @amp-labs/react
`

`sh
yarn add @amp-labs/react
`

$3

@amp-labs/react 2.0+ no longer requires chakra as a dependency. Chakra dependencies (@chakra-ui/react @emotion/react @emotion/styled framer-motion)
are no longer required.

@amp-labs/react now ships with its own stylesheet which also allows users to override colors,
fonts, and other css variables. See Usage changes

$3

If you are using yarn, you'll have to also install the peer dependencies.
`
yarn add @amp-labs/react @chakra-ui/react @emotion/react @emotion/styled framer-motion
`

Usage

Please visit our documentation to learn more about how to use this library.

$3

In addition to importing components, the default stylesheet must also be imported. You may also override
--amp css variables from default styles by importing your own stylesheet.

`
import { AmpersandProvider } from '@amp-labs/react';
import '@amp-labs/react/styles'; // amp-labs style sheet
import './App.css'; // optional: your own css override

const options = {
project: 'PROJECT', // Your Ampersand project name or ID.
apiKey: 'API_KEY',// Your Ampersand API key.
};

function App() {
return (
// Wrap all your components inside AmpersandProvider.
// You can either do this at the App level,
// or further down in the component tree.

// You can use any of the Ampersand components here.
...

)
}
``

License

This repository is licensed under the MIT license.

To read this license, please see LICENSE.md.

Local Development

Please see CONTRIBUTING.md.