Cyberpunk Textarea

Shared multiline input for prompts, notes, and longer authored content.

Components / Cyberpunk Textarea

Formstextareapromptmultiline

Textarea primitive with the shared Steez form framing.

Preview

Loading preview…

Usage

Shared multiline input for prompts, notes, and longer authored content.

<CyberpunkTextarea
  label="System prompt"
  rows={6}
  placeholder="Tell the companion how to behave."
/>

Files

components/steez/CyberpunkTextarea.tsxcomponent

components/steez/CyberpunkTextarea.module.cssstyle

components/hooks/useStableId.tsfile

Install package

pnpm add @steez-ui/theme @steez-ui/icons @steez-ui/ui

import { CyberpunkTextarea } from "@steez-ui/ui";

Install from registry

pnpm dlx shadcn@latest add https://steez-ui-6v5.pages.dev/r-steez/cyberpunk-textarea.json

Source files install at your project root. Import styles/steez/tokens.css once in your global stylesheet or root layout. No Steez packages needed.

import { CyberpunkTextarea } from "<project-root>/components/steez/CyberpunkTextarea";

Replace <project-root> with a relative path from your file.

Copy standalone file

/copy/steez/cyberpunk-textarea.tsxLoading…

Copy the entire generated TSX file into your React project. It embeds CSS, local helpers, icons, and theme fallbacks, so no Steez npm packages are required.

Open standalone source

Cyberpunk Input

Monospace text input with label, helper copy, and optional leading icon.

Cyberpunk Select

Select field with shared Steez framing and arrow treatment.