Products › Web Components › BMX library
Shipped — BMX Web Components v2.6.0

One <script> tag. Every framework.

BMX is a suite of production-grade UI components built as standards-based custom elements. The browser renders them, not a framework — so the same markup works unchanged in plain HTML, Angular, React, Vue, Svelte, Blazor, ASP.NET Razor Pages and MVC, Django, Rails, htmx, or a twelve-year-old server-rendered application with no toolchain at all.

128 components, all shipped One file, no build step WCAG 2.2 AA by construction 10 themes, retintable

128 web components in all, the TreeListView Web Component among them (also sold on its own). Which edition has which:

Hypernova Web Components, Deluxe Web and Ultra59

Every everyday control — buttons, inputs, menus, dialogs and the rest — plus the form renderer, the query builder, the barcodes, the stepper, the command palette, the product tour, the colour picker, the transfer list, the recurrence editor, the notification centre and the filter panel. Everything outside the Pro and Gold families below.

Hypernova Pro90

Adds the Gantt chart, PERT chart and task board; the report viewer and report designer; the formula engine and formula bar; the resource scheduler; the chart and sparkline; the rich text editor; the chat; the code editor and code diff; the gauge and dashboard; the timeline and timeline navigator; the file manager; the property grid; the permissions matrix; the review layer; the JSON editor; the terminal; the media player; the risk matrix; the API explorer; the mind map; the dock layout; the gallery; and the panorama viewer.

Hypernova GoldAll 128

Adds the log stream, the infinite canvas, the data grid, the pivot grid with its slicer and chart, the form designer, the image editor, the diagram designer, the spreadsheet, the map, the network graph with its overview, the PDF viewer, the data importer, the decision table, the floor plan, the workflow designer and workflow engine, the data mapper, the 3D model viewer, the email template designer, the planning grid, the configurator, document compare, the annotation studio, the caption editor, the reconciliation workbench, the time-series explorer, the document signer, the shift roster, the process explorer, the trace viewer, the lineage graph, the label designer, the data profiler, the driver tree and the audio editor.

What an architecture and security review asks first

Fast in the browser. Nothing else to install.

The two reasons a component library is turned down: it makes the page lag, or it drags a tree of packages through your legal and security teams. BMX is built so neither comes up.

Performance you can measure

1,000,000 rows, about 25 in the DOM A million rows sorted in about 0.6 s 2–3 ms of work per scroll frame
  • Real DOM virtualisation. Only the rows and columns in view exist; rows are recycled from a pool as you scroll, never created and thrown away.
  • One paint per frame. Updates are batched to the browser's animation frame, and a scroll reads no layout, so there is nothing to force a reflow.
  • No leaks. Every observer, timer and document listener is released when an element leaves the page — safe in single-page applications that mount and unmount views all day.
  • Heavy work done once. Sorting ranks a column's values once and orders rows by counting; totals are measured only when the rows kept change.
  • Work off the main thread. The pivot grid totals half a million records in one pass on a background thread it starts itself, so the page stays responsive while it counts.
  • Only what changed, worked out again. The formula engine keeps a dependency graph of every cell, so a change touches only the formulas that read it: a hundred thousand formulas recalculate in about half a second.
  • Only the points that show. The chart keeps the points that hold a line's shape and paints large series on a canvas: a year of readings every thirty seconds, a million points, draws in under three seconds.
  • Only the lines on screen. The code editor draws and colours only the lines in view and reads on in the background: a million lines open in under half a second, and every match of a word among them is found in about a tenth of a second.
  • Large networks, laid out in seconds. The network graph places each node beside the ones it links to and settles the layout with a Barnes–Hut approximation, drawing as it goes: ten thousand nodes are laid out in about five seconds, with the communities already together.
  • Thousands of pages, opened at once. The PDF viewer reads only what it needs to show and draws only the pages in view: a 3,689-page file opens and jumps to page 2,000 in about two seconds, and two thousand pages are searched in under one.

Measured on the data grid in headless Chromium with software rendering; the log stream, canvas and TreeListView are virtualised the same way.

Zero dependencies, pure web standards

0 npm packages to install 1 file to review 0 network calls of its own
  • No dependency tree. One self-contained file: no transitive packages for legal to clear, for security to scan, or for you to patch.
  • Standard custom elements. The browser renders them, not a framework, so upgrading React, Angular, Vue or Blazor cannot break them.
  • Nothing phones home. No CDN, no telemetry, no licence server: a component fetches only what you point it at.
  • Declared, not hidden. The only third-party code inside is Stencil's small MIT-licensed runtime, compiled in and named in the package's third-party notices.

Strict CSP, no eval

Runs under a Content Security Policy that allows scripts from your own origin only and forbids unsafe-eval.

Offline and air-gapped

Host the file yourself and nothing else is needed: intranets, kiosks and networks with no way out all work.

Source licence and escrow

Separate product

The complete source and build, licensed directly or held by an escrow agent and released on agreed triggers. Bought on its own, under a written agreement: no licence tier includes the source, Hypernova Gold included. How it works

