Capability Gate

A true gate: renders its children only when the device meets a stated requirement (e.g. requires="webgpu"), otherwise a themed fallback slot with guidance. The capability check uses useCapabilities. Local models have hard device requirement.

Library

LocalMode

Framework

React

Type

component

License

MIT

Install

npx shadcn add @localmode/ui/ui/local-first/capability-gate

Files

• apps/ui/registry/localmode/local-first/capability-gate/capability-gate.tsx
• apps/ui/src/lib/use-environment.ts
• apps/ui/registry/localmode/lib/utils.ts

Source

https://github.com/LocalMode-AI/LocalMode

Categories

• Empty State Components
• React Empty State Components
• Tailwind CSS Empty State Components
• Feedback Components
• React Feedback Components
• Tailwind CSS Feedback Components
• Utility Components
• React Utility Components
• Tailwind CSS Utility Components

More from LocalMode

• Chrome AI Download Gate
• Artifact
• Chart Artifact
• Code Diff Viewer
• Data Table Artifact
• Audio Scrub Player
• Mic Selector
• Streaming Speech Panel
• Synced Transcript Viewer
• Transcribed Note Card
• Voice Button
• Voice Comparison Panel