open-index/open-npm huggingface dataset:
npm package: @reltio/design
Description: Reltio Design Platform
Latest version: 0.4.0


**@reltio/design** is a public JavaScript library that contains key components and utilities for developing Reltio UI applications.

- Built on ReactJS.
- Intended for Reltio internal teams developing applications.
- [Storybook with component examples is available here](https://reltio.design).

## Installation

To install, use NPM:  
```bash
npm install @reltio/design
```
## Usage

Example usage of the **Button** component:

```jsx
import React from 'react';
import { Button } from '@reltio/design';

function App() {
  return <Button>Touch me</Button>;
}

export default App;
```

**Important:** React is listed as peer dependencies. Make sure it's added to your project.

### Design Tokens

To use Reltio color tokens (CSS custom properties for theming and dark mode), import the variables stylesheet:

```js
import "@reltio/design/variables.css";
```

This provides all `--reltio-color-*` variables on `:root` (light mode) and `[data-theme="dark"]` (dark mode). See the [Component Customization](https://reltio.design/?path=/docs/guides-component-customization--docs) guide for details.

## Target Audience

The library is designed for Reltio internal teams developing applications.

If you need additional components from the [Storybook](https://reltio.design), contact the **UI Center of Excellence** team at [ui.coe@reltio.com](mailto:ui.coe@reltio.com).

## Contribution

Adding or modifying components is done via the monorepo: [https://bitbucket.org/reltio-ondemand/reltio-design](https://bitbucket.org/reltio-ondemand/reltio-design).

### Development Process:

1. Ensure you have write access to the monorepo.
2. Create a feature branch for your changes.
3. Run Storybook locally with `npm run dev`
3. Follow the standard pull request (PR) creation and code review processes adopted across Reltio teams.
4. After your PR is successfully merged into the main branch, run a **custom Bitbucket pipeline** to publish the component to NPM.

### Publishing:

- If the component is published from the main branch, it will be released to NPM.
- If it is published from a feature branch, the component will be versioned as `0.0.0-{BUILD_ID}` and tagged with `{BRANCH_NAME}`.

For any questions about the process, contact the **UI Center of Excellence** team via [ui.coe@reltio.com](mailto:ui.coe@reltio.com).

## License

This library is distributed under Reltio’s corporate license and is intended for internal use only.
npm package: @relume_io/relume-tailwind
Description: Relume Tailwind Config. A preset Tailwind config using the Relume design system.
Author: Relume
Latest version: 1.3.0

# Relume Tailwind

A Tailwind config based on the [Relume](https://www.relume.io) design system.

## Install

```bash
npm i @relume_io/relume-tailwind @relume_io/relume-ui
```

```js
module.exports = {
  content: [
    "./src/**/*.{js,ts,jsx,tsx,mdx}",
    "./app/**/*.{js,ts,jsx,tsx,mdx}",
    "./node_modules/@relume_io/relume-ui/dist/**/*.{js,ts,jsx,tsx}",
  ],
  presets: [require("@relume_io/relume-tailwind")],
};
```

## ESM

```js
import relumeTailwindPreset from "@relume_io/relume-tailwind";

export default {
  content: [
    "./src/**/*.{js,ts,jsx,tsx,mdx}",
    "./app/**/*.{js,ts,jsx,tsx,mdx}",
    "./node_modules/@relume_io/relume-ui/dist/**/*.{js,ts,jsx,tsx}",
  ],
  presets: [relumeTailwindPreset],
};


## Docs

[Read The Docs](https://react-docs.relume.io/getting-started/tailwind)
```
npm package: @relume_io/relume-ui
Description: Relume React UI Library
Author: Relume
Latest version: 1.3.1

# Relume UI

A React UI library based on the Relume design system and used by the [Relume Library](https://www.relume.io/react/components)

## Install

```bash
npm i @relume_io/relume-ui @relume_io/relume-tailwind
```

```js
module.exports = {
  content: ["./node_modules/@relume_io/relume-ui/dist/**/*.{js,ts,jsx,tsx}"],
  presets: [require("@relume_io/relume-tailwind")],
};
```

```tsx
import * as React from "react";
import { Button } from "@relume_io/relume-ui";

<Button>Buy Now</Button>;
```

## Docs

[Read The Docs](https://react-docs.relume.io/)

## Relume Library

Find over 100+ Section components in the [Relume Library](https://www.relume.io/react/components)