+6 −3
4242const subtotal = sum(items);
43- return subtotal * (1 + taxRate);
43+ const total = subtotal * (1 + taxRate);
44+ const precision = currency === "JPY" ? 0 : 2;
45+ return Number(total.toFixed(precision));
61- export function formatMoney(value, currency) {
62- return value.toLocaleString(undefined, { currency });
61+ export function formatMoney(value, currency, locale) {
62+ return value.toLocaleString(locale, {
63+ style: "currency", currency: currency });
">

The prompt

Build a compact selective diff-staging panel with Tailwind CSS. The header names a changed file, shows its branch path, a green additions count and red deletions count, plus a master checkbox. Below, render two code hunks as bordered groups with monospaced line numbers and tinted addition/deletion rows; each hunk gets its own checkbox and a concise context label. Finish with a sticky-looking footer that reports how many hunks are selected and has a dark “Stage selected” button. Then add JavaScript that keeps the master checkbox synchronized, including its indeterminate state, updates the selected count and button label, disables the action when nothing is checked, and on staging replaces each selected hunk with a calm staged confirmation row while recalculating the remaining totals. Use semantic checkbox labels and an aria-live status so the interaction remains accessible.

Paste it into Claude, Cursor, v0 or any AI coding tool. Prefer the finished markup? .