DEVOURED
Crafted Primitives for AI-native Interfaces (Website)
Beautiful UI is a new library of copy-paste components designed specifically for the unique UX requirements of AI-native applications.
What: The library includes 20 specialized primitives for AI interfaces, such as streaming text responses, 'thinking' process traces, human-in-the-loop approval cards, and diff tables for AI-generated edits. All components are provided under an MIT license.
Why it matters: Developers are struggling to display non-deterministic or multi-step AI outputs; standardized component libraries like MUI or Tailwind UI lack primitives for things like streaming reasoning steps or agentic approvals.
Takeaway: If you are building an AI interface, use these components to handle common agent UX patterns rather than building them from scratch.
Deep dive
- Loading States: Pixel-grid shimmer and elapsed time indicators.
- Thinking: Expandable UI traces to show agent reasoning.
- Human-in-the-Loop: Approval cards for controlling agent actions.
- Data Presentation: Diff tables to visualize AI-suggested changes.
Decoder
- Human-in-the-loop: A system design where a human must review or approve an AI's proposed action before it executes.
Original article
Loading State
Pixel-grid loader with shimmer and elapsed time.
Thinking
Expandable traces — steps, reasoning, search, coding.
Streaming Text
Streamed answer with inline sources, actions, and follow-ups.
Sources: Scoop Data, Trends Index, Market Basket.
Follow-ups: Which flavors sell best in winter, Compare gelato and soft serve margins.
Approval Card
Human-in-the-loop questions the agent asks before acting.
Tool Chips
Code edits and tool calls as compact chips.
Task Rows
Live agent task status — running, failed, completed.
Chat
Tabbed chat panel with reasoning replies and a composer.
Prompt Bar
Composer with @ sources, / commands, model picker, and dictation.
Recommendation Card
Agent suggestion with a confidence meter and actions.
Want me to place this restock order? Reorder waffle cones from cone_king with lead time 7_days.
Context Cards
Retrieved knowledge chunks with their sources.
Cold-chain certification must be verified before a new dairy can be added to the reorder workflow.
Q4 velocity table: pistachio +18%, vanilla +6%, rocky road -11%; retire flavors below 40 scoops weekly.
Diff Table
AI-proposed edits sweeping through tabular data.
| Flavor | Category | Supplier |
|---|---|---|
| Rocky Road | Classic | aurora-scoops |
| Bubblegum | Retro | kumo-creamery |
| Mint Chip | Classic | maple-orbit |
| Pistachio | Seasonal | maple-orbit |
Records Table
CRM-style grid with tags, sorting, and relationship status.
| Company | Categories | Last interaction | Connection strength | Links |
|---|---|---|---|---|
| Alpine Churn — Zürich | B2B, Gelato, Wholesale | 4 days ago | Very strong | alpine-churn.example.com |
| Amber Scoop — Prague | Gelato, B2B | over 1 year ago | No communication | — |
| Andes Snow Creamery — Quito | Gelato, Catering | almost 2 years ago | Very weak | — |
| Apricot Atlas — Algiers | Sorbet, Imports | 11 months ago | Very weak | apricot-atlas.example.com |
| Aurora Scoops — Reykjavík | Gelato, Seasonal | 9 days ago | Very strong | aurora-scoops.example.com |
| Baltic Berry — Tallinn | Dairy-free, Seasonal, B2C | 5 weeks ago | Weak | baltic-berry.example.com |
| Black Sesame Social — Bandung | Vegan, Cafe, B2C | 9 days ago | Very strong | black-sesame.example.com |
| Blue Fig Gelato — Florence | Gelato, Cafe | over 1 year ago | Very weak | blue-fig.example.com |
| Boreal Batch — Yellowknife | Dairy-free, Local, Seasonal | 8 days ago | Very strong | boreal-batch.example.com |
| Cacao Norte — Oaxaca | B2B, Local, Wholesale | about 2 years ago | No communication | cacao-norte.example.com |
| Cape Vanilla Co. — Cape Town | Wholesale, Imports | over 1 year ago | Very weak | cape-vanilla.example.com |
| Cedar Spoon — Beirut | Cafe, Local, Seasonal | 6 days ago | Very strong | cedar-spoon.example.com |
| Cloudberry Cone — Helsinki | Dairy-free, Seasonal | No contact | No communication | cloudberry-cone.example.com |
| Coconut Commons — Manila | Vegan, B2C, Cafe | 24 days ago | Weak | coconut-commons.example.com |
| Copper Cone — Melbourne | Gelato, Cafe, B2C | about 1 month ago | Weak | copper-cone.example.com |
| Coral Coast Sorbet — Honolulu | Sorbet, Local | 9 days ago | Very strong | coral-coast.example.com |
| Crimson Clover — Brussels | Gelato, Wholesale, Catering | 2 months ago | Weak | crimson-clover.example.com |
| Delta Dairy Works — New Orleans | B2B, Wholesale, Local | 2 days ago | Very strong | delta-dairy.example.com |
| Dolomite Dairy — Bolzano | Gelato, Wholesale | 3 days ago | Very strong | dolomite-dairy.example.com |
| Dragonfruit Dock — Shenzhen | Sorbet, B2B, Wholesale | No contact | No communication | — |
| Ember Cone Company — Seoul | B2C, Vegan | 15 days ago | Weak | ember-cone.example.com |
| Equator Cream — Kampala | B2B, Catering, Local | 10 months ago | Very weak | equator-cream.example.com |
| Fjord Fizz Ice — Oslo | Dairy-free, Seasonal | No contact | No communication | — |
| Glacier Grove — Anchorage | Seasonal, Local, Catering | 7 weeks ago | Weak | glacier-grove.example.com |
| Hibiscus House — Accra | Sorbet, Cafe | 6 weeks ago | Weak | hibiscus-house.example.com |
| Juniper & Cream — Vancouver | Dairy-free, Catering | No contact | No communication | — |
| Kumo Creamery — Tokyo | B2C, Cafe, Vegan | 3 weeks ago | Very strong | kumo-creamery.example.com |
| Lagoon Ladle — Venice | Gelato, Seasonal, Catering | 7 days ago | Very strong | lagoon-ladle.example.com |
| Lotus Leaf Scoops — Hanoi | Vegan, Cafe | 15 days ago | Weak | — |
| Lumen Soft Serve — Copenhagen | Dairy-free, Cafe | 8 months ago | Weak | lumen-soft-serve.example.com |
| Mango Moon Gelato — Nairobi | Sorbet, Vegan | almost 2 years ago | Very weak | mango-moon.example.com |
| Maple Orbit — Montréal | B2B, Wholesale, Seasonal | 15 days ago | Weak | maple-orbit.example.com |
| Midnight Milk — Tromsø | Dairy-free, Vegan, Wholesale | No contact | No communication | — |
| Mint Medina — Tunis | Dairy-free, Vegan, Local | No contact | No communication | — |
| Monsoon Mango — Mumbai | Sorbet, Vegan, Catering | 18 days ago | Weak | monsoon-mango.example.com |
| Mooncake Ice Cream — Singapore | B2B, Wholesale | about 1 month ago | Very weak | mooncake-ice-cream.example.com |
| Nomad Nougat — Ulaanbaatar | Imports, B2B | almost 2 years ago | No communication | nomad-nougat.example.com |
| Olive Snow — Athens | Gelato, Cafe, Local | 4 days ago | Very strong | olive-snow.example.com |
| Orchard Cloud — Lyon | Gelato, Seasonal, Cafe | 5 days ago | Very strong | orchard-cloud.example.com |
| Pacific Pear — Valparaíso | Sorbet, Seasonal | 2 months ago | Weak | pacific-pear.example.com |
| Palm Sugar Creamery — Bangkok | B2C, Vegan | 3 months ago | Very weak | palm-sugar.example.com |
| Pampa Creamery — Córdoba | B2C, Local | 12 months ago | Very weak | pampa-creamery.example.com |
| Pine & Pistachio — Istanbul | Gelato, Catering | about 1 month ago | Very weak | — |
| Quartz Cone — Denver | B2C, Wholesale | 10 days ago | Very strong | quartz-cone.example.com |
| Red Lantern Creamery — Taipei | Cafe, Vegan | about 1 month ago | Weak | red-lantern.example.com |
| Rosewater Kulfi — Jaipur | B2C, Seasonal | 2 months ago | Very weak | — |
| Saffron Sky Kulfi — Dubai | Imports, Catering | almost 2 years ago | Very weak | saffron-sky.example.com |
| Sahara Swirl — Marrakech | Sorbet, Local | 5 months ago | Very weak | — |
| Salt & Silk — Muscat | Imports, Catering, Gelato | 8 months ago | Very weak | salt-and-silk.example.com |
| Silk Road Sorbet — Tbilisi | Sorbet, Imports | about 1 month ago | Weak | silk-road.example.com |
| Sol y Nieve — Buenos Aires | Gelato, Local | 2 months ago | Weak | sol-y-nieve.example.com |
| Sunbird Gelateria — Lisbon | Gelato, Cafe | over 2 years ago | No communication | sunbird.example.com |
| Tamarind Tide — Chennai | Vegan, Sorbet, B2C | 9 months ago | Very weak | tamarind-tide.example.com |
| Tasman Sea Gelato — Hobart | Gelato, Local | 2 months ago | Weak | tasman-sea.example.com |
| Tropic Churn — San Juan | Sorbet, Local, B2C | 6 days ago | Very strong | tropic-churn.example.com |
| Umber Cream — Warsaw | B2B, Wholesale, Cafe | 5 weeks ago | Weak | umber-cream.example.com |
| Vanilla Vale — Antananarivo | Imports, Local | No contact | No communication | — |
| Willow Whip — Portland | Dairy-free, Vegan, Cafe | 3 days ago | Very strong | willow-whip.example.com |
| Yuzu Yard — Kyoto | Sorbet, Cafe, Seasonal | 11 days ago | Very strong | yuzu-yard.example.com |
| Zenith Gelato — Auckland | Gelato, Seasonal | 3 weeks ago | Weak | zenith-gelato.example.com |
Filter Table
Status chips that reorganize live data.
Sidebar Nav
Workspace navigation with quick search.
Search
Command search with live filtering and an empty state.
Flowchart
Workflow trigger and condition steps on a dotted canvas.
Insight Cards
Paged agent insights with scrub-ready live charts.
Code Block
Agent-written code streaming in line by line.
churn.tsFine-tune Card
The agent adjusts design properties in an inspector.
Selection Actions
Highlight a passage and hand it to the agent to rewrite.
Pistachio holds the top slot all weekend. Churn it first thing Saturday so the batch has time to firm up before the afternoon rush.
Explore all 72 articles in today's digest
Fresh dev news, AI-digested daily. Never miss a trend at devoured.fyi