@biom3/react

@biom3/react

This package publishes via CICD to the public npm component: @biom3/react.

What's inside?

All react based BIOME components, hooks and utils. All components and hooks will be atleast 90% covered with tests. To read more about our API philosophy see this document.

How to use

To use any @biom3/react primitives, simply install the package using your package manager of choice. For example:

npm i @biom3/react

and then import the primitive you need (all primitives will be exported from the root of the package):

import { Box, IconArrowBackward } from "@biom3/react";

Component based maturity status

We have designed and implemented a grqanular status system where each BIOME design system component has it's own maturity status. Information on these component statuses can be found in confluence.

Each status update should be accompanied by a timestamp (format: ddd mm yyyy, eg: '2nd Dec 2022'). We will use these timestamps to move components through the status levels, as technical debt. You can find each component's status, inside of it's readme.md file.

Status descriptions

Alpha

Early on in a component’s life, it’s status should be set to alpha - which gives developers using it, an indication of the component's maturity. alpha components are likely to see API changes (breaking changes will of-course be avoided - but may sometimes be necessary).

Beta

Components become beta when they have been used in production at least once.

Stable

Components will become stable when they have been beta for 2 months with no API changes. Stable components are fully mature, and will not have their API’s change in a breaking way (unless a new major version is released).

How to provide design-tokens to all BIOME components

BIOME react components are all theme-aware. This means that they all need to sit underneath the <BiomeThemeProvider />. Please ensure you wrap your whole application in the BiomeThemeProvider, so that components at all levels in the tree, have access to BIOME design tokens.

For more information on the BiomeThemeProvider, please view it's readme file.

Presence of NextJS config files

You may notice that this package contains some nextjs config files / settings. Rest assured, the @biom3/react package has zero dependence on next. Next is simply used for internal test build tooling, mostly because its soo easy to do so inside of TurboRepo (and has some minor speed benefits).