PR Merge

A pull request's checks pass one by one, a cursor merges it, and the branch is offered for deletion.

Installation

$ pnpm dlx shadcn@latest add @remocn/pr-merge

Usage

tsx

// src/Root.tsx
import { Composition } from "remotion";
import { PrMerge } from "@/components/remocn/pr-merge";
 
const PrMergeScene = () => (
  <PrMerge
    repo="acme/app"
    title="Add dark mode"
    number={128}
    branch="feat/dark-mode"
  />
);
 
export const RemotionRoot = () => (
  <Composition
    id="PrMerge"
    component={PrMergeScene}
    durationInFrames={210}
    fps={30}
    width={1280}
    height={720}
  />
);

A pull request card enters with a list of CI checks that run and pass one by one. Once all are green, a cursor clicks Merge, confirms, and the checks collapse into a Merged state with a Delete branch prompt. Pass repo, title, number, branch and checks (plain names or { name, workflow, seconds }) to make it yours; it ships light and dark.

The ground is a live gradients.sh shader (GshGround), installed with the component as @remocn/gsh. Pick another look with the ground preset prop.

Props17

Prop	Type	Default
repo	string"remocn/remocn" Repository slug shown in the header
title	string"Add launch pack" Pull request title
number	number312 Pull request number
author	string"maya-chen" Author handle shown on the card
reviewer	string"leo-park" Reviewer handle who approves the pull request
branch	string"feat/launch-pack" Source branch name
base	string"main" Target branch the pull request merges into
commits	number14 Commit count shown in the summary
checks	(string \| PrCheck)[]DEFAULT_CHECKS CI checks to run; plain names or { name, workflow, seconds }
additions	number1248 Added-lines count in the diff stat
deletions	number96 Removed-lines count in the diff stat
mergeSha	string"3f2a9c1" Short commit hash shown after the merge
accent	string"#3B5BFD" Accent color for highlights, buttons and progress
speed	number1 Playback speed multiplier for the whole timeline
theme	"light" \| "dark""light" Light or dark palette
ground	GshPresetId— gradients.sh preset id for the backdrop shader
groundParams	Partial<GradientParams>— Overrides for the backdrop shader parameters

repostring
Repository slug shown in the header
Default"remocn/remocn"
titlestring
Pull request title
Default"Add launch pack"
numbernumber
Pull request number
Default312
authorstring
Author handle shown on the card
Default"maya-chen"
reviewerstring
Reviewer handle who approves the pull request
Default"leo-park"
branchstring
Source branch name
Default"feat/launch-pack"
basestring
Target branch the pull request merges into
Default"main"
commitsnumber
Commit count shown in the summary
Default14
checks(string | PrCheck)[]
CI checks to run; plain names or { name, workflow, seconds }
DefaultDEFAULT_CHECKS
additionsnumber
Added-lines count in the diff stat
Default1248
deletionsnumber
Removed-lines count in the diff stat
Default96
mergeShastring
Short commit hash shown after the merge
Default"3f2a9c1"
accentstring
Accent color for highlights, buttons and progress
Default"#3B5BFD"
speednumber
Playback speed multiplier for the whole timeline
Default1
theme"light" | "dark"
Light or dark palette
Default"light"
groundGshPresetId
gradients.sh preset id for the backdrop shader
groundParamsPartial<GradientParams>
Overrides for the backdrop shader parameters