← all components

Ask & retrieval

The front door, and everything that happens after you press enter. The design argument running through this whole category is that governance should be visible: lens injection is staged as a real pipeline step, every figure carries its source, and the footer states what the query actually cost.

00

The command bar

One input, reachable from anywhere with /, that slides from the centre of the screen to a docked position once an answer exists. The transition runs over 900ms — slow on purpose, because it is the app's one moment of theatre and a fast version reads as a page swap.

Brand lockup
Only present in the idle state. A 200-weight display face at 42px with a 44px accent text-shadow behind it, over a two-line tagline that states the two visual rules the whole product runs on: depth is age, brightness is what still matters.
ui/src/views/Ask.tsx · .ask-brand
Idle

Scry the Well

Ask, and retrieval lights the field. Depth is age; brightness is what still matters.

Command bar
A 680px pill with a search glyph, a 300-weight 17px input, and an enter badge that becomes an ellipsis while a query is in flight. Focus adds an accent border plus a radial glow rising from below the bar; the busy state pulses that glow on a 1.1s loop.
ui/src/views/Ask.tsx · ui/src/styles/views/ask.css
Idle
Filled
Busy · descending
Suggestion chips
Five seeded questions under the idle bar. They are chosen to teach the retrieval model rather than to look impressive: one about a figure's provenance, one about staleness, one about cost, one about scope, one about which lenses fire.
ui/src/views/Ask.tsx · SUGGESTIONS
All five
01

The descent

Submitting a question does not spin a loader. It narrates the retrieval pipeline stage by stage — compartment matching, lens injection, facet pre-filter, dense-plus-sparse retrieval with reciprocal rank fusion, synthesis — at 210ms per stage. The point is to make the governance layer legible: lens injection reads as a step, not an afterthought.

Descent rings
Three accent hairline circles on a 2.1s loop, staggered 450ms apart, each scaling from 0.32 to 1.25 while translating downward 54px. The illusion is a stone dropping through water. The whole thing is three empty spans and one keyframe.
ui/src/styles/views/ask.css · @keyframes descend
Animating
Descent stages
Five mono lines that light in sequence. Unlit sits at 0.35 opacity with a faint dot; lit is full opacity with an accent dot carrying a 10px glow. The list is aria-live="polite", so a screen reader hears the pipeline rather than silence.
ui/src/views/Ask.tsx · DESCENT_STAGES
Stage 1 of 5
  1. matching compartments
  2. injecting compulsory lenses
  3. facet pre-filter · classification
  4. dense + sparse retrieval · RRF
  5. synthesising brief
Stage 4 of 5
  1. matching compartments
  2. injecting compulsory lenses
  3. facet pre-filter · classification
  4. dense + sparse retrieval · RRF
  5. synthesising brief
02

The brief

Not a chat bubble. A synthesised document with a falsifiable headline, prose whose every number is marked and sourced, the lenses that governed it stated at the top, the questions it could not close stated at the bottom, and its own cost in the footer.

Brief headline
A 500-weight display line capped at 46 characters of measure, under a "Synthesised brief" eyebrow. Written as a claim someone could disagree with rather than a topic label — which is the difference between a brief and a search-results page.
ui/src/views/Ask.tsx · .brief-head
Headline
Synthesised brief

The 71% figure is a single-cohort read from one quarter, and it has been quoted since as if it were the account-wide rate.

