Reordering

<p class="specimen-case-line">Rows in an order you set, one selected, and Main hall waiting for the order to be saved.</p>
<Kit.Phoenix.Roles.Reordering.reordering id="reordering-rooms" ordering={Kit.Phoenix.Roles.Reordering.Ordering.ordered("Place it", "Room")} on_move="move" close_label="Keep the order">
  <:position id="reordering-rooms-main-hall">Main hall</:position>
  <:position id="reordering-rooms-garden-room">Garden room</:position>
  <:position id="reordering-rooms-committee-room">Committee room</:position>
  <Kit.Phoenix.Roles.Row.row :for={{slug, name, seats, checked} <- [{"main-hall", "Main hall", 120, false}, {"garden-room", "Garden room", 30, true}, {"committee-room", "Committee room", 12, false}]} id={"reordering-rooms-" <> slug} handle>
    <:selection><Kit.Phoenix.Roles.SelectionControl.selection_control checked={checked} name="room" value={slug} /><span>Select {name}</span></:selection>
    <:subject href="#role-reordering" rest={%{id: "reordering-rooms-" <> slug <> "-subject"}}>{name}</:subject>
    <:facts>Seats <Kit.Phoenix.Roles.Amount.amount value={Kit.Phoenix.Amount.count(reader(), seats)} /></:facts>
    <:actions move action_state={if slug == "main-hall", do: Kit.Phoenix.ActionState.inert("reordering-rooms-main-hall-move", "Save the room order before moving Main hall.")} />
  </Kit.Phoenix.Roles.Row.row>
</Kit.Phoenix.Roles.Reordering.reordering>
<p class="specimen-case-line">A List's records table with its handle column, one row selected, and Move in each row's actions.</p>
<Kit.Phoenix.Layouts.List.list subject_state={Kit.Phoenix.State.none()} id="reordering-waiting-list">
  <:columns_selection_actions rest={%{"aria-label": "Selection actions"}}></:columns_selection_actions>
  <:selection_actions selection={Kit.Phoenix.Layouts.List.Selection.selected(Kit.Phoenix.Amount.count(reader(), 1), %{})}>
    <Kit.Phoenix.Roles.ActionGroup.action_group><:secondary><Kit.Phoenix.Roles.SecondaryAction.secondary_action type="button">Contact hirers</Kit.Phoenix.Roles.SecondaryAction.secondary_action></:secondary></Kit.Phoenix.Roles.ActionGroup.action_group>
  </:selection_actions>
  <:rows rest={%{"aria-label": "Waiting list"}}>
    <Kit.Phoenix.Roles.Reordering.table id="reordering-requests" ordering={Kit.Phoenix.Roles.Reordering.Ordering.ordered("Place it", "Request")} on_move="move" close_label="Keep the order">
      <:position id="reordering-requests-choir">Choir rehearsal</:position>
      <:position id="reordering-requests-yoga">Yoga class</:position>
      <:position id="reordering-requests-toddlers">Toddler group</:position>
      <Kit.Phoenix.Table.rows_table handle>
        <:caption>Waiting list for Saturday mornings</:caption>
        <:subject_heading label="Request" />
        <:column_headings label="Hirer">Hirer</:column_headings>
        <:row rest={%{id: "reordering-requests-choir"}} subject_rest={%{id: "reordering-requests-choir-subject"}} actions={[~H[<Kit.Phoenix.Roles.Reordering.move row="reordering-requests-choir" subject="reordering-requests-choir-subject" />]]} selection={~H[<Kit.Phoenix.Roles.SelectionControl.selection_control /><span>Select Choir rehearsal</span>]} facts={[%Kit.Phoenix.Table.FactCell{content: Kit.Phoenix.Table.Fact.words([Kit.Phoenix.Words.text("Oakmere Singers")])}]}><a href="#role-reordering">Choir rehearsal</a></:row>
        <:row rest={%{id: "reordering-requests-yoga"}} subject_rest={%{id: "reordering-requests-yoga-subject"}} actions={[~H[<Kit.Phoenix.Roles.Reordering.move row="reordering-requests-yoga" subject="reordering-requests-yoga-subject" />]]} selection={~H[<Kit.Phoenix.Roles.SelectionControl.selection_control checked /><span>Select Yoga class</span>]} facts={[%Kit.Phoenix.Table.FactCell{content: Kit.Phoenix.Table.Fact.words([Kit.Phoenix.Words.text("Priya Shah")])}]}><a href="#role-reordering">Yoga class</a></:row>
        <:row rest={%{id: "reordering-requests-toddlers"}} subject_rest={%{id: "reordering-requests-toddlers-subject"}} actions={[~H[<Kit.Phoenix.Roles.Reordering.move row="reordering-requests-toddlers" subject="reordering-requests-toddlers-subject" />]]} selection={~H[<Kit.Phoenix.Roles.SelectionControl.selection_control /><span>Select Toddler group</span>]} facts={[%Kit.Phoenix.Table.FactCell{content: Kit.Phoenix.Table.Fact.words([Kit.Phoenix.Words.text("Tom Reid")])}]}><a href="#role-reordering">Toddler group</a></:row>
      </Kit.Phoenix.Table.rows_table>
    </Kit.Phoenix.Roles.Reordering.table>
  </:rows>
