UISplitTextProps

Defined in: ui/src/types.ts:269

Props for UISplitText (used by reconciler and props-driven constructor).

Extends

LayoutProps.ConsumeInputProps.PointerEventProps

Properties

alignSelf?

optional alignSelf?: "stretch" | "auto" | "flex-start" | "center" | "flex-end" | "baseline"

Defined in: ui/src/types.ts:137

Inherited from

LayoutProps.alignSelf

autoSplit?

optional autoSplit?: boolean

Defined in: ui/src/types.ts:291

Re-split automatically on text / style change. Default true. Set false and call resplit() to batch edits into one layout pass.

bitmap?

optional bitmap?: boolean

Defined in: ui/src/types.ts:280

Render the segments with a bitmap font (SplitBitmapText) instead of canvas Text (SplitText). Pass the installed/baked font name as style.fontFamily (and glyph size as style.fontSize).

bottom?

optional bottom?: PositionValue

Defined in: ui/src/types.ts:163

Offset from the containing block’s bottom edge — px or "<n>%" (only applies to position: "absolute").

Inherited from

LayoutProps.bottom

charAnchor?

optional charAnchor?: SegmentAnchor

Defined in: ui/src/types.ts:282

Transform origin (0–1) each character rotates / scales about. Default 0.

children?

optional children?: string

Defined in: ui/src/types.ts:273

consumeInput?

optional consumeInput?: boolean

Defined in: ui/src/types.ts:209

Inherited from

ConsumeInputProps.consumeInput

flex?

optional flex?: number

Defined in: ui/src/types.ts:136

Shorthand for the common CSS flex: <number> case — expands to flexGrow: <number>, flexShrink: 1, flexBasis: 0. Use it for a child that should fill the remaining main-axis space (e.g. the text column between a fixed icon and a fixed button): sizing from a 0 basis means it won’t claim its content width and push its siblings, and its text wraps cleanly. Prefer this over flexGrow: 1 alone, which keeps flexBasis: auto (content width) and overflows. Explicit flexGrow/flexShrink/flexBasis override the parts this expands to.

Inherited from

LayoutProps.flex

flexBasis?

optional flexBasis?: LayoutValue

Defined in: ui/src/types.ts:125

Inherited from

LayoutProps.flexBasis

flexGrow?

optional flexGrow?: number

Defined in: ui/src/types.ts:123

Inherited from

LayoutProps.flexGrow

flexShrink?

optional flexShrink?: number

Defined in: ui/src/types.ts:124

Inherited from

LayoutProps.flexShrink

height?

optional height?: LayoutValue

Defined in: ui/src/types.ts:115

Inherited from

LayoutProps.height

left?

optional left?: PositionValue

Defined in: ui/src/types.ts:157

Offset from the containing block’s left edge — px or "<n>%" (only applies to position: "absolute").

Inherited from

LayoutProps.left

lineAnchor?

optional lineAnchor?: SegmentAnchor

Defined in: ui/src/types.ts:286

Transform origin (0–1) each line rotates / scales about. Default 0.

margin?

optional margin?: number | { bottom?: number; left?: number; right?: number; top?: number; }

Defined in: ui/src/types.ts:120

Inherited from

LayoutProps.margin

maxHeight?

optional maxHeight?: LayoutValue

Defined in: ui/src/types.ts:119

Inherited from

LayoutProps.maxHeight

maxWidth?

optional maxWidth?: LayoutValue

Defined in: ui/src/types.ts:117

Inherited from

LayoutProps.maxWidth

minHeight?

optional minHeight?: LayoutValue

Defined in: ui/src/types.ts:118

Inherited from

LayoutProps.minHeight

minWidth?

optional minWidth?: LayoutValue

Defined in: ui/src/types.ts:116

Inherited from

LayoutProps.minWidth

onHover?

optional onHover?: (hovering) => void

Defined in: ui/src/types.ts:231

Parameters

hovering

boolean

Returns

void

Inherited from

PointerEventProps.onHover

onPointerOut?

optional onPointerOut?: () => void

Defined in: ui/src/types.ts:230

Returns

void

Inherited from

PointerEventProps.onPointerOut

onPointerOver?

optional onPointerOver?: () => void

Defined in: ui/src/types.ts:229

Returns

void

Inherited from

PointerEventProps.onPointerOver

position?

optional position?: "relative" | "absolute"

Defined in: ui/src/types.ts:155

Positioning mode for this element relative to its parent. Defaults to "relative" — the element flows in the parent’s flex layout. Set to "absolute" to lift the element out of the flow and pin it via left / top / right / bottom against the parent’s content box.

A position: "relative" ancestor acts as the containing block for any absolute-positioned descendants — useful for HUD overlays, modal backdrops, and badge markers. See <ZStack> in @yagejs/ui-react for an opinionated overlay primitive.