B
dprvda/beamline
AccordionaccordionTopics that open in place, one at a time or several: FAQs and settings sections; each header is a button (with an optional fact at its end), and the panel's height follows its content and can be reversed mid-way. (Beamline complete system)
Activity heatmapactivity-heatmapA calendar of daily counts, one cell per day on a sequential ramp: weeks across, weekdays down, month and weekday labels, a legend scale, hatched days that were never recorded, and a keyboard grid that reads each day's date and value. (Beamline complete system)
AlertalertA message that stays until it is dealt with: what happened, what to do, an action; danger and warning are announced; dismissing folds its height away.
Alert Dialogalert-dialogA blocking confirmation that must be answered: the scrim does not dismiss it, focus starts on the safe choice, and an async action keeps it open until the work finishes.
Allocation editorallocation-editorParts of a fixed whole edited as transfers: an ordered strip whose boundaries drag or step between neighbours and a roster of exact amounts where typing names the part that gives or takes; locks, limits and your rules refuse with words, nothing is redistributed out of sight, and Save waits for your handler. (Beamline complete system)
Announcement barannouncement-barA banner across the top for news and offers: messages take turns, a countdown ticks, and dismissing folds it away and can remember it. (Beamline complete system)
Answer compareanswer-compareTwo answers to the same prompt side by side, and a person's verdict: A is better, a tie, B is better, or both are bad, with the reasons that decided it. Answers stream in their own columns with time, tokens and cost under each; in a blind test the models stay hidden behind A and B until the verdict, then turn over to show who wrote what. Narrow rooms switch between the two instead of squeezing them. (Beamline complete system)
App shellapp-shellThe frame for every app screen: collapsible sidebar with grouped navigation, top bar and page. (Beamline complete system)
Approval cardapproval-cardThe agent stops and asks before it acts: what it wants to do, exactly what that changes, any choices it needs, and Approve or Reject; both run your callbacks with progress, a refusal says why with Retry, and a settled card folds to one line of record. (Beamline complete system)
Area chartarea-chartAmounts over time as filled areas: overlapping, stacked or as shares of 100%, five fills, two strokes, five curves, a range handle; gaps for missing values, a legend that toggles series and a table view of every number. (Beamline complete system)
Aspect ratioaspect-ratioHolds media, video and embeds at a fixed width-to-height ratio while the layout resizes. (Beamline complete system)
AttachmentattachmentA file tile: preview or typed glyph with the type named, name, size, upload progress, error with retry, and a keyboard-reachable remove. (Beamline complete system)
Audio playeraudio-playerOne audio element and its controls: play with a loading state, a scrub bar with time, skip, speed and a playlist whose rows play into the same player. Use the ready layouts or compose the parts. (Beamline complete system)
Availability rule editoravailability-rule-editorWhen someone (or something) can be booked: hours for each day of the week, one or more ranges a day, a day turned off, a day's hours copied to the others in one step, the time zone they are in, and exceptions for particular dates (a holiday off, a Saturday on). A week strip draws the hours at a glance, a sentence says them back, and overlapping or reversed ranges are said in words where they are. (Beamline complete system)
AvataravatarA person or account in a small space: a photo, or initials on the hue their name always gets; presence dot; circle for people, square for companies.
Avatar groupavatar-groupA team in a small space: overlapping faces that name themselves on hover or focus, and “+N” naming the rest. (Beamline complete system)
BadgebadgeA short status, category or count label: six tones, an icon or a status dot, two sizes.
Bar chartbar-chartAmounts by category as bars: columns or rows, grouped, stacked or as shares, reference lines, five looks (rounded, cells, trace, isometric, monospace), a header readout and a highlighted bar, on one data API; a missing value is a stub in its slot, never a zero bar. (Beamline complete system)
Bar listbar-listRanked horizontal bars, label and value over a meter, one line per row when there is room — top pages, sources, customers. (Beamline complete system)
Bar visualizerbar-visualizerA row of bars that says what a voice agent is doing: a sweep while connecting, the person's voice while listening, a slow breath while thinking, the agent's voice while talking. Bars move only while there is something to show. (Beamline complete system)
BezelbezelA double-bezel frame: an outer shell with a hairline, a small gap, and an inset panel with its own edge, so a preview, chart or media reads as set into the surface. (Beamline complete system)
Bottom sheetbottom-sheetA phone panel that rests at a peek and follows the finger to full height; a flick down closes it, and the handle works from the keyboard.
BreadcrumbbreadcrumbWhere a page sits and the way back up; it shows as many levels as its room holds and folds the ones nearest the top into a menu. (Beamline complete system)
ButtonbuttonThe action control: five weights and a brand fill, a buy/sell tone, sm/md/lg and a 44 px touch size, icon-only, a loading state that keeps its size and focus, and a label that changes in place.
CalendarcalendarMonth grids for picking a day or a range: a real grid with arrows by day and week, Page keys by month, closed days, today's dot, and a range span that follows the pointer. (Beamline complete system)
Call gridcall-gridThe people on a video call, laid out for the room they are given: tiles as large as the space allows at the camera's shape, or the person talking (or a shared screen, or whoever you pin) large with everyone else in a strip; a ring that follows whoever is speaking, muted microphones, raised hands and weak connections said in words, a face when the camera is off, and the rest folded into "+N" when there are more people than room. (Beamline complete system)
CardcardA record or a small group of related content and actions: optional media, avatar, title, status, action, meta, free content and a Details toggle; plain or double-bezel frame. (Beamline complete system)
Card fieldcard-fieldA payment card in one field: the number groups as it is typed and names its network, the expiry and security code follow on their own as each part completes, the number is checked (length and checksum) and the expiry must be in the future; when it is complete and you move on, the number folds to its last four digits. (Beamline complete system)
CarouselcarouselA row of slides that snap into place: swipe on touch, drag or the arrows with a mouse, ← → when focused, or the dots; optional autoplay that pauses and has a pause button. (Beamline complete system)
Category barcategory-barOne bar split into labelled ranges with an optional marker that names its range. (Beamline complete system)
Chat threadchat-threadPeople talking to people: messages grouped by person and day, reactions, delivery and read receipts that glide to the newest message read, who is typing, and a composer with files; it scrolls on the same scroller as the agent conversation. (Beamline complete system)
CheckboxcheckboxA yes/no choice with an optional label and help, including the mixed state for select-all; the check draws itself in. (Beamline complete system)
Chip groupchip-groupQuick filters as chips: a chosen chip fills and grows a check, counts show what each would return, and extra chips fold behind “+N”. (Beamline complete system)
CitationscitationsInline numbered citations that preview their source on hover or focus, plus a numbered source list; streamed answers flow in at an even pace with the list waiting for the end. (Beamline complete system)
Code blockcode-blockCode to read and copy: highlighted in the system's colours, numbered, marked lines, long files folded behind “Show all”. (Beamline complete system)
CollapsiblecollapsibleOne region that opens and closes in place from its trigger, its height animating to the content. (Beamline complete system)
Color Palettecolor-paletteA wheel of preset colours to pick from: twelve hues around the ring, their tints inward, white at the middle; the chosen swatch lifts and carries a check. (Beamline complete system)
Colour pickercolor-pickerA swatch that opens a picker: saturation-brightness plane, hue strip, HEX/RGB/HSL/OKLCH value to type or copy, the screen eyedropper where available, saved colours and the contrast on its background. (Beamline complete system)
ComboboxcomboboxOne value from a long list found by typing (time zones, countries, customers): ranked matches with the match emphasised, keywords, optional group headings, clearable; the field keeps focus, and below 640 px the list opens as a bottom sheet with its own search.
Command menucommand-menuSearch-first list of every action: ranked matching, groups, keycap shortcuts and nested pages; inline as CommandPalette or in a ⌘K dialog as CommandMenu. (Beamline complete system)
Comment threadcomment-threadA discussion attached to something: replies, reactions, @mentions, editing and deleting your own, resolve that folds the thread. (Beamline complete system)
Composed chartcomposed-chartDifferent measures on one time axis: bars, lines and areas per series, a left and a right value axis with their own formats, and reference lines. (Beamline complete system)
Confirm morphconfirm-morphA destructive action that asks in place: the button morphs into its question, then into working, then into the result with Undo or Retry, without a dialog. (Beamline complete system)
Context cardscontext-cardsThe knowledge an agent retrieved before it answered: one card per chunk with what it is about, the text it read with the search words marked, how relevant it was and where it came from, filterable by source; optionally each chunk can be left out of the next answer. (Beamline complete system)
Context menucontext-menuActions for an object on right-click, long-press, Shift+F10 or the menu key, opened at the pointer, with the same rows as the dropdown menu. (Beamline complete system)
ConversationconversationThe scrolling column of a conversation: follows new content while you are at the bottom, stops when you scroll up to read, and offers a way back; shared by the agent conversation and the people chat. (Beamline complete system)
Conversation barconversation-barThe control bar of a voice call with an agent: one button to call and hang up, the agent's state as bars, a call timer, mute, and typing when talking is not an option. Works with any provider through one adapter, or with a session shared by the rest of the screen. (Beamline complete system)
Cookie consentcookie-consentAsks once which cookies a visitor allows, with Reject all and Accept all given equal weight; Customise grows the notice in place into each category with its switch, purpose and the cookies behind it; the choice is remembered (and asked again when your policy changes), and a browser's Global Privacy Control keeps marketing off. (Beamline complete system)
Copy buttoncopy-buttonCopies a value and confirms in place: the icon becomes a check and the label says Copied; a refused copy says so instead of pretending.
Creditcredit"Designed with Beamline" for a site's footer: the Beamline mark and a quiet line, or a small badge. With your referral code, a team's first purchase through it earns you 30% as Beamline credit.
Data griddata-gridVirtualised grid for thousands of rows: multi-sort, search and value filters, resizable and pinnable columns, range selection, inline edit, footer aggregates, keyboard cell navigation. (Beamline complete system)
Date pickerdate-pickerOne date in a form: a field that opens the month grid under it with focus inside, picks and closes; Today and Clear below, optional clear button. (Beamline complete system)
Date range pickerdate-range-pickerA reporting range: presets on one side and two months on the other (one on a phone); the trigger names the preset in use, and the footer counts the days. (Beamline complete system)
Depth chartdepth-chartCumulative bid and ask depth as stepped areas around the mid, with hover readout. (Beamline complete system)
Description listdescription-listThe details of one record as label and value pairs: beside each other or stacked, in as many columns as the room holds; a copy button arrives on the row you point at, long values fold behind Show more, a value that changes lights once, and a value never recorded is hatched, never blank or zero. (Beamline complete system)
DialogdialogA focused task over the page (create, invite, rename) with a title, body and footer; focus moves in, is trapped and returns on close.
Diff tablediff-tableProposed edits to a table before they happen: new rows green, removals struck through, changed cells old → new; each change can be left out and Apply runs the rest. (Beamline complete system)
DirectiondirectionSets left-to-right or right-to-left for everything inside: text and logical spacing flip, and Radix parts read the direction for keys and placement. (Beamline complete system)
Dropdown menudropdown-menuA list of actions behind a trigger, with shortcuts, check items, headings and submenus; one highlight glides under the pointer and jumps with the keyboard.
Empty stateempty-stateWhat a place will hold and the first step to fill it, instead of a blank; a compact size for panels and filtered tables. (Beamline complete system)
Event calendarevent-calendarA schedule of events by day, week or month: events that overlap sit side by side, drag one to another time or day or pull its bottom edge to change its length (or grab it with Space and use the arrows), drag across empty time to make a new one; a line marks now, and a narrow room shows three days or a month of dots with the chosen day's list. (Beamline complete system)
Expandable cardexpandable-cardA dense card that grows in place when asked: the frame resizes and the clamped preview opens into the full text. (Beamline complete system)
File difffile-diffA change to one file as a unified diff: line numbers, tinted lines, only the changed words marked, long unchanged stretches folded; give rows or just before and after. (Beamline complete system)
File drop zonefile-dropzoneA generous target for files: drop or choose, each checked against type, size and count with the reason when turned away; uploads show progress and can be cancelled or retried. (Beamline complete system)
Filter toolbarfilter-toolbarThe filters on a list kept in view: chips that remove themselves, Add filter with fields and their values, Clear all, and room for search or view controls. (Beamline complete system)
FlowchartflowchartA workflow as steps on a dotted canvas: a trigger, conditions that branch into paths side by side, actions and waits, read top to bottom; during a run each step shows its status, and the whole flow is one keyboard stop walked with the arrows. (Beamline complete system)
FormformValidation wiring for react-hook-form (and zod) on the system's own fields: each field already links its label, help and error, so FormField hands over the value and the message. (Beamline complete system)
Funding countdownfunding-countdownPerpetual funding rate with who pays, and a live countdown ring to the next funding. (Beamline complete system)
Funnel chartfunnel-chartPeople or deals moving through ordered steps, each step a bar narrowing from the first: the part lost between two steps stays beside the next as a fading ghost with its count, the step's conversion and the conversion from the start read between them, a previous period shows as a mark on each bar with its change, and a step never measured is hatched rather than read as zero. (Beamline complete system)
Gantt chartgantt-chartA plan as bars on a timeline: tasks grouped down the side, each bar from its start to its end with its progress, milestones as diamonds, arrows from each task to the ones waiting on it (red, with the reason, when a task starts before what it waits on ends), a line at today and a day, week or month scale; drag a bar or its end, or grab it with Space and walk it with the arrows. (Beamline complete system)
GaugegaugeOne value against a known range: a semicircle, a 270° dial or a full ring, filled or with a needle, coloured bands with their names (healthy, busy, saturated), an optional target tick, the value large in the middle, and a meter that assistive technology reads. (Beamline complete system)
Geo mapgeo-mapValues by country as a choropleth on the system's own world outline (no map service): classes from a sequential or diverging ramp with a legend you can point at to light one class, sized points for places, a ranked list beside it that previews and pins a country, a click that zooms to it, and countries never measured hatched; the outline loads only when a map is on screen. (Beamline complete system)
GlowglowAmbient light around one element that says something is happening: an aurora under a working composer, or a ring of light round a live card. (Beamline complete system)
Halftone Dotshalftone-dotsA picture rebuilt as a field of dots whose size follows brightness; a new picture morphs the dots, a click ripples through, the pointer pushes dots aside. (Beamline complete system)
Hold to confirmhold-to-confirmConfirms a costly action by holding instead of clicking: a fill sweeps across while held and drains if let go early; pointer, touch, Space and Enter all hold.
Hover cardhover-cardA preview of a person, link or record on hover or keyboard focus, without leaving the page; HoverCardProfile is the standard person preview. (Beamline complete system)
Image compareimage-compareTwo images in one frame with a divider: drag anywhere, or arrow keys on the handle; horizontal or vertical, with captions. (Beamline complete system)
Image cropperimage-cropperFrame a picture before it is saved: a fixed window (square, round for avatars, wide for covers, or free with handles) over the picture, which you drag, zoom with the slider, wheel or a pinch, and turn a quarter at a time; it always covers the window, thirds lines show while you move it, and the arrow keys, + and − and R do the same from the keyboard. cropImage turns the result into a file. (Beamline complete system)
Image generationimage-generationThe frame an AI image is generated into: a field of brand-hued pixels breathes with the progress while the model works, then the image arrives — sharpening from coarse blocks, sweeping in or fading — and a refusal says why. (Beamline complete system)
Import mappingimport-mappingMap the columns of a file to the fields of one record type, see what every value becomes, then run the import and get an outcome for each row: suggestions are hints until accepted, ambiguous dates are named, and only failed rows are retried. (Beamline complete system)
Inbox listinbox-listConversations waiting for a person, triaged in place: sender, subject and the first words, time, unread weight, star, labels and attachments, grouped by day; tick several for Archive, Mark read and Delete in a bar that grows over the header, or act on one from its row (hover, keyboard or a swipe on touch). Archived rows close up with Undo in their place. (Beamline complete system)
Inline editinline-editText that becomes a field in the same place: Enter (or ⌘Enter when multiline) saves, Escape cancels, leaving saves; saving shows progress and a refusal keeps the edit with the reason. (Beamline complete system)
InputinputA single-line text field with its label, help and error wired for assistive tech, three sizes and adornments.
Input Dissolveinput-dissolveA one-line field whose text breaks into specks and drifts off once it is sent, last letter first; the field is empty and ready again. (Beamline complete system)
Insight cardsinsight-cardsFindings from an agent, one per page: the sentence, the series it is about with their change, a chart to scrub that names each point, and a follow-up question. (Beamline complete system)
ItemitemThe generic list row: media, title, description, meta and trailing actions; becomes a link or button when interactive.
JSON diff viewerjson-diff-viewerTwo versions of a JSON value compared as one tree: added keys marked +, removed ones struck through with −, changed values read old → new, unchanged keys folded into a count you can open; array items are matched by their id (not their place) so a reorder is not a hundred changes, a summary counts each kind, and the next and previous change are one key away; only the rows in view are drawn. (Beamline complete system)
JSON viewerjson-viewerA JSON value as a tree you can read and walk: branches open and close (one level, or all at once), closed ones preview what they hold, every value reads by its type, search marks and opens its way to each match, any row copies its path or its value, and values that change light once; only the rows in view are drawn. (Beamline complete system)
Kanban boardkanban-boardWork as cards in columns by stage: drag a card (or lift it with Space and walk it with the arrows) to another column or place, the cards around it make room as it travels; columns keep work-in-progress limits that warn or refuse, fold into a narrow rail, and swipe one by one in a narrow room. (Beamline complete system)
KbdkbdKeyboard keys as keycaps, for combinations and sequences (G then A); `mod` resolves to ⌘ or Ctrl per platform, symbols are spoken as words. (Beamline complete system)
LabellabelThe text label tied to a form control, with a required marker that screen readers announce.
Light bandlight-bandA band of split light in the dark behind a section, blue at one end and amber at the other with a bright core: Prism's light at a chosen place, a hero, the plan you sell or the closing call to action. Drawn live by default: it turns slowly in depth like a ribbon and its spectrum flows, more while the page moves; it moves at its own depth as its section passes, and a pulse of light runs along it while the page scrolls. Without WebGL, on a light page or under reduced motion it is the painted band. Draws only on screen. (Beamline complete system)
LightboxlightboxA full-screen image viewer: a thumbnail grows into it and shrinks back, arrows and ←/→ step through the set, Esc or a downward drag closes it. (Beamline complete system)
Line chartline-chartValues over time as lines: curves, point markers, dashed series for forecasts, reference lines for limits and targets, an optional zero baseline and a range handle; missing values break the line. (Beamline complete system)
Liquid gooeyliquid-gooeyLiquid surfaces that merge like goo when they touch — split plus-menus, gooey switches, file chips. (Beamline complete system)
Live cursorslive-cursorsWho else is working on this, and where: over any shared surface, each person's pointer in the colour their name always gets, with a name flag, gliding between the positions your realtime service sends; their selections outlined in the same colour, a short message beside the pointer when they type one (press / for your own), quieter when they go idle and fading when they leave. Positions are fractions of the surface, so every screen size agrees. (Beamline complete system)
Live waveformlive-waveformLoudness drawn as it happens: a scrolling history of the microphone (or any live source) or its spectrum, a calm processing state while words are finished, and a number readout under reduced motion. Draws only while there is sound to draw and it is on screen. (Beamline complete system)
Log viewerlog-viewerLog lines as they stream: it follows the newest line until you scroll up, then counts what arrived and brings you back in one click; filter by level with counts, search with every match marked and stepped through, wrap long lines, open a line's fields; only the lines in view are drawn, so a hundred thousand stay smooth. (Beamline complete system)
Logo Carousellogo-carouselA wall of logos shown a few at a time: every few seconds the slots turn left to right, each logo leaving upward as the next rises in. (Beamline complete system)
MarkermarkerA labelled point in a stream: a status event with an icon between messages, or a label such as "Today" between two hairlines. (Beamline complete system)
Market heatmapmarket-heatmapTreemap of markets sized by weight and coloured by change, grouped by sector, with hatched no-data tiles. (Beamline complete system)
MatrixmatrixA dot-matrix display: animated frame sets (loading, pulse, wave, syncing), text and digits in a 5×7 font, or a VU meter of levels or a live source. One canvas; the loop runs only while something moves and it is on screen. (Beamline complete system)
Mention inputmention-inputA composer where @people and #channels become single tokens with suggestions at the caret; the value keeps the text and where each mention sits. (Beamline complete system)
Menu barmenubarA desktop-style File / Edit / View bar for editor-like apps; each menu takes the same rows as the dropdown menu, and pointing moves between open menus. (Beamline complete system)
MessagemessageOne turn in a conversation with an agent: the person's words in a quiet bubble, the agent's answer on the page with its orb mark, trace, tool calls and actions, or what went wrong with the way forward. (Beamline complete system)
Metric cardmetric-cardA KPI that fills its tile: label, a value that rolls to each new number, the change with arrow, sign and tone, what it compares with and the value it was, a trend line and context; a wide tile sets the trend beside the figures. Unmeasured values are hatched, never zero. (Beamline complete system)
Microphone selectormic-selectorChoose the microphone, test it with a live level and mute it, with every permission and device state spelled out: not yet allowed, blocked (and how to unblock), no microphone, unplugged. Shares its microphone with the rest of the screen. (Beamline complete system)
Model pickermodel-pickerChoose the AI model for a request by what it can do and what it costs: a trigger with the model's name opens a searchable list grouped by provider, with capability filters, and every row shows its context window, speed and price tier; the model under the pointer or the arrow keys explains itself beside the list. (Beamline complete system)
Multi-selectmulti-selectSeveral values from a known list as removable chips in the field; the list has a search field (for long lists), checkable rows and a count with Clear. (Beamline complete system)
Navigation menunavigation-menuA site or docs header whose sections open into one panel that resizes and slides between them; NavigationMenuCard is the standard link row. (Beamline complete system)
Notification centrenotification-centerUpdates that wait to be read: a bell with the unread count opens All / Unread, new and earlier groups, and per item mark read or dismiss. (Beamline complete system)
Number fieldnumber-fieldA bounded number with − and +: arrows and Page keys step, typing is read in the locale and clamped on leaving, limits can be explained, and the label can scrub. (Beamline complete system)
Options chainoptions-chainCalls and puts for one expiry around a centre column of strikes: bid, ask, implied volatility, delta, volume and open interest, the money shaded in, a spot line that moves through the strikes as the price ticks, and quotes that flash as they change; clicking a bid sells and an ask buys, and the chosen legs add up to a net debit or credit. (Beamline complete system)
OrborbThe agent's presence: a thin ring of light around a lens in the brand's hue that holds still at rest, sends an arc round while thinking and widens with the voice; from a 16px agent mark to a 240px voice screen. (Beamline complete system)
Order bookorder-bookAsks, spread and bids with cumulative depth bars, grouping, change flashes and keyboard price picking. (Beamline complete system)
Order ticketorder-ticketBuy/sell order entry with limit, market and stop types, % of balance, inline validation and a live cost summary. (Beamline complete system)
OTP inputotp-inputA verification code in separate boxes backed by one real field, so paste, SMS autofill and Backspace work; optional groups like 123–456. (Beamline complete system)
PaginationpaginationMoves through pages of a known length: first, last and the current page's neighbours, with an optional “41–60 of 468”. It answers to its own room: narrow, “Page 6 of 24”; wide, one more neighbour on each side. (Beamline complete system)
Password fieldpassword-fieldA password field with a reveal control, and a strength meter when a password is being created. (Beamline complete system)
Phone inputphone-inputA phone number with its country: searchable picker with country and dialling codes, “+44…” switches the country, the number groups as typed, and the value is E.164. (Beamline complete system)
Pie chartpie-chartA few shares of a whole as a pie or donut, with spaced slices, percent labels, a centre readout and a list of every slice with value and share; hovering or focusing a row lifts its slice, clicking pins it. (Beamline complete system)
Pivot tablepivot-tableRecords summed up by the fields people choose: rows grouped by one or more fields that fold open level by level, columns split by another, one or more measures (sum, count, average, min, max) in every cell, subtotals on every group and totals at the end; fields move between Rows, Columns and Values from a menu on each chip, the table rearranges with rows sliding to their new places, cells can be shaded by their size, and a cell with no records stays blank while one whose values were never measured is hatched. (Beamline complete system)
PlanplanAn agent's plan: numbered steps with live status, progress, and Approve / Edit / Reject when it needs sign-off; approving shows progress, and a refusal says why and keeps waiting. (Beamline complete system)
P&L calendarpnl-calendarA trader's month at a glance: every trading day's profit or loss in its cell, shaded deeper the bigger it was in the gain or loss colour and marked ▲ or ▼, week totals down the side, and the month's total, win days and best and worst day on top; days the account did not trade stay plain and days that were never recorded are hatched. (Beamline complete system)
PopoverpopoverA small surface anchored to a trigger for a short form, a filter or an explanation; focus moves in and returns on close. (Beamline complete system)
Positions tablepositions-tableOpen positions with live unrealised PnL, liquidation warnings and close actions. (Beamline complete system)
Price chartprice-chartCandles, line or area price chart with volume, OHLC legend and reference lines, built for live ticks. (Beamline complete system)
Price tickerprice-tickerSymbol, last price with a directional flash, 24h change and stats. (Beamline complete system)
Product tourproduct-tourA short guided tour over the real interface: a spotlight that glides from one element to the next while the rest of the screen dims, and a card beside each element that says what it does, with its step and progress, Back, Next and Skip; focus moves into the card and comes back where it was, Escape ends the tour, arrows step through it, and a quieter beacon variant marks one new thing without dimming anything. (Beamline complete system)
ProgressprogressHow much of a known task is done, or a moving bar when the length is unknown, with an optional label and value. (Beamline complete system)
Prompt barprompt-barThe agent composer: a field that grows, @ to add a source, / for a command, a model picker, files and dictation, and one button that sends with progress and becomes Stop while the answer arrives; a refused send keeps the draft and says why. (Beamline complete system)
Prompt suggestionsprompt-suggestionsReady-made prompts a person can start from or follow up with: chips, cards or a list; a picked one lifts off and flies into the composer as its text, while follow-ups that are still being written hold their place and arrive one after another. (Beamline complete system)
QR Codeqr-codeA scannable code set as gradient dots with rounded finder rings and an optional centre mark; a new value ripples out from the centre. (Beamline complete system)
Query builderquery-builderConditions people build by hand to pick out records: each rule is a field, an operator that fits the field (contains, between, in the last N days, is any of) and a value in the right control; rules join with and or or, groups nest them, the joining word toggles in place, an unfinished rule says so instead of counting, the query reads back as a sentence, and the number of matches rolls as it changes. (Beamline complete system)
Radar chartradar-chartA few series compared across the same five to eight dimensions as polygons on a polygon or circle grid; hover or arrow keys pick a dimension and read every series' value there. (Beamline complete system)
Radial chartradial-chartProgress of a few measures toward their targets as concentric rings, full or half circle, with a centre readout and a list of each ring's value, target and percent. (Beamline complete system)
Radio cardsradio-cardsOne choice among rich options as cards with optional media, icon, detail and a figure; one selection ring follows the stable choice.
Radio groupradio-groupOne choice from a short visible set, each option with an optional description, vertical or in a row. (Beamline complete system)
RatingratingA score on a small scale: stars that fill as you point (halves too) and light one after another when chosen, with the word for the score beside them; read-only it shows an average to the tenth with its count, and nothing rated yet is hatched; or a 0–10 scale with its two ends named for likelihood questions. (Beamline complete system)
ReasoningreasoningThe agent's trace, fed by your stream: a shimmering label and the seconds so far while it works, then "Thought for N seconds"; steps that check off, prose thoughts, search sources or tool calls, open while running and folded when done. (Beamline complete system)
Recommendation cardrecommendation-cardOne suggestion from the agent that the person may take or leave: what it suggests, why, the expected effect and how sure it is (a meter and a word, hatched when it cannot tell), with the alternatives it weighed one click away; Accept runs your callback with progress and the card settles to one line. (Beamline complete system)
Recurrence editorrecurrence-editorHow something repeats, set in plain controls and said back in a sentence: every N days, weeks, months or years; which weekdays; in a month, on a date or on the second Tuesday (or the last Friday); ending never, on a date or after a number of times. The next dates are listed so the rule can be checked against a calendar, months without the chosen date are said, and the rule comes out as a value and an iCalendar RRULE. (Beamline complete system)
Resizable panelsresizable-panelsPanes that trade space across draggable dividers; each divider is a focusable separator with arrow keys, limits, folding for collapsible panes and double-click to restore. (Beamline complete system)
ResponseresponseAn assistant's answer as streamed markdown in the system's reading type: bursty tokens flow in at an even pace, each new word fades in through a short brand-hue colour trail, code is highlighted in the system's colours, and tables and quotes are set cleanly. (Beamline complete system)
Rich text editorrich-text-editorA Notion-grade writing surface: slash menu for every block, a formatting toolbar on selection, drag-to-move blocks, nesting, markdown shortcuts, paste from the web or as markdown; outputs HTML, Markdown and JSON. (Beamline complete system)
RidgelineridgelineDistributions per group as overlapping density ridges (response time by region, order size by plan): an overlap control, median and p95 readouts per row, hover or focus a ridge to bring it forward with its markers, and hatched rows for groups that were not measured. (Beamline complete system)
Run tracerun-traceOne agent run as a waterfall: every step (model calls, tools, retrieval, checks, sub-agents) nested under the step that started it, each a bar on a shared time axis, with retries as separate attempts on the same bar, tokens and cost per step and for the run; while it runs the bars grow live, and choosing a step shows its timing, attempts, input and output beside the trace. (Beamline complete system)
Sankey chartsankey-chartFlows between stages as bands whose width is the amount: sources to pages to outcomes, budgets to teams; hovering or focusing a node lights its flows and reads its totals in and out. (Beamline complete system)
Scatter chartscatter-chartTwo measures of many items against each other, one point per item, or a bubble chart when a third measure sizes the points: groups by colour and shape with a legend that turns them off, optional quadrants with their names and a trend line, the nearest point read on hover or walked with the arrow keys, and items missing a value counted as not measured instead of placed at zero. (Beamline complete system)
Scroll areascroll-areaA native scroll region with thin overlay thumbs and edge fades that show only where more content waits; thumbs can be dragged or clicked. (Beamline complete system)
Scrub barscrub-barA seekable timeline for audio or video: elapsed and total time, what has loaded, chapter marks, a time preview under the pointer, and the full keyboard of a media slider. (Beamline complete system)
Search fieldsearch-fieldThe search entry point: magnifier, clear button, Escape to clear, a shortcut hint and an optional live border beam. (Beamline complete system)
Segmented controlsegmented-controlTwo to five views or ranges of the same content (1D / 1W / 1M, List / Board): a radio group whose raised thumb slides to the choice.
SelectselectOne choice from a short known list, in the same frame as every text field: label, help, error, option groups and details.
Selection actionsselection-actionsSelect a passage and hand it to the agent: a bar over the selection with quick actions, your own instruction and More; while the agent works it says so, and its suggestion comes back to Replace, Copy or Discard, with the passage kept marked. (Beamline complete system)
SeparatorseparatorA hairline between groups, horizontal or vertical; hidden from screen readers unless it carries meaning. (Beamline complete system)
Share dialogshare-dialogShare a document, board or project: invite people by name or email with the access they get, change or remove anyone's access in place, and set who the link opens for, with Copy link; inviting turns the dialog into the invitation (role, notify, a note) and back. (Beamline complete system)
SheetsheetA panel that slides in from an edge with the page still visible behind it: header and footer stay put while the body scrolls. (Beamline complete system)
Shortcut recordershortcut-recorderLets people set their own shortcut: press the keys, see them as keycaps; a clash or a browser-kept shortcut asks first. ShortcutCheatsheet lists every shortcut, searchable. (Beamline complete system)
SidebarsidebarThe app's main navigation: sections, items with counts and one level of sub-pages, an icon rail with tooltips (⌘B, the trigger or the edge), and a sheet on phones. (Beamline complete system)
Signature padsignature-padA pad for a drawn signature whose ink follows a stylus's pressure (and thins with speed under a mouse or finger); undo, replay, PNG or SVG export, and typing instead for keyboards and screen readers. (Beamline complete system)
SkeletonskeletonHolds the shape of content while it loads, then crossfades into it, so nothing jumps. (Beamline complete system)
SlidersliderA value or range on a known scale: the thumb grows under the finger and shows its value while dragged or focused; marks, end icons and a value readout. (Beamline complete system)
Slope chartslope-chartChange between two points in time per item, by value or by rank: labels on both sides that never collide, rising and falling told by the end marker (▲ ▼) and the signed change as well as colour, and hover or focus to pick one item out. (Beamline complete system)
Slot textslot-textText and numbers that roll into their new value on reels, digit by digit from the right; other characters fade. Read as plain text by assistive tech.
SoundsoundInterface sounds named by interaction class (tap, select, toggle, open/close, tick, success, error) through one provider; off by default. (Beamline complete system)
SparklinesparklineA compact trend beside its value: point along it or focus it and use ← → to read each point; nulls are gaps. TrendLine is the bare line. (Beamline complete system)
Speech inputspeech-inputA text field you can speak into: the mic dictates through any speech-to-text provider, the phrase being heard shows apart from the finished words, and every failure (blocked, no microphone, connection lost and back) says what to do. (Beamline complete system)
SpinnerspinnerA ring that spins while work runs and closes into a drawn check or cross when it ends.
Split buttonsplit-buttonOne obvious action joined to a menu of close alternatives; both halves are real buttons and the menu uses the shared menu rows. (Beamline complete system)
StepperstepperWhere someone is in a multi-step flow: done steps carry a check, the current one a ring, and the line between marks fills as steps complete. (Beamline complete system)
StreamgraphstreamgraphStacked flows over time around a centre baseline, with silhouette, wiggle, expand (shares) and zero offsets: a legend that turns layers on and off, a tooltip that follows the pointer or the arrow keys, and hatched periods where a layer was not measured. (Beamline complete system)
Swap formswap-formExchange one token for another: type what you pay (or Max), pick each token from a searchable list with balances, and the form quotes what you receive with the rate, price impact, minimum after slippage and fees; the quote refreshes as it ages, the two sides trade places with one press, Review shows exactly what will happen, and the swap reports its progress, result or reason. (Beamline complete system)
Swipe actionsswipe-actionsRow actions behind a swipe on touch screens and a two-finger swipe on a trackpad, and at the row's end for pointer and keyboard (a ⋯ menu in a narrow row, icon buttons in a wide one); a full swipe runs the edge action. (Beamline complete system)
SwitchswitchA setting that applies at once: a thumb that slides on a spring and stretches under the finger, with an optional label before or after.
TabletableA plain, styled HTML table for small static data: header, body, footer, caption, numeric cells, three densities and a sticky header.
Table of contentstable-of-contentsThe sections of a long page beside it, with the one being read marked as you scroll: the marker travels down the rail between sections, the rail fills with how far you have read, a click glides to the section and hands it focus; the quiet variant is a column of ticks that opens into names when pointed at, and a narrow room folds it into one “On this page” line. (Beamline complete system)
TabstabsSwitches between panels of one object; one indicator slides to the active tab, counts sit beside labels, and the tabs a row has no room for fold into More.
Tag inputtag-inputShort free-form values as tags: Enter, comma or Tab adds, a pasted list adds them all, Backspace twice removes the last; duplicates and invalid values are said, not dropped silently.
Task rowstask-rowsBackground work an agent is doing, one row per task: status as a glyph and a word, what it produced, how long it has run or took, a progress bar while running and its sub-steps when opened; a failure opens with its reason and Retry, live tasks can be cancelled, and changes are announced politely. (Beamline complete system)
Text morphtext-morphA short label that becomes its next state letter by letter: shared letters glide into place, new ones arrive, old ones leave.
Text revealtext-revealA headline whose words rise into place once, the first time it scrolls into view; never repeats. (Beamline complete system)
Text shimmertext-shimmerOngoing work said in words (“Thinking…”) with a calm band of light passing across them; stops when inactive. (Beamline complete system)
TextareatextareaMulti-line plain text that grows with what is typed up to a limit, with an optional character count. (Beamline complete system)
Theme switchtheme-switchThe light/dark control: the page changes in one of four transitions starting from the button (reveal, eclipse, split, rise), and the icon turns between sun and moon. (Beamline complete system)
Ticker tapeticker-tapeA continuously scrolling row of symbols with price, change and mini trend; anyone can hold it: hover, keyboard focus or a tap. (Beamline complete system)
Time pickertime-pickerA time of day as hour and minute segments, typed or stepped, 12- or 24-hour; the clock opens a list of times at the step. (Beamline complete system)
TimelinetimelineWhat happened, newest first and grouped by day: people with avatars, systems with toned icons, relative times with the exact time on hover, details in place. (Beamline complete system)
ToasttoastShort results of an action stacked at an edge: point at the stack to fan it out and pause the timers; undo or retry in place; Alt+T, Escape and a swipe for the keyboard and touch.
Toggle grouptoggle-groupPressable toggles where one or several can be on: alignment, bold and italic, view options; bare for toolbars or framed. (Beamline complete system)
Tool calltool-callOne tool call in an agent's run: status, what it did and a short result on one quiet row that opens to the exact input and output; stops for permission when needed, with progress and the reason if allowing fails. (Beamline complete system)
TooltiptooltipShort supporting text for a control: opens after a moment on hover and at once on keyboard focus; inside a toolbar group the next one opens instantly.
TrackertrackerA row of status blocks for uptime, job runs or daily checks, with tooltips and a legend. (Beamline complete system)
Trades tapetrades-tapeRecent trades, newest first, with side glyphs, large-print marking and one-time arrival flashes. (Beamline complete system)
Transcript viewertranscript-viewerA recording and its words together: the spoken word lights up as it plays and the transcript follows it, any word or paragraph time plays from there, speakers become paragraphs with marks on the scrub bar. Takes word timings from speech-to-text or character alignment from text-to-speech. (Beamline complete system)
Tree selecttree-selectA field that picks from a tree: departments and teams, categories and subcategories, folders, regions and cities; the list opens as an indented tree whose branches fold, search keeps the path to every match and opens it, one value shows its whole path in the field, and several values tick whole branches at once (a branch half chosen shows a dash) and fold a fully chosen branch into one chip. (Beamline complete system)
Tree viewtree-viewNested folders and records with the full tree keyboard model (arrows, Home/End, *, type to jump), depth guides, counts and animated opening. (Beamline complete system)
TreemaptreemapNested rectangles sized by value (spend by team, then service), squarified so tiles stay close to square: labels that fit or hide, hover and focus highlight, drill in with a click or Enter and out with Escape, Backspace or the breadcrumb, hatched chips for parts that were not measured, and a table of the current level. (Beamline complete system)
UI rootui-rootMakes a region of any app a Beamline root: theme, brand and direction for everything inside, and a matching layer at page level where its menus, dialogs and tooltips open.
Usage meterusage-meterAn allowance and what fills it: one bar split by source, the room left, a warning near the limit and the overflow in its own red well past a notch at the limit.
User menuuser-menuThe account menu behind the avatar: who is signed in, status, theme, account pages and sign out with progress; a bottom sheet on phones. (Beamline complete system)
Video playervideoA video player on the native <video> element: title bar with an external link and close, centre play with ±10 s, scrub, time, volume, speed, captions drawn in the system's type, picture-in-picture and fullscreen; full keyboard control, and loading, buffering, ended and error states. (Beamline complete system)
Voice buttonvoice-buttonThe control that starts and stops talking: click to toggle or hold to talk (pointer, Space, Enter or a global shortcut), with a live level while recording, a loader while words are finished, and a check or a retry when it ends. The state comes from your operation, never from a timer. (Beamline complete system)
Voice pickervoice-pickerChoose a text-to-speech voice from a searchable list (name, accent, tone, use) and hear it first: each voice has its own orb, previews play one at a time and the orb speaks while its sample plays. (Beamline complete system)
Waffle chartwaffle-chartUnits of a whole as a grid of cells by category (seats used of a plan, tickets by channel): a 10×10 grid by default, hatched cells for units whose category was not recorded, the remainder left empty, and a list of categories with counts and shares that highlights its cells on hover or focus. (Beamline complete system)
WatchlistwatchlistA selectable, sortable list of markets with mini trends, prices, changes and stars. (Beamline complete system)
WaveformwaveformThe shape of a recording: one bar per slice of loudness, fitted to any width, with the played part in the accent, unmeasured slices hatched and a loading state. Peaks can be decoded from the file in the browser. (Beamline complete system)