</Kit.Phoenix.Layouts.List.list>
<p class="specimen-case-line">A table of records grouped by standing, the last group closed, whose Move dialog offers the groups, and one row whose move was refused.</p>
<Kit.Phoenix.Roles.Reordering.table id="reordering-standing" ordering={Kit.Phoenix.Roles.Reordering.Ordering.ordered("Place it", "Request")} on_move="move" group_label="Standing" close_label="Keep the order">
  <:group id="reordering-standing-confirmed">Confirmed</:group>
  <:group id="reordering-standing-waiting">Waiting</:group>
  <:group id="reordering-standing-declined">Declined</:group>
  <:position id="reordering-standing-choir" group="reordering-standing-confirmed">Choir rehearsal</:position>
  <:position id="reordering-standing-yoga" group="reordering-standing-confirmed">Yoga class</:position>
  <:position id="reordering-standing-toddlers" group="reordering-standing-waiting">Toddler group</:position>
  <:position id="reordering-standing-chess" group="reordering-standing-waiting">Chess club</:position>
  <Kit.Phoenix.Table.rows_table handle>
    <:caption>Requests for Saturday mornings by standing</:caption>
    <:subject_heading label="Request" />
    <:column_headings label="Hirer responsible for the request">Hirer responsible for the request</:column_headings>
    <:group id="reordering-standing-confirmed" count="2"><Kit.Phoenix.Roles.Stamp.stamp state="settled">Confirmed</Kit.Phoenix.Roles.Stamp.stamp></:group>
    <:group id="reordering-standing-waiting" count="2"><Kit.Phoenix.Roles.Stamp.stamp state="attention">Waiting</Kit.Phoenix.Roles.Stamp.stamp></:group>
    <:group id="reordering-standing-declined" count="0" expanded={false}><Kit.Phoenix.Roles.Stamp.stamp state="neutral">Declined</Kit.Phoenix.Roles.Stamp.stamp></:group>
    <:row rest={%{id: "reordering-standing-choir"}} group="reordering-standing-confirmed" subject_rest={%{id: "reordering-standing-choir-subject"}} actions={[~H[<Kit.Phoenix.Roles.Reordering.move row="reordering-standing-choir" subject="reordering-standing-choir-subject" />]]} facts={[%Kit.Phoenix.Table.FactCell{content: Kit.Phoenix.Table.Fact.words([Kit.Phoenix.Words.text("Oakmere Singers")])}]}><a href="#role-reordering">Choir rehearsal</a></:row>
    <:row rest={%{id: "reordering-standing-yoga"}} group="reordering-standing-confirmed" subject_rest={%{id: "reordering-standing-yoga-subject"}} actions={[~H[<Kit.Phoenix.Roles.Reordering.move row="reordering-standing-yoga" subject="reordering-standing-yoga-subject" />]]} facts={[%Kit.Phoenix.Table.FactCell{content: Kit.Phoenix.Table.Fact.words([Kit.Phoenix.Words.text("Priya Shah")])}]}><a href="#role-reordering">Yoga class</a></:row>
    <:row rest={%{id: "reordering-standing-toddlers"}} group="reordering-standing-waiting" subject_rest={%{id: "reordering-standing-toddlers-subject"}} actions={[~H[<Kit.Phoenix.Roles.Reordering.move row="reordering-standing-toddlers" subject="reordering-standing-toddlers-subject" />]]} facts={[%Kit.Phoenix.Table.FactCell{content: Kit.Phoenix.Table.Fact.words([Kit.Phoenix.Words.text("Tom Reid")])}]}><a href="#role-reordering">Toddler group</a></:row>
    <:row rest={%{id: "reordering-standing-chess"}} standing={Kit.Phoenix.Roles.Row.Standing.failed("Chess club was not moved to Confirmed: Saturday mornings are fully booked.")} group="reordering-standing-waiting" subject_rest={%{id: "reordering-standing-chess-subject"}} actions={[~H[<Kit.Phoenix.Roles.Reordering.move row="reordering-standing-chess" subject="reordering-standing-chess-subject" />]]} facts={[%Kit.Phoenix.Table.FactCell{content: Kit.Phoenix.Table.Fact.words([Kit.Phoenix.Words.text("Ana Lima")])}]}><a href="#role-reordering">Chess club</a></:row>
  </Kit.Phoenix.Table.rows_table>
