Calendar

<Kit.Phoenix.Layouts.Shell.shell print_identity={@print.identity} print_subject={@print.subject} print_standing={@print.standing} print_tenant={@print.tenant} product="kit" tenant={Kit.Phoenix.Tenant.follows("Oakmere Village Hall")} navigation_label="Application" navigation="rail" density="desk">
  <:destination href="?destination=home#main" icon="house" bar>Home</:destination>
  <:destination href="#main" current icon="calendar" bar>Calendar</:destination>
  <:destination href="../reports/" icon="chart-bar" bar>Reports</:destination>
  <:account name="Maya Patel" initials="MP" email="maya.patel@oakmerehall.org.uk" />
  <:context name="Oakmere Village Hall" href="?hall=oakmere#main" current />
  <:account_settings href="?destination=account-settings#main" />
  <:sign_out action="?sign-out" />
  <:rail_head href="?destination=home#main" />
  <:subject>Calendar</:subject>
  <:lede_range days={Kit.Phoenix.Time.week(reader(), ~D[2025-04-14])} />
  <:lede words="16 items" />
  <:actions><a href="../layout-calendar/#layout-calendar">{@owner}</a></:actions>
  <:body id="main">
    <div>
    <Kit.Phoenix.Layouts.Calendar.calendar :let={subject_region} subject_state={Kit.Phoenix.State.none()} range_days={Kit.Phoenix.Time.week(reader(), ~D[2025-04-14])} toolbar_rest={%{"aria-label": "Calendar controls"}} scope_id="kit-calendar-filters" filters_label="Filters" filters_count={%Kit.Phoenix.Roles.Count{reader: reader(), count: 3, counts: "filters", forms: %{one: "filter"}}} clear_filters_href="?week=this&hall=oakmere">
      <:today label="Today" />
      <:previous label="Previous week" href="?week=previous" rest={%{rel: "prev"}} />
      <:next label="Next week" href="?week=next" rest={%{rel: "next"}} />
      <:date><Kit.Phoenix.Roles.FormGroup.form_group id="calendar-date"><:label>Go to a date</:label><:control :let={binding}><Kit.Phoenix.Roles.DateField.date_field binding={binding} reader={reader()} name="date" value={Kit.Phoenix.Roles.DateField.Committed.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-14]))} today={Kit.Phoenix.Time.day(reader(), ~D[2025-04-14])} direction={:either} /></:control></Kit.Phoenix.Roles.FormGroup.form_group></:date>
      <:scope>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-scope-form-group" kind={Kit.Phoenix.Roles.FormGroup.Kind.select()} control_value="oakmere" control_rest={%{id: "calendar-scope"}}><:label rest={%{for: "calendar-scope"}}>Hall</:label><:option value="all">All halls</:option><:option value="oakmere">Oakmere Hall</:option></Kit.Phoenix.Roles.FormGroup.form_group>
      </:scope>
      <:scope>
        <Kit.Phoenix.Layouts.List.Filter.filter id="calendar-room-filter" name="Room" applied="Main Hall" clear_href="?week=this&hall=oakmere&payment=overdue&catering=kitchen"><Kit.Phoenix.Roles.FormGroup.form_group id="calendar-scope-room-form-group" kind={Kit.Phoenix.Roles.FormGroup.Kind.select()} control_value="main-hall" control_rest={%{id: "calendar-scope-room"}}><:label rest={%{for: "calendar-scope-room"}}>Room</:label><:option value="all">All rooms</:option><:option value="main-hall">Main Hall</:option><:option value="meeting-room">Meeting Room</:option><:option value="memorial-room">Memorial Room</:option></Kit.Phoenix.Roles.FormGroup.form_group></Kit.Phoenix.Layouts.List.Filter.filter>
      </:scope>
      <:scope>
        <Kit.Phoenix.Layouts.List.Filter.filter id="calendar-booking-filter" name="Booking"><Kit.Phoenix.Roles.FormGroup.form_group id="calendar-scope-booking-form-group" kind={Kit.Phoenix.Roles.FormGroup.Kind.select()} control_value="all" control_rest={%{id: "calendar-scope-booking"}}><:label rest={%{for: "calendar-scope-booking"}}>Booking</:label><:option value="all">Any booking</:option><:option value="regular">Regular</:option><:option value="one-off">One-off</:option></Kit.Phoenix.Roles.FormGroup.form_group></Kit.Phoenix.Layouts.List.Filter.filter>
      </:scope>
      <:scope>
        <Kit.Phoenix.Layouts.List.Filter.filter id="calendar-status-filter" name="Status"><Kit.Phoenix.Roles.FormGroup.form_group id="calendar-scope-status-form-group" kind={Kit.Phoenix.Roles.FormGroup.Kind.select()} control_value="all" control_rest={%{id: "calendar-scope-status"}}><:label rest={%{for: "calendar-scope-status"}}>Status</:label><:option value="all">Any status</:option><:option value="confirmed">Confirmed</:option><:option value="provisional">Provisional</:option></Kit.Phoenix.Roles.FormGroup.form_group></Kit.Phoenix.Layouts.List.Filter.filter>
      </:scope>
      <:scope>
        <Kit.Phoenix.Layouts.List.Filter.filter id="calendar-hirer-kind-filter" name="Hirer kind"><Kit.Phoenix.Roles.FormGroup.form_group id="calendar-scope-hirer-kind-form-group" kind={Kit.Phoenix.Roles.FormGroup.Kind.select()} control_value="all" control_rest={%{id: "calendar-scope-hirer-kind"}}><:label rest={%{for: "calendar-scope-hirer-kind"}}>Hirer kind</:label><:option value="all">Any hirer</:option><:option value="school">School</:option><:option value="club">Club</:option><:option value="private">Private</:option></Kit.Phoenix.Roles.FormGroup.form_group></Kit.Phoenix.Layouts.List.Filter.filter>
      </:scope>
      <:scope>
        <Kit.Phoenix.Layouts.List.Filter.filter id="calendar-payment-filter" name="Payment" applied="Overdue" clear_href="?week=this&hall=oakmere&room=main-hall&catering=kitchen"><Kit.Phoenix.Roles.FormGroup.form_group id="calendar-scope-payment-form-group" kind={Kit.Phoenix.Roles.FormGroup.Kind.select()} control_value="overdue" control_rest={%{id: "calendar-scope-payment"}}><:label rest={%{for: "calendar-scope-payment"}}>Payment</:label><:option value="all">Any payment</:option><:option value="paid">Paid</:option><:option value="due">Due</:option><:option value="overdue">Overdue</:option></Kit.Phoenix.Roles.FormGroup.form_group></Kit.Phoenix.Layouts.List.Filter.filter>
      </:scope>
      <:scope>
        <Kit.Phoenix.Layouts.List.Filter.filter id="calendar-setup-filter" name="Setup"><Kit.Phoenix.Roles.FormGroup.form_group id="calendar-scope-setup-form-group" kind={Kit.Phoenix.Roles.FormGroup.Kind.select()} control_value="all" control_rest={%{id: "calendar-scope-setup"}}><:label rest={%{for: "calendar-scope-setup"}}>Setup</:label><:option value="all">Any setup</:option><:option value="theatre">Theatre</:option><:option value="cabaret">Cabaret</:option><:option value="boardroom">Boardroom</:option></Kit.Phoenix.Roles.FormGroup.form_group></Kit.Phoenix.Layouts.List.Filter.filter>
      </:scope>
      <:scope>
        <Kit.Phoenix.Layouts.List.Filter.filter id="calendar-catering-filter" name="Catering" applied="Kitchen" clear_href="?week=this&hall=oakmere&room=main-hall&payment=overdue"><Kit.Phoenix.Roles.FormGroup.form_group id="calendar-scope-catering-form-group" kind={Kit.Phoenix.Roles.FormGroup.Kind.select()} control_value="kitchen" control_rest={%{id: "calendar-scope-catering"}}><:label rest={%{for: "calendar-scope-catering"}}>Catering</:label><:option value="all">Any catering</:option><:option value="kitchen">Kitchen</:option><:option value="none">None</:option></Kit.Phoenix.Roles.FormGroup.form_group></Kit.Phoenix.Layouts.List.Filter.filter>
      </:scope>
      <:scope>
        <Kit.Phoenix.Layouts.List.Filter.filter id="calendar-access-filter" name="Access"><Kit.Phoenix.Roles.FormGroup.form_group id="calendar-scope-access-form-group" kind={Kit.Phoenix.Roles.FormGroup.Kind.select()} control_value="all" control_rest={%{id: "calendar-scope-access"}}><:label rest={%{for: "calendar-scope-access"}}>Access</:label><:option value="all">Any access</:option><:option value="step-free">Step-free</:option><:option value="parking">Parking</:option></Kit.Phoenix.Roles.FormGroup.form_group></Kit.Phoenix.Layouts.List.Filter.filter>
      </:scope>
      <:scope>
        <Kit.Phoenix.Layouts.List.Filter.filter id="calendar-deposit-filter" name="Deposit"><Kit.Phoenix.Roles.FormGroup.form_group id="calendar-scope-deposit-form-group" kind={Kit.Phoenix.Roles.FormGroup.Kind.select()} control_value="all" control_rest={%{id: "calendar-scope-deposit"}}><:label rest={%{for: "calendar-scope-deposit"}}>Deposit</:label><:option value="all">Any deposit</:option><:option value="held">Held</:option><:option value="returned">Returned</:option></Kit.Phoenix.Roles.FormGroup.form_group></Kit.Phoenix.Layouts.List.Filter.filter>
      </:scope>
      <:scope>
        <Kit.Phoenix.Layouts.List.Filter.more id="calendar-more-filters" count={%Kit.Phoenix.Roles.Count{reader: reader(), count: 0, counts: "filters", forms: %{one: "filter"}}}>
          <:filter id="calendar-room-filter" name="Room" applied="Main Hall" clear_href="?week=this&hall=oakmere&payment=overdue&catering=kitchen" />
          <:filter id="calendar-booking-filter" name="Booking" />
          <:filter id="calendar-status-filter" name="Status" />
          <:filter id="calendar-hirer-kind-filter" name="Hirer kind" />
          <:filter id="calendar-payment-filter" name="Payment" applied="Overdue" clear_href="?week=this&hall=oakmere&room=main-hall&catering=kitchen" />
          <:filter id="calendar-setup-filter" name="Setup" />
          <:filter id="calendar-catering-filter" name="Catering" applied="Kitchen" clear_href="?week=this&hall=oakmere&room=main-hall&payment=overdue" />
          <:filter id="calendar-access-filter" name="Access" />
          <:filter id="calendar-deposit-filter" name="Deposit" />
        </Kit.Phoenix.Layouts.List.Filter.more>
      </:scope>
      <:view>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-view-form-group"><:label>View</:label><:control_set :let={binding}><Kit.Phoenix.Roles.SegmentedControl.segmented_control binding={binding} name="calendar-view" value="week"><:option value="week">Week</:option><:option value="day">Day</:option><:option value="month">Month</:option></Kit.Phoenix.Roles.SegmentedControl.segmented_control></:control_set></Kit.Phoenix.Roles.FormGroup.form_group>
      </:view>
      <:actions><Kit.Phoenix.Roles.PrimaryAction.primary_action>New booking</Kit.Phoenix.Roles.PrimaryAction.primary_action></:actions>
      <:status_lines><Kit.Phoenix.Roles.StatusLine.status_line>New bookings wait for the hall manager to approve them.</Kit.Phoenix.Roles.StatusLine.status_line></:status_lines>
      <Kit.Phoenix.Layouts.Calendar.desk_grid subject_region={subject_region} columns={7} time_gutter_rest={%{"aria-label": "Times"}}>
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-14]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-15]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-16]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-17]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-18]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-19]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-20]))} />
        <:hour :for={hour <- (for hour <- 8..17, do: Kit.Phoenix.Time.clock(reader(), Time.new!(hour, 0, 0)))} time={hour} />
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Board meeting" href="../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 08:00:00Z], ~U[2025-04-14 09:00:00Z])} kind="Meeting" aria-label="Board meeting, 09:00–10:00" style="grid-row: 2 / span 1;" />
          <Kit.Phoenix.Layouts.Calendar.block name="Community lunch" href="../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 12:00:00Z], ~U[2025-04-14 12:29:00Z])} kind="Booking" aria-label="Community lunch, 13:00–13:29" style="grid-row: 6 / span 1; --kit-calendar-block-size: calc(var(--kit-hour-height) * 29 / 60);" />
        </:column>
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="School booking for Oakmere Hall" href="../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-15 08:00:00Z], ~U[2025-04-15 10:00:00Z])} kind="Booking" aria-label="School booking for Oakmere Hall, 09:00–11:00" style="grid-row: 2 / span 2;" />
          <Kit.Phoenix.Layouts.Calendar.block name="Room check" href="../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-15 12:00:00Z], ~U[2025-04-15 12:30:00Z])} kind="Inspection" aria-label="Room check, 13:00–13:30" style="grid-row: 6 / span 1; --kit-calendar-block-size: calc(var(--kit-hour-height) / 2);" />
          <Kit.Phoenix.Layouts.Calendar.block name="Key handover" href="../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-15 14:00:00Z], ~U[2025-04-15 14:20:00Z])} kind="Booking" aria-label="Key handover, 15:00–15:20" style="grid-row: 8 / span 1; --kit-calendar-block-size: calc(var(--kit-hour-height) / 3);" />
          <Kit.Phoenix.Layouts.Calendar.folded_run span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-15 15:00:00Z], ~U[2025-04-15 15:35:00Z])} count="3 inspections" href="day-one-column/" style="grid-row: 9 / span 1; --kit-calendar-block-size: calc(var(--kit-hour-height) * 7 / 12);" />
          <Kit.Phoenix.Layouts.Calendar.current_time style="--kit-calendar-now-offset: calc(3.5 * var(--kit-hour-height));" />
        </:column>
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Parish council" href="../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-16 10:00:00Z], ~U[2025-04-16 11:00:00Z])} kind="Meeting" aria-label="Parish council, 11:00–12:00" style="grid-row: 4 / span 1;" />
          <Kit.Phoenix.Layouts.Calendar.block name="Meter reading" href="../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-16 12:00:00Z], ~U[2025-04-16 12:05:00Z])} kind="Inspection" aria-label="Meter reading, 13:00–13:05" style="grid-row: 6 / span 1; --kit-calendar-block-size: calc(var(--kit-hour-height) / 12);" />
        </:column>
        <:column></:column>
        <:column rest={%{style: "--kit-calendar-column-parts: 2;"}}>
          <Kit.Phoenix.Layouts.Calendar.block name="Wedding reception" href="../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-18 11:00:00Z], ~U[2025-04-18 14:00:00Z])} kind="Booking" aria-label="Wedding reception, 12:00–15:00" style="grid-row: 5 / span 3; --kit-calendar-block-part: 1;" />
          <Kit.Phoenix.Layouts.Calendar.block name="Hire request" href="../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-18 10:00:00Z], ~U[2025-04-18 12:00:00Z])} kind="Requested" standings={["uncovered"]} standing_words={["Cover needed"]} aria-label="Hire request, 11:00–13:00, Cover needed" style="grid-row: 4 / span 2; --kit-calendar-block-part: 2;" />
        </:column>
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Yoga class" href="../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-19 09:00:00Z], ~U[2025-04-19 11:00:00Z])} kind="Booking" aria-label="Yoga class, 10:00–12:00" style="grid-row: 3 / span 2;" />
          <Kit.Phoenix.Layouts.Calendar.block name="Piano lesson" href="../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-19 13:00:00Z], ~U[2025-04-19 13:30:00Z])} kind="Booking" standings={["cancelled"]} standing_words={["Cancelled"]} aria-label="Piano lesson, 14:00–14:30, Cancelled" style="grid-row: 7 / span 1; --kit-calendar-block-size: calc(var(--kit-hour-height) / 2);" />
          <Kit.Phoenix.Layouts.Calendar.block name="Key collection" href="../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-19 14:00:00Z], ~U[2025-04-19 14:30:00Z])} kind="Booking" standings={["uncovered"]} standing_words={["Cover needed"]} standing={Kit.Phoenix.Roles.Row.Standing.unsaved("This booking will move when you are back online.")} aria-label="Key collection, 15:00–15:30, Cover needed, This booking will move when you are back online" style="grid-row: 8 / span 1; --kit-calendar-block-size: calc(var(--kit-hour-height) / 2);" />
        </:column>
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Summer term choir" href="../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-20 09:00:00Z], ~U[2025-04-20 11:00:00Z])} kind="Booking" standings={["preparation", "uncovered"]} standing_words={["Season not confirmed", "Cover needed"]} aria-label="Summer term choir, 10:00–12:00, Season not confirmed, Cover needed" style="grid-row: 3 / span 2;" />
        </:column>
      </Kit.Phoenix.Layouts.Calendar.desk_grid>
      <Kit.Phoenix.Layouts.Calendar.days subject_region={subject_region}>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-14])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Board meeting" href="../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 08:00:00Z], ~U[2025-04-14 09:00:00Z])} kind="Meeting" />
          <Kit.Phoenix.Layouts.Calendar.item_row name="Community lunch" href="../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 12:00:00Z], ~U[2025-04-14 12:29:00Z])} kind="Booking" />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-15])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="School booking for Oakmere Hall" href="../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-15 08:00:00Z], ~U[2025-04-15 10:00:00Z])} kind="Booking" />
          <Kit.Phoenix.Layouts.Calendar.item_row name="Room check" href="../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-15 12:00:00Z], ~U[2025-04-15 12:30:00Z])} kind="Inspection" room="Meeting Room" />
          <Kit.Phoenix.Layouts.Calendar.item_row name="Key handover" href="../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-15 14:00:00Z], ~U[2025-04-15 14:20:00Z])} kind="Booking" room="Meeting Room" />
          <Kit.Phoenix.Layouts.Calendar.item_row name="Room check" href="../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-15 15:00:00Z], ~U[2025-04-15 15:15:00Z])} kind="Inspection" room="Meeting Room" />
          <Kit.Phoenix.Layouts.Calendar.item_row name="Fire door check" href="../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-15 15:15:00Z], ~U[2025-04-15 15:30:00Z])} kind="Inspection" room="Meeting Room" standings={["uncovered"]} standing_words={["Cover needed"]} />
          <Kit.Phoenix.Layouts.Calendar.item_row name="Meter reading" href="../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-15 15:30:00Z], ~U[2025-04-15 15:35:00Z])} kind="Inspection" room="Meeting Room" />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-16])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Parish council" href="../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-16 10:00:00Z], ~U[2025-04-16 11:00:00Z])} kind="Meeting" />
          <Kit.Phoenix.Layouts.Calendar.item_row name="Meter reading" href="../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-16 12:00:00Z], ~U[2025-04-16 12:05:00Z])} kind="Inspection" room="Meeting Room" />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-17])}>
          <:empty>Nothing booked</:empty>
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-18])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Hire request" href="../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-18 10:00:00Z], ~U[2025-04-18 12:00:00Z])} kind="Requested" standings={["uncovered"]} standing_words={["Cover needed"]} />
          <Kit.Phoenix.Layouts.Calendar.item_row name="Wedding reception" href="../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-18 11:00:00Z], ~U[2025-04-18 14:00:00Z])} kind="Booking" />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-19])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Yoga class" href="../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-19 09:00:00Z], ~U[2025-04-19 11:00:00Z])} kind="Booking" />
          <Kit.Phoenix.Layouts.Calendar.item_row name="Piano lesson" href="../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-19 13:00:00Z], ~U[2025-04-19 13:30:00Z])} kind="Booking" standings={["cancelled"]} standing_words={["Cancelled"]} />
          <Kit.Phoenix.Layouts.Calendar.item_row name="Key collection" href="../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-19 14:00:00Z], ~U[2025-04-19 14:30:00Z])} kind="Booking" standings={["uncovered"]} standing_words={["Cover needed"]} standing={Kit.Phoenix.Roles.Row.Standing.unsaved("This booking will move when you are back online.")} />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-20])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Summer term choir" href="../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-20 09:00:00Z], ~U[2025-04-20 11:00:00Z])} kind="Booking" standings={["preparation", "uncovered"]} standing_words={["Season not confirmed", "Cover needed"]} />
        </Kit.Phoenix.Layouts.Calendar.day>
      </Kit.Phoenix.Layouts.Calendar.days>
    </Kit.Phoenix.Layouts.Calendar.calendar>
    </div>
  </:body>
</Kit.Phoenix.Layouts.Shell.shell>

<Kit.Phoenix.Layouts.Shell.shell print_identity={@print.identity} print_subject={@print.subject} print_standing={@print.standing} print_tenant={@print.tenant} product="kit" navigation_label="Application" navigation="none" density="desk">
  <:subject>Calendar</:subject>
  <:lede_range days={Kit.Phoenix.Time.day_range(reader(), ~D[2025-04-14], ~D[2025-04-20])} />
  <:lede words="12 items" />
  <:actions><a href="../../layout-calendar/#layout-calendar-long-hours">{@owner}</a></:actions>
  <:body>
    <Kit.Phoenix.Layouts.Calendar.calendar :let={subject_region} subject_state={Kit.Phoenix.State.none()} range_days={Kit.Phoenix.Time.day_range(reader(), ~D[2025-04-14], ~D[2025-04-20])} toolbar_rest={%{"aria-label": "Calendar controls"}} scope_id="kit-calendar-long-hours-filters" filters_label="Filters">
      <:today label="Today" />
      <:previous label="Previous week" href="?week=previous" rest={%{rel: "prev"}} />
      <:next label="Next week" href="?week=next" rest={%{rel: "next"}} />
      <:date><Kit.Phoenix.Roles.FormGroup.form_group id="calendar-long-hours-date"><:label>Go to a date</:label><:control :let={binding}><Kit.Phoenix.Roles.DateField.date_field binding={binding} reader={reader()} name="date" value={Kit.Phoenix.Roles.DateField.Committed.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-14]))} today={Kit.Phoenix.Time.day(reader(), ~D[2025-04-14])} direction={:either} /></:control></Kit.Phoenix.Roles.FormGroup.form_group></:date>
      <:scope>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-long-hours-scope-form-group" kind={Kit.Phoenix.Roles.FormGroup.Kind.select()} control_rest={%{id: "calendar-long-hours-scope"}}><:label rest={%{for: "calendar-long-hours-scope"}}>Hall</:label><:option value="all">All halls</:option><:option value="oakmere">Oakmere Hall</:option></Kit.Phoenix.Roles.FormGroup.form_group>
      </:scope>
      <:scope>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-long-hours-room-form-group" kind={Kit.Phoenix.Roles.FormGroup.Kind.select()} control_rest={%{id: "calendar-long-hours-room"}}><:label rest={%{for: "calendar-long-hours-room"}}>Room</:label><:option value="all">All rooms</:option><:option value="main-hall">Main Hall</:option><:option value="meeting-room">Meeting Room</:option></Kit.Phoenix.Roles.FormGroup.form_group>
      </:scope>
      <:view>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-long-hours-view-form-group"><:label>View</:label><:control_set :let={binding}><Kit.Phoenix.Roles.SegmentedControl.segmented_control binding={binding} name="calendar-long-hours-view" value="week"><:option value="week">Week</:option><:option value="day">Day</:option><:option value="month">Month</:option></Kit.Phoenix.Roles.SegmentedControl.segmented_control></:control_set></Kit.Phoenix.Roles.FormGroup.form_group>
      </:view>
      <:actions><Kit.Phoenix.Roles.PrimaryAction.primary_action>New booking</Kit.Phoenix.Roles.PrimaryAction.primary_action></:actions>
      <Kit.Phoenix.Layouts.Calendar.desk_grid subject_region={subject_region} columns={7} time_gutter_rest={%{"aria-label": "Times"}}>
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-14]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-15]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-16]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-17]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-18]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-19]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-20]))} />
        <:hour :for={hour <- (for hour <- 7..22, do: Kit.Phoenix.Time.clock(reader(), Time.new!(hour, 0, 0)))} time={hour} />
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Toddler group" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 08:30:00Z], ~U[2025-04-14 10:30:00Z])} kind="Booking" aria-label="Toddler group, 09:30–11:30" style="grid-row: 3 / span 3; --kit-calendar-block-offset: calc(var(--kit-hour-height) / 2); --kit-calendar-block-size: calc(var(--kit-hour-height) * 2);" />
          <Kit.Phoenix.Layouts.Calendar.block name="Badminton club" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 18:00:00Z], ~U[2025-04-14 20:00:00Z])} kind="Booking" aria-label="Badminton club, 19:00–21:00" style="grid-row: 13 / span 2;" />
        </:column>
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Art class" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-15 09:00:00Z], ~U[2025-04-15 11:00:00Z])} kind="Booking" aria-label="Art class, 10:00–12:00" style="grid-row: 4 / span 2;" />
          <Kit.Phoenix.Layouts.Calendar.block name="Choir rehearsal" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-15 17:30:00Z], ~U[2025-04-15 19:00:00Z])} kind="Booking" aria-label="Choir rehearsal, 18:30–20:00" style="grid-row: 12 / span 2; --kit-calendar-block-offset: calc(var(--kit-hour-height) / 2); --kit-calendar-block-size: calc(var(--kit-hour-height) * 1.5);" />
          <Kit.Phoenix.Layouts.Calendar.current_time style="--kit-calendar-now-offset: calc(7.5 * var(--kit-hour-height));" />
        </:column>
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Lunch club" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-16 12:00:00Z], ~U[2025-04-16 14:00:00Z])} kind="Booking" aria-label="Lunch club, 13:00–15:00" style="grid-row: 7 / span 2;" />
          <Kit.Phoenix.Layouts.Calendar.block name="Parish council" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-16 18:30:00Z], ~U[2025-04-16 20:30:00Z])} kind="Meeting" aria-label="Parish council, 19:30–21:30" style="grid-row: 13 / span 3; --kit-calendar-block-offset: calc(var(--kit-hour-height) / 2); --kit-calendar-block-size: calc(var(--kit-hour-height) * 2);" />
        </:column>
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Brownies" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-17 16:30:00Z], ~U[2025-04-17 18:00:00Z])} kind="Booking" aria-label="Brownies, 17:30–19:00" style="grid-row: 11 / span 2; --kit-calendar-block-offset: calc(var(--kit-hour-height) / 2); --kit-calendar-block-size: calc(var(--kit-hour-height) * 1.5);" />
        </:column>
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Hall inspection" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-18 08:00:00Z], ~U[2025-04-18 09:00:00Z])} kind="Inspection" aria-label="Hall inspection, 09:00–10:00" style="grid-row: 3 / span 1;" />
          <Kit.Phoenix.Layouts.Calendar.block name="Quiz night" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-18 19:00:00Z], ~U[2025-04-18 21:00:00Z])} kind="Booking" aria-label="Quiz night, 20:00–22:00" style="grid-row: 14 / span 2;" />
        </:column>
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Wedding reception" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-19 10:00:00Z], ~U[2025-04-19 14:00:00Z])} kind="Booking" aria-label="Wedding reception, 11:00–15:00" style="grid-row: 5 / span 4;" />
        </:column>
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Morning service" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-20 07:00:00Z], ~U[2025-04-20 08:30:00Z])} kind="Booking" aria-label="Morning service, 08:00–09:30" style="grid-row: 2 / span 2; --kit-calendar-block-size: calc(var(--kit-hour-height) * 1.5);" />
          <Kit.Phoenix.Layouts.Calendar.block name="Birthday party" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-20 15:00:00Z], ~U[2025-04-20 17:00:00Z])} kind="Booking" aria-label="Birthday party, 16:00–18:00" style="grid-row: 10 / span 2;" />
        </:column>
      </Kit.Phoenix.Layouts.Calendar.desk_grid>
      <Kit.Phoenix.Layouts.Calendar.days subject_region={subject_region}>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-14])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Toddler group" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 08:30:00Z], ~U[2025-04-14 10:30:00Z])} kind="Booking" />
          <Kit.Phoenix.Layouts.Calendar.item_row name="Badminton club" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 18:00:00Z], ~U[2025-04-14 20:00:00Z])} kind="Booking" />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-15])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Art class" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-15 09:00:00Z], ~U[2025-04-15 11:00:00Z])} kind="Booking" />
          <Kit.Phoenix.Layouts.Calendar.item_row name="Choir rehearsal" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-15 17:30:00Z], ~U[2025-04-15 19:00:00Z])} kind="Booking" />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-16])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Lunch club" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-16 12:00:00Z], ~U[2025-04-16 14:00:00Z])} kind="Booking" />
          <Kit.Phoenix.Layouts.Calendar.item_row name="Parish council" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-16 18:30:00Z], ~U[2025-04-16 20:30:00Z])} kind="Meeting" />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-17])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Brownies" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-17 16:30:00Z], ~U[2025-04-17 18:00:00Z])} kind="Booking" />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-18])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Hall inspection" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-18 08:00:00Z], ~U[2025-04-18 09:00:00Z])} kind="Inspection" room="Main Hall" />
          <Kit.Phoenix.Layouts.Calendar.item_row name="Quiz night" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-18 19:00:00Z], ~U[2025-04-18 21:00:00Z])} kind="Booking" />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-19])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Wedding reception" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-19 10:00:00Z], ~U[2025-04-19 14:00:00Z])} kind="Booking" />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-20])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Morning service" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-20 07:00:00Z], ~U[2025-04-20 08:30:00Z])} kind="Booking" />
          <Kit.Phoenix.Layouts.Calendar.item_row name="Birthday party" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-20 15:00:00Z], ~U[2025-04-20 17:00:00Z])} kind="Booking" />
        </Kit.Phoenix.Layouts.Calendar.day>
      </Kit.Phoenix.Layouts.Calendar.days>
    </Kit.Phoenix.Layouts.Calendar.calendar>
  </:body>
