1Sponsor

Path Input

Filesystem path input with tab autocomplete

Terminal

Installation

pnpm dlx shadcn@latest add https://termcn.dev/r/path-input.json

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
valuestringundefined
onChange(value: string) => voidundefined
onSubmit(value: string) => voidundefined
labelstringundefined
placeholderstring"/"
autoFocusbooleanfalse
idstringundefined
widthnumber40
filterstringundefined
dirsOnlybooleanfalse