</Kit.Phoenix.Roles.Reordering.table>
<p class="specimen-case-line">Records with identifier subjects.</p>
<Kit.Phoenix.Table.rows_table id="records-identifier-subjects">
  <:caption>Records by number</:caption>
  <:subject_heading label="Record" />
  <:column_headings label="Name">Name</:column_headings>
  <:row facts={[%Kit.Phoenix.Table.FactCell{content: Kit.Phoenix.Table.Fact.words([Kit.Phoenix.Words.text("Saturday hire")])}]}><a href="#role-reordering"><code>PD/RCT/0001</code></a></:row>
  <:row facts={[%Kit.Phoenix.Table.FactCell{content: Kit.Phoenix.Table.Fact.words([Kit.Phoenix.Words.text("Revised Saturday hire")])}]}><a href="#role-reordering"><code>PD/RCT/0001/REVISION/00000000000000000000000000000000000000000000000000000001</code></a></:row>
</Kit.Phoenix.Table.rows_table>
<p class="specimen-case-line">Identifier subjects in the rows print form.</p>
<Kit.Phoenix.Table.rows_table id="records-identifier-subjects-rows" print_form="rows">
  <:caption>Records by number</:caption>
  <:subject_heading label="Record" />
  <:column_headings label="Name">Name</:column_headings>
  <:row facts={[%Kit.Phoenix.Table.FactCell{content: Kit.Phoenix.Table.Fact.words([Kit.Phoenix.Words.text("Saturday hire")])}]}><a href="#role-reordering"><code>PD/RCT/0001</code></a></:row>
  <:row facts={[%Kit.Phoenix.Table.FactCell{content: Kit.Phoenix.Table.Fact.words([Kit.Phoenix.Words.text("Revised Saturday hire")])}]}><a href="#role-reordering"><code>PD/RCT/0001/REVISION/00000000000000000000000000000000000000000000000000000001</code></a></:row>
</Kit.Phoenix.Table.rows_table>
<p class="specimen-case-line">A total without a supporting price.</p>
<Kit.Phoenix.Table.rows_table id="records-total">
  <:caption>Hire price</:caption>
  <:subject_heading label="Item" />
  <:column_headings label="Price" kind="amount">Price</:column_headings>
  <:row facts={[%Kit.Phoenix.Table.FactCell{content: Kit.Phoenix.Table.Fact.words([Kit.Phoenix.Words.amount(Kit.Phoenix.Amount.money(reader(), Money.new(:GBP, "680.00")))])}]}>Room hire</:row>
  <:total facts={[%Kit.Phoenix.Table.FactCell{content: Kit.Phoenix.Table.Fact.words([Kit.Phoenix.Words.amount(Kit.Phoenix.Amount.money(reader(), Money.new(:GBP, "680.00")))])}]}>Total due</:total>
</Kit.Phoenix.Table.rows_table>
<p class="specimen-case-line">A total with a credit card price underneath.</p>
<Kit.Phoenix.Table.rows_table id="records-total-supporting">
  <:caption>Hire price</:caption>
  <:subject_heading label="Item" />
  <:column_headings label="Price" kind="amount">Price</:column_headings>
  <:row facts={[%Kit.Phoenix.Table.FactCell{content: Kit.Phoenix.Table.Fact.words([Kit.Phoenix.Words.amount(Kit.Phoenix.Amount.money(reader(), Money.new(:GBP, "680.00")))])}]}>Room hire</:row>
  <:total facts={[%Kit.Phoenix.Table.FactCell{content: Kit.Phoenix.Table.Fact.words([Kit.Phoenix.Words.amount(Kit.Phoenix.Amount.money(reader(), Money.new(:GBP, "680.00")))]), supporting: [Kit.Phoenix.Supporting.line([Kit.Phoenix.Words.text("Price when paying by credit card, including the processing fee: "), Kit.Phoenix.Words.amount(Kit.Phoenix.Amount.money(reader(), Money.new(:GBP, "701.94")))])]}]}>Total due</:total>