</Kit.Phoenix.Layouts.Shell.shell>

<Kit.Phoenix.Layouts.Shell.shell print_identity={@print.identity} print_subject={@print.subject} print_standing={@print.standing} print_tenant={@print.tenant} product="kit" navigation_label="Application" navigation="none" density="desk">
  <:subject>Calendar</:subject>
  <:lede_range days={Kit.Phoenix.Time.day_range(reader(), ~D[2025-04-14], ~D[2025-04-20])} />
  <:lede words="11 items" />
  <:actions><a href="../../layout-calendar/#layout-calendar-early-now">{@owner}</a></:actions>
  <:body>
    <Kit.Phoenix.Layouts.Calendar.calendar :let={subject_region} subject_state={Kit.Phoenix.State.none()} range_days={Kit.Phoenix.Time.day_range(reader(), ~D[2025-04-14], ~D[2025-04-20])} toolbar_rest={%{"aria-label": "Calendar controls"}} scope_id="kit-calendar-early-now-filters" filters_label="Filters">
      <:today label="Today" />
      <:previous label="Previous week" href="?week=previous" rest={%{rel: "prev"}} />
      <:next label="Next week" href="?week=next" rest={%{rel: "next"}} />
      <:date><Kit.Phoenix.Roles.FormGroup.form_group id="calendar-early-now-date"><:label>Go to a date</:label><:control :let={binding}><Kit.Phoenix.Roles.DateField.date_field binding={binding} reader={reader()} name="date" value={Kit.Phoenix.Roles.DateField.Committed.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-14]))} today={Kit.Phoenix.Time.day(reader(), ~D[2025-04-14])} direction={:either} /></:control></Kit.Phoenix.Roles.FormGroup.form_group></:date>
      <:scope>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-early-now-scope-form-group" kind={Kit.Phoenix.Roles.FormGroup.Kind.select()} control_rest={%{id: "calendar-early-now-scope"}}><:label rest={%{for: "calendar-early-now-scope"}}>Hall</:label><:option value="all">All halls</:option><:option value="oakmere">Oakmere Hall</:option></Kit.Phoenix.Roles.FormGroup.form_group>
      </:scope>
      <:scope>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-early-now-room-form-group" kind={Kit.Phoenix.Roles.FormGroup.Kind.select()} control_rest={%{id: "calendar-early-now-room"}}><:label rest={%{for: "calendar-early-now-room"}}>Room</:label><:option value="all">All rooms</:option><:option value="main-hall">Main Hall</:option><:option value="meeting-room">Meeting Room</:option></Kit.Phoenix.Roles.FormGroup.form_group>
      </:scope>
      <:view>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-early-now-view-form-group"><:label>View</:label><:control_set :let={binding}><Kit.Phoenix.Roles.SegmentedControl.segmented_control binding={binding} name="calendar-early-now-view" value="week"><:option value="week">Week</:option><:option value="day">Day</:option><:option value="month">Month</:option></Kit.Phoenix.Roles.SegmentedControl.segmented_control></:control_set></Kit.Phoenix.Roles.FormGroup.form_group>
      </:view>
      <:actions><Kit.Phoenix.Roles.PrimaryAction.primary_action>New booking</Kit.Phoenix.Roles.PrimaryAction.primary_action></:actions>
      <Kit.Phoenix.Layouts.Calendar.desk_grid subject_region={subject_region} columns={7} time_gutter_rest={%{"aria-label": "Times"}}>
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-14]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-15]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-16]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-17]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-18]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-19]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-20]))} />
        <:hour :for={hour <- (for hour <- 7..21, do: Kit.Phoenix.Time.clock(reader(), Time.new!(hour, 0, 0)))} time={hour} />
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Slimming group" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 08:30:00Z], ~U[2025-04-14 10:00:00Z])} kind="Booking" aria-label="Slimming group, 09:30–11:00" style="grid-row: 3 / span 2; --kit-calendar-block-offset: calc(var(--kit-hour-height) / 2); --kit-calendar-block-size: calc(var(--kit-hour-height) * 1.5);" />
          <Kit.Phoenix.Layouts.Calendar.block name="Youth club" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 17:00:00Z], ~U[2025-04-14 19:00:00Z])} kind="Booking" aria-label="Youth club, 18:00–20:00" style="grid-row: 12 / span 2;" />
        </:column>
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Baby clinic" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-15 08:00:00Z], ~U[2025-04-15 11:00:00Z])} kind="Booking" aria-label="Baby clinic, 09:00–12:00" style="grid-row: 3 / span 3;" />
          <Kit.Phoenix.Layouts.Calendar.block name="Table tennis" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-15 18:00:00Z], ~U[2025-04-15 19:30:00Z])} kind="Booking" aria-label="Table tennis, 19:00–20:30" style="grid-row: 13 / span 2; --kit-calendar-block-size: calc(var(--kit-hour-height) * 1.5);" />
        </:column>
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Coffee morning" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-16 09:00:00Z], ~U[2025-04-16 10:30:00Z])} kind="Booking" aria-label="Coffee morning, 10:00–11:30" style="grid-row: 4 / span 2; --kit-calendar-block-size: calc(var(--kit-hour-height) * 1.5);" />
          <Kit.Phoenix.Layouts.Calendar.block name="Trustees meeting" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-16 13:00:00Z], ~U[2025-04-16 14:30:00Z])} kind="Meeting" aria-label="Trustees meeting, 14:00–15:30" style="grid-row: 8 / span 2; --kit-calendar-block-size: calc(var(--kit-hour-height) * 1.5);" />
          <Kit.Phoenix.Layouts.Calendar.current_time style="--kit-calendar-now-offset: calc(2.25 * var(--kit-hour-height));" />
        </:column>
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Craft club" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-17 12:00:00Z], ~U[2025-04-17 14:00:00Z])} kind="Booking" aria-label="Craft club, 13:00–15:00" style="grid-row: 7 / span 2;" />
        </:column>
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Hall deep clean" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-18 07:00:00Z], ~U[2025-04-18 08:00:00Z])} kind="Inspection" aria-label="Hall deep clean, 08:00–09:00" style="grid-row: 2 / span 1;" />
          <Kit.Phoenix.Layouts.Calendar.block name="Film night" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-18 18:00:00Z], ~U[2025-04-18 20:00:00Z])} kind="Booking" aria-label="Film night, 19:00–21:00" style="grid-row: 13 / span 2;" />
        </:column>
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Christening party" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-19 11:00:00Z], ~U[2025-04-19 15:00:00Z])} kind="Booking" aria-label="Christening party, 12:00–16:00" style="grid-row: 6 / span 4;" />
        </:column>
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Art exhibition" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-20 10:00:00Z], ~U[2025-04-20 14:00:00Z])} kind="Booking" aria-label="Art exhibition, 11:00–15:00" style="grid-row: 5 / span 4;" />
        </:column>
      </Kit.Phoenix.Layouts.Calendar.desk_grid>
      <Kit.Phoenix.Layouts.Calendar.days subject_region={subject_region}>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-14])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Slimming group" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 08:30:00Z], ~U[2025-04-14 10:00:00Z])} kind="Booking" />
          <Kit.Phoenix.Layouts.Calendar.item_row name="Youth club" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 17:00:00Z], ~U[2025-04-14 19:00:00Z])} kind="Booking" />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-15])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Baby clinic" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-15 08:00:00Z], ~U[2025-04-15 11:00:00Z])} kind="Booking" />
          <Kit.Phoenix.Layouts.Calendar.item_row name="Table tennis" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-15 18:00:00Z], ~U[2025-04-15 19:30:00Z])} kind="Booking" />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-16])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Coffee morning" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-16 09:00:00Z], ~U[2025-04-16 10:30:00Z])} kind="Booking" />
          <Kit.Phoenix.Layouts.Calendar.item_row name="Trustees meeting" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-16 13:00:00Z], ~U[2025-04-16 14:30:00Z])} kind="Meeting" />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-17])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Craft club" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-17 12:00:00Z], ~U[2025-04-17 14:00:00Z])} kind="Booking" />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-18])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Hall deep clean" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-18 07:00:00Z], ~U[2025-04-18 08:00:00Z])} kind="Inspection" room="Main Hall" />
          <Kit.Phoenix.Layouts.Calendar.item_row name="Film night" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-18 18:00:00Z], ~U[2025-04-18 20:00:00Z])} kind="Booking" />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-19])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Christening party" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-19 11:00:00Z], ~U[2025-04-19 15:00:00Z])} kind="Booking" />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-20])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Art exhibition" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-20 10:00:00Z], ~U[2025-04-20 14:00:00Z])} kind="Booking" />
        </Kit.Phoenix.Layouts.Calendar.day>
      </Kit.Phoenix.Layouts.Calendar.days>
    </Kit.Phoenix.Layouts.Calendar.calendar>
  </:body>
</Kit.Phoenix.Layouts.Shell.shell>

<Kit.Phoenix.Layouts.Shell.shell print_identity={@print.identity} print_subject={@print.subject} print_standing={@print.standing} print_tenant={@print.tenant} product="kit" navigation_label="Application" navigation="none" density="desk">
  <:subject>Calendar</:subject>
  <:lede_range days={Kit.Phoenix.Time.day_range(reader(), ~D[2025-04-14], ~D[2025-04-18])} />
  <:lede words="4 items" />
  <:actions><a href="../../layout-calendar/#layout-calendar-bands">{@owner}</a></:actions>
  <:body>
    <Kit.Phoenix.Layouts.Calendar.calendar :let={subject_region} subject_state={Kit.Phoenix.State.none()} range_days={Kit.Phoenix.Time.day_range(reader(), ~D[2025-04-14], ~D[2025-04-18])} toolbar_rest={%{"aria-label": "Calendar controls"}} scope_id="kit-calendar-bands-filters" filters_label="Filters">
      <:today label="Today" />
      <:previous label="Previous week" href="?week=previous" rest={%{rel: "prev"}} />
      <:next label="Next week" href="?week=next" rest={%{rel: "next"}} />
      <:date><Kit.Phoenix.Roles.FormGroup.form_group id="calendar-bands-date"><:label>Go to a date</:label><:control :let={binding}><Kit.Phoenix.Roles.DateField.date_field binding={binding} reader={reader()} name="date" value={Kit.Phoenix.Roles.DateField.Committed.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-14]))} today={Kit.Phoenix.Time.day(reader(), ~D[2025-04-14])} direction={:either} /></:control></Kit.Phoenix.Roles.FormGroup.form_group></:date>
      <:scope>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-bands-scope-form-group" kind={Kit.Phoenix.Roles.FormGroup.Kind.select()} control_rest={%{id: "calendar-bands-scope"}}><:label rest={%{for: "calendar-bands-scope"}}>Hall</:label><:option value="all">All halls</:option><:option value="oakmere">Oakmere Hall</:option></Kit.Phoenix.Roles.FormGroup.form_group>
      </:scope>
      <:scope>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-bands-room-form-group" kind={Kit.Phoenix.Roles.FormGroup.Kind.select()} control_rest={%{id: "calendar-bands-room"}}><:label rest={%{for: "calendar-bands-room"}}>Room</:label><:option value="all">All rooms</:option><:option value="main-hall">Main Hall</:option></Kit.Phoenix.Roles.FormGroup.form_group>
      </:scope>
      <:view>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-bands-view-form-group"><:label>View</:label><:control_set :let={binding}><Kit.Phoenix.Roles.SegmentedControl.segmented_control binding={binding} name="calendar-bands-view" value="week"><:option value="week">Week</:option><:option value="day">Day</:option><:option value="month">Month</:option></Kit.Phoenix.Roles.SegmentedControl.segmented_control></:control_set></Kit.Phoenix.Roles.FormGroup.form_group>
      </:view>
      <:actions><Kit.Phoenix.Roles.PrimaryAction.primary_action>New booking</Kit.Phoenix.Roles.PrimaryAction.primary_action></:actions>
      <Kit.Phoenix.Layouts.Calendar.desk_grid subject_region={subject_region} columns={5} time_gutter_rest={%{"aria-label": "Times"}}>
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-14]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-15]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-16]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-17]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-18]))} />
        <:band href="../../record/" first={2} last={4} stack={1}>Hall closed for rewiring</:band>
        <:band href="../../record/" first={5} last={5} stack={1}>Spring fair</:band>
        <:band href="../../record/" first={5} last={5} stack={2}>Oakmere Primary School summer fair rehearsal</:band>
        <:hour :for={hour <- (for hour <- 9..13, do: Kit.Phoenix.Time.clock(reader(), Time.new!(hour, 0, 0)))} time={hour} />
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Board meeting" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 08:00:00Z], ~U[2025-04-14 09:00:00Z])} kind="Meeting" aria-label="Board meeting, 09:00–10:00" style="grid-row: 1 / span 1;" />
        </:column>
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Yoga class" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-15 10:00:00Z], ~U[2025-04-15 11:00:00Z])} kind="Booking" aria-label="Yoga class, 11:00–12:00" style="grid-row: 3 / span 1;" />
        </:column>
        <:column></:column>
        <:column></:column>
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Choir rehearsal" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-18 09:00:00Z], ~U[2025-04-18 10:30:00Z])} kind="Booking" aria-label="Choir rehearsal, 10:00–11:30" style="grid-row: 2 / span 2; --kit-calendar-block-size: calc(var(--kit-hour-height) * 1.5);" />
          <Kit.Phoenix.Layouts.Calendar.block name="Hall handover" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-18 12:00:00Z], ~U[2025-04-18 13:00:00Z])} kind="Booking" aria-label="Hall handover, 13:00–14:00" style="grid-row: 5 / span 1;" />
        </:column>
      </Kit.Phoenix.Layouts.Calendar.desk_grid>
      <Kit.Phoenix.Layouts.Calendar.days subject_region={subject_region}>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-14])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Board meeting" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 08:00:00Z], ~U[2025-04-14 09:00:00Z])} kind="Meeting" />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-15])}>
          <Kit.Phoenix.Layouts.Calendar.band_row name="Hall closed for rewiring" href="../../record/" />
          <Kit.Phoenix.Layouts.Calendar.item_row name="Yoga class" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-15 10:00:00Z], ~U[2025-04-15 11:00:00Z])} kind="Booking" />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-16])}>
          <Kit.Phoenix.Layouts.Calendar.band_row name="Hall closed for rewiring" href="../../record/" />
          <:empty>Nothing booked</:empty>
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-17])}>
          <Kit.Phoenix.Layouts.Calendar.band_row name="Hall closed for rewiring" href="../../record/" />
          <:empty>Nothing booked</:empty>
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-18])}>
          <Kit.Phoenix.Layouts.Calendar.band_row name="Spring fair" href="../../record/" />
          <Kit.Phoenix.Layouts.Calendar.band_row name="Oakmere Primary School summer fair rehearsal" href="../../record/" />
          <Kit.Phoenix.Layouts.Calendar.item_row name="Choir rehearsal" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-18 09:00:00Z], ~U[2025-04-18 10:30:00Z])} kind="Booking" />
          <Kit.Phoenix.Layouts.Calendar.item_row name="Hall handover" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-18 12:00:00Z], ~U[2025-04-18 13:00:00Z])} kind="Booking" />
        </Kit.Phoenix.Layouts.Calendar.day>
      </Kit.Phoenix.Layouts.Calendar.days>
    </Kit.Phoenix.Layouts.Calendar.calendar>
  </:body>
</Kit.Phoenix.Layouts.Shell.shell>

<Kit.Phoenix.Layouts.Shell.shell print_identity={@print.identity} print_subject={@print.subject} print_standing={@print.standing} print_tenant={@print.tenant} product="kit" navigation_label="Application" navigation="none" density="desk">
  <:subject>Calendar</:subject>
  <:lede_range days={Kit.Phoenix.Time.day_range(reader(), ~D[2025-04-14], ~D[2025-04-16])} />
  <:lede words="3 items" />
  <:actions><a href="../../layout-calendar/#layout-calendar-partial-day-closure">{@owner}</a></:actions>
  <:body>
    <Kit.Phoenix.Layouts.Calendar.calendar :let={subject_region} subject_state={Kit.Phoenix.State.none()} range_days={Kit.Phoenix.Time.day_range(reader(), ~D[2025-04-14], ~D[2025-04-16])} toolbar_rest={%{"aria-label": "Calendar controls"}} scope_id="kit-calendar-closure-filters" filters_label="Filters">
      <:today label="Today" />
      <:previous label="Previous week" href="?week=previous" rest={%{rel: "prev"}} />
      <:next label="Next week" href="?week=next" rest={%{rel: "next"}} />
      <:date><Kit.Phoenix.Roles.FormGroup.form_group id="calendar-partial-day-closure-date"><:label>Go to a date</:label><:control :let={binding}><Kit.Phoenix.Roles.DateField.date_field binding={binding} reader={reader()} name="date" value={Kit.Phoenix.Roles.DateField.Committed.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-14]))} today={Kit.Phoenix.Time.day(reader(), ~D[2025-04-14])} direction={:either} /></:control></Kit.Phoenix.Roles.FormGroup.form_group></:date>
      <:scope>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-closure-scope-form-group" kind={Kit.Phoenix.Roles.FormGroup.Kind.select()} control_rest={%{id: "calendar-closure-scope"}}><:label rest={%{for: "calendar-closure-scope"}}>Hall</:label><:option value="all">All halls</:option><:option value="oakmere">Oakmere Hall</:option></Kit.Phoenix.Roles.FormGroup.form_group>
      </:scope>
      <:scope>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-closure-room-form-group" kind={Kit.Phoenix.Roles.FormGroup.Kind.select()} control_rest={%{id: "calendar-closure-room"}}><:label rest={%{for: "calendar-closure-room"}}>Room</:label><:option value="all">All rooms</:option><:option value="main-hall">Main Hall</:option><:option value="meeting-room">Meeting Room</:option></Kit.Phoenix.Roles.FormGroup.form_group>
      </:scope>
      <:view>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-partial-day-closure-view-form-group"><:label>View</:label><:control_set :let={binding}><Kit.Phoenix.Roles.SegmentedControl.segmented_control binding={binding} name="calendar-partial-day-closure-view" value="week"><:option value="week">Week</:option><:option value="day">Day</:option><:option value="month">Month</:option></Kit.Phoenix.Roles.SegmentedControl.segmented_control></:control_set></Kit.Phoenix.Roles.FormGroup.form_group>
      </:view>
      <:actions><Kit.Phoenix.Roles.PrimaryAction.primary_action>New booking</Kit.Phoenix.Roles.PrimaryAction.primary_action></:actions>
      <Kit.Phoenix.Layouts.Calendar.desk_grid subject_region={subject_region} columns={3} time_gutter_rest={%{"aria-label": "Times"}}>
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-14]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-15]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-16]))} />
        <:hour :for={hour <- (for hour <- 9..14, do: Kit.Phoenix.Time.clock(reader(), Time.new!(hour, 0, 0)))} time={hour} />
        <:column>
          <Kit.Phoenix.Layouts.Calendar.closure name="Hall closed for floor cleaning" href="../../record/" style="grid-row: 4 / span 2;" />
          <Kit.Phoenix.Layouts.Calendar.block name="Community lunch" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 12:00:00Z], ~U[2025-04-14 13:00:00Z])} kind="Booking" aria-label="Community lunch, 13:00–14:00" style="grid-row: 5 / span 1;" />
        </:column>
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Yoga class" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-15 09:00:00Z], ~U[2025-04-15 10:00:00Z])} kind="Booking" aria-label="Yoga class, 10:00–11:00" style="grid-row: 2 / span 1;" />
        </:column>
        <:column>
          <Kit.Phoenix.Layouts.Calendar.closure name="Meeting Room closed for rewiring" href="../../record/" name_rest={%{draggable: "true"}} style="grid-row: 2 / span 2; --kit-calendar-block-size: calc(var(--kit-hour-height) * 1.5);" />
          <Kit.Phoenix.Layouts.Calendar.block name="Parish council" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-16 10:00:00Z], ~U[2025-04-16 11:00:00Z])} kind="Meeting" aria-label="Parish council, 11:00–12:00" style="grid-row: 3 / span 1;" />
        </:column>
      </Kit.Phoenix.Layouts.Calendar.desk_grid>
      <Kit.Phoenix.Layouts.Calendar.days subject_region={subject_region}>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-14])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Hall closed for floor cleaning" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 11:00:00Z], ~U[2025-04-14 13:00:00Z])} kind="Closure" />
          <Kit.Phoenix.Layouts.Calendar.item_row name="Community lunch" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 12:00:00Z], ~U[2025-04-14 13:00:00Z])} kind="Booking" />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-15])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Yoga class" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-15 09:00:00Z], ~U[2025-04-15 10:00:00Z])} kind="Booking" />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-16])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Meeting Room closed for rewiring" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-16 09:00:00Z], ~U[2025-04-16 10:30:00Z])} kind="Closure" />
          <Kit.Phoenix.Layouts.Calendar.item_row name="Parish council" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-16 10:00:00Z], ~U[2025-04-16 11:00:00Z])} kind="Meeting" />
        </Kit.Phoenix.Layouts.Calendar.day>
      </Kit.Phoenix.Layouts.Calendar.days>
    </Kit.Phoenix.Layouts.Calendar.calendar>
  </:body>
</Kit.Phoenix.Layouts.Shell.shell>