Support from the creator

Questions go straight to the architect who built every component — no ticket queue, no outsourced first line.

Why it is built this way

Three commitments, in every component

A suite an enterprise team can adopt without adopting a philosophy.

One file, no ceremony

Drop one script tag on a page and every <bmx-*> element works. No bundler, no module graph, no CDN account, and no build step in an application nobody wants to touch.

The hard parts, done once

Form submission from inside a shadow root. The accessible name of an icon-only button. Enter versus Space on a link. Keeping a destructive action from firing twice. A composite widget that takes one Tab stop rather than eight. Every application eventually hand-rolls these, and hand-rolls them badly.

Accessible by construction

WCAG 2.2 AA as a design constraint rather than a later remediation: real elements instead of ARIA impersonations, one focus indicator across the whole library, full WAI-ARIA keyboard patterns, and prefers-reduced-motion, prefers-contrast and forced-colors honoured.

A quick look

This is the whole integration

The same markup in a Razor page, a React component, an Angular template or a plain HTML file. Typed React, Angular and Vue wrappers ship alongside, generated from each component's own API.

<script src="/assets/bmx-components.min.js"></script>

<bmx-button tone="primary">Save changes</bmx-button>
<bmx-button variant="outline" tone="neutral">Cancel</bmx-button>

<bmx-select label="Region" placeholder="Choose one">
  <bmx-option value="uk">United Kingdom</bmx-option>
  <bmx-option value="us">United States</bmx-option>
</bmx-select>

Framework-neutral

Generated React, Angular and Vue wrappers that carry no component code, and a documented path for Blazor, ASP.NET MVC and any server-rendered template.

Keyboard complete

Every composite widget takes one Tab stop and moves with the arrows, the way the WAI-ARIA pattern for it says — not eight tab stops and a guess.

Ten themes

Switchable per page or per panel, and the whole library retints from a dozen CSS custom properties with no build step.

RTL ready

Right-to-left handled in the arithmetic where a logical property cannot reach it — an SVG path does not flip on its own.

The library

One hundred and twenty-seven elements, plus TreeListView

Built in order, so each one reuses what the ones before it established. Every entry below links to its own page, its API reference and its live demo.

Grids & tree grids 5

Hierarchical and tabular data at any scale. TreeListView, the flagship, is a product in its own right, with grouping, inline editing, saved views and real .xlsx export. The BMX data grid binds to arrays, REST and JSON APIs, CSV and JSON-lines files, an HTML table, your own server a block at a time or a live feed, and stays smooth at a million rows, with trees, detail rows and a pivot. The BMX pivot grid is multi-dimensional and totals half a million records in the browser in under a second, with slicers and a pivot chart beside it. Both are included in Hypernova Gold.

Data Grid <bmx-data-grid> Hypernova Gold

The table your application is built around, a million rows deep.

Buttons & actions 3

The button, and the two widgets built out of it. Everything else in the library borrows its conventions from here.

Button <bmx-button>

The workhorse, and the conventions every other component borrows.

Form fields 6

The controls you type into, search, or drop a file onto. All of them submit real FormData from inside a shadow root, with no adapter in between.

Selection controls 5

The controls you toggle, slide or score with — each one over a real platform control, so focus and form participation are the browser's rather than a re-implementation.

Navigation components 7

Getting around, and surviving a narrow window: a toolbar that collapses what does not fit into a menu, a breadcrumb that folds its middle, and a pagination control that does not change width as you page.

Overlays & status 7

Dialogs and drawers over the browser's own top layer, the tooltip and popover pair — one describes, the other contains — and the shapes that hold a layout while you wait.

Toast <bmx-toast>

A queue behind each corner, and nothing you are reading moves.

Labels & avatars 5

The components that label what is already on the page: a count that reaches the control it belongs to, a chip that is three genuinely different elements, and a stack of faces that says who is behind it.

Application components 3

Applications in their own right rather than controls: a carousel over the platform's own scroller, a calendar whose layout is arithmetic rather than pixels, and an org chart that is a tidy-tree algorithm behind a diagram.

Project management 3

A Gantt chart, a PERT chart and a task board: three views of one plan, scheduled by the same critical-path engine as our WinForms and WPF editions, so a plan gives the same dates in a browser and on the desktop. Included in Hypernova Pro and Gold.

Reporting 2

A report viewer and a report designer, with no report server: real pages with groups, totals, charts, crosstabs and barcodes, drawn the same on screen, on paper and in a tagged PDF, exported to Excel or CSV, and rendered on a server by the same engine. Your users can design their own reports. Included in Hypernova Pro and Gold.

Logs 1

A log and audit viewer that runs entirely in the browser: a million lines of server logs, access logs or audit trails, searched by field and by pattern, with a timeline of the errors, the commonest values of every field, personal data masked, and live streams followed as they arrive. Nothing is uploaded. Included in Hypernova Gold.

Canvas 1

