Luna UI Documentation

Want to browse every Luna component in five minutes? Open LunaStorybook.unity — one sidebar-driven scene that previews each component live: pick on the left, play with it on the right, no scene-flipping. It ships in the Showcase sample (Samples~/Showcase/ in com.cupkekgames.luna), the pure-UI half of Luna's demo content; the same sample also holds the flagship LunaShowcase shell and the specials scenes below.

Showcase requires only Luna's bundled deps (data, graphs, services, singletons, pool, fadeables, keyvaluedatabases, prefabloaders, assetfinder, editorui, editorinspector, input) — all installed transitively when you import Luna. data and graphs are declared Luna dependencies as of 2.0.0; they power the catalog-keyed nav-graph navigation the shell runs on. No game-systems packages needed — for those, see GameFull.

❗ Import Essentials alongside. Showcase references theme/UXML/sprites/audio in the Essentials sample via sibling-relative paths (../../../../Essentials/...). Without Essentials imported, scenes load with broken images and styles.

Three entry points

`LunaShowcase.unity`

A complete game-style UI shell with tabs (Home, Heroes, Quests, Shop, Leaderboard), modals, overlays, and responsive layout switching. The driving controller is LunaShowcase (Flagship/Scripts/Screens/LunaShowcase.cs); the UXML it loads keeps its legacy GameUiHub.uxml filename (Flagship/UXML/Screens/GameUiHub.uxml).

The scene root hosts a NavHost that mounts Flagship/Navigation/ShowcaseNavGraphSO.asset and spawns every tab body / detail / modal prefab from it. Worth peeking at the wiring:

The bottom tab bar is a luna:TabView whose destinations UXML attribute carries the channel-root node ids in tab-button order — home.tab.home,home.tab.heroes,home.tab.quests,home.tab.shop,home.tab.leaderboard (Flagship/UXML/Components/Molecules/TabBar.uxml). Tab routing is owned by that attribute; the controller only plays the icon bounce.
The Shop tab nests its own channel-routing TabView (ShopTabs in Flagship/UXML/Screens/Tabs/ShopTab.uxml) with sub-channel destinations home.tab.shop.bundle, home.tab.shop.gold, home.tab.shop.items.
The gear menu's Log Out flow shows a typed modal result: await LunaNavigation.PushAsync<bool>(_confirmModalDest, new ConfirmModalArgs { ... }), then checks result.IsDismissed / result.Value. Destinations on the controller are CatalogKey fields constrained with [CatalogKeyConstraint(NavConstants.NavDestinationCatalogId)].

Open LunaShowcase.unity for the headline demo. Hit Play, click around the tabs, open modals.

`LunaStorybook.unity`

A single sidebar-driven scene that consolidates the simple per-component showcases (Toggle, Slider, Buttons, ListView, etc.) — no more flipping through 25 separate scenes. Pick a component on the left to preview it on the right.

Open LunaStorybook.unity. The recommended browse-it-fast entry point for new users.

See Samples~/Showcase/LunaStorybook/README.md (in the imported Showcase sample) for the underlying view code and how to add a new entry.

`Components/`

Specials-only — distinctive variants and feature demos that need their own scene because they show scene-level wiring (camera, multiple inputs, layout responsiveness, composite demos). Flat layout — no cluster prefixes. Every row links the docs page that explains how to replicate what the scene shows; all scenes need only Luna + Essentials unless the row says otherwise.

