kit

Row

Built revision v17.10.0

Phoenix
Topics

Human support

Bring a missing role, layout, or state, or a rendering against the standard, to the session working on kit. Name the package and the entry.

On Shell, Home, List, Record, Stepped flow, Settings, Find, Calendar, Help

Row

Two facts and the supporting line stay on desktop.

InvoiceStatusHirerAmount
INV-001Hire of Main Hall.
Awaiting payment
Priya Shah
£25.00

A closed question: Ava's answer is recorded and Ben has none.

Attendance is closed.
Attendance is closed.

Collection is closed. Clara has a recorded answer; Daniel has none.

Collected Collection is closed.
No answer recorded Collection is closed.

A room whose name opens its details.

Seats 40

Garden Room

Garden Room

Oakmere Primary SchoolAwaiting payment

Invoice

£84.00

4.5 from 38 reviews

Main Hall hire

Invoice details
Before you arrive

Ask @Aisha Khan to confirm the address for B-1042 Garden room before .
Read the hire terms first, then use 4721 at the gate.

  • Bring your own chairs.

  • Leave the hall by ten.

  1. Ring the bell by the side gate.

  2. Wait for the caretaker.

  • Done

    Deposit paid

  • Not done

    Key returned

The side door sticks in the cold.

Gate: 4721
Alarm: 0990

Floor plan: garden-room-plan.pdf

Oakmere WI1 invoice awaiting correction: the March hire was billed at the weekday rate and the committee has asked for it to be reissued at the weekend rate for the Saturday sessionsDue

Invoiced: £84.00 · Collected: £24.00 · Outstanding: £60.00 · payment expected after the hirer confirms the billing address, purchase order and named contact for Saturday’s Main Hall bookingPart payment taken by card on ; the balance stays outstanding until the reissued invoice is agreed, and the deposit is held against the Garden Room key that has not come back

Oakmere WI
Your invoice is readyAddress refused

Sent to aisha@oakmereprimary.org · 

Invited Wed · not yet accepted

Details
Sent to
Priya Shah
Email
priya@stannesscouts.org

Wednesday · Main Hall

Wednesday · Main Hall

Thursday · Garden Room

Ballroom beginners · 1:30 am

Which 1:30 am The clocks go back at 2 am, so 1:30 am happens twice. Choose which 1:30 am the class starts.

Tuesday · Main Hall

It goes to the hall’s address.
Hartley ScoutsAwaiting payment

Invoice

£126.00

Invoice resent to treasurer@hartleyscouts.org.uk.

A Row of several separate facts that wrap as whole facts.

Hirer: Priya Shah

Day: Saturday

Seats: 40

Deposit: £50.00

Balance: £34.00

Key: with the caretaker

Cleaning: booked

A supporting line of long words that ends in a time.

A run at the Desk width: one Row folds its actions into More, and one without More wraps them.

Invitations

St Anne’s Scout GroupAwaiting payment

Invited Mon · not yet accepted

Oakmere Primary SchoolAwaiting payment

Invited Tue · not yet accepted

Payment reminder sent to the school office.

A run whose Rows each hold an inert action and its words.

Meetings

Main Hall · 

This booking is closed. Reopen it to move a meeting.

Main Hall · 

This booking is closed. Reopen it to move a meeting.

A Row at the Desk width whose actions wrap where no fold remains.

Invitation

A run at the Desk width whose Stamps wrap at their words where nothing else fits.

Bookings

Riverside Community ChoirHeld until the deposit and the first month’s hire are paid in full

Main Hall · Thursdays

Oakmere WIAwaiting payment

Garden Room · Saturdays

A question at the Desk width whose actions wrap where no fold remains.

Register

Wednesday · Main Hall

A question whose label wraps.

Thursday bookings

Thursday · Garden Room

A question whose act sends an email, its preview before the actions.

Teacher · Tuesday beginners

The invitation lasts 7 days.

aisha@oakmereprimary.org

The invitation, as Aisha will get it

Channel
Email to aisha@oakmereprimary.org
Subject
Teach at Oakmere Village Hall

Goes when you send it.

A question answered in a Dialog, with its whole Scope line.
Which location is this?To answer

Your answer sets the location for Monday’s choir rehearsal, Tuesday’s committee meeting and Thursday’s reading group.

Add a location

Garden Room
Oakmere Village Hall, High Street

An email as the subject.

accounts.receivable.northeast-region.billing@hartfordcommunitydancestudio.com

Sends the invoices

A web address as the subject.

venues.example.com/oakmere-primary-school-parents-association

Booking page

A person as the subject, with their availability.

An unread notification.

Show a row arriving
Source
<p class="specimen-case-line">Two facts and the supporting line stay on desktop.</p>
<div id="row-desktop-only">
  <Kit.Phoenix.Roles.Row.row id="desktop-facts-row">
    <:subject href="#role-row" supporting={[Kit.Phoenix.Supporting.line([Kit.Phoenix.Words.text("Hire of Main Hall.")]) |> Kit.Phoenix.Supporting.desktop_only()]}>INV-001</:subject>
    <:stamp><Kit.Phoenix.Roles.Stamp.stamp state="neutral">Awaiting payment</Kit.Phoenix.Roles.Stamp.stamp></:stamp>
    <:facts desktop_only>Hirer: Priya Shah</:facts>
    <:facts desktop_only>Amount: <Kit.Phoenix.Roles.Amount.amount value={Kit.Phoenix.Amount.money(reader(), Money.new(:GBP, "25.00"))} /></:facts>
  </Kit.Phoenix.Roles.Row.row>
  <div class="specimen-table-contained">
    <Kit.Phoenix.Table.rows_table>
      <:subject_heading label="Invoice" />
      <:column_headings label="Status">Status</:column_headings>
      <:column_headings label="Hirer">Hirer</:column_headings>
      <:column_headings label="Amount" kind="amount">Amount</:column_headings>
      <:row rest={%{id: "desktop-facts-record"}} subject_supporting={[Kit.Phoenix.Supporting.line([Kit.Phoenix.Words.text("Hire of Main Hall.")]) |> Kit.Phoenix.Supporting.desktop_only()]} facts={[
        %Kit.Phoenix.Table.FactCell{content: Kit.Phoenix.Table.Fact.content(~H(<Kit.Phoenix.Roles.Stamp.stamp state="neutral">Awaiting payment</Kit.Phoenix.Roles.Stamp.stamp>))},
        %Kit.Phoenix.Table.FactCell{content: Kit.Phoenix.Table.Fact.content("Priya Shah"), desktop_only: true},
        %Kit.Phoenix.Table.FactCell{content: Kit.Phoenix.Table.Fact.words([Kit.Phoenix.Words.amount(Kit.Phoenix.Amount.money(reader(), Money.new(:GBP, "25.00")))]), desktop_only: true}
      ]}><a href="#role-row">INV-001</a></:row>
    </Kit.Phoenix.Table.rows_table>
  </div>
</div>
<p class="specimen-case-line">A closed question: Ava's answer is recorded and Ben has none.</p>
<div id="row-closed-choices">
  <Kit.Phoenix.Roles.Row.row choices_reason="Attendance is closed.">
    <:subject href="#role-row" rest={%{id: "row-closed-ava"}}>Ava Patel</:subject>
    <:choices checked control_rest={%{value: "present", disabled: true}} printed_value="Chosen">Present</:choices>
    <:choices control_rest={%{value: "absent", disabled: true}} printed_value="Not chosen">Absent</:choices>
  </Kit.Phoenix.Roles.Row.row>
  <Kit.Phoenix.Roles.Row.row choices_reason="Attendance is closed.">
    <:subject href="#role-row" rest={%{id: "row-closed-ben"}}>Ben Lewis</:subject>
    <:choices control_rest={%{value: "present", disabled: true}} printed_value="Not chosen">Present</:choices>
    <:choices control_rest={%{value: "absent", disabled: true}} printed_value="Not chosen">Absent</:choices>
  </Kit.Phoenix.Roles.Row.row>
