Case study 04, 2026

Quint

A deterministic choice-and-reveal system for AI user interfaces. Most LLM products still behave like terminals: text in, text out. Quint gives developers explicit control over what a button sends to the model, what the user sees locally, and where that content appears. Provider-agnostic, and it runs without any LLM at all.

Role: Solo. Library, docs, and demo apps.
Stack: TypeScript, React, tsup. Peer dependency on React 16.8+
Shipped: v0.1.0 on npm, MIT license
Demo: Try the live demo
Code: GitHub, npm

The problem

In a standard chat UI, a multiple-choice question has two bad options. Show the answers immediately and you spoil the question. Hide feedback at the bottom of the thread and you break spatial context.

Roleplay branches have the same issue. A choice should open a local description under the button that caused it, not dump another paragraph into an endless scroll. The model input and the user-visible reveal are often different things, but most chat components treat every click as raw text.

Quint is the layer between your conversation history and your UI. You already own model calls, retries, and rate limits. Quint owns how a decision becomes a structured choice and a localized reveal.

API design

The surface is small on purpose. A Block holds content and an array of Choice objects. Each choice declares directionality and reveal routing explicitly.

out. Reveals pre-supplied hiddenContent only. No LLM request.
in. Sends structured inputData to your handler. Response lands in the main chat stream.
in-n-out. Both: local reveal plus model input, for tutoring hints or branching scenes.
Reveal routing. reveal: true anchors content in a collapsible container under the button. reveal: false keeps it in the global stream.

Minimal usage

import { QuintProvider, QuintRenderer, useAddBlock } from '@itsm0rty/quint';

function App() {
  const addBlock = useAddBlock();
  React.useEffect(() => {
    addBlock({
      blockId: 'q1',
      content: 'What is 2 + 2?',
      choices: [
        { choiceId: 'a', label: 'A) 3', directionality: 'out',
          reveal: true, hiddenContent: 'Incorrect.' },
        { choiceId: 'b', label: 'B) 4', directionality: 'out',
          reveal: true, hiddenContent: 'Correct!' },
      ],
    });
  }, [addBlock]);
  return <QuintProvider><QuintRenderer /></QuintProvider>;
}

Core state lives in src/core. React bindings export QuintProvider, QuintRenderer, BlockRenderer, ChoiceButton, and RevealContainer, plus hooks like useAddBlock and useUpdateRevealContent for LLM-filled reveals.

What Quint is not

Scope by exclusion.

Boundary

Not a chat framework, not an AI SDK

Quint does not manage conversation history, call models, run RAG, or route tools. It is not an agent runtime. Those stay in your app. Quint only structures how a user action becomes input and how feedback appears in the layout.

That narrow scope is why it ships with zero runtime dependencies beyond React itself, and why MCQs can use directionality: 'out' with hiddenContent for deterministic feedback with no extra token spend.

Demos

Three provider integrations, not part of the package

The demo/ folder has self-contained apps for Gemini, OpenAI, and Claude. Each shows how to wire onChoiceActivated to a provider and push generated text into a reveal with useUpdateRevealContent. They need API keys and are reference only, not published to npm.

Limits, stated plainly

Version 0.1.0 is in a 0.x phase. Minor releases may include breaking API changes. No hard stability guarantee yet.
Invalid configurations surface as runtime warnings in development, not compile-time errors. Production apps need their own validation if they want hard failures.
Buttons and reveals are the v1 surface. Forms exist in src/react/forms but the public API story is still choice-and-reveal first.

Next case study Flamide →