# @enesis/dev

Documentation-style development sandbox for the Enesis Editor. A Vite + Vue 3 app that exercises every `@enesis/editor` `<Block>` feature through live, editable examples organized across 10 catalog pages.

## Quick Start

From the workspace root:

```bash
pnpm dev
```

Opens at `http://localhost:5173`.

## Site Map

| Page | Route | Features Demonstrated |
|---|---|---|
| Overview | `/` | Key concepts, Block API table (props + events) |
| Basic Editing | `/basic-editing` | Headings `#`–`######`, paragraphs, horizontal rules |
| Inline Marks | `/inline-marks` | Bold, italic, inline code, strikethrough, highlight, combined marks |
| Tasks & Priorities | `/tasks` | Task states (TODO→DONE cycle), priority flags `[#A]` |
| Blockquotes & Callouts | `/blockquotes` | Blockquote `>`, 5 callout types (NOTE, WARNING, TIP, DANGER, INFO) |
| Links | `/links` | Standard markdown `[text](url)` links |
| Page Refs & Tags | `/refs-tags` | Page refs `[[Page]]`, block refs `((id))`, tags `#tag` |
| Code Blocks | `/code-blocks` | Fenced code blocks with language labels and CM6 syntax highlighting |
| Properties & Dates | `/properties` | `key:: value` properties, date parsing |
| Math | `/math` | Inline `$...$`, display `$$...$$`, mixed content |

Each page features multiple `<LiveExample>` sections — editable `<Block>` instances with a collapsible source code panel.

## Architecture

```
App.vue                     Shell layout — UHeader + UPage + sidebar (UNavigationMenu)
├── pages/index.vue         Overview
├── pages/basic-editing.vue
├── pages/inline-marks.vue
├── pages/tasks.vue
├── pages/blockquotes.vue
├── pages/links.vue
├── pages/refs-tags.vue
├── pages/code-blocks.vue
├── pages/properties.vue
└── pages/math.vue

components/
└── LiveExample.vue         <Block> wrapper with title, description, source code panel
```

The dev app resolves `@enesis/editor` directly to source (`packages/editor/src/index.ts`) via Vite aliases, enabling hot-reload during development.

## Configuration

- **Framework:** Vue 3 + Vite + TypeScript (`strict: true`)
- **UI Library:** Nuxt UI v4 (UNavigationMenu, UPage, UHeader, UColorModeButton, UCard, etc.)
- **Routing:** Vue Router — 10 routes, one per feature page
- **Styling:** Tailwind CSS v4 with Nuxt UI theme
- **Type Checking:** `vue-tsc` (pre-existing type errors in the editor package do not block the dev server)
- **Icons:** Iconify (Lucide)

## Scripts

| Script | Description |
|---|---|
| `pnpm --filter @enesis/dev dev` | Start Vite dev server |
| `pnpm --filter @enesis/dev build` | Type-check + production build |
| `pnpm --filter @enesis/dev preview` | Preview production build |

## Deployment

The dev app is auto-deployed to Codeberg Pages on push to `master`. See `.forgejo/workflows/deploy.yml` at the workspace root.