</div>
<p class="specimen-case-line">Collection is closed. Clara has a recorded answer; Daniel has none.</p>
<div id="row-closed-fields">
  <Kit.Phoenix.Roles.Row.row>
    <:subject href="#role-row">Clara Webb</:subject>
    <:question>
      <Kit.Phoenix.Roles.FormGroup.form_group id="row-closed-clara" kind={Kit.Phoenix.Roles.FormGroup.Kind.select()} control_value="collected" control_rest={%{name: "collection-clara", disabled: true}}>
        <:label>Collection</:label>
        <:option value="">Not recorded</:option><:option value="collected">Collected</:option><:option value="not-collected">Not collected</:option>
        <:printed_value>Collected</:printed_value>
        <:reason>Collection is closed.</:reason>
      </Kit.Phoenix.Roles.FormGroup.form_group>
    </:question>
  </Kit.Phoenix.Roles.Row.row>
  <Kit.Phoenix.Roles.Row.row>
    <:subject href="#role-row">Daniel Reed</:subject>
    <:question>
      <Kit.Phoenix.Roles.FormGroup.form_group id="row-closed-daniel" kind={Kit.Phoenix.Roles.FormGroup.Kind.select()} control_value="" control_rest={%{name: "collection-daniel", disabled: true}}>
        <:label>Collection</:label>
        <:option value="">Not recorded</:option><:option value="collected">Collected</:option><:option value="not-collected">Not collected</:option>
        <:printed_value>No answer recorded</:printed_value>
        <:reason>Collection is closed.</:reason>
      </Kit.Phoenix.Roles.FormGroup.form_group>
    </:question>
  </Kit.Phoenix.Roles.Row.row>
</div>
<p class="specimen-case-line">A room whose name opens its details.</p>
<Kit.Phoenix.Roles.Row.row>
  <:subject dialog="row-room-dialog" rest={%{id: "row-room-opener"}}>Garden Room</:subject>
  <:facts>Seats <Kit.Phoenix.Roles.Amount.amount value={Kit.Phoenix.Amount.count(reader(), 40)} /></:facts>
</Kit.Phoenix.Roles.Row.row>
<Kit.Phoenix.Roles.Dialog.dialog id="row-room-dialog" return_focus="row-room-opener" aria-labelledby="row-room-dialog-title">
  <:heading rest={%{id: "row-room-dialog-title"}}>Garden Room</:heading>
  <:form_groups><form id="row-room-form">
    <Kit.Phoenix.Roles.FormGroup.form_group kind={Kit.Phoenix.Roles.FormGroup.Kind.text(:medium)} id="row-room-name-group" control_rest={%{id: "row-room-name", name: "name", type: "text", value: "Garden Room"}}>
      <:label rest={%{for: "row-room-name"}}>Room name</:label><:printed_value>Garden Room</:printed_value>
    </Kit.Phoenix.Roles.FormGroup.form_group>
  </form></:form_groups>
  <:primary_action rest={%{type: "submit", form: "row-room-form"}}>Save room</:primary_action>
  <:secondary_action>Cancel</:secondary_action>
</Kit.Phoenix.Roles.Dialog.dialog>
<Kit.Phoenix.Roles.Row.row>
  <:selection>
    <Kit.Phoenix.Roles.SelectionControl.selection_control name="record" value="oak" /><span>Select Oakmere Primary School</span>
  </:selection>
  <:subject href="#role-row">Oakmere Primary School</:subject>
  <:stamp><Kit.Phoenix.Roles.Stamp.stamp state="neutral">Awaiting payment</Kit.Phoenix.Roles.Stamp.stamp></:stamp>
  <:facts>Invoice</:facts>
  <:facts><Kit.Phoenix.Roles.Amount.amount value={Kit.Phoenix.Amount.money(reader(), Money.new(:GBP, "84.00"))} /></:facts>
  <:facts><Kit.Phoenix.Roles.Rating.shown score={Kit.Phoenix.Amount.score(reader(), Decimal.new("4.5"), 1)} words={[Kit.Phoenix.Words.amount(Kit.Phoenix.Amount.score(reader(), Decimal.new("4.5"), 1)), Kit.Phoenix.Words.text(" from "), Kit.Phoenix.Words.amount(Kit.Phoenix.Amount.count(reader(), 38)), Kit.Phoenix.Words.text(" reviews")]} spoken={[Kit.Phoenix.Words.amount(Kit.Phoenix.Amount.score(reader(), Decimal.new("4.5"), 1)), Kit.Phoenix.Words.text(" out of "), Kit.Phoenix.Words.amount(Kit.Phoenix.Amount.count(reader(), 5)), Kit.Phoenix.Words.text(", from "), Kit.Phoenix.Words.amount(Kit.Phoenix.Amount.count(reader(), 38)), Kit.Phoenix.Words.text(" reviews")]} /></:facts>
  <:actions>
    <Kit.Phoenix.Roles.SecondaryAction.secondary_action>Withdraw</Kit.Phoenix.Roles.SecondaryAction.secondary_action>
  </:actions>
</Kit.Phoenix.Roles.Row.row>
<Kit.Phoenix.Roles.Row.row>
  <:selection>
    <Kit.Phoenix.Roles.SelectionControl.selection_control name="record" value="north" /><span>Select Oakmere Primary School invoice</span>
  </:selection>
  <:subject href="#role-row">Oakmere WI</:subject>
  <:facts>Main Hall hire</:facts>
  <:expansion_summary>Invoice details</:expansion_summary>
  <:expansion authored_text={%Kit.Phoenix.AuthoredText.Shown{value: %Kit.Phoenix.AuthoredText{content: [ {:heading, [{:text, "Before you arrive", []}]}, {:paragraph, [{:text, "Ask ", []}, {:mention, %Kit.Phoenix.AuthoredText.Mention{kind: :person, id: "aisha-khan", label: "Aisha Khan"}}, {:text, " to confirm ", []}, {:text, "the address", [:bold]}, {:text, " for ", []}, {:mention, %Kit.Phoenix.AuthoredText.Mention{kind: :subject, id: "b-1042", label: "B-1042 Garden room"}}, {:text, " before ", []}, {:date, ~D[2025-03-14]}, {:text, ".", []}, :hard_break, {:text, "Read the ", []}, {:text, "hire terms", [{:link, "https://example.com/hire-terms"}]}, {:text, " first, ", []}, {:text, "then", [:italic]}, {:text, " use ", []}, {:text, "4721", [:code]}, {:text, " at the gate.", []}]}, {:bullet_list, [[{:paragraph, [{:text, "Bring your own chairs.", []}]}], [{:paragraph, [{:text, "Leave the hall by ten.", []}]}]]}, {:ordered_list, [[{:paragraph, [{:text, "Ring the bell by the side gate.", []}]}], [{:paragraph, [{:text, "Wait for the caretaker.", []}]}]]}, {:task_list, [{true, [{:paragraph, [{:text, "Deposit paid", []}]}]}, {false, [{:paragraph, [{:text, "Key returned", []}]}]}]}, {:blockquote, [{:paragraph, [{:text, "The side door sticks in the cold.", []}]}]}, {:code_block, "Gate: 4721\nAlarm: 0990"}, {:paragraph, [{:text, "Floor plan: ", []}, {:file, %Kit.Phoenix.AuthoredText.File{id: "floor-plan", name: "garden-room-plan.pdf"}}]} ]}, reader: reader(), mention_link: fn :person, _id -> "#role-row"; :subject, _id -> nil end, file_link: fn _id -> "#role-row" end}} />
</Kit.Phoenix.Roles.Row.row>
<Kit.Phoenix.Roles.Row.row>
  <:subject
    supporting={[
      Kit.Phoenix.Supporting.line([Kit.Phoenix.Words.text("1 invoice awaiting correction: the March hire was billed at the weekday rate and the committee has asked for it to be reissued at the weekend rate for the Saturday sessions")]),
      Kit.Phoenix.Supporting.line([Kit.Phoenix.Words.text("Due "), Kit.Phoenix.Words.time(Kit.Phoenix.Time.day(reader(), ~D[2025-04-30]))])
    ]}
  ><a href="#role-row">Oakmere WI</a></:subject>
  <:facts supporting={[Kit.Phoenix.Supporting.line([Kit.Phoenix.Words.text("Part payment taken by card on "), Kit.Phoenix.Words.time(Kit.Phoenix.Time.day(reader(), ~D[2025-04-12])), Kit.Phoenix.Words.text("; the balance stays outstanding until the reissued invoice is agreed, and the deposit is held against the Garden Room key that has not come back")])]}>Invoiced: <Kit.Phoenix.Roles.Amount.amount value={Kit.Phoenix.Amount.money(reader(), Money.new(:GBP, "84.00"))} /> ·&nbsp;Collected: <Kit.Phoenix.Roles.Amount.amount value={Kit.Phoenix.Amount.money(reader(), Money.new(:GBP, "24.00"))} /> ·&nbsp;Outstanding: <Kit.Phoenix.Roles.Amount.amount value={Kit.Phoenix.Amount.money(reader(), Money.new(:GBP, "60.00"))} /> ·&nbsp;payment expected after the hirer confirms the billing address, purchase order and named contact for Saturday’s Main Hall booking</:facts>
