ads-fe 0.0.1

package/skills/pnpm/references/features-peer-deps.md

@@ -0,0 +1,250 @@
+---
+name: pnpm-peer-dependencies
+description: Handling peer dependencies with auto-install and resolution rules
+---
+
+# pnpm Peer Dependencies
+
+pnpm has strict peer dependency handling by default. It provides configuration options to control how peer dependencies are resolved and reported.
+
+## Auto-Install Peer Dependencies
+
+By default, pnpm automatically installs peer dependencies:
+
+```ini
+# .npmrc (default is true since pnpm v8)
+auto-install-peers=true
+```
+
+When enabled, pnpm automatically adds missing peer dependencies based on the best matching version.
+
+## Strict Peer Dependencies
+
+Control whether peer dependency issues cause errors:
+
+```ini
+# Fail on peer dependency issues (default: false)
+strict-peer-dependencies=true
+```
+
+When strict, pnpm will fail if:
+- Peer dependency is missing
+- Installed version doesn't match required range
+
+## Peer Dependency Rules
+
+Configure peer dependency behavior in `package.json`:
+
+```json
+{
+  "pnpm": {
+    "peerDependencyRules": {
+      "ignoreMissing": ["@babel/*", "eslint"],
+      "allowedVersions": {
+        "react": "17 || 18"
+      },
+      "allowAny": ["@types/*"]
+    }
+  }
+}
+```
+
+### ignoreMissing
+
+Suppress warnings for missing peer dependencies:
+
+```json
+{
+  "pnpm": {
+    "peerDependencyRules": {
+      "ignoreMissing": [
+        "@babel/*",
+        "eslint",
+        "webpack"
+      ]
+    }
+  }
+}
+```
+
+Use patterns:
+- `"react"` - exact package name
+- `"@babel/*"` - all packages in scope
+- `"*"` - all packages (not recommended)
+
+### allowedVersions
+
+Allow specific versions that would otherwise cause warnings:
+
+```json
+{
+  "pnpm": {
+    "peerDependencyRules": {
+      "allowedVersions": {
+        "react": "17 || 18",
+        "webpack": "4 || 5",
+        "@types/react": "*"
+      }
+    }
+  }
+}
+```
+
+### allowAny
+
+Allow any version for specified peer dependencies:
+
+```json
+{
+  "pnpm": {
+    "peerDependencyRules": {
+      "allowAny": ["@types/*", "eslint"]
+    }
+  }
+}
+```
+
+## Adding Peer Dependencies via Hooks
+
+Use `.pnpmfile.cjs` to add missing peer dependencies:
+
+```js
+// .pnpmfile.cjs
+function readPackage(pkg, context) {
+  // Add missing peer dependency
+  if (pkg.name === 'problematic-package') {
+    pkg.peerDependencies = {
+      ...pkg.peerDependencies,
+      react: '*'
+    }
+  }
+  return pkg
+}
+
+module.exports = {
+  hooks: {
+    readPackage
+  }
+}
+```
+
+## Peer Dependencies in Workspaces
+
+Workspace packages can satisfy peer dependencies:
+
+```json
+// packages/app/package.json
+{
+  "dependencies": {
+    "react": "^18.2.0",
+    "@myorg/components": "workspace:^"
+  }
+}
+
+// packages/components/package.json  
+{
+  "peerDependencies": {
+    "react": "^17.0.0 || ^18.0.0"
+  }
+}
+```
+
+The workspace `app` provides `react` which satisfies `components`' peer dependency.
+
+## Common Scenarios
+
+### Monorepo with Shared React
+
+```yaml
+# pnpm-workspace.yaml
+catalog:
+  react: ^18.2.0
+  react-dom: ^18.2.0
+```
+
+```json
+// packages/ui/package.json
+{
+  "peerDependencies": {
+    "react": "^18.0.0",
+    "react-dom": "^18.0.0"
+  }
+}
+
+// apps/web/package.json
+{
+  "dependencies": {
+    "react": "catalog:",
+    "react-dom": "catalog:",
+    "@myorg/ui": "workspace:^"
+  }
+}
+```
+
+### Suppress ESLint Plugin Warnings
+
+```json
+{
+  "pnpm": {
+    "peerDependencyRules": {
+      "ignoreMissing": [
+        "eslint",
+        "@typescript-eslint/parser"
+      ]
+    }
+  }
+}
+```
+
+### Allow Multiple Major Versions
+
+```json
+{
+  "pnpm": {
+    "peerDependencyRules": {
+      "allowedVersions": {
+        "webpack": "4 || 5",
+        "postcss": "7 || 8"
+      }
+    }
+  }
+}
+```
+
+## Debugging Peer Dependencies
+
+```bash
+# See why a package is installed
+pnpm why <package>
+
+# List all peer dependency warnings
+pnpm install --reporter=append-only 2>&1 | grep -i peer
+
+# Check dependency tree
+pnpm list --depth=Infinity
+```
+
+## Best Practices
+
+1. **Enable auto-install-peers** for convenience (default in pnpm v8+)
+
+2. **Use peerDependencyRules** instead of ignoring all warnings
+
+3. **Document suppressed warnings** explaining why they're safe
+
+4. **Keep peer deps ranges wide** in libraries:
+   ```json
+   {
+     "peerDependencies": {
+       "react": "^17.0.0 || ^18.0.0"
+     }
+   }
+   ```
+
+5. **Test with different peer versions** if you support multiple majors
+
+<!-- 
+Source references:
+- https://pnpm.io/package_json#pnpmpeerdependencyrules
+- https://pnpm.io/npmrc#auto-install-peers
+-->