Folder	Scenes	Feature docs
`Burn/`	BurnDemo (card burn/dissolve + re-form)	UI Effects
`DragAndDrop/`	DragAndDropDemoWorldSpace	Drag & Drop
`Effects/`	EffectsPlayground, EffectsPresets, EffectsProgression, EffectsShowcase (+ shared `EffectsFlair.uxml` used by Storybook)	UI Effects
`GridView/{GridViewListView,GridViewPagination}/`	GridViewListResponsiveDemo, GridViewPaginationResponsiveDemo	GridView, Responsive
`InputPrompt/`	InputPromptLocalMultiplayer	Input Prompt
`Juice/{ProgressBarJuice,UICue}/`	ProgressBarJuiceDemo (bar/tooltip/tab/cooldown juice + interaction-juice profiles), UICueDemo (UI Cue binder: profile button feel, ValueChanged gates, ScreenEnter stagger, custom cue + UIRender burst)	Interaction Juice, UI Cue
`LoadingScreen/`	LoadingScreen	Loading
`LoadingTransitionMasking/`	LoadingTransitionMasking	Loading, Masking
`Occlusion/`	OcclusionDemo (multi-depth Overlay Opaque: stacked fullscreen layers, live timers + state widgets proving covered screens stay alive)	Occlusion
`Pagination/`	PaginationDemo	Pagination
`ProgressBar/{LeagueOfLegends,MultiPass,Overwatch}/`	ProgressBarLeagueOfLegends, ProgressBarMultiPassDemo, ProgressBarOverwatch, ProgressBarOverwatchCelled	Progress Bar
`RadialProgressBar/`	RadialProgressBarMultiSegmentDemo, RadialProgressBarOverwatch, RadialProgressBarOverwatchNoCells, RadialProgressBarSweepAngleDemo	Radial Progress Bar
`ResponsiveDemo/`	ResponsiveDemo	Responsive
`RPGDemo/`	RPGDemo — requires Unity's UGUI Shader Samples (`Window > Package Manager > Unity UI > Samples > Import`), or materials render pink/solid	RPG Demo
`Spotlight/`	SpotlightFocus, SpotlightTour	Spotlight
`Tooltip/`	TooltipDemoWorldSpace, TooltipNestedDemo, TooltipUpdateDemo	Tooltip
`TransitionAnimation/`	TransitionPresetGallery	Transition Animation
`UIAttractor/`	UIAttractorDemo	UI Attractor
`UIRender/`	UIRenderDemoCharacters, UIRenderDemoHero (animated 3D hero inline in UI), UIRenderDemoOverlay	UI Render

Note: no LocalizationDemo scene ships in the Showcase sample. Luna's only bundled locale artifact is Essentials/Theme/LocalizedStyles.uss (a .locale-ja block that repoints the --font-* tokens to the Japanese SDF font bundled at Essentials/Theme/Fonts/dela-gothic-one/). At runtime LocalizationViewStyleSwitcher applies a locale-<code> USS class to every UIView when the active locale changes — a per-locale style/font swap, not Unity Localization string-table data. Wiring actual Unity Localization (Locale list, String Tables, LocalizedString bindings) is your job.

Refer to the Components section in the sidebar for per-component API documentation.

Companion: Essentials sample

Shared theme tokens, fonts, panel settings, UXML primitives, sprites, audio, demo prefabs, and helper scripts live in the Essentials sample (Samples~/Essentials/):

Essentials/
├── README.md                  ← Start-here landing page
├── Audio/                     — shared demo audio (clicks, mixer)
├── Effects/                   — Luna filter shader assets
├── Input/                     — input action map + Luna icon database
├── Navigation/                — LunaNavConfigSO.asset + LunaNavConfigSOWorldSpace.asset (render configs NavHost applies to spawned views)
├── Prefabs/                   — LunaUIManager.prefab (the bootstrap manager)
├── ScriptableObjects/         — transition presets
├── Scripts/                   — shared demo helpers (TooltipDatabaseExample)
├── Sprites/socials/           — Discord / Steam social-button icons (used by Showcase + GameFull main menus)
├── Theme/                     — design system: fonts, colors, panel settings, USS tokens
└── UXML/
    ├── Components/            — reusable UXML primitives (ChoicePopup, Tooltip, Pagination, Notification, SaveLoad, ReturnButton)
    └── Modal.uss              — shared modal stylesheet

These are also referenced by the GameFull sample via sibling-relative paths. When all samples are imported they live as siblings under Assets/Samples/LunaUI/<version>/ and the relative refs resolve cleanly.