</Kit.Phoenix.Roles.Row.row>
<Kit.Phoenix.Roles.Row.row>
  <:subject>Oakmere WI</:subject>
</Kit.Phoenix.Roles.Row.row>
<Kit.Phoenix.Roles.Row.row>
  <:subject>Your invoice is ready</:subject>
  <:stamp><Kit.Phoenix.Roles.Stamp.stamp state="alert">Address refused</Kit.Phoenix.Roles.Stamp.stamp></:stamp>
  <:facts>Sent to aisha@oakmereprimary.org ·&nbsp;<Kit.Phoenix.Roles.Time.time value={Kit.Phoenix.Time.day(reader(), ~D[2025-02-03])} /></:facts>
</Kit.Phoenix.Roles.Row.row>
<Kit.Phoenix.Roles.Row.row>
  <:selection>
    <Kit.Phoenix.Roles.SelectionControl.selection_control name="record" value="willowbrook" /><span>Select Willowbrook Community Centre, Long Meadow Lane annexe</span>
  </:selection>
  <:subject href="#role-row">Willowbrook Community Centre, Long Meadow Lane annexe</:subject>
  <:facts>Invited Mon ·&nbsp;not yet accepted</:facts>
  <:actions>
    <Kit.Phoenix.Roles.SecondaryAction.secondary_action>Resend</Kit.Phoenix.Roles.SecondaryAction.secondary_action>
    <Kit.Phoenix.Roles.SecondaryAction.secondary_action>Withdraw</Kit.Phoenix.Roles.SecondaryAction.secondary_action>
  </:actions>
</Kit.Phoenix.Roles.Row.row>
<Kit.Phoenix.Roles.Row.row>
  <:subject href="#role-row">Oakmere Primary School</:subject>
  <:facts>Invited Tue ·&nbsp;not yet accepted</:facts>
  <:actions>
    <Kit.Phoenix.Roles.SecondaryAction.secondary_action>Resend</Kit.Phoenix.Roles.SecondaryAction.secondary_action>
    <Kit.Phoenix.Roles.SecondaryAction.secondary_action>Copy invitation link</Kit.Phoenix.Roles.SecondaryAction.secondary_action>
    <Kit.Phoenix.Roles.SecondaryAction.secondary_action>Withdraw</Kit.Phoenix.Roles.SecondaryAction.secondary_action>
    <Kit.Phoenix.Roles.ActionMenu.action_menu id="role-row-fold" label="More actions for this invitation" groups={[]} />
  </:actions>
</Kit.Phoenix.Roles.Row.row>
<Kit.Phoenix.Roles.Row.row>
  <:subject href="#role-row">St Anne’s Scout Group</:subject>
  <:facts>Invited Wed ·&nbsp;not yet accepted</:facts>
  <:actions>
    <Kit.Phoenix.Roles.SecondaryAction.secondary_action>Withdraw</Kit.Phoenix.Roles.SecondaryAction.secondary_action>
  </:actions>
  <:expansion_summary>Details</:expansion_summary>
  <:expansion expanded>
    <Kit.Phoenix.Roles.FactGroup.fact_group>
      <Kit.Phoenix.Roles.LabelledFact.labelled_fact>
        <:name>Sent to</:name><:value>Priya Shah</:value>
      </Kit.Phoenix.Roles.LabelledFact.labelled_fact>
      <Kit.Phoenix.Roles.LabelledFact.labelled_fact>
        <:name>Email</:name><:value><Kit.Phoenix.Email.email address="priya@stannesscouts.org" /></:value>
      </Kit.Phoenix.Roles.LabelledFact.labelled_fact>
    </Kit.Phoenix.Roles.FactGroup.fact_group>
  </:expansion>
</Kit.Phoenix.Roles.Row.row>
<Kit.Phoenix.Roles.Row.row>
  <:selection>
    <Kit.Phoenix.Roles.SelectionControl.selection_control name="record" value="stannes-register" /><span>Select St Anne’s Scout Group</span>
  </:selection>
  <:subject href="#role-row" rest={%{id: "row-choices-stannes"}}>St Anne’s Scout Group</:subject>
  <:facts>Wednesday ·&nbsp;Main Hall</:facts>
  <:choices control_rest={%{value: "present"}} checked printed_value="Chosen">Present</:choices>
  <:choices control_rest={%{value: "apologies"}} printed_value="Not chosen">Apologies</:choices>
  <:choices control_rest={%{value: "absent"}} printed_value="Not chosen">Absent</:choices>
  <:actions>
    <Kit.Phoenix.Roles.SecondaryAction.secondary_action>Open the register</Kit.Phoenix.Roles.SecondaryAction.secondary_action>
  </:actions>
</Kit.Phoenix.Roles.Row.row>
<Kit.Phoenix.Roles.Row.row>
  <:selection>
    <Kit.Phoenix.Roles.SelectionControl.selection_control name="record" value="stannes-time" /><span>Select St Anne’s Scout Group</span>
  </:selection>
  <:subject href="#role-row" rest={%{id: "row-question-stannes"}}>St Anne’s Scout Group</:subject>
  <:facts>Wednesday ·&nbsp;Main Hall</:facts>
  <:question>
    <Kit.Phoenix.Roles.FormGroup.form_group id="row-question-time">
      <:label>Time</:label>
      <:control :let={binding}>
        <Kit.Phoenix.Roles.TimeField.time_field binding={binding} reader={reader()} name="time" value={Kit.Phoenix.Roles.TimeField.Committed.clock(Kit.Phoenix.Time.clock(reader(), ~T[10:00:00]))} />
      </:control>
      <:printed_value><time datetime="10:00">10:00</time></:printed_value>
    </Kit.Phoenix.Roles.FormGroup.form_group>
  </:question>
  <:actions>
    <Kit.Phoenix.Roles.SecondaryAction.secondary_action>Open the register</Kit.Phoenix.Roles.SecondaryAction.secondary_action>
  </:actions>
</Kit.Phoenix.Roles.Row.row>
<Kit.Phoenix.Roles.Row.row>
  <:selection>
    <Kit.Phoenix.Roles.SelectionControl.selection_control name="record" value="brookfield-time" /><span>Select Brookfield Choir</span>
  </:selection>
  <:subject href="#role-row" rest={%{id: "row-question-brookfield"}}>Brookfield Choir</:subject>
  <:facts>Thursday ·&nbsp;Garden Room</:facts>
  <:question>
    <div>
      <Kit.Phoenix.Roles.FormGroup.form_group id="row-question-brookfield-time">
        <:label>Time</:label>
        <:control :let={binding}>
          <Kit.Phoenix.Roles.TimeField.time_field binding={binding} reader={reader()} name="time" value={Kit.Phoenix.Roles.TimeField.Committed.clock(Kit.Phoenix.Time.clock(reader(), ~T[19:30:00]))} />
        </:control>
        <:printed_value><time datetime="19:30">19:30</time></:printed_value>
      </Kit.Phoenix.Roles.FormGroup.form_group>
    </div>
  </:question>
  <:actions>
    <Kit.Phoenix.Roles.SecondaryAction.secondary_action>Open the register</Kit.Phoenix.Roles.SecondaryAction.secondary_action>
  </:actions>
