BwViewManager | bw-view-manager

Overview

The view manager is used to manage multiple bw-views. It allows you to easily create advanced wizards or nested form flows by managing the animations, wizard steps, and breadcrumbs.

For examples on how to setup a view manager, read the wizard tutorial.

Properties

Property	Attribute	Description	Type	Default
`crumbs`	--	The initial state of the breadcrumbs	`string[]`	`[]`
`steps`	--	The initial state of the wizard	`WizardStep[]`	`[]`
`value`	`value`	The label of the initial view that should be displayed	`string`	`undefined`

Events

Event	Description	Type
`viewChange`	Emits when the view changed view navigation method or a data-view-link attribute	`CustomEvent<{ from: string; to: string; }>`
`viewMount`	Emits when a view is manually mounted via the value property	`CustomEvent<string>`

Methods

`navigate(value: string, direction: "forwards" | "backwards", isCrumb: boolean, wizardAction: "next" | "skip" | "previous" | "reset" | undefined) => Promise<void>`

Triggers a view change animation. Prefer navigating between views using [data-view-*] attributes over calling this method directly.

Parameters

Name	Type	Description
`value`	`string`	The label of the next view that should be displayed
`direction`	`"backwards" \| "forwards"`	The type of animation that should show
`isCrumb`	`boolean`	whether or not the view should cause an update to the breadcrumbs. If direction is forwards, it will add the label of the view to the crumbs, if backwards it will pop labels off the crumbs until it gets to the next view
`wizardAction`	`"next" \| "reset" \| "previous" \| "skip"`	A method to trigger on the views' wizard

Returns

Type: Promise<void>

Dependencies

Depends on

bw-discard-form

Overview​

Properties​

Events​

Methods​

navigate(value: string, direction: "forwards" | "backwards", isCrumb: boolean, wizardAction: "next" | "skip" | "previous" | "reset" | undefined) => Promise<void>​

Parameters​

Returns​

Dependencies​

Depends on​

Graph​