An infinite canvas for visual collaboration: sticky notes, shapes, text, images, frames and connectors on a board without edges, at sixty frames a second with thousands of items. Every change comes out as JSON operations for your own server, socket or peer connection, and every copy agrees, whatever order they arrive in. Included in Hypernova Gold.

Formulas 2

A spreadsheet's calculation engine in the page, with nothing to draw: 406 Excel functions, dynamic arrays, LET and LAMBDA, tables and names, recalculating only what a change touches, so a hundred thousand formulas take about half a second. Form fields tie to cells with no script, and Excel files open and save with their formulas. The formula bar gives your users Excel's way of typing them, over a table of your own or the data grid. Included in Hypernova Pro and Gold.

Scheduling 1

A booking diary for rooms, people, vehicles and equipment. Each resource keeps its own time zone, working hours and holidays; bookings repeat by the calendar's rules; clashes are allowed, warned about or refused; the first free time is found for several people at once; and calendars go in and out as .ics files. Included in Hypernova Pro and Gold.

Forms 2

Whole forms from JSON, drawn with the library's own controls: conditions and calculations in a small language that never runs script, repeating rows, steps with a review, and a message beside every answer that needs one. The form renderer is in every licence; the form designer, which lets your own users build forms by dragging fields onto pages, is included in Hypernova Gold.

Form <bmx-form>

Whole forms from JSON: conditions, calculations and checks.

Charts 2

Twenty-two kinds of chart drawn by the library itself, with no charting package: columns to sankey, stacked or as shares, a line on a second axis, targets and ranges, time axes in any time zone and drag to zoom. A million points stay quick, every value can be read from the keyboard and as a table, and patterns tell series apart without colour. The sparkline puts a trend the size of a word into a table cell or a sentence. Included in Hypernova Pro and Gold.

Chart <bmx-chart> Hypernova Pro

Twenty-two kinds of chart, with no charting package.

Editors 1

A rich text editor with nothing loaded from anywhere: a slash menu, mentions and Markdown as you type, tables and images, comments with replies and tracked changes to accept or reject, and paste from Word or Google Docs that arrives clean. Everything that reaches the document passes one sanitiser; the value is HTML posted with its form, or Markdown, text or JSON. Included in Hypernova Pro and Gold.

Chat 1

The conversation for an AI assistant or a support desk: answers streamed as they arrive, in Markdown with highlighted code, tables, cited sources and the assistant's steps, with files, stop, retry, edit and rating. It holds no model and sends nothing anywhere: your handler asks your own service, or your page writes the replies. Included in Hypernova Pro and Gold.

Chat <bmx-chat> Hypernova Pro

The conversation for an AI assistant or a support desk.

Imaging 1

A picture editor for your own pages: crop to any shape or round, straighten, adjust with a live histogram, apply a look, annotate, and redact for good. Everything happens in the browser, and a photo's location, camera, serial number and owner are reported and removed before it is saved. Put it in front of an upload and every picture is cleaned before it is sent. Included in Hypernova Gold.

Diagrams 1

A designer for flowcharts, processes in swimlanes and network diagrams, from over forty shapes, with connectors that route themselves around everything in between and an Arrange that lays the whole diagram out. Mermaid flowcharts come in and go out, and every change is a list of operations another copy applies, so several people can work on one diagram over your own connection. Included in Hypernova Gold.

Spreadsheets 1

A whole spreadsheet in one element: a toolbar, a formula bar, sheet tabs and the keyboard and clipboard your users already know, over 406 Excel functions and dynamic arrays. Number formats, conditional formats with colour scales and data bars, validation lists, filters, merged cells and frozen panes, and Excel files that open and save with their formulas and their looks. Only the cells in view are drawn, and nothing is uploaded. Included in Hypernova Gold.

Code 2

A code editor with no editor package behind it: twenty-six languages coloured, several cursors, find and replace with regular expressions, folding, problems from your own checker underlined and suggestions of your own, and a form field like any other. Beside it, a diff that shows two versions side by side or in one column with the changed words marked, reverts or accepts each change, and reads git patches. A million lines open in well under a second. Included in Hypernova Pro and Gold.

Queries 1

A query builder for filters and rules: groups joined by AND or OR, with NOT, typed fields and 28 comparisons. The query comes out as SQL with parameters for six databases, a MongoDB filter, OData or JsonLogic, a function that filters records in the page, or a sentence, and the same checks and conversions run on your server. In every licence that carries the library.

Dashboards 2

Gauges that show a figure against its scale — dials with a bar or a needle, a ring, bars and bullet graphs, with bands, a target and the change from last time — and that your users can set as form fields. And a dashboard layout whose tiles hold anything, and which your users drag, resize, open and keep, from the mouse or the keyboard; on a phone the tiles stack. Included in Hypernova Pro and Gold.

Maps 1

A map with the world built in: countries coloured by your figures in steps, quantiles, breaks of your own or either side of zero, markers sized by value and grouped when they crowd, great-circle routes, four projections, zoom, choosing countries and a table view. Your own regions come in as GeoJSON or TopoJSON. No tiles and no map service, so nothing about your data leaves the page. Included in Hypernova Gold.