</Kit.Phoenix.Roles.Row.row>
<Kit.Phoenix.Roles.Row.row>
  <:subject href="#role-row">Sunday 26 October</:subject>
  <:facts>Ballroom beginners ·&nbsp;1:30 am</:facts>
  <:question>
    <Kit.Phoenix.Roles.SelectionControl.group id="row-question-which-time">
      <:legend>Which 1:30 am</:legend>
      <:choice kind={:radio} control_rest={%{name: "which-time", value: "earlier"}} printed_value="Not chosen">The earlier one</:choice>
      <:choice kind={:radio} control_rest={%{name: "which-time", value: "later"}} printed_value="Not chosen">The later one</:choice>
      <:help>The clocks go back at 2 am, so 1:30 am happens twice.</:help>
      <:error>Choose which 1:30 am the class starts.</:error>
    </Kit.Phoenix.Roles.SelectionControl.group>
  </:question>
  <:actions>
    <Kit.Phoenix.Roles.SecondaryAction.secondary_action>Open the class</Kit.Phoenix.Roles.SecondaryAction.secondary_action>
  </:actions>
</Kit.Phoenix.Roles.Row.row>
<Kit.Phoenix.Roles.Row.row>
  <:subject href="#role-row">Oakmere WI</:subject>
  <:facts>Tuesday ·&nbsp;Main Hall</:facts>
  <:question>
    <Kit.Phoenix.Roles.SelectionControl.group id="row-question-post-invoice">
      <:choice kind={:checkbox} control_rest={%{name: "post-invoice"}} printed_value="Not chosen">Post the invoice too</:choice>
      <:help>It goes to the hall’s address.</:help>
    </Kit.Phoenix.Roles.SelectionControl.group>
  </:question>
  <:actions>
    <Kit.Phoenix.Roles.SecondaryAction.secondary_action>Send</Kit.Phoenix.Roles.SecondaryAction.secondary_action>
  </:actions>
</Kit.Phoenix.Roles.Row.row>
<Kit.Phoenix.Roles.Row.row>
  <:subject href="#role-row">Garden room</:subject>
  <:facts>Third in the room list</:facts>
  <:actions>
    <Kit.Phoenix.Roles.SecondaryAction.secondary_action>Move</Kit.Phoenix.Roles.SecondaryAction.secondary_action>
  </:actions>
</Kit.Phoenix.Roles.Row.row>
<Kit.Phoenix.Roles.Row.row>
  <:selection>
    <Kit.Phoenix.Roles.SelectionControl.selection_control name="record" value="hartley" /><span>Select Hartley Scouts</span>
  </:selection>
  <:subject href="#role-row">Hartley Scouts</:subject>
  <:stamp><Kit.Phoenix.Roles.Stamp.stamp state="neutral">Awaiting payment</Kit.Phoenix.Roles.Stamp.stamp></:stamp>
  <:facts>Invoice</:facts>
  <:facts><Kit.Phoenix.Roles.Amount.amount value={Kit.Phoenix.Amount.money(reader(), Money.new(:GBP, "126.00"))} /></:facts>
  <:actions>
    <Kit.Phoenix.Roles.SecondaryAction.secondary_action>Resend</Kit.Phoenix.Roles.SecondaryAction.secondary_action>
  </:actions>
  <:status_lines><Kit.Phoenix.Roles.StatusLine.status_line>Invoice resent to treasurer@hartleyscouts.org.uk.</Kit.Phoenix.Roles.StatusLine.status_line></:status_lines>
</Kit.Phoenix.Roles.Row.row>
<p class="specimen-case-line">A Row of several separate facts that wrap as whole facts.</p>
<Kit.Phoenix.Roles.Row.row>
  <:subject href="#role-row">Garden Room hire</:subject>
  <:facts>Hirer: Priya Shah</:facts>
  <:facts>Day: Saturday</:facts>
  <:facts>Seats: <Kit.Phoenix.Roles.Amount.amount value={Kit.Phoenix.Amount.count(reader(), 40)} /></:facts>
  <:facts>Deposit: <Kit.Phoenix.Roles.Amount.amount value={Kit.Phoenix.Amount.money(reader(), Money.new(:GBP, "50.00"))} /></:facts>
  <:facts>Balance: <Kit.Phoenix.Roles.Amount.amount value={Kit.Phoenix.Amount.money(reader(), Money.new(:GBP, "34.00"))} /></:facts>
  <:facts>Key: with the caretaker</:facts>
  <:facts>Cleaning: booked</:facts>
</Kit.Phoenix.Roles.Row.row>
<p class="specimen-case-line">A supporting line of long words that ends in a time.</p>
<Kit.Phoenix.Roles.Row.row>
  <:subject href="#role-row" supporting={[Kit.Phoenix.Supporting.line([Kit.Phoenix.Words.text("Accepted the revised Garden Room terms and asked for the key arrangements, the deposit and the cleaning rota to be confirmed in writing by "), Kit.Phoenix.Words.time(Kit.Phoenix.Time.day(reader(), ~D[2026-10-16]))])]}>Oakmere Primary School</:subject>
  <:facts supporting={[Kit.Phoenix.Supporting.line([Kit.Phoenix.Words.text("The deposit, the cleaning charge and the return of the key are held against the Saturday booking until "), Kit.Phoenix.Words.time(Kit.Phoenix.Time.day(reader(), ~D[2026-10-30]))])]}>Invoice</:facts>
</Kit.Phoenix.Roles.Row.row>
<p class="specimen-case-line">A run at the Desk width: one Row folds its actions into More, and one without More wraps them.</p>
<Kit.Phoenix.Roles.HeadedRegion.headed_region heading="Invitations" style="inline-size: min(100%, calc(var(--kit-desk-width) + 2 * var(--kit-inset-tight)));">
  <:content>
    <Kit.Phoenix.Roles.Row.row>
      <:subject href="#role-row">St Anne’s Scout Group</:subject>
      <:stamp><Kit.Phoenix.Roles.Stamp.stamp state="neutral">Awaiting payment</Kit.Phoenix.Roles.Stamp.stamp></:stamp>
      <:facts>Invited Mon ·&nbsp;not yet accepted</:facts>
      <:actions>
        <Kit.Phoenix.Roles.SecondaryAction.secondary_action>Send reminder</Kit.Phoenix.Roles.SecondaryAction.secondary_action>
        <Kit.Phoenix.Roles.SecondaryAction.secondary_action>Copy invitation link</Kit.Phoenix.Roles.SecondaryAction.secondary_action>
        <Kit.Phoenix.Roles.SecondaryAction.secondary_action>Withdraw</Kit.Phoenix.Roles.SecondaryAction.secondary_action>
        <Kit.Phoenix.Roles.ActionMenu.action_menu id="role-row-width-fold" label="More actions for this invitation" groups={[]} />
      </:actions>
    </Kit.Phoenix.Roles.Row.row>
    <Kit.Phoenix.Roles.Row.row>
      <:subject href="#role-row">Oakmere Primary School</:subject>
      <:stamp><Kit.Phoenix.Roles.Stamp.stamp state="neutral">Awaiting payment</Kit.Phoenix.Roles.Stamp.stamp></:stamp>
      <:facts>Invited Tue ·&nbsp;not yet accepted</:facts>
      <:actions>
        <Kit.Phoenix.Roles.SecondaryAction.secondary_action>Send a payment reminder</Kit.Phoenix.Roles.SecondaryAction.secondary_action>
        <Kit.Phoenix.Roles.SecondaryAction.secondary_action>Copy the invitation link</Kit.Phoenix.Roles.SecondaryAction.secondary_action>
      </:actions>
      <:status_lines><Kit.Phoenix.Roles.StatusLine.status_line>Payment reminder sent to the school office.</Kit.Phoenix.Roles.StatusLine.status_line></:status_lines>
    </Kit.Phoenix.Roles.Row.row>
  </:content>
</Kit.Phoenix.Roles.HeadedRegion.headed_region>
<p class="specimen-case-line">A run whose Rows each hold an inert action and its words.</p>
<Kit.Phoenix.Roles.HeadedRegion.headed_region heading="Meetings">
  <:content>
    <Kit.Phoenix.Roles.Row.row>
      <:subject href="#role-row">Tuesday 22 April</:subject>
      <:facts>Main Hall ·&nbsp;<Kit.Phoenix.Roles.Time.time value={Kit.Phoenix.Time.clock(reader(), ~T[19:00:00])} /></:facts>
      <:actions action="secondary-action" action_state={Kit.Phoenix.ActionState.inert("role-row-inert-move-mid-april", "This booking is closed. Reopen it to move a meeting.")}>Move this meeting</:actions>
    </Kit.Phoenix.Roles.Row.row>
    <Kit.Phoenix.Roles.Row.row>
      <:subject href="#role-row">Tuesday 29 April</:subject>
      <:facts>Main Hall ·&nbsp;<Kit.Phoenix.Roles.Time.time value={Kit.Phoenix.Time.clock(reader(), ~T[19:00:00])} /></:facts>
      <:actions action="secondary-action" action_state={Kit.Phoenix.ActionState.inert("role-row-inert-move-late-april", "This booking is closed. Reopen it to move a meeting.")}>Move this meeting</:actions>
    </Kit.Phoenix.Roles.Row.row>
  </:content>
