page Typographycomponent { seo { title = "Typography component" description = "Theme-aware, responsive typography component." } view {
W WRNexusJS
layout component

Typography

Theme-aware, responsive typography component.

@wrnexus/ui 0.3.66 props1 slots0 events

Usage

Components are auto-discovered. Use the component directly in any .wrn view:

<Typography
  size="default"
  color="primary"
  columns="2"
  gap="md"
  maxWidth="xl"
/>

Legacy mount name: data-component="Typography".

Props and attributes

PropTypeRequirementDefault
sizestringOptional"default"
colorstringOptional"primary"
columnsnumberOptional2
gapstringOptional"md"
maxWidthstringOptional"xl"
classstringOptional""

Slots

  • default

Events

This component does not declare a custom event.

Source contract

Installed source: components/Typography.wrn

component Typography {
  props {
    size = "default"
    color = "primary"
    columns = 2
    gap = "md"
    maxWidth = "xl"
    class = ""
  }
  view {
        <article class="wire-next wire-next--color-{color} wire-next--size-{size} wire-next--typography wire-next--gap-{gap} wire-next--columns-{columns} wire-next--max-{maxWidth} {class}">
        <slot />
        </article>
    }
}
} }