StandardDialogNext

Portable dialog chrome composed from core-contract primitives on ModalBoundary

import { StandardDialogNext } from "@roku-sdk/components/standard-dialog-next";

StandardDialogNext(props: IStandardDialogNextProps): JSX.Element

Description

Portable dialog chrome composed from core-contract primitives on ModalBoundary. Use instead of StandardDialog when the app must stay within the portable core-contract elements.

Parameters

Name	Type	Description
`props`	IStandardDialogNextProps

Types

IStandardDialogNextProps

Portable dialog built from core-contract primitives on ModalBoundary. Prefer this over StandardDialog when using the portable core contract.

The intended successor to StandardDialog, hence the name: it is the same kind of component -- a themed dialog with a title, a body and a row of buttons -- but composed from the frozen primitive subset instead of the native SceneGraph dialog node, so it renders on every target rather than on device only. The two ship side by side while apps migrate; Next collapses into the base name once the SceneGraph implementation is retired.

The props are deliberately close to IStandardDialogProps but not identical -- see IStandardDialogNextPaletteColors for the palette fields that have no counterpart in primitive-composed chrome.

Name	Type	Description
`buttons?`	`IStandardDialogNextButton[]`
`children?`	`Element`	Custom body, replacing `text`. See below.
`contentHeight?`	`number`	Height reserved for `children`, in FHD units. Ignored when `children` is absent.
`focusId?`	`object`	Stable focus identity shared with `useModal().focusId` when opening via `open()`. Required when the dialog participates in virtual-focus modality.
`initialButtonIndex?`	`number`	Which button receives initial focus.
`onButtonSelected?`	`(index: number) => void`
`onClosed?`	`() => void`	Fires at most once per open cycle (button, Back, or programmatic close).
`onDismiss?`	`() => void`	Back / dismissKeys path before `onClosed`.
`palette?`	`IStandardDialogNextPaletteColors`
`show`	`boolean`	Whether the dialog is visible. Wire to `useModal().isOpen()` or app state.
`text?`	`string`	Plain-text body when `children` is not provided. Ignored when `children` is.
`title?`	`string`
`width?`	`number`	Panel width in FHD space.

IStandardDialogNextProps.children

Custom body, replacing text. Rendered in the panel's content region, so its own coordinates start at the left margin below the title rule rather than at the panel corner.

Nothing here can measure a subtree, so pass contentHeight as well — without it the content region is zero-height and the buttons are laid out over the top of the children.

IStandardDialogNextButton

Name	Type	Description
`text`	`string`

IStandardDialogNextPaletteColors

Colour bag matching the native StandardDialog palette fields that StandardDialogNext chrome draws.

Only the fields this component actually reads are here. StandardDialog's dialogItemColor and dialogFootprintColor have no counterpart in the chrome composed from core-contract primitives, and declaring them would invite a caller to set a colour that silently does nothing.

Name	Type	Description
`dialogBackgroundColor?`	`string`	Panel fill.
`dialogFocusColor?`	`string`	Fill of the focused button.
`dialogFocusItemColor?`	`string`	Label on the focused button.
`dialogSecondaryItemColor?`	`string`	Fill of an unfocused button, and the rule under the title.
`dialogSecondaryTextColor?`	`string`	Body text.
`dialogTextColor?`	`string`	Title text, and the label on an unfocused button.