Shadcn Chatbot Kit
uiinterrupt-promptsource: ok · hit
Interrupt Prompt
npx shadcn add "https://shadcn-chatbot-kit.vercel.app/r/interrupt-prompt.json"free
No selection tags yet — empty means no evidence, not lack of support.
Dependencies
Bundle weight · lightframer-motion@11
Files1 · source cached 10/14/2026, 12:21:44 PM
ui/interrupt-prompt.tsx
"use client"
import { AnimatePresence, motion } from "framer-motion"
import { X } from "lucide-react"
interface InterruptPromptProps {
isOpen: boolean
close: () => void
}
export function InterruptPrompt({ isOpen, close }: InterruptPromptProps) {
return (
<AnimatePresence>
{isOpen && (
<motion.div
initial={{ top: 0, filter: "blur(5px)" }}
animate={{
top: -40,
filter: "blur(0px)",
transition: {
type: "spring",
filter: { type: "tween" },
},
}}
exit={{ top: 0, filter: "blur(5px)" }}
className="absolute left-1/2 flex -translate-x-1/2 overflow-hidden whitespace-nowrap rounded-full border bg-background py-1 text-center text-sm text-muted-foreground"
>
<span className="ml-2.5">Press Enter again to interrupt</span>
<button
className="ml-1 mr-2.5 flex items-center"
type="button"
onClick={close}
aria-label="Close"
>
<X className="h-3 w-3" />
</button>
</motion.div>
)}
</AnimatePresence>
)
}