<Kit.Phoenix.Layouts.Shell.shell print_identity={@print.identity} print_subject={@print.subject} print_standing={@print.standing} print_tenant={@print.tenant} product="kit" navigation_label="Application" navigation="none" density="desk">
  <:subject>Calendar</:subject>
  <:lede_range days={Kit.Phoenix.Time.day_range(reader(), ~D[2025-04-14], ~D[2025-04-18])} />
  <:lede words="6 items" />
  <:actions><a href="../../layout-calendar/#layout-calendar-closure-under-block">{@owner}</a></:actions>
  <:body>
    <Kit.Phoenix.Layouts.Calendar.calendar :let={subject_region} subject_state={Kit.Phoenix.State.none()} range_days={Kit.Phoenix.Time.day_range(reader(), ~D[2025-04-14], ~D[2025-04-18])} toolbar_rest={%{"aria-label": "Calendar controls"}} scope_id="kit-calendar-closure-filters" filters_label="Filters">
      <:today label="Today" />
      <:previous label="Previous week" href="?week=previous" rest={%{rel: "prev"}} />
      <:next label="Next week" href="?week=next" rest={%{rel: "next"}} />
      <:date><Kit.Phoenix.Roles.FormGroup.form_group id="calendar-closure-under-block-date"><:label>Go to a date</:label><:control :let={binding}><Kit.Phoenix.Roles.DateField.date_field binding={binding} reader={reader()} name="date" value={Kit.Phoenix.Roles.DateField.Committed.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-14]))} today={Kit.Phoenix.Time.day(reader(), ~D[2025-04-14])} direction={:either} /></:control></Kit.Phoenix.Roles.FormGroup.form_group></:date>
      <:scope>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-closure-scope-form-group" kind={Kit.Phoenix.Roles.FormGroup.Kind.select()} control_rest={%{id: "calendar-closure-scope"}}><:label rest={%{for: "calendar-closure-scope"}}>Hall</:label><:option value="all">All halls</:option><:option value="oakmere">Oakmere Hall</:option></Kit.Phoenix.Roles.FormGroup.form_group>
      </:scope>
      <:scope>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-closure-room-form-group" kind={Kit.Phoenix.Roles.FormGroup.Kind.select()} control_rest={%{id: "calendar-closure-room"}}><:label rest={%{for: "calendar-closure-room"}}>Room</:label><:option value="all">All rooms</:option><:option value="main-hall">Main Hall</:option><:option value="meeting-room">Meeting Room</:option></Kit.Phoenix.Roles.FormGroup.form_group>
      </:scope>
      <:view>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-closure-under-block-view-form-group"><:label>View</:label><:control_set :let={binding}><Kit.Phoenix.Roles.SegmentedControl.segmented_control binding={binding} name="calendar-closure-under-block-view" value="week"><:option value="week">Week</:option><:option value="day">Day</:option><:option value="month">Month</:option></Kit.Phoenix.Roles.SegmentedControl.segmented_control></:control_set></Kit.Phoenix.Roles.FormGroup.form_group>
      </:view>
      <:actions><Kit.Phoenix.Roles.PrimaryAction.primary_action>New booking</Kit.Phoenix.Roles.PrimaryAction.primary_action></:actions>
      <Kit.Phoenix.Layouts.Calendar.desk_grid subject_region={subject_region} columns={5} time_gutter_rest={%{"aria-label": "Times"}}>
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-14]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-15]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-16]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-17]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-18]))} />
        <:hour :for={hour <- (for hour <- 13..18, do: Kit.Phoenix.Time.clock(reader(), Time.new!(hour, 0, 0)))} time={hour} />
        <:column rest={%{style: "--kit-calendar-column-parts: 2;"}}>
          <Kit.Phoenix.Layouts.Calendar.closure name="Floor repair" href="../../record/" style="grid-row: 4 / span 1; --kit-calendar-block-part: 2; --kit-calendar-block-offset: calc(var(--kit-hour-height) / 2); --kit-calendar-block-size: calc(var(--kit-hour-height) / 2);" />
          <Kit.Phoenix.Layouts.Calendar.block name="Teen jazz" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 15:00:00Z], ~U[2025-04-14 16:00:00Z])} kind="Class" aria-label="Teen jazz, 16:00–17:00" style="grid-row: 4 / span 1; --kit-calendar-block-part: 1;" />
        </:column>
        <:column rest={%{style: "--kit-calendar-column-parts: 2;"}}>
          <Kit.Phoenix.Layouts.Calendar.closure name="Fire drill" href="../../record/" style="grid-row: 2 / span 1; --kit-calendar-block-part: 2; --kit-calendar-block-size: calc(var(--kit-hour-height) / 4);" />
          <Kit.Phoenix.Layouts.Calendar.block name="Junior ballet" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-15 13:00:00Z], ~U[2025-04-15 13:30:00Z])} kind="Class" aria-label="Junior ballet, 14:00–14:30" style="grid-row: 2 / span 1; --kit-calendar-block-part: 1; --kit-calendar-block-size: calc(var(--kit-hour-height) / 2);" />
        </:column>
        <:column rest={%{style: "--kit-calendar-column-parts: 2;"}}>
          <Kit.Phoenix.Layouts.Calendar.closure name="Sound system check" href="../../record/" style="grid-row: 1 / span 2; --kit-calendar-block-part: 2; --kit-calendar-block-offset: calc(var(--kit-hour-height) / 2); --kit-calendar-block-size: var(--kit-hour-height);" />
          <Kit.Phoenix.Layouts.Calendar.block name="Adult contemporary" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-16 12:00:00Z], ~U[2025-04-16 14:00:00Z])} kind="Class" aria-label="Adult contemporary, 13:00–15:00" style="grid-row: 1 / span 2; --kit-calendar-block-part: 1;" />
        </:column>
        <:column rest={%{style: "--kit-calendar-column-parts: 2;"}}>
          <Kit.Phoenix.Layouts.Calendar.closure name="Heating maintenance" href="../../record/" style="grid-row: 4 / span 2; --kit-calendar-block-part: 2;" />
          <Kit.Phoenix.Layouts.Calendar.block name="Ballroom" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-17 14:30:00Z], ~U[2025-04-17 15:30:00Z])} kind="Class" aria-label="Ballroom, 15:30–16:30" style="grid-row: 3 / span 2; --kit-calendar-block-part: 1; --kit-calendar-block-offset: calc(var(--kit-hour-height) / 2); --kit-calendar-block-size: var(--kit-hour-height);" />
        </:column>
        <:column rest={%{style: "--kit-calendar-column-parts: 3;"}}>
          <Kit.Phoenix.Layouts.Calendar.closure name="Mirror cleaning" href="../../record/" style="grid-row: 2 / span 1; --kit-calendar-block-part: 3; --kit-calendar-block-offset: calc(var(--kit-hour-height) / 2); --kit-calendar-block-size: calc(var(--kit-hour-height) / 2);" />
          <Kit.Phoenix.Layouts.Calendar.block name="Hip hop" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-18 13:00:00Z], ~U[2025-04-18 14:00:00Z])} kind="Class" aria-label="Hip hop, 14:00–15:00" style="grid-row: 2 / span 1; --kit-calendar-block-part: 1;" />
          <Kit.Phoenix.Layouts.Calendar.block name="Tap" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-18 13:30:00Z], ~U[2025-04-18 14:30:00Z])} kind="Class" aria-label="Tap, 14:30–15:30" style="grid-row: 2 / span 2; --kit-calendar-block-part: 2; --kit-calendar-block-offset: calc(var(--kit-hour-height) / 2); --kit-calendar-block-size: var(--kit-hour-height);" />
        </:column>
      </Kit.Phoenix.Layouts.Calendar.desk_grid>
      <Kit.Phoenix.Layouts.Calendar.days subject_region={subject_region}>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-14])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Teen jazz" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 15:00:00Z], ~U[2025-04-14 16:00:00Z])} kind="Class" />
          <Kit.Phoenix.Layouts.Calendar.item_row name="Floor repair" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 15:30:00Z], ~U[2025-04-14 16:00:00Z])} kind="Closure" />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-15])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Fire drill" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-15 13:00:00Z], ~U[2025-04-15 13:15:00Z])} kind="Closure" />
          <Kit.Phoenix.Layouts.Calendar.item_row name="Junior ballet" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-15 13:00:00Z], ~U[2025-04-15 13:30:00Z])} kind="Class" />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-16])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Adult contemporary" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-16 12:00:00Z], ~U[2025-04-16 14:00:00Z])} kind="Class" />
          <Kit.Phoenix.Layouts.Calendar.item_row name="Sound system check" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-16 12:30:00Z], ~U[2025-04-16 13:30:00Z])} kind="Closure" />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-17])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Ballroom" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-17 14:30:00Z], ~U[2025-04-17 15:30:00Z])} kind="Class" />
          <Kit.Phoenix.Layouts.Calendar.item_row name="Heating maintenance" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-17 15:00:00Z], ~U[2025-04-17 17:00:00Z])} kind="Closure" />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-18])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Hip hop" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-18 13:00:00Z], ~U[2025-04-18 14:00:00Z])} kind="Class" />
          <Kit.Phoenix.Layouts.Calendar.item_row name="Mirror cleaning" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-18 13:30:00Z], ~U[2025-04-18 14:00:00Z])} kind="Closure" />
          <Kit.Phoenix.Layouts.Calendar.item_row name="Tap" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-18 13:30:00Z], ~U[2025-04-18 14:30:00Z])} kind="Class" />
        </Kit.Phoenix.Layouts.Calendar.day>
      </Kit.Phoenix.Layouts.Calendar.days>
    </Kit.Phoenix.Layouts.Calendar.calendar>
  </:body>
</Kit.Phoenix.Layouts.Shell.shell>

<Kit.Phoenix.Layouts.Shell.shell print_identity={@print.identity} print_subject={@print.subject} print_standing={@print.standing} print_tenant={@print.tenant} product="kit" navigation_label="Application" navigation="none" density="desk">
  <:subject>Calendar</:subject>
  <:lede_range days={Kit.Phoenix.Time.day_range(reader(), ~D[2025-04-14], ~D[2025-04-20])} />
  <:lede words="8 items" />
  <:actions><a href="../../layout-calendar/#layout-calendar-whole-day-closure">{@owner}</a></:actions>
  <:body>
    <Kit.Phoenix.Layouts.Calendar.calendar :let={subject_region} subject_state={Kit.Phoenix.State.none()} range_days={Kit.Phoenix.Time.day_range(reader(), ~D[2025-04-14], ~D[2025-04-20])} toolbar_rest={%{"aria-label": "Calendar controls"}} scope_id="kit-calendar-filters" filters_label="Filters">
      <:today label="Today" />
      <:previous label="Previous week" href="?week=previous" rest={%{rel: "prev"}} />
      <:next label="Next week" href="?week=next" rest={%{rel: "next"}} />
      <:date><Kit.Phoenix.Roles.FormGroup.form_group id="calendar-whole-day-closure-date"><:label>Go to a date</:label><:control :let={binding}><Kit.Phoenix.Roles.DateField.date_field binding={binding} reader={reader()} name="date" value={Kit.Phoenix.Roles.DateField.Committed.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-14]))} today={Kit.Phoenix.Time.day(reader(), ~D[2025-04-14])} direction={:either} /></:control></Kit.Phoenix.Roles.FormGroup.form_group></:date>
      <:scope>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-scope-form-group" kind={Kit.Phoenix.Roles.FormGroup.Kind.select()} control_rest={%{id: "calendar-scope"}}><:label rest={%{for: "calendar-scope"}}>Hall</:label><:option value="all">All halls</:option><:option value="oakmere">Oakmere Hall</:option></Kit.Phoenix.Roles.FormGroup.form_group>
      </:scope>
      <:scope>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-scope-room-form-group" kind={Kit.Phoenix.Roles.FormGroup.Kind.select()} control_rest={%{id: "calendar-scope-room"}}><:label rest={%{for: "calendar-scope-room"}}>Room</:label><:option value="all">All rooms</:option><:option value="main-hall">Main Hall</:option><:option value="meeting-room">Meeting Room</:option></Kit.Phoenix.Roles.FormGroup.form_group>
      </:scope>
      <:view>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-whole-day-closure-view-form-group"><:label>View</:label><:control_set :let={binding}><Kit.Phoenix.Roles.SegmentedControl.segmented_control binding={binding} name="calendar-whole-day-closure-view" value="week"><:option value="week">Week</:option><:option value="day">Day</:option></Kit.Phoenix.Roles.SegmentedControl.segmented_control></:control_set></Kit.Phoenix.Roles.FormGroup.form_group>
      </:view>
      <:actions><Kit.Phoenix.Roles.PrimaryAction.primary_action>New booking</Kit.Phoenix.Roles.PrimaryAction.primary_action></:actions>
      <Kit.Phoenix.Layouts.Calendar.desk_grid subject_region={subject_region} columns={7} time_gutter_rest={%{"aria-label": "Times"}}>
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-14]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-15]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-16]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-17]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-18]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-19]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-20]))} />
        <:band href="../../record/" first={4} last={4} stack={1}>Hall closed for rewiring</:band>
        <:band href="../../record/" first={6} last={6} stack={1}>Hall closed for resurfacing</:band>
        <:hour :for={hour <- (for hour <- 8..17, do: Kit.Phoenix.Time.clock(reader(), Time.new!(hour, 0, 0)))} time={hour} />
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Board meeting" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 08:00:00Z], ~U[2025-04-14 09:00:00Z])} kind="Meeting" aria-label="Board meeting, 09:00–10:00" style="grid-row: 2 / span 1;" />
        </:column>
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Yoga class" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-15 09:00:00Z], ~U[2025-04-15 10:00:00Z])} kind="Booking" aria-label="Yoga class, 10:00–11:00" style="grid-row: 3 / span 1;" />
        </:column>
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Parish council" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-16 10:00:00Z], ~U[2025-04-16 11:00:00Z])} kind="Meeting" aria-label="Parish council, 11:00–12:00" style="grid-row: 4 / span 1;" />
        </:column>
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Toddler group" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-17 08:30:00Z], ~U[2025-04-17 10:00:00Z])} kind="Booking" standings={["cancelled"]} standing_words={["Cancelled"]} aria-label="Toddler group, 09:30–11:00, Cancelled" style="grid-row: 2 / span 2; --kit-calendar-block-offset: calc(var(--kit-hour-height) / 2); --kit-calendar-block-size: calc(var(--kit-hour-height) * 1.5);" />
          <Kit.Phoenix.Layouts.Calendar.block name="Choir rehearsal" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-17 13:00:00Z], ~U[2025-04-17 14:30:00Z])} kind="Booking" standings={["cancelled"]} standing_words={["Cancelled"]} aria-label="Choir rehearsal, 14:00–15:30, Cancelled" style="grid-row: 7 / span 2; --kit-calendar-block-size: calc(var(--kit-hour-height) * 1.5);" />
        </:column>
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Wedding rehearsal" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-18 11:00:00Z], ~U[2025-04-18 12:00:00Z])} kind="Booking" aria-label="Wedding rehearsal, 12:00–13:00" style="grid-row: 5 / span 1;" />
        </:column>
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Yoga class" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-19 09:00:00Z], ~U[2025-04-19 10:00:00Z])} kind="Booking" standings={["cancelled"]} standing_words={["Cancelled"]} aria-label="Yoga class, 10:00–11:00, Cancelled" style="grid-row: 3 / span 1;" />
        </:column>
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Sunday service" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-20 09:00:00Z], ~U[2025-04-20 10:30:00Z])} kind="Booking" aria-label="Sunday service, 10:00–11:30" style="grid-row: 3 / span 2; --kit-calendar-block-size: calc(var(--kit-hour-height) * 1.5);" />
        </:column>
      </Kit.Phoenix.Layouts.Calendar.desk_grid>
      <Kit.Phoenix.Layouts.Calendar.days subject_region={subject_region}>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-14])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Board meeting" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 08:00:00Z], ~U[2025-04-14 09:00:00Z])} kind="Meeting" />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-15])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Yoga class" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-15 09:00:00Z], ~U[2025-04-15 10:00:00Z])} kind="Booking" />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-16])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Parish council" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-16 10:00:00Z], ~U[2025-04-16 11:00:00Z])} kind="Meeting" />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-17])}>
          <Kit.Phoenix.Layouts.Calendar.band_row name="Hall closed for rewiring" href="../../record/" />
          <Kit.Phoenix.Layouts.Calendar.item_row name="Toddler group" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-17 08:30:00Z], ~U[2025-04-17 10:00:00Z])} kind="Booking" standings={["cancelled"]} standing_words={["Cancelled"]} />
          <Kit.Phoenix.Layouts.Calendar.item_row name="Choir rehearsal" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-17 13:00:00Z], ~U[2025-04-17 14:30:00Z])} kind="Booking" standings={["cancelled"]} standing_words={["Cancelled"]} />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-18])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Wedding rehearsal" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-18 11:00:00Z], ~U[2025-04-18 12:00:00Z])} kind="Booking" />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-19])}>
          <Kit.Phoenix.Layouts.Calendar.band_row name="Hall closed for resurfacing" href="../../record/" />
          <Kit.Phoenix.Layouts.Calendar.item_row name="Yoga class" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-19 09:00:00Z], ~U[2025-04-19 10:00:00Z])} kind="Booking" standings={["cancelled"]} standing_words={["Cancelled"]} />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-20])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Sunday service" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-20 09:00:00Z], ~U[2025-04-20 10:30:00Z])} kind="Booking" />
        </Kit.Phoenix.Layouts.Calendar.day>
      </Kit.Phoenix.Layouts.Calendar.days>
    </Kit.Phoenix.Layouts.Calendar.calendar>
  </:body>
</Kit.Phoenix.Layouts.Shell.shell>

<Kit.Phoenix.Layouts.Shell.shell print_identity={@print.identity} print_subject={@print.subject} print_standing={@print.standing} print_tenant={@print.tenant} product="kit" navigation_label="Application" navigation="none" density="desk">
  <:subject>Calendar</:subject>
  <:lede_range days={Kit.Phoenix.Time.day_range(reader(), ~D[2025-04-14], ~D[2025-04-16])} />
  <:lede words="8 items" />
  <:actions><a href="../../layout-calendar/#layout-calendar-overlap">{@owner}</a></:actions>
  <:body>
    <Kit.Phoenix.Layouts.Calendar.calendar :let={subject_region} subject_state={Kit.Phoenix.State.none()} range_days={Kit.Phoenix.Time.day_range(reader(), ~D[2025-04-14], ~D[2025-04-16])} toolbar_rest={%{"aria-label": "Calendar controls"}} scope_id="kit-calendar-overlap-filters" filters_label="Filters">
      <:today label="Today" />
      <:previous label="Previous week" href="?week=previous" rest={%{rel: "prev"}} />
      <:next label="Next week" href="?week=next" rest={%{rel: "next"}} />
      <:date><Kit.Phoenix.Roles.FormGroup.form_group id="calendar-overlap-date"><:label>Go to a date</:label><:control :let={binding}><Kit.Phoenix.Roles.DateField.date_field binding={binding} reader={reader()} name="date" value={Kit.Phoenix.Roles.DateField.Committed.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-14]))} today={Kit.Phoenix.Time.day(reader(), ~D[2025-04-14])} direction={:either} /></:control></Kit.Phoenix.Roles.FormGroup.form_group></:date>
      <:scope>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-overlap-scope-form-group" kind={Kit.Phoenix.Roles.FormGroup.Kind.select()} control_rest={%{id: "calendar-overlap-scope"}}><:label rest={%{for: "calendar-overlap-scope"}}>Hall</:label><:option value="all">All halls</:option><:option value="oakmere">Oakmere Hall</:option></Kit.Phoenix.Roles.FormGroup.form_group>
      </:scope>
      <:scope>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-overlap-room-form-group" kind={Kit.Phoenix.Roles.FormGroup.Kind.select()} control_rest={%{id: "calendar-overlap-room"}}><:label rest={%{for: "calendar-overlap-room"}}>Room</:label><:option value="all">All rooms</:option><:option value="main-hall">Main Hall</:option></Kit.Phoenix.Roles.FormGroup.form_group>
      </:scope>
      <:view>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-overlap-view-form-group"><:label>View</:label><:control_set :let={binding}><Kit.Phoenix.Roles.SegmentedControl.segmented_control binding={binding} name="calendar-overlap-view" value="week"><:option value="week">Week</:option><:option value="day">Day</:option><:option value="month">Month</:option></Kit.Phoenix.Roles.SegmentedControl.segmented_control></:control_set></Kit.Phoenix.Roles.FormGroup.form_group>
      </:view>
      <:actions><Kit.Phoenix.Roles.PrimaryAction.primary_action>New booking</Kit.Phoenix.Roles.PrimaryAction.primary_action></:actions>
      <Kit.Phoenix.Layouts.Calendar.desk_grid subject_region={subject_region} columns={3} time_gutter_rest={%{"aria-label": "Times"}}>
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-14]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-15]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-16]))} />
        <:band href="../../record/" first={1} last={1} stack={1}>Open day</:band>
        <:band href="../../record/" first={1} last={1} stack={2}>Meeting Room decorated</:band>
        <:hour :for={hour <- (for hour <- 9..14, do: Kit.Phoenix.Time.clock(reader(), Time.new!(hour, 0, 0)))} time={hour} />
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Yoga class" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 09:00:00Z], ~U[2025-04-14 10:00:00Z])} kind="Booking" aria-label="Yoga class, 10:00–11:00" style="grid-row: 2 / span 1;" />
          <Kit.Phoenix.Layouts.Calendar.folded name="3 items" href="../day-rooms/" aria-label="3 items, 11:00–12:00" style="grid-row: 3 / span 1;" />
          <Kit.Phoenix.Layouts.Calendar.block name="Wedding reception" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 11:00:00Z], ~U[2025-04-14 14:00:00Z])} kind="Booking" aria-label="Wedding reception, 12:00–15:00" style="grid-row: 4 / span 3;" />
        </:column>
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Yoga class" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-15 09:00:00Z], ~U[2025-04-15 10:00:00Z])} kind="Booking" aria-label="Yoga class, 10:00–11:00" style="grid-row: 2 / span 1;" />
        </:column>
        <:column rest={%{style: "--kit-calendar-column-parts: 2;"}}>
          <Kit.Phoenix.Layouts.Calendar.block name="Toddler group" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-16 08:00:00Z], ~U[2025-04-16 10:00:00Z])} kind="Booking" aria-label="Toddler group, 09:00–11:00" style="grid-row: 1 / span 2; --kit-calendar-block-part: 1;" />
          <Kit.Phoenix.Layouts.Calendar.block name="Fire inspection" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-16 08:30:00Z], ~U[2025-04-16 09:30:00Z])} kind="Inspection" aria-label="Fire inspection, 09:30–10:30" style="grid-row: 1 / span 2; --kit-calendar-block-part: 2; --kit-calendar-block-offset: calc(var(--kit-hour-height) / 2); --kit-calendar-block-size: var(--kit-hour-height);" />
        </:column>
      </Kit.Phoenix.Layouts.Calendar.desk_grid>
      <Kit.Phoenix.Layouts.Calendar.days subject_region={subject_region}>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-14])}>
          <Kit.Phoenix.Layouts.Calendar.band_row name="Open day" href="../../record/" />
          <Kit.Phoenix.Layouts.Calendar.band_row name="Meeting Room decorated" href="../../record/" />
          <Kit.Phoenix.Layouts.Calendar.item_row name="Yoga class" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 09:00:00Z], ~U[2025-04-14 10:00:00Z])} kind="Booking" room="Main Hall" />
          <Kit.Phoenix.Layouts.Calendar.item_row name="Hire request" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 10:00:00Z], ~U[2025-04-14 11:00:00Z])} kind="Requested" />
          <Kit.Phoenix.Layouts.Calendar.item_row name="Parish council" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 10:00:00Z], ~U[2025-04-14 11:00:00Z])} kind="Meeting" room="Meeting Room" />
          <Kit.Phoenix.Layouts.Calendar.item_row name="Community lunch" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 10:30:00Z], ~U[2025-04-14 11:00:00Z])} kind="Booking" room="Main Hall" />
          <Kit.Phoenix.Layouts.Calendar.item_row name="Wedding reception" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 11:00:00Z], ~U[2025-04-14 14:00:00Z])} kind="Booking" room="Main Hall" />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-15])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Yoga class" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-15 09:00:00Z], ~U[2025-04-15 10:00:00Z])} kind="Booking" />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-16])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Toddler group" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-16 08:00:00Z], ~U[2025-04-16 10:00:00Z])} kind="Booking" />
          <Kit.Phoenix.Layouts.Calendar.item_row name="Fire inspection" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-16 08:30:00Z], ~U[2025-04-16 09:30:00Z])} kind="Inspection" />
        </Kit.Phoenix.Layouts.Calendar.day>
      </Kit.Phoenix.Layouts.Calendar.days>
    </Kit.Phoenix.Layouts.Calendar.calendar>
  </:body>
</Kit.Phoenix.Layouts.Shell.shell>