</Kit.Phoenix.Table.rows_table>
<p class="specimen-case-line">The same total, printed as labelled rows.</p>
<Kit.Phoenix.Table.rows_table id="records-total-supporting-rows" print_form="rows">
  <:caption>Hire price</:caption>
  <:subject_heading label="Item" />
  <:column_headings label="Price" kind="amount">Price</:column_headings>
  <:row facts={[%Kit.Phoenix.Table.FactCell{content: Kit.Phoenix.Table.Fact.words([Kit.Phoenix.Words.amount(Kit.Phoenix.Amount.money(reader(), Money.new(:GBP, "680.00")))])}]}>Room hire</:row>
  <:total facts={[%Kit.Phoenix.Table.FactCell{content: Kit.Phoenix.Table.Fact.words([Kit.Phoenix.Words.amount(Kit.Phoenix.Amount.money(reader(), Money.new(:GBP, "680.00")))]), supporting: [Kit.Phoenix.Supporting.line([Kit.Phoenix.Words.text("Price when paying by credit card, including the processing fee: "), Kit.Phoenix.Words.amount(Kit.Phoenix.Amount.money(reader(), Money.new(:GBP, "701.94")))])]}]}>Total due</:total>
</Kit.Phoenix.Table.rows_table>
<p class="specimen-case-line">A total with a credit card price beneath its name.</p>
<Kit.Phoenix.Table.comparison_table id="comparison-total-supporting">
  <:caption>Hire price</:caption>
  <:subject_heading label="Item" />
  <:column_headings label="Price" kind="amount">Price</:column_headings>
  <:row facts={[%Kit.Phoenix.Table.ComparisonCell{content: Kit.Phoenix.Table.Fact.words([Kit.Phoenix.Words.amount(Kit.Phoenix.Amount.money(reader(), Money.new(:GBP, "680.00")))])}]}>Room hire</:row>
  <:total subject_supporting={[Kit.Phoenix.Supporting.line([Kit.Phoenix.Words.text("Price when paying by credit card, including the processing fee: "), Kit.Phoenix.Words.amount(Kit.Phoenix.Amount.money(reader(), Money.new(:GBP, "701.94")))])]} facts={[%Kit.Phoenix.Table.ComparisonCell{content: Kit.Phoenix.Table.Fact.words([Kit.Phoenix.Words.amount(Kit.Phoenix.Amount.money(reader(), Money.new(:GBP, "680.00")))])}]}>Total due</:total>
</Kit.Phoenix.Table.comparison_table>
<p class="specimen-case-line">The Move dialog, opened on its own.</p>
<Kit.Phoenix.Roles.SecondaryAction.secondary_action {%{"commandfor" => "reordering-rooms-move", "command" => "show-modal"}}>Show the Move dialog</Kit.Phoenix.Roles.SecondaryAction.secondary_action>

