Skills

Diffs

Use when an app uses @pierre/diffs to render or edit code files, diffs, patches, merge...

Install

npx skills add trycompai/crm --skill diffs -g -a claude-code -y
Repository
trycompai/crm11.8k
Category
Engineering
Updated
4d ago
License
MIT
Context cost
Lightabout 456 tokens
Runs scripts
No, instructions only

What it does

Use when an app uses @pierre/diffs to render or edit code files, diffs, patches, merge conflicts, or CodeView review surfaces, including React, vanilla JavaScript, SSR, workers, annotations, selection, and custom Shiki languages or themes.

@pierre/diffs

Use @pierre/diffs to render syntax-highlighted files and diffs. Use its optional editor, SSR, and worker entries for those capabilities.

Install

pnpm add @pierre/diffs

Install react and react-dom when the app uses the React entry.

Select an API reference

SurfaceReference
@pierre/diffs/reactReact API
@pierre/diffs/editEditor API

Select a recipe

TaskRecipe
Render a file or diff in ReactRender with React
Build a virtualized review surfaceUse CodeView
Edit a React surface or CodeViewEdit with React

Not vendored here

These references were not copied into this skill. There is no local file for them. Read the package types and the upstream documentation instead.

  • Core API: root components, parsing, and file extension APIs.
  • Highlighting API: languages, themes, highlighter state, and streams.
  • Low-level rendering API: renderers, managers, DOM helpers, and constants.
  • Shared types: data, option, render, selection, and editor types.
  • SSR API for @pierre/diffs/ssr, and the recipe for preloading server markup.
  • Worker API for @pierre/diffs/worker, and the recipe for a worker pool.
  • Recipes for vanilla JavaScript rendering and vanilla editing.
  • Recipes for line annotations and selection.
  • Recipe for registering a custom Shiki language or theme.

More in Engineering