Goto Line

Compact jump-to-line input with a typed value, a blinking caret, and the total line count.

Go to line142

of 386

Requires shadcn/ui initialized. Run npx shadcn@latest init if you haven't.

Import & use

import { Editor36 } from "@/components/beste/piece/editor36";

<Editor36
  value="142"
  total={386}
/>

More Editor pieces

3 cursors

const name = 'Ayşe';
const role = 'design';
const team = 'core';

editor16

Stacked code lines each with a primary-tinted blinking caret at the same column plus a header count.

greet()

greet(name: string, locale: Locale): string

Greet the user with a localized message.

editor17

Function call line with a caret plus a signature popover underneath. The current parameter underlines in primary.

return greet(name);

Ayşe

editor13

Code line with a teammate's blinking caret tinted by tone and a name tag floating above it.

1// TODO migrate to server components
2// FIXME handles null state poorly
3// NOTE revisit once design lock lands

editor28

Italic comment lines with colored TODO, FIXME, NOTE, or HACK tags.

12function renderChart(data) {
37}

editor38

Expanded open line, a collapsed region button with chevron and line count, and the closing line.

AI Suggestion

const greet = (name: string) => `Hello, ${name}!`;

editor8

AI Suggestion caption above a code line with a solid prefix, italic muted ghost text, and a blinking caret.