<Kit.Phoenix.Layouts.Shell.shell print_identity={@print.identity} print_subject={@print.subject} print_standing={@print.standing} print_tenant={@print.tenant} product="kit" navigation_label="Application" navigation="none" density="desk">
  <:subject>Calendar</:subject>
  <:lede_range days={Kit.Phoenix.Time.day_range(reader(), ~D[2025-04-14], ~D[2025-04-20])} />
  <:lede words="16 items" />
  <:actions><a href="../../layout-calendar/#layout-calendar-contiguous-run">{@owner}</a></:actions>
  <:body>
    <Kit.Phoenix.Layouts.Calendar.calendar :let={subject_region} subject_state={Kit.Phoenix.State.none()} range_days={Kit.Phoenix.Time.day_range(reader(), ~D[2025-04-14], ~D[2025-04-20])} toolbar_rest={%{"aria-label": "Calendar controls"}} scope_id="kit-calendar-contiguous-run-filters" filters_label="Filters">
      <:today label="Today" />
      <:previous label="Previous week" href="?week=previous" rest={%{rel: "prev"}} />
      <:next label="Next week" href="?week=next" rest={%{rel: "next"}} />
      <:date><Kit.Phoenix.Roles.FormGroup.form_group id="calendar-contiguous-run-date"><:label>Go to a date</:label><:control :let={binding}><Kit.Phoenix.Roles.DateField.date_field binding={binding} reader={reader()} name="date" value={Kit.Phoenix.Roles.DateField.Committed.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-14]))} today={Kit.Phoenix.Time.day(reader(), ~D[2025-04-14])} direction={:either} /></:control></Kit.Phoenix.Roles.FormGroup.form_group></:date>
      <:scope>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-contiguous-run-scope-form-group" kind={Kit.Phoenix.Roles.FormGroup.Kind.select()} control_rest={%{id: "calendar-contiguous-run-scope"}}><:label rest={%{for: "calendar-contiguous-run-scope"}}>Hall</:label><:option value="all">All halls</:option><:option value="oakmere">Oakmere Hall</:option></Kit.Phoenix.Roles.FormGroup.form_group>
      </:scope>
      <:scope>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-contiguous-run-room-form-group" kind={Kit.Phoenix.Roles.FormGroup.Kind.select()} control_rest={%{id: "calendar-contiguous-run-room"}}><:label rest={%{for: "calendar-contiguous-run-room"}}>Room</:label><:option value="all">All rooms</:option><:option value="main-hall">Main Hall</:option><:option value="meeting-room">Meeting Room</:option></Kit.Phoenix.Roles.FormGroup.form_group>
      </:scope>
      <:view>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-contiguous-run-view-form-group"><:label>View</:label><:control_set :let={binding}><Kit.Phoenix.Roles.SegmentedControl.segmented_control binding={binding} name="calendar-contiguous-run-view" value="week"><:option value="week">Week</:option><:option value="day">Day</:option><:option value="month">Month</:option></Kit.Phoenix.Roles.SegmentedControl.segmented_control></:control_set></Kit.Phoenix.Roles.FormGroup.form_group>
      </:view>
      <:actions><Kit.Phoenix.Roles.PrimaryAction.primary_action>New booking</Kit.Phoenix.Roles.PrimaryAction.primary_action></:actions>
      <Kit.Phoenix.Layouts.Calendar.desk_grid subject_region={subject_region} columns={7} time_gutter_rest={%{"aria-label": "Times"}}>
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-14]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-15]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-16]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-17]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-18]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-19]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-20]))} />
        <:hour :for={hour <- (for hour <- 9..12, do: Kit.Phoenix.Time.clock(reader(), Time.new!(hour, 0, 0)))} time={hour} />
        <:column>
          <Kit.Phoenix.Layouts.Calendar.folded_run span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 08:00:00Z], ~U[2025-04-14 08:20:00Z])} count="2 bookings" href="../day-one-column/" style="grid-row: 1 / span 1; --kit-calendar-block-size: calc(var(--kit-hour-height) / 3);" />
          <Kit.Phoenix.Layouts.Calendar.folded_run span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 09:00:00Z], ~U[2025-04-14 09:35:00Z])} count="3 room inspections" href="../day-one-column/" style="grid-row: 2 / span 1; --kit-calendar-block-size: calc(var(--kit-hour-height) * 7 / 12);" />
        </:column>
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Yoga" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-15 08:00:00Z], ~U[2025-04-15 08:15:00Z])} kind="Booking" aria-label="Yoga, 09:00–09:15" style="grid-row: 1 / span 1; --kit-calendar-block-size: calc(var(--kit-hour-height) / 4);" />
          <Kit.Phoenix.Layouts.Calendar.block name="Singing" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-15 08:45:00Z], ~U[2025-04-15 09:00:00Z])} kind="Booking" aria-label="Singing, 09:45–10:00" style="grid-row: 1 / span 1; --kit-calendar-block-offset: calc(var(--kit-hour-height) * 3 / 4); --kit-calendar-block-size: calc(var(--kit-hour-height) / 4);" />
        </:column>
        <:column>
          <Kit.Phoenix.Layouts.Calendar.folded_run span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-16 08:00:00Z], ~U[2025-04-16 08:45:00Z])} count="3 bookings" href="../day-one-column/" style="grid-row: 1 / span 1; --kit-calendar-block-size: calc(var(--kit-hour-height) * 3 / 4);" />
        </:column>
        <:column>
          <Kit.Phoenix.Layouts.Calendar.folded_run span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-17 08:00:00Z], ~U[2025-04-17 09:00:00Z])} count="4 inspections" href="../day-one-column/" style="grid-row: 1 / span 1;" />
        </:column>
        <:column>
          <Kit.Phoenix.Layouts.Calendar.folded_run span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-18 08:00:00Z], ~U[2025-04-18 08:30:00Z])} count="2 inspections" href="../day-one-column/" style="grid-row: 1 / span 1; --kit-calendar-block-size: calc(var(--kit-hour-height) / 2);" />
        </:column>
        <:column></:column>
        <:column></:column>
      </Kit.Phoenix.Layouts.Calendar.desk_grid>
      <Kit.Phoenix.Layouts.Calendar.days subject_region={subject_region}>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-14])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Chair stack" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 08:00:00Z], ~U[2025-04-14 08:10:00Z])} kind="Booking" room="Main Hall" />
          <Kit.Phoenix.Layouts.Calendar.item_row name="Trolley store" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 08:10:00Z], ~U[2025-04-14 08:20:00Z])} kind="Booking" room="Main Hall" />
          <Kit.Phoenix.Layouts.Calendar.item_row name="Room check" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 09:00:00Z], ~U[2025-04-14 09:10:00Z])} kind="Inspection" room="Meeting Room" />
          <Kit.Phoenix.Layouts.Calendar.item_row name="Fire door check" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 09:10:00Z], ~U[2025-04-14 09:20:00Z])} kind="Inspection" room="Meeting Room" />
          <Kit.Phoenix.Layouts.Calendar.item_row name="Meter reading" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 09:20:00Z], ~U[2025-04-14 09:35:00Z])} kind="Inspection" room="Meeting Room" />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-15])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Yoga" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-15 08:00:00Z], ~U[2025-04-15 08:15:00Z])} kind="Booking" room="Main Hall" />
          <Kit.Phoenix.Layouts.Calendar.item_row name="Singing" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-15 08:45:00Z], ~U[2025-04-15 09:00:00Z])} kind="Booking" room="Main Hall" />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-16])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Yoga" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-16 08:00:00Z], ~U[2025-04-16 08:15:00Z])} kind="Booking" room="Main Hall" />
          <Kit.Phoenix.Layouts.Calendar.item_row name="Judo" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-16 08:15:00Z], ~U[2025-04-16 08:30:00Z])} kind="Booking" room="Main Hall" />
          <Kit.Phoenix.Layouts.Calendar.item_row name="Singing" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-16 08:30:00Z], ~U[2025-04-16 08:45:00Z])} kind="Booking" room="Main Hall" />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-17])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Ramp check" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-17 08:00:00Z], ~U[2025-04-17 08:15:00Z])} kind="Inspection" room="Meeting Room" />
          <Kit.Phoenix.Layouts.Calendar.item_row name="Door widths" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-17 08:15:00Z], ~U[2025-04-17 08:30:00Z])} kind="Inspection" room="Meeting Room" />
          <Kit.Phoenix.Layouts.Calendar.item_row name="Hearing loop test" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-17 08:30:00Z], ~U[2025-04-17 08:45:00Z])} kind="Inspection" room="Meeting Room" />
          <Kit.Phoenix.Layouts.Calendar.item_row name="Signage check" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-17 08:45:00Z], ~U[2025-04-17 09:00:00Z])} kind="Inspection" room="Meeting Room" />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-18])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Gate check" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-18 08:00:00Z], ~U[2025-04-18 08:10:00Z])} kind="Inspection" room="Meeting Room" />
          <Kit.Phoenix.Layouts.Calendar.item_row name="Lift check" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-18 08:20:00Z], ~U[2025-04-18 08:30:00Z])} kind="Inspection" room="Meeting Room" />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-19])}>
          <:empty>Nothing booked</:empty>
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-20])}>
          <:empty>Nothing booked</:empty>
        </Kit.Phoenix.Layouts.Calendar.day>
      </Kit.Phoenix.Layouts.Calendar.days>
    </Kit.Phoenix.Layouts.Calendar.calendar>
  </:body>
</Kit.Phoenix.Layouts.Shell.shell>

<Kit.Phoenix.Layouts.Shell.shell print_identity={@print.identity} print_subject={@print.subject} print_standing={@print.standing} print_tenant={@print.tenant} product="kit" navigation_label="Application" navigation="none" density="desk">
  <:subject>Calendar</:subject>
  <:lede_range days={Kit.Phoenix.Time.day_range(reader(), ~D[2025-04-14], ~D[2025-04-16])} />
  <:lede words="3 bookings" />
  <:actions><a href="../../layout-calendar/#layout-calendar-cancelled">{@owner}</a></:actions>
  <:body>
    <Kit.Phoenix.Layouts.Calendar.calendar :let={subject_region} subject_state={Kit.Phoenix.State.none()} range_days={Kit.Phoenix.Time.day_range(reader(), ~D[2025-04-14], ~D[2025-04-16])} toolbar_rest={%{"aria-label": "Calendar controls"}} scope_id="kit-calendar-cancelled-filters" filters_label="Filters">
      <:today label="Today" />
      <:previous label="Previous week" href="?week=previous" rest={%{rel: "prev"}} />
      <:next label="Next week" href="?week=next" rest={%{rel: "next"}} />
      <:date><Kit.Phoenix.Roles.FormGroup.form_group id="calendar-cancelled-date"><:label>Go to a date</:label><:control :let={binding}><Kit.Phoenix.Roles.DateField.date_field binding={binding} reader={reader()} name="date" value={Kit.Phoenix.Roles.DateField.Committed.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-14]))} today={Kit.Phoenix.Time.day(reader(), ~D[2025-04-14])} direction={:either} /></:control></Kit.Phoenix.Roles.FormGroup.form_group></:date>
      <:scope>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-cancelled-scope-form-group" kind={Kit.Phoenix.Roles.FormGroup.Kind.select()} control_rest={%{id: "calendar-cancelled-scope"}}><:label rest={%{for: "calendar-cancelled-scope"}}>Hall</:label><:option value="all">All halls</:option><:option value="oakmere">Oakmere Hall</:option></Kit.Phoenix.Roles.FormGroup.form_group>
      </:scope>
      <:scope>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-cancelled-room-form-group" kind={Kit.Phoenix.Roles.FormGroup.Kind.select()} control_rest={%{id: "calendar-cancelled-room"}}><:label rest={%{for: "calendar-cancelled-room"}}>Room</:label><:option value="all">All rooms</:option><:option value="main-hall">Main Hall</:option></Kit.Phoenix.Roles.FormGroup.form_group>
      </:scope>
      <:view>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-cancelled-view-form-group"><:label>View</:label><:control_set :let={binding}><Kit.Phoenix.Roles.SegmentedControl.segmented_control binding={binding} name="calendar-cancelled-view" value="week"><:option value="week">Week</:option><:option value="day">Day</:option><:option value="month">Month</:option></Kit.Phoenix.Roles.SegmentedControl.segmented_control></:control_set></Kit.Phoenix.Roles.FormGroup.form_group>
      </:view>
      <:actions><Kit.Phoenix.Roles.PrimaryAction.primary_action>New booking</Kit.Phoenix.Roles.PrimaryAction.primary_action></:actions>
      <Kit.Phoenix.Layouts.Calendar.desk_grid subject_region={subject_region} columns={3} time_gutter_rest={%{"aria-label": "Times"}}>
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-14]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-15]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-16]))} />
        <:hour :for={hour <- ([Kit.Phoenix.Time.clock(reader(), ~T[09:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[10:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[11:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[12:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[13:00:00])])} time={hour} />
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Toddler group" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 08:30:00Z], ~U[2025-04-14 10:00:00Z])} kind="Booking" standings={["cancelled"]} standing_words={["Cancelled"]} aria-label="Toddler group, 09:30–11:00, Cancelled" style="grid-row: 1 / span 2; --kit-calendar-block-offset: calc(var(--kit-hour-height) / 2); --kit-calendar-block-size: calc(var(--kit-hour-height) * 1.5);" />
        </:column>
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Yoga class" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-15 09:00:00Z], ~U[2025-04-15 10:00:00Z])} kind="Booking" aria-label="Yoga class, 10:00–11:00" style="grid-row: 2 / span 1;" />
        </:column>
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Choir rehearsal" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-16 11:00:00Z], ~U[2025-04-16 12:00:00Z])} kind="Booking" standings={["cancelled"]} standing_words={["Cancelled"]} aria-label="Choir rehearsal, 12:00–13:00, Cancelled" style="grid-row: 4 / span 1;" />
        </:column>
      </Kit.Phoenix.Layouts.Calendar.desk_grid>
      <Kit.Phoenix.Layouts.Calendar.days subject_region={subject_region}>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-14])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Toddler group" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 08:30:00Z], ~U[2025-04-14 10:00:00Z])} kind="Booking" standings={["cancelled"]} standing_words={["Cancelled"]} />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-15])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Yoga class" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-15 09:00:00Z], ~U[2025-04-15 10:00:00Z])} kind="Booking" />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-16])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Choir rehearsal" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-16 11:00:00Z], ~U[2025-04-16 12:00:00Z])} kind="Booking" standings={["cancelled"]} standing_words={["Cancelled"]} />
        </Kit.Phoenix.Layouts.Calendar.day>
      </Kit.Phoenix.Layouts.Calendar.days>
    </Kit.Phoenix.Layouts.Calendar.calendar>
  </:body>
</Kit.Phoenix.Layouts.Shell.shell>

<Kit.Phoenix.Layouts.Shell.shell print_identity={@print.identity} print_subject={@print.subject} print_standing={@print.standing} print_tenant={@print.tenant} product="kit" navigation_label="Application" navigation="none" density="desk">
  <:subject>Calendar</:subject>
  <:lede_range days={Kit.Phoenix.Time.day_range(reader(), ~D[2025-04-14], ~D[2025-04-16])} />
  <:lede words="3 bookings" />
  <:actions><a href="../../layout-calendar/#layout-calendar-uncovered">{@owner}</a></:actions>
  <:body>
    <Kit.Phoenix.Layouts.Calendar.calendar :let={subject_region} subject_state={Kit.Phoenix.State.none()} range_days={Kit.Phoenix.Time.day_range(reader(), ~D[2025-04-14], ~D[2025-04-16])} toolbar_rest={%{"aria-label": "Calendar controls"}} scope_id="kit-calendar-uncovered-filters" filters_label="Filters">
      <:today label="Today" />
      <:previous label="Previous week" href="?week=previous" rest={%{rel: "prev"}} />
      <:next label="Next week" href="?week=next" rest={%{rel: "next"}} />
      <:date><Kit.Phoenix.Roles.FormGroup.form_group id="calendar-uncovered-date"><:label>Go to a date</:label><:control :let={binding}><Kit.Phoenix.Roles.DateField.date_field binding={binding} reader={reader()} name="date" value={Kit.Phoenix.Roles.DateField.Committed.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-14]))} today={Kit.Phoenix.Time.day(reader(), ~D[2025-04-14])} direction={:either} /></:control></Kit.Phoenix.Roles.FormGroup.form_group></:date>
      <:scope>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-uncovered-scope-form-group" kind={Kit.Phoenix.Roles.FormGroup.Kind.select()} control_rest={%{id: "calendar-uncovered-scope"}}><:label rest={%{for: "calendar-uncovered-scope"}}>Hall</:label><:option value="all">All halls</:option><:option value="oakmere">Oakmere Hall</:option></Kit.Phoenix.Roles.FormGroup.form_group>
      </:scope>
      <:scope>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-uncovered-room-form-group" kind={Kit.Phoenix.Roles.FormGroup.Kind.select()} control_rest={%{id: "calendar-uncovered-room"}}><:label rest={%{for: "calendar-uncovered-room"}}>Room</:label><:option value="all">All rooms</:option><:option value="main-hall">Main Hall</:option></Kit.Phoenix.Roles.FormGroup.form_group>
      </:scope>
      <:view>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-uncovered-view-form-group"><:label>View</:label><:control_set :let={binding}><Kit.Phoenix.Roles.SegmentedControl.segmented_control binding={binding} name="calendar-uncovered-view" value="week"><:option value="week">Week</:option><:option value="day">Day</:option><:option value="month">Month</:option></Kit.Phoenix.Roles.SegmentedControl.segmented_control></:control_set></Kit.Phoenix.Roles.FormGroup.form_group>
      </:view>
      <:actions><Kit.Phoenix.Roles.PrimaryAction.primary_action>New booking</Kit.Phoenix.Roles.PrimaryAction.primary_action></:actions>
      <Kit.Phoenix.Layouts.Calendar.desk_grid subject_region={subject_region} columns={3} time_gutter_rest={%{"aria-label": "Times"}}>
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-14]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-15]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-16]))} />
        <:hour :for={hour <- ([Kit.Phoenix.Time.clock(reader(), ~T[09:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[10:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[11:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[12:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[13:00:00])])} time={hour} />
        <:column rest={%{style: "--kit-calendar-column-parts: 2;"}}>
          <Kit.Phoenix.Layouts.Calendar.block name="Toddler group" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 08:00:00Z], ~U[2025-04-14 09:00:00Z])} kind="Booking" standings={["uncovered"]} standing_words={["Cover needed"]} aria-label="Toddler group, 09:00–10:00, Cover needed" style="grid-row: 1 / span 1; --kit-calendar-block-part: 1;" />
          <Kit.Phoenix.Layouts.Calendar.block name="Story time" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 08:30:00Z], ~U[2025-04-14 09:00:00Z])} kind="Booking" standings={["uncovered"]} standing_words={["Cover needed"]} aria-label="Story time, 09:30–10:00, Cover needed" style="grid-row: 1 / span 1; --kit-calendar-block-part: 2; --kit-calendar-block-offset: calc(var(--kit-hour-height) / 2); --kit-calendar-block-size: calc(var(--kit-hour-height) / 2);" />
        </:column>
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Yoga class" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-15 09:00:00Z], ~U[2025-04-15 10:00:00Z])} kind="Booking" aria-label="Yoga class, 10:00–11:00" style="grid-row: 2 / span 1;" />
        </:column>
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Community lunch" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-16 11:00:00Z], ~U[2025-04-16 12:00:00Z])} kind="Booking" standings={["uncovered"]} standing_words={["Cover needed"]} aria-label="Community lunch, 12:00–13:00, Cover needed" style="grid-row: 4 / span 1;" />
        </:column>
      </Kit.Phoenix.Layouts.Calendar.desk_grid>
      <Kit.Phoenix.Layouts.Calendar.days subject_region={subject_region}>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-14])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Toddler group" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 08:00:00Z], ~U[2025-04-14 09:00:00Z])} kind="Booking" standings={["uncovered"]} standing_words={["Cover needed"]} />
          <Kit.Phoenix.Layouts.Calendar.item_row name="Story time" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 08:30:00Z], ~U[2025-04-14 09:00:00Z])} kind="Booking" standings={["uncovered"]} standing_words={["Cover needed"]} />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-15])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Yoga class" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-15 09:00:00Z], ~U[2025-04-15 10:00:00Z])} kind="Booking" />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-16])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Community lunch" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-16 11:00:00Z], ~U[2025-04-16 12:00:00Z])} kind="Booking" standings={["uncovered"]} standing_words={["Cover needed"]} />
        </Kit.Phoenix.Layouts.Calendar.day>
      </Kit.Phoenix.Layouts.Calendar.days>
    </Kit.Phoenix.Layouts.Calendar.calendar>
  </:body>
</Kit.Phoenix.Layouts.Shell.shell>

<Kit.Phoenix.Layouts.Shell.shell print_identity={@print.identity} print_subject={@print.subject} print_standing={@print.standing} print_tenant={@print.tenant} product="kit" navigation_label="Application" navigation="none" density="desk">
  <:subject>Calendar</:subject>
  <:lede_range days={Kit.Phoenix.Time.day_range(reader(), ~D[2025-04-14], ~D[2025-04-16])} />
  <:lede words="4 items" />
  <:actions><a href="../../layout-calendar/#layout-calendar-clashing">{@owner}</a></:actions>
  <:body>
    <Kit.Phoenix.Layouts.Calendar.calendar :let={subject_region} subject_state={Kit.Phoenix.State.none()} range_days={Kit.Phoenix.Time.day_range(reader(), ~D[2025-04-14], ~D[2025-04-16])} toolbar_rest={%{"aria-label": "Calendar controls"}} scope_id="kit-calendar-clashing-filters" filters_label="Filters">
      <:today label="Today" />
      <:previous label="Previous week" href="?week=previous" rest={%{rel: "prev"}} />
      <:next label="Next week" href="?week=next" rest={%{rel: "next"}} />
      <:date><Kit.Phoenix.Roles.FormGroup.form_group id="calendar-clashing-date"><:label>Go to a date</:label><:control :let={binding}><Kit.Phoenix.Roles.DateField.date_field binding={binding} reader={reader()} name="date" value={Kit.Phoenix.Roles.DateField.Committed.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-14]))} today={Kit.Phoenix.Time.day(reader(), ~D[2025-04-14])} direction={:either} /></:control></Kit.Phoenix.Roles.FormGroup.form_group></:date>
      <:scope>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-clashing-scope-form-group" kind={Kit.Phoenix.Roles.FormGroup.Kind.select()} control_rest={%{id: "calendar-clashing-scope"}}><:label rest={%{for: "calendar-clashing-scope"}}>Hall</:label><:option value="all">All halls</:option><:option value="oakmere">Oakmere Hall</:option></Kit.Phoenix.Roles.FormGroup.form_group>
      </:scope>
      <:scope>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-clashing-room-form-group" kind={Kit.Phoenix.Roles.FormGroup.Kind.select()} control_value="main-hall" control_rest={%{id: "calendar-clashing-room"}}><:label rest={%{for: "calendar-clashing-room"}}>Room</:label><:option value="all">All rooms</:option><:option value="main-hall">Main Hall</:option></Kit.Phoenix.Roles.FormGroup.form_group>
      </:scope>
      <:view>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-clashing-view-form-group"><:label>View</:label><:control_set :let={binding}><Kit.Phoenix.Roles.SegmentedControl.segmented_control binding={binding} name="calendar-clashing-view" value="week"><:option value="week">Week</:option><:option value="day">Day</:option><:option value="month">Month</:option></Kit.Phoenix.Roles.SegmentedControl.segmented_control></:control_set></Kit.Phoenix.Roles.FormGroup.form_group>
      </:view>
      <:actions><Kit.Phoenix.Roles.PrimaryAction.primary_action>New booking</Kit.Phoenix.Roles.PrimaryAction.primary_action></:actions>
      <Kit.Phoenix.Layouts.Calendar.desk_grid subject_region={subject_region} columns={3} time_gutter_rest={%{"aria-label": "Times"}}>
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-14]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-15]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-16]))} />
        <:hour :for={hour <- ([Kit.Phoenix.Time.clock(reader(), ~T[09:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[10:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[11:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[12:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[13:00:00])])} time={hour} />
        <:column rest={%{style: "--kit-calendar-column-parts: 2;"}}>
          <Kit.Phoenix.Layouts.Calendar.block name="Toddler group" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 08:00:00Z], ~U[2025-04-14 09:00:00Z])} kind="Booking" standings={["clashing"]} standing_words={["Time conflict"]} aria-label="Toddler group, 09:00–10:00, Time conflict" style="grid-row: 1 / span 1; --kit-calendar-block-part: 1;" />
          <Kit.Phoenix.Layouts.Calendar.block name="Hall inspection" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 08:30:00Z], ~U[2025-04-14 09:00:00Z])} kind="Inspection" standings={["clashing"]} standing_words={["Time conflict"]} aria-label="Hall inspection, 09:30–10:00, Time conflict" style="grid-row: 1 / span 1; --kit-calendar-block-part: 2; --kit-calendar-block-offset: calc(var(--kit-hour-height) / 2); --kit-calendar-block-size: calc(var(--kit-hour-height) / 2);" />
        </:column>
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Yoga class" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-15 09:00:00Z], ~U[2025-04-15 10:00:00Z])} kind="Booking" aria-label="Yoga class, 10:00–11:00" style="grid-row: 2 / span 1;" />
        </:column>
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Parish council" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-16 11:00:00Z], ~U[2025-04-16 12:00:00Z])} kind="Meeting in 2 rooms" standings={["clashing"]} standing_words={["Time conflict"]} aria-label="Parish council, 12:00–13:00, Time conflict" style="grid-row: 4 / span 1;" />
        </:column>
      </Kit.Phoenix.Layouts.Calendar.desk_grid>
      <Kit.Phoenix.Layouts.Calendar.days subject_region={subject_region}>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-14])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Toddler group" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 08:00:00Z], ~U[2025-04-14 09:00:00Z])} kind="Booking" standings={["clashing"]} standing_words={["Time conflict"]} />
          <Kit.Phoenix.Layouts.Calendar.item_row name="Hall inspection" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 08:30:00Z], ~U[2025-04-14 09:00:00Z])} kind="Inspection" standings={["clashing"]} standing_words={["Time conflict"]} />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-15])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Yoga class" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-15 09:00:00Z], ~U[2025-04-15 10:00:00Z])} kind="Booking" />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-16])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Parish council" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-16 11:00:00Z], ~U[2025-04-16 12:00:00Z])} kind="Meeting in 2 rooms" standings={["clashing"]} standing_words={["Time conflict"]} />
        </Kit.Phoenix.Layouts.Calendar.day>
      </Kit.Phoenix.Layouts.Calendar.days>
    </Kit.Phoenix.Layouts.Calendar.calendar>
  </:body>
</Kit.Phoenix.Layouts.Shell.shell>

<Kit.Phoenix.Layouts.Shell.shell print_identity={@print.identity} print_subject={@print.subject} print_standing={@print.standing} print_tenant={@print.tenant} product="kit" navigation_label="Application" navigation="none" density="desk">
  <:subject>Calendar</:subject>
  <:lede_range days={Kit.Phoenix.Time.day_range(reader(), ~D[2025-04-14], ~D[2025-04-16])} />
  <:lede words="3 bookings" />
  <:actions><a href="../../layout-calendar/#layout-calendar-covered">{@owner}</a></:actions>
  <:body>
    <Kit.Phoenix.Layouts.Calendar.calendar :let={subject_region} subject_state={Kit.Phoenix.State.none()} range_days={Kit.Phoenix.Time.day_range(reader(), ~D[2025-04-14], ~D[2025-04-16])} toolbar_rest={%{"aria-label": "Calendar controls"}} scope_id="kit-calendar-covered-filters" filters_label="Filters">
      <:today label="Today" />
      <:previous label="Previous week" href="?week=previous" rest={%{rel: "prev"}} />
      <:next label="Next week" href="?week=next" rest={%{rel: "next"}} />
      <:date><Kit.Phoenix.Roles.FormGroup.form_group id="calendar-covered-date"><:label>Go to a date</:label><:control :let={binding}><Kit.Phoenix.Roles.DateField.date_field binding={binding} reader={reader()} name="date" value={Kit.Phoenix.Roles.DateField.Committed.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-14]))} today={Kit.Phoenix.Time.day(reader(), ~D[2025-04-14])} direction={:either} /></:control></Kit.Phoenix.Roles.FormGroup.form_group></:date>
      <:scope>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-covered-scope-form-group" kind={Kit.Phoenix.Roles.FormGroup.Kind.select()} control_rest={%{id: "calendar-covered-scope"}}><:label rest={%{for: "calendar-covered-scope"}}>Hall</:label><:option value="all">All halls</:option><:option value="oakmere">Oakmere Hall</:option></Kit.Phoenix.Roles.FormGroup.form_group>
      </:scope>
      <:scope>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-covered-room-form-group" kind={Kit.Phoenix.Roles.FormGroup.Kind.select()} control_rest={%{id: "calendar-covered-room"}}><:label rest={%{for: "calendar-covered-room"}}>Room</:label><:option value="all">All rooms</:option><:option value="main-hall">Main Hall</:option></Kit.Phoenix.Roles.FormGroup.form_group>
      </:scope>
      <:view>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-covered-view-form-group"><:label>View</:label><:control_set :let={binding}><Kit.Phoenix.Roles.SegmentedControl.segmented_control binding={binding} name="calendar-covered-view" value="week"><:option value="week">Week</:option><:option value="day">Day</:option><:option value="month">Month</:option></Kit.Phoenix.Roles.SegmentedControl.segmented_control></:control_set></Kit.Phoenix.Roles.FormGroup.form_group>
      </:view>
      <:actions><Kit.Phoenix.Roles.PrimaryAction.primary_action>New booking</Kit.Phoenix.Roles.PrimaryAction.primary_action></:actions>
      <Kit.Phoenix.Layouts.Calendar.desk_grid subject_region={subject_region} columns={3} time_gutter_rest={%{"aria-label": "Times"}}>
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-14]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-15]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-16]))} />
        <:hour :for={hour <- ([Kit.Phoenix.Time.clock(reader(), ~T[09:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[10:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[11:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[12:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[13:00:00])])} time={hour} />
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Toddler group" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 08:00:00Z], ~U[2025-04-14 09:30:00Z])} kind="Booking" standings={["covered"]} standing_words={["Cover arranged"]} aria-label="Toddler group, 09:00–10:30, Cover arranged" style="grid-row: 1 / span 2; --kit-calendar-block-size: calc(var(--kit-hour-height) * 1.5);" />
        </:column>
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Yoga class" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-15 09:00:00Z], ~U[2025-04-15 10:00:00Z])} kind="Booking" aria-label="Yoga class, 10:00–11:00" style="grid-row: 2 / span 1;" />
        </:column>
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Community lunch" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-16 11:00:00Z], ~U[2025-04-16 12:00:00Z])} kind="Booking" standings={["covered"]} standing_words={["Cover arranged"]} aria-label="Community lunch, 12:00–13:00, Cover arranged" style="grid-row: 4 / span 1;" />
        </:column>
      </Kit.Phoenix.Layouts.Calendar.desk_grid>
      <Kit.Phoenix.Layouts.Calendar.days subject_region={subject_region}>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-14])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Toddler group" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 08:00:00Z], ~U[2025-04-14 09:30:00Z])} kind="Booking" standings={["covered"]} standing_words={["Cover arranged"]} />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-15])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Yoga class" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-15 09:00:00Z], ~U[2025-04-15 10:00:00Z])} kind="Booking" />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-16])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Community lunch" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-16 11:00:00Z], ~U[2025-04-16 12:00:00Z])} kind="Booking" standings={["covered"]} standing_words={["Cover arranged"]} />
        </Kit.Phoenix.Layouts.Calendar.day>
      </Kit.Phoenix.Layouts.Calendar.days>
    </Kit.Phoenix.Layouts.Calendar.calendar>
  </:body>
