Textarea with Counter

A textarea component with real-time word and character counting, perfect for forms with length limits.

textareacounterforminputvalidation
v0.100.1
Promptbook Team

Live Preview

Features

  • Real-time word counting
  • Character limit enforcement
  • Visual feedback when approaching limit
  • Controlled and uncontrolled modes
  • Responsive design
  • Accessible keyboard navigation

Usage Examples

Basic Usage

<TextareaWithCounter placeholder="Enter your message..." />

With Custom Limit

<TextareaWithCounter maxLength={1000} rows={6} />

Controlled Mode

<TextareaWithCounter value={text} onChange={setText} />

Quick Actions

Technical Details

Category

Internal

Dependencies

react: ^18.0.0 || ^19.0.0
@promptbook/components: 0.100.1

Props

placeholder
string
Placeholder text for the textarea
Default: "Start typing..."
maxLength
number
Maximum number of characters allowed
Default: 500
rows
number
Number of visible text lines
Default: 4
className
string
Additional CSS classes
Default: ""
value
string
Controlled value (optional)
onChange
(value: string) => void
Callback when value changes (for controlled mode)
Promptbook Components Gallery