npm package: @reactslides/marketplace
Description: A developer-first presentation tool with React and Tailwind support
Latest version: 0.0.11

# @reactslides/marketplace

A centralized system for discovering, using, and sharing themes, color schemes, templates, and presentation examples for ReactSlides.

## Features

- 📦 **Built-in Themes** - 10+ professionally designed themes
- 🎨 **Color Schemes** - Quick color palette swaps
- 🔍 **Search & Filter** - Find themes by tags, author, or query
- 🔌 **Easy Integration** - Works with CLI and Web app

## Installation

```bash
pnpm add @reactslides/marketplace
```

## Usage

### Using Themes in React

```typescript
import { Presentation, Slide } from "reactslides";
import { corporateDark, getThemeById } from "@reactslides/marketplace";

// Use a specific theme
function App() {
  return (
    <Presentation theme={corporateDark}>
      <Slide>...</Slide>
    </Presentation>
  );
}

// Or get by ID
const theme = getThemeById("corporate-dark");
```

### Search and Filter

```typescript
import { searchThemes, searchColorSchemes, getAllThemeTags } from "@reactslides/marketplace";

// Search by query
const darkThemes = searchThemes({ query: "dark" });

// Search by tags
const businessThemes = searchThemes({ tags: ["corporate", "professional"] });

// Get all available tags
const allTags = getAllThemeTags();
```

### Using via CLI

```bash
# List all available themes
reactslides themes list

# Apply a theme to your project
reactslides themes apply corporate-dark

# Get theme info
reactslides themes info minimalist-light
```

## Available Themes

| Theme ID | Name | Tags |
|----------|------|------|
| `corporate-dark` | Corporate Dark | dark, corporate, professional, business |
| `minimalist-light` | Minimalist Light | light, minimal, clean, simple |
| `creative-gradient` | Creative Gradient | gradient, creative, vibrant, colorful, dark |
| `ocean-blue` | Ocean Blue | blue, ocean, calm, professional, dark |
| `forest-green` | Forest Green | green, nature, forest, eco, dark |
| `sunset-warm` | Sunset Warm | warm, sunset, orange, pink, dark |
| `midnight-purple` | Midnight Purple | purple, elegant, midnight, dark, sophisticated |
| `tech-dark` | Tech Dark | tech, developer, code, dark, programming |
| `startup-bold` | Startup Bold | startup, bold, pitch, energetic, dark |
| `academic-classic` | Academic Classic | academic, education, classic, professional, light |

## Available Color Schemes

| Scheme ID | Name | Tags |
|-----------|------|------|
| `ocean-blue` | Ocean Blue | blue, ocean, calm, professional |
| `sunset-warm` | Sunset Warm | warm, sunset, orange, pink |
| `forest-mist` | Forest Mist | green, nature, forest, natural |
| `royal-purple` | Royal Purple | purple, elegant, royal, sophisticated |
| `rose-gold` | Rose Gold | pink, gold, elegant, soft, feminine |
| `arctic-blue` | Arctic Blue | blue, arctic, cool, modern, light |
| `charcoal-slate` | Charcoal Slate | gray, neutral, professional, dark, slate |
| `emerald-night` | Emerald Night | emerald, green, luxury, dark, rich |

## Theme Structure

Each theme contains:

```typescript
interface MarketplaceTheme {
  id: string;           // Unique identifier
  name: string;         // Display name
  description: string;  // Theme description
  author: string;       // Author name
  version: string;      // Semantic version
  tags: string[];       // Search tags
  colors: {
    primary: string;    // Main brand color
    secondary: string;  // Secondary color
    background: string; // Background color
    foreground: string; // Text color
    muted: string;      // Muted text color
    accent: string;     // Accent/highlight color
  };
  fonts: {
    heading: string;    // Heading font stack
    body: string;       // Body text font stack
    mono: string;       // Monospace font stack
  };
}
```

## Contributing Themes

Want to add your theme to the marketplace? Check out the [contribution guidelines](../../CONTRIBUTING.md).

## License

MIT