</Kit.Phoenix.Roles.HeadedRegion.headed_region>
<p class="specimen-case-line">A Row at the Desk width whose actions wrap where no fold remains.</p>
<Kit.Phoenix.Roles.HeadedRegion.headed_region heading="Invitation" style="inline-size: min(100%, calc(var(--kit-desk-width) + 2 * var(--kit-inset-tight)));">
  <:content>
    <Kit.Phoenix.Roles.Row.row>
      <:subject href="#role-row">Hartley and District Scouts, Tuesday Explorers</:subject>
      <:stamp><Kit.Phoenix.Roles.Stamp.stamp state="neutral">Awaiting payment</Kit.Phoenix.Roles.Stamp.stamp></:stamp>
      <:facts>Invited Wed ·&nbsp;not yet accepted</:facts>
      <:actions>
        <Kit.Phoenix.Roles.SecondaryAction.secondary_action>Send a reminder to the treasurer</Kit.Phoenix.Roles.SecondaryAction.secondary_action>
        <Kit.Phoenix.Roles.SecondaryAction.secondary_action>Copy the invitation link</Kit.Phoenix.Roles.SecondaryAction.secondary_action>
      </:actions>
    </Kit.Phoenix.Roles.Row.row>
  </:content>
</Kit.Phoenix.Roles.HeadedRegion.headed_region>
<p class="specimen-case-line">A run at the Desk width whose Stamps wrap at their words where nothing else fits.</p>
<Kit.Phoenix.Roles.HeadedRegion.headed_region heading="Bookings" style="inline-size: min(100%, calc(var(--kit-desk-width) + 2 * var(--kit-inset-tight)));">
  <:content>
    <Kit.Phoenix.Roles.Row.row>
      <:subject href="#role-row">Riverside Community Choir</:subject>
      <:stamp><Kit.Phoenix.Roles.Stamp.stamp state="attention">Held until the deposit and the first month’s hire are paid in full</Kit.Phoenix.Roles.Stamp.stamp></:stamp>
      <:facts>Main Hall ·&nbsp;Thursdays</:facts>
      <:actions>
        <Kit.Phoenix.Roles.SecondaryAction.secondary_action>Send the treasurer a payment reminder</Kit.Phoenix.Roles.SecondaryAction.secondary_action>
        <Kit.Phoenix.Roles.SecondaryAction.secondary_action>Release the hold</Kit.Phoenix.Roles.SecondaryAction.secondary_action>
      </:actions>
    </Kit.Phoenix.Roles.Row.row>
    <Kit.Phoenix.Roles.Row.row>
      <:subject href="#role-row">Oakmere WI</:subject>
      <:stamp><Kit.Phoenix.Roles.Stamp.stamp state="neutral">Awaiting payment</Kit.Phoenix.Roles.Stamp.stamp></:stamp>
      <:facts>Garden Room ·&nbsp;Saturdays</:facts>
      <:actions>
        <Kit.Phoenix.Roles.SecondaryAction.secondary_action>Send the treasurer a payment reminder</Kit.Phoenix.Roles.SecondaryAction.secondary_action>
        <Kit.Phoenix.Roles.SecondaryAction.secondary_action>Release the hold</Kit.Phoenix.Roles.SecondaryAction.secondary_action>
      </:actions>
    </Kit.Phoenix.Roles.Row.row>
  </:content>
</Kit.Phoenix.Roles.HeadedRegion.headed_region>
<p class="specimen-case-line">A question at the Desk width whose actions wrap where no fold remains.</p>
<Kit.Phoenix.Roles.HeadedRegion.headed_region heading="Register" style="inline-size: min(100%, calc(var(--kit-desk-width) + 2 * var(--kit-inset-tight)));">
  <:content>
    <Kit.Phoenix.Roles.Row.row>
      <:subject href="#role-row">Hartley Scouts</:subject>
      <:facts>Wednesday ·&nbsp;Main Hall</:facts>
      <:question>
        <Kit.Phoenix.Roles.FormGroup.form_group id="row-question-register-time">
          <:label>Time</:label>
          <:control :let={binding}>
            <Kit.Phoenix.Roles.TimeField.time_field binding={binding} reader={reader()} name="time" value={Kit.Phoenix.Roles.TimeField.Committed.clock(Kit.Phoenix.Time.clock(reader(), ~T[18:30:00]))} />
          </:control>
          <:printed_value><time datetime="18:30">18:30</time></:printed_value>
        </Kit.Phoenix.Roles.FormGroup.form_group>
      </:question>
      <:actions>
        <Kit.Phoenix.Roles.SecondaryAction.secondary_action>Open the register for Wednesday evening</Kit.Phoenix.Roles.SecondaryAction.secondary_action>
        <Kit.Phoenix.Roles.SecondaryAction.secondary_action>Send the register to the Explorers’ leader</Kit.Phoenix.Roles.SecondaryAction.secondary_action>
      </:actions>
    </Kit.Phoenix.Roles.Row.row>
  </:content>
</Kit.Phoenix.Roles.HeadedRegion.headed_region>
<p class="specimen-case-line">A question whose label wraps.</p>
<Kit.Phoenix.Roles.HeadedRegion.headed_region heading="Thursday bookings" style="inline-size: min(100%, var(--kit-focused-width));">
  <:content>
    <Kit.Phoenix.Roles.Row.row>
      <:subject href="#role-row">Brookfield Choir</:subject>
      <:facts>Thursday ·&nbsp;Garden Room</:facts>
      <:question>
        <Kit.Phoenix.Roles.FormGroup.form_group id="row-question-setup-time">
          <:label>Time the choir needs the room from, with half an hour to set out the chairs</:label>
          <:control :let={binding}>
            <Kit.Phoenix.Roles.TimeField.time_field binding={binding} reader={reader()} name="time" value={Kit.Phoenix.Roles.TimeField.Committed.clock(Kit.Phoenix.Time.clock(reader(), ~T[19:00:00]))} />
          </:control>
          <:printed_value><time datetime="19:00">19:00</time></:printed_value>
        </Kit.Phoenix.Roles.FormGroup.form_group>
      </:question>
      <:actions>
        <Kit.Phoenix.Roles.SecondaryAction.secondary_action>Open the register</Kit.Phoenix.Roles.SecondaryAction.secondary_action>
      </:actions>
    </Kit.Phoenix.Roles.Row.row>
  </:content>
</Kit.Phoenix.Roles.HeadedRegion.headed_region>
<p class="specimen-case-line">A question whose act sends an email, its preview before the actions.</p>
<Kit.Phoenix.Roles.Row.row scope_line="The invitation lasts 7 days.">
  <:subject href="#role-row">Aisha Khan</:subject>
  <:facts>Teacher ·&nbsp;Tuesday beginners</:facts>
  <:question>
    <Kit.Phoenix.Roles.FormGroup.form_group id="row-invite-email-form-group" kind={Kit.Phoenix.Roles.FormGroup.Kind.email()} control_value="aisha@oakmereprimary.org" control_rest={%{id: "row-invite-email", name: "email"}}><:printed_value>aisha@oakmereprimary.org</:printed_value>
      <:label rest={%{for: "row-invite-email"}}>Email</:label>
    </Kit.Phoenix.Roles.FormGroup.form_group>
  </:question>
  <:outbound_previews>
    <Kit.Phoenix.Roles.OutboundPreview.headed_region heading="The invitation, as Aisha will get it">
      <Kit.Phoenix.Roles.OutboundPreview.outbound_preview>
        <:facts>
          <Kit.Phoenix.Roles.FactGroup.fact_group>
            <Kit.Phoenix.Roles.LabelledFact.labelled_fact>
              <:name>Channel</:name><:value>Email to <Kit.Phoenix.Email.email address="aisha@oakmereprimary.org" /></:value>
            </Kit.Phoenix.Roles.LabelledFact.labelled_fact>
            <Kit.Phoenix.Roles.LabelledFact.labelled_fact>
              <:name>Subject</:name><:value>Teach at Oakmere Village Hall</:value>
            </Kit.Phoenix.Roles.LabelledFact.labelled_fact>
          </Kit.Phoenix.Roles.FactGroup.fact_group>
        </:facts>
        <:email title="Teach at Oakmere Village Hall" document="<!doctype html><html lang=en><head><style>body{margin:0;padding:24px;font-family:Georgia,serif;color:#222222;background:#ffffff}p{margin:0 0 12px;font-size:15px;line-height:1.5}</style></head><body><p>Hello Aisha,</p><p>You are invited to teach Tuesday beginners at Oakmere Village Hall.</p><p>Accept within 7 days.</p></body></html>" />
      </Kit.Phoenix.Roles.OutboundPreview.outbound_preview>
      <:time>Goes when you send it.</:time>
    </Kit.Phoenix.Roles.OutboundPreview.headed_region>
  </:outbound_previews>
  <:actions>
    <Kit.Phoenix.Roles.PrimaryAction.primary_action>Send invitation</Kit.Phoenix.Roles.PrimaryAction.primary_action>
    <Kit.Phoenix.Roles.SecondaryAction.secondary_action>Don’t send</Kit.Phoenix.Roles.SecondaryAction.secondary_action>
  </:actions>