🔶
LensChip
An amber badge with a glowing dot, and a 260px hover card carrying the lens's one-line enforceable rule. The badge is a receipt, not a toggle — a compulsory lens was injected by the serving core and cannot be turned off from here. A passive lens gets an extra opt marker.
ui/src/components/LensChip.tsx
Compulsory
Provenancecompulsory · injectedEvery figure cites a source and a date, or it is presented as an estimate.
Passive
Trajectoryoptpassive lensReport whether the thing advanced, stalled, or reversed — not just its current state.
Rule visible (hover state, forced)
Cost lenscompulsory · injectedAny conclusion with a spend implication must state the figure, the cadence, and who approves it.
Lens row
Every lens that fired, followed by a right-aligned mono note counting the compulsory ones and naming who injected them. The sentence is deliberate: "injected by the serving core", not "applied" — it says the enforcement happened at the data plane, not in a prompt.
ui/src/views/Ask.tsx · .brief-lenses
Four fired, three compulsory
ProvenanceStalenessClient-facing toneTrajectoryopt3 compulsory · injected by the serving core
Figure mark
Every precise number in a brief is wrapped in a <mark>: tabular-nums, 650 weight, a dotted accent underline, a 22px glow, and a hover note giving the figure its context. It is the Provenance lens rendered as typography — a number that is not marked is not sourced.
ui/src/views/Ask.tsx · mark.fig
In prose

The number originates in a single retention read taken on 2024-11-21, covering the cohort that renewed inside the pilot window only — 71.4% across n=138.

Note revealed (hover state, forced)

…taken on 2024-11-21the only source that computes it.

Entity mention
Entity names inside the prose are buttons, not links: clicking one navigates to the Constellation with ?focus=<id>, which makes that node pulse for several seconds so you can find it without hunting. Styled as a hairline underline that turns accent on hover — deliberately quieter than a link, because a paragraph with six of them should still read as prose.
ui/src/views/Ask.tsx · button.ent
Inline

put it in the playbook deck the same week, and the account has since grown past the population the pilot sampled.

Open questions block
A violet-washed panel under the prose: what the Well wanted answered and could not close from the material it had. This is the mechanism meant to stop agents re-asking settled questions — and to make an unsettled one visible instead of quietly absent.
ui/src/views/Ask.tsx · .brief-questions
Two open
Questions the Well wants answered
  • Is the account-wide retention rate ever going to be computed, or is the pilot cohort the standing definition?
  • Does the Apr 2025 renewal restructure invalidate the comparison, or just narrow it?
Σ
Brief footer
Atoms scanned, atoms cited, latency in milliseconds, entities lit — the design's "explainability as beauty" line, made checkable. Next to it, a button that carries the lit entity set straight into the Constellation.
ui/src/views/Ask.tsx · .brief-foot
Answered
1,611 atoms scanned · 4 cited · 214ms · 3 entities lit
03

Provenance

Collapsed by default, because a brief should read clean. Expanding a chip gives the source's kind, date, facets, the exact quoted passage, and a permalink. This is the chain the whole architecture is built to preserve: claim → chunk → item → thread → source → permalink.

Provenance strip
One chip per citation, each carrying a connector-coloured dot, the source kind, its date and its retrieval score out of 100. Nine connector hues are defined (slack, drive, transcript, asana, journal, capture, email, pondo, registry), so the mix of a brief's sources is readable before you open anything.
ui/src/components/Provenance.tsx
Collapsed
provenance
One chip open
provenance
driveNov 21, 2024client/steadystarsbizinternal
Pilot cohort retention lands at 71.4% (n=138) against a 64% target. Caveat for the deck: this is the pilot window only.
well://source/S-028#chunk-4
🔒
Classification badge
Four values, constrained at the database level, and the one facet that actually drives access control: Postgres row-level security keys on this column directly. An authenticated role can read public and internal only — confidential and private rows are refused at the row level, not filtered by application code.
ui/src/styles/components/provenance.css · .prov-class
All four
publicinternalconfidentialprivate
04

Recent queries

Below the fold on the idle view and tightened once an answer is up. Each row re-runs its query in one click, and carries the lenses that fired on it last time — so the history is a record of which standards the Well applied, not just what was typed.

Recent list
Full-width rows on hairline rules. Hover shifts the row's left padding by 4px and washes it accent — a small physical cue that the whole row is the target, not the text. The query truncates with an ellipsis; the meta cluster never shrinks.
ui/src/views/Ask.tsx · .recent-list
Populated
Long query · truncated