Vinyl UI

Context Menu

Menu opened by right-click (web) or long-press (native).

Right-click the deck

Vinyl styling: Retro-shadow panel that opens with a quick barn-door wipe.

Installation

npx shadcn@latest add @vinyl/context-menu

The @vinyl registry URL in components.json decides whether you get the web or the native version (see installation for web / native).

Usage

<ContextMenu>
  <ContextMenuTrigger>Right-click the deck</ContextMenuTrigger>
  <ContextMenuContent>
    <ContextMenuItem>Play</ContextMenuItem>
    <ContextMenuItem variant="destructive">Eject</ContextMenuItem>
  </ContextMenuContent>
</ContextMenu>

API

Same API as shadcn/ui's Context Menu on the web, and React Native Reusables' Context Menu on native. Vinyl only changes styling and motion.

Collapsible

Show and hide a single section.

Dialog

Modal that opens with a box wipe and switches off like a CRT.

On this page

InstallationUsageAPI