</Kit.Phoenix.Roles.Row.row>
<Kit.Phoenix.Roles.Row.row id="row-dialog-question" scope_line="Your answer sets the location for Monday’s choir rehearsal, Tuesday’s committee meeting and Thursday’s reading group.">
  <:subject>Which location is this?</:subject>
  <:stamp><Kit.Phoenix.Roles.Stamp.stamp state="neutral">To answer</Kit.Phoenix.Roles.Stamp.stamp></:stamp>
  <:actions><Kit.Phoenix.Roles.SecondaryAction.secondary_action id="row-location-opener" phx-click={Kit.Phoenix.Modal.open("row-location-dialog")}>Add a location</Kit.Phoenix.Roles.SecondaryAction.secondary_action></:actions>
</Kit.Phoenix.Roles.Row.row>
<Kit.Phoenix.Roles.Dialog.dialog id="row-location-dialog" return_focus="row-location-opener" aria-labelledby="row-location-dialog-title">
  <:heading rest={%{id: "row-location-dialog-title"}}>Add a location</:heading>
  <:form_groups><form id="row-location-form">
    <Kit.Phoenix.Roles.FormGroup.form_group kind={Kit.Phoenix.Roles.FormGroup.Kind.text(:medium)} id="row-location-name-group" control_rest={%{id: "row-location-name", name: "name", type: "text", value: "Garden Room"}}><:label rest={%{for: "row-location-name"}}>Location name</:label><:printed_value>Garden Room</:printed_value></Kit.Phoenix.Roles.FormGroup.form_group>
    <Kit.Phoenix.Roles.FormGroup.form_group kind={Kit.Phoenix.Roles.FormGroup.Kind.text(:wide)} id="row-location-address-group" control_rest={%{id: "row-location-address", name: "address", type: "text", value: "Oakmere Village Hall, High Street"}}><:label rest={%{for: "row-location-address"}}>Address</:label><:printed_value>Oakmere Village Hall, High Street</:printed_value></Kit.Phoenix.Roles.FormGroup.form_group>
  </form></:form_groups>
  <:primary_action rest={Kit.Phoenix.Modal.dismissing(%{"type" => "button"})}>Use this location</:primary_action>
  <:secondary_action>Cancel</:secondary_action>
</Kit.Phoenix.Roles.Dialog.dialog>
<p class="specimen-case-line">An email as the subject.</p>
<Kit.Phoenix.Roles.Row.row>
  <:subject><Kit.Phoenix.Email.email address="accounts.receivable.northeast-region.billing@hartfordcommunitydancestudio.com" /></:subject>
  <:facts>Sends the invoices</:facts>
</Kit.Phoenix.Roles.Row.row>
<p class="specimen-case-line">A web address as the subject.</p>
<Kit.Phoenix.Roles.Row.row>
  <:subject><Kit.Phoenix.Identifier.identifier value="venues.example.com/oakmere-primary-school-parents-association" /></:subject>
  <:facts>Booking page</:facts>
</Kit.Phoenix.Roles.Row.row>
<p class="specimen-case-line">A person as the subject, with their availability.</p>
<Kit.Phoenix.Roles.Row.row>
  <:subject href="#role-row" avatar={Kit.Phoenix.Roles.Avatar.person("Aisha Khan", "AK", "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI5NiIgaGVpZ2h0PSI5NiIgdmlld0JveD0iMCAwIDk2IDk2Ij48cmVjdCB3aWR0aD0iOTYiIGhlaWdodD0iOTYiIGZpbGw9IiM4ZmE1YjYiLz48Y2lyY2xlIGN4PSI0OCIgY3k9IjM4IiByPSIxOCIgZmlsbD0iI2U4YzlhOCIvPjxwYXRoIGQ9Ik00OCA2MGMtMTcgMC0yOSAxMS0zMSAyNnYxMGg2MlY4NmMtMi0xNS0xNC0yNi0zMS0yNnoiIGZpbGw9IiMzZjVkNTIiLz48cGF0aCBkPSJNMzAgMzRjMC0xMiA4LTIwIDE4LTIwczE4IDggMTggMjBjMC02LTYtOC0xOC04cy0xOCAyLTE4IDh6IiBmaWxsPSIjNGEzYTJmIi8+PC9zdmc+", "Away")}>Aisha Khan</:subject>
  <:facts>Books the choir rehearsals</:facts>
</Kit.Phoenix.Roles.Row.row>
<p class="specimen-case-line">An unread notification.</p>
<Kit.Phoenix.Roles.Row.row unread>
  <:selection><Kit.Phoenix.Roles.SelectionControl.selection_control name="notification" value="paid" /><span>Select Oakmere Primary School paid its invoice</span></:selection>
  <:subject href="#role-row">Oakmere Primary School paid its invoice</:subject>
  <:facts>Paid by Aisha Khan</:facts>
</Kit.Phoenix.Roles.Row.row>
<Kit.Phoenix.Roles.Row.row id="role-row-empty-region">
  <:subject href="#role-row">Oakmere Primary School</:subject>
  <:facts><span :if={false}>Invoice</span></:facts>
</Kit.Phoenix.Roles.Row.row>
<details>
  <summary>Show a row arriving</summary>
  <Kit.Phoenix.Roles.Row.row>
    <:subject href="#role-row">Main Hall</:subject>
    <:facts>Tuesday</:facts>
  </Kit.Phoenix.Roles.Row.row>
  <Kit.Phoenix.Roles.Row.row>
    <:subject href="#role-row">Committee room</:subject>
    <:facts>Wednesday</:facts>
  </Kit.Phoenix.Roles.Row.row>
  <Kit.Phoenix.Roles.Row.row {Kit.Phoenix.Motion.arrival(true)}>
    <:subject href="#role-row">Kitchen</:subject>
    <:facts>Thursday</:facts>
  </Kit.Phoenix.Roles.Row.row>
  <Kit.Phoenix.Roles.SecondaryAction.secondary_action>Add a row</Kit.Phoenix.Roles.SecondaryAction.secondary_action>
</details>

Row, selected

Source
<Kit.Phoenix.Roles.Row.row>
  <:selection>
    <Kit.Phoenix.Roles.SelectionControl.selection_control checked name="record" value="oak" /><span>Select Oakmere Primary School</span>
  </:selection>
  <:subject href="#role-row-selected">Oakmere Primary School</:subject>
  <:stamp><Kit.Phoenix.Roles.Stamp.stamp state="neutral">Awaiting payment</Kit.Phoenix.Roles.Stamp.stamp></:stamp>
  <:facts>Invoice ·&nbsp;<Kit.Phoenix.Roles.Amount.amount value={Kit.Phoenix.Amount.money(reader(), Money.new(:GBP, "84.00"))} /></:facts>
</Kit.Phoenix.Roles.Row.row>

Row, expanded

Oakmere Primary SchoolAwaiting payment

Invoice · £84.00