Map <bmx-map> Hypernova Gold

A map of your figures, with no map service behind it.

Networks 2

A network graph for anything made of links — people, accounts, services — laid out as a force layout, a hierarchy that follows the arrows, rings, a circle or a grid. Communities are found and coloured, the nodes that hold the network together are measured, the shortest path between two is one key away, and a time bar plays the network as it grew. Groups fold into one node and open again, and nodes with more behind them load it when opened. Ten thousand nodes are laid out in seconds on a canvas, with a small overview of the whole beside it. Included in Hypernova Gold.

Timelines 2

Moments and spans in rows that nest and fold, zoomed from millennia to milliseconds with an axis that always counts in sensible steps, BC included, in any time zone. Overlapping items stack into lanes and busy rows gather into clusters; made editable, items move, stretch and change rows, with every change checked by your page first. A navigator strip shows the whole range with a window to drag. Fifty thousand items stay smooth. Included in Hypernova Pro and Gold.

Timeline <bmx-timeline> Hypernova Pro

Moments and spans in time, from millennia to milliseconds.

Files 1

A file manager in your page: a folder tree, a path, details or tiles, sorting, search and a preview; new folders, rename, delete, cut, copy and paste, drag and drop between folders, upload from the desktop and download. The files stay where you keep them — your own server through a small JSON convention, files held in the page, or a provider of your own — and every action is checked by your page first. Included in Hypernova Pro and Gold.

Barcodes 4

Barcodes and QR codes drawn as sharp vectors: Code 128, Code 39, EAN, UPC, ITF, Data Matrix and PDF417 with check digits worked out and wrong ones refused, and QR codes in your colours with a logo in the middle. A signature pad whose ink follows the pen, sent with the form like any field, with a typed name as an equal alternative. And a field for codes typed, scanned by a hand-held scanner, or read by the camera, with nothing kept or sent. In every licence that carries the library.

Steppers 1

A long task in steps — a checkout, an account set-up, a claim, an import — with a step list across the top or down the side that shows what is done, which step your users are on and which needs attention. Next checks each step's fields and your page's own rules before it moves on, steps can be taken in order or in any order, and your page can move them itself as work goes on. On a phone the list becomes “Step 2 of 5”. In every licence that carries the library.

Documents 1

A PDF viewer drawn by the library's own PDF engine, with no plug-in, no server and no third-party code: page width or whole page, zoom and rotation, find with every match lit, thumbnails and the outline, links that work, comments with their notes and form fields with their values, password-protected files up to AES-256, print and download. Each page's text is real text, to select, copy and read aloud, and only the pages in view are drawn, so thousands of pages open at once. Included in Hypernova Gold.

Commands 1

A command palette for your whole application: your users press Ctrl+K, type a few letters and press Enter. Actions, pages and your own records are found together, with matching that understands initials and missed letters; commands come in groups with icons, shortcuts and badges, open pages of their own choices, and run from their shortcuts anywhere on the page. Your data is searched as they type, from as many sources as you give it. In every licence that carries the library.

Tours 1

A product tour that walks a new user round a screen one card at a time, the rest of the page dimmed. Steps can let your users try the real control and move on when they do; tours branch, wait for parts of the page that arrive late, and ask your page before each step forward. The card follows its target as the page scrolls, and is a proper dialog for screen readers. In every licence that carries the library.

Properties 1

A property grid: whatever is selected, its properties in categories, each with the right editor — text, numbers with units and limits, sliders, switches, lists, flags, dates, colours, nested objects and lists. Several objects are edited together, values are checked as they are typed against your rules, your page can refuse any change, and there is undo, search, categories or A to Z, and editors of your own. Included in Hypernova Pro and Gold.

Permissions 1

A permissions matrix: roles across the top, resources down the side as a tree, and allow, deny or inherit in every cell, worked out through role and resource inheritance and shown faintly where inherited. Every cell says why it is what it is. Your users set ranges in one go, undo, and export to CSV; changes wait for Save, and your page can review or refuse them first. Included in Hypernova Pro and Gold.

Importing 1

A data importer for the spreadsheets your customers already have: CSV, TSV, Excel workbooks with their formulas calculated, and JSON, read in the browser and never uploaded. Columns are matched to your fields by name, aliases and what the values look like; every value is read into its type and checked against your rules, and problems are fixed in a grid of only the rows in view, with duplicates removed in one go. Your server has the last word. Included in Hypernova Gold.

Decisions 1

A decision table for business rules the business can read: inputs, answers and one rule per row, written in DMN's simple tests or as spreadsheet formulas. All seven hit policies; values tried and explained in sentences, with the cell that stopped each rule marked; gaps, overlaps and rules that never fire found, and a rule added for a gap in one press. Test cases live with the table, and DMN 1.3 XML goes in and out. Included in Hypernova Gold.

Colours 1

