Guide
First step
Add your rooms
Each room you add here can be booked on its own, with its own hours and price.
1 of 3
Last step
Invite your caretaker
The people you invite see the bookings for the rooms you share with them.
3 of 3
Source
let step = number => KitReact.Amount.count(Specimen_Reader.reader, number)
@react.component
let make = () =>
<>
<details>
<summary> {React.string("First step")} </summary>
<KitReact.Roles.SecondaryAction props={{ariaDetails: "role-guide-rooms"}}> {React.string("Add a room")} </KitReact.Roles.SecondaryAction>
<KitReact.Roles.Guide id="role-guide-rooms" place={step(1)} count={step(3)}
heading={React.string("Add your rooms")}
next={{children: React.string("Next")}}
dismiss={{children: React.string("Dismiss")}}>
<p> {React.string("Each room you add here can be booked on its own, with its own hours and price.")} </p>
</KitReact.Roles.Guide>
</details>
<details>
<summary> {React.string("Last step")} </summary>
<KitReact.Roles.SecondaryAction props={{ariaDetails: "role-guide-invite"}}> {React.string("Invite someone")} </KitReact.Roles.SecondaryAction>
<KitReact.Roles.Guide id="role-guide-invite" place={step(3)} count={step(3)}
heading={React.string("Invite your caretaker")}
back={{children: React.string("Back")}}
next={{children: React.string("Done")}}
dismiss={{children: React.string("Dismiss")}}>
<p> {React.string("The people you invite see the bookings for the rooms you share with them.")} </p>
</KitReact.Roles.Guide>
</details>
</>
Guide, inert
First step while the room saves
Add your rooms
Each room you add here can be booked on its own, with its own hours and price.
1 of 3
Next waits until the room has saved.
Last step while the invitation sends
Invite your caretaker
The people you invite see the bookings for the rooms you share with them.
3 of 3
Back waits until the invitation has sent.
Done waits until the invitation has sent.
Source
let step = number => KitReact.Amount.count(Specimen_Reader.reader, number)
@react.component
let make = () =>
<>
<details>
<summary> {React.string("First step while the room saves")} </summary>
<KitReact.Roles.SecondaryAction props={{ariaDetails: "role-guide-inert-rooms"}}> {React.string("Add a room")} </KitReact.Roles.SecondaryAction>
<KitReact.Roles.Guide id="role-guide-inert-rooms" place={step(1)} count={step(3)}
heading={React.string("Add your rooms")}
next={{children: React.string("Next"), state: Inert({id: "role-guide-inert-next", words: [KitReact.Words.Text("Next waits until the room has saved.")]})}}
dismiss={{children: React.string("Dismiss")}}>
<p> {React.string("Each room you add here can be booked on its own, with its own hours and price.")} </p>
</KitReact.Roles.Guide>
</details>
<details>
<summary> {React.string("Last step while the invitation sends")} </summary>
<KitReact.Roles.SecondaryAction props={{ariaDetails: "role-guide-inert-invite"}}> {React.string("Invite someone")} </KitReact.Roles.SecondaryAction>
<KitReact.Roles.Guide id="role-guide-inert-invite" place={step(3)} count={step(3)}
heading={React.string("Invite your caretaker")}
back={{children: React.string("Back"), state: Inert({id: "role-guide-inert-back", words: [KitReact.Words.Text("Back waits until the invitation has sent.")]})}}
next={{children: React.string("Done"), state: Inert({id: "role-guide-inert-done", words: [KitReact.Words.Text("Done waits until the invitation has sent.")]})}}
dismiss={{children: React.string("Dismiss")}}>
<p> {React.string("The people you invite see the bookings for the rooms you share with them.")} </p>
</KitReact.Roles.Guide>
</details>
</>