# @revel8/core

Shared components, utilities, and types for Revel8 applications.

## Overview

This package provides common functionality shared between:
- **revel8-explorer** - Web application for exploring the Intuition knowledge graph
- **intuition-extension** - Browser extension for Intuition insights

## Installation

```bash
# Using pnpm (recommended)
pnpm add @revel8/core

# Using npm
npm install @revel8/core

# For local development (link)
cd revel8-core && pnpm link
cd ../revel8-explorer && pnpm link @revel8/core
```

## Usage

### Utilities

```typescript
import { cn, truncateId, ipfsToHttp, formatCompact } from '@revel8/core'

// Merge Tailwind classes
cn('px-4 py-2', isActive && 'bg-blue-500')

// Truncate atom/triple IDs for display
truncateId('0x123456789098765432') // '12345'

// Convert IPFS URIs to HTTP
ipfsToHttp('ipfs://QmHash123') // 'https://ipfs.io/ipfs/QmHash123'

// Format large numbers
formatCompact(1500000) // '1.5M'
```

### Components

```typescript
// UI primitives (as they are added)
import { Button, Card } from '@revel8/core/components/ui'

// Display components (as they are added)
import { AtomIcon, Avatar } from '@revel8/core/components/display'
```

### Tailwind Configuration

Extend the shared Tailwind config in your app:

```javascript
// tailwind.config.js
const sharedConfig = require('@revel8/core/tailwind.config')

module.exports = {
  presets: [sharedConfig],
  content: [
    './src/**/*.{ts,tsx}',
    './node_modules/@revel8/core/dist/**/*.js',
  ],
  // Your app-specific extensions...
}
```

## Development

```bash
# Install dependencies
pnpm install

# Build the package
pnpm build

# Watch mode for development
pnpm dev

# Type check
pnpm typecheck
```

## Package Structure

```
revel8-core/
├── src/
│   ├── index.ts              # Main entry point
│   ├── components/
│   │   ├── ui/               # shadcn/ui primitives
│   │   │   └── index.ts
│   │   └── display/          # Intuition display components
│   │       └── index.ts
│   ├── utils/
│   │   ├── index.ts
│   │   ├── cn.ts             # Class name utility
│   │   └── formatting.ts     # Formatting helpers
│   └── types/
│       └── index.ts          # Shared TypeScript types
├── tailwind.config.js        # Shared Tailwind configuration
├── tsconfig.json
├── tsup.config.ts            # Build configuration
└── package.json
```

## Exports

The package provides multiple entry points:

| Import Path | Contents |
|-------------|----------|
| `@revel8/core` | Everything (utils, components, types) |
| `@revel8/core/utils` | Utility functions only |
| `@revel8/core/components/ui` | UI primitives |
| `@revel8/core/components/display` | Display components |

## Peer Dependencies

This package requires the following peer dependencies:

| Package | Version |
|---------|---------|
| `react` | ^18.0.0 \|\| ^19.0.0 |
| `react-dom` | ^18.0.0 \|\| ^19.0.0 |
| `tailwindcss` | ^3.0.0 \|\| ^4.0.0 (optional) |

## Adding New Components

1. Create the component in the appropriate directory
2. Export it from the directory's `index.ts`
3. Rebuild the package: `pnpm build`
4. Update consuming apps to use the new component

### Migration Checklist

When migrating a component from a consuming app:

- [ ] Copy component to `src/components/`
- [ ] Update imports to use relative paths (no `@/` or `~/` aliases)
- [ ] Ensure it only depends on:
  - Other `@revel8/core` exports
  - Peer dependencies (React, etc.)
  - Direct dependencies listed in package.json
- [ ] Add export to the appropriate barrel file
- [ ] Test in both consuming apps
- [ ] Remove original from consuming apps

## License

ISC © Kylan Hurt