Dreamy React Library

Reusable React components and design tokens for Dreamy products. The library is built with TypeScript, Tailwind CSS, Radix UI, and tsup.

Requirements

• Node.js 18.18 or newer
• Next.js 15
• React 18
• Tailwind CSS 3.3 or newer

Install

npm install @dreamybyai/react-lib

The package declares Next.js, React, React DOM, and Tailwind CSS as peer dependencies. Applications must provide compatible versions.

Tailwind setup

Include the compiled library output in the application's Tailwind content paths:

/** @type {import('tailwindcss').Config} */
module.exports = {
  content: [
    './app/**/*.{js,ts,jsx,tsx,mdx}',
    './src/**/*.{js,ts,jsx,tsx,mdx}',
    './node_modules/@dreamybyai/react-lib/dist/**/*.{js,mjs}',
  ],
};

The build copies the shared SCSS tokens to dist/styles for applications that consume those files directly.

Usage

Import components and hooks from their subpaths so applications only load the code and styles they use. The package root remains available for compatibility.

import { Button } from '@dreamybyai/react-lib/components/button/button';
import { Heading } from '@dreamybyai/react-lib/components/typography';
import { useNotification } from '@dreamybyai/react-lib/hooks/useNotification';

import { Button, Card, Input, Spinner } from '@dreamybyai/react-lib';

export function ExampleForm() {
  return (
    <Card>
      <Input placeholder="Name" />
      <Button>Submit</Button>
      <Spinner />
    </Card>
  );
}

Development

npm ci
npm run build
npm run storybook

Before publishing, verify the package contents without uploading them:

npm pack --dry-run

Publishing

Publishing requires access to the @dreamybyai npm scope:

npm publish --access public

Version changes and releases must be committed through a pull request before publishing.

License

MIT