</Kit.Phoenix.Layouts.Shell.shell>

<Kit.Phoenix.Layouts.Shell.shell print_identity={@print.identity} print_subject={@print.subject} print_standing={@print.standing} print_tenant={@print.tenant} product="kit" navigation_label="Application" navigation="none" density="desk">
  <:subject>Calendar</:subject>
  <:lede_range days={Kit.Phoenix.Time.day_range(reader(), ~D[2025-04-14], ~D[2025-04-16])} />
  <:lede words="3 bookings" />
  <:actions><a href="../../layout-calendar/#layout-calendar-preparation">{@owner}</a></:actions>
  <:body>
    <Kit.Phoenix.Layouts.Calendar.calendar :let={subject_region} subject_state={Kit.Phoenix.State.none()} range_days={Kit.Phoenix.Time.day_range(reader(), ~D[2025-04-14], ~D[2025-04-16])} toolbar_rest={%{"aria-label": "Calendar controls"}} scope_id="kit-calendar-preparation-filters" filters_label="Filters">
      <:today label="Today" />
      <:previous label="Previous week" href="?week=previous" rest={%{rel: "prev"}} />
      <:next label="Next week" href="?week=next" rest={%{rel: "next"}} />
      <:date><Kit.Phoenix.Roles.FormGroup.form_group id="calendar-preparation-date"><:label>Go to a date</:label><:control :let={binding}><Kit.Phoenix.Roles.DateField.date_field binding={binding} reader={reader()} name="date" value={Kit.Phoenix.Roles.DateField.Committed.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-14]))} today={Kit.Phoenix.Time.day(reader(), ~D[2025-04-14])} direction={:either} /></:control></Kit.Phoenix.Roles.FormGroup.form_group></:date>
      <:scope>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-preparation-scope-form-group" kind={Kit.Phoenix.Roles.FormGroup.Kind.select()} control_rest={%{id: "calendar-preparation-scope"}}><:label rest={%{for: "calendar-preparation-scope"}}>Hall</:label><:option value="all">All halls</:option><:option value="oakmere">Oakmere Hall</:option></Kit.Phoenix.Roles.FormGroup.form_group>
      </:scope>
      <:scope>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-preparation-room-form-group" kind={Kit.Phoenix.Roles.FormGroup.Kind.select()} control_rest={%{id: "calendar-preparation-room"}}><:label rest={%{for: "calendar-preparation-room"}}>Room</:label><:option value="all">All rooms</:option><:option value="main-hall">Main Hall</:option></Kit.Phoenix.Roles.FormGroup.form_group>
      </:scope>
      <:view>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-preparation-view-form-group"><:label>View</:label><:control_set :let={binding}><Kit.Phoenix.Roles.SegmentedControl.segmented_control binding={binding} name="calendar-preparation-view" value="week"><:option value="week">Week</:option><:option value="day">Day</:option><:option value="month">Month</:option></Kit.Phoenix.Roles.SegmentedControl.segmented_control></:control_set></Kit.Phoenix.Roles.FormGroup.form_group>
      </:view>
      <:actions><Kit.Phoenix.Roles.PrimaryAction.primary_action>New booking</Kit.Phoenix.Roles.PrimaryAction.primary_action></:actions>
      <Kit.Phoenix.Layouts.Calendar.desk_grid subject_region={subject_region} columns={3} time_gutter_rest={%{"aria-label": "Times"}}>
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-14]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-15]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-16]))} />
        <:hour :for={hour <- ([Kit.Phoenix.Time.clock(reader(), ~T[09:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[10:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[11:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[12:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[13:00:00])])} time={hour} />
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Summer term yoga" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 08:00:00Z], ~U[2025-04-14 09:30:00Z])} kind="Booking" standings={["preparation"]} standing_words={["Season not confirmed"]} aria-label="Summer term yoga, 09:00–10:30, Season not confirmed" style="grid-row: 1 / span 2; --kit-calendar-block-size: calc(var(--kit-hour-height) * 1.5);" />
        </:column>
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Yoga class" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-15 09:00:00Z], ~U[2025-04-15 10:00:00Z])} kind="Booking" aria-label="Yoga class, 10:00–11:00" style="grid-row: 2 / span 1;" />
        </:column>
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Summer term toddler group" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-16 11:00:00Z], ~U[2025-04-16 12:00:00Z])} kind="Booking" standings={["preparation", "uncovered"]} standing_words={["Season not confirmed", "Cover needed"]} aria-label="Summer term toddler group, 12:00–13:00, Season not confirmed, Cover needed" style="grid-row: 4 / span 1;" />
        </:column>
      </Kit.Phoenix.Layouts.Calendar.desk_grid>
      <Kit.Phoenix.Layouts.Calendar.days subject_region={subject_region}>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-14])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Summer term yoga" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 08:00:00Z], ~U[2025-04-14 09:30:00Z])} kind="Booking" standings={["preparation"]} standing_words={["Season not confirmed"]} />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-15])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Yoga class" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-15 09:00:00Z], ~U[2025-04-15 10:00:00Z])} kind="Booking" />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-16])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Summer term toddler group" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-16 11:00:00Z], ~U[2025-04-16 12:00:00Z])} kind="Booking" standings={["preparation", "uncovered"]} standing_words={["Season not confirmed", "Cover needed"]} />
        </Kit.Phoenix.Layouts.Calendar.day>
      </Kit.Phoenix.Layouts.Calendar.days>
    </Kit.Phoenix.Layouts.Calendar.calendar>
  </:body>
</Kit.Phoenix.Layouts.Shell.shell>

<Kit.Phoenix.Layouts.Shell.shell print_identity={@print.identity} print_subject={@print.subject} print_standing={@print.standing} print_tenant={@print.tenant} product="kit" navigation_label="Application" navigation="none" density="desk">
  <:subject>Calendar</:subject>
  <:lede_range days={Kit.Phoenix.Time.day(reader(), ~D[2025-04-14])} />
  <:lede words="5 items" />
  <:actions><a href="../../layout-calendar/#layout-calendar-day-rooms">{@owner}</a></:actions>
  <:body>
    <Kit.Phoenix.Layouts.Calendar.calendar :let={subject_region} subject_state={Kit.Phoenix.State.none()} range_days={Kit.Phoenix.Time.day(reader(), ~D[2025-04-14])} toolbar_rest={%{"aria-label": "Calendar controls"}} scope_id="kit-calendar-day-filters" filters_label="Filters">
      <:today label="Today" />
      <:previous label="Previous day" href="?day=previous" rest={%{rel: "prev"}} />
      <:next label="Next day" href="?day=next" rest={%{rel: "next"}} />
      <:date><Kit.Phoenix.Roles.FormGroup.form_group id="calendar-day-rooms-date"><:label>Go to a date</:label><:control :let={binding}><Kit.Phoenix.Roles.DateField.date_field binding={binding} reader={reader()} name="date" value={Kit.Phoenix.Roles.DateField.Committed.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-14]))} today={Kit.Phoenix.Time.day(reader(), ~D[2025-04-14])} direction={:either} /></:control></Kit.Phoenix.Roles.FormGroup.form_group></:date>
      <:scope>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-day-scope-form-group" kind={Kit.Phoenix.Roles.FormGroup.Kind.select()} control_rest={%{id: "calendar-day-scope"}}><:label rest={%{for: "calendar-day-scope"}}>Hall</:label><:option value="all">All halls</:option><:option value="oakmere">Oakmere Hall</:option></Kit.Phoenix.Roles.FormGroup.form_group>
      </:scope>
      <:scope>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-day-room-form-group" kind={Kit.Phoenix.Roles.FormGroup.Kind.select()} control_rest={%{id: "calendar-day-room"}}><:label rest={%{for: "calendar-day-room"}}>Room</:label><:option value="all">All rooms</:option><:option value="main-hall">Main Hall</:option><:option value="meeting-room">Meeting Room</:option></Kit.Phoenix.Roles.FormGroup.form_group>
      </:scope>
      <:view>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-day-view-form-group"><:label>View</:label><:control_set :let={binding}><Kit.Phoenix.Roles.SegmentedControl.segmented_control binding={binding} name="calendar-day-view" value="day"><:option value="day">Day</:option><:option value="week">Week</:option><:option value="month">Month</:option></Kit.Phoenix.Roles.SegmentedControl.segmented_control></:control_set></Kit.Phoenix.Roles.FormGroup.form_group>
      </:view>
      <:actions><Kit.Phoenix.Roles.PrimaryAction.primary_action>New booking</Kit.Phoenix.Roles.PrimaryAction.primary_action></:actions>
      <Kit.Phoenix.Layouts.Calendar.desk_grid subject_region={subject_region} columns={4} time_gutter_rest={%{"aria-label": "Times"}}>
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.room("No room yet")} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.room("Main Hall")} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.room("Meeting Room")} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.room("Memorial Room")} />
        <:band href="../../record/" first={1} last={4} stack={1}>Open day</:band>
        <:band href="../../record/" first={3} last={3} stack={2}>Meeting Room decorated</:band>
        <:hour :for={hour <- ([Kit.Phoenix.Time.clock(reader(), ~T[09:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[10:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[11:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[12:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[13:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[14:00:00])])} time={hour} />
        <:current_time rest={%{style: "--kit-calendar-now-offset: calc(3.5 * var(--kit-hour-height));"}} />
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Hire request" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 10:00:00Z], ~U[2025-04-14 11:00:00Z])} kind="Requested" aria-label="Hire request, 11:00–12:00" style="grid-row: 3 / span 1;" />
        </:column>
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Yoga class" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 09:00:00Z], ~U[2025-04-14 10:00:00Z])} kind="Booking" aria-label="Yoga class, 10:00–11:00" style="grid-row: 2 / span 1;" />
          <Kit.Phoenix.Layouts.Calendar.block name="Community lunch" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 10:30:00Z], ~U[2025-04-14 11:00:00Z])} kind="Booking" aria-label="Community lunch, 11:30–12:00" style="grid-row: 3 / span 1; --kit-calendar-block-offset: calc(var(--kit-hour-height) / 2); --kit-calendar-block-size: calc(var(--kit-hour-height) / 2);" />
          <Kit.Phoenix.Layouts.Calendar.block name="Wedding reception" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 11:00:00Z], ~U[2025-04-14 14:00:00Z])} kind="Booking" aria-label="Wedding reception, 12:00–15:00" style="grid-row: 4 / span 3;" />
        </:column>
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Parish council" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 10:00:00Z], ~U[2025-04-14 11:00:00Z])} kind="Meeting" aria-label="Parish council, 11:00–12:00" style="grid-row: 3 / span 1;" />
        </:column>
        <:column></:column>
      </Kit.Phoenix.Layouts.Calendar.desk_grid>
      <Kit.Phoenix.Layouts.Calendar.days subject_region={subject_region}>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-14])}>
          <Kit.Phoenix.Layouts.Calendar.band_row name="Open day" href="../../record/" />
          <Kit.Phoenix.Layouts.Calendar.band_row name="Meeting Room decorated" href="../../record/" />
          <Kit.Phoenix.Layouts.Calendar.item_row name="Yoga class" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 09:00:00Z], ~U[2025-04-14 10:00:00Z])} kind="Booking" room="Main Hall" />
          <Kit.Phoenix.Layouts.Calendar.item_row name="Hire request" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 10:00:00Z], ~U[2025-04-14 11:00:00Z])} kind="Requested" />
          <Kit.Phoenix.Layouts.Calendar.item_row name="Parish council" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 10:00:00Z], ~U[2025-04-14 11:00:00Z])} kind="Meeting" room="Meeting Room" />
          <Kit.Phoenix.Layouts.Calendar.item_row name="Community lunch" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 10:30:00Z], ~U[2025-04-14 11:00:00Z])} kind="Booking" room="Main Hall" />
          <Kit.Phoenix.Layouts.Calendar.item_row name="Wedding reception" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 11:00:00Z], ~U[2025-04-14 14:00:00Z])} kind="Booking" room="Main Hall" />
        </Kit.Phoenix.Layouts.Calendar.day>
      </Kit.Phoenix.Layouts.Calendar.days>
    </Kit.Phoenix.Layouts.Calendar.calendar>
  </:body>
</Kit.Phoenix.Layouts.Shell.shell>

<Kit.Phoenix.Layouts.Shell.shell print_identity={@print.identity} print_subject={@print.subject} print_standing={@print.standing} print_tenant={@print.tenant} product="kit" navigation_label="Application" navigation="none" density="desk">
  <:subject>Calendar</:subject>
  <:lede_range days={Kit.Phoenix.Time.day(reader(), ~D[2025-04-14])} />
  <:lede words="2 bookings" />
  <:actions><a href="../../layout-calendar/#layout-calendar-day-one-column">{@owner}</a></:actions>
  <:body>
    <Kit.Phoenix.Layouts.Calendar.calendar :let={subject_region} subject_state={Kit.Phoenix.State.none()} range_days={Kit.Phoenix.Time.day(reader(), ~D[2025-04-14])} toolbar_rest={%{"aria-label": "Memorial Hall calendar controls"}} scope_id="kit-calendar-day-one-filters" filters_label="Filters">
      <:today label="Today" />
      <:previous label="Previous day" href="?day=previous" rest={%{rel: "prev"}} />
      <:next label="Next day" href="?day=next" rest={%{rel: "next"}} />
      <:date><Kit.Phoenix.Roles.FormGroup.form_group id="calendar-day-one-column-date"><:label>Go to a date</:label><:control :let={binding}><Kit.Phoenix.Roles.DateField.date_field binding={binding} reader={reader()} name="date" value={Kit.Phoenix.Roles.DateField.Committed.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-14]))} today={Kit.Phoenix.Time.day(reader(), ~D[2025-04-14])} direction={:either} /></:control></Kit.Phoenix.Roles.FormGroup.form_group></:date>
      <:scope>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-day-one-scope-form-group" kind={Kit.Phoenix.Roles.FormGroup.Kind.select()} control_rest={%{id: "calendar-day-one-scope"}}><:label rest={%{for: "calendar-day-one-scope"}}>Hall</:label><:option value="memorial">Memorial Hall</:option></Kit.Phoenix.Roles.FormGroup.form_group>
      </:scope>
      <:scope>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-day-one-kind-form-group" kind={Kit.Phoenix.Roles.FormGroup.Kind.select()} control_rest={%{id: "calendar-day-one-kind"}}><:label rest={%{for: "calendar-day-one-kind"}}>Kind</:label><:option value="all">All kinds</:option><:option value="booking">Bookings</:option></Kit.Phoenix.Roles.FormGroup.form_group>
      </:scope>
      <:view>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-day-one-view-form-group"><:label>View</:label><:control_set :let={binding}><Kit.Phoenix.Roles.SegmentedControl.segmented_control binding={binding} name="calendar-day-one-view" value="day"><:option value="day">Day</:option><:option value="week">Week</:option><:option value="month">Month</:option></Kit.Phoenix.Roles.SegmentedControl.segmented_control></:control_set></Kit.Phoenix.Roles.FormGroup.form_group>
      </:view>
      <:actions><Kit.Phoenix.Roles.PrimaryAction.primary_action>New booking</Kit.Phoenix.Roles.PrimaryAction.primary_action></:actions>
      <Kit.Phoenix.Layouts.Calendar.desk_grid subject_region={subject_region} columns={1} time_gutter_rest={%{"aria-label": "Times"}}>
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-14]))} />
        <:hour :for={hour <- ([Kit.Phoenix.Time.clock(reader(), ~T[09:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[10:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[11:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[12:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[13:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[14:00:00])])} time={hour} />
        <:current_time rest={%{style: "--kit-calendar-now-offset: calc(3.5 * var(--kit-hour-height));"}} />
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Art class" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 08:00:00Z], ~U[2025-04-14 10:00:00Z])} kind="Booking" aria-label="Art class, 09:00–11:00" style="grid-row: 1 / span 2;" />
          <Kit.Phoenix.Layouts.Calendar.block name="Whist drive" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 12:00:00Z], ~U[2025-04-14 14:00:00Z])} kind="Booking" aria-label="Whist drive, 13:00–15:00" style="grid-row: 5 / span 2;" />
        </:column>
      </Kit.Phoenix.Layouts.Calendar.desk_grid>
      <Kit.Phoenix.Layouts.Calendar.days subject_region={subject_region}>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-14])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Art class" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 08:00:00Z], ~U[2025-04-14 10:00:00Z])} kind="Booking" />
          <Kit.Phoenix.Layouts.Calendar.item_row name="Whist drive" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 12:00:00Z], ~U[2025-04-14 14:00:00Z])} kind="Booking" />
        </Kit.Phoenix.Layouts.Calendar.day>
      </Kit.Phoenix.Layouts.Calendar.days>
    </Kit.Phoenix.Layouts.Calendar.calendar>
  </:body>
</Kit.Phoenix.Layouts.Shell.shell>

