mockups/pr.html
Rama main · réplica de lectura del repositorio original.
<!DOCTYPE html>
<html lang="en" class="dark">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Add OAuth scopes to access tokens · PR #341 · mkappworks/cloudzilla — Cloudzilla</title>
<link rel="stylesheet" href="/assets/tailwind.css" />
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link href="https://fonts.googleapis.com/css2?family=Geist+Mono:wght@400;500&family=Geist:wght@400;500;600&display=swap" rel="stylesheet" />
</head>
<body class="min-h-screen flex flex-col antialiased font-sans">
<a href="#main-content" class="skip-link">Skip to main content</a>
<div id="cz-header" data-repo-tab="pull_requests"></div>
<main id="main-content" tabindex="-1" class="max-w-[1400px] mx-auto px-6 pt-6 pb-20 flex-1 w-full">
<div>
<section class="mb-3 border-b border-border pb-3" aria-labelledby="pull-title">
<p class="font-mono text-[11px] text-muted-foreground uppercase tracking-wider mb-2">
<a href="repo.html" class="hover:underline">cloudzilla</a>
<span aria-hidden="true">·</span>
<a href="pulls.html" class="hover:underline">Pull requests</a>
<span aria-hidden="true">·</span>
<span aria-current="page">#341</span>
</p>
<div class="flex flex-wrap items-start justify-between gap-3 mb-3">
<h1 id="pull-title" class="text-2xl tracking-tight font-medium min-w-0">
<span id="pr-title-text">Add OAuth scopes to access tokens</span>
<span class="text-muted-foreground font-normal" aria-label="Pull request number 341">#341</span>
</h1>
<div class="flex items-center gap-1.5 shrink-0">
<button type="button" id="edit-pr-btn" class="h-8 px-3 text-[13px] border border-border rounded-md hover:bg-accent">Edit</button>
<div class="relative inline-block" data-dropdown>
<button type="button" class="h-8 px-3 text-[13px] border border-border rounded-md hover:bg-accent inline-flex items-center gap-1.5" aria-haspopup="menu" aria-expanded="false">
<svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" aria-hidden="true" focusable="false"><polyline points="16 18 22 12 16 6"></polyline><polyline points="8 6 2 12 8 18"></polyline></svg>
Code
<svg class="text-muted-foreground" width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" aria-hidden="true" focusable="false"><path d="M7 10l5 5 5-5"></path></svg>
</button>
<div role="menu" class="hidden absolute right-0 top-full mt-1.5 z-50 min-w-[12rem] rounded-md border border-border bg-popover text-popover-foreground shadow-md p-1 text-sm">
<div class="px-2 py-1.5 text-[11px] uppercase tracking-wider text-muted-foreground">Check out — daisy/oauth-scopes</div>
<pre class="font-mono text-[11px] text-muted-foreground m-1 p-2 rounded-sm border border-border bg-muted overflow-x-auto whitespace-pre" onclick="event.stopPropagation()">git fetch origin
git checkout daisy/oauth-scopes</pre>
<div role="separator" class="my-1 h-px bg-border"></div>
<a href="tree.html" role="menuitem" class="flex items-center gap-2 px-2 py-1.5 rounded-xs hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground focus:outline-hidden whitespace-nowrap">Browse branch code</a>
</div>
</div>
</div>
</div>
<div class="flex flex-wrap items-center gap-3">
<span data-when="pr=open" class="inline-flex items-center gap-1.5 h-[22px] px-2 rounded-full border text-[11px] font-medium bg-success/15 text-success border-success/30">Open</span>
<span data-when="pr=draft" class="inline-flex items-center gap-1.5 h-[22px] px-2 rounded-full border text-[11px] font-medium bg-muted text-muted-foreground border-transparent">Draft</span>
<span data-when="pr=merged" class="inline-flex items-center gap-1.5 h-[22px] px-2 rounded-full border text-[11px] font-medium bg-[hsl(270_70%_50%/0.15)] text-[hsl(270_70%_70%)] border-[hsl(270_70%_50%/0.30)]">Merged</span>
<p data-when="pr=open,draft" class="text-[13px] text-muted-foreground">
<a href="profile.html" class="font-medium text-foreground underline underline-offset-2 decoration-muted-foreground/50 hover:decoration-foreground">@daisy</a>
wants to merge
<strong class="text-foreground font-medium">3 commits</strong>
into
<span class="font-mono px-1.5 py-0.5 bg-muted border border-border rounded-sm text-[12px]">main</span>
from
<span class="font-mono px-1.5 py-0.5 bg-muted border border-border rounded-sm text-[12px]">daisy/oauth-scopes</span>
</p>
<p data-when="pr=merged" class="text-[13px] text-muted-foreground">
<a href="profile.html" class="font-medium text-foreground underline underline-offset-2 decoration-muted-foreground/50 hover:decoration-foreground">@malith</a>
merged
<strong class="text-foreground font-medium">3 commits</strong>
into
<span class="font-mono px-1.5 py-0.5 bg-muted border border-border rounded-sm text-[12px]">main</span>
from
<span class="font-mono px-1.5 py-0.5 bg-muted border border-border rounded-sm text-[12px]">daisy/oauth-scopes</span>
</p>
</div>
</section>
<nav class="border-b border-border mb-6 py-1.5 flex flex-wrap items-center gap-1 text-sm" aria-label="Pull request views">
<a href="pr.html" class="px-3 py-1.5 rounded-md bg-accent text-foreground font-medium inline-flex items-center gap-2 whitespace-nowrap" aria-current="page">
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" aria-hidden="true" focusable="false"><path d="M21 11.5a8.38 8.38 0 01-.9 3.8 8.5 8.5 0 01-7.6 4.7 8.38 8.38 0 01-3.8-.9L3 21l1.9-5.7a8.38 8.38 0 01-.9-3.8 8.5 8.5 0 014.7-7.6 8.38 8.38 0 013.8-.9h.5a8.48 8.48 0 018 8v.5z"></path></svg>
Conversation
<span class="font-mono text-[11px] text-muted-foreground">6</span>
</a>
<a href="pr_commits.html" class="px-3 py-1.5 rounded-md text-muted-foreground hover:text-foreground hover:bg-accent inline-flex items-center gap-2 whitespace-nowrap">
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" aria-hidden="true" focusable="false"><circle cx="12" cy="6" r="3"></circle><circle cx="12" cy="18" r="3"></circle><path d="M12 9v6"></path></svg>
Commits
<span class="font-mono text-[11px] text-muted-foreground">3</span>
</a>
<a href="pr_checks.html" class="px-3 py-1.5 rounded-md text-muted-foreground hover:text-foreground hover:bg-accent inline-flex items-center gap-2 whitespace-nowrap">
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" aria-hidden="true" focusable="false"><circle cx="6" cy="12" r="3"></circle><circle cx="18" cy="6" r="3"></circle><circle cx="18" cy="18" r="3"></circle><path d="M9 12h6M15 6L9 10M15 18l-6-4"></path></svg>
Checks
<span class="inline-flex items-center gap-1 h-[18px] px-1.5 rounded-full text-[10px] font-medium bg-success/15 text-success">✓ 6</span>
</a>
<a href="pr_files.html" class="px-3 py-1.5 rounded-md text-muted-foreground hover:text-foreground hover:bg-accent inline-flex items-center gap-2 whitespace-nowrap">
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" aria-hidden="true" focusable="false"><path d="M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8z"></path><polyline points="14 2 14 8 20 8"></polyline></svg>
Files changed
<span class="font-mono text-[11px] text-muted-foreground">4</span>
<span class="font-mono text-[10px] font-medium text-success">+41</span>
<span class="font-mono text-[10px] font-medium text-destructive">−5</span>
</a>
</nav>
<div class="grid lg:grid-cols-[1fr_280px] gap-8">
<div class="min-w-0">
<div data-when="pr=draft" role="status" class="mb-6 px-4 py-3 rounded-md border border-warning/40 bg-warning/10 flex items-center justify-between gap-4">
<p class="text-sm text-warning">This pull request is still a work in progress. Merge is blocked until it is marked ready for review.</p>
<button type="button" data-ready data-when="viewer=reviewer,author" class="inline-flex items-center justify-center gap-1.5 rounded-md font-medium transition-colors disabled:opacity-50 disabled:pointer-events-none bg-success text-success-foreground hover:bg-success/90 h-8 px-3 text-[13px]">Ready for review</button>
</div>
<article id="pr-description" class="rounded-md border border-border bg-card overflow-hidden mb-6" aria-label="Pull request description">
<header class="px-4 py-2.5 border-b border-border bg-blue-500/10 flex items-center gap-2 flex-wrap">
<span class="inline-grid place-items-center rounded-full bg-muted border border-border font-medium text-muted-foreground h-6 w-6 text-[10px]" role="img" aria-label="daisy">D</span>
<a href="profile.html" class="text-[13px] font-medium hover:underline">@daisy</a>
<span class="text-[12px] text-muted-foreground">
opened this pull request
<time datetime="2026-05-13T11:00:00Z">May 13, 2026</time>
</span>
<span class="ml-auto text-[10px] px-1.5 py-0.5 bg-muted border border-border rounded-sm text-muted-foreground">Author</span>
<button type="button" id="edit-desc-btn" class="inline-flex items-center gap-1 h-7 px-2 rounded-md border border-border hover:bg-accent text-[12px] text-muted-foreground">
<svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" aria-hidden="true"><path d="M11 4H4a2 2 0 00-2 2v14a2 2 0 002 2h14a2 2 0 002-2v-7"></path><path d="M18.5 2.5a2.121 2.121 0 113 3L12 15l-4 1 1-4 9.5-9.5z"></path></svg>
Edit
</button>
</header>
<div class="px-5 py-4">
<div id="desc-rendered" class="prose prose-sm dark:prose-invert max-w-none">
<p>Adds OAuth scope support to access tokens (PATs). Closes <a href="issue_detail.html">#298</a>.</p>
<p><strong>What changed:</strong></p>
<ul>
<li>New <code>access_token_scopes</code> table with FK to <code>access_tokens</code></li>
<li>UI checkboxes for scope selection on token creation page</li>
<li>Middleware enforces scope on every API request</li>
<li>Token list shows scope badges</li>
</ul>
<p><strong>How to test:</strong></p>
<pre><code>make migrate
make dev
# Create a token at /settings/tokens with scope=repo:read only
curl -H "Authorization: Bearer $TOKEN" /api/repos
# Should 200. Then try POST — should 403.</code></pre>
<p>Reviewers: this is the first time we're enforcing scopes, so the middleware change is the riskiest part.</p>
</div>
<form id="desc-editor" class="hidden">
<div class="rounded-md border border-border overflow-hidden">
<div class="md-editor" data-md-editor>
<div class="flex items-center gap-2 border-b border-border px-3">
<div role="tablist" aria-label="Editor mode" class="flex">
<button type="button" role="tab" data-md-tab="write" aria-selected="true" class="px-3 py-2 text-[13px] border-b-2 border-foreground text-foreground font-medium -mb-px">Write</button>
<button type="button" role="tab" data-md-tab="preview" aria-selected="false" class="px-3 py-2 text-[13px] border-b-2 border-transparent text-muted-foreground hover:text-foreground -mb-px">Preview</button>
</div>
<div class="ml-auto flex items-center gap-0.5 text-muted-foreground" aria-label="Formatting"><button type="button" data-md-action="bold" aria-label="Bold" class="h-7 w-7 grid place-items-center rounded-sm hover:bg-accent hover:text-foreground"><svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true" focusable="false"><path d="M6 4h8a4 4 0 014 4 4 4 0 01-4 4H6zM6 12h9a4 4 0 014 4 4 4 0 01-4 4H6z"></path></svg></button><button type="button" data-md-action="italic" aria-label="Italic" class="h-7 w-7 grid place-items-center rounded-sm hover:bg-accent hover:text-foreground"><svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true" focusable="false"><line x1="19" y1="4" x2="10" y2="4"></line><line x1="14" y1="20" x2="5" y2="20"></line><line x1="15" y1="4" x2="9" y2="20"></line></svg></button><button type="button" data-md-action="code" aria-label="Code" class="h-7 w-7 grid place-items-center rounded-sm hover:bg-accent hover:text-foreground"><svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true" focusable="false"><polyline points="16 18 22 12 16 6"></polyline><polyline points="8 6 2 12 8 18"></polyline></svg></button><button type="button" data-md-action="link" aria-label="Insert link" class="h-7 w-7 grid place-items-center rounded-sm hover:bg-accent hover:text-foreground"><svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true" focusable="false"><path d="M10 13a5 5 0 007.07 0l3-3a5 5 0 00-7.07-7.07l-1 1"></path><path d="M14 11a5 5 0 00-7.07 0l-3 3a5 5 0 007.07 7.07l1-1"></path></svg></button></div>
</div>
<div data-md-pane="write">
<label for="desc-body" class="sr-only">Edit the description…</label>
<textarea id="desc-body" name="body" rows="14" placeholder="Edit the description…" style="height:332px" class="w-full px-3 py-3 text-[13px] font-mono leading-relaxed bg-transparent resize-none focus:outline-hidden placeholder:text-muted-foreground">Adds OAuth scope support to access tokens (PATs). Closes #298.
**What changed:**
- New `access_token_scopes` table with FK to `access_tokens`
- UI checkboxes for scope selection on token creation page
- Middleware enforces scope on every API request
- Token list shows scope badges
**How to test:**
```
make migrate
make dev
# Create a token at /settings/tokens with scope=repo:read only
curl -H "Authorization: Bearer $TOKEN" /api/repos
# Should 200. Then try POST — should 403.
```
Reviewers: this is the first time we're enforcing scopes, so the middleware change is the riskiest part.</textarea>
</div>
<div id="desc-body-preview" data-md-pane="preview" style="height:332px" class="hidden px-4 py-3 prose prose-sm dark:prose-invert max-w-none overflow-y-auto"></div>
</div>
</div>
<div class="flex justify-end gap-2 mt-2">
<button type="button" id="desc-cancel" class="h-8 px-3 text-[13px] rounded-md border border-border hover:bg-accent">Cancel</button>
<button type="submit" class="h-8 px-3 text-[13px] rounded-md font-medium bg-primary text-primary-foreground hover:bg-primary/90">Save</button>
</div>
</form>
</div>
</article>
<ol id="pr-timeline" class="cz-timeline space-y-4" aria-label="Pull request timeline">
<li class="text-[13px] text-muted-foreground">
<span class="cz-timeline-icon text-muted-foreground bg-muted" aria-hidden="true"><svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true"><path d="M20.59 13.41l-7.17 7.17a2 2 0 01-2.83 0L2 12V2h10l8.59 8.59a2 2 0 010 2.82z"></path><line x1="7" y1="7" x2="7.01" y2="7"></line></svg></span>
<div class="flex-1 min-w-0">
<p class="text-sm text-muted-foreground">
<a href="profile.html" class="font-medium text-foreground hover:text-primary">malith</a>
added the label <span class="inline-block max-w-full truncate align-middle rounded-full border px-2 py-px text-[11px] leading-4 font-medium border-(color:--label-border) bg-(color:--label-bg) text-(color:--label-fg) dark:border-(color:--label-dark-border) dark:bg-(color:--label-dark-bg) dark:text-(color:--label-dark-fg)" style="--label-bg:#22c55e;--label-fg:#1f2328;--label-border:#1ead53;--label-dark-bg:#22c55e2e;--label-dark-border:#22c55e66;--label-dark-fg:#22c55e">feature</span>
<time class="ml-1" datetime="2026-05-13">May 13, 2026</time>
</p>
</div>
</li>
<li class="text-[13px] text-muted-foreground">
<span class="cz-timeline-icon text-muted-foreground bg-muted" aria-hidden="true"><svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true"><path d="M20 21v-2a4 4 0 00-4-4H8a4 4 0 00-4 4v2"></path><circle cx="12" cy="7" r="4"></circle></svg></span>
<div class="flex-1 min-w-0">
<p class="text-sm text-muted-foreground">
<a href="profile.html" class="font-medium text-foreground hover:text-primary">malith</a>
assigned <a href="profile.html" class="text-foreground font-medium hover:underline">daisy</a>
<time class="ml-1" datetime="2026-05-13">May 13, 2026</time>
</p>
</div>
</li>
<li class="text-[13px] text-muted-foreground">
<span class="cz-timeline-icon text-muted-foreground bg-muted" aria-hidden="true"><svg width="11" height="11" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true" focusable="false"><path d="M21 11.5a8.38 8.38 0 01-.9 3.8 8.5 8.5 0 01-7.6 4.7 8.38 8.38 0 01-3.8-.9L3 21l1.9-5.7a8.38 8.38 0 01-.9-3.8 8.5 8.5 0 014.7-7.6 8.38 8.38 0 013.8-.9h.5a8.48 8.48 0 018 8v.5z"></path></svg></span>
<div class="flex-1 min-w-0">
<article class="rounded-md border border-border bg-card overflow-hidden">
<header class="px-4 py-2.5 border-b border-border bg-muted/40 flex items-center gap-2">
<span class="inline-grid place-items-center rounded-full bg-muted border border-border font-medium text-muted-foreground h-6 w-6 text-[10px]" role="img" aria-label="malith">M</span>
<a href="profile.html" class="text-[13px] font-medium hover:underline">malith</a>
<span class="text-[12px] text-muted-foreground">
commented
<time datetime="2026-05-13">May 13, 2026</time>
</span>
</header>
<div class="px-4 py-3 prose prose-sm dark:prose-invert max-w-none">
<p>Nice work. One question on the middleware — if a token has no scopes assigned (legacy tokens), do we treat that as "all scopes" or "no scopes"? Right now <code>internal/middleware/auth.go:88</code> reads like "all scopes" but I want to be sure.</p>
</div>
</article>
</div>
</li>
<li class="text-[13px] text-muted-foreground">
<span class="cz-timeline-icon text-warning bg-warning/15" aria-hidden="true"><svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" aria-hidden="true"><circle cx="12" cy="12" r="9"></circle><path d="M12 8v4M12 16h.01"></path></svg></span>
<div class="flex-1 min-w-0">
<p class="text-sm flex items-center gap-1.5 flex-wrap">
<a href="profile.html" class="font-medium text-foreground hover:text-primary">yumi</a>
<span class="inline-flex items-center gap-1.5 h-[22px] px-2 rounded-full border text-[11px] font-medium bg-destructive/15 text-destructive border-destructive/30">Changes requested</span>
<time class="text-muted-foreground text-xs" datetime="2026-05-13">May 13, 2026</time>
</p>
<div class="mt-1.5 rounded-md border border-border bg-card px-4 py-3 text-sm text-foreground/85">Legacy tokens should explicitly migrate to scopes=* before this ships — silent implicit all-scopes is a future foot-gun. Can you add the migration and update CLAUDE.md?</div>
</div>
</li>
<li class="text-[13px] text-muted-foreground">
<span class="cz-timeline-icon text-muted-foreground bg-muted" aria-hidden="true"><svg width="11" height="11" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true" focusable="false"><path d="M21 11.5a8.38 8.38 0 01-.9 3.8 8.5 8.5 0 01-7.6 4.7 8.38 8.38 0 01-3.8-.9L3 21l1.9-5.7a8.38 8.38 0 01-.9-3.8 8.5 8.5 0 014.7-7.6 8.38 8.38 0 013.8-.9h.5a8.48 8.48 0 018 8v.5z"></path></svg></span>
<div class="flex-1 min-w-0">
<article class="rounded-md border border-border bg-card overflow-hidden">
<header class="px-4 py-2.5 border-b border-border bg-muted/40 flex items-center gap-2">
<span class="inline-grid place-items-center rounded-full bg-muted border border-border font-medium text-muted-foreground h-6 w-6 text-[10px]" role="img" aria-label="daisy">D</span>
<a href="profile.html" class="text-[13px] font-medium hover:underline">daisy</a>
<span class="text-[12px] text-muted-foreground">
commented
<time datetime="2026-05-13">May 13, 2026</time>
</span>
</header>
<div class="px-4 py-3 prose prose-sm dark:prose-invert max-w-none">
<p>Good catch. Pushed <code>9c8e2a4</code> (backfills legacy tokens with <code>scopes=*</code>) and <code>3b1f7da</code> (documents it in the token section).</p>
</div>
</article>
</div>
</li>
<li class="text-[13px] text-muted-foreground">
<span class="cz-timeline-icon text-success bg-success/15" aria-hidden="true"><svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true"><polyline points="20 6 9 17 4 12"></polyline></svg></span>
<div class="flex-1 min-w-0">
<p class="text-sm flex items-center gap-1.5 flex-wrap">
<a href="profile.html" class="font-medium text-foreground hover:text-primary">yumi</a>
<span class="inline-flex items-center gap-1.5 h-[22px] px-2 rounded-full border text-[11px] font-medium bg-success/15 text-success border-success/30">Approved</span>
<time class="text-muted-foreground text-xs" datetime="2026-05-13">May 13, 2026</time>
</p>
</div>
</li>
<li data-when="pr=merged" class="text-[13px] text-muted-foreground">
<span class="cz-timeline-icon text-[hsl(270_70%_70%)] bg-[hsl(270_70%_50%/0.15)]" aria-hidden="true"><svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" aria-hidden="true"><circle cx="6" cy="6" r="2"></circle><circle cx="6" cy="18" r="2"></circle><circle cx="18" cy="18" r="2"></circle><path d="M6 8v8M6 18h6a6 6 0 006-6V8"></path></svg></span>
<div class="flex-1 min-w-0">
<p class="text-sm text-muted-foreground">
<a href="profile.html" class="font-medium text-foreground hover:text-primary">malith</a>
merged this pull request
<span class="text-foreground font-medium">(3 commits)</span>
<time class="ml-1" datetime="2026-05-14">May 14, 2026</time>
</p>
</div>
</li>
</ol>
<div data-when="pr=open,draft" class="mt-8 flex flex-col gap-3">
<div data-when="pr=open viewer=reviewer,author" class="flex flex-wrap items-center justify-between gap-3 rounded-md border border-border bg-card px-4 py-3">
<p data-when="viewer=reviewer" class="text-[13px] text-muted-foreground">Reviewed the changes? Approve, request changes or leave a summary.</p>
<p data-when="viewer=author" class="text-[13px] text-muted-foreground">You can reply to review comments, but not approve your own pull request.</p>
<button type="button" onclick="document.getElementById('review-dialog').showModal()" class="inline-flex items-center justify-center gap-1.5 rounded-md font-medium transition-colors disabled:opacity-50 disabled:pointer-events-none border border-input bg-transparent hover:bg-accent hover:text-accent-foreground h-9 px-4 text-sm">
<svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" aria-hidden="true"><path d="M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8z"></path><polyline points="14 2 14 8 20 8"></polyline></svg>
Review changes
</button>
</div>
<section aria-label="Mergeability" data-when="pr=open merge=ready" class="border border-border rounded-md">
<header class="px-5 py-4 border-b border-border rounded-t-md flex items-center gap-3 bg-success/10">
<span class="h-8 w-8 rounded-full grid place-items-center shrink-0 bg-success text-success-foreground">
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3" aria-hidden="true"><polyline points="20 6 9 17 4 12"></polyline></svg>
</span>
<div class="min-w-0">
<h3 class="text-[14px] font-semibold text-success">Ready to merge</h3>
<p class="text-[12px] text-muted-foreground mt-0.5">This branch has no conflicts with the base and can be merged.</p>
</div>
</header>
<ul class="divide-y divide-border text-[13px]">
<li class="px-5 py-3 flex items-center gap-3"><svg class="text-success shrink-0" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true"><polyline points="20 6 9 17 4 12"></polyline></svg><span class="flex-1">3 commits ahead, 0 behind the base branch</span></li>
<li class="px-5 py-3 flex items-center gap-3"><svg class="text-success shrink-0" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true"><polyline points="20 6 9 17 4 12"></polyline></svg><span class="flex-1">All 6 required checks passed</span></li>
<li class="px-5 py-3 flex items-center gap-3"><svg class="text-success shrink-0" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true"><polyline points="20 6 9 17 4 12"></polyline></svg><span class="flex-1">All 1 required review approved</span></li>
<li class="px-5 py-3 flex items-center gap-3"><svg class="text-success shrink-0" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true"><polyline points="20 6 9 17 4 12"></polyline></svg><span class="flex-1">This branch has no conflicts with <span class="font-mono">main</span></span></li>
</ul>
<footer data-when="viewer=reviewer,author" class="px-5 py-4 border-t border-border flex flex-wrap items-center gap-2">
<div class="relative inline-flex" data-merge>
<div class="inline-flex rounded-md overflow-hidden">
<button type="button" data-begin class="h-9 px-4 text-[13px] font-medium bg-success text-success-foreground hover:opacity-90 inline-flex items-center gap-1.5">
<svg data-merge-icon width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" aria-hidden="true"><circle cx="6" cy="6" r="2"></circle><circle cx="6" cy="18" r="2"></circle><circle cx="18" cy="18" r="2"></circle><path d="M6 8v8M6 18h6a6 6 0 006-6V8"></path></svg>
<span data-merge-label>Squash and merge</span>
</button>
<button type="button" data-merge-toggle aria-expanded="false" aria-haspopup="menu" aria-label="Choose merge strategy" class="h-9 px-2.5 grid place-items-center bg-success text-success-foreground hover:opacity-90 border-l border-success-foreground/25">
<svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true"><path d="M7 10l5 5 5-5"></path></svg>
</button>
</div>
<div role="menu" aria-label="Merge strategy" class="hidden absolute left-0 top-full mt-1.5 z-50 min-w-[18rem] rounded-md border border-border bg-popover text-popover-foreground shadow-md p-1 text-sm">
<div class="px-2 py-1.5 text-[11px] uppercase tracking-wider text-muted-foreground">Merge strategy</div>
<button type="button" role="menuitemradio" data-strategy="squash" data-label="Squash and merge" aria-checked="true" class="group flex w-full items-start gap-2 px-2 py-1.5 rounded-xs text-left hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground focus:outline-hidden">
<span class="mt-px shrink-0 text-muted-foreground"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" aria-hidden="true"><circle cx="6" cy="6" r="2"></circle><circle cx="6" cy="18" r="2"></circle><circle cx="18" cy="18" r="2"></circle><path d="M6 8v8M6 18h6a6 6 0 006-6V8"></path></svg></span>
<span class="flex-1 min-w-0">
<span class="block">Squash and merge</span>
<span class="block text-[11px] text-muted-foreground">Collapse the commits into one new commit</span>
</span>
<svg class="hidden group-aria-checked:block mt-px shrink-0" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true"><polyline points="20 6 9 17 4 12"></polyline></svg>
</button>
<button type="button" role="menuitemradio" data-strategy="merge" data-label="Create merge commit" aria-checked="false" class="group flex w-full items-start gap-2 px-2 py-1.5 rounded-xs text-left hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground focus:outline-hidden">
<span class="mt-px shrink-0 text-muted-foreground"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" aria-hidden="true"><circle cx="18" cy="18" r="3"></circle><circle cx="6" cy="6" r="3"></circle><path d="M6 9v3a9 9 0 009 9"></path></svg></span>
<span class="flex-1 min-w-0">
<span class="block">Create merge commit</span>
<span class="block text-[11px] text-muted-foreground">Keep every commit under a two-parent merge commit</span>
</span>
<svg class="hidden group-aria-checked:block mt-px shrink-0" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true"><polyline points="20 6 9 17 4 12"></polyline></svg>
</button>
<button type="button" role="menuitemradio" data-strategy="ff" data-label="Fast-forward" aria-checked="false" class="group flex w-full items-start gap-2 px-2 py-1.5 rounded-xs text-left hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground focus:outline-hidden">
<span class="mt-px shrink-0 text-muted-foreground"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" aria-hidden="true"><line x1="3" y1="12" x2="16" y2="12"></line><polyline points="12 6 18 12 12 18"></polyline></svg></span>
<span class="flex-1 min-w-0">
<span class="block">Fast-forward</span>
<span class="block text-[11px] text-muted-foreground">Advance the base branch — no new commit</span>
</span>
<svg class="hidden group-aria-checked:block mt-px shrink-0" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true"><polyline points="20 6 9 17 4 12"></polyline></svg>
</button>
</div>
</div>
<button type="button" onclick="document.getElementById('close-pull-dialog').showModal()" class="ml-auto h-9 px-3 text-[13px] rounded-md border border-destructive/40 text-destructive bg-transparent hover:bg-destructive/10 hover:border-destructive">Close pull request</button>
</footer>
<footer data-when="viewer=readonly" class="px-5 py-4 border-t border-border">
<p class="text-[12px] text-muted-foreground inline-flex items-center gap-1.5">
<svg class="shrink-0" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" aria-hidden="true"><rect x="3" y="11" width="18" height="11" rx="2"></rect><path d="M7 11V7a5 5 0 0110 0v4"></path></svg>
Only collaborators with write access can merge or close this pull request.
</p>
</footer>
</section>
<section aria-label="Mergeability" data-when="pr=open merge=needs" class="border border-border rounded-md">
<header class="px-5 py-4 border-b border-border rounded-t-md flex items-center gap-3 bg-warning/10">
<span class="h-8 w-8 rounded-full grid place-items-center shrink-0 bg-warning text-warning-foreground">
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true"><circle cx="12" cy="12" r="9"></circle><path d="M12 8v4M12 16h.01"></path></svg>
</span>
<div class="min-w-0">
<h3 class="text-[14px] font-semibold text-warning">Review required</h3>
<p class="text-[12px] text-muted-foreground mt-0.5">1 of 2 required reviews approved.</p>
</div>
</header>
<ul class="divide-y divide-border text-[13px]">
<li class="px-5 py-3 flex items-center gap-3"><svg class="text-success shrink-0" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true"><polyline points="20 6 9 17 4 12"></polyline></svg><span class="flex-1">3 commits ahead, 0 behind the base branch</span></li>
<li class="px-5 py-3 flex items-center gap-3"><svg class="text-success shrink-0" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true"><polyline points="20 6 9 17 4 12"></polyline></svg><span class="flex-1">All 6 required checks passed</span></li>
<li class="px-5 py-3 flex items-center gap-3"><svg class="text-warning shrink-0" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" aria-hidden="true"><circle cx="12" cy="12" r="9"></circle><path d="M12 8v4M12 16h.01"></path></svg><span class="flex-1">1 of 2 required reviews approved</span></li>
<li class="px-5 py-3 flex items-center gap-3"><svg class="text-success shrink-0" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true"><polyline points="20 6 9 17 4 12"></polyline></svg><span class="flex-1">This branch has no conflicts with <span class="font-mono">main</span></span></li>
</ul>
<footer data-when="viewer=reviewer,author" class="px-5 py-4 border-t border-border flex flex-wrap items-center gap-2">
<div class="relative inline-flex" data-merge>
<div class="inline-flex rounded-md overflow-hidden">
<button type="button" data-auto class="h-9 px-4 text-[13px] font-medium bg-success text-success-foreground hover:opacity-90 inline-flex items-center gap-1.5">
<svg data-merge-icon width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" aria-hidden="true"><circle cx="6" cy="6" r="2"></circle><circle cx="6" cy="18" r="2"></circle><circle cx="18" cy="18" r="2"></circle><path d="M6 8v8M6 18h6a6 6 0 006-6V8"></path></svg>
<span>Enable auto-merge · </span>
<span data-merge-label>Squash and merge</span>
</button>
<button type="button" data-merge-toggle aria-expanded="false" aria-haspopup="menu" aria-label="Choose merge strategy" class="h-9 px-2.5 grid place-items-center bg-success text-success-foreground hover:opacity-90 border-l border-success-foreground/25">
<svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true"><path d="M7 10l5 5 5-5"></path></svg>
</button>
</div>
<div role="menu" aria-label="Merge strategy" class="hidden absolute left-0 top-full mt-1.5 z-50 min-w-[18rem] rounded-md border border-border bg-popover text-popover-foreground shadow-md p-1 text-sm">
<div class="px-2 py-1.5 text-[11px] uppercase tracking-wider text-muted-foreground">Merge strategy</div>
<button type="button" role="menuitemradio" data-strategy="squash" data-label="Squash and merge" aria-checked="true" class="group flex w-full items-start gap-2 px-2 py-1.5 rounded-xs text-left hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground focus:outline-hidden">
<span class="mt-px shrink-0 text-muted-foreground"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" aria-hidden="true"><circle cx="6" cy="6" r="2"></circle><circle cx="6" cy="18" r="2"></circle><circle cx="18" cy="18" r="2"></circle><path d="M6 8v8M6 18h6a6 6 0 006-6V8"></path></svg></span>
<span class="flex-1 min-w-0">
<span class="block">Squash and merge</span>
<span class="block text-[11px] text-muted-foreground">Collapse the commits into one new commit</span>
</span>
<svg class="hidden group-aria-checked:block mt-px shrink-0" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true"><polyline points="20 6 9 17 4 12"></polyline></svg>
</button>
<button type="button" role="menuitemradio" data-strategy="merge" data-label="Create merge commit" aria-checked="false" class="group flex w-full items-start gap-2 px-2 py-1.5 rounded-xs text-left hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground focus:outline-hidden">
<span class="mt-px shrink-0 text-muted-foreground"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" aria-hidden="true"><circle cx="18" cy="18" r="3"></circle><circle cx="6" cy="6" r="3"></circle><path d="M6 9v3a9 9 0 009 9"></path></svg></span>
<span class="flex-1 min-w-0">
<span class="block">Create merge commit</span>
<span class="block text-[11px] text-muted-foreground">Keep every commit under a two-parent merge commit</span>
</span>
<svg class="hidden group-aria-checked:block mt-px shrink-0" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true"><polyline points="20 6 9 17 4 12"></polyline></svg>
</button>
<button type="button" role="menuitemradio" data-strategy="ff" data-label="Fast-forward" aria-checked="false" class="group flex w-full items-start gap-2 px-2 py-1.5 rounded-xs text-left hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground focus:outline-hidden">
<span class="mt-px shrink-0 text-muted-foreground"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" aria-hidden="true"><line x1="3" y1="12" x2="16" y2="12"></line><polyline points="12 6 18 12 12 18"></polyline></svg></span>
<span class="flex-1 min-w-0">
<span class="block">Fast-forward</span>
<span class="block text-[11px] text-muted-foreground">Advance the base branch — no new commit</span>
</span>
<svg class="hidden group-aria-checked:block mt-px shrink-0" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true"><polyline points="20 6 9 17 4 12"></polyline></svg>
</button>
</div>
</div>
<button type="button" onclick="document.getElementById('close-pull-dialog').showModal()" class="ml-auto h-9 px-3 text-[13px] rounded-md border border-destructive/40 text-destructive bg-transparent hover:bg-destructive/10 hover:border-destructive">Close pull request</button>
</footer>
<footer data-when="viewer=readonly" class="px-5 py-4 border-t border-border">
<p class="text-[12px] text-muted-foreground inline-flex items-center gap-1.5">
<svg class="shrink-0" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" aria-hidden="true"><rect x="3" y="11" width="18" height="11" rx="2"></rect><path d="M7 11V7a5 5 0 0110 0v4"></path></svg>
Only collaborators with write access can merge or close this pull request.
</p>
</footer>
</section>
<section aria-label="Mergeability" data-when="pr=open merge=checks-pending" class="border border-border rounded-md">
<header class="px-5 py-4 border-b border-border rounded-t-md flex items-center gap-3 bg-warning/10">
<span class="h-8 w-8 rounded-full grid place-items-center shrink-0 bg-warning text-warning-foreground">
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true"><circle cx="12" cy="12" r="9"></circle><path d="M12 8v4M12 16h.01"></path></svg>
</span>
<div class="min-w-0">
<h3 class="text-[14px] font-semibold text-warning">Waiting on checks</h3>
<p class="text-[12px] text-muted-foreground mt-0.5">4 of 6 required checks passed.</p>
</div>
</header>
<ul class="divide-y divide-border text-[13px]">
<li class="px-5 py-3 flex items-center gap-3"><svg class="text-success shrink-0" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true"><polyline points="20 6 9 17 4 12"></polyline></svg><span class="flex-1">3 commits ahead, 0 behind the base branch</span></li>
<li class="px-5 py-3 flex items-center gap-3"><svg class="text-warning shrink-0" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" aria-hidden="true"><circle cx="12" cy="12" r="9"></circle><path d="M12 8v4M12 16h.01"></path></svg><span class="flex-1">4 of 6 required checks passed</span></li>
<li class="px-5 py-3 flex items-center gap-3"><svg class="text-success shrink-0" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true"><polyline points="20 6 9 17 4 12"></polyline></svg><span class="flex-1">All 1 required review approved</span></li>
<li class="px-5 py-3 flex items-center gap-3"><svg class="text-success shrink-0" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true"><polyline points="20 6 9 17 4 12"></polyline></svg><span class="flex-1">This branch has no conflicts with <span class="font-mono">main</span></span></li>
</ul>
<footer data-when="viewer=reviewer,author" class="px-5 py-4 border-t border-border flex flex-wrap items-center gap-2">
<div class="relative inline-flex" data-merge>
<div class="inline-flex rounded-md overflow-hidden">
<button type="button" data-auto class="h-9 px-4 text-[13px] font-medium bg-success text-success-foreground hover:opacity-90 inline-flex items-center gap-1.5">
<svg data-merge-icon width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" aria-hidden="true"><circle cx="6" cy="6" r="2"></circle><circle cx="6" cy="18" r="2"></circle><circle cx="18" cy="18" r="2"></circle><path d="M6 8v8M6 18h6a6 6 0 006-6V8"></path></svg>
<span>Enable auto-merge · </span>
<span data-merge-label>Squash and merge</span>
</button>
<button type="button" data-merge-toggle aria-expanded="false" aria-haspopup="menu" aria-label="Choose merge strategy" class="h-9 px-2.5 grid place-items-center bg-success text-success-foreground hover:opacity-90 border-l border-success-foreground/25">
<svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true"><path d="M7 10l5 5 5-5"></path></svg>
</button>
</div>
<div role="menu" aria-label="Merge strategy" class="hidden absolute left-0 top-full mt-1.5 z-50 min-w-[18rem] rounded-md border border-border bg-popover text-popover-foreground shadow-md p-1 text-sm">
<div class="px-2 py-1.5 text-[11px] uppercase tracking-wider text-muted-foreground">Merge strategy</div>
<button type="button" role="menuitemradio" data-strategy="squash" data-label="Squash and merge" aria-checked="true" class="group flex w-full items-start gap-2 px-2 py-1.5 rounded-xs text-left hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground focus:outline-hidden">
<span class="mt-px shrink-0 text-muted-foreground"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" aria-hidden="true"><circle cx="6" cy="6" r="2"></circle><circle cx="6" cy="18" r="2"></circle><circle cx="18" cy="18" r="2"></circle><path d="M6 8v8M6 18h6a6 6 0 006-6V8"></path></svg></span>
<span class="flex-1 min-w-0">
<span class="block">Squash and merge</span>
<span class="block text-[11px] text-muted-foreground">Collapse the commits into one new commit</span>
</span>
<svg class="hidden group-aria-checked:block mt-px shrink-0" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true"><polyline points="20 6 9 17 4 12"></polyline></svg>
</button>
<button type="button" role="menuitemradio" data-strategy="merge" data-label="Create merge commit" aria-checked="false" class="group flex w-full items-start gap-2 px-2 py-1.5 rounded-xs text-left hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground focus:outline-hidden">
<span class="mt-px shrink-0 text-muted-foreground"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" aria-hidden="true"><circle cx="18" cy="18" r="3"></circle><circle cx="6" cy="6" r="3"></circle><path d="M6 9v3a9 9 0 009 9"></path></svg></span>
<span class="flex-1 min-w-0">
<span class="block">Create merge commit</span>
<span class="block text-[11px] text-muted-foreground">Keep every commit under a two-parent merge commit</span>
</span>
<svg class="hidden group-aria-checked:block mt-px shrink-0" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true"><polyline points="20 6 9 17 4 12"></polyline></svg>
</button>
<button type="button" role="menuitemradio" data-strategy="ff" data-label="Fast-forward" aria-checked="false" class="group flex w-full items-start gap-2 px-2 py-1.5 rounded-xs text-left hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground focus:outline-hidden">
<span class="mt-px shrink-0 text-muted-foreground"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" aria-hidden="true"><line x1="3" y1="12" x2="16" y2="12"></line><polyline points="12 6 18 12 12 18"></polyline></svg></span>
<span class="flex-1 min-w-0">
<span class="block">Fast-forward</span>
<span class="block text-[11px] text-muted-foreground">Advance the base branch — no new commit</span>
</span>
<svg class="hidden group-aria-checked:block mt-px shrink-0" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true"><polyline points="20 6 9 17 4 12"></polyline></svg>
</button>
</div>
</div>
<button type="button" onclick="document.getElementById('close-pull-dialog').showModal()" class="ml-auto h-9 px-3 text-[13px] rounded-md border border-destructive/40 text-destructive bg-transparent hover:bg-destructive/10 hover:border-destructive">Close pull request</button>
</footer>
<footer data-when="viewer=readonly" class="px-5 py-4 border-t border-border">
<p class="text-[12px] text-muted-foreground inline-flex items-center gap-1.5">
<svg class="shrink-0" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" aria-hidden="true"><rect x="3" y="11" width="18" height="11" rx="2"></rect><path d="M7 11V7a5 5 0 0110 0v4"></path></svg>
Only collaborators with write access can merge or close this pull request.
</p>
</footer>
</section>
<section aria-label="Mergeability" data-when="pr=open merge=failing" class="border border-border rounded-md">
<header class="px-5 py-4 border-b border-border rounded-t-md flex items-center gap-3 bg-destructive/10">
<span class="h-8 w-8 rounded-full grid place-items-center shrink-0 bg-destructive text-destructive-foreground">
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true"><circle cx="12" cy="12" r="9"></circle><path d="M12 8v4M12 16h.01"></path></svg>
</span>
<div class="min-w-0">
<h3 class="text-[14px] font-semibold text-destructive">Checks failing</h3>
<p class="text-[12px] text-muted-foreground mt-0.5">2 required checks failed. Fix them and push before this can merge.</p>
</div>
</header>
<ul class="divide-y divide-border text-[13px]">
<li class="px-5 py-3 flex items-center gap-3"><svg class="text-success shrink-0" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true"><polyline points="20 6 9 17 4 12"></polyline></svg><span class="flex-1">3 commits ahead, 0 behind the base branch</span></li>
<li class="px-5 py-3 flex items-center gap-3"><svg class="text-warning shrink-0" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" aria-hidden="true"><circle cx="12" cy="12" r="9"></circle><path d="M12 8v4M12 16h.01"></path></svg><span class="flex-1">4 of 6 required checks passed</span></li>
<li class="px-5 py-3 flex items-center gap-3"><svg class="text-success shrink-0" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true"><polyline points="20 6 9 17 4 12"></polyline></svg><span class="flex-1">All 1 required review approved</span></li>
<li class="px-5 py-3 flex items-center gap-3"><svg class="text-success shrink-0" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true"><polyline points="20 6 9 17 4 12"></polyline></svg><span class="flex-1">This branch has no conflicts with <span class="font-mono">main</span></span></li>
</ul>
<footer data-when="viewer=reviewer,author" class="px-5 py-4 border-t border-border flex flex-wrap items-center gap-2">
<button type="button" disabled class="h-9 px-4 text-[13px] font-medium rounded-md bg-muted text-muted-foreground cursor-not-allowed">Merge</button>
<a href="pr_checks.html" class="text-[13px] text-foreground underline underline-offset-2 decoration-muted-foreground/50 hover:decoration-foreground">View checks →</a>
<button type="button" onclick="document.getElementById('close-pull-dialog').showModal()" class="ml-auto h-9 px-3 text-[13px] rounded-md border border-destructive/40 text-destructive bg-transparent hover:bg-destructive/10 hover:border-destructive">Close pull request</button>
</footer>
<footer data-when="viewer=readonly" class="px-5 py-4 border-t border-border">
<p class="text-[12px] text-muted-foreground inline-flex items-center gap-1.5">
<svg class="shrink-0" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" aria-hidden="true"><rect x="3" y="11" width="18" height="11" rx="2"></rect><path d="M7 11V7a5 5 0 0110 0v4"></path></svg>
Only collaborators with write access can merge or close this pull request.
</p>
</footer>
</section>
<section aria-label="Mergeability" data-when="pr=open merge=changes" class="border border-border rounded-md">
<header class="px-5 py-4 border-b border-border rounded-t-md flex items-center gap-3 bg-destructive/10">
<span class="h-8 w-8 rounded-full grid place-items-center shrink-0 bg-destructive text-destructive-foreground">
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true"><circle cx="12" cy="12" r="9"></circle><path d="M12 8v4M12 16h.01"></path></svg>
</span>
<div class="min-w-0">
<h3 class="text-[14px] font-semibold text-destructive">Changes requested</h3>
<p class="text-[12px] text-muted-foreground mt-0.5">A reviewer asked for changes. Merging is blocked until they approve or the review is dismissed.</p>
</div>
</header>
<ul class="divide-y divide-border text-[13px]">
<li class="px-5 py-3 flex items-center gap-3"><svg class="text-success shrink-0" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true"><polyline points="20 6 9 17 4 12"></polyline></svg><span class="flex-1">3 commits ahead, 0 behind the base branch</span></li>
<li class="px-5 py-3 flex items-center gap-3"><svg class="text-success shrink-0" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true"><polyline points="20 6 9 17 4 12"></polyline></svg><span class="flex-1">All 6 required checks passed</span></li>
<li class="px-5 py-3 flex items-center gap-3"><svg class="text-warning shrink-0" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" aria-hidden="true"><circle cx="12" cy="12" r="9"></circle><path d="M12 8v4M12 16h.01"></path></svg><span class="flex-1">0 of 1 required review approved</span></li>
<li class="px-5 py-3 flex items-center gap-3"><svg class="text-success shrink-0" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true"><polyline points="20 6 9 17 4 12"></polyline></svg><span class="flex-1">This branch has no conflicts with <span class="font-mono">main</span></span></li>
</ul>
<footer data-when="viewer=reviewer,author" class="px-5 py-4 border-t border-border flex flex-wrap items-center gap-2">
<button type="button" onclick="document.getElementById('close-pull-dialog').showModal()" class="ml-auto h-9 px-3 text-[13px] rounded-md border border-destructive/40 text-destructive bg-transparent hover:bg-destructive/10 hover:border-destructive">Close pull request</button>
</footer>
<footer data-when="viewer=readonly" class="px-5 py-4 border-t border-border">
<p class="text-[12px] text-muted-foreground inline-flex items-center gap-1.5">
<svg class="shrink-0" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" aria-hidden="true"><rect x="3" y="11" width="18" height="11" rx="2"></rect><path d="M7 11V7a5 5 0 0110 0v4"></path></svg>
Only collaborators with write access can merge or close this pull request.
</p>
</footer>
</section>
<section aria-label="Mergeability" data-when="pr=open merge=conflicts" class="border border-border rounded-md">
<header class="px-5 py-4 border-b border-border rounded-t-md flex items-center gap-3 bg-destructive/10">
<span class="h-8 w-8 rounded-full grid place-items-center shrink-0 bg-destructive text-destructive-foreground">
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3" aria-hidden="true"><line x1="18" y1="6" x2="6" y2="18"></line><line x1="6" y1="6" x2="18" y2="18"></line></svg>
</span>
<div class="min-w-0">
<h3 class="text-[14px] font-semibold text-destructive">Merge conflicts</h3>
<p class="text-[12px] text-muted-foreground mt-0.5">Resolve the conflicts on the head branch before this can merge.</p>
</div>
</header>
<ul class="divide-y divide-border text-[13px]">
<li class="px-5 py-3 flex items-center gap-3"><svg class="text-success shrink-0" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true"><polyline points="20 6 9 17 4 12"></polyline></svg><span class="flex-1">3 commits ahead, 0 behind the base branch</span></li>
<li class="px-5 py-3 flex items-center gap-3"><svg class="text-success shrink-0" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true"><polyline points="20 6 9 17 4 12"></polyline></svg><span class="flex-1">All 6 required checks passed</span></li>
<li class="px-5 py-3 flex items-center gap-3"><svg class="text-success shrink-0" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true"><polyline points="20 6 9 17 4 12"></polyline></svg><span class="flex-1">All 1 required review approved</span></li>
<li class="px-5 py-3 flex items-center gap-3"><svg class="text-warning shrink-0" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" aria-hidden="true"><circle cx="12" cy="12" r="9"></circle><path d="M12 8v4M12 16h.01"></path></svg><span class="flex-1">This branch has conflicts with <span class="font-mono">main</span></span></li>
</ul>
<footer data-when="viewer=reviewer,author" class="px-5 py-4 border-t border-border flex flex-wrap items-center gap-2">
<button type="button" onclick="document.getElementById('close-pull-dialog').showModal()" class="ml-auto h-9 px-3 text-[13px] rounded-md border border-destructive/40 text-destructive bg-transparent hover:bg-destructive/10 hover:border-destructive">Close pull request</button>
</footer>
<footer data-when="viewer=readonly" class="px-5 py-4 border-t border-border">
<p class="text-[12px] text-muted-foreground inline-flex items-center gap-1.5">
<svg class="shrink-0" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" aria-hidden="true"><rect x="3" y="11" width="18" height="11" rx="2"></rect><path d="M7 11V7a5 5 0 0110 0v4"></path></svg>
Only collaborators with write access can merge or close this pull request.
</p>
</footer>
</section>
<section aria-label="Mergeability" data-when="pr=open merge=auto" class="border border-border rounded-md">
<header class="px-5 py-4 border-b border-border rounded-t-md flex items-center gap-3 bg-warning/10">
<span class="h-8 w-8 rounded-full grid place-items-center shrink-0 bg-warning text-warning-foreground">
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true"><circle cx="12" cy="12" r="9"></circle><path d="M12 8v4M12 16h.01"></path></svg>
</span>
<div class="min-w-0">
<h3 class="text-[14px] font-semibold text-warning">Review required</h3>
<p class="text-[12px] text-muted-foreground mt-0.5">1 of 2 required reviews approved.</p>
</div>
</header>
<ul class="divide-y divide-border text-[13px]">
<li class="px-5 py-3 flex items-center gap-3"><svg class="text-success shrink-0" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true"><polyline points="20 6 9 17 4 12"></polyline></svg><span class="flex-1">3 commits ahead, 0 behind the base branch</span></li>
<li class="px-5 py-3 flex items-center gap-3"><svg class="text-success shrink-0" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true"><polyline points="20 6 9 17 4 12"></polyline></svg><span class="flex-1">All 6 required checks passed</span></li>
<li class="px-5 py-3 flex items-center gap-3"><svg class="text-warning shrink-0" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" aria-hidden="true"><circle cx="12" cy="12" r="9"></circle><path d="M12 8v4M12 16h.01"></path></svg><span class="flex-1">1 of 2 required reviews approved</span></li>
<li class="px-5 py-3 flex items-center gap-3"><svg class="text-success shrink-0" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true"><polyline points="20 6 9 17 4 12"></polyline></svg><span class="flex-1">This branch has no conflicts with <span class="font-mono">main</span></span></li>
</ul>
<footer data-when="viewer=reviewer,author" class="px-5 py-4 border-t border-border flex flex-wrap items-center gap-2">
<p class="text-[13px] text-muted-foreground inline-flex items-center gap-2">
<svg class="text-success shrink-0" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true"><polyline points="20 6 9 17 4 12"></polyline></svg>
Auto-merge is on (squash and merge), armed by @malith. It merges once the requirements are met.
</p>
<button type="button" class="h-9 px-3 text-[13px] rounded-md border border-border text-muted-foreground hover:bg-accent">Disable auto-merge</button>
<button type="button" onclick="document.getElementById('close-pull-dialog').showModal()" class="ml-auto h-9 px-3 text-[13px] rounded-md border border-destructive/40 text-destructive bg-transparent hover:bg-destructive/10 hover:border-destructive">Close pull request</button>
</footer>
<footer data-when="viewer=readonly" class="px-5 py-4 border-t border-border">
<p class="text-[12px] text-muted-foreground inline-flex items-center gap-1.5">
<svg class="shrink-0" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" aria-hidden="true"><rect x="3" y="11" width="18" height="11" rx="2"></rect><path d="M7 11V7a5 5 0 0110 0v4"></path></svg>
Only collaborators with write access can merge or close this pull request.
</p>
</footer>
</section>
<section aria-label="Mergeability" data-when="pr=draft" class="border border-border rounded-md">
<header class="px-5 py-4 border-b border-border rounded-t-md flex items-center gap-3 bg-muted/40">
<span class="h-8 w-8 rounded-full grid place-items-center shrink-0 bg-muted text-muted-foreground">
<svg width="15" height="15" viewBox="0 0 16 16" fill="currentColor" aria-hidden="true"><path d="M1.5 3.25a2.25 2.25 0 113 2.122v5.256a2.251 2.251 0 11-1.5 0V5.372A2.25 2.25 0 011.5 3.25zM3.75 2.5a.75.75 0 100 1.5.75.75 0 000-1.5zm0 9.5a.75.75 0 100 1.5.75.75 0 000-1.5zm6.5-9.25a2.25 2.25 0 113 2.122V10.5a2.25 2.25 0 11-1.5 0V4.622a2.25 2.25 0 01-1.5-2.122zm2.25-.75a.75.75 0 100 1.5.75.75 0 000-1.5zm0 9.5a.75.75 0 100 1.5.75.75 0 000-1.5z"></path></svg>
</span>
<div class="min-w-0">
<h3 class="text-[14px] font-semibold text-muted-foreground">Draft</h3>
<p class="text-[12px] text-muted-foreground mt-0.5">Mark this ready for review to notify reviewers and allow merging.</p>
</div>
</header>
<ul class="divide-y divide-border text-[13px]">
<li class="px-5 py-3 flex items-center gap-3"><svg class="text-success shrink-0" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true"><polyline points="20 6 9 17 4 12"></polyline></svg><span class="flex-1">3 commits ahead, 0 behind the base branch</span></li>
<li class="px-5 py-3 flex items-center gap-3"><svg class="text-success shrink-0" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true"><polyline points="20 6 9 17 4 12"></polyline></svg><span class="flex-1">All 6 required checks passed</span></li>
<li class="px-5 py-3 flex items-center gap-3"><svg class="text-success shrink-0" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true"><polyline points="20 6 9 17 4 12"></polyline></svg><span class="flex-1">All 1 required review approved</span></li>
<li class="px-5 py-3 flex items-center gap-3"><svg class="text-success shrink-0" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true"><polyline points="20 6 9 17 4 12"></polyline></svg><span class="flex-1">This branch has no conflicts with <span class="font-mono">main</span></span></li>
</ul>
<footer data-when="viewer=reviewer,author" class="px-5 py-4 border-t border-border flex flex-wrap items-center gap-2">
<button type="button" data-ready class="h-9 px-4 text-[13px] font-medium rounded-md bg-success text-success-foreground hover:bg-success/90">Ready for review</button>
<button type="button" onclick="document.getElementById('close-pull-dialog').showModal()" class="ml-auto h-9 px-3 text-[13px] rounded-md border border-destructive/40 text-destructive bg-transparent hover:bg-destructive/10 hover:border-destructive">Close pull request</button>
</footer>
<footer data-when="viewer=readonly" class="px-5 py-4 border-t border-border">
<p class="text-[12px] text-muted-foreground inline-flex items-center gap-1.5">
<svg class="shrink-0" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" aria-hidden="true"><rect x="3" y="11" width="18" height="11" rx="2"></rect><path d="M7 11V7a5 5 0 0110 0v4"></path></svg>
Only collaborators with write access can merge or close this pull request.
</p>
</footer>
</section>
</div>
<section aria-label="Add a comment" class="mt-6">
<form class="rounded-md border border-border bg-card overflow-hidden">
<header class="px-3 py-2 border-b border-border bg-background flex items-center gap-2">
<span class="inline-grid place-items-center rounded-full bg-muted border border-border font-medium text-muted-foreground h-6 w-6 text-[10px]" role="img" aria-label="malith">M</span>
<span class="text-[13px] font-medium">Add a comment</span>
</header>
<div class="md-editor" data-md-editor>
<div class="flex items-center gap-2 border-b border-border px-3">
<div role="tablist" aria-label="Editor mode" class="flex">
<button type="button" role="tab" data-md-tab="write" aria-selected="true" class="px-3 py-2 text-[13px] border-b-2 border-foreground text-foreground font-medium -mb-px">Write</button>
<button type="button" role="tab" data-md-tab="preview" aria-selected="false" class="px-3 py-2 text-[13px] border-b-2 border-transparent text-muted-foreground hover:text-foreground -mb-px">Preview</button>
</div>
<div class="ml-auto flex items-center gap-0.5 text-muted-foreground" aria-label="Formatting"><button type="button" data-md-action="bold" aria-label="Bold" class="h-7 w-7 grid place-items-center rounded-sm hover:bg-accent hover:text-foreground"><svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true" focusable="false"><path d="M6 4h8a4 4 0 014 4 4 4 0 01-4 4H6zM6 12h9a4 4 0 014 4 4 4 0 01-4 4H6z"></path></svg></button><button type="button" data-md-action="italic" aria-label="Italic" class="h-7 w-7 grid place-items-center rounded-sm hover:bg-accent hover:text-foreground"><svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true" focusable="false"><line x1="19" y1="4" x2="10" y2="4"></line><line x1="14" y1="20" x2="5" y2="20"></line><line x1="15" y1="4" x2="9" y2="20"></line></svg></button><button type="button" data-md-action="code" aria-label="Code" class="h-7 w-7 grid place-items-center rounded-sm hover:bg-accent hover:text-foreground"><svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true" focusable="false"><polyline points="16 18 22 12 16 6"></polyline><polyline points="8 6 2 12 8 18"></polyline></svg></button><button type="button" data-md-action="link" aria-label="Insert link" class="h-7 w-7 grid place-items-center rounded-sm hover:bg-accent hover:text-foreground"><svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true" focusable="false"><path d="M10 13a5 5 0 007.07 0l3-3a5 5 0 00-7.07-7.07l-1 1"></path><path d="M14 11a5 5 0 00-7.07 0l-3 3a5 5 0 007.07 7.07l1-1"></path></svg></button></div>
</div>
<div data-md-pane="write">
<label for="pr-comment-body" class="sr-only">Leave a comment — Markdown supported</label>
<textarea id="pr-comment-body" name="body" rows="5" placeholder="Leave a comment — Markdown supported" style="height:134px" class="w-full px-3 py-3 text-[13px] font-mono leading-relaxed bg-transparent resize-none focus:outline-hidden placeholder:text-muted-foreground"></textarea>
</div>
<div id="pr-comment-body-preview" data-md-pane="preview" style="height:134px" class="hidden px-4 py-3 prose prose-sm dark:prose-invert max-w-none overflow-y-auto"></div>
</div>
<div class="px-3 py-2 border-t border-border bg-muted/40 flex items-center gap-2">
<p class="text-[11px] text-muted-foreground font-mono flex-1">Markdown supported · drop files to attach</p>
<button type="button" onclick="document.getElementById('close-pull-dialog').showModal()" class="inline-flex items-center justify-center gap-1.5 rounded-md font-medium transition-colors disabled:opacity-50 disabled:pointer-events-none border border-destructive/40 text-destructive bg-transparent hover:bg-destructive/10 hover:border-destructive h-9 px-4 text-sm">Close pull request</button>
<button type="submit" class="inline-flex items-center justify-center gap-1.5 rounded-md font-medium transition-colors disabled:opacity-50 disabled:pointer-events-none bg-success text-success-foreground hover:bg-success/90 h-9 px-4 text-sm">Comment</button>
</div>
</form>
</section>
</div>
<aside class="space-y-6" aria-label="Pull request metadata">
<section aria-labelledby="reviewers-heading">
<div class="mb-2">
<div class="flex items-center justify-between">
<h3 class="text-[12px] font-medium text-muted-foreground">Reviewers</h3>
<div class="relative" data-pick="reviewers">
<button type="button" aria-haspopup="menu" aria-expanded="false" aria-label="Request a reviewer" class="text-muted-foreground hover:text-foreground"><svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true" focusable="false"><circle cx="12" cy="12" r="9"></circle><path d="M12 8v8M8 12h8"></path></svg></button>
<div role="menu" aria-label="Request review from" class="hidden absolute right-0 top-full mt-1.5 z-50 w-56 rounded-md border border-border bg-popover text-popover-foreground shadow-md p-1 max-h-72 overflow-y-auto">
<div class="px-2 pt-1 pb-0.5 text-[10px] font-medium uppercase tracking-wider text-muted-foreground">Request review from</div>
<button type="button" role="menuitemcheckbox" data-val="aki" aria-checked="true" class="group flex w-full items-center gap-2 px-2.5 py-1.5 rounded-md text-left text-[13px] text-muted-foreground hover:bg-accent hover:text-foreground">
<span class="inline-grid place-items-center rounded-full bg-muted border border-border font-medium text-muted-foreground h-6 w-6 text-[10px]" role="img" aria-label="aki">A</span>
<span class="flex-1 truncate">aki</span>
<svg class="hidden group-aria-checked:block shrink-0 text-success ml-auto" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true" focusable="false"><polyline points="20 6 9 17 4 12"></polyline></svg>
</button>
<button type="button" role="menuitemcheckbox" data-val="nina" aria-checked="false" class="group flex w-full items-center gap-2 px-2.5 py-1.5 rounded-md text-left text-[13px] text-muted-foreground hover:bg-accent hover:text-foreground">
<span class="inline-grid place-items-center rounded-full bg-muted border border-border font-medium text-muted-foreground h-6 w-6 text-[10px]" role="img" aria-label="nina">N</span>
<span class="flex-1 truncate">nina</span>
<svg class="hidden group-aria-checked:block shrink-0 text-success ml-auto" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true" focusable="false"><polyline points="20 6 9 17 4 12"></polyline></svg>
</button>
<button type="button" role="menuitemcheckbox" data-val="malith" aria-checked="false" class="group flex w-full items-center gap-2 px-2.5 py-1.5 rounded-md text-left text-[13px] text-muted-foreground hover:bg-accent hover:text-foreground">
<span class="inline-grid place-items-center rounded-full bg-muted border border-border font-medium text-muted-foreground h-6 w-6 text-[10px]" role="img" aria-label="malith">M</span>
<span class="flex-1 truncate">malith</span>
<svg class="hidden group-aria-checked:block shrink-0 text-success ml-auto" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true" focusable="false"><polyline points="20 6 9 17 4 12"></polyline></svg>
</button>
<div role="separator" class="my-1 h-px bg-border"></div>
<a href="settings.html" role="menuitem" class="flex w-full items-center gap-2 px-2.5 py-1.5 rounded-md text-left text-[13px] text-muted-foreground hover:bg-accent hover:text-foreground">
<svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" class="shrink-0" aria-hidden="true" focusable="false"><path d="M16 21v-2a4 4 0 00-4-4H6a4 4 0 00-4 4v2"></path><circle cx="11" cy="7" r="4"></circle><line x1="19" y1="8" x2="19" y2="14"></line><line x1="22" y1="11" x2="16" y2="11"></line></svg>
Invite a collaborator
</a>
</div>
</div>
</div>
</div>
<ul class="space-y-1.5">
<li class="flex items-center gap-2 text-[13px]">
<span class="inline-grid place-items-center rounded-full bg-muted border border-border font-medium text-muted-foreground h-6 w-6 text-[10px]" role="img" aria-label="yumi">Y</span>
<a href="profile.html" class="hover:underline truncate">yumi</a>
<span class="ml-auto"><span class="inline-flex items-center gap-1.5 h-[22px] px-2 rounded-full border text-[11px] font-medium bg-success/15 text-success border-success/30">Approved</span></span>
</li>
<li data-show-for="reviewers:aki" class="flex items-center gap-2 text-[13px]">
<span class="inline-grid place-items-center rounded-full bg-muted border border-border font-medium text-muted-foreground h-6 w-6 text-[10px]" role="img" aria-label="aki">A</span>
<a href="profile.html" class="hover:underline truncate">aki</a>
<span class="ml-auto"><span class="inline-flex items-center gap-1.5 h-[22px] px-2 rounded-full border text-[11px] font-medium bg-secondary text-secondary-foreground border-transparent">Awaiting review</span></span>
</li>
<li data-show-for="reviewers:nina" class="flex items-center gap-2 text-[13px]">
<span class="inline-grid place-items-center rounded-full bg-muted border border-border font-medium text-muted-foreground h-6 w-6 text-[10px]" role="img" aria-label="nina">N</span>
<a href="profile.html" class="hover:underline truncate">nina</a>
<span class="ml-auto"><span class="inline-flex items-center gap-1.5 h-[22px] px-2 rounded-full border text-[11px] font-medium bg-secondary text-secondary-foreground border-transparent">Awaiting review</span></span>
</li>
<li data-show-for="reviewers:malith" class="flex items-center gap-2 text-[13px]">
<span class="inline-grid place-items-center rounded-full bg-muted border border-border font-medium text-muted-foreground h-6 w-6 text-[10px]" role="img" aria-label="malith">M</span>
<a href="profile.html" class="hover:underline truncate">malith</a>
<span class="ml-auto"><span class="inline-flex items-center gap-1.5 h-[22px] px-2 rounded-full border text-[11px] font-medium bg-secondary text-secondary-foreground border-transparent">Awaiting review</span></span>
</li>
</ul>
</section>
<section class="border-t border-border pt-5">
<div class="space-y-2">
<div class="flex items-center justify-between">
<h3 class="text-[12px] font-medium text-muted-foreground">Assignees</h3>
<div class="relative" data-pick="assignees">
<button type="button" aria-haspopup="menu" aria-expanded="false" aria-label="Edit assignees" class="text-muted-foreground hover:text-foreground"><svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true" focusable="false"><path d="M11 4H4a2 2 0 00-2 2v14a2 2 0 002 2h14a2 2 0 002-2v-7"></path><path d="M18.5 2.5a2.121 2.121 0 113 3L12 15l-4 1 1-4 9.5-9.5z"></path></svg></button>
<div role="menu" aria-label="Assign people" class="hidden absolute right-0 top-full mt-1.5 z-50 w-56 rounded-md border border-border bg-popover text-popover-foreground shadow-md p-1 max-h-72 overflow-y-auto">
<div class="px-2 pt-1 pb-0.5 text-[10px] font-medium uppercase tracking-wider text-muted-foreground">Assign people</div>
<button type="button" role="menuitemcheckbox" data-val="daisy" aria-checked="true" class="group flex w-full items-center gap-2 px-2.5 py-1.5 rounded-md text-left text-[13px] text-muted-foreground hover:bg-accent hover:text-foreground">
<span class="inline-grid place-items-center rounded-full bg-muted border border-border font-medium text-muted-foreground h-6 w-6 text-[10px]" role="img" aria-label="daisy">D</span>
<span class="flex-1 truncate">daisy</span>
<svg class="hidden group-aria-checked:block shrink-0 text-success ml-auto" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true" focusable="false"><polyline points="20 6 9 17 4 12"></polyline></svg>
</button>
<button type="button" role="menuitemcheckbox" data-val="yumi" aria-checked="false" class="group flex w-full items-center gap-2 px-2.5 py-1.5 rounded-md text-left text-[13px] text-muted-foreground hover:bg-accent hover:text-foreground">
<span class="inline-grid place-items-center rounded-full bg-muted border border-border font-medium text-muted-foreground h-6 w-6 text-[10px]" role="img" aria-label="yumi">Y</span>
<span class="flex-1 truncate">yumi</span>
<svg class="hidden group-aria-checked:block shrink-0 text-success ml-auto" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true" focusable="false"><polyline points="20 6 9 17 4 12"></polyline></svg>
</button>
<button type="button" role="menuitemcheckbox" data-val="aki" aria-checked="false" class="group flex w-full items-center gap-2 px-2.5 py-1.5 rounded-md text-left text-[13px] text-muted-foreground hover:bg-accent hover:text-foreground">
<span class="inline-grid place-items-center rounded-full bg-muted border border-border font-medium text-muted-foreground h-6 w-6 text-[10px]" role="img" aria-label="aki">A</span>
<span class="flex-1 truncate">aki</span>
<svg class="hidden group-aria-checked:block shrink-0 text-success ml-auto" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true" focusable="false"><polyline points="20 6 9 17 4 12"></polyline></svg>
</button>
<button type="button" role="menuitemcheckbox" data-val="malith" aria-checked="false" class="group flex w-full items-center gap-2 px-2.5 py-1.5 rounded-md text-left text-[13px] text-muted-foreground hover:bg-accent hover:text-foreground">
<span class="inline-grid place-items-center rounded-full bg-muted border border-border font-medium text-muted-foreground h-6 w-6 text-[10px]" role="img" aria-label="malith">M</span>
<span class="flex-1 truncate">malith</span>
<svg class="hidden group-aria-checked:block shrink-0 text-success ml-auto" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true" focusable="false"><polyline points="20 6 9 17 4 12"></polyline></svg>
</button>
<div role="separator" class="my-1 h-px bg-border"></div>
<a href="settings.html" role="menuitem" class="flex w-full items-center gap-2 px-2.5 py-1.5 rounded-md text-left text-[13px] text-muted-foreground hover:bg-accent hover:text-foreground">
<svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" class="shrink-0" aria-hidden="true" focusable="false"><path d="M16 21v-2a4 4 0 00-4-4H6a4 4 0 00-4 4v2"></path><circle cx="11" cy="7" r="4"></circle><line x1="19" y1="8" x2="19" y2="14"></line><line x1="22" y1="11" x2="16" y2="11"></line></svg>
Invite a collaborator
</a>
</div>
</div>
</div>
<div class="space-y-1">
<div data-show-for="assignees:daisy" class="flex items-center gap-2 text-[13px]">
<span class="inline-grid place-items-center rounded-full bg-muted border border-border font-medium text-muted-foreground h-6 w-6 text-[10px]" role="img" aria-label="daisy">D</span>
<a href="profile.html" class="font-medium hover:underline truncate">daisy</a>
</div>
<div data-show-for="assignees:yumi" class="flex items-center gap-2 text-[13px]">
<span class="inline-grid place-items-center rounded-full bg-muted border border-border font-medium text-muted-foreground h-6 w-6 text-[10px]" role="img" aria-label="yumi">Y</span>
<a href="profile.html" class="font-medium hover:underline truncate">yumi</a>
</div>
<div data-show-for="assignees:aki" class="flex items-center gap-2 text-[13px]">
<span class="inline-grid place-items-center rounded-full bg-muted border border-border font-medium text-muted-foreground h-6 w-6 text-[10px]" role="img" aria-label="aki">A</span>
<a href="profile.html" class="font-medium hover:underline truncate">aki</a>
</div>
<div data-show-for="assignees:malith" class="flex items-center gap-2 text-[13px]">
<span class="inline-grid place-items-center rounded-full bg-muted border border-border font-medium text-muted-foreground h-6 w-6 text-[10px]" role="img" aria-label="malith">M</span>
<a href="profile.html" class="font-medium hover:underline truncate">malith</a>
</div>
<span data-empty-for="assignees" class="text-xs text-muted-foreground">No one assigned</span>
</div>
</div>
</section>
<section class="border-t border-border pt-5">
<div class="space-y-2">
<div class="flex items-center justify-between">
<h3 class="text-[12px] font-medium text-muted-foreground">Labels</h3>
<div class="relative" data-pick="labels">
<button type="button" aria-haspopup="menu" aria-expanded="false" aria-label="Edit labels" class="text-muted-foreground hover:text-foreground"><svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true" focusable="false"><path d="M11 4H4a2 2 0 00-2 2v14a2 2 0 002 2h14a2 2 0 002-2v-7"></path><path d="M18.5 2.5a2.121 2.121 0 113 3L12 15l-4 1 1-4 9.5-9.5z"></path></svg></button>
<div role="menu" aria-label="Apply labels" class="hidden absolute right-0 top-full mt-1.5 z-50 w-56 rounded-md border border-border bg-popover text-popover-foreground shadow-md p-1 max-h-72 overflow-y-auto">
<div class="px-2 pt-1 pb-0.5 text-[10px] font-medium uppercase tracking-wider text-muted-foreground">Apply labels</div>
<button type="button" role="menuitemcheckbox" data-val="feature" aria-checked="true" class="group flex w-full items-center gap-2 px-2.5 py-1.5 rounded-md text-left text-[13px] text-muted-foreground hover:bg-accent hover:text-foreground">
<span class="h-2.5 w-2.5 rounded-full inline-block shrink-0" style="background-color: #22c55e"></span>
<span class="flex-1 truncate">feature</span>
<svg class="hidden group-aria-checked:block shrink-0 text-success ml-auto" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true" focusable="false"><polyline points="20 6 9 17 4 12"></polyline></svg>
</button>
<button type="button" role="menuitemcheckbox" data-val="bug" aria-checked="false" class="group flex w-full items-center gap-2 px-2.5 py-1.5 rounded-md text-left text-[13px] text-muted-foreground hover:bg-accent hover:text-foreground">
<span class="h-2.5 w-2.5 rounded-full inline-block shrink-0" style="background-color: #ef4444"></span>
<span class="flex-1 truncate">bug</span>
<svg class="hidden group-aria-checked:block shrink-0 text-success ml-auto" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true" focusable="false"><polyline points="20 6 9 17 4 12"></polyline></svg>
</button>
<button type="button" role="menuitemcheckbox" data-val="auth" aria-checked="true" class="group flex w-full items-center gap-2 px-2.5 py-1.5 rounded-md text-left text-[13px] text-muted-foreground hover:bg-accent hover:text-foreground">
<span class="h-2.5 w-2.5 rounded-full inline-block shrink-0" style="background-color: #3b82f6"></span>
<span class="flex-1 truncate">auth</span>
<svg class="hidden group-aria-checked:block shrink-0 text-success ml-auto" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true" focusable="false"><polyline points="20 6 9 17 4 12"></polyline></svg>
</button>
<button type="button" role="menuitemcheckbox" data-val="security" aria-checked="false" class="group flex w-full items-center gap-2 px-2.5 py-1.5 rounded-md text-left text-[13px] text-muted-foreground hover:bg-accent hover:text-foreground">
<span class="h-2.5 w-2.5 rounded-full inline-block shrink-0" style="background-color: #f59e0b"></span>
<span class="flex-1 truncate">security</span>
<svg class="hidden group-aria-checked:block shrink-0 text-success ml-auto" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true" focusable="false"><polyline points="20 6 9 17 4 12"></polyline></svg>
</button>
<div role="separator" class="my-1 h-px bg-border"></div>
<a href="settings.html" role="menuitem" class="flex w-full items-center gap-2 px-2.5 py-1.5 rounded-md text-left text-[13px] text-muted-foreground hover:bg-accent hover:text-foreground">
<svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" class="shrink-0" aria-hidden="true" focusable="false"><path d="M20.59 13.41l-7.17 7.17a2 2 0 01-2.83 0L2 12V2h10l8.59 8.59a2 2 0 010 2.82z"></path><line x1="7" y1="7" x2="7.01" y2="7"></line></svg>
Create a new label
</a>
</div>
</div>
</div>
<div class="flex flex-wrap gap-1">
<span data-show-for="labels:feature" class="inline-block max-w-full truncate align-middle rounded-full border px-2 py-px text-[11px] leading-4 font-medium border-(color:--label-border) bg-(color:--label-bg) text-(color:--label-fg) dark:border-(color:--label-dark-border) dark:bg-(color:--label-dark-bg) dark:text-(color:--label-dark-fg)" style="--label-bg:#22c55e;--label-fg:#1f2328;--label-border:#1ead53;--label-dark-bg:#22c55e2e;--label-dark-border:#22c55e66;--label-dark-fg:#22c55e">feature</span>
<span data-show-for="labels:bug" class="inline-block max-w-full truncate align-middle rounded-full border px-2 py-px text-[11px] leading-4 font-medium border-(color:--label-border) bg-(color:--label-bg) text-(color:--label-fg) dark:border-(color:--label-dark-border) dark:bg-(color:--label-dark-bg) dark:text-(color:--label-dark-fg)" style="--label-bg:#f15757;--label-fg:#1f2328;--label-border:#d44d4d;--label-dark-bg:#ef44442e;--label-dark-border:#ef444466;--label-dark-fg:#f26969">bug</span>
<span data-show-for="labels:auth" class="inline-block max-w-full truncate align-middle rounded-full border px-2 py-px text-[11px] leading-4 font-medium border-(color:--label-border) bg-(color:--label-bg) text-(color:--label-fg) dark:border-(color:--label-dark-border) dark:bg-(color:--label-dark-bg) dark:text-(color:--label-dark-fg)" style="--label-bg:#4588f6;--label-fg:#1f2328;--label-border:#3d78d8;--label-dark-bg:#3b82f62e;--label-dark-border:#3b82f666;--label-dark-fg:#5895f7">auth</span>
<span data-show-for="labels:security" class="inline-block max-w-full truncate align-middle rounded-full border px-2 py-px text-[11px] leading-4 font-medium border-(color:--label-border) bg-(color:--label-bg) text-(color:--label-fg) dark:border-(color:--label-dark-border) dark:bg-(color:--label-dark-bg) dark:text-(color:--label-dark-fg)" style="--label-bg:#f59e0b;--label-fg:#1f2328;--label-border:#d88b0a;--label-dark-bg:#f59e0b2e;--label-dark-border:#f59e0b66;--label-dark-fg:#f59e0b">security</span>
<span data-empty-for="labels" class="text-xs text-muted-foreground">None yet</span>
</div>
</div>
</section>
<section class="border-t border-border pt-5">
<div class="space-y-2">
<div class="flex items-center justify-between">
<h3 class="text-[12px] font-medium text-muted-foreground">Milestone</h3>
<div class="relative" data-pick="milestone">
<button type="button" aria-haspopup="menu" aria-expanded="false" aria-label="Set milestone" class="text-muted-foreground hover:text-foreground"><svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true" focusable="false"><path d="M11 4H4a2 2 0 00-2 2v14a2 2 0 002 2h14a2 2 0 002-2v-7"></path><path d="M18.5 2.5a2.121 2.121 0 113 3L12 15l-4 1 1-4 9.5-9.5z"></path></svg></button>
<div role="menu" aria-label="Set milestone" class="hidden absolute right-0 top-full mt-1.5 z-50 w-56 rounded-md border border-border bg-popover text-popover-foreground shadow-md p-1 max-h-72 overflow-y-auto">
<div class="px-2 pt-1 pb-0.5 text-[10px] font-medium uppercase tracking-wider text-muted-foreground">Set milestone</div>
<button type="button" role="menuitemradio" data-val="v0.9 — Tokens" aria-checked="true" class="group flex w-full items-center gap-2 px-2.5 py-1.5 rounded-md text-left text-[13px] text-muted-foreground hover:bg-accent hover:text-foreground">
<span class="h-2 w-2 rounded-full inline-block shrink-0 bg-success"></span>
<span class="flex-1 truncate">v0.9 — Tokens</span>
<svg class="hidden group-aria-checked:block shrink-0 text-success ml-auto" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true" focusable="false"><polyline points="20 6 9 17 4 12"></polyline></svg>
</button>
<button type="button" role="menuitemradio" data-val="v1.0" aria-checked="false" class="group flex w-full items-center gap-2 px-2.5 py-1.5 rounded-md text-left text-[13px] text-muted-foreground hover:bg-accent hover:text-foreground">
<span class="h-2 w-2 rounded-full inline-block shrink-0 bg-success"></span>
<span class="flex-1 truncate">v1.0</span>
<svg class="hidden group-aria-checked:block shrink-0 text-success ml-auto" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true" focusable="false"><polyline points="20 6 9 17 4 12"></polyline></svg>
</button>
<div role="separator" class="my-1 h-px bg-border"></div>
<a href="milestone_new.html" role="menuitem" class="flex w-full items-center gap-2 px-2.5 py-1.5 rounded-md text-left text-[13px] text-muted-foreground hover:bg-accent hover:text-foreground">
<svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" class="shrink-0" aria-hidden="true" focusable="false"><path d="M4 15s1-1 4-1 5 2 8 2 4-1 4-1V3s-1 1-4 1-5-2-8-2-4 1-4 1z"></path><line x1="4" y1="22" x2="4" y2="15"></line></svg>
New milestone
</a>
</div>
</div>
</div>
<div class="text-sm">
<a href="milestones.html" class="font-medium text-foreground hover:underline">v0.9 — Tokens</a>
<div class="mt-1">
<div class="w-full bg-muted rounded-full h-1">
<div class="bg-success h-1 rounded-full" style="width: 37%"></div>
</div>
<p class="text-xs text-muted-foreground mt-0.5">3/8 closed</p>
</div>
</div>
</div>
</section>
<section class="border-t border-border pt-5">
<div class="space-y-2">
<div class="flex items-center justify-between">
<h3 class="text-[12px] font-medium text-muted-foreground">Linked issues</h3>
<div class="relative" data-pick="linked">
<button type="button" aria-haspopup="menu" aria-expanded="false" aria-label="Link an issue" class="text-muted-foreground hover:text-foreground"><svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true" focusable="false"><circle cx="12" cy="12" r="9"></circle><path d="M12 8v8M8 12h8"></path></svg></button>
<div role="menu" aria-label="Link an issue" class="hidden absolute right-0 top-full mt-1.5 z-50 w-64 rounded-md border border-border bg-popover text-popover-foreground shadow-md p-1 max-h-72 overflow-y-auto">
<div class="px-2 pt-1 pb-0.5 text-[10px] font-medium uppercase tracking-wider text-muted-foreground">Link an issue</div>
<button type="button" role="menuitemcheckbox" data-val="298" aria-checked="true" class="group flex w-full items-center gap-2 px-2.5 py-1.5 rounded-md text-left text-[13px] text-muted-foreground hover:bg-accent hover:text-foreground">
<svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" class="shrink-0 text-success" aria-hidden="true" focusable="false"><circle cx="12" cy="12" r="9"></circle><polyline points="9 12 11 14 15 10"></polyline></svg>
<span class="flex-1 truncate"><span class="font-mono text-muted-foreground">#298</span> OAuth scopes for personal access tokens</span>
<svg class="hidden group-aria-checked:block shrink-0 text-success ml-auto" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true" focusable="false"><polyline points="20 6 9 17 4 12"></polyline></svg>
</button>
<button type="button" role="menuitemcheckbox" data-val="301" aria-checked="false" class="group flex w-full items-center gap-2 px-2.5 py-1.5 rounded-md text-left text-[13px] text-muted-foreground hover:bg-accent hover:text-foreground">
<svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" class="shrink-0 text-success" aria-hidden="true" focusable="false"><circle cx="12" cy="12" r="9"></circle><circle cx="12" cy="12" r="3" fill="currentColor" stroke="none"></circle></svg>
<span class="flex-1 truncate"><span class="font-mono text-muted-foreground">#301</span> Token list should show scope badges</span>
<svg class="hidden group-aria-checked:block shrink-0 text-success ml-auto" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true" focusable="false"><polyline points="20 6 9 17 4 12"></polyline></svg>
</button>
<div role="separator" class="my-1 h-px bg-border"></div>
<a href="issue_new.html" role="menuitem" class="flex w-full items-center gap-2 px-2.5 py-1.5 rounded-md text-left text-[13px] text-muted-foreground hover:bg-accent hover:text-foreground">
<svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" class="shrink-0" aria-hidden="true" focusable="false"><circle cx="12" cy="12" r="10"></circle><line x1="12" y1="8" x2="12" y2="16"></line><line x1="8" y1="12" x2="16" y2="12"></line></svg>
Create a new issue
</a>
</div>
</div>
</div>
<ul class="space-y-1.5 text-[13px]">
<li data-show-for="linked:298" class="flex items-center gap-2">
<svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" class="shrink-0 text-success" aria-hidden="true" focusable="false"><circle cx="12" cy="12" r="9"></circle><polyline points="9 12 11 14 15 10"></polyline></svg>
<a href="issue_detail.html" class="hover:underline truncate">
<span class="font-mono text-muted-foreground">#298</span>
OAuth scopes for personal access tokens
</a>
</li>
<li data-show-for="linked:301" class="flex items-center gap-2">
<svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" class="shrink-0 text-success" aria-hidden="true" focusable="false"><circle cx="12" cy="12" r="9"></circle><circle cx="12" cy="12" r="3" fill="currentColor" stroke="none"></circle></svg>
<a href="issue_detail.html" class="hover:underline truncate">
<span class="font-mono text-muted-foreground">#301</span>
Token list should show scope badges
</a>
</li>
</ul>
<p data-empty-for="linked" class="text-xs text-muted-foreground">No linked issues.</p>
</div>
</section>
<section class="border-t border-border pt-5">
<h3 class="text-[12px] font-medium text-muted-foreground mb-2">3 participants</h3>
<ul class="flex flex-wrap gap-1.5">
<li>
<a href="profile.html" aria-label="daisy" class="block rounded-full"><span class="inline-grid place-items-center rounded-full bg-muted border border-border font-medium text-muted-foreground h-7 w-7 text-xs" role="img" aria-label="daisy">D</span></a>
</li>
<li>
<a href="profile.html" aria-label="malith" class="block rounded-full"><span class="inline-grid place-items-center rounded-full bg-muted border border-border font-medium text-muted-foreground h-7 w-7 text-xs" role="img" aria-label="malith">M</span></a>
</li>
<li>
<a href="profile.html" aria-label="yumi" class="block rounded-full"><span class="inline-grid place-items-center rounded-full bg-muted border border-border font-medium text-muted-foreground h-7 w-7 text-xs" role="img" aria-label="yumi">Y</span></a>
</li>
</ul>
</section>
<section class="border-t border-border pt-5">
<div id="thread-subscription">
<h3 class="text-[12px] font-medium text-muted-foreground mb-2 flex items-center gap-2">
Notifications
<span id="sub-muted" hidden class="inline-flex items-center px-2 py-0.5 rounded-full text-[11px] font-medium border border-border bg-muted text-muted-foreground">Muted</span>
</h3>
<button type="button" id="sub-btn" aria-pressed="true" class="w-full h-8 inline-flex items-center justify-center gap-1.5 rounded-md border border-border bg-accent text-foreground text-[13px] hover:bg-accent/70">
<svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" aria-hidden="true" focusable="false"><path d="M13.7 21a2 2 0 01-3.4 0M18.6 13A17 17 0 0118 8M6.3 6.3A6 6 0 006 8c0 7-3 9-3 9h14M18 8a6 6 0 00-9.3-5M1 1l22 22"></path></svg>
<span>Unsubscribe</span>
</button>
<p id="sub-text" class="mt-2 text-[12px] text-muted-foreground">You’re receiving notifications. <em>You were assigned.</em></p>
</div>
</section>
<section data-when="pr=open viewer=reviewer,author" class="border-t border-border pt-5">
<button type="button" data-draft class="inline-flex items-center gap-1.5 text-[12px] text-muted-foreground hover:text-foreground">
<svg width="13" height="13" viewBox="0 0 16 16" fill="currentColor" aria-hidden="true"><path d="M1.5 3.25a2.25 2.25 0 113 2.122v5.256a2.251 2.251 0 11-1.5 0V5.372A2.25 2.25 0 011.5 3.25zM3.75 2.5a.75.75 0 100 1.5.75.75 0 000-1.5zm0 9.5a.75.75 0 100 1.5.75.75 0 000-1.5zm6.5-9.25a2.25 2.25 0 113 2.122V10.5a2.25 2.25 0 11-1.5 0V4.622a2.25 2.25 0 01-1.5-2.122zm2.25-.75a.75.75 0 100 1.5.75.75 0 000-1.5zm0 9.5a.75.75 0 100 1.5.75.75 0 000-1.5z"></path></svg>
Convert to draft
</button>
<p class="mt-1 text-[11px] text-muted-foreground">Blocks merging and auto-merge until it's marked ready again.</p>
</section>
</aside>
</div>
<dialog id="close-pull-dialog" class="rounded-lg border border-border bg-popover text-popover-foreground p-0 w-[480px] max-w-[calc(100vw-2rem)] max-h-[calc(100dvh-2rem)] overflow-y-auto mt-[28vh] mb-auto translate-y-[min(0px,calc(100dvh-28vh-1rem-100%))] backdrop:bg-black/60 backdrop:backdrop-blur-xs open:animate-in" aria-labelledby="close-pull-dialog-title">
<div class="sticky top-0 z-10 bg-popover flex flex-col gap-1 p-5 border-b border-border">
<h2 id="close-pull-dialog-title" class="text-base font-semibold leading-tight">Close this pull request?</h2>
<p class="text-[13px] text-muted-foreground leading-snug">Close pull request <strong class="text-foreground">#341</strong> — <strong class="text-foreground">Add OAuth scopes to access tokens</strong>. You can reopen it later if needed.</p>
</div>
<div class="sticky bottom-0 z-10 bg-popover flex items-center justify-end gap-2 p-5 border-t border-border">
<form method="dialog" class="contents">
<button type="submit" class="inline-flex items-center justify-center rounded-md text-sm font-medium transition-colors border border-input bg-transparent hover:bg-accent hover:text-accent-foreground h-9 px-4">Cancel</button>
</form>
<button type="button" onclick="document.getElementById('close-pull-dialog').close()" class="inline-flex items-center justify-center rounded-md text-sm font-medium h-9 px-4 bg-destructive text-destructive-foreground hover:bg-destructive/90">Close pull request</button>
</div>
</dialog>
<dialog id="review-dialog" class="rounded-lg border border-border bg-popover text-popover-foreground p-0 w-[480px] max-w-[calc(100vw-2rem)] max-h-[calc(100dvh-2rem)] overflow-y-auto mt-[28vh] mb-auto translate-y-[min(0px,calc(100dvh-28vh-1rem-100%))] backdrop:bg-black/60 backdrop:backdrop-blur-xs open:animate-in" aria-labelledby="review-dialog-title">
<div class="sticky top-0 z-10 bg-popover flex flex-col gap-1 p-5 border-b border-border">
<h2 id="review-dialog-title" class="text-base font-semibold leading-tight">Review changes</h2>
<p class="text-[13px] text-muted-foreground leading-snug">Line comments you add on the Files tab are posted as you write them. This adds your summary and verdict to <strong class="text-foreground">#341</strong>.</p>
</div>
<form id="review-form">
<div class="p-5 text-sm">
<label for="review-body" class="sr-only">Review summary</label>
<div class="rounded-md border border-border overflow-hidden">
<textarea id="review-body" name="body" rows="4" placeholder="Leave a summary — Markdown supported" class="w-full px-3 py-3 text-[13px] font-mono leading-relaxed bg-transparent resize-none focus:outline-hidden placeholder:text-muted-foreground"></textarea>
</div>
<div role="radiogroup" aria-label="Review type" class="grid gap-3 mt-4">
<label class="flex items-start gap-3 cursor-pointer">
<input type="radio" name="state" value="commented" checked class="h-4 w-4 shrink-0 border border-input bg-transparent accent-ring checked:border-ring disabled:cursor-not-allowed disabled:opacity-50 mt-0.5" />
<span class="text-sm">
<span class="font-medium block">Comment</span>
<span class="text-muted-foreground text-[12px]">General feedback, without approving or blocking.</span>
</span>
</label>
<label class="flex items-start gap-3 cursor-pointer">
<input type="radio" name="state" value="approved" class="h-4 w-4 shrink-0 border border-input bg-transparent accent-ring checked:border-ring disabled:cursor-not-allowed disabled:opacity-50 mt-0.5" />
<span class="text-sm">
<span class="font-medium block">Approve</span>
<span class="text-muted-foreground text-[12px]">Counts toward the required approvals for main.</span>
</span>
</label>
<label class="flex items-start gap-3 cursor-pointer">
<input type="radio" name="state" value="changes_requested" class="h-4 w-4 shrink-0 border border-input bg-transparent accent-ring checked:border-ring disabled:cursor-not-allowed disabled:opacity-50 mt-0.5" />
<span class="text-sm">
<span class="font-medium block">Request changes</span>
<span class="text-muted-foreground text-[12px]">Blocks merging until you approve or your review is dismissed.</span>
</span>
</label>
<p data-when="viewer=author" class="text-[12px] text-muted-foreground inline-flex items-start gap-1.5">
<svg class="shrink-0 mt-px" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" aria-hidden="true"><circle cx="12" cy="12" r="9"></circle><path d="M12 8v4M12 16h.01"></path></svg>
You opened this pull request, so you can only comment on it.
</p>
</div>
</div>
</form>
<div class="sticky bottom-0 z-10 bg-popover flex items-center justify-end gap-2 p-5 border-t border-border">
<form method="dialog" class="contents">
<button type="submit" class="inline-flex items-center justify-center rounded-md text-sm font-medium transition-colors border border-input bg-transparent hover:bg-accent hover:text-accent-foreground h-9 px-4">Cancel</button>
</form>
<button type="submit" form="review-form" class="inline-flex items-center justify-center gap-1.5 rounded-md font-medium transition-colors disabled:opacity-50 disabled:pointer-events-none bg-success text-success-foreground hover:bg-success/90 h-9 px-4 text-sm">Submit review</button>
</div>
</dialog>
<dialog id="merge-confirm-dialog" class="rounded-lg border border-border bg-popover text-popover-foreground p-0 w-[480px] max-w-[calc(100vw-2rem)] max-h-[calc(100dvh-2rem)] overflow-y-auto mt-[28vh] mb-auto translate-y-[min(0px,calc(100dvh-28vh-1rem-100%))] backdrop:bg-black/60 backdrop:backdrop-blur-xs open:animate-in" aria-labelledby="merge-confirm-dialog-title">
<div class="sticky top-0 z-10 bg-popover flex flex-col gap-1 p-5 border-b border-border">
<h2 id="merge-confirm-dialog-title" class="text-base font-semibold leading-tight">Confirm merge</h2>
<p id="merge-note" class="text-[13px] text-muted-foreground leading-snug">Squash and merge into main.</p>
</div>
<div class="p-5 text-sm">
<div id="merge-fields" class="grid gap-3">
<div class="grid gap-1.5">
<label for="merge-title" class="text-[12px] font-medium">Commit title</label>
<input id="merge-title" type="text" maxlength="200" value="Squash merge branch 'daisy/oauth-scopes' into 'main'" class="h-9 w-full rounded-md border border-input bg-transparent px-3 text-[13px] focus:outline-hidden focus-visible:outline-solid focus-visible:outline-2 focus-visible:outline-ring" />
</div>
<div class="grid gap-1.5">
<label for="merge-message" class="text-[12px] font-medium">Commit message <span class="font-normal text-muted-foreground">(optional)</span></label>
<textarea id="merge-message" rows="4" class="w-full rounded-md border border-input bg-transparent px-3 py-2 text-[13px] font-mono leading-relaxed resize-none focus:outline-hidden focus-visible:outline-solid focus-visible:outline-2 focus-visible:outline-ring"></textarea>
</div>
</div>
<p id="merge-ff-note" hidden class="text-[13px] text-muted-foreground">
Fast-forward moves <span class="font-mono text-foreground">main</span> to the head commit. It creates no new commit, so there is no message to edit.
</p>
</div>
<div class="sticky bottom-0 z-10 bg-popover flex items-center justify-end gap-2 p-5 border-t border-border">
<form method="dialog" class="contents">
<button type="submit" class="inline-flex items-center justify-center rounded-md text-sm font-medium transition-colors border border-input bg-transparent hover:bg-accent hover:text-accent-foreground h-9 px-4">Cancel</button>
</form>
<button type="button" onclick="document.getElementById('merge-confirm-dialog').close()" class="inline-flex items-center justify-center gap-1.5 rounded-md text-sm font-medium h-9 px-4 bg-success text-success-foreground hover:bg-success/90">Confirm merge</button>
</div>
</dialog>
</div>
</main>
<div id="cz-footer"></div>
<script src="shell.js"></script>
<script>
(function () {
var btn = document.getElementById('edit-pr-btn');
var txt = document.getElementById('pr-title-text');
var original = txt.textContent;
var editing = ['rounded-sm', 'bg-muted', 'px-1', 'outline-solid', 'outline-1', 'outline-border'];
btn.addEventListener('click', function () {
if (txt.isContentEditable) {
var next = txt.textContent.trim();
txt.contentEditable = 'false';
txt.classList.remove.apply(txt.classList, editing);
btn.textContent = 'Edit';
if (next) original = next; else txt.textContent = original;
} else {
txt.contentEditable = 'true';
txt.classList.add.apply(txt.classList, editing);
btn.textContent = 'Save';
txt.focus();
}
});
})();
</script>
<script>
document.querySelectorAll('[data-md-editor]').forEach(function (ed) {
var tabs = ed.querySelectorAll('[data-md-tab]');
var write = ed.querySelector('[data-md-pane=write]');
var preview = ed.querySelector('[data-md-pane=preview]');
var ta = ed.querySelector('textarea');
tabs.forEach(function (t) {
t.addEventListener('click', function () {
var showPreview = t.dataset.mdTab === 'preview';
tabs.forEach(function (o) {
var on = o === t;
o.setAttribute('aria-selected', on);
o.classList.toggle('border-foreground', on);
o.classList.toggle('text-foreground', on);
o.classList.toggle('font-medium', on);
o.classList.toggle('border-transparent', !on);
o.classList.toggle('text-muted-foreground', !on);
});
write.classList.toggle('hidden', showPreview);
preview.classList.toggle('hidden', !showPreview);
if (showPreview) {
preview.textContent = ta.value || 'Nothing to preview';
preview.classList.add('whitespace-pre-wrap');
}
});
});
});
function closePickers(except) {
document.querySelectorAll('[data-pick]').forEach(function (p) {
if (p === except) return;
p.querySelector('[role=menu]').classList.add('hidden');
p.querySelector('[aria-haspopup]').setAttribute('aria-expanded', 'false');
});
}
function syncPickers() {
var checked = {};
document.querySelectorAll('[data-pick] [data-val]').forEach(function (b) {
if (b.getAttribute('aria-checked') !== 'true') return;
var g = b.closest('[data-pick]').dataset.pick;
(checked[g] = checked[g] || []).push(b.dataset.val);
});
document.querySelectorAll('[data-show-for]').forEach(function (el) {
var p = el.dataset.showFor.split(':');
el.hidden = (checked[p[0]] || []).indexOf(p[1]) < 0;
});
document.querySelectorAll('[data-empty-for]').forEach(function (el) {
el.hidden = (checked[el.dataset.emptyFor] || []).length > 0;
});
}
document.addEventListener('click', function (e) {
var pick = e.target.closest('[data-pick]');
closePickers(pick);
if (!pick) return;
var trigger = e.target.closest('[data-pick] > [aria-haspopup]');
if (trigger) {
var open = pick.querySelector('[role=menu]').classList.toggle('hidden') === false;
trigger.setAttribute('aria-expanded', open);
return;
}
var item = e.target.closest('[role=menuitemcheckbox], [role=menuitemradio]');
if (!item) return;
if (item.getAttribute('role') === 'menuitemradio') {
pick.querySelectorAll('[role=menuitemradio]').forEach(function (o) { o.setAttribute('aria-checked', o === item); });
} else {
item.setAttribute('aria-checked', item.getAttribute('aria-checked') !== 'true');
}
syncPickers();
});
document.addEventListener('keydown', function (e) { if (e.key === 'Escape') closePickers(null); });
syncPickers();
var editBtn = document.getElementById('edit-desc-btn');
var rendered = document.getElementById('desc-rendered');
var editor = document.getElementById('desc-editor');
function toggleDesc(editing) {
rendered.classList.toggle('hidden', editing);
editor.classList.toggle('hidden', !editing);
}
editBtn.addEventListener('click', function () { toggleDesc(editor.classList.contains('hidden')); });
document.getElementById('desc-cancel').addEventListener('click', function () { toggleDesc(false); });
editor.addEventListener('submit', function (e) { e.preventDefault(); toggleDesc(false); });
var strategy = { key: 'squash', label: 'Squash and merge', icon: null };
var titles = { squash: "Squash merge branch 'daisy/oauth-scopes' into 'main'", merge: "Merge branch 'daisy/oauth-scopes' into 'main'" };
var merges = document.querySelectorAll('[data-merge]');
function setMenu(box, open) {
box.querySelector('[role=menu]').classList.toggle('hidden', !open);
box.querySelector('[data-merge-toggle]').setAttribute('aria-expanded', open);
}
function closeMenus() { merges.forEach(function (m) { setMenu(m, false); }); }
merges.forEach(function (box) {
var menu = box.querySelector('[role=menu]');
box.querySelector('[data-merge-toggle]').addEventListener('click', function (e) {
e.stopPropagation();
setMenu(box, menu.classList.contains('hidden'));
});
menu.querySelectorAll('[data-strategy]').forEach(function (item) {
item.addEventListener('click', function () {
strategy.key = item.dataset.strategy;
strategy.label = item.dataset.label;
merges.forEach(function (m) {
m.querySelectorAll('[data-strategy]').forEach(function (o) { o.setAttribute('aria-checked', o.dataset.strategy === strategy.key); });
m.querySelector('[data-merge-label]').textContent = strategy.label;
var icon = item.querySelector('svg').cloneNode(true);
icon.setAttribute('data-merge-icon', '');
m.querySelector('[data-merge-icon]').replaceWith(icon);
});
closeMenus();
});
});
});
document.addEventListener('click', function (e) { if (!e.target.closest('[data-merge]')) closeMenus(); });
document.addEventListener('keydown', function (e) { if (e.key === 'Escape') closeMenus(); });
document.querySelectorAll('[data-begin]').forEach(function (btn) {
btn.addEventListener('click', function () {
var ff = strategy.key === 'ff';
document.getElementById('merge-note').textContent = ff ? 'Fast-forward the base branch.' : strategy.label + ' into main.';
document.getElementById('merge-fields').hidden = ff;
document.getElementById('merge-ff-note').hidden = !ff;
document.getElementById('merge-title').value = titles[strategy.key] || '';
document.getElementById('merge-message').value = '';
document.getElementById('merge-confirm-dialog').showModal();
});
});
document.getElementById('review-form').addEventListener('submit', function (e) {
e.preventDefault();
document.getElementById('review-dialog').close();
});
var state = { pr: 'open', merge: 'ready', viewer: 'reviewer' };
function readHash() {
location.hash.slice(1).split('&').forEach(function (pair) {
var kv = pair.split('=');
if (kv[0] in state && kv[1]) state[kv[0]] = kv[1];
});
}
function applyState() {
document.querySelectorAll('[data-when]').forEach(function (el) {
el.hidden = !el.dataset.when.split(' ').every(function (cond) {
var kv = cond.split('=');
return kv[1].split(',').indexOf(state[kv[0]]) !== -1;
});
});
var author = state.viewer === 'author';
document.querySelectorAll('#review-form input[value=approved], #review-form input[value=changes_requested]').forEach(function (r) {
r.disabled = author;
r.closest('label').classList.toggle('cursor-pointer', !author);
r.closest('label').classList.toggle('opacity-50', author);
r.closest('label').classList.toggle('cursor-not-allowed', author);
});
}
function setPr(next) {
state.pr = next;
history.replaceState(null, '', '#' + Object.keys(state).map(function (k) { return k + '=' + state[k]; }).join('&'));
applyState();
}
document.querySelectorAll('[data-ready]').forEach(function (b) { b.addEventListener('click', function () { setPr('open'); }); });
document.querySelectorAll('[data-draft]').forEach(function (b) { b.addEventListener('click', function () { setPr('draft'); }); });
window.addEventListener('hashchange', function () { readHash(); applyState(); });
readHash();
applyState();
var subBtn = document.getElementById('sub-btn');
var subText = document.getElementById('sub-text');
subBtn.addEventListener('click', function () {
var on = subBtn.getAttribute('aria-pressed') !== 'true';
subBtn.setAttribute('aria-pressed', on);
subBtn.classList.toggle('bg-accent', on);
subBtn.classList.toggle('text-foreground', on);
subBtn.classList.toggle('text-muted-foreground', !on);
subBtn.querySelector('span').textContent = on ? 'Unsubscribe' : 'Subscribe';
document.getElementById('sub-muted').hidden = true;
subText.textContent = on ? 'You’re receiving notifications.' : 'You’re not receiving notifications from this thread.';
});
</script>
</body>
</html>