<Kit.Phoenix.Roles.Reordering.table id="reordering-moving-standing" ordering={Kit.Phoenix.Roles.Reordering.Ordering.ordered("Place it", "Request")} on_move="move" group_label="Standing" close_label="Keep the order">
  <:group id="reordering-moving-standing-confirmed">Confirmed</:group>
  <:group id="reordering-moving-standing-waiting">Waiting</:group>
  <:group id="reordering-moving-standing-declined">Declined</:group>
  <:position id="reordering-moving-standing-choir" group="reordering-moving-standing-confirmed">Choir rehearsal</:position>
  <:position id="reordering-moving-standing-yoga" group="reordering-moving-standing-confirmed">Yoga class</:position>
  <:position id="reordering-moving-standing-toddlers" group="reordering-moving-standing-waiting">Toddler group</:position>
  <:position id="reordering-moving-standing-chess" group="reordering-moving-standing-waiting">Chess club</:position>
  <Kit.Phoenix.Table.rows_table handle>
    <:caption>Requests for Saturday mornings by standing</:caption>
    <:subject_heading label="Request" />
    <:column_headings label="Hirer responsible for the request">Hirer responsible for the request</:column_headings>
    <:group id="reordering-moving-standing-confirmed" count="2"><Kit.Phoenix.Roles.Stamp.stamp state="settled">Confirmed</Kit.Phoenix.Roles.Stamp.stamp></:group>
    <:group id="reordering-moving-standing-waiting" count="2"><Kit.Phoenix.Roles.Stamp.stamp state="attention">Waiting</Kit.Phoenix.Roles.Stamp.stamp></:group>
    <:group id="reordering-moving-standing-declined" count="0"><Kit.Phoenix.Roles.Stamp.stamp state="neutral">Declined</Kit.Phoenix.Roles.Stamp.stamp></:group>
    <:row rest={%{id: "reordering-moving-standing-choir"}} group="reordering-moving-standing-confirmed" subject_rest={%{id: "reordering-moving-standing-choir-subject"}} actions={[~H[<Kit.Phoenix.Roles.Reordering.move row="reordering-moving-standing-choir" subject="reordering-moving-standing-choir-subject" />]]} facts={[%Kit.Phoenix.Table.FactCell{content: Kit.Phoenix.Table.Fact.words([Kit.Phoenix.Words.text("Oakmere Singers")])}]}><a href="../#role-reordering-moving">Choir rehearsal</a></:row>
    <:row rest={%{id: "reordering-moving-standing-yoga"}} group="reordering-moving-standing-confirmed" subject_rest={%{id: "reordering-moving-standing-yoga-subject"}} actions={[~H[<Kit.Phoenix.Roles.Reordering.move row="reordering-moving-standing-yoga" subject="reordering-moving-standing-yoga-subject" />]]} facts={[%Kit.Phoenix.Table.FactCell{content: Kit.Phoenix.Table.Fact.words([Kit.Phoenix.Words.text("Priya Shah")])}]}><a href="../#role-reordering-moving">Yoga class</a></:row>
    <:row rest={%{id: "reordering-moving-standing-toddlers"}} group="reordering-moving-standing-waiting" subject_rest={%{id: "reordering-moving-standing-toddlers-subject"}} actions={[~H[<Kit.Phoenix.Roles.Reordering.move row="reordering-moving-standing-toddlers" subject="reordering-moving-standing-toddlers-subject" />]]} facts={[%Kit.Phoenix.Table.FactCell{content: Kit.Phoenix.Table.Fact.words([Kit.Phoenix.Words.text("Tom Reid")])}]}><a href="../#role-reordering-moving">Toddler group</a></:row>
    <:row rest={%{id: "reordering-moving-standing-chess"}} group="reordering-moving-standing-waiting" subject_rest={%{id: "reordering-moving-standing-chess-subject"}} actions={[~H[<Kit.Phoenix.Roles.Reordering.move row="reordering-moving-standing-chess" subject="reordering-moving-standing-chess-subject" />]]} facts={[%Kit.Phoenix.Table.FactCell{content: Kit.Phoenix.Table.Fact.words([Kit.Phoenix.Words.text("Ana Lima")])}]}><a href="../#role-reordering-moving">Chess club</a></:row>
  </Kit.Phoenix.Table.rows_table>
</Kit.Phoenix.Roles.Reordering.table>
<p class="specimen-case-line">Rooms waiting for their order to be checked.</p>
<details>
  <summary>Move a room</summary>
  <Kit.Phoenix.Roles.Reordering.reordering id="reordering-inert-rooms" ordering={Kit.Phoenix.Roles.Reordering.Ordering.ordered("Place it", "Room")} on_move="move" close_label="Keep the order" move_state={Kit.Phoenix.ActionState.inert("reordering-inert-rooms-commit", [Kit.Phoenix.Words.text("Move waits until the room order has been checked.")])}>
    <:position id="reordering-inert-rooms-garden-room">Garden room</:position>
    <:position id="reordering-inert-rooms-committee-room">Committee room</:position>
    <Kit.Phoenix.Roles.Row.row :for={{slug, name, seats} <- [{"garden-room", "Garden room", 30}, {"committee-room", "Committee room", 12}]} id={"reordering-inert-rooms-" <> slug} handle>
      <:subject href="../#role-reordering-moving" rest={%{id: "reordering-inert-rooms-" <> slug <> "-subject"}}>{name}</:subject>
      <:facts>Seats <Kit.Phoenix.Roles.Amount.amount value={Kit.Phoenix.Amount.count(reader(), seats)} /></:facts>
      <:actions move />
    </Kit.Phoenix.Roles.Row.row>
  </Kit.Phoenix.Roles.Reordering.reordering>
</details>