DS
Published-package documentation wired to the real DS runtime so the same routes reveal how tenant and engine reshape identical component contracts.
Rottay / modernPublished package
Premium Docs

Design System Showroom

Primary
#FFFFFF
Rottay
Radius
14px
Surface shape
DensitynormalPlatform Flagship
NavigatorLibrary map
8 sections212 routes
Foundations first, then primitives, patterns, structures, and surfaces. Keep this rail legible enough to scan without hunting.
Foundations4 documented routes
4
Tokens
Themes
109
93
49
36
3
1
2
Runtime fingerprintToken readout from the active provider chain.
Live DS
Runtime
PlatformRottay
Rottay / ModernPlatform Flagship
Primary
#FFFFFFSecondary #A0A0A5
Radius
Compact runtime evidence across 3+ token signals.
Published DS package · Page Structure · Rottay / modernShared route metadata for the active runtime, kept inline so the shell reads like a thin header band.
Palette
#FFFFFFRottay
Chrome
Modernrenderer posture
Radius
14pxsurface shape
Density
normalPlatform Flagship
Structures/Feedback
FeedbackStructure3 engines
LoadingOverlay

Loading Overlay

Feedback group export for page-level framing around reusable tasks.
What it framesFull-area loading overlay with spinner and message
What it should proveFeedback structures should reassure the user that the system is working while preparing them for what comes next.
Engines
Icons
Primitives93 documented routes
Display
Inputs
Feedback
Layout
Navigation
Overlay
Patterns49 documented routes
Data
Forms
Visualization
Communication
Feedback
Workflow
Navigation
Commerce
Customization
Identity
Shell
StructuresCurrent section
24
Headers
Workspace
Shell
Record
Surfaces36 documented routes
Admin
Data
Experience
Forms
Operations
Workspace
Verticals3 documented routes
Platform
Bit Hire
Evnto
Playground1 documented routes
Playground
Developers2 documented routes
Developers
14pxxl 18px
Density
normalBorder-light cards
Accent
Badge
roundedtop bar · solid dividers
StructuresFeedbackLoading Overlay

Loading Overlay

Active profilePlatform Flagship
Runtime postureRottay / modern
Structures reference for Loading Overlay.
Runtime controls
TenantRottay
EngineModern
LayerStructure tierPage framing around reusable tasks.
GroupFeedbackShares the same audit lens and pairing rules as its group.
Enginesclassic / modern / rusticExpect parity in spacing, priority, and section rhythm.
Audit trayUse this page to judge whether the structure creates hierarchy before the surrounding surface starts doing the heavy lifting.
Review 01waiting clarityShould be obvious on the first scan without relying on surface chrome for rescue.
Review 02message toneShould stay clear once actions, counts, and support context compete for attention.
Review 03return to taskShould keep dense content readable instead of turning the screen into a flat stack.
Common pairings
empty statesresult statesskeletons
Usually lands in
all surfacesloading-heavy flowssave-confirm loops

Live preview

Compare rhythm, action placement, and supporting context across engines while the active tenant remains real.
classicmodernrustic
Compare enginesLook for spacing, action placement, and section rhythm before brand flavor.
Ignore wrappersJudge the structure itself, not route-level surface chrome or page copy.
Escalate laterMove higher only when the route contract or workflow packaging is the missing piece.
Engine comparisonLoading Overlay render checkEach engine gets the same structure with the same tenant. Focus on spacing, hierarchy, and action cadence rather than wrapper chrome.
Rottay3 live engines

Review checklist

These are the checks that should feel obvious on the first pass, before you audit the surrounding surface or route-level content.
Check 01waiting clarityShould be obvious on the first scan without relying on surface chrome for rescue.
Check 02message toneShould stay clear once actions, counts, and support context compete for attention.
Check 03return to taskShould keep dense content readable instead of turning the screen into a flat stack.
Layer fitStructures arrange page framing around reusable tasks. They should create order without taking over the whole surface contract.
Primitives

Import and usage

The structure should stay easy to consume from the published package: one import, one usage shape, and no page-local wrapper assumptions.
Consumer contract
Import onceConsumers should get the structure from the published package without extra page-local wrappers.
Stay declarativePass data, actions, and slots. Avoid hiding layout decisions inside screen-specific glue code.
Let surfaces finishStructures frame the page. Surface-level route shells should still own the broader contract.
Dashboard
Feedback
Loading Overlay
Same tenant, isolated engine
ClassicAnt Design
Live provider
Feedback structure
Check how waiting and transition states reassure the user without feeling dead or generic.
Syncing workspace snapshotsRefreshing queue totals, usage deltas, and escalation routing.
ModernDaisyUI
Live provider
Feedback structure
Check how waiting and transition states reassure the user without feeling dead or generic.
Syncing workspace snapshotsRefreshing queue totals, usage deltas, and escalation routing.
RusticVanilla CSS
Live provider
Feedback structure
Check how waiting and transition states reassure the user without feeling dead or generic.
Syncing workspace snapshotsRefreshing queue totals, usage deltas, and escalation routing.
Patterns
Structures
Surfaces
Stay here whenThe missing piece is section rhythm, chrome placement, or page-level context.
Escalate whenYou need reusable workflow behavior or a full route shell beyond the framing.
Common pairings
empty statesresult statesskeletons
Usually lands in
all surfacesloading-heavy flowssave-confirm loops
ImportPublished package entrypoint, ready to copy.
tsx
1 line
Consumption
Runtime-aware snippet
ImportTSX
Quick copy
import { LoadingOverlay } from '@rottay/design-system';
UsagePaste-ready example that shows the base contract first.
tsx
5 lines
Consumption
Runtime-aware snippet
<LoadingOverlay
  config={config}
  slots={slots}
  actions={actions}
/>
RT
Syncing records...
RT
Syncing records...
RT
Syncing records...
UsageTSX
Quick copy