473
Sponsor

Path Input

Filesystem path input with tab autocomplete

Terminal

Installation

$ pnpm dlx shadcn@latest add @termcn/path-input

Usage

import { PathInput } from "@/components/ui/path-input";
<PathInput
  label="Project Directory"
  placeholder="/home/user/projects"
  onSubmit={(path) => console.log("Selected:", path)}
/>

API Reference

PathInput

PropTypeDefault
valuestring-
onChange(value: string) => void-
onSubmit(value: string) => void-
labelstring-
placeholderstring"/"
autoFocusbooleanfalse
idstring-
widthnumber40
filterstring-
dirsOnlybooleanfalse