<Kit.Phoenix.Layouts.Shell.shell print_identity={@print.identity} print_subject={@print.subject} print_standing={@print.standing} print_tenant={@print.tenant} product="kit" navigation_label="Application" navigation="none" density="desk">
  <:subject>Calendar</:subject>
  <:lede_range days={Kit.Phoenix.Time.month(reader(), 2025, 4)} />
  <:lede words={[Kit.Phoenix.Words.text("19 items, most in the week of "), Kit.Phoenix.Words.time(Kit.Phoenix.Time.day(reader(), ~D[2025-04-14]))]} />
  <:actions><a href="../../layout-calendar/#layout-calendar-month">{@owner}</a></:actions>
  <:body>
    <Kit.Phoenix.Layouts.Calendar.calendar :let={subject_region} subject_state={Kit.Phoenix.State.none()} range_days={Kit.Phoenix.Time.month(reader(), 2025, 4)} toolbar_rest={%{"aria-label": "Calendar controls"}} scope_id="kit-calendar-month-filters" filters_label="Filters">
      <:today label="Today" />
      <:previous label="Previous month" href="?month=previous" rest={%{rel: "prev"}} />
      <:next label="Next month" href="?month=next" rest={%{rel: "next"}} />
      <:date><Kit.Phoenix.Roles.FormGroup.form_group id="calendar-month-date"><:label>Go to a date</:label><:control :let={binding}><Kit.Phoenix.Roles.DateField.date_field binding={binding} reader={reader()} name="date" value={Kit.Phoenix.Roles.DateField.Committed.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-01]))} today={Kit.Phoenix.Time.day(reader(), ~D[2025-04-01])} direction={:either} /></:control></Kit.Phoenix.Roles.FormGroup.form_group></:date>
      <:scope>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-month-scope-form-group" kind={Kit.Phoenix.Roles.FormGroup.Kind.select()} control_rest={%{id: "calendar-month-scope"}}><:label rest={%{for: "calendar-month-scope"}}>Hall</:label><:option value="all">All halls</:option><:option value="oakmere">Oakmere Hall</:option></Kit.Phoenix.Roles.FormGroup.form_group>
      </:scope>
      <:scope>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-month-room-form-group" kind={Kit.Phoenix.Roles.FormGroup.Kind.select()} control_rest={%{id: "calendar-month-room"}}><:label rest={%{for: "calendar-month-room"}}>Room</:label><:option value="all">All rooms</:option><:option value="main-hall">Main Hall</:option></Kit.Phoenix.Roles.FormGroup.form_group>
      </:scope>
      <:view>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-month-view-form-group"><:label>View</:label><:control_set :let={binding}><Kit.Phoenix.Roles.SegmentedControl.segmented_control binding={binding} name="calendar-month-view" value="month"><:option value="month">Month</:option><:option value="week">Week</:option><:option value="day">Day</:option></Kit.Phoenix.Roles.SegmentedControl.segmented_control></:control_set></Kit.Phoenix.Roles.FormGroup.form_group>
      </:view>
      <:actions><Kit.Phoenix.Roles.PrimaryAction.primary_action>New booking</Kit.Phoenix.Roles.PrimaryAction.primary_action></:actions>
      <Kit.Phoenix.Layouts.Calendar.month_grid subject_region={subject_region} columns={7}>
        <:column_head><strong>Mon</strong></:column_head>
        <:column_head><strong>Tue</strong></:column_head>
        <:column_head><strong>Wed</strong></:column_head>
        <:column_head><strong>Thu</strong></:column_head>
        <:column_head><strong>Fri</strong></:column_head>
        <:column_head><strong>Sat</strong></:column_head>
        <:column_head><strong>Sun</strong></:column_head>
        <Kit.Phoenix.Layouts.Calendar.month_cell day={Kit.Phoenix.Time.short_date(reader(), ~D[2025-03-31])} />
        <Kit.Phoenix.Layouts.Calendar.month_cell day={Kit.Phoenix.Time.day_number(reader(), ~D[2025-04-01])}>
          <:item name="Toddler group" href="../../record/" start={Kit.Phoenix.Time.time_of_day(reader(), ~U[2025-04-01 08:30:00Z])} />
          <:new rest={%{"aria-label": "New booking on 1 April 2025"}} />
        </Kit.Phoenix.Layouts.Calendar.month_cell>
        <Kit.Phoenix.Layouts.Calendar.month_cell day={Kit.Phoenix.Time.day_number(reader(), ~D[2025-04-02])} />
        <Kit.Phoenix.Layouts.Calendar.month_cell day={Kit.Phoenix.Time.day_number(reader(), ~D[2025-04-03])}>
          <:item name="Parish council" href="../../record/" start={Kit.Phoenix.Time.time_of_day(reader(), ~U[2025-04-03 18:00:00Z])} />
          <:new rest={%{"aria-label": "New booking on 3 April 2025"}} />
        </Kit.Phoenix.Layouts.Calendar.month_cell>
        <Kit.Phoenix.Layouts.Calendar.month_cell day={Kit.Phoenix.Time.day_number(reader(), ~D[2025-04-04])}>
          <:new rest={%{"aria-label": "New booking on 4 April 2025"}} />
        </Kit.Phoenix.Layouts.Calendar.month_cell>
        <Kit.Phoenix.Layouts.Calendar.month_cell day={Kit.Phoenix.Time.day_number(reader(), ~D[2025-04-05])}>
          <:item name="Birthday party" href="../../record/" start={Kit.Phoenix.Time.time_of_day(reader(), ~U[2025-04-05 13:00:00Z])} />
          <:new rest={%{"aria-label": "New booking on 5 April 2025"}} />
        </Kit.Phoenix.Layouts.Calendar.month_cell>
        <Kit.Phoenix.Layouts.Calendar.month_cell day={Kit.Phoenix.Time.day_number(reader(), ~D[2025-04-06])}>
          <:new rest={%{"aria-label": "New booking on 6 April 2025"}} />
        </Kit.Phoenix.Layouts.Calendar.month_cell>
        <Kit.Phoenix.Layouts.Calendar.month_cell day={Kit.Phoenix.Time.day_number(reader(), ~D[2025-04-07])}>
          <:new rest={%{"aria-label": "New booking on 7 April 2025"}} />
        </Kit.Phoenix.Layouts.Calendar.month_cell>
        <Kit.Phoenix.Layouts.Calendar.month_cell day={Kit.Phoenix.Time.day_number(reader(), ~D[2025-04-08])}>
          <:item name="Toddler group" href="../../record/" start={Kit.Phoenix.Time.time_of_day(reader(), ~U[2025-04-08 08:30:00Z])} />
          <:new rest={%{"aria-label": "New booking on 8 April 2025"}} />
        </Kit.Phoenix.Layouts.Calendar.month_cell>
        <Kit.Phoenix.Layouts.Calendar.month_cell day={Kit.Phoenix.Time.day_number(reader(), ~D[2025-04-09])}>
          <:new rest={%{"aria-label": "New booking on 9 April 2025"}} />
        </Kit.Phoenix.Layouts.Calendar.month_cell>
        <Kit.Phoenix.Layouts.Calendar.month_cell day={Kit.Phoenix.Time.day_number(reader(), ~D[2025-04-10])}>
          <:item name="Yoga class" href="../../record/" start={Kit.Phoenix.Time.time_of_day(reader(), ~U[2025-04-10 09:00:00Z])} />
          <:new rest={%{"aria-label": "New booking on 10 April 2025"}} />
        </Kit.Phoenix.Layouts.Calendar.month_cell>
        <Kit.Phoenix.Layouts.Calendar.month_cell day={Kit.Phoenix.Time.day_number(reader(), ~D[2025-04-11])}>
          <:new rest={%{"aria-label": "New booking on 11 April 2025"}} />
        </Kit.Phoenix.Layouts.Calendar.month_cell>
        <Kit.Phoenix.Layouts.Calendar.month_cell day={Kit.Phoenix.Time.day_number(reader(), ~D[2025-04-12])}>
          <:item name="Wedding reception" href="../../record/" start={Kit.Phoenix.Time.time_of_day(reader(), ~U[2025-04-12 11:00:00Z])} />
          <:new rest={%{"aria-label": "New booking on 12 April 2025"}} />
        </Kit.Phoenix.Layouts.Calendar.month_cell>
        <Kit.Phoenix.Layouts.Calendar.month_cell day={Kit.Phoenix.Time.day_number(reader(), ~D[2025-04-13])}>
          <:new rest={%{"aria-label": "New booking on 13 April 2025"}} />
        </Kit.Phoenix.Layouts.Calendar.month_cell>
        <Kit.Phoenix.Layouts.Calendar.month_cell day={Kit.Phoenix.Time.day_number(reader(), ~D[2025-04-14])}>
          <:band href="../../record/">Open day</:band>
          <:band href="../../record/">Meeting Room decorated</:band>
          <:item name="Yoga class" href="../../record/" start={Kit.Phoenix.Time.time_of_day(reader(), ~U[2025-04-14 09:00:00Z])} />
          <:folded href="../day-rooms/">4 more</:folded>
        </Kit.Phoenix.Layouts.Calendar.month_cell>
        <Kit.Phoenix.Layouts.Calendar.month_cell day={Kit.Phoenix.Time.day_number(reader(), ~D[2025-04-15])}>
          <:band href="../../record/">Hall closed for rewiring</:band>
          <:item name="Key handover" href="../../record/" start={Kit.Phoenix.Time.time_of_day(reader(), ~U[2025-04-15 14:00:00Z])} />
          <:new rest={%{"aria-label": "New booking on 15 April 2025"}} />
        </Kit.Phoenix.Layouts.Calendar.month_cell>
        <Kit.Phoenix.Layouts.Calendar.month_cell day={Kit.Phoenix.Time.day_number(reader(), ~D[2025-04-16])}>
          <:item name="Parish council" href="../../record/" start={Kit.Phoenix.Time.time_of_day(reader(), ~U[2025-04-16 10:00:00Z])} />
          <:item name="Choir rehearsal" href="../../record/" start={Kit.Phoenix.Time.time_of_day(reader(), ~U[2025-04-16 17:00:00Z])} standings={["cancelled"]} />
          <:new rest={%{"aria-label": "New booking on 16 April 2025"}} />
        </Kit.Phoenix.Layouts.Calendar.month_cell>
        <Kit.Phoenix.Layouts.Calendar.month_cell day={Kit.Phoenix.Time.day_number(reader(), ~D[2025-04-17])}>
          <:new rest={%{"aria-label": "New booking on 17 April 2025"}} />
        </Kit.Phoenix.Layouts.Calendar.month_cell>
        <Kit.Phoenix.Layouts.Calendar.month_cell day={Kit.Phoenix.Time.day_number(reader(), ~D[2025-04-18])}>
          <:new rest={%{"aria-label": "New booking on 18 April 2025"}} />
        </Kit.Phoenix.Layouts.Calendar.month_cell>
        <Kit.Phoenix.Layouts.Calendar.month_cell day={Kit.Phoenix.Time.day_number(reader(), ~D[2025-04-19])}>
          <:item name="Birthday party" href="../../record/" start={Kit.Phoenix.Time.time_of_day(reader(), ~U[2025-04-19 13:00:00Z])} />
          <:new rest={%{"aria-label": "New booking on 19 April 2025"}} />
        </Kit.Phoenix.Layouts.Calendar.month_cell>
        <Kit.Phoenix.Layouts.Calendar.month_cell day={Kit.Phoenix.Time.day_number(reader(), ~D[2025-04-20])}>
          <:new rest={%{"aria-label": "New booking on 20 April 2025"}} />
        </Kit.Phoenix.Layouts.Calendar.month_cell>
        <Kit.Phoenix.Layouts.Calendar.month_cell day={Kit.Phoenix.Time.day_number(reader(), ~D[2025-04-21])}>
          <:new rest={%{"aria-label": "New booking on 21 April 2025"}} />
        </Kit.Phoenix.Layouts.Calendar.month_cell>
        <Kit.Phoenix.Layouts.Calendar.month_cell day={Kit.Phoenix.Time.day_number(reader(), ~D[2025-04-22])}>
          <:item name="Toddler group" href="../../record/" start={Kit.Phoenix.Time.time_of_day(reader(), ~U[2025-04-22 08:30:00Z])} />
          <:new rest={%{"aria-label": "New booking on 22 April 2025"}} />
        </Kit.Phoenix.Layouts.Calendar.month_cell>
        <Kit.Phoenix.Layouts.Calendar.month_cell day={Kit.Phoenix.Time.day_number(reader(), ~D[2025-04-23])}>
          <:new rest={%{"aria-label": "New booking on 23 April 2025"}} />
        </Kit.Phoenix.Layouts.Calendar.month_cell>
        <Kit.Phoenix.Layouts.Calendar.month_cell day={Kit.Phoenix.Time.day_number(reader(), ~D[2025-04-24])}>
          <:item name="Yoga class" href="../../record/" start={Kit.Phoenix.Time.time_of_day(reader(), ~U[2025-04-24 09:00:00Z])} />
          <:new rest={%{"aria-label": "New booking on 24 April 2025"}} />
        </Kit.Phoenix.Layouts.Calendar.month_cell>
        <Kit.Phoenix.Layouts.Calendar.month_cell day={Kit.Phoenix.Time.day_number(reader(), ~D[2025-04-25])}>
          <:new rest={%{"aria-label": "New booking on 25 April 2025"}} />
        </Kit.Phoenix.Layouts.Calendar.month_cell>
        <Kit.Phoenix.Layouts.Calendar.month_cell day={Kit.Phoenix.Time.day_number(reader(), ~D[2025-04-26])}>
          <:item name="Village fair planning" href="../../record/" start={Kit.Phoenix.Time.time_of_day(reader(), ~U[2025-04-26 09:00:00Z])} />
          <:new rest={%{"aria-label": "New booking on 26 April 2025"}} />
        </Kit.Phoenix.Layouts.Calendar.month_cell>
        <Kit.Phoenix.Layouts.Calendar.month_cell day={Kit.Phoenix.Time.day_number(reader(), ~D[2025-04-27])}>
          <:new rest={%{"aria-label": "New booking on 27 April 2025"}} />
        </Kit.Phoenix.Layouts.Calendar.month_cell>
        <Kit.Phoenix.Layouts.Calendar.month_cell day={Kit.Phoenix.Time.day_number(reader(), ~D[2025-04-28])}>
          <:new rest={%{"aria-label": "New booking on 28 April 2025"}} />
        </Kit.Phoenix.Layouts.Calendar.month_cell>
        <Kit.Phoenix.Layouts.Calendar.month_cell day={Kit.Phoenix.Time.day_number(reader(), ~D[2025-04-29])}>
          <:item name="Toddler group" href="../../record/" start={Kit.Phoenix.Time.time_of_day(reader(), ~U[2025-04-29 08:30:00Z])} />
          <:new rest={%{"aria-label": "New booking on 29 April 2025"}} />
        </Kit.Phoenix.Layouts.Calendar.month_cell>
        <Kit.Phoenix.Layouts.Calendar.month_cell day={Kit.Phoenix.Time.day_number(reader(), ~D[2025-04-30])}>
          <:new rest={%{"aria-label": "New booking on 30 April 2025"}} />
        </Kit.Phoenix.Layouts.Calendar.month_cell>
        <Kit.Phoenix.Layouts.Calendar.month_cell day={Kit.Phoenix.Time.short_date(reader(), ~D[2025-05-01])} />
        <Kit.Phoenix.Layouts.Calendar.month_cell day={Kit.Phoenix.Time.short_date(reader(), ~D[2025-05-02])} />
        <Kit.Phoenix.Layouts.Calendar.month_cell day={Kit.Phoenix.Time.short_date(reader(), ~D[2025-05-03])} />
        <Kit.Phoenix.Layouts.Calendar.month_cell day={Kit.Phoenix.Time.short_date(reader(), ~D[2025-05-04])} />
      </Kit.Phoenix.Layouts.Calendar.month_grid>
      <Kit.Phoenix.Layouts.Calendar.days subject_region={subject_region}>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-01])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Toddler group" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-01 08:30:00Z], ~U[2025-04-01 10:00:00Z])} kind="Booking" />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-02])}>
          <:empty>Nothing booked</:empty>
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-03])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Parish council" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-03 18:00:00Z], ~U[2025-04-03 19:30:00Z])} kind="Meeting" />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-04])}>
          <:empty>Nothing booked</:empty>
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-05])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Birthday party" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-05 13:00:00Z], ~U[2025-04-05 15:00:00Z])} kind="Booking" />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-06])}>
          <:empty>Nothing booked</:empty>
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-07])}>
          <:empty>Nothing booked</:empty>
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-08])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Toddler group" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-08 08:30:00Z], ~U[2025-04-08 10:00:00Z])} kind="Booking" />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-09])}>
          <:empty>Nothing booked</:empty>
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-10])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Yoga class" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-10 09:00:00Z], ~U[2025-04-10 10:00:00Z])} kind="Booking" />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-11])}>
          <:empty>Nothing booked</:empty>
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-12])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Wedding reception" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-12 11:00:00Z], ~U[2025-04-12 14:00:00Z])} kind="Booking" />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-13])}>
          <:empty>Nothing booked</:empty>
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-14])}>
          <Kit.Phoenix.Layouts.Calendar.band_row name="Open day" href="../../record/" />
          <Kit.Phoenix.Layouts.Calendar.band_row name="Meeting Room decorated" href="../../record/" />
          <Kit.Phoenix.Layouts.Calendar.item_row name="Yoga class" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 09:00:00Z], ~U[2025-04-14 10:00:00Z])} kind="Booking" room="Main Hall" />
          <Kit.Phoenix.Layouts.Calendar.item_row name="Hire request" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 10:00:00Z], ~U[2025-04-14 11:00:00Z])} kind="Requested" />
          <Kit.Phoenix.Layouts.Calendar.item_row name="Parish council" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 10:00:00Z], ~U[2025-04-14 11:00:00Z])} kind="Meeting" room="Meeting Room" />
          <Kit.Phoenix.Layouts.Calendar.item_row name="Community lunch" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 10:30:00Z], ~U[2025-04-14 11:00:00Z])} kind="Booking" room="Main Hall" />
          <Kit.Phoenix.Layouts.Calendar.item_row name="Wedding reception" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 11:00:00Z], ~U[2025-04-14 14:00:00Z])} kind="Booking" room="Main Hall" />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-15])}>
          <Kit.Phoenix.Layouts.Calendar.band_row name="Hall closed for rewiring" href="../../record/" />
          <Kit.Phoenix.Layouts.Calendar.item_row name="Key handover" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-15 14:00:00Z], ~U[2025-04-15 14:20:00Z])} kind="Booking" />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-16])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Parish council" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-16 10:00:00Z], ~U[2025-04-16 11:30:00Z])} kind="Meeting" />
          <Kit.Phoenix.Layouts.Calendar.item_row name="Choir rehearsal" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-16 17:00:00Z], ~U[2025-04-16 19:00:00Z])} kind="Booking" standings={["cancelled"]} standing_words={["Cancelled"]} />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-17])}>
          <:empty>Nothing booked</:empty>
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-18])}>
          <:empty>Nothing booked</:empty>
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-19])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Birthday party" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-19 13:00:00Z], ~U[2025-04-19 15:00:00Z])} kind="Booking" />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-20])}>
          <:empty>Nothing booked</:empty>
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-21])}>
          <:empty>Nothing booked</:empty>
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-22])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Toddler group" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-22 08:30:00Z], ~U[2025-04-22 10:00:00Z])} kind="Booking" />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-23])}>
          <:empty>Nothing booked</:empty>
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-24])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Yoga class" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-24 09:00:00Z], ~U[2025-04-24 10:00:00Z])} kind="Booking" />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-25])}>
          <:empty>Nothing booked</:empty>
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-26])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Village fair planning" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-26 09:00:00Z], ~U[2025-04-26 10:30:00Z])} kind="Meeting" />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-27])}>
          <:empty>Nothing booked</:empty>
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-28])}>
          <:empty>Nothing booked</:empty>
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-29])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Toddler group" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-29 08:30:00Z], ~U[2025-04-29 10:00:00Z])} kind="Booking" />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-30])}>
          <:empty>Nothing booked</:empty>
        </Kit.Phoenix.Layouts.Calendar.day>
      </Kit.Phoenix.Layouts.Calendar.days>
    </Kit.Phoenix.Layouts.Calendar.calendar>
  </:body>
</Kit.Phoenix.Layouts.Shell.shell>

<Kit.Phoenix.Layouts.Shell.shell print_identity={@print.identity} print_subject={@print.subject} print_standing={@print.standing} print_tenant={@print.tenant} product="kit" navigation_label="Application" navigation="none" density="desk">
  <:subject>Calendar</:subject>
  <:lede_range days={Kit.Phoenix.Time.day_range(reader(), ~D[2025-04-14], ~D[2025-04-16])} />
  <:lede words="No bookings" />
  <:actions><a href="../../layout-calendar/#layout-calendar-empty">{@owner}</a></:actions>
  <:body id="main">
    <Kit.Phoenix.Layouts.Calendar.calendar :let={subject_region} subject_state={Kit.Phoenix.State.empty("Nothing booked this week. Bookings show here once they're made.")} range_days={Kit.Phoenix.Time.day_range(reader(), ~D[2025-04-14], ~D[2025-04-16])} toolbar_rest={%{"aria-label": "Calendar controls"}} scope_id="kit-calendar-empty-filters" filters_label="Filters">
      <:today label="Today" />
      <:previous label="Previous week" href="?week=previous" rest={%{rel: "prev"}} />
      <:next label="Next week" href="?week=next" rest={%{rel: "next"}} />
      <:date><Kit.Phoenix.Roles.FormGroup.form_group id="calendar-empty-date"><:label>Go to a date</:label><:control :let={binding}><Kit.Phoenix.Roles.DateField.date_field binding={binding} reader={reader()} name="date" value={Kit.Phoenix.Roles.DateField.Committed.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-14]))} today={Kit.Phoenix.Time.day(reader(), ~D[2025-04-14])} direction={:either} /></:control></Kit.Phoenix.Roles.FormGroup.form_group></:date>
      <:scope>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-empty-scope-form-group" kind={Kit.Phoenix.Roles.FormGroup.Kind.select()} control_rest={%{id: "calendar-empty-scope"}}><:label rest={%{for: "calendar-empty-scope"}}>Hall</:label><:option value="all">All halls</:option><:option value="oakmere">Oakmere Hall</:option></Kit.Phoenix.Roles.FormGroup.form_group>
      </:scope>
      <:scope>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-empty-room-form-group" kind={Kit.Phoenix.Roles.FormGroup.Kind.select()} control_rest={%{id: "calendar-empty-room"}}><:label rest={%{for: "calendar-empty-room"}}>Room</:label><:option value="all">All rooms</:option><:option value="main-hall">Main Hall</:option></Kit.Phoenix.Roles.FormGroup.form_group>
      </:scope>
      <:view>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-empty-view-form-group"><:label>View</:label><:control_set :let={binding}><Kit.Phoenix.Roles.SegmentedControl.segmented_control binding={binding} name="calendar-empty-view" value="week"><:option value="week">Week</:option><:option value="day">Day</:option><:option value="month">Month</:option></Kit.Phoenix.Roles.SegmentedControl.segmented_control></:control_set></Kit.Phoenix.Roles.FormGroup.form_group>
      </:view>
      <Kit.Phoenix.Layouts.Calendar.desk_grid subject_region={subject_region} columns={3} time_gutter_rest={%{"aria-label": "Times"}}>
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-14]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-15]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-16]))} />
        <:hour :for={hour <- ([Kit.Phoenix.Time.clock(reader(), ~T[07:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[08:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[09:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[10:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[11:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[12:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[13:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[14:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[15:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[16:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[17:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[18:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[19:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[20:00:00])])} time={hour} />
        <:column></:column>
        <:column>
          <Kit.Phoenix.Layouts.Calendar.current_time style="--kit-calendar-now-offset: calc(11.5 * var(--kit-hour-height));" />
        </:column>
        <:column></:column>
      </Kit.Phoenix.Layouts.Calendar.desk_grid>
      <Kit.Phoenix.Layouts.Calendar.days subject_region={subject_region}>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-14])}>
          <:empty>Nothing booked</:empty>
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-15])}>
          <:empty>Nothing booked</:empty>
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-16])}>
          <:empty>Nothing booked</:empty>
        </Kit.Phoenix.Layouts.Calendar.day>
      </Kit.Phoenix.Layouts.Calendar.days>
    </Kit.Phoenix.Layouts.Calendar.calendar>
  </:body>
</Kit.Phoenix.Layouts.Shell.shell>

<Kit.Phoenix.Layouts.Shell.shell print_identity={@print.identity} print_subject={@print.subject} print_standing={@print.standing} print_tenant={@print.tenant} product="kit" navigation_label="Application" navigation="none" density="desk">
  <:subject>Calendar</:subject>
  <:lede_range days={Kit.Phoenix.Time.day_range(reader(), ~D[2025-04-14], ~D[2025-04-17])} />
  <:lede words="4 items" />
  <:actions><a href="../../layout-calendar/#layout-calendar-moving">{@owner}</a></:actions>
  <:body>
    <Kit.Phoenix.Layouts.Calendar.calendar :let={subject_region} subject_state={Kit.Phoenix.State.none()} range_days={Kit.Phoenix.Time.day_range(reader(), ~D[2025-04-14], ~D[2025-04-17])} toolbar_rest={%{"aria-label": "Calendar controls"}} scope_id="kit-calendar-moving-filters" filters_label="Filters">
      <:today label="Today" />
      <:previous label="Previous week" href="?week=previous" rest={%{rel: "prev"}} />
      <:next label="Next week" href="?week=next" rest={%{rel: "next"}} />
      <:date><Kit.Phoenix.Roles.FormGroup.form_group id="calendar-moving-date"><:label>Go to a date</:label><:control :let={binding}><Kit.Phoenix.Roles.DateField.date_field binding={binding} reader={reader()} name="date" value={Kit.Phoenix.Roles.DateField.Committed.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-14]))} today={Kit.Phoenix.Time.day(reader(), ~D[2025-04-14])} direction={:either} /></:control></Kit.Phoenix.Roles.FormGroup.form_group></:date>
      <:scope>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-moving-scope-form-group" kind={Kit.Phoenix.Roles.FormGroup.Kind.select()} control_rest={%{id: "calendar-moving-scope"}}><:label rest={%{for: "calendar-moving-scope"}}>Hall</:label><:option value="all">All halls</:option><:option value="oakmere">Oakmere Hall</:option></Kit.Phoenix.Roles.FormGroup.form_group>
      </:scope>
      <:scope>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-moving-room-form-group" kind={Kit.Phoenix.Roles.FormGroup.Kind.select()} control_rest={%{id: "calendar-moving-room"}}><:label rest={%{for: "calendar-moving-room"}}>Room</:label><:option value="all">All rooms</:option><:option value="main-hall">Main Hall</:option></Kit.Phoenix.Roles.FormGroup.form_group>
      </:scope>
      <:view>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-moving-view-form-group"><:label>View</:label><:control_set :let={binding}><Kit.Phoenix.Roles.SegmentedControl.segmented_control binding={binding} name="calendar-moving-view" value="week"><:option value="week">Week</:option><:option value="day">Day</:option><:option value="month">Month</:option></Kit.Phoenix.Roles.SegmentedControl.segmented_control></:control_set></Kit.Phoenix.Roles.FormGroup.form_group>
      </:view>
      <:actions><Kit.Phoenix.Roles.PrimaryAction.primary_action>New booking</Kit.Phoenix.Roles.PrimaryAction.primary_action></:actions>
      <Kit.Phoenix.Layouts.Calendar.desk_grid subject_region={subject_region} columns={4} time_gutter_rest={%{"aria-label": "Times"}}>
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-14]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-15]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-16]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-17]))} />
        <:hour :for={hour <- ([Kit.Phoenix.Time.clock(reader(), ~T[08:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[09:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[10:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[11:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[12:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[13:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[14:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[15:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[16:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[17:00:00])])} time={hour} />
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Board meeting" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 08:00:00Z], ~U[2025-04-14 09:00:00Z])} kind="Meeting" aria-label="Board meeting, 09:00–10:00" style="grid-row: 2 / span 1;" />
        </:column>
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Yoga class" href="../../record/calendar-item/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-15 09:00:00Z], ~U[2025-04-15 11:00:00Z])} kind="Booking" moving aria-label="Yoga class, 10:00–12:00" draggable="true" style="grid-row: 3 / span 2;" />
        </:column>
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Parish council" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-16 10:00:00Z], ~U[2025-04-16 11:00:00Z])} kind="Meeting" aria-label="Parish council, 11:00–12:00" style="grid-row: 4 / span 1;" />
        </:column>
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Wedding reception" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-17 11:00:00Z], ~U[2025-04-17 14:00:00Z])} kind="Booking" aria-label="Wedding reception, 12:00–15:00" style="grid-row: 5 / span 3;" />
        </:column>
      </Kit.Phoenix.Layouts.Calendar.desk_grid>
      <Kit.Phoenix.Layouts.Calendar.days subject_region={subject_region}>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-14])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Board meeting" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 08:00:00Z], ~U[2025-04-14 09:00:00Z])} kind="Meeting" />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-15])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Yoga class" href="../../record/calendar-item/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-15 09:00:00Z], ~U[2025-04-15 11:00:00Z])} kind="Booking" />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-16])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Parish council" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-16 10:00:00Z], ~U[2025-04-16 11:00:00Z])} kind="Meeting" />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-17])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Wedding reception" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-17 11:00:00Z], ~U[2025-04-17 14:00:00Z])} kind="Booking" />
        </Kit.Phoenix.Layouts.Calendar.day>
      </Kit.Phoenix.Layouts.Calendar.days>
    </Kit.Phoenix.Layouts.Calendar.calendar>
  </:body>
</Kit.Phoenix.Layouts.Shell.shell>

<Kit.Phoenix.Layouts.Shell.shell print_identity={@print.identity} print_subject={@print.subject} print_standing={@print.standing} print_tenant={@print.tenant} product="kit" navigation_label="Application" navigation="none" density="desk">
  <:subject>Calendar</:subject>
  <:lede_range days={Kit.Phoenix.Time.day_range(reader(), ~D[2025-04-14], ~D[2025-04-17])} />
  <:lede words="4 items" />
  <:actions><a href="../../layout-calendar/#layout-calendar-accepting">{@owner}</a></:actions>
  <:body>
    <Kit.Phoenix.Layouts.Calendar.calendar :let={subject_region} subject_state={Kit.Phoenix.State.none()} range_days={Kit.Phoenix.Time.day_range(reader(), ~D[2025-04-14], ~D[2025-04-17])} toolbar_rest={%{"aria-label": "Calendar controls"}} scope_id="kit-calendar-accepting-filters" filters_label="Filters">
      <:today label="Today" />
      <:previous label="Previous week" href="?week=previous" rest={%{rel: "prev"}} />
      <:next label="Next week" href="?week=next" rest={%{rel: "next"}} />
      <:date><Kit.Phoenix.Roles.FormGroup.form_group id="calendar-accepting-date"><:label>Go to a date</:label><:control :let={binding}><Kit.Phoenix.Roles.DateField.date_field binding={binding} reader={reader()} name="date" value={Kit.Phoenix.Roles.DateField.Committed.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-14]))} today={Kit.Phoenix.Time.day(reader(), ~D[2025-04-14])} direction={:either} /></:control></Kit.Phoenix.Roles.FormGroup.form_group></:date>
      <:scope>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-accepting-scope-form-group" kind={Kit.Phoenix.Roles.FormGroup.Kind.select()} control_rest={%{id: "calendar-accepting-scope"}}><:label rest={%{for: "calendar-accepting-scope"}}>Hall</:label><:option value="all">All halls</:option><:option value="oakmere">Oakmere Hall</:option></Kit.Phoenix.Roles.FormGroup.form_group>
      </:scope>
      <:scope>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-accepting-room-form-group" kind={Kit.Phoenix.Roles.FormGroup.Kind.select()} control_rest={%{id: "calendar-accepting-room"}}><:label rest={%{for: "calendar-accepting-room"}}>Room</:label><:option value="all">All rooms</:option><:option value="main-hall">Main Hall</:option></Kit.Phoenix.Roles.FormGroup.form_group>
      </:scope>
      <:view>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-accepting-view-form-group"><:label>View</:label><:control_set :let={binding}><Kit.Phoenix.Roles.SegmentedControl.segmented_control binding={binding} name="calendar-accepting-view" value="week"><:option value="week">Week</:option><:option value="day">Day</:option><:option value="month">Month</:option></Kit.Phoenix.Roles.SegmentedControl.segmented_control></:control_set></Kit.Phoenix.Roles.FormGroup.form_group>
      </:view>
      <:actions><Kit.Phoenix.Roles.PrimaryAction.primary_action>New booking</Kit.Phoenix.Roles.PrimaryAction.primary_action></:actions>
      <Kit.Phoenix.Layouts.Calendar.desk_grid subject_region={subject_region} columns={4} time_gutter_rest={%{"aria-label": "Times"}}>
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-14]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-15]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-16]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-17]))} />
        <:hour :for={hour <- ([Kit.Phoenix.Time.clock(reader(), ~T[08:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[09:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[10:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[11:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[12:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[13:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[14:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[15:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[16:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[17:00:00])])} time={hour} />
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Board meeting" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 08:00:00Z], ~U[2025-04-14 09:00:00Z])} kind="Meeting" aria-label="Board meeting, 09:00–10:00" style="grid-row: 2 / span 1;" />
        </:column>
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Yoga class" href="../../record/calendar-item/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-15 09:00:00Z], ~U[2025-04-15 11:00:00Z])} kind="Booking" moving aria-label="Yoga class, 10:00–12:00" draggable="true" style="grid-row: 3 / span 2;" />
        </:column>
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Parish council" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-16 10:00:00Z], ~U[2025-04-16 11:00:00Z])} kind="Meeting" aria-label="Parish council, 11:00–12:00" style="grid-row: 4 / span 1;" />
        </:column>
        <:column>
          <Kit.Phoenix.Layouts.Calendar.drop_target standing="accepting" style="grid-row: 3 / span 2;"><:preview name="Yoga class" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-17 09:00:00Z], ~U[2025-04-17 11:00:00Z])} kind="Booking" /></Kit.Phoenix.Layouts.Calendar.drop_target>
          <Kit.Phoenix.Layouts.Calendar.block name="Wedding reception" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-17 11:00:00Z], ~U[2025-04-17 14:00:00Z])} kind="Booking" aria-label="Wedding reception, 12:00–15:00" style="grid-row: 5 / span 3;" />
        </:column>
      </Kit.Phoenix.Layouts.Calendar.desk_grid>
      <Kit.Phoenix.Layouts.Calendar.days subject_region={subject_region}>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-14])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Board meeting" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 08:00:00Z], ~U[2025-04-14 09:00:00Z])} kind="Meeting" />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-15])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Yoga class" href="../../record/calendar-item/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-15 09:00:00Z], ~U[2025-04-15 11:00:00Z])} kind="Booking" />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-16])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Parish council" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-16 10:00:00Z], ~U[2025-04-16 11:00:00Z])} kind="Meeting" />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-17])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Wedding reception" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-17 11:00:00Z], ~U[2025-04-17 14:00:00Z])} kind="Booking" />
        </Kit.Phoenix.Layouts.Calendar.day>
      </Kit.Phoenix.Layouts.Calendar.days>
    </Kit.Phoenix.Layouts.Calendar.calendar>
  </:body>
