What is SUS?

SUS UI is a reactive UI framework for Unity UI Toolkit, inspired by Vue.

Pillars

1. Reactivity — Prop<T>, Computed<T>, Watch — change data, DOM updates.
2. .sharq SFC — single-file components: <template> + <script> + <style>.
3. Component library — SusKit (general UI) + SusGame (HUD / inventory / screens).
4. Router — Vue Router-like navigation for screens and modals.
5. Theming — design tokens, density, breakpoints, world-space overlays.

One screen, desktop and mobile

Breakpoints in SUS are a container axis, not a device check: SusBreakpointService reads the width of the panel a screen is mounted in and drives a .breakpoint-* class down the token cascade. A screen built for desktop reflows for a narrow mobile panel through the same tokens and the same .sharq file, instead of a parallel mobile layout you build and keep in sync by hand. SusInventory ships as a live example of the pattern: it collapses into a compact, touch-sized single-column layout under the mobile threshold and expands back to the full multi-panel desktop grid above it — same component, same C#. See Adaptive layout for the breakpoint axis and thresholds.

Package map

sus-core (MIT, free)
   └── sus-router (MIT, free)
         └── sus-kit (commercial)
               └── sus-game (commercial, requires kit)

Mental model

If you know Vue SFCs, you already know the shape of .sharq:

Vue	SUS
props	Prop<T> (use .Value)
v-if / :class	same directives
<slot>	<slot>
watch	Watch / WatchEffect
Vue Router	SusRouter