package/skills/slidev/LICENSE.md

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2020-PRESENT Anthony Fu
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/skills/slidev/README.md

@@ -0,0 +1,61 @@
+# Slidev Skills for Claude Code
+
+Agent skills that help Claude Code understand and work with [Slidev](https://sli.dev) presentations.
+
+## Installation
+
+```bash
+npx skills add slidevjs/slidev
+```
+
+This will add the Slidev skill to your Claude Code configuration.
+
+## What's Included
+
+The Slidev skill provides Claude Code with knowledge about:
+
+- **Core Syntax** - Markdown syntax, slide separators, frontmatter
+- **Animations** - Click animations, transitions, motion effects
+- **Code Features** - Line highlighting, Monaco editor, code groups, magic-move
+- **Diagrams** - Mermaid, PlantUML, LaTeX math
+- **Layouts** - Built-in layouts, slots, global layers
+- **Presenter Mode** - Recording, timer, remote access
+- **Exporting** - PDF, PPTX, PNG, SPA hosting
+
+## Usage
+
+Once installed, Claude Code will automatically use Slidev knowledge when:
+
+- Creating new presentations
+- Adding slides with code examples
+- Setting up animations and transitions
+- Configuring themes and layouts
+- Exporting presentations
+
+### Example Prompts
+
+```
+Create a Slidev presentation about TypeScript generics with code examples
+```
+
+```
+Add a two-column slide with code on the left and explanation on the right
+```
+
+```
+Set up click animations to reveal bullet points one by one
+```
+
+```
+Configure the presentation for PDF export with speaker notes
+```
+
+## Documentation
+
+- [Slidev Documentation](https://sli.dev)
+- [Theme Gallery](https://sli.dev/resources/theme-gallery)
+- [Showcases](https://sli.dev/resources/showcases)
+
+## License
+
+MIT

package/skills/slidev/SKILL.md

@@ -0,0 +1,189 @@
+---
+name: slidev
+description: Create and present web-based slidedecks for developers using Slidev with Markdown, Vue components, code highlighting, animations, and interactive features. Use when building technical presentations, conference talks, code walkthroughs, teaching materials, or developer decks.
+---
+
+# Slidev - Presentation Slides for Developers
+
+Web-based slides maker built on Vite, Vue, and Markdown.
+
+## When to Use
+
+- Technical presentations or slidedecks with live code examples
+- Syntax-highlighted code snippets with animations
+- Interactive demos (Monaco editor, runnable code)
+- Mathematical equations (LaTeX) or diagrams (Mermaid, PlantUML)
+- Record presentations with presenter notes
+- Export to PDF, PPTX, or host as SPA
+- Code walkthroughs for developer talks or workshops
+
+## Quick Start
+
+```bash
+pnpm create slidev    # Create project
+pnpm run dev          # Start dev server (opens http://localhost:3030)
+pnpm run build        # Build static SPA
+pnpm run export       # Export to PDF (requires playwright-chromium)
+```
+
+**Verify**: After `pnpm run dev`, confirm slides load at `http://localhost:3030`. After `pnpm run export`, check the output PDF exists in the project root.
+
+## Basic Syntax
+
+```md
+---
+theme: default
+title: My Presentation
+---
+
+# First Slide
+
+Content here
+
+---
+
+# Second Slide
+
+More content
+
+<!--
+Presenter notes go here
+-->
+```
+
+- `---` separates slides
+- First frontmatter = headmatter (deck config)
+- HTML comments = presenter notes
+
+## Core References
+
+| Topic | Description | Reference |
+|-------|-------------|-----------|
+| Markdown Syntax | Slide separators, frontmatter, notes, code blocks | [core-syntax](references/core-syntax.md) |
+| Animations | v-click, v-clicks, motion, transitions | [core-animations](references/core-animations.md) |
+| Headmatter | Deck-wide configuration options | [core-headmatter](references/core-headmatter.md) |
+| Frontmatter | Per-slide configuration options | [core-frontmatter](references/core-frontmatter.md) |
+| CLI Commands | Dev, build, export, theme commands | [core-cli](references/core-cli.md) |
+| Components | Built-in Vue components | [core-components](references/core-components.md) |
+| Layouts | Built-in slide layouts | [core-layouts](references/core-layouts.md) |
+| Exporting | PDF, PPTX, PNG export options | [core-exporting](references/core-exporting.md) |
+| Hosting | Build and deploy to various platforms | [core-hosting](references/core-hosting.md) |
+| Global Context | $nav, $slidev, composables API | [core-global-context](references/core-global-context.md) |
+
+## Feature Reference
+
+### Code & Editor
+
+| Feature | Usage | Reference |
+|---------|-------|-----------|
+| Line highlighting | `` ```ts {2,3} `` | [code-line-highlighting](references/code-line-highlighting.md) |
+| Click-based highlighting | `` ```ts {1\|2-3\|all} `` | [code-line-highlighting](references/code-line-highlighting.md) |
+| Line numbers | `lineNumbers: true` or `{lines:true}` | [code-line-numbers](references/code-line-numbers.md) |
+| Scrollable code | `{maxHeight:'100px'}` | [code-max-height](references/code-max-height.md) |
+| Code tabs | `::code-group` (requires `comark: true`) | [code-groups](references/code-groups.md) |
+| Monaco editor | `` ```ts {monaco} `` | [editor-monaco](references/editor-monaco.md) |
+| Run code | `` ```ts {monaco-run} `` | [editor-monaco-run](references/editor-monaco-run.md) |
+| Edit files | `<<< ./file.ts {monaco-write}` | [editor-monaco-write](references/editor-monaco-write.md) |
+| Code animations | `` ````md magic-move `` | [code-magic-move](references/code-magic-move.md) |
+| TypeScript types | `` ```ts twoslash `` | [code-twoslash](references/code-twoslash.md) |
+| Import code | `<<< @/snippets/file.js` | [code-import-snippet](references/code-import-snippet.md) |
+
+### Diagrams & Math
+
+| Feature | Usage | Reference |
+|---------|-------|-----------|
+| Mermaid diagrams | `` ```mermaid `` | [diagram-mermaid](references/diagram-mermaid.md) |
+| PlantUML diagrams | `` ```plantuml `` | [diagram-plantuml](references/diagram-plantuml.md) |
+| LaTeX math | `$inline$` or `$$block$$` | [diagram-latex](references/diagram-latex.md) |
+
+### Layout & Styling
+
+| Feature | Usage | Reference |
+|---------|-------|-----------|
+| Canvas size | `canvasWidth`, `aspectRatio` | [layout-canvas-size](references/layout-canvas-size.md) |
+| Zoom slide | `zoom: 0.8` | [layout-zoom](references/layout-zoom.md) |
+| Scale elements | `<Transform :scale="0.5">` | [layout-transform](references/layout-transform.md) |
+| Layout slots | `::right::`, `::default::` | [layout-slots](references/layout-slots.md) |
+| Scoped CSS | `<style>` in slide | [style-scoped](references/style-scoped.md) |
+| Global layers | `global-top.vue`, `global-bottom.vue` | [layout-global-layers](references/layout-global-layers.md) |
+| Draggable elements | `v-drag`, `<v-drag>` | [layout-draggable](references/layout-draggable.md) |
+| Icons | `<mdi-icon-name />` | [style-icons](references/style-icons.md) |
+
+### Animation & Interaction
+
+| Feature | Usage | Reference |
+|---------|-------|-----------|
+| Click animations | `v-click`, `<v-clicks>` | [core-animations](references/core-animations.md) |
+| Rough markers | `v-mark.underline`, `v-mark.circle` | [animation-rough-marker](references/animation-rough-marker.md) |
+| Drawing mode | Press `C` or config `drawings:` | [animation-drawing](references/animation-drawing.md) |
+| Direction styles | `forward:delay-300` | [style-direction](references/style-direction.md) |
+| Note highlighting | `[click]` in notes | [animation-click-marker](references/animation-click-marker.md) |
+
+### Syntax Extensions
+
+| Feature | Usage | Reference |
+|---------|-------|-----------|
+| Comark syntax | `comark: true` + `{style="color:red"}` | [syntax-comark](references/syntax-comark.md) |
+| Block frontmatter | `` ```yaml `` instead of `---` | [syntax-block-frontmatter](references/syntax-block-frontmatter.md) |
+| Import slides | `src: ./other.md` | [syntax-importing-slides](references/syntax-importing-slides.md) |
+| Merge frontmatter | Main entry wins | [syntax-frontmatter-merging](references/syntax-frontmatter-merging.md) |
+
+### Presenter & Recording
+
+| Feature | Usage | Reference |
+|---------|-------|-----------|
+| Recording | Press `G` for camera | [presenter-recording](references/presenter-recording.md) |
+| Timer | `duration: 30min`, `timer: countdown` | [presenter-timer](references/presenter-timer.md) |
+| Remote control | `slidev --remote` | [presenter-remote](references/presenter-remote.md) |
+| Ruby text | `notesAutoRuby:` | [presenter-notes-ruby](references/presenter-notes-ruby.md) |
+
+### Export & Build
+
+| Feature | Usage | Reference |
+|---------|-------|-----------|
+| Export options | `slidev export` | [core-exporting](references/core-exporting.md) |
+| Build & deploy | `slidev build` | [core-hosting](references/core-hosting.md) |
+| Build with PDF | `download: true` | [build-pdf](references/build-pdf.md) |
+| Cache images | Automatic for remote URLs | [build-remote-assets](references/build-remote-assets.md) |
+| OG image | `seoMeta.ogImage` or `og-image.png` | [build-og-image](references/build-og-image.md) |
+| SEO tags | `seoMeta:` | [build-seo-meta](references/build-seo-meta.md) |
+
+**Export prerequisite**: `pnpm add -D playwright-chromium` is required for PDF/PPTX/PNG export. If export fails with a browser error, install this dependency first.
+
+### Editor & Tools
+
+| Feature | Usage | Reference |
+|---------|-------|-----------|
+| Side editor | Click edit icon | [editor-side](references/editor-side.md) |
+| VS Code extension | Install `antfu.slidev` | [editor-vscode](references/editor-vscode.md) |
+| Prettier | `prettier-plugin-slidev` | [editor-prettier](references/editor-prettier.md) |
+| Eject theme | `slidev theme eject` | [tool-eject-theme](references/tool-eject-theme.md) |
+
+### Lifecycle & API
+
+| Feature | Usage | Reference |
+|---------|-------|-----------|
+| Slide hooks | `onSlideEnter()`, `onSlideLeave()` | [api-slide-hooks](references/api-slide-hooks.md) |
+| Navigation API | `$nav`, `useNav()` | [core-global-context](references/core-global-context.md) |
+
+## Common Layouts
+
+| Layout | Purpose |
+|--------|---------|
+| `cover` | Title/cover slide |
+| `center` | Centered content |
+| `default` | Standard slide |
+| `two-cols` | Two columns (use `::right::`) |
+| `two-cols-header` | Header + two columns |
+| `image` / `image-left` / `image-right` | Image layouts |
+| `iframe` / `iframe-left` / `iframe-right` | Embed URLs |
+| `quote` | Quotation |
+| `section` | Section divider |
+| `fact` / `statement` | Data/statement display |
+| `intro` / `end` | Intro/end slides |
+
+## Resources
+
+- Documentation: https://sli.dev
+- Theme Gallery: https://sli.dev/resources/theme-gallery
+- Showcases: https://sli.dev/resources/showcases

package/skills/slidev/SYNC.md

@@ -0,0 +1,5 @@
+# Sync Info
+
+- Source: `vendor/slidev/skills/slidev`
+- Git SHA: `9a10a59212d101841999078911b94feb77548bb8`
+- Synced: 2026-05-21

package/skills/slidev/references/animation-click-marker.md

@@ -0,0 +1,37 @@
+---
+name: click-marker
+description: Highlight and auto-scroll presenter notes based on click progress
+---
+
+# Click Markers
+
+Highlight and auto-scroll presenter notes based on click progress.
+
+## Syntax
+
+Add `[click]` markers in presenter notes:
+
+```md
+<!--
+Content before the first click
+
+[click] This will be highlighted after the first click
+
+Also highlighted after the first click
+
+- [click] This list element highlights after the second click
+
+[click:3] Last click (skip two clicks)
+-->
+```
+
+## Behavior
+
+- Notes between markers highlight in sync with slide progress
+- Auto-scrolls presenter view to active section
+- Use `[click:{n}]` to skip to specific click number
+
+## Requirements
+
+- Only works in presenter mode
+- Notes must be HTML comments at end of slide

package/skills/slidev/references/animation-drawing.md

@@ -0,0 +1,68 @@
+---
+name: drawing
+description: Draw and annotate slides during presentation
+---
+
+# Drawing & Annotations
+
+Draw and annotate slides during presentation. Powered by drauu.
+
+## Enable Drawing
+
+Click the pen icon in the navigation bar or press `C`.
+
+## Stylus Support
+
+Stylus pens (iPad + Apple Pencil) work automatically - draw with pen, navigate with fingers.
+
+## Persist Drawings
+
+Save drawings as SVGs and include in exports:
+
+```md
+---
+drawings:
+  persist: true
+---
+```
+
+Drawings saved to `.slidev/drawings/`.
+
+## Disable Drawing
+
+Entirely:
+```md
+---
+drawings:
+  enabled: false
+---
+```
+
+Only in development:
+```md
+---
+drawings:
+  enabled: dev
+---
+```
+
+Only in presenter mode:
+```md
+---
+drawings:
+  presenterOnly: true
+---
+```
+
+## Sync Settings
+
+Disable sync across instances:
+
+```md
+---
+drawings:
+  syncAll: false
+---
+```
+
+Only presenter's drawings sync to others.

package/skills/slidev/references/animation-rough-marker.md

@@ -0,0 +1,53 @@
+---
+name: rough-marker
+description: Hand-drawn style highlighting using Rough Notation
+---
+
+# Rough Markers
+
+Hand-drawn style highlighting using Rough Notation.
+
+## v-mark Directive
+
+```html
+<span v-mark>Important text</span>
+```
+
+## Marker Types
+
+```html
+<span v-mark.underline>Underlined</span>
+<span v-mark.circle>Circled</span>
+<span v-mark.highlight>Highlighted</span>
+<span v-mark.strike-through>Struck through</span>
+<span v-mark.box>Boxed</span>
+```
+
+## Colors
+
+```html
+<span v-mark.red>Red marker</span>
+<span v-mark.blue>Blue marker</span>
+```
+
+Custom color:
+```html
+<span v-mark="{ color: '#234' }">Custom color</span>
+```
+
+## Click Timing
+
+Works like v-click:
+
+```html
+<span v-mark="5">Appears on click 5</span>
+<span v-mark="'+1'">Next click</span>
+```
+
+## Full Options
+
+```html
+<span v-mark="{ at: 5, color: '#234', type: 'circle' }">
+  Custom marker
+</span>
+```