Construction UI. shadcn-native.
Components for AEC data — ACC-ready, source-agnostic. Install with the shadcn CLI, own the code.
npx shadcn@latest add @cantera/sign-in-cardShow one-time registry setupOne-time setup — components.json
{
"registries": {
"@cantera": "https://canteraui.vercel.app/r/{name}.json"
}
}Data-agnostic by design
Components take plain props and never fetch. The Autodesk provider and scope catalog below come from the aps-oauth-preset registry item; Procore is a hand-rolled object. Same components, any source. Click around — every demo is live.
sign-in-card
scope-picker
View basic user profile information.
Load translated models in the APS Viewer.
Read hubs, projects, folders, items, and versions.
Update and delete project data.
Scopes outside the catalog — granular resource scopes, or anything this provider added since. Sent verbatim.
scope=user-profile:read viewables:read data:read
connection-card
Components
View allComponents
Data-agnostic UI — plain typed props in, callbacks out, no fetching and no provider knowledge.
- provider-sign-in-buttonA sign-in button and link for a single OAuth provider: brand icon, label, loading state. ProviderSignInButton handles a click; ProviderSignInLink navigates to an auth route.
- user-account-badgeAn avatar-and-name chip for a connected account, with optional provider mark. Server-safe.
- token-statusStatus line for an OAuth grant: connection state, token expiry, and held scopes. Server-safe.
- connection-cardA provider connection at a glance: account, grant status, scopes, and disconnect / reconnect actions.
- hub-switcherThe hub context switch: which ACC hub — or any Hub — the rest of the screen works against, with region context and a pending state for the switch itself.
- project-pickerThe project choice every ACC screen starts from: a searchable combobox grouped by hub, with the loading, error, and empty states a real fetch needs.
- version-set-selectWhich issuance of the construction sheets to read from, every option carrying its issuance date — building from a superseded set is an expensive mistake.
- hub-treeA controlled, fetch-free APS-style tree for hubs, projects, folders, items, and versions, with lazy expansion callbacks and complete keyboard navigation.
- crew-avatarDeterministic construction-crew SVG avatars — monochrome disc, geometric figure, one accent for the trade on the hard hat — generated from a name with zero dependencies, boring-avatars style.
- file-picker-dialogHub Browser inside a dialog, with tip-or-version selection and an explicit cancel action.
- aps-viewerA Strict-Mode-safe React host for Autodesk Viewer 7.* with deduplicated runtime loading, live native-toolbar controls, theme and ViewCube controls, frame radius, URN swaps, automatic resize, composable hooks, and a floating settings panel triggered from the native toolbar.
- model-status-cardThe translation state of one design: whether the model is viewable yet, how far along it is, and what failed — with a retry on the async-pending contract.
- copy-fieldA value someone has to paste into another system — a client ID, a callback URL — shown in full and always selectable, with a copy button that confirms.
Foundations
The shared types, provider presets, design tokens, and auth wiring kit every other item is written against.
- oauth-typesGeneric OAuth types for cantera components: providers, scopes, connections, accounts. The lingua franca adapters translate into.
- aps-oauth-presetAutodesk Platform Services (ACC) preset: provider metadata, scope catalog, scope bundles, and adapters into cantera's oauth types.
- status-tokensSemantic status colors — success, warning, danger, neutral — each with a foreground and a surface companion, contrast-verified in light and dark. The palette every cantera status surface renders from.
- acc-auth-routesThe headless half of Autodesk sign-in on aec-auth: consent start, code exchange, and sign-out route handlers, the signed session library, and the scoped sign-in component — no pages.
- project-typesGeneric project-context types for cantera components: hubs, projects, folders, items, versions, model translations, and sheet version sets. The lingua franca adapters translate into.
- aps-data-presetAutodesk Platform Services (ACC) data preset: adapters from Data Management hubs, projects, folders, items, and versions plus Model Derivative and ACC Sheets payloads into cantera's project types.
- viewer-typesTyped surface for the Autodesk Viewer global runtime — Autodesk's official @types/forge-viewer definitions re-exported under stable APS* names, plus domain types for cameras, properties, extensions, and promise-based token callbacks.
- viewer-extension-typesA typed catalog of the Autodesk Viewer's public extensions: every loadExtension id, the options each one actually reads, and the flags that decide whether loading it can work — verified against the shipped viewer source.
- upload-typesGeneric upload lifecycle types for cantera components: files moving through queued, uploading, processing, complete, and error, plus rejection reasons, an accept matcher, and locale-neutral byte formatting.
- photo-typesGeneric field-photo types for cantera components: categories, media kinds, the photo record with optional geolocation, and cursor pages. The lingua franca photo adapters translate into.
- acc-photos-presetAutodesk Construction Cloud Photos API adapter into the generic photo types: origin-module and media-kind normalization, the markup and logo filter, and the Autodesk Build deep link.
See it wired end to end
Try the full OAuth flow — no Autodesk account needed. It runs against an embedded APS emulator.
The stack around it
cantera is the UI layer of a small open ecosystem — each piece works alone, together they are the five-minute ACC path. How they compose.