Invoice details
Bookings
2
Each
£42.00
Source
<Kit.Phoenix.Roles.Row.row>
  <:selection>
    <Kit.Phoenix.Roles.SelectionControl.selection_control name="record" value="oak" /><span>Select Oakmere Primary School</span>
  </:selection>
  <:subject href="#role-row-expanded">Oakmere Primary School</:subject>
  <:stamp><Kit.Phoenix.Roles.Stamp.stamp state="neutral">Awaiting payment</Kit.Phoenix.Roles.Stamp.stamp></:stamp>
  <:facts>Invoice ·&nbsp;<Kit.Phoenix.Roles.Amount.amount value={Kit.Phoenix.Amount.money(reader(), Money.new(:GBP, "84.00"))} /></:facts>
  <:expansion_summary>Invoice details</:expansion_summary>
  <:expansion expanded>
    <Kit.Phoenix.Roles.FactGroup.fact_group>
      <Kit.Phoenix.Roles.LabelledFact.labelled_fact>
        <:name>Bookings</:name><:value words={[Kit.Phoenix.Words.amount(Kit.Phoenix.Amount.count(reader(), 2))]} />
      </Kit.Phoenix.Roles.LabelledFact.labelled_fact>
      <Kit.Phoenix.Roles.LabelledFact.labelled_fact>
        <:name>Each</:name><:value words={[Kit.Phoenix.Words.amount(Kit.Phoenix.Amount.money(reader(), Money.new(:GBP, "42.00")))]} />
      </Kit.Phoenix.Roles.LabelledFact.labelled_fact>
    </Kit.Phoenix.Roles.FactGroup.fact_group>
  </:expansion>
</Kit.Phoenix.Roles.Row.row>

Row, failed

On a Row.

· Main Hall

This meeting was not reinstated: the connection dropped before it saved.

On a records row.

MeetingWhenRoom
Choir rehearsal

This meeting was not reinstated: the connection dropped before it saved.
Main Hall

On a Row with Try again unavailable.

· Main Hall

This meeting was not reinstated: the connection dropped before it saved.

Try again once you are back online.

On a records row with Try again unavailable.

MeetingWhenRoom
Choir rehearsal

This meeting was not reinstated: the connection dropped before it saved.

Try again once you are back online.
Main Hall
Source
<p class="specimen-case-line">On a Row.</p>
<Kit.Phoenix.Roles.Row.row standing={Kit.Phoenix.Roles.Row.Standing.failed("This meeting was not reinstated: the connection dropped before it saved.", %{})}>
  <:subject href="#role-row-failed">Choir rehearsal</:subject>
  <:stamp><Kit.Phoenix.Roles.Stamp.stamp state="settled">Cancelled</Kit.Phoenix.Roles.Stamp.stamp></:stamp>
  <:facts><Kit.Phoenix.Roles.Time.time value={Kit.Phoenix.Time.moment_with_weekday(reader(), ~U[2025-04-22 18:00:00Z])} /> ·&nbsp;Main Hall</:facts>
  <:actions>
    <Kit.Phoenix.Roles.SecondaryAction.secondary_action>Open this meeting</Kit.Phoenix.Roles.SecondaryAction.secondary_action>
  </:actions>
</Kit.Phoenix.Roles.Row.row>
<p class="specimen-case-line">On a records row.</p>
<div class="specimen-table-contained"><Kit.Phoenix.Table.rows_table>
  <:subject_heading label="Meeting" />
  <:column_headings label="When" kind="time">When</:column_headings>
  <:column_headings label="Room">Room</:column_headings>
  <:row standing={Kit.Phoenix.Roles.Row.Standing.failed("This meeting was not reinstated: the connection dropped before it saved.", %{})} actions={[~H[<Kit.Phoenix.Roles.SecondaryAction.secondary_action>Open this meeting</Kit.Phoenix.Roles.SecondaryAction.secondary_action>]]} facts={[%Kit.Phoenix.Table.FactCell{content: Kit.Phoenix.Table.Fact.words([Kit.Phoenix.Words.time(Kit.Phoenix.Time.moment_with_weekday(reader(), ~U[2025-04-22 18:00:00Z]))])}, %Kit.Phoenix.Table.FactCell{content: Kit.Phoenix.Table.Fact.words([Kit.Phoenix.Words.text("Main Hall")])}]}><a href="#role-row-failed">Choir rehearsal</a></:row>
</Kit.Phoenix.Table.rows_table></div>
<p class="specimen-case-line">On a Row with Try again unavailable.</p>
<Kit.Phoenix.Roles.Row.row standing={Kit.Phoenix.Roles.Row.Standing.failed("This meeting was not reinstated: the connection dropped before it saved.", %{}, Kit.Phoenix.ActionState.inert("role-row-failed-try-again", "Try again once you are back online."))}>
  <:subject href="#role-row-failed">Choir rehearsal</:subject>
  <:stamp><Kit.Phoenix.Roles.Stamp.stamp state="settled">Cancelled</Kit.Phoenix.Roles.Stamp.stamp></:stamp>
  <:facts><Kit.Phoenix.Roles.Time.time value={Kit.Phoenix.Time.moment_with_weekday(reader(), ~U[2025-04-22 18:00:00Z])} /> ·&nbsp;Main Hall</:facts>
  <:actions>
    <Kit.Phoenix.Roles.SecondaryAction.secondary_action>Open this meeting</Kit.Phoenix.Roles.SecondaryAction.secondary_action>
  </:actions>
</Kit.Phoenix.Roles.Row.row>
<p class="specimen-case-line">On a records row with Try again unavailable.</p>
<div class="specimen-table-contained"><Kit.Phoenix.Table.rows_table>
  <:subject_heading label="Meeting" />
  <:column_headings label="When" kind="time">When</:column_headings>
  <:column_headings label="Room">Room</:column_headings>
  <:row standing={Kit.Phoenix.Roles.Row.Standing.failed("This meeting was not reinstated: the connection dropped before it saved.", %{}, Kit.Phoenix.ActionState.inert("role-row-failed-records-try-again", "Try again once you are back online."))} actions={[~H[<Kit.Phoenix.Roles.SecondaryAction.secondary_action>Open this meeting</Kit.Phoenix.Roles.SecondaryAction.secondary_action>]]} facts={[%Kit.Phoenix.Table.FactCell{content: Kit.Phoenix.Table.Fact.words([Kit.Phoenix.Words.time(Kit.Phoenix.Time.moment_with_weekday(reader(), ~U[2025-04-22 18:00:00Z]))])}, %Kit.Phoenix.Table.FactCell{content: Kit.Phoenix.Table.Fact.words([Kit.Phoenix.Words.text("Main Hall")])}]}><a href="#role-row-failed">Choir rehearsal</a></:row>
</Kit.Phoenix.Table.rows_table></div>

Row, conflict

On a Row.

· Main Hall

Maya Patel cancelled this meeting while you were moving it to the Garden Room.

On a records row.

MeetingWhenRoom
Choir rehearsal

Maya Patel cancelled this meeting while you were moving it to the Garden Room.
Main Hall

On a Row with the action unavailable.

· Main Hall

Maya Patel cancelled this meeting while you were moving it to the Garden Room.

Reinstate this meeting before moving it.

On a records row with the action unavailable.

MeetingWhenRoom
Choir rehearsal

Maya Patel cancelled this meeting while you were moving it to the Garden Room.

Reinstate this meeting before moving it.
Main Hall
Source
<p class="specimen-case-line">On a Row.</p>
<Kit.Phoenix.Roles.Row.row standing={Kit.Phoenix.Roles.Row.Standing.conflict("Maya Patel cancelled this meeting while you were moving it to the Garden Room.", "Move it to the Garden Room", %{})}>
  <:subject href="#role-row-conflict">Choir rehearsal</:subject>
  <:stamp><Kit.Phoenix.Roles.Stamp.stamp state="settled">Cancelled</Kit.Phoenix.Roles.Stamp.stamp></:stamp>
  <:facts><Kit.Phoenix.Roles.Time.time value={Kit.Phoenix.Time.moment_with_weekday(reader(), ~U[2025-04-22 18:00:00Z])} /> ·&nbsp;Main Hall</:facts>
  <:actions>
    <Kit.Phoenix.Roles.SecondaryAction.secondary_action>Reinstate this meeting</Kit.Phoenix.Roles.SecondaryAction.secondary_action>
  </:actions>
