@algolia/ui-library

Algolia UI library

A set of shareable, reusable UI components for Algolia interfaces, built in React. Complete list available here: https://algolia-ui-library.netlify.com/.

Purpose

The goal of this library is to provide a set of React UI components that can be easily integrated into any Algolia project.

The design of these components is identical to the design found on algolia.com. The styles are using Algolia's custom version of Fragments.css.

Usage

1. Run one of the following commands in your project, depending on your package manager:

npm install @algolia/ui-library --save

yarn add @algolia/ui-library

1. Use the UI components like this:

import React from 'react';
import { Button, Text } from '@algolia/ui-library';

const MyComponent = () => (
  <div>
    <Text>This is some text</Text>
    <Button>This is a button</Button>
  </div>
);

export default MyComponent;

Contributing

• Clone the repository
• Install all dependencies: yarn or npm install
• Launch Storybook: yarn storybook or npm run storybook

Releases

Once you consider that the develop branch holds enough changes to release a new version, here are the 3 steps to follow:

• run npm version [your_version]. This will automatically:
  • checkout develop
  • create a branch named with the version number
  • update the version number
  • push it to Github.
• create two PRs:
  • one to merge [your_version] into develop (this will update the package.json version)
  • the other one to merge [your_version] into master (this will update the Storybook).
• run npm publish to push the new release to npm.

Important: don't delete your branch once merged. This will help keeping a clear history of previous changes.