// Generated by scripts/generate-showcase.mjs. Do not edit directly. page LayoutShowcase { layout = "showcase" seo { title = "Layout components" description = "17 layout components from @wrnexus/ui." } view {
Component category

Layout

17 unique, responsive, theme-aware components. Open a component to inspect multiple live configurations and its complete props API.

17 componentsMultiple use cases51 live configurations
aside-extra slot
form slot
Layout

Auth Split Layout

Responsive 50/50 authentication layout with content and form regions.

8 props · 2 slotsExplore component
Layout

Columns

Theme-aware, responsive columns component.

6 props · 1 slotsExplore component
Composable content area.
Layout

Container

Theme-aware, responsive container component.

6 props · 1 slotsExplore component
Layout

Custom Scrollbar

Theme-aware, responsive custom scrollbar component.

6 props · 1 slotsExplore component
Layout

Divider

Theme-aware, responsive divider component.

5 props · 0 slotsExplore component
Layout

Feature Grid

Responsive equal-height grid for feature and service cards.

11 props · 1 slotsExplore component
Layout

Grid

Theme-aware, responsive grid component.

6 props · 1 slotsExplore component
Layout

Image

Theme-aware, responsive image component.

9 props · 1 slotsExplore component
Layout

Kbd

Theme-aware, responsive kbd component.

4 props · 1 slotsExplore component
Layout

Layout Splitter

Theme-aware, responsive layout splitter component.

6 props · 1 slotsExplore component
Layout

Link

Theme-aware, responsive link component.

8 props · 1 slotsExplore component
Layout

Metric Grid

Responsive collection of metric cards.

11 props · 1 slotsExplore component
before slot
after slot
Layout

Public Page Shell

Consistent structural wrapper for public-facing pages.

10 props · 3 slotsExplore component
Composable content area.
Layout

Section

Theme-aware page section with consistent spacing, width, background, and border controls.

10 props · 1 slotsExplore component
icon slot
actions slot
Layout

Section Header

Reusable accessible section heading with eyebrow, title, description, icon, and actions.

10 props · 3 slotsExplore component
Layout

Text Link

Styled inline action link with icons, arrows, external state, and disabled handling.

14 props · 0 slotsExplore component
Composable content area.
Layout

Typography

Theme-aware, responsive typography component.

6 props · 1 slotsExplore component
} }