Shapeshift is a Next.js + React 19 component that turns a single text input into context-aware UI cards. As you type, the box morphs into event cards, checklists, timers, color pickers, bill splitters, converters, polls, and more based on detected intent. Intent classification is powered by TypeSafe Jev, which answers 14 typed questions in a single parallel call, while all value extraction (dates, amounts, units, math) is handled by deterministic code. The project works fully offline by default using a built-in keyword classifier and can optionally use the online Jev model with an API key.
- One Jev call answers 14 typed questions in parallel (speculative fan-out), covering card type plus signals like "is it a video call?" and "is it urgent?"
- A state machine with hysteresis prevents flickering: a card only changes when a challenger wins twice in a row or is very confident
- 19 card types supported, including trip planner, time zone converter, dice roller, countdown, and goal tracker
- Built with TypeScript (strict), Tailwind CSS v4, shadcn/ui, Motion, chrono-node, and zod
- Live demo at shapeshiftui.vercel.app
- One Jev call answers 14 typed questions in parallel (speculative fan-out), covering card type plus signals like "is it a video call?" and "is it urgent?"
- A state machine with hysteresis prevents flickering: a card only changes when a challenger wins twice in a row or is very confident
- 19 card types supported, including trip planner, time zone converter, dice roller, countdown, and goal tracker
- Built with TypeScript (strict), Tailwind CSS v4, shadcn/ui, Motion, chrono-node, and zod
- Live demo at shapeshiftui.vercel.app