</Kit.Phoenix.Layouts.Shell.shell>

<Kit.Phoenix.Layouts.Shell.shell print_identity={@print.identity} print_subject={@print.subject} print_standing={@print.standing} print_tenant={@print.tenant} product="kit" navigation_label="Application" navigation="none" density="desk">
  <:subject>Calendar</:subject>
  <:lede_range days={Kit.Phoenix.Time.day_range(reader(), ~D[2025-04-14], ~D[2025-04-17])} />
  <:lede words="4 items" />
  <:actions><a href="../../layout-calendar/#layout-calendar-refused">{@owner}</a></:actions>
  <:body>
    <Kit.Phoenix.Layouts.Calendar.calendar :let={subject_region} subject_state={Kit.Phoenix.State.none()} range_days={Kit.Phoenix.Time.day_range(reader(), ~D[2025-04-14], ~D[2025-04-17])} toolbar_rest={%{"aria-label": "Calendar controls"}} scope_id="kit-calendar-refused-filters" filters_label="Filters">
      <:today label="Today" />
      <:previous label="Previous week" href="?week=previous" rest={%{rel: "prev"}} />
      <:next label="Next week" href="?week=next" rest={%{rel: "next"}} />
      <:date><Kit.Phoenix.Roles.FormGroup.form_group id="calendar-refused-date"><:label>Go to a date</:label><:control :let={binding}><Kit.Phoenix.Roles.DateField.date_field binding={binding} reader={reader()} name="date" value={Kit.Phoenix.Roles.DateField.Committed.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-14]))} today={Kit.Phoenix.Time.day(reader(), ~D[2025-04-14])} direction={:either} /></:control></Kit.Phoenix.Roles.FormGroup.form_group></:date>
      <:scope>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-refused-scope-form-group" kind={Kit.Phoenix.Roles.FormGroup.Kind.select()} control_rest={%{id: "calendar-refused-scope"}}><:label rest={%{for: "calendar-refused-scope"}}>Hall</:label><:option value="all">All halls</:option><:option value="oakmere">Oakmere Hall</:option></Kit.Phoenix.Roles.FormGroup.form_group>
      </:scope>
      <:scope>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-refused-room-form-group" kind={Kit.Phoenix.Roles.FormGroup.Kind.select()} control_rest={%{id: "calendar-refused-room"}}><:label rest={%{for: "calendar-refused-room"}}>Room</:label><:option value="all">All rooms</:option><:option value="main-hall">Main Hall</:option></Kit.Phoenix.Roles.FormGroup.form_group>
      </:scope>
      <:view>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-refused-view-form-group"><:label>View</:label><:control_set :let={binding}><Kit.Phoenix.Roles.SegmentedControl.segmented_control binding={binding} name="calendar-refused-view" value="week"><:option value="week">Week</:option><:option value="day">Day</:option><:option value="month">Month</:option></Kit.Phoenix.Roles.SegmentedControl.segmented_control></:control_set></Kit.Phoenix.Roles.FormGroup.form_group>
      </:view>
      <:actions><Kit.Phoenix.Roles.PrimaryAction.primary_action>New booking</Kit.Phoenix.Roles.PrimaryAction.primary_action></:actions>
      <Kit.Phoenix.Layouts.Calendar.desk_grid subject_region={subject_region} columns={4} time_gutter_rest={%{"aria-label": "Times"}}>
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-14]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-15]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-16]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-17]))} />
        <:hour :for={hour <- ([Kit.Phoenix.Time.clock(reader(), ~T[08:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[09:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[10:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[11:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[12:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[13:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[14:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[15:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[16:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[17:00:00])])} time={hour} />
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Board meeting" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 08:00:00Z], ~U[2025-04-14 09:00:00Z])} kind="Meeting" aria-label="Board meeting, 09:00–10:00" style="grid-row: 2 / span 1;" />
          <Kit.Phoenix.Layouts.Calendar.drop_target standing="refused" style="grid-row: 8 / span 2;"><:preview name="Yoga class" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 14:00:00Z], ~U[2025-04-14 16:00:00Z])} kind="Booking" /><:reason side="trailing">Oakmere Hall is kept for the lunch club then</:reason></Kit.Phoenix.Layouts.Calendar.drop_target>
        </:column>
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Yoga class" href="../../record/calendar-item/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-15 09:00:00Z], ~U[2025-04-15 11:00:00Z])} kind="Booking" moving aria-label="Yoga class, 10:00–12:00" draggable="true" style="grid-row: 3 / span 2;" />
        </:column>
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Parish council" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-16 10:00:00Z], ~U[2025-04-16 11:00:00Z])} kind="Meeting" aria-label="Parish council, 11:00–12:00" style="grid-row: 4 / span 1;" />
          <Kit.Phoenix.Layouts.Calendar.drop_target standing="refused" style="grid-row: 6 / span 1;"><:preview name="Yoga class" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-16 12:00:00Z], ~U[2025-04-16 13:00:00Z])} kind="Booking" /><:reason side="below">Oakmere Hall is closed for floor cleaning then</:reason></Kit.Phoenix.Layouts.Calendar.drop_target>
        </:column>
        <:column>
          <Kit.Phoenix.Layouts.Calendar.drop_target standing="refused" style="grid-row: 3 / span 2;"><:preview name="Yoga class" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-17 09:00:00Z], ~U[2025-04-17 11:00:00Z])} kind="Booking" /><:reason side="leading">Oakmere Hall closes at <time datetime="10:00">10:00</time> on Thursdays</:reason></Kit.Phoenix.Layouts.Calendar.drop_target>
          <Kit.Phoenix.Layouts.Calendar.block name="Wedding reception" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-17 11:00:00Z], ~U[2025-04-17 14:00:00Z])} kind="Booking" aria-label="Wedding reception, 12:00–15:00" style="grid-row: 5 / span 3;" />
        </:column>
      </Kit.Phoenix.Layouts.Calendar.desk_grid>
      <Kit.Phoenix.Layouts.Calendar.days subject_region={subject_region}>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-14])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Board meeting" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 08:00:00Z], ~U[2025-04-14 09:00:00Z])} kind="Meeting" />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-15])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Yoga class" href="../../record/calendar-item/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-15 09:00:00Z], ~U[2025-04-15 11:00:00Z])} kind="Booking" />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-16])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Parish council" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-16 10:00:00Z], ~U[2025-04-16 11:00:00Z])} kind="Meeting" />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-17])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Wedding reception" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-17 11:00:00Z], ~U[2025-04-17 14:00:00Z])} kind="Booking" />
        </Kit.Phoenix.Layouts.Calendar.day>
      </Kit.Phoenix.Layouts.Calendar.days>
    </Kit.Phoenix.Layouts.Calendar.calendar>
  </:body>
</Kit.Phoenix.Layouts.Shell.shell>

<Kit.Phoenix.Layouts.Shell.shell print_identity={@print.identity} print_subject={@print.subject} print_standing={@print.standing} print_tenant={@print.tenant} product="kit" navigation_label="Application" navigation="none" density="desk">
  <:subject>Calendar</:subject>
  <:lede_range days={Kit.Phoenix.Time.week(Kit.Phoenix.Reader.new(:en, "Europe/London"), ~D[2025-04-14])} />
  <:lede words="3 bookings" />
  <:actions><a href="../../layout-calendar/#layout-calendar-toolbar-form">{@owner}</a></:actions>
  <:body id="main">
    <Kit.Phoenix.Layouts.Calendar.calendar :let={subject_region} subject_state={Kit.Phoenix.State.none()} range_days={Kit.Phoenix.Time.week(Kit.Phoenix.Reader.new(:en, "Europe/London"), ~D[2025-04-14])} toolbar_rest={%{"aria-label": "Calendar controls"}} toolbar_form_rest={%{}} scope_id="kit-calendar-toolbar-form-filters" filters_label="Filters">
      <:today label="Today" />
      <:previous label="Previous week" href="?week=previous" rest={%{rel: "prev"}} />
      <:next label="Next week" href="?week=next" rest={%{rel: "next"}} />
      <:date form_rest={%{}}><Kit.Phoenix.Roles.FormGroup.form_group id="calendar-toolbar-form-date"><:label>Go to a date</:label><:control :let={binding}><Kit.Phoenix.Roles.DateField.date_field binding={binding} reader={Kit.Phoenix.Reader.new(:en, "Europe/London")} name="date" value={Kit.Phoenix.Roles.DateField.Committed.day(Kit.Phoenix.Time.day(Kit.Phoenix.Reader.new(:en, "Europe/London"), ~D[2025-04-14]))} today={Kit.Phoenix.Time.day(Kit.Phoenix.Reader.new(:en, "Europe/London"), ~D[2025-04-14])} direction={:either} /></:control></Kit.Phoenix.Roles.FormGroup.form_group></:date>
      <:scope>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-toolbar-form-scope-form-group" kind={Kit.Phoenix.Roles.FormGroup.Kind.select()} control_value="oakmere" control_rest={%{id: "calendar-toolbar-form-scope", name: "hall"}}><:label rest={%{for: "calendar-toolbar-form-scope"}}>Hall</:label><:option value="all">All halls</:option><:option value="oakmere">Oakmere Hall</:option></Kit.Phoenix.Roles.FormGroup.form_group>
      </:scope>
      <:scope>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-toolbar-form-room-form-group" kind={Kit.Phoenix.Roles.FormGroup.Kind.select()} control_rest={%{id: "calendar-toolbar-form-room", name: "room"}}><:label rest={%{for: "calendar-toolbar-form-room"}}>Room</:label><:option value="all">All rooms</:option><:option value="main-hall">Main Hall</:option></Kit.Phoenix.Roles.FormGroup.form_group>
      </:scope>
      <:view>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-toolbar-form-view"><:label>View</:label><:control_set :let={binding}><Kit.Phoenix.Roles.SegmentedControl.segmented_control binding={binding} name="view" value="week"><:option value="week">Week</:option><:option value="day">Day</:option><:option value="month">Month</:option></Kit.Phoenix.Roles.SegmentedControl.segmented_control></:control_set></Kit.Phoenix.Roles.FormGroup.form_group>
      </:view>
      <:actions><Kit.Phoenix.Roles.PrimaryAction.primary_action>New booking</Kit.Phoenix.Roles.PrimaryAction.primary_action></:actions>
      <Kit.Phoenix.Layouts.Calendar.desk_grid subject_region={subject_region} columns={7} time_gutter_rest={%{"aria-label": "Times"}}>
        <:column_head :for={day <- 13..19} column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(Kit.Phoenix.Reader.new(:en, "Europe/London"), Date.new!(2025, 4, day)))} />
        <:hour :for={hour <- ([Kit.Phoenix.Time.clock(Kit.Phoenix.Reader.new(:en, "Europe/London"), ~T[09:00:00]), Kit.Phoenix.Time.clock(Kit.Phoenix.Reader.new(:en, "Europe/London"), ~T[10:00:00]), Kit.Phoenix.Time.clock(Kit.Phoenix.Reader.new(:en, "Europe/London"), ~T[11:00:00]), Kit.Phoenix.Time.clock(Kit.Phoenix.Reader.new(:en, "Europe/London"), ~T[12:00:00]), Kit.Phoenix.Time.clock(Kit.Phoenix.Reader.new(:en, "Europe/London"), ~T[13:00:00])])} time={hour} />
        <:column></:column>
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Hall hire" href="../../record/" span={Kit.Phoenix.Time.interval(Kit.Phoenix.Reader.new(:en, "Europe/London"), ~U[2025-04-14 08:00:00Z], ~U[2025-04-14 10:00:00Z])} kind="Booking" aria-label="Hall hire, 9:00–11:00 AM" style="grid-row: 1 / span 2;" />
        </:column>
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Yoga class" href="../../record/" span={Kit.Phoenix.Time.interval(Kit.Phoenix.Reader.new(:en, "Europe/London"), ~U[2025-04-15 10:00:00Z], ~U[2025-04-15 11:00:00Z])} kind="Booking" aria-label="Yoga class, 11:00 AM–12:00 PM" style="grid-row: 3 / span 1;" />
        </:column>
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Committee meeting" href="../../record/" span={Kit.Phoenix.Time.interval(Kit.Phoenix.Reader.new(:en, "Europe/London"), ~U[2025-04-16 12:00:00Z], ~U[2025-04-16 13:00:00Z])} kind="Booking" aria-label="Committee meeting, 1:00–2:00 PM" style="grid-row: 5 / span 1;" />
        </:column>
        <:column></:column>
        <:column></:column>
        <:column></:column>
      </Kit.Phoenix.Layouts.Calendar.desk_grid>
      <Kit.Phoenix.Layouts.Calendar.days subject_region={subject_region}>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(Kit.Phoenix.Reader.new(:en, "Europe/London"), ~D[2025-04-13])}>
          <:empty>Nothing booked</:empty>
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(Kit.Phoenix.Reader.new(:en, "Europe/London"), ~D[2025-04-14])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Hall hire" href="../../record/" span={Kit.Phoenix.Time.interval(Kit.Phoenix.Reader.new(:en, "Europe/London"), ~U[2025-04-14 08:00:00Z], ~U[2025-04-14 10:00:00Z])} kind="Booking" />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(Kit.Phoenix.Reader.new(:en, "Europe/London"), ~D[2025-04-15])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Yoga class" href="../../record/" span={Kit.Phoenix.Time.interval(Kit.Phoenix.Reader.new(:en, "Europe/London"), ~U[2025-04-15 10:00:00Z], ~U[2025-04-15 11:00:00Z])} kind="Booking" />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(Kit.Phoenix.Reader.new(:en, "Europe/London"), ~D[2025-04-16])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Committee meeting" href="../../record/" span={Kit.Phoenix.Time.interval(Kit.Phoenix.Reader.new(:en, "Europe/London"), ~U[2025-04-16 12:00:00Z], ~U[2025-04-16 13:00:00Z])} kind="Booking" />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(Kit.Phoenix.Reader.new(:en, "Europe/London"), ~D[2025-04-17])}>
          <:empty>Nothing booked</:empty>
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(Kit.Phoenix.Reader.new(:en, "Europe/London"), ~D[2025-04-18])}>
          <:empty>Nothing booked</:empty>
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(Kit.Phoenix.Reader.new(:en, "Europe/London"), ~D[2025-04-19])}>
          <:empty>Nothing booked</:empty>
        </Kit.Phoenix.Layouts.Calendar.day>
      </Kit.Phoenix.Layouts.Calendar.days>
    </Kit.Phoenix.Layouts.Calendar.calendar>
  </:body>
</Kit.Phoenix.Layouts.Shell.shell>

<Kit.Phoenix.Layouts.Shell.shell print_identity={@print.identity} print_subject={@print.subject} print_standing={@print.standing} print_tenant={@print.tenant} product="kit" navigation_label="Application" navigation="none" density="desk">
  <:subject>Calendar</:subject>
  <:lede_range days={Kit.Phoenix.Time.day_range(Kit.Phoenix.Reader.at_place(reader(), "America/New_York"), ~D[2025-04-14], ~D[2025-04-20])} />
  <:lede words="4 items" />
  <:actions><a href="../../layout-calendar/#layout-calendar-at-place">{@owner}</a></:actions>
  <:body>
    <Kit.Phoenix.Layouts.Calendar.calendar :let={subject_region} subject_state={Kit.Phoenix.State.none()} range_days={Kit.Phoenix.Time.day_range(Kit.Phoenix.Reader.at_place(reader(), "America/New_York"), ~D[2025-04-14], ~D[2025-04-20])} toolbar_rest={%{"aria-label": "Calendar controls"}} scope_id="kit-calendar-at-place-filters" filters_label="Filters">
      <:today label="Today" />
      <:previous label="Previous week" href="?week=previous" rest={%{rel: "prev"}} />
      <:next label="Next week" href="?week=next" rest={%{rel: "next"}} />
      <:date><Kit.Phoenix.Roles.FormGroup.form_group id="calendar-at-place-date"><:label>Go to a date</:label><:control :let={binding}><Kit.Phoenix.Roles.DateField.date_field binding={binding} reader={reader()} name="date" value={Kit.Phoenix.Roles.DateField.Committed.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-14]))} today={Kit.Phoenix.Time.day(reader(), ~D[2025-04-14])} direction={:either} /></:control></Kit.Phoenix.Roles.FormGroup.form_group></:date>
      <:scope>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-at-place-scope-form-group" kind={Kit.Phoenix.Roles.FormGroup.Kind.select()} control_rest={%{id: "calendar-at-place-scope"}}><:label rest={%{for: "calendar-at-place-scope"}}>Studio</:label><:option value="all">All studios</:option><:option value="riverside">Riverside Studio</:option></Kit.Phoenix.Roles.FormGroup.form_group>
      </:scope>
      <:view>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-at-place-view-form-group"><:label>View</:label><:control_set :let={binding}><Kit.Phoenix.Roles.SegmentedControl.segmented_control binding={binding} name="calendar-at-place-view" value="week"><:option value="week">Week</:option><:option value="day">Day</:option><:option value="month">Month</:option></Kit.Phoenix.Roles.SegmentedControl.segmented_control></:control_set></Kit.Phoenix.Roles.FormGroup.form_group>
      </:view>
      <:actions><Kit.Phoenix.Roles.PrimaryAction.primary_action>New booking</Kit.Phoenix.Roles.PrimaryAction.primary_action></:actions>
      <Kit.Phoenix.Layouts.Calendar.desk_grid subject_region={subject_region} columns={7} time_gutter_rest={%{"aria-label": "Times"}}>
        <:column_head :for={d <- 14..20} column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(Kit.Phoenix.Reader.at_place(reader(), "America/New_York"), Date.new!(2025, 4, d)))} />
        <:hour :for={hour <- (for h <- 8..17, do: Kit.Phoenix.Time.clock(Kit.Phoenix.Reader.at_place(reader(), "America/New_York"), Time.new!(h, 0, 0)))} time={hour} />
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Yoga class" href="../../record/" span={Kit.Phoenix.Time.interval(Kit.Phoenix.Reader.at_place(reader(), "America/New_York"), ~U[2025-04-14 13:00:00Z], ~U[2025-04-14 14:00:00Z])} kind="Booking" aria-label="Yoga class, 09:00–10:00" style="grid-row: 2 / span 1;" />
        </:column>
        <:column></:column>
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Pilates" href="../../record/" span={Kit.Phoenix.Time.interval(Kit.Phoenix.Reader.at_place(reader(), "America/New_York"), ~U[2025-04-16 15:00:00Z], ~U[2025-04-16 16:00:00Z])} kind="Booking" aria-label="Pilates, 11:00–12:00" style="grid-row: 4 / span 1;" />
        </:column>
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Supplier call" href="../../record/" span={Kit.Phoenix.Time.interval(Kit.Phoenix.Reader.at_place(reader(), "America/New_York"), ~U[2025-04-17 14:00:00Z], ~U[2025-04-17 15:00:00Z], "Europe/London")} kind="Call" aria-label="Supplier call, 15:00–16:00 UK Time" style="grid-row: 3 / span 1;" />
        </:column>
        <:column></:column>
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Dance rehearsal" href="../../record/" span={Kit.Phoenix.Time.interval(Kit.Phoenix.Reader.at_place(reader(), "America/New_York"), ~U[2025-04-19 19:00:00Z], ~U[2025-04-19 20:00:00Z])} kind="Booking" aria-label="Dance rehearsal, 15:00–16:00" style="grid-row: 8 / span 1;" />
        </:column>
        <:column></:column>
      </Kit.Phoenix.Layouts.Calendar.desk_grid>
      <Kit.Phoenix.Layouts.Calendar.days subject_region={subject_region}>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(Kit.Phoenix.Reader.at_place(reader(), "America/New_York"), ~D[2025-04-14])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Yoga class" href="../../record/" span={Kit.Phoenix.Time.interval(Kit.Phoenix.Reader.at_place(reader(), "America/New_York"), ~U[2025-04-14 13:00:00Z], ~U[2025-04-14 14:00:00Z])} kind="Booking" />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(Kit.Phoenix.Reader.at_place(reader(), "America/New_York"), ~D[2025-04-15])}>
          <:empty>Nothing booked</:empty>
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(Kit.Phoenix.Reader.at_place(reader(), "America/New_York"), ~D[2025-04-16])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Pilates" href="../../record/" span={Kit.Phoenix.Time.interval(Kit.Phoenix.Reader.at_place(reader(), "America/New_York"), ~U[2025-04-16 15:00:00Z], ~U[2025-04-16 16:00:00Z])} kind="Booking" />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(Kit.Phoenix.Reader.at_place(reader(), "America/New_York"), ~D[2025-04-17])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Supplier call" href="../../record/" span={Kit.Phoenix.Time.interval(Kit.Phoenix.Reader.at_place(reader(), "America/New_York"), ~U[2025-04-17 14:00:00Z], ~U[2025-04-17 15:00:00Z], "Europe/London")} kind="Call" />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(Kit.Phoenix.Reader.at_place(reader(), "America/New_York"), ~D[2025-04-18])}>
          <:empty>Nothing booked</:empty>
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(Kit.Phoenix.Reader.at_place(reader(), "America/New_York"), ~D[2025-04-19])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Dance rehearsal" href="../../record/" span={Kit.Phoenix.Time.interval(Kit.Phoenix.Reader.at_place(reader(), "America/New_York"), ~U[2025-04-19 19:00:00Z], ~U[2025-04-19 20:00:00Z])} kind="Booking" />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(Kit.Phoenix.Reader.at_place(reader(), "America/New_York"), ~D[2025-04-20])}>
          <:empty>Nothing booked</:empty>
        </Kit.Phoenix.Layouts.Calendar.day>
      </Kit.Phoenix.Layouts.Calendar.days>
    </Kit.Phoenix.Layouts.Calendar.calendar>
  </:body>
</Kit.Phoenix.Layouts.Shell.shell>

<Kit.Phoenix.Layouts.Shell.shell print_identity={@print.identity} print_subject={@print.subject} print_standing={@print.standing} print_tenant={@print.tenant} product="kit" navigation_label="Application" navigation="none" density="desk">
  <:subject>Calendar</:subject>
  <:lede_range days={Kit.Phoenix.Time.day_range(reader(), ~D[2025-04-21], ~D[2025-04-25])} />
  <:lede words="2 bookings" />
  <:actions><a href="../../layout-calendar/#layout-calendar-stepping">{@owner}</a></:actions>
  <:body>
    <Kit.Phoenix.Layouts.Calendar.calendar :let={subject_region} subject_state={Kit.Phoenix.State.none()} range_days={Kit.Phoenix.Time.day_range(reader(), ~D[2025-04-21], ~D[2025-04-25])} toolbar_rest={%{"aria-label": "Calendar controls"}} scope_id="kit-calendar-stepping-filters" filters_label="Filters">
      <:today label="Today" />
      <:previous label="Previous week" href="?week=previous" rest={%{rel: "prev"}} />
      <:next label="Next week" href="../stepped/" rest={%{rel: "next"}} />
      <:date><Kit.Phoenix.Roles.FormGroup.form_group id="calendar-stepping-date"><:label>Go to a date</:label><:control :let={binding}><Kit.Phoenix.Roles.DateField.date_field binding={binding} reader={reader()} name="date" value={Kit.Phoenix.Roles.DateField.Committed.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-21]))} today={Kit.Phoenix.Time.day(reader(), ~D[2025-04-14])} direction={:either} /></:control></Kit.Phoenix.Roles.FormGroup.form_group></:date>
      <:scope>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-stepping-scope-form-group" kind={Kit.Phoenix.Roles.FormGroup.Kind.select()} control_rest={%{id: "calendar-stepping-scope"}}><:label rest={%{for: "calendar-stepping-scope"}}>Hall</:label><:option value="all">All halls</:option><:option value="oakmere">Oakmere Hall</:option></Kit.Phoenix.Roles.FormGroup.form_group>
      </:scope>
      <:scope>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-stepping-room-form-group" kind={Kit.Phoenix.Roles.FormGroup.Kind.select()} control_rest={%{id: "calendar-stepping-room"}}><:label rest={%{for: "calendar-stepping-room"}}>Room</:label><:option value="all">All rooms</:option><:option value="main-hall">Main Hall</:option></Kit.Phoenix.Roles.FormGroup.form_group>
      </:scope>
      <:view>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-stepping-view-form-group"><:label>View</:label><:control_set :let={binding}><Kit.Phoenix.Roles.SegmentedControl.segmented_control binding={binding} name="calendar-stepping-view" value="week"><:option value="week">Week</:option><:option value="day">Day</:option><:option value="month">Month</:option></Kit.Phoenix.Roles.SegmentedControl.segmented_control></:control_set></Kit.Phoenix.Roles.FormGroup.form_group>
      </:view>
      <:actions><Kit.Phoenix.Roles.PrimaryAction.primary_action>New booking</Kit.Phoenix.Roles.PrimaryAction.primary_action></:actions>
      <Kit.Phoenix.Layouts.Calendar.desk_grid subject_region={subject_region} columns={5} time_gutter_rest={%{"aria-label": "Times"}}>
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-21]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-22]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-23]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-24]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-25]))} />
        <:hour :for={hour <- ([Kit.Phoenix.Time.clock(reader(), ~T[09:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[10:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[11:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[12:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[13:00:00])])} time={hour} />
        <:column></:column>
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Yoga class" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-22 09:00:00Z], ~U[2025-04-22 10:00:00Z])} kind="Booking" aria-label="Yoga class, 10:00–11:00" style="grid-row: 2 / span 1;" />
        </:column>
        <:column></:column>
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Choir rehearsal" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-24 11:00:00Z], ~U[2025-04-24 12:00:00Z])} kind="Booking" aria-label="Choir rehearsal, 12:00–13:00" style="grid-row: 4 / span 1;" />
        </:column>
        <:column></:column>
      </Kit.Phoenix.Layouts.Calendar.desk_grid>
      <Kit.Phoenix.Layouts.Calendar.days subject_region={subject_region}>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-21])}>
          <:empty>Nothing booked</:empty>
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-22])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Yoga class" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-22 09:00:00Z], ~U[2025-04-22 10:00:00Z])} kind="Booking" />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-23])}>
          <:empty>Nothing booked</:empty>
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-24])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Choir rehearsal" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-24 11:00:00Z], ~U[2025-04-24 12:00:00Z])} kind="Booking" />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-25])}>
          <:empty>Nothing booked</:empty>
        </Kit.Phoenix.Layouts.Calendar.day>
      </Kit.Phoenix.Layouts.Calendar.days>
    </Kit.Phoenix.Layouts.Calendar.calendar>
  </:body>