A colour picker for themes, brands and charts: saturation and brightness on a square, hue and opacity on tracks, and the value typed in hex, RGB, HSL or OKLCH, always written in the format you choose. Your design tokens sit beside it as swatches that follow the theme, and every colour is checked against a background as it is chosen, for text, large text or graphics at AA or AAA, with one press to the nearest colour of the same hue that passes. It goes into a form like any other field. In every licence that carries the library.

Transfer lists 1

Two lists side by side, available and chosen, and the moves between them: people to a role, columns to a report, fields to an export. Both lists filter as your users type; items move with buttons, Enter, a double click or a drag, and the chosen list is put in order. Groups, second lines, locked and disabled items, limits, your page's say on every move, and a hundred thousand items drawn only as far as they are in view. It goes into a form like any other field. In every licence that carries the library.

Reviews 1

A review layer that pins comments to the page: wrap a design, a dashboard, a form or a document, and reviewers click anything to start a thread on it. Pins are tied to elements, so they follow the content as it reflows, scrolls and zooms. Replies, @mentions of your own people, resolve and reopen, and a list with filters and search; nothing is stored or sent, every change comes out as JSON, and your page can refuse any change first. Included in Hypernova Pro and Gold.

Floor plans 1

A floor plan for booking desks, meeting rooms, seats, parking bays and lockers: drawn where they really are, with their state now by colour and pattern and who has each one, chosen by pointer, keyboard or the list beside the map. Filters, zones, floors, zoom and pan; floor drawings as images or SVG, cleaned of anything that could run, with marked shapes imported as spaces; live availability merged in; and an editor with snapping and undo. Included in Hypernova Gold.

Floor Plan <bmx-floor-plan> Hypernova Gold

Desks, rooms and parking where they really are, booked from the map.

Workflows 2

A workflow designer and the engine that runs what it draws. Approvals and processes in swimlanes by role, with actions that carry formula conditions, say who may take them, run by themselves or need a comment; values set as work moves, events for your page, and time limits that escalate. A problems list checks the workflow as it is drawn, and Simulate runs it as each role. The engine shows each person their task card, asks your page before every action, and ships as a module for Web Workers and Node, so your server checks every action too. Included in Hypernova Gold.

Recurrence 1

A recurrence editor for the "repeat" of meetings, report schedules, maintenance windows and invoices: daily, weekly on the days ticked, monthly or yearly on a date or on "the second Tuesday" or "the last weekday", ending never, after so many times or on a date. It writes the iCalendar rule every calendar reads, or Unix or Quartz cron, shows the rule in words and the next dates in the series' own time zone, lets dates be skipped, and goes into a form like any other field. In every licence that carries the library.

JSON 1

A JSON editor with four views of one document: a tree to edit in place, the text with highlighting and folding, a table of any array of objects, and the changes against another version. A JSON Schema checks it as it is edited, with problems marked where they are and listed; titles, descriptions, choices and defaults come from the schema. Search, go to path, undo, and every edit offered to your page first; only the rows in view are drawn, so large documents stay quick. Included in Hypernova Pro and Gold.

JSON Editor <bmx-json-editor> Hypernova Pro

One JSON document as a tree, text, a table and its changes, checked as it is edited.

Terminals 1

A terminal for shells, build and deploy consoles, device consoles and REPLs. It understands what programs write: colours to 24 bits, cursor movement, scroll regions, line drawing, wide characters, titles and links, and the alternate screen of editors and monitors; keys, pastes and the mouse go back as programs expect. It connects to nothing by itself, so it sits on your WebSocket, SSH gateway or serial bridge. Search, copy, Ctrl+click links, themes, and floods of output that never freeze the page. Included in Hypernova Pro and Gold.

Terminal <bmx-terminal> Hypernova Pro

A terminal in the page, connected to whatever you connect it to.

Data mapping 1

A data mapper that draws how one shape of data becomes another: source and target fields as two trees, from sample data or a JSON Schema, with a line for every mapping. Fields are copied, worked out with spreadsheet formulas, passed through lookup tables and given defaults; lists become lists with a filter. Auto-map, problems as you go and a live preview over sample records; the map is plain JSON, and the same engine runs it in a worker or on your server. Included in Hypernova Gold.

Data Mapper <bmx-data-mapper> Hypernova Gold

How data in one shape becomes another, drawn as lines and run anywhere.

3D models 1

A 3D model viewer for STL, OBJ with its colours, glTF and GLB: turn, move and zoom by mouse, touch or keys, standard views, perspective or orthographic, shaded, with edges or as an X-ray. Sections with the cut faces filled, an exploded view, a parts tree to show, hide and isolate parts, measuring between points, and notes pinned to the surface as JSON. Drawn with WebGL in the browser, only when something changes; files can be opened or dropped, and nothing is uploaded. Included in Hypernova Gold.

Email 1

An email template designer: rows of one to three columns holding headings, text, buttons, images, dividers, spacers and links, by drag, click or keyboard. It sends the HTML mail clients really draw — tables, inline styles, columns that stack on phones, Outlook looked after, preview text — with a plain-text part. Merge fields stay for your sending service, the preview fills them with samples, and problems are listed before you send. Designs are plain JSON. Included in Hypernova Gold.

