open-index/open-npm huggingface dataset:
npm package: @reshape-biotech/design-system
Description: First run
Latest version: 2.7.52

## Local development flow with downstream consumer:

First run

```sh
bun link
```

To create a soft link you can install in your consuming project's `node_modules`.

Add this to your consumer's `package.json`:

```sh
"@reshape-biotech/design-system": "link:@reshape-biotech/design-system"
```

or run this:

```sh
bun link @reshape-biotech/design-system
```

Now, to have the package buidling watch for changes:

```sh
bun run package --watch
```

## Publishing

Set the package version in the `package.json` file.
Publish and versioning is automatically handled through GitHub actions.

To build and publish manually:

```bash
bun run package
```

```bash
bun publish
```

`bun publish` requires a valid NPM publishing token to be set in your environment.

## Notes about consuming

As this project heavily uses TailwindCSS **you must** have tailwind include the component files when compiling your bundle css

Specifically, your `tailwind.config.js` should have something like this:

```js
  content: ['./src/**/*.{html,js,svelte,ts}',
    './node_modules/@reshape-biotech/design-system/**/*.{svelte,ts,js}',
],
```

## About the Design System

This package contains the core design system for Reshape Biotech frontend projects, providing a consistent and reusable set of components and styles.

### Contents

1. **Component Library**

   - A collection of shared, reusable Svelte components
   - Standardized UI elements following Reshape Biotech's design guidelines
   - Fully typed components with TypeScript support

2. **Tailwind Configuration**

   - Pre-configured Tailwind CSS setup
   - Custom theme extensions
   - Shared utility classes

3. **Design Tokens**
   - Color palette
   - Typography
   - Shadow definitions

### Usage

Import components and styles from the design system:

```typescript
import { Button, Card } from '@reshape/design-system';
import '@reshape/design-system/styles.css';
```