</Kit.Phoenix.Roles.Row.row>
<p class="specimen-case-line">On a records row.</p>
<div class="specimen-table-contained"><Kit.Phoenix.Table.rows_table>
  <:subject_heading label="Meeting" />
  <:column_headings label="When" kind="time">When</:column_headings>
  <:column_headings label="Room">Room</:column_headings>
  <:row standing={Kit.Phoenix.Roles.Row.Standing.conflict("Maya Patel cancelled this meeting while you were moving it to the Garden Room.", "Move it to the Garden Room", %{})} actions={[~H[<Kit.Phoenix.Roles.SecondaryAction.secondary_action>Reinstate this meeting</Kit.Phoenix.Roles.SecondaryAction.secondary_action>]]} facts={[%Kit.Phoenix.Table.FactCell{content: Kit.Phoenix.Table.Fact.words([Kit.Phoenix.Words.time(Kit.Phoenix.Time.moment_with_weekday(reader(), ~U[2025-04-22 18:00:00Z]))])}, %Kit.Phoenix.Table.FactCell{content: Kit.Phoenix.Table.Fact.words([Kit.Phoenix.Words.text("Main Hall")])}]}><a href="#role-row-conflict">Choir rehearsal</a></:row>
</Kit.Phoenix.Table.rows_table></div>
<p class="specimen-case-line">On a Row with the action unavailable.</p>
<Kit.Phoenix.Roles.Row.row standing={Kit.Phoenix.Roles.Row.Standing.conflict("Maya Patel cancelled this meeting while you were moving it to the Garden Room.", "Move it to the Garden Room", %{}, Kit.Phoenix.ActionState.inert("role-row-conflict-action", "Reinstate this meeting before moving it."))}>
  <:subject href="#role-row-conflict">Choir rehearsal</:subject>
  <:stamp><Kit.Phoenix.Roles.Stamp.stamp state="settled">Cancelled</Kit.Phoenix.Roles.Stamp.stamp></:stamp>
  <:facts><Kit.Phoenix.Roles.Time.time value={Kit.Phoenix.Time.moment_with_weekday(reader(), ~U[2025-04-22 18:00:00Z])} /> ·&nbsp;Main Hall</:facts>
  <:actions>
    <Kit.Phoenix.Roles.SecondaryAction.secondary_action>Reinstate this meeting</Kit.Phoenix.Roles.SecondaryAction.secondary_action>
  </:actions>
</Kit.Phoenix.Roles.Row.row>
<p class="specimen-case-line">On a records row with the action unavailable.</p>
<div class="specimen-table-contained"><Kit.Phoenix.Table.rows_table>
  <:subject_heading label="Meeting" />
  <:column_headings label="When" kind="time">When</:column_headings>
  <:column_headings label="Room">Room</:column_headings>
  <:row standing={Kit.Phoenix.Roles.Row.Standing.conflict("Maya Patel cancelled this meeting while you were moving it to the Garden Room.", "Move it to the Garden Room", %{}, Kit.Phoenix.ActionState.inert("role-row-conflict-records-action", "Reinstate this meeting before moving it."))} actions={[~H[<Kit.Phoenix.Roles.SecondaryAction.secondary_action>Reinstate this meeting</Kit.Phoenix.Roles.SecondaryAction.secondary_action>]]} facts={[%Kit.Phoenix.Table.FactCell{content: Kit.Phoenix.Table.Fact.words([Kit.Phoenix.Words.time(Kit.Phoenix.Time.moment_with_weekday(reader(), ~U[2025-04-22 18:00:00Z]))])}, %Kit.Phoenix.Table.FactCell{content: Kit.Phoenix.Table.Fact.words([Kit.Phoenix.Words.text("Main Hall")])}]}><a href="#role-row-conflict">Choir rehearsal</a></:row>
</Kit.Phoenix.Table.rows_table></div>

Row, processing

On a Row.

· Main Hall

Reinstating this meeting…

On a records row.

MeetingWhenRoom
Choir rehearsal

Reinstating this meeting…
Main Hall
Source
<p class="specimen-case-line">On a Row.</p>
<Kit.Phoenix.Roles.Row.row standing={Kit.Phoenix.Roles.Row.Standing.processing("Reinstating this meeting…")}>
  <:subject href="#role-row-processing">Choir rehearsal</:subject>
  <:stamp><Kit.Phoenix.Roles.Stamp.stamp state="settled">Cancelled</Kit.Phoenix.Roles.Stamp.stamp></:stamp>
  <:facts><Kit.Phoenix.Roles.Time.time value={Kit.Phoenix.Time.moment_with_weekday(reader(), ~U[2025-04-22 18:00:00Z])} /> ·&nbsp;Main Hall</:facts>
  <:actions>
    <Kit.Phoenix.Roles.SecondaryAction.secondary_action>Open this meeting</Kit.Phoenix.Roles.SecondaryAction.secondary_action>
  </:actions>
</Kit.Phoenix.Roles.Row.row>
<p class="specimen-case-line">On a records row.</p>
<div class="specimen-table-contained"><Kit.Phoenix.Table.rows_table>
  <:subject_heading label="Meeting" />
  <:column_headings label="When" kind="time">When</:column_headings>
  <:column_headings label="Room">Room</:column_headings>
  <:row standing={Kit.Phoenix.Roles.Row.Standing.processing("Reinstating this meeting…")} actions={[~H[<Kit.Phoenix.Roles.SecondaryAction.secondary_action>Open this meeting</Kit.Phoenix.Roles.SecondaryAction.secondary_action>]]} facts={[%Kit.Phoenix.Table.FactCell{content: Kit.Phoenix.Table.Fact.words([Kit.Phoenix.Words.time(Kit.Phoenix.Time.moment_with_weekday(reader(), ~U[2025-04-22 18:00:00Z]))])}, %Kit.Phoenix.Table.FactCell{content: Kit.Phoenix.Table.Fact.words([Kit.Phoenix.Words.text("Main Hall")])}]}><a href="#role-row-processing">Choir rehearsal</a></:row>
</Kit.Phoenix.Table.rows_table></div>

Row, unsaved

On a Row.

· Main Hall

This meeting will be reinstated when you are back online.

On a records row.

MeetingWhenRoom
Choir rehearsal

This meeting will be reinstated when you are back online.
Main Hall
Source
<p class="specimen-case-line">On a Row.</p>
<Kit.Phoenix.Roles.Row.row standing={Kit.Phoenix.Roles.Row.Standing.unsaved("This meeting will be reinstated when you are back online.")}>
  <:subject href="#role-row-unsaved">Choir rehearsal</:subject>
  <:stamp><Kit.Phoenix.Roles.Stamp.stamp state="settled">Cancelled</Kit.Phoenix.Roles.Stamp.stamp></:stamp>
  <:facts><Kit.Phoenix.Roles.Time.time value={Kit.Phoenix.Time.moment_with_weekday(reader(), ~U[2025-04-22 18:00:00Z])} /> ·&nbsp;Main Hall</:facts>
  <:actions>
    <Kit.Phoenix.Roles.SecondaryAction.secondary_action>Open this meeting</Kit.Phoenix.Roles.SecondaryAction.secondary_action>
  </:actions>
</Kit.Phoenix.Roles.Row.row>
<p class="specimen-case-line">On a records row.</p>
<div class="specimen-table-contained"><Kit.Phoenix.Table.rows_table>
  <:subject_heading label="Meeting" />
  <:column_headings label="When" kind="time">When</:column_headings>
  <:column_headings label="Room">Room</:column_headings>
  <:row standing={Kit.Phoenix.Roles.Row.Standing.unsaved("This meeting will be reinstated when you are back online.")} actions={[~H[<Kit.Phoenix.Roles.SecondaryAction.secondary_action>Open this meeting</Kit.Phoenix.Roles.SecondaryAction.secondary_action>]]} facts={[%Kit.Phoenix.Table.FactCell{content: Kit.Phoenix.Table.Fact.words([Kit.Phoenix.Words.time(Kit.Phoenix.Time.moment_with_weekday(reader(), ~U[2025-04-22 18:00:00Z]))])}, %Kit.Phoenix.Table.FactCell{content: Kit.Phoenix.Table.Fact.words([Kit.Phoenix.Words.text("Main Hall")])}]}><a href="#role-row-unsaved">Choir rehearsal</a></:row>
</Kit.Phoenix.Table.rows_table></div>