</Kit.Phoenix.Layouts.Shell.shell>

<Kit.Phoenix.Layouts.Shell.shell print_identity={@print.identity} print_subject={@print.subject} print_standing={@print.standing} print_tenant={@print.tenant} product="kit" navigation_label="Application" navigation="none" density="desk">
  <:subject>Calendar</:subject>
  <:lede_range days={Kit.Phoenix.Time.day_range(reader(), ~D[2025-04-28], ~D[2025-05-02])} />
  <:lede words="2 bookings" />
  <:actions><a href="../../layout-calendar/#layout-calendar-stepped">{@owner}</a></:actions>
  <:body>
    <Kit.Phoenix.Layouts.Calendar.calendar :let={subject_region} subject_state={Kit.Phoenix.State.none()} range_days={Kit.Phoenix.Time.day_range(reader(), ~D[2025-04-28], ~D[2025-05-02])} toolbar_rest={%{"aria-label": "Calendar controls"}} scope_id="kit-calendar-stepped-filters" filters_label="Filters">
      <:today label="Today" />
      <:previous label="Previous week" href="../stepping/" rest={%{rel: "prev"}} />
      <:next label="Next week" href="?week=next" rest={%{rel: "next"}} />
      <:date><Kit.Phoenix.Roles.FormGroup.form_group id="calendar-stepped-date"><:label>Go to a date</:label><:control :let={binding}><Kit.Phoenix.Roles.DateField.date_field binding={binding} reader={reader()} name="date" value={Kit.Phoenix.Roles.DateField.Committed.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-28]))} today={Kit.Phoenix.Time.day(reader(), ~D[2025-04-14])} direction={:either} /></:control></Kit.Phoenix.Roles.FormGroup.form_group></:date>
      <:scope>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-stepped-scope-form-group" kind={Kit.Phoenix.Roles.FormGroup.Kind.select()} control_rest={%{id: "calendar-stepped-scope"}}><:label rest={%{for: "calendar-stepped-scope"}}>Hall</:label><:option value="all">All halls</:option><:option value="oakmere">Oakmere Hall</:option></Kit.Phoenix.Roles.FormGroup.form_group>
      </:scope>
      <:scope>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-stepped-room-form-group" kind={Kit.Phoenix.Roles.FormGroup.Kind.select()} control_rest={%{id: "calendar-stepped-room"}}><:label rest={%{for: "calendar-stepped-room"}}>Room</:label><:option value="all">All rooms</:option><:option value="main-hall">Main Hall</:option></Kit.Phoenix.Roles.FormGroup.form_group>
      </:scope>
      <:view>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-stepped-view-form-group"><:label>View</:label><:control_set :let={binding}><Kit.Phoenix.Roles.SegmentedControl.segmented_control binding={binding} name="calendar-stepped-view" value="week"><:option value="week">Week</:option><:option value="day">Day</:option><:option value="month">Month</:option></Kit.Phoenix.Roles.SegmentedControl.segmented_control></:control_set></Kit.Phoenix.Roles.FormGroup.form_group>
      </:view>
      <:actions><Kit.Phoenix.Roles.PrimaryAction.primary_action>New booking</Kit.Phoenix.Roles.PrimaryAction.primary_action></:actions>
      <Kit.Phoenix.Layouts.Calendar.desk_grid subject_region={subject_region} columns={5} time_gutter_rest={%{"aria-label": "Times"}}>
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-28]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-29]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-30]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-05-01]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-05-02]))} />
        <:hour :for={hour <- ([Kit.Phoenix.Time.clock(reader(), ~T[09:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[10:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[11:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[12:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[13:00:00])])} time={hour} />
        <:column></:column>
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Yoga class" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-29 09:00:00Z], ~U[2025-04-29 10:00:00Z])} kind="Booking" aria-label="Yoga class, 10:00–11:00" style="grid-row: 2 / span 1;" />
        </:column>
        <:column></:column>
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Choir rehearsal" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-05-01 11:00:00Z], ~U[2025-05-01 12:00:00Z])} kind="Booking" aria-label="Choir rehearsal, 12:00–13:00" style="grid-row: 4 / span 1;" />
        </:column>
        <:column></:column>
      </Kit.Phoenix.Layouts.Calendar.desk_grid>
      <Kit.Phoenix.Layouts.Calendar.days subject_region={subject_region}>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-28])}>
          <:empty>Nothing booked</:empty>
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-29])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Yoga class" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-29 09:00:00Z], ~U[2025-04-29 10:00:00Z])} kind="Booking" />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-30])}>
          <:empty>Nothing booked</:empty>
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-05-01])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Choir rehearsal" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-05-01 11:00:00Z], ~U[2025-05-01 12:00:00Z])} kind="Booking" />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-05-02])}>
          <:empty>Nothing booked</:empty>
        </Kit.Phoenix.Layouts.Calendar.day>
      </Kit.Phoenix.Layouts.Calendar.days>
    </Kit.Phoenix.Layouts.Calendar.calendar>
  </:body>
</Kit.Phoenix.Layouts.Shell.shell>

<Kit.Phoenix.Layouts.Shell.shell print_identity={@print.identity} print_subject={@print.subject} print_standing={@print.standing} print_tenant={@print.tenant} product="kit" navigation_label="Application" navigation="none" density="desk">
  <:subject>Calendar</:subject>
  <:lede_range days={Kit.Phoenix.Time.day_range(reader(), ~D[2025-04-14], ~D[2025-04-18])} />
  <:lede words="5 bookings" />
  <:actions><a href="../../layout-calendar/#layout-calendar-saved-behind">{@owner}</a></:actions>
  <:body>
    <Kit.Phoenix.Layouts.Calendar.calendar :let={subject_region} subject_state={Kit.Phoenix.State.none()} range_days={Kit.Phoenix.Time.day_range(reader(), ~D[2025-04-14], ~D[2025-04-18])} toolbar_rest={%{"aria-label": "Calendar controls"}} scope_id="kit-calendar-saved-behind-filters" filters_label="Filters">
      <:today label="Today" />
      <:previous label="Previous week" href="?week=previous" rest={%{rel: "prev"}} />
      <:next label="Next week" href="?week=next" rest={%{rel: "next"}} />
      <:date><Kit.Phoenix.Roles.FormGroup.form_group id="calendar-saved-behind-date"><:label>Go to a date</:label><:control :let={binding}><Kit.Phoenix.Roles.DateField.date_field binding={binding} reader={reader()} name="date" value={Kit.Phoenix.Roles.DateField.Committed.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-14]))} today={Kit.Phoenix.Time.day(reader(), ~D[2025-04-14])} direction={:either} /></:control></Kit.Phoenix.Roles.FormGroup.form_group></:date>
      <:scope>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-saved-behind-scope-form-group" kind={Kit.Phoenix.Roles.FormGroup.Kind.select()} control_rest={%{id: "calendar-saved-behind-scope"}}><:label rest={%{for: "calendar-saved-behind-scope"}}>Hall</:label><:option value="all">All halls</:option><:option value="oakmere">Oakmere Hall</:option></Kit.Phoenix.Roles.FormGroup.form_group>
      </:scope>
      <:scope>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-saved-behind-room-form-group" kind={Kit.Phoenix.Roles.FormGroup.Kind.select()} control_rest={%{id: "calendar-saved-behind-room"}}><:label rest={%{for: "calendar-saved-behind-room"}}>Room</:label><:option value="all">All rooms</:option><:option value="main-hall">Main Hall</:option></Kit.Phoenix.Roles.FormGroup.form_group>
      </:scope>
      <:view>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-saved-behind-view-form-group"><:label>View</:label><:control_set :let={binding}><Kit.Phoenix.Roles.SegmentedControl.segmented_control binding={binding} name="calendar-saved-behind-view" value="week"><:option value="week">Week</:option><:option value="day">Day</:option><:option value="month">Month</:option></Kit.Phoenix.Roles.SegmentedControl.segmented_control></:control_set></Kit.Phoenix.Roles.FormGroup.form_group>
      </:view>
      <:actions><Kit.Phoenix.Roles.PrimaryAction.primary_action>New booking</Kit.Phoenix.Roles.PrimaryAction.primary_action></:actions>
      <Kit.Phoenix.Layouts.Calendar.desk_grid subject_region={subject_region} columns={5} time_gutter_rest={%{"aria-label": "Times"}}>
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-14]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-15]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-16]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-17]))} />
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-18]))} />
        <:band href="../../record/" first={1} last={1} stack={1} standing={Kit.Phoenix.Roles.Row.Standing.failed("The spring fair was not moved: the connection dropped before it saved.", %{})}>Spring fair</:band>
        <:band href="../../record/" first={2} last={2} stack={1} standing={Kit.Phoenix.Roles.Row.Standing.conflict("Maya Patel moved the open day to Tuesday while you were moving it to Wednesday.", "Move it to Wednesday", %{})}>Open day</:band>
        <:band href="../../record/" first={3} last={3} stack={1} standing={Kit.Phoenix.Roles.Row.Standing.processing("Moving the craft market…")}>Craft market</:band>
        <:band href="../../record/" first={4} last={4} stack={1} standing={Kit.Phoenix.Roles.Row.Standing.unsaved("The training day will move when you are back online.")}>Staff training day</:band>
        <:hour :for={hour <- (for hour <- 9..13, do: Kit.Phoenix.Time.clock(reader(), Time.new!(hour, 0, 0)))} time={hour} />
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Board meeting" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 08:00:00Z], ~U[2025-04-14 08:30:00Z])} kind="Meeting" standing={Kit.Phoenix.Roles.Row.Standing.failed("This meeting was not moved: the connection dropped before it saved.", %{})} aria-label="Board meeting, 09:00–09:30, This meeting was not moved" style="grid-row: 1 / span 1; --kit-calendar-block-size: calc(var(--kit-hour-height) / 2);" />
        </:column>
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Yoga class" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-15 10:00:00Z], ~U[2025-04-15 11:00:00Z])} kind="Booking" standing={Kit.Phoenix.Roles.Row.Standing.conflict("Maya Patel moved this booking to 11:00 while you were moving it to 10:00.", "Move it to 10:00", %{})} aria-label="Yoga class, 11:00–12:00, Maya Patel moved this booking" style="grid-row: 3 / span 1;" />
        </:column>
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Choir rehearsal" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-16 09:00:00Z], ~U[2025-04-16 10:30:00Z])} kind="Booking" standing={Kit.Phoenix.Roles.Row.Standing.processing("Moving this booking…")} aria-label="Choir rehearsal, 10:00–11:30, Moving this booking" style="grid-row: 2 / span 2; --kit-calendar-block-size: calc(var(--kit-hour-height) * 1.5);" />
        </:column>
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Toddler group" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-17 08:30:00Z], ~U[2025-04-17 10:00:00Z])} kind="Booking" standing={Kit.Phoenix.Roles.Row.Standing.unsaved("This booking will move when you are back online.")} aria-label="Toddler group, 09:30–11:00, This booking will move when you are back online" style="grid-row: 1 / span 2; --kit-calendar-block-offset: calc(var(--kit-hour-height) / 2); --kit-calendar-block-size: calc(var(--kit-hour-height) * 1.5);" />
        </:column>
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Hall handover" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-18 12:00:00Z], ~U[2025-04-18 13:00:00Z])} kind="Booking" standings={["uncovered"]} standing_words={["Cover needed"]} standing={Kit.Phoenix.Roles.Row.Standing.failed("This booking was not moved: the Main Hall is booked then.", %{})} aria-label="Hall handover, 13:00–14:00, Cover needed, This booking was not moved" style="grid-row: 5 / span 1;" />
        </:column>
      </Kit.Phoenix.Layouts.Calendar.desk_grid>
      <Kit.Phoenix.Layouts.Calendar.days subject_region={subject_region}>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-14])}>
          <Kit.Phoenix.Layouts.Calendar.band_row name="Spring fair" href="../../record/" standing={Kit.Phoenix.Roles.Row.Standing.failed("The spring fair was not moved: the connection dropped before it saved.", %{})} />
          <Kit.Phoenix.Layouts.Calendar.item_row name="Board meeting" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 08:00:00Z], ~U[2025-04-14 08:30:00Z])} kind="Meeting" standing={Kit.Phoenix.Roles.Row.Standing.failed("This meeting was not moved: the connection dropped before it saved.", %{})} />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-15])}>
          <Kit.Phoenix.Layouts.Calendar.band_row name="Open day" href="../../record/" standing={Kit.Phoenix.Roles.Row.Standing.conflict("Maya Patel moved the open day to Tuesday while you were moving it to Wednesday.", "Move it to Wednesday", %{})} />
          <Kit.Phoenix.Layouts.Calendar.item_row name="Yoga class" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-15 10:00:00Z], ~U[2025-04-15 11:00:00Z])} kind="Booking" standing={Kit.Phoenix.Roles.Row.Standing.conflict("Maya Patel moved this booking to 11:00 while you were moving it to 10:00.", "Move it to 10:00", %{})} />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-16])}>
          <Kit.Phoenix.Layouts.Calendar.band_row name="Craft market" href="../../record/" standing={Kit.Phoenix.Roles.Row.Standing.processing("Moving the craft market…")} />
          <Kit.Phoenix.Layouts.Calendar.item_row name="Choir rehearsal" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-16 09:00:00Z], ~U[2025-04-16 10:30:00Z])} kind="Booking" standing={Kit.Phoenix.Roles.Row.Standing.processing("Moving this booking…")} />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-17])}>
          <Kit.Phoenix.Layouts.Calendar.band_row name="Staff training day" href="../../record/" standing={Kit.Phoenix.Roles.Row.Standing.unsaved("The training day will move when you are back online.")} />
          <Kit.Phoenix.Layouts.Calendar.item_row name="Toddler group" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-17 08:30:00Z], ~U[2025-04-17 10:00:00Z])} kind="Booking" standing={Kit.Phoenix.Roles.Row.Standing.unsaved("This booking will move when you are back online.")} />
        </Kit.Phoenix.Layouts.Calendar.day>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-18])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Hall handover" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-18 12:00:00Z], ~U[2025-04-18 13:00:00Z])} kind="Booking" standings={["uncovered"]} standing_words={["Cover needed"]} standing={Kit.Phoenix.Roles.Row.Standing.failed("This booking was not moved: the Main Hall is booked then.", %{})} />
        </Kit.Phoenix.Layouts.Calendar.day>
      </Kit.Phoenix.Layouts.Calendar.days>
    </Kit.Phoenix.Layouts.Calendar.calendar>
  </:body>
</Kit.Phoenix.Layouts.Shell.shell>

<Kit.Phoenix.Layouts.Shell.shell print_identity={@print.identity} print_subject={@print.subject} print_standing={@print.standing} print_tenant={@print.tenant} product="kit" navigation_label="Application" navigation="none" density="desk">
  <:subject>Calendar</:subject>
  <:lede_range days={Kit.Phoenix.Time.day(reader(), ~D[2025-04-14])} />
  <:lede words="2 items" />
  <:actions><a href="../../layout-calendar/#layout-calendar-kinds">{@owner}</a></:actions>
  <:body>
    <Kit.Phoenix.Layouts.Calendar.calendar :let={subject_region} subject_state={Kit.Phoenix.State.none()} range_days={Kit.Phoenix.Time.day(reader(), ~D[2025-04-14])} toolbar_rest={%{"aria-label": "Studio calendar controls"}} scope_id="kit-calendar-kinds-filters" filters_label="Filters">
      <:today label="Today" />
      <:previous label="Previous day" href="?day=previous" rest={%{rel: "prev"}} />
      <:next label="Next day" href="?day=next" rest={%{rel: "next"}} />
      <:date><Kit.Phoenix.Roles.FormGroup.form_group id="calendar-kinds-date"><:label>Go to a date</:label><:control :let={binding}><Kit.Phoenix.Roles.DateField.date_field binding={binding} reader={reader()} name="date" value={Kit.Phoenix.Roles.DateField.Committed.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-14]))} today={Kit.Phoenix.Time.day(reader(), ~D[2025-04-14])} direction={:either} /></:control></Kit.Phoenix.Roles.FormGroup.form_group></:date>
      <:scope>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-kinds-scope-form-group" kind={Kit.Phoenix.Roles.FormGroup.Kind.select()} control_rest={%{id: "calendar-kinds-scope"}}><:label rest={%{for: "calendar-kinds-scope"}}>Studio</:label><:option value="one">Studio one</:option></Kit.Phoenix.Roles.FormGroup.form_group>
      </:scope>
      <:scope>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-kinds-kind-form-group" kind={Kit.Phoenix.Roles.FormGroup.Kind.select()} control_rest={%{id: "calendar-kinds-kind"}}><:label rest={%{for: "calendar-kinds-kind"}}>Kind</:label><:option value="all">All kinds</:option><:option value="class">Classes</:option><:option value="private-lesson">Private lessons</:option><:option value="rental">Rentals</:option></Kit.Phoenix.Roles.FormGroup.form_group>
      </:scope>
      <:view>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-kinds-view-form-group"><:label>View</:label><:control_set :let={binding}><Kit.Phoenix.Roles.SegmentedControl.segmented_control binding={binding} name="calendar-kinds-view" value="day"><:option value="day">Day</:option><:option value="week">Week</:option><:option value="month">Month</:option></Kit.Phoenix.Roles.SegmentedControl.segmented_control></:control_set></Kit.Phoenix.Roles.FormGroup.form_group>
      </:view>
      <:actions action="primary-action" id="calendar-kinds-new" label="Other kinds" variants={[Kit.Phoenix.Menu.group([Kit.Phoenix.Menu.item("New private lesson"), Kit.Phoenix.Menu.item("New rental")])]}>New class</:actions>
      <Kit.Phoenix.Layouts.Calendar.desk_grid subject_region={subject_region} columns={1} time_gutter_rest={%{"aria-label": "Times"}}>
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-14]))} />
        <:hour :for={hour <- ([Kit.Phoenix.Time.clock(reader(), ~T[09:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[10:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[11:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[12:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[13:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[14:00:00])])} time={hour} />
        <:current_time rest={%{style: "--kit-calendar-now-offset: calc(3.5 * var(--kit-hour-height));"}} />
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Beginners ballet" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 08:00:00Z], ~U[2025-04-14 10:00:00Z])} kind="Class" aria-label="Beginners ballet, 09:00–11:00" style="grid-row: 1 / span 2;" />
          <Kit.Phoenix.Layouts.Calendar.block name="Studio hire" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 12:00:00Z], ~U[2025-04-14 14:00:00Z])} kind="Rental" aria-label="Studio hire, 13:00–15:00" style="grid-row: 5 / span 2;" />
        </:column>
      </Kit.Phoenix.Layouts.Calendar.desk_grid>
      <Kit.Phoenix.Layouts.Calendar.days subject_region={subject_region}>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-14])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Beginners ballet" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 08:00:00Z], ~U[2025-04-14 10:00:00Z])} kind="Class" />
          <Kit.Phoenix.Layouts.Calendar.item_row name="Studio hire" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 12:00:00Z], ~U[2025-04-14 14:00:00Z])} kind="Rental" />
        </Kit.Phoenix.Layouts.Calendar.day>
      </Kit.Phoenix.Layouts.Calendar.days>
    </Kit.Phoenix.Layouts.Calendar.calendar>
  </:body>
</Kit.Phoenix.Layouts.Shell.shell>

<Kit.Phoenix.Layouts.Shell.shell print_identity={@print.identity} print_subject={@print.subject} print_standing={@print.standing} print_tenant={@print.tenant} product="kit" navigation_label="Application" navigation="none" density="desk">
  <:subject>Calendar</:subject>
  <:lede_range days={Kit.Phoenix.Time.day(reader(), ~D[2025-04-14])} />
  <:lede words="2 items" />
  <:actions><a href="../../layout-calendar/#layout-calendar-kinds-inert">{@owner}</a></:actions>
  <:body>
    <Kit.Phoenix.Layouts.Calendar.calendar :let={subject_region} subject_state={Kit.Phoenix.State.none()} range_days={Kit.Phoenix.Time.day(reader(), ~D[2025-04-14])} toolbar_rest={%{"aria-label": "Studio calendar controls"}} scope_id="kit-calendar-kinds-inert-filters" filters_label="Filters" filters_control_state={Kit.Phoenix.ActionState.inert("calendar-kinds-inert-filters-control", "Filters wait until the studios are set.")}>
      <:today label="Today" state={Kit.Phoenix.ActionState.inert("calendar-kinds-inert-today", "Today is outside this term.")} />
      <:previous label="Previous day" href="?day=previous" inert rest={%{rel: "prev"}} />
      <:next label="Next day" href="?day=next" inert rest={%{rel: "next"}} />
      <:date><Kit.Phoenix.Roles.FormGroup.form_group id="calendar-kinds-inert-date"><:label>Go to a date</:label><:control :let={binding}><Kit.Phoenix.Roles.DateField.date_field binding={binding} reader={reader()} name="date" value={Kit.Phoenix.Roles.DateField.Committed.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-14]))} today={Kit.Phoenix.Time.day(reader(), ~D[2025-04-14])} direction={:either} /></:control></Kit.Phoenix.Roles.FormGroup.form_group></:date>
      <:scope>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-kinds-inert-scope-form-group" kind={Kit.Phoenix.Roles.FormGroup.Kind.select()} control_rest={%{id: "calendar-kinds-inert-scope"}}><:label rest={%{for: "calendar-kinds-inert-scope"}}>Studio</:label><:option value="one">Studio one</:option></Kit.Phoenix.Roles.FormGroup.form_group>
      </:scope>
      <:scope>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-kinds-inert-kind-form-group" kind={Kit.Phoenix.Roles.FormGroup.Kind.select()} control_rest={%{id: "calendar-kinds-inert-kind"}}><:label rest={%{for: "calendar-kinds-inert-kind"}}>Kind</:label><:option value="all">All kinds</:option><:option value="class">Classes</:option><:option value="private-lesson">Private lessons</:option><:option value="rental">Rentals</:option></Kit.Phoenix.Roles.FormGroup.form_group>
      </:scope>
      <:view>
        <Kit.Phoenix.Roles.FormGroup.form_group id="calendar-kinds-inert-view-form-group"><:label>View</:label><:control_set :let={binding}><Kit.Phoenix.Roles.SegmentedControl.segmented_control binding={binding} name="calendar-kinds-inert-view" value="day"><:option value="day">Day</:option><:option value="week">Week</:option><:option value="month">Month</:option></Kit.Phoenix.Roles.SegmentedControl.segmented_control></:control_set></Kit.Phoenix.Roles.FormGroup.form_group>
      </:view>
      <:actions action="primary-action" id="calendar-kinds-inert-new" label="Other kinds" variants={[Kit.Phoenix.Menu.group([Kit.Phoenix.Menu.item("New private lesson"), Kit.Phoenix.Menu.item("New rental")])]} action_state={Kit.Phoenix.ActionState.inert("calendar-kinds-inert-new-main", "Adding waits until this term's rooms are set.")}>New class</:actions>
      <Kit.Phoenix.Layouts.Calendar.desk_grid subject_region={subject_region} columns={1} time_gutter_rest={%{"aria-label": "Times"}}>
        <:column_head column={Kit.Phoenix.Layouts.Calendar.Column.day(Kit.Phoenix.Time.day(reader(), ~D[2025-04-14]))} />
        <:hour :for={hour <- ([Kit.Phoenix.Time.clock(reader(), ~T[09:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[10:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[11:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[12:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[13:00:00]), Kit.Phoenix.Time.clock(reader(), ~T[14:00:00])])} time={hour} />
        <:current_time rest={%{style: "--kit-calendar-now-offset: calc(3.5 * var(--kit-hour-height));"}} />
        <:column>
          <Kit.Phoenix.Layouts.Calendar.block name="Beginners ballet" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 08:00:00Z], ~U[2025-04-14 10:00:00Z])} kind="Class" aria-label="Beginners ballet, 09:00–11:00" style="grid-row: 1 / span 2;" />
          <Kit.Phoenix.Layouts.Calendar.block name="Studio hire" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 12:00:00Z], ~U[2025-04-14 14:00:00Z])} kind="Rental" aria-label="Studio hire, 13:00–15:00" style="grid-row: 5 / span 2;" />
        </:column>
      </Kit.Phoenix.Layouts.Calendar.desk_grid>
      <Kit.Phoenix.Layouts.Calendar.days subject_region={subject_region}>
        <Kit.Phoenix.Layouts.Calendar.day day={Kit.Phoenix.Time.day(reader(), ~D[2025-04-14])}>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Beginners ballet" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 08:00:00Z], ~U[2025-04-14 10:00:00Z])} kind="Class"><:actions action="subtle-action" action_state={Kit.Phoenix.ActionState.inert("calendar-kinds-inert-open", "Open this class once you are back online.")}>Open this class</:actions></Kit.Phoenix.Layouts.Calendar.item_row>
          <Kit.Phoenix.Layouts.Calendar.item_row name="Studio hire" href="../../record/" span={Kit.Phoenix.Time.interval(reader(), ~U[2025-04-14 12:00:00Z], ~U[2025-04-14 14:00:00Z])} kind="Rental" standing={Kit.Phoenix.Roles.Row.Standing.failed("This rental was not reinstated: the connection dropped before it saved.", %{}, Kit.Phoenix.ActionState.inert("calendar-kinds-inert-try-again", "Try again once you are back online."))} />
        </Kit.Phoenix.Layouts.Calendar.day>
      </Kit.Phoenix.Layouts.Calendar.days>
    </Kit.Phoenix.Layouts.Calendar.calendar>
  </:body>
</Kit.Phoenix.Layouts.Shell.shell>