Measured entry
originui-comp-70
A compact React comment field composed of an associated label, a native textarea wrapper, and a full-width outlined button. It ships as an Origin UI shadcn registry component and relies on the registry's Button, Label, and Textarea primitives, Tailwind utility classes and theme tokens, a cn helper, class-variance-authority, and Radix UI.



Measured
Every value below was written by the harness on the run that produced the frames above. None of it is derived from the prose.
| Build | OK |
|---|---|
| Mount | OK |
| Console errors | 0 |
| Uncaught page errors | 0 |
| Horizontal overflow | clean at 375, 768, 1440 |
| Axe critical | 0 |
| Axe serious | 0 |
| Axe moderate | 0 |
| Axe minor | 0 |
| Gzip marginal | 28.8 KB (94.2 KB build, 65.4 KB baseline) |
| Bare mode | FAIL |
| Provider required | NO |
| Demo used | written from the component source API |
What the harness recorded
BARE BUILD
✗ Build failed in 3.02s error during build: [vite:load-fallback] Could not load <sandbox>/src/lib/utils (imported by src/components/ui/button.tsx): ENOENT: no such file or directory, open '<sandbox>/src/lib/utils'
Verdict
A sound, focused composition for shadcn-based forms: it builds, mounts, stays contained, and exposes no automated accessibility findings. It is not drop-in for a bare React app and needs a shadcn-style setup. Treat it as presentational scaffolding, since the button has no submission behavior of its own.
Use it if
- You need a labeled comment or message field with a clear action directly below it.
- Your app already uses shadcn-style registry components and matching Tailwind theme tokens.
- You want a simple accessible label association while supplying submission behavior yourself.
Skip it if
- You need validation, character counting, loading state, or submission logic included.
- A standalone textarea is enough and the extra full-width action would duplicate your form controls.
- Your project does not use Tailwind or shadcn-style aliases and you do not want to adopt their supporting utilities.
Install
| Declared dependencies | radix-ui |
|---|---|
| Missing on install | none |
| Bare install | fails once the shadcn-style helpers are removed, so it needs that setup |
| Provider | no provider required in the harness |
In a non-shadcn project, add the Button, Label, and Textarea source files; install Radix UI and class-variance-authority; provide the cn class-merging utility; configure the registry import alias; and reproduce the required Tailwind utilities and semantic theme tokens. Add your own form handler, validation, and pending state.
Source and credit
This page is a review, not a copy. The component source lives with its author and this site does not republish it. Read the license before you use anything.
Author repository
github.com/origin-space/originuiAlternatives
Other published entries for the textarea pattern, ordered by what they measured: mounts first, then clean axe scans, then bare-mode passes, then the smaller bundle.
- originui-comp-73minimal-flat
- Renders
- YES
- A11y
- 0
- Gzip
- 17.4KB
- Bare
- pass
- Prov
- NO
- shadcn-textareaunclassified
- Renders
- YES
- A11y
- 0
- Gzip
- 29.1KB
- Bare
- pass
- Prov
- NO
- hextaui-textareaminimal-flat
- Renders
- YES
- A11y
- 0
- Gzip
- 29.8KB
- Bare
- pass
- Prov
- NO
- originui-comp-59minimal-flat
- Renders
- YES
- A11y
- 0
- Gzip
- 28.1KB
- Bare
- fail
- Prov
- NO
- originui-comp-60minimal-flat
- Renders
- YES
- A11y
- 0
- Gzip
- 28.1KB
- Bare
- fail
- Prov
- NO
- originui-comp-62minimal-flat
- Renders
- YES
- A11y
- 0
- Gzip
- 28.1KB
- Bare
- fail
- Prov
- NO