Dialog-Stapel — component.dialog-stack

Componentv1.0.0Overlayweb.documentweb.applicationdesktop.shellbuilder.preview

Beispiele

Dreistufiger Assistent (Weiter stapelt die Ebenen sichtbar)

Eigenschaften

Prop	Typ	Default
`openerLabel`	string	`"Assistent starten"`
`finishLabel`	string	`"Fertigstellen"`
`steps *`	array	`—`

Events & Slots

Events: step, finish

Stellschrauben (Komponenten-Tokens)

Token	Default
`--dialog-stack-action-on-primary`	`var(--color-action-on-primary)`
`--dialog-stack-action-on-secondary`	`var(--color-action-on-secondary)`
`--dialog-stack-action-primary`	`var(--color-action-primary)`
`--dialog-stack-action-primary-hover`	`var(--color-action-primary-hover)`
`--dialog-stack-action-secondary`	`var(--color-action-secondary)`
`--dialog-stack-action-secondary-border`	`var(--color-action-secondary-border)`
`--dialog-stack-border-default`	`var(--color-border-default)`
`--dialog-stack-elevation-overlay`	`var(--elevation-overlay)`
`--dialog-stack-radius-control`	`var(--radius-control)`
`--dialog-stack-radius-overlay`	`var(--radius-overlay)`
`--dialog-stack-surface-backdrop`	`var(--color-surface-backdrop)`
`--dialog-stack-surface-overlay`	`var(--color-surface-overlay)`
`--dialog-stack-surface-sunken`	`var(--color-surface-sunken)`
`--dialog-stack-text-default`	`var(--color-text-default)`
`--dialog-stack-text-muted`	`var(--color-text-muted)`

Genutzte Design-Tokens

border.hairline color.action.on-primary color.action.on-secondary color.action.primary color.action.primary-hover color.action.secondary color.action.secondary-border color.border.default color.surface.backdrop color.surface.overlay color.surface.sunken color.text.default color.text.muted duration.fast easing.standard elevation.overlay font.family.default layer.modal leading.base radius.control radius.overlay size.2 size.32 size.4 size.5 size.8 text.lg text.md text.sm text.xs weight.semibold