Measured entry
originui-comp-151
A compact vertical list of labeled checkboxes with hard-coded framework choices. It ships as a shadcn registry component that composes Origin's Radix-backed Checkbox and Label primitives. It depends on React useId, radix-ui, Tailwind utility classes, the project alias, and a cn helper.



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 | 32.6 KB (98.0 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.77s error during build: [vite:load-fallback] Could not load <sandbox>/src/lib/utils (imported by src/components/ui/label.tsx): ENOENT: no such file or directory, open '<sandbox>/src/lib/utils'
Verdict
A sensible, accessible starting point for a small checkbox group, but it is demo-level composition rather than a reusable data-driven field. It needs a shadcn-style setup to build because its imported UI primitives expect the aliased cn utility.
Use it if
- You need a compact multi-select list where each label toggles its associated checkbox.
- Your app already follows shadcn conventions and you want Origin styling on Radix checkbox behavior.
- You want an uncontrolled starting point for a settings or preference form.
Skip it if
- The choices are mutually exclusive and should use a radio group instead.
- You need form state, validation, submission, or persistence built into the component.
- Your project does not use Tailwind utilities or shadcn-style aliases and you do not want to adapt the primitives.
- You need options generated from data without replacing the hard-coded labels.
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 |
For a non-shadcn project, add radix-ui, Tailwind styles and the theme tokens used by Origin, configure the project alias, provide a cn helper at the imported utility path, and copy or adapt the Checkbox and Label primitives. Add the appropriate client-component boundary if your framework requires one.
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 checkbox pattern, ordered by what they measured: mounts first, then clean axe scans, then bare-mode passes, then the smaller bundle.
- neu-checkboxneumorphism
- Renders
- YES
- A11y
- 0
- Gzip
- 17.9KB
- Bare
- pass
- Prov
- NO
- clay-checkboxclaymorphism
- Renders
- YES
- A11y
- 0
- Gzip
- 18.2KB
- Bare
- pass
- Prov
- NO
- shadcn-checkboxunclassified
- Renders
- YES
- A11y
- 0
- Gzip
- 18.4KB
- Bare
- fail
- Prov
- NO
- originui-comp-132minimal-flat
- Renders
- YES
- A11y
- 0
- Gzip
- 32.5KB
- Bare
- fail
- Prov
- NO
- originui-comp-135minimal-flat
- Renders
- YES
- A11y
- 0
- Gzip
- 32.5KB
- Bare
- fail
- Prov
- NO
- originui-comp-140minimal-flat
- Renders
- YES
- A11y
- 0
- Gzip
- 32.5KB
- Bare
- fail
- Prov
- NO