Toast
The props declared for Toast, generated from the types @proyecto-viviana/ui ships.
Import
import { Toast } from "@proyecto-viviana/ui";Props
| Prop | Type | Default | Description |
|---|---|---|---|
class | string | — | Additional CSS class name. |
index | Accessor<number> | — | Internal index accessor used by ToastRegion for S2 stack rendering. |
visibleToasts | Accessor<QueuedToast<HeadlessToastContent>[]> | — | Internal visible toasts accessor used by ToastRegion for S2 stack rendering. |
isExpanded | Accessor<boolean> | — | Internal expanded stack state accessor used by ToastContainer. |
onToggleExpanded | () => void | — | Internal stack expansion handler used by ToastContainer. |
canExpand | false | true | — | Whether a ToastContainer is present to drive stack expansion. When false (a bare ToastRegion, which has no expand/collapse context), the collapsed-stack "Show all" affordance is hidden because it cannot be honored — mirroring the upstream split where ToastContainer, not the low-level region, owns expansion. |
placementEdge | 'top' | 'bottom' | — | Internal placement edge used for collapsed background stack positioning. |
placementAlign | 'end' | 'center' | — | Internal placement alignment used for the toast's view-transition-class. |
children | number | boolean | RenderedElement | ArrayElement | (string & {}) | Node | JSX.ArrayElement | ((renderProps: ToastRenderProps) => JSX.Element) | — | The children of the component - can be JSX or render function. solidaria-components |
ref | HTMLElement | ((el: HTMLElement) => void) | { current?: HTMLElement | null | undefined; } | RefLike<HTMLElement>[] | — | Optional ref for the toast root element. solidaria-components |
id | string | — | DOM id for the toast root. solidaria-components |
aria-describedby | string | — | Identifies the element (or elements) that describes the object. solidaria |
aria-details | string | — | Identifies the element (or elements) that provide a detailed, extended description for the object. solidaria |
aria-label | string | — | Defines a string value that labels the current element. solidaria |
aria-labelledby | string | — | Identifies the element (or elements) that labels the current element. solidaria |
toast* | QueuedToast<ToastContent> | — | The toast data. solidaria-components |
Declared in packages/viviana-ui/src/toast/index.tsx.
ToastContainer props
| Prop | Type | Default | Description |
|---|---|---|---|
PRIVATE_forceReducedMotion | false | true | — | Forces reduced-motion toast animations regardless of the user's `prefers-reduced-motion` setting. Mirrors |
placement | 'top' | 'bottom' | 'bottom end' | 'top end' | "bottom" | Placement of the toast container on the page. |
class | string | — | Additional CSS class name. |
ref | HTMLElement | ((el: HTMLElement) => void) | { current?: HTMLElement | null | undefined; } | RefLike<HTMLElement>[] | — | Optional ref for the region element. solidaria-components |
aria-label | string | — | Accessible label for the region. solidaria-components |
state | ToastState<ToastContent> | — | The toast state to display. If not provided, uses ToastContext. solidaria-components |
portal | false | true | — | Whether to render in a portal. solidaria-components |
Declared in packages/viviana-ui/src/toast/index.tsx.
ToastProvider props
| Prop | Type | Default | Description |
|---|---|---|---|
children* | JSX.Element | — | The children of the provider. solidaria-components |
queueOptions | ToastQueueOptions | — | Custom toast queue options. solidaria-components |
useGlobalQueue | false | true | — | Use global queue instead of creating a new one. solidaria-components |
Declared in packages/viviana-ui/src/toast/index.tsx.
ToastRegion props
| Prop | Type | Default | Description |
|---|---|---|---|
placement | 'top' | 'bottom' | 'bottom end' | 'top end' | "bottom" | Placement of the toast container on the page. |
class | string | — | Additional CSS class name. |
ref | HTMLElement | ((el: HTMLElement) => void) | { current?: HTMLElement | null | undefined; } | RefLike<HTMLElement>[] | — | Optional ref for the region element. solidaria-components |
aria-label | string | — | Accessible label for the region. solidaria-components |
state | ToastState<ToastContent> | — | The toast state to display. If not provided, uses ToastContext. solidaria-components |
portal | false | true | — | Whether to render in a portal. solidaria-components |
Declared in packages/viviana-ui/src/toast/index.tsx.
Props marked solidaria or solidaria-components come from the headless layer underneath and behave the same in both registers. Components that wrap a DOM element also accept that element's standard attributes, which are left out here on purpose — listing them would bury the props that are actually ours.