Planning 1

A planning grid for budgets and forecasts: accounts, cost centres or products as a tree down the side, months, quarters and years across, and Budget, Forecast, Actual and scenarios as versions compared cell by cell. Type a total and it is spread over the cells below it — in proportion, evenly, by a seasonal profile or the same in each — with held cells, closed months and signed-off rows left alone and the total exact after rounding. Formula rows in spreadsheet formulas, what-if, comments, sign-off, copy and paste with spreadsheets, and every change handed to your page. Included in Hypernova Gold.

Configurators 1

A configurator that prices as it goes: choices as cards with pictures, lists, drop-downs or colour swatches, extras, yes or no, quantities and text, in steps or on one page. Rules in spreadsheet formulas say what a choice requires, excludes or hides; every combination offered can be built, unavailable options say why, and choosing one shows what else would change. Volume tiers, seller discounts with approval and a bill of materials; the same engine checks every quote on your server. Included in Hypernova Gold.

Comparisons 1

Document compare: a redline of two versions of a Word file, PDF, HTML, Markdown or text, in any mix, read in the page with nothing uploaded. Paragraphs are lined up first, then compared word by word; moves are one change and formatting changes are listed. Side by side or inline with unchanged stretches folded; accept or reject each change and the clean copy follows; the redline, the clean copy and a CSV change report out, and bulk comparing on a server. Included in Hypernova Gold.

Annotation 1

An annotation studio for machine-learning training data: boxes, rotated boxes, polygons, lines, points, keypoint skeletons and painted masks, each in a class with its attributes. A queue of thousands of images with statuses and a review mode; a model’s guesses shown dashed with their score and accepted in one click; drawing entirely from the keyboard if you like. COCO, YOLO and Pascal VOC in and out as ZIPs, and the same conversions on a server; nothing is uploaded. Included in Hypernova Gold.

Media 1

A media player for training videos, product tours, recorded meetings and podcasts: captions and subtitles in several languages, chapters on the scrub bar, thumbnails as you scrub, and text descriptions read out to screen readers. The transcript sits beside or under the picture, follows along, can be searched and downloads as text, WebVTT, SRT or JSON. Viewers choose their own caption style and bookmark moments with notes; speed, loops, full screen, picture-in-picture, and a compact audio player too. Included in Hypernova Pro and Gold.

Media Player <bmx-media-player> Hypernova Pro

Video and audio with captions, chapters and a transcript that follows along.

Captions 1

A caption and subtitle editor: the video, the list of captions and a timeline over the sound’s waveform side by side. Drag a caption’s edges or set them from the playhead by key; split, merge, shift and re-sync a whole file; mark who is speaking. Every caption is checked against reading-speed, line and timing rules with presets for streaming, broadcast and education, and overlaps, short captions and long lines are fixed in one step. Plain text becomes timed captions spread over the speech; WebVTT and SRT in and out, and the same engine on a server. Included in Hypernova Gold.

Risks 1

A risk matrix: each risk of a register on a heat map by likelihood and impact, on your own scales from three by three to six by six, with bands, the action each calls for, and the appetite drawn as a line. Inherent, residual and target scores with arrows for the treatment path or for the movement since the last review; drag or use the keys to re-score, with undo. The register beside it filters by cell, band, category or owner and flags overdue reviews and risks above appetite; CSV, JSON and an SVG of the heat map out. Included in Hypernova Pro and Gold.

Risk Matrix <bmx-risk-matrix> Hypernova Pro

A risk register on a heat map, with appetite, treatment and movement.

Reconciliation 1

A reconciliation workbench: a bank statement against the cash ledger, or any two lists of money, matched by rules in order — exact, close dates, small fees, one payment for several items, several paid together, a shared reference — each match with a confidence, the sure ones confirmed and the rest reviewed. Match the rest by hand with suggestions and a running difference, record fees and discounts as adjustments, age what is left, and have a second person sign it off, every step logged. CSV in and out, and the engine on a server. Included in Hypernova Gold.

Time series 1

A time-series explorer for millions of points from sensors, meters, metrics and prices: stacked panes with left and right axes, lines, areas, steps and points thinned per pixel so a million points redraw in milliseconds and every spike still shows. Drag, zoom to a range, wheel and pinch, an overview and quick ranges; thresholds, events, anomalies and an earlier day, week or year drawn behind. Live data follows the newest point; a cursor reads every series and a table gives the window’s figures; PNG and CSV out, and the engine on a server. Included in Hypernova Gold.

Signing 1

A document signer: signers with roles and signing order, and their signature, initials, date, name, text and checkbox fields placed on a PDF by mouse or keyboard. Each signer in turn is guided field by field, draws or types a signature once and applies it everywhere, then agrees and finishes or declines. Out comes the original PDF with every value stamped on its page, its bytes kept, and a signing certificate with each signer, the time, the original’s SHA-256 and the log; nothing leaves the page, and stamping runs on a server too. Included in Hypernova Gold.

Document Signer <bmx-document-signer> Hypernova Gold

PDFs prepared for signing and signed in the page, with a signing certificate.

Rostering 1

A shift roster: people with skills, contracts, rates, leave and requests down the side, days across, and shifts painted, typed by code, dragged to move or swap, and locked. Rest between shifts, weekly hours, days and nights in a row, skills and leave are checked as you go and marked on their cells; cover by skill, weekday or date shows per day and hour by hour. Auto-fill adds shifts where cover is short, keeps every rule and says why each gap could not be filled; hours and cost, CSV and JSON out, and the engine on a server. Included in Hypernova Gold.

Notifications 1

A notification centre: the bell with its unread count, and the inbox behind it grouped under Pinned, Today, Yesterday and earlier, with repeats stacked into one. Each notification is read or unread, pinned, snoozed or dismissed and carries up to three actions of its own; tabs, a source filter, search, a Snoozed tab and a settings page to mute a source. New ones are announced to screen readers, every change goes back to your page with the whole list, and it draws in place as an activity feed too. In every licence that carries the library.

Filters 1

A filter panel for any list: checkbox facets with live counts, a single choice, number ranges over a histogram with a two-handled slider, dates with quick choices, a minimum rating and switches, with keywords, chips, Clear all, saved views and the choice in the address bar. Given your records it filters them itself and counts each facet with every other filter but its own; with a server it hands over the query. Down the side or as a bar of popups, live or on "Show 24 results", folded behind a button on a phone. In every licence that carries the library.

APIs 1

An API explorer: an OpenAPI 3.0 or 3.1 description, JSON or YAML, or Swagger 2.0, documented operation by operation — parameters, body, responses and schemas as tables of fields — and tried in the page. Parameters are checked as they are typed, credentials kept only in memory, and the response comes back with its status, time, headers and body checked against the schema. Every request as cURL, JavaScript, C# and Python; a mock mode that answers from the description’s own examples. Included in Hypernova Pro and Gold.

API Explorer <bmx-api-explorer> Hypernova Pro

An OpenAPI console in the page: every operation documented and tried.

Mind maps 1

A mind map built from the keyboard as fast as you think — Enter for a topic beside, Ctrl+Enter for one under — or from an indented outline kept in step beside it. Four layouts that never overlap, branches in eight colours, folding with counts, notes, links and icons; drag a branch to move it, reorder and indent from the keys, pan, zoom, find, undo. OPML, Markdown, JSON and text in and out, PNG and SVG pictures, and a tree for screen readers in outline order. Included in Hypernova Pro and Gold.

Processes 1

A process explorer: the event log of an ERP, CRM, ticketing or workflow system, as records, CSV, XES or JSON, turned into the process map — activities, hand-overs and loops, by frequency or by wait — with sliders for the busiest paths and an animated replay of every case. Variants ranked, each case with its timeline, conformance against the path cases should follow, statistics and filters; SVG, PNG, CSV and JSON out, nothing uploaded, and the engine on a server. Included in Hypernova Gold.

Tracing 1

A trace viewer for OpenTelemetry, Zipkin and Jaeger traces: every span on one time axis in its call tree, coloured by service, with events, failures and an overview to zoom. The critical path that decided the request’s duration is marked, with each span’s self time; a flame graph, figures by service and operation, the service map, and two runs compared span by span. Tens of thousands of spans scroll smoothly; CSV, OpenTelemetry JSON and SVG out, and the engine on a server. Included in Hypernova Gold.

Lineage 1

A lineage graph: OpenLineage events, a dbt manifest or plain JSON laid out left to right from sources to dashboards, each asset with its columns, owner, system and health. Choose an asset to light up everything upstream and downstream, or a column to trace it both ways; impact analysis lists what a change reaches and the owners to tell, and PII and other classifications are carried downstream and highlighted. Search, an assets table, checks, SVG, CSV and JSON out, and the engine on a server for CI checks. Included in Hypernova Gold.

Docking 1

A dock layout: your own panels, any markup, in tabbed groups set side by side or one above another with splitters between them. Drag a tab and guides show where it lands — into a group, onto a side, to an edge of the workspace or out as a floating window that moves, resizes and docks back. Groups fold to an edge, maximise, close and reopen where they were, and panels are never moved in the page, so an editor or a video keeps its state. The arrangement is plain JSON, kept per user or in the browser; every move works from the keyboard and is announced, and a narrow screen gets one set of tabs. Included in Hypernova Pro and Gold.

Dock Layout <bmx-dock-layout> Hypernova Pro

The docking workspace of an IDE or a trading desk, in one element.

Galleries 1

A picture gallery: thumbnails in justified rows, masonry columns or an even grid, laid out from each picture's size before it loads, with only the pictures near the view in the page, so ten thousand scroll as smoothly as twenty. Headings by day, month or your own groups, search by words and tags, sorting and selection. The viewer zooms about the pointer, pans, rotates, swipes, plays a slideshow and video, compares a before-and-after pair with a slider, shows the details and goes full screen; the grid is walked with the arrow keys and the viewer hands focus back where it came from. Included in Hypernova Pro and Gold.

Gallery <bmx-gallery> Hypernova Pro

Thousands of pictures, laid out beautifully and opened full screen.

Panoramas 1

A panorama viewer: equirectangular 360-degree pictures from phones, cameras and renderers drawn by the graphics card, a preview at once and the full picture after. Look around by dragging, with the keys or by moving a phone; zoom with the wheel, a pinch or a double click. Hotspots join pictures into a tour from room to room, facing the right way, with notes and links, a floor plan showing where you stand, a strip of scenes and a compass. Turn on editing to place and edit hotspots in the page and save the tour as JSON; Tab reaches every hotspot and the direction faced is announced. Included in Hypernova Pro and Gold.

Labels 1

A label designer: shipping, product and shelf labels, asset tags and badges in millimetres, inches or points at the printer's resolution. Text that wraps or shrinks to fit, pictures, boxes and reversed panels, and Code 128, GS1-128, EAN, UPC, ITF, Code 39, QR, Data Matrix and PDF417 with every bar sized to whole printer dots. Drag, snap, align, lock, undo; fields with filters, serial numbers and print-only-when, fed from CSV or JSON. Sixteen sheet and thermal roll stocks or your own, with copies and part-used sheets; printed at real size, or PDF, ZPL, PNG and SVG out. Included in Hypernova Gold.

Profiling 1

A data profiler: a CSV, TSV, JSON or Excel file, or your own records, described column by column — type and role, values that do not fit, counts, statistics, a histogram and box plot with the outliers and their rows, dates, patterns, stray spaces and the same value spelt different ways. Emails, phones, postcodes, cards and IBANs recognised and checked, and personal data flagged. A quality score with every problem ranked, correlations and missing values, rules suggested from the data and checked, and drift against an earlier extract; an HTML report, JSON and CSV out, and the engine on a server. Included in Hypernova Gold.

Drivers 1

A driver tree: a result — operating profit, cash, margin or churn — broken into the drivers that make it, down to the levers people pull, each with its value and its change against plan, actuals or a scenario, coloured by which way is better. Move an input's slider and everything above it is worked out again at once; save the what-if as a scenario, goal seek a target within each input's range, rank the inputs on a tornado chart, and bridge plan to actual with steps that always add up. Formulas in plain words; JSON, CSV and SVG out, and the engine on a server. Included in Hypernova Gold.

Audio 1

An audio editor: WAV, MP3, AAC, Ogg and FLAC recordings, telephone ones included, as clips on tracks with volume, pan, mute and solo — cut, trimmed, moved, copied and faded with four curves, with snapping, markers, undo and a waveform drawn fast at any zoom; the originals are never changed. Given a transcript with word timings from a speech-to-text service, it finds card numbers, security codes, bank details, phone numbers and more however they were said, hears keypad tones itself, and bleeps or silences them on every track with a log of what went. Silence found and removed, loudness measured to the broadcast standards and set, a frequency view, WAV with markers out, and the engine on a server for recordings in bulk. Included in Hypernova Gold.

Audio Editor <bmx-audio-editor> Hypernova Gold

A multitrack audio editor that also takes card numbers out of call recordings.

And the eight that go with them

Companion elements

Eight of the components take their content as markup rather than as a data array — which is what a Razor page, a Blazor component, a Django template or an htmx swap can actually produce. These are the elements you write inside them. Two of them, Option and Menu Item, render nothing at all: the parent reads them once and draws the widget. The other six do render, and leave to the parent whatever is a question about the set rather than about one entry — the value, the keyboard, the tab order.

<bmx-option>

One option for a <bmx-select>, written in markup rather than passed as data.

Written inside Select · API reference

<bmx-radio>

One option inside a <bmx-radio-group>. It renders, and that is nearly all it does — the group owns the value, the keyboard and the validity.

Written inside Radio Group · API reference

<bmx-menu-item>

One entry of a <bmx-menu>. Nest one inside another and it becomes a submenu.

Written inside Menu · API reference

<bmx-tab-panel>

One panel inside a <bmx-tabs>, and the whole of what an author writes — the tab is drawn from this element's label.

Written inside Tabs · API reference

<bmx-accordion-item>

A heading with a panel under it. Inside an accordion the accordion coordinates it; on its own, it is a disclosure.

Written inside Accordion · API reference

<bmx-breadcrumb-item>

One step of a trail: a link, or — for the step you are standing on — a piece of text that is deliberately not one.

Written inside Breadcrumb · API reference

<bmx-step>

One step of a <bmx-stepper>: its label and the content shown while it is the current step. The stepper owns the order, the moving and the checking.

Written inside Stepper · API reference

<bmx-tour-step>

One step of a <bmx-tour>: the card's heading and content, and what it points at. The tour owns the order, the moving and the dimming.

Written inside Product Tour · API reference

See it running before you decide

Nothing in the showcase is a screenshot. The upload rows filling in are the component's own queue against a stand-in server; the five thousand options in the select are really there, and really windowed.