houseaccount 0.10.1

package/app/javascript/houseaccount/scheme_controller.js

@@ -0,0 +1,99 @@
+import { Controller } from '@hotwired/stimulus'
+
+// The sidebar's one control over how a page looks. A click moves it to another palette
+// and into the mode it is not in, which is what the icon promises: a moon while the page
+// is light, a sun while it is dark. The choice belongs to the reader rather than to the
+// app, so it is kept in their browser — the layout's own script is what puts it back
+// before the first paint, a controller connecting far too late for that.
+export default class extends Controller {
+  static values = { themes: Array, path: String, storage: String }
+
+  // Turbo merges the head on a visit, which puts the palette the server chose back over
+  // the one the reader picked, and the layout's script runs only on a full load. The
+  // sidebar is drawn again on every visit, so connecting is the moment to say it again.
+  connect() {
+    const stored = this.#stored()
+
+    if (stored) { this.#apply(stored.theme, stored.mode) }
+  }
+
+  // Another palette, in the other mode. Random rather than in order: the eight have no
+  // order that means anything. Excluding the one showing is what stops a click looking
+  // like it did nothing, which is the whole risk of picking at random.
+  rotate() {
+    const mode = this.#mode() === 'dark' ? 'light' : 'dark'
+    const others = this.themesValue.filter((theme) => theme !== this.#theme())
+    const theme = others[Math.floor(Math.random() * others.length)]
+
+    this.#apply(theme, mode)
+    localStorage.setItem(this.storageValue, JSON.stringify({ theme, mode }))
+  }
+
+  // The mode onto the element every `light-dark()` on the page is resolved against, and
+  // the palette onto the one link that serves one. A name is checked against the list
+  // the server sent: the storage is the reader's own, but what comes back out of it is
+  // still not something to put in a URL unread.
+  #apply(theme, mode) {
+    if (mode === 'light' || mode === 'dark') {
+      document.documentElement.dataset.bsTheme = mode
+    }
+    if (!this.themesValue.includes(theme)) { return }
+
+    this.#link().href = `${this.pathValue}/${theme}.css`
+  }
+
+  // What the reader picked last, or nothing at all where they never have.
+  #stored() {
+    try {
+      return JSON.parse(localStorage.getItem(this.storageValue))
+    } catch (error) {
+      return null
+    }
+  }
+
+  // Which mode the page is in: whatever has been forced onto it, and otherwise whatever
+  // the system asks for, since a page nobody has chosen for follows that.
+  #mode() {
+    return document.documentElement.dataset.bsTheme ||
+      (matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light')
+  }
+
+  // Which palette is showing, read off the link rather than remembered, so a reader who
+  // cleared their storage still moves on from the one in front of them.
+  #theme() {
+    const link = this.#current()
+
+    return link ? link.href.split('/').pop().replace('.css', '') : null
+  }
+
+  // The palette the page is drawn in, which is the *last* of these links rather than the
+  // first. Turbo's head merge appends a stylesheet the new head has and the old one does
+  // not — it never replaces one — and the server names the same palette on every page,
+  // so a visit made after the reader chose leaves two links and the browser obeys the
+  // one at the end. Writing to the other would change nothing anybody can see.
+  #current() {
+    const links = document.querySelectorAll('link[data-recourse-theme]')
+
+    return links[links.length - 1]
+  }
+
+  // The one link a palette is served through: whichever is in force, with any the merge
+  // left behind it taken away, and a new one where a host named no palette at all and
+  // there is none in the head to find.
+  #link() {
+    const links = [...document.querySelectorAll('link[data-recourse-theme]')]
+    const link = links.pop() || this.#appended()
+    links.forEach((stale) => stale.remove())
+
+    return link
+  }
+
+  #appended() {
+    const link = document.createElement('link')
+    link.rel = 'stylesheet'
+    link.dataset.recourseTheme = ''
+    document.head.appendChild(link)
+
+    return link
+  }
+}

package/app/javascript/houseaccount/search_controller.js

@@ -0,0 +1,78 @@
+import { Controller } from '@hotwired/stimulus'
+
+// Survives the visit that a submit starts, since the module is not reloaded with
+// the page: it is how the next controller knows the search box was being typed in.
+// Only a submit that replaces the whole page needs it — a frame leaves the form,
+// and the caret in it, exactly where they were.
+let typing = false
+
+export default class extends Controller {
+  static targets = ['field']
+
+  connect() {
+    // Not on a cached preview: the real render connects a second time, and it is
+    // the one whose field can still be typed into.
+    if (typing && !document.documentElement.hasAttribute('data-turbo-preview')) {
+      typing = false
+      this.#restore()
+    }
+
+    // A pick in a combobox is written to its select and said as the select's own
+    // `change`, which bubbles, so one listener on the form hears every menu in it and
+    // each tick or untick narrows the table straight away. Coalesced to the end of the
+    // turn, because emptying a filter unticks every option in it — one request for the
+    // table that leaves, not one per option.
+    this.picked = () => {
+      clearTimeout(this.pick)
+      this.pick = setTimeout(() => this.#submit(), 0)
+    }
+    this.element.addEventListener('change', this.picked)
+
+    // The frame is not inside the form, so its events never reach it.
+    this.reloaded = () => { typing = false; this.#syncSort() }
+    document.addEventListener('turbo:frame-load', this.reloaded)
+
+    // A refresh morph would write the fetched page's older query over what is
+    // mid-typing, so the form's subtree sits a morph out — the text, the caret
+    // and any open filter menu stay. Only a morph: a page visit still renders
+    // every page's own form, which `turbo-permanent` here would carry across.
+    this.morphing = (event) => { if (this.element.contains(event.target)) event.preventDefault() }
+    document.addEventListener('turbo:before-morph-element', this.morphing)
+  }
+
+  disconnect() {
+    this.element.removeEventListener('change', this.picked)
+    document.removeEventListener('turbo:frame-load', this.reloaded)
+    document.removeEventListener('turbo:before-morph-element', this.morphing)
+    clearTimeout(this.timer)
+    clearTimeout(this.pick)
+  }
+
+  submit() {
+    clearTimeout(this.timer)
+    this.timer = setTimeout(() => { typing = true; this.#submit() }, 300)
+  }
+
+  #submit() {
+    this.element.requestSubmit()
+  }
+
+  // A heading sorts by navigating the frame, which advances the address bar but
+  // leaves this form alone — so the sort it carries has to be read back off the URL,
+  // or the next search would reorder the table by whatever was in force before.
+  #syncSort() {
+    const field = this.element.querySelector('input[name="q[s]"]')
+
+    if (field) { field.value = new URL(window.location.href).searchParams.get('q[s]') || '' }
+  }
+
+  // The value comes back from the server, so only the caret has to be put back,
+  // and at the end of it — typing carries on where it left off.
+  #restore() {
+    if (!this.hasFieldTarget) { return }
+
+    const field = this.fieldTarget
+    field.focus({ preventScroll: true })
+    field.setSelectionRange(field.value.length, field.value.length)
+  }
+}

package/app/javascript/houseaccount/shortcuts_controller.js

@@ -0,0 +1,42 @@
+import { Controller } from '@hotwired/stimulus'
+
+// Option is the modifier. Control and Command are spoken for — Control+C and
+// Command+C are both copy — while Option is what a browser's own accesskey reaches
+// for on most platforms, and it collides with almost nothing a page would want.
+export default class extends Controller {
+  connect() {
+    this.reveal = (event) => this.element.classList.toggle('recourse-keys', event.altKey)
+    this.hide = () => this.element.classList.remove('recourse-keys')
+    this.press = (event) => this.#press(event)
+
+    document.addEventListener('keydown', this.reveal)
+    document.addEventListener('keyup', this.reveal)
+    document.addEventListener('keydown', this.press)
+    // Holding Option and switching windows would otherwise leave the hints up.
+    window.addEventListener('blur', this.hide)
+  }
+
+  disconnect() {
+    document.removeEventListener('keydown', this.reveal)
+    document.removeEventListener('keyup', this.reveal)
+    document.removeEventListener('keydown', this.press)
+    window.removeEventListener('blur', this.hide)
+  }
+
+  #press(event) {
+    if (!event.altKey || event.ctrlKey || event.metaKey) { return }
+
+    // On a Mac, Option+c is 'ç', so the key pressed is read from the keyboard's own
+    // layout-independent code rather than from the character it produced.
+    const pressed = event.code.match(/^Key([A-Z])$/)
+    if (!pressed) { return }
+
+    const link = this.element.querySelector(`[data-key="${pressed[1].toLowerCase()}"]`)
+    if (!link) { return }
+
+    event.preventDefault()
+    this.hide()
+    // Clicked rather than assigned to, so Turbo takes the visit like any other link.
+    link.click()
+  }
+}

package/app/javascript/houseaccount/thread_controller.js

@@ -0,0 +1,40 @@
+import { Controller } from '@hotwired/stimulus'
+
+// A thread opens at its newest message with the field ready, and stays at the newest as
+// answers arrive. Every render undoes both -- `autofocus` included, which is why sending a
+// question landed back here with nothing focused -- so it is said again on each one rather
+// than only when Stimulus connects, which a morphed-in answer never triggers.
+export default class extends Controller {
+  static targets = ['messages', 'field']
+
+  connect() {
+    this.following = true
+    this.follow = () => { this.following = this.#atBottom() }
+    this.settle = () => requestAnimationFrame(() => this.#settle())
+
+    if (this.hasMessagesTarget) { this.messagesTarget.addEventListener('scroll', this.follow) }
+    document.addEventListener('turbo:render', this.settle)
+    this.settle()
+  }
+
+  disconnect() {
+    if (this.hasMessagesTarget) { this.messagesTarget.removeEventListener('scroll', this.follow) }
+    document.removeEventListener('turbo:render', this.settle)
+  }
+
+  // Left where the reader put it once they have scrolled up to read back: an answer landing is
+  // no reason to pull the thread out from under them. The field takes focus without the page
+  // scrolling to it: a chat below the fold, the showcase's say, must not drag the page down
+  // on load, and a chat page is sized to the window, so there the field is in view already.
+  #settle() {
+    if (this.hasFieldTarget) { this.fieldTarget.focus({ preventScroll: true }) }
+    if (this.hasMessagesTarget && this.following) {
+      this.messagesTarget.scrollTop = this.messagesTarget.scrollHeight
+    }
+  }
+
+  #atBottom() {
+    const { scrollTop, scrollHeight, clientHeight } = this.messagesTarget
+    return scrollHeight - scrollTop - clientHeight < 24
+  }
+}

package/app/javascript/houseaccount/timezone_controller.js

@@ -0,0 +1,27 @@
+import { Controller } from '@hotwired/stimulus'
+
+// The reader's own zone, told to the server so it can draw their pages against their
+// clock. A cookie rather than local storage, for the reason the page size uses one:
+// the server does the converting, and a cookie is the only storage the server is sent.
+export default class extends Controller {
+  static values = { storage: String }
+
+  // The page in front of the reader was drawn before this cookie existed, so the first
+  // visit from a browser — and the first after they travel — is drawn against the
+  // host's zone and then asked for again. Only when the cookie disagrees, so every
+  // other visit costs nothing: this writes what is already there and stops.
+  connect() {
+    const zone = Intl.DateTimeFormat().resolvedOptions().timeZone
+    if (!zone || zone === this.#stored()) { return }
+
+    document.cookie =
+      `${this.storageValue}=${encodeURIComponent(zone)}; path=/; max-age=31536000; samesite=lax`
+    window.Turbo.visit(window.location.href, { action: 'replace' })
+  }
+
+  #stored() {
+    const row = document.cookie.split(/;\s*/).find((one) => one.startsWith(`${this.storageValue}=`))
+
+    return row ? decodeURIComponent(row.split('=')[1]) : null
+  }
+}

package/app/javascript/houseaccount/toast_controller.js

@@ -0,0 +1,35 @@
+import { Controller } from '@hotwired/stimulus'
+import { Toast } from 'bootstrap'
+import { DELAY } from './written.js'
+
+// The toast arrives from the server already shown, so Bootstrap's show() must never
+// run: it re-adds `showing` and blinks the toast through transparent. But show() is
+// also the only place Bootstrap arms its autohide, so the timer lives here instead,
+// and only the hiding is Bootstrap's — the timed hide and the dismiss X then share
+// one code path and one fade.
+export default class extends Controller {
+  static values = { delay: { type: Number, default: DELAY } }
+
+  connect() {
+    // `autohide: false` keeps Bootstrap from arming a rival timer if anything ever
+    // does call show() on this element.
+    this.toast = Toast.getOrCreateInstance(this.element, { autohide: false })
+    this.startTimer()
+  }
+
+  disconnect() {
+    this.stopTimer()
+    this.toast.dispose()
+  }
+
+  // Reading the message, or aiming for the X, holds the toast open — Bootstrap's
+  // own pause-on-hover only guards the timer *it* armed, so it is redone here.
+  stopTimer() {
+    clearTimeout(this.timeout)
+  }
+
+  // A fresh full delay on leave, which is also what Bootstrap re-arms.
+  startTimer() {
+    this.timeout = setTimeout(() => this.toast.hide(), this.delayValue)
+  }
+}

package/app/javascript/houseaccount/tooltip_controller.js

@@ -0,0 +1,23 @@
+import { Controller } from '@hotwired/stimulus'
+import { Tooltip } from 'bootstrap'
+
+// The tooltip naming an icon-only heading. Bootstrap never wires one on its own,
+// and a Stimulus lifecycle is what survives Turbo redrawing the table: connect
+// makes it, disconnect takes it down before the element goes, so a sorted or
+// searched table never strands one over an element that left.
+//
+// None where nothing can hover: on a touch screen the tap that would open a link
+// is also what shows a tooltip, and a word popping up over a tap reads as a hitch.
+// Asked two ways, since an iPhone answered the first with a tooltip all the same: a
+// screen that cannot hover, or a pointer too coarse to rest on one word of a row.
+export default class extends Controller {
+  connect() {
+    if (matchMedia('(hover: none), (pointer: coarse)').matches) return
+
+    this.tooltip = Tooltip.getOrCreateInstance(this.element)
+  }
+
+  disconnect() {
+    this.tooltip?.dispose()
+  }
+}

package/app/javascript/houseaccount/wall/marks.js

@@ -0,0 +1,8 @@
+// What the wall is made of: the marks it deals out, the house's own among the trades, the
+// rate each column drifts at and how many marks fall down one.
+export const marks = ['roller', 'ladder', 'frame', 'plunger', 'can', 'hardhat', 'spray',
+                      'lock', 'plug', 'broom', 'nut', 'level', 'cube']
+// One rate per column, each a fraction of the base, so the wall reads as depth.
+export const rates = [0.94, 1.02, 0.86, 1.06, 0.82, 0.98, 0.9]
+// Five marks down a column, drawn twice, so half a column's height lands on identical art.
+export const rows = 5

package/app/javascript/houseaccount/wall/tools.json

@@ -0,0 +1,75 @@
+{
+  "roller": [
+    "M152 132 L360 132 L360 216 L152 216 Z",
+    "M256 216 L256 300",
+    "M212 300 L300 300 L300 456 L212 456 Z"
+  ],
+  "ladder": [
+    "M160 40 L160 472",
+    "M352 40 L352 472",
+    "M160 128 L352 128",
+    "M160 216 L352 216",
+    "M160 304 L352 304",
+    "M160 392 L352 392"
+  ],
+  "frame": [
+    "M176 144 L256 72 L336 144",
+    "M96 144 L416 144 L416 432 L96 432 Z",
+    "M148 196 L364 196 L364 380 L148 380 Z",
+    "M176 344 L240 280 L288 328 L340 276"
+  ],
+  "plunger": [
+    "M256 52 L256 300",
+    "M164 300 L348 300 L312 424 L200 424 Z"
+  ],
+  "can": [
+    "M144 228 L328 228 L328 432 L144 432 Z",
+    "M188 228 L188 164 L284 164 L284 228",
+    "M328 300 L400 300 L400 228 L456 228",
+    "M456 200 L456 256"
+  ],
+  "hardhat": [
+    "M76 336 L436 336",
+    "M116 336 Q116 146 256 146 Q396 146 396 336",
+    "M256 166 L256 266"
+  ],
+  "spray": [
+    "M176 240 L336 240 L336 456 L176 456 Z",
+    "M256 240 L256 200",
+    "M136 128 L308 128 L308 200 L204 200 L204 160 L136 160 Z",
+    "M176 312 L336 312",
+    "M176 384 L336 384"
+  ],
+  "lock": [
+    "M128 248 L384 248 L384 440 L128 440 Z",
+    "M184 248 L184 152 L328 152 L328 248",
+    "M256 308 L256 372"
+  ],
+  "plug": [
+    "M148 216 L364 216 L364 396 L148 396 Z",
+    "M200 216 L200 120",
+    "M312 216 L312 120",
+    "M256 396 L256 464"
+  ],
+  "broom": [
+    "M256 48 L256 268",
+    "M168 268 L344 268 L380 452 L132 452 Z",
+    "M212 268 L196 452",
+    "M300 268 L316 452"
+  ],
+  "nut": [
+    "M256 108 L372 176 L372 312 L256 380 L140 312 L140 176 Z",
+    "M256 184 L308 214 L308 274 L256 304 L204 274 L204 214 Z"
+  ],
+  "level": [
+    "M56 208 L456 208 L456 304 L56 304 Z",
+    "M196 232 L316 232 L316 280 L196 280 Z",
+    "M256 232 L256 280"
+  ],
+  "cube": [
+    "M216.2 59.6 Q256 36.6 295.8 59.6 L406.2 123.3 Q446 146.3 446 192.3 L446 319.7 Q446 365.7 406.2 388.7 L295.8 452.4 Q256 475.4 216.2 452.4 L105.8 388.7 Q66 365.7 66 319.7 L66 192.3 Q66 146.3 105.8 123.3 Z",
+    "M256 256 L95.4 163.3",
+    "M256 256 L416.6 163.3",
+    "M256 256 L256 441.4"
+  ]
+}

package/app/javascript/houseaccount/wall_controller.js

@@ -0,0 +1,93 @@
+import { Controller } from '@hotwired/stimulus'
+// The geometry of every mark on the wall, as data: one stroke each on a 512 grid, nothing
+// filled, and nothing about how it is drawn — fill, stroke and caps are the stylesheet's.
+import tools from './wall/tools.json'
+// The trades the columns deal out, the marks among them, and how the columns drift.
+import { marks, rates, rows } from './wall/marks.js'
+
+// The wall behind a page of the signup flow: a cyanotype of the trades a homeowner books,
+// drifting up in columns, with the family's own marks drifting past among them. One
+// attribute on the shell draws it — `data-controller='wall'` — and the stylesheet paints
+// the ground from that attribute at once, so the columns arrive on blue rather than on
+// white. Built here rather than shipped in the page: seventy marks are a lot of markup to
+// send, and the drawing belongs to the house, not to the page that wears it.
+export default class extends Controller {
+  // Drawn again after a morph: a page Turbo refreshes in place is told what the server sent,
+  // and the server sends no wall, so idiomorph takes down what was built here while the
+  // controller itself stays connected and never hears of it.
+  connect() {
+    this.draw = () => this.#draw()
+    document.addEventListener('turbo:morph', this.draw)
+    this.#draw()
+  }
+
+  disconnect() { document.removeEventListener('turbo:morph', this.draw) }
+
+  #draw() {
+    if (this.element.querySelector(':scope > .tools')) { return }
+
+    this.element.prepend(this.#wall())
+  }
+
+  #wall() {
+    const wall = this.#element('div', 'tools')
+    wall.setAttribute('aria-hidden', 'true')
+    wall.append(this.#element('div', 'tools-grid'), this.#columns())
+
+    return wall
+  }
+
+  #columns() {
+    const columns = this.#element('div', 'tools-cols')
+    rates.forEach((rate, column) => columns.append(this.#column(rate, column)))
+
+    return columns
+  }
+
+  #column(rate, column) {
+    const element = this.#element('div', 'tools-col')
+    element.style.setProperty('--col-rate', rate)
+    for (let slot = 0; slot < rows * 2; slot++) { element.append(this.#mark(column, slot)) }
+
+    return element
+  }
+
+  // Alternate columns are half-dropped, or the marks band into rows, and mirrored, so the
+  // same thirteen drawings read as more than thirteen.
+  #mark(column, slot) {
+    const row = slot % rows
+    const drop = column % 2 ? 0.5 / rows : 0
+    const top = (((row + 0.5) / rows + drop) % 1) * 50 + Math.floor(slot / rows) * 50
+    const name = marks[(column * 5 + row * 3) % marks.length]
+    const svg = this.#drawing(name, (column + row) % 2 ? 'tool tool-alt' : 'tool')
+    svg.style.top = `${top.toFixed(3)}%`
+    if (column % 2) { svg.style.scale = '-1 1' }
+
+    return svg
+  }
+
+  #drawing(name, classes) {
+    const svg = document.createElementNS('http://www.w3.org/2000/svg', 'svg')
+    svg.setAttribute('viewBox', '0 0 512 512')
+    svg.setAttribute('class', classes)
+    tools[name].forEach((shape) => svg.append(this.#shape(shape)))
+
+    return svg
+  }
+
+  #shape(shape) {
+    const circle = typeof shape === 'object'
+    const element = document.createElementNS('http://www.w3.org/2000/svg', circle ? 'circle' : 'path')
+    if (circle) { Object.entries(shape).forEach(([key, value]) => element.setAttribute(key, value)) }
+    else { element.setAttribute('d', shape) }
+
+    return element
+  }
+
+  #element(tag, classes) {
+    const element = document.createElement(tag)
+    element.className = classes
+
+    return element
+  }
+}

package/app/javascript/houseaccount/written.js

@@ -0,0 +1,20 @@
+// The mark a create or an update leaves on the row it landed on, and how long the toast
+// saying so stands — the one clock, which the toast controller reads too.
+export const DELAY = 2000
+
+// Marked, and handed back the way to let it go. Letting go swaps one class for the
+// other rather than adding to it: the fade is an animation, and while the first class
+// is still on the row it would paint the tint straight back the moment that animation
+// ended. Off the row entirely, what paints it afterwards is whatever else the cascade
+// says — the tint of a kept row, or nothing.
+export function mark(row) {
+  if (!row) { return () => {} }
+
+  row.classList.remove('recourse-written-out')
+  row.classList.add('recourse-written')
+
+  return () => {
+    row.classList.remove('recourse-written')
+    row.classList.add('recourse-written-out')
+  }
+}

package/app/javascript/houseaccount/written_controller.js

@@ -0,0 +1,28 @@
+import { Controller } from '@hotwired/stimulus'
+import { mark } from './written.js'
+
+// The row a create or an update just landed on, marked for exactly as long as the
+// toast that says so. One clock rather than two: the mark goes when the message goes,
+// however long somebody held the toast open by reading it.
+//
+// `hide`, never `hidden`. Bootstrap fires the first as the toast begins to fade and the
+// second only once it has finished, a whole second later — which is a mark still lit
+// over a message that has already gone.
+export default class extends Controller {
+  static values = { row: String }
+
+  // Only where the row is on this page — a record can be written onto a page it does
+  // not appear on, sorted or filtered or paged away — and only where a toast is here
+  // to end it, since nothing else would.
+  connect() {
+    const row = document.getElementById(this.rowValue)
+    if (!row || !this.element.querySelector('.toast')) { return }
+
+    this.fade = mark(row)
+    this.element.addEventListener('hide.bs.toast', this.fade)
+  }
+
+  disconnect() {
+    if (this.fade) { this.element.removeEventListener('hide.bs.toast', this.fade) }
+  }
+}

package/app/javascript/houseaccount.js

@@ -0,0 +1,60 @@
+// Everything a HouseAccount page runs, in one module: Turbo with the cable element
+// turbo-rails signs its streams for, Bootstrap 6, and a Stimulus application with every
+// controller the house's markup names. Built by esbuild into /js/houseaccount.js.
+import '@hotwired/turbo-rails'
+import 'bootstrap'
+import { Application } from '@hotwired/stimulus'
+import confirm from './houseaccount/confirm.js'
+import BookmarkController from './houseaccount/bookmark_controller.js'
+import ClearController from './houseaccount/clear_controller.js'
+import ComboboxController from './houseaccount/combobox_controller.js'
+import DensityController from './houseaccount/density_controller.js'
+import DeselectController from './houseaccount/deselect_controller.js'
+import LimitController from './houseaccount/limit_controller.js'
+import MapController from './houseaccount/map_controller.js'
+import OtpController from './houseaccount/otp_controller.js'
+import PhoneController from './houseaccount/phone_controller.js'
+import PlaceholderController from './houseaccount/placeholder_controller.js'
+import RelativeTimeController from './houseaccount/relative_time_controller.js'
+import RequireController from './houseaccount/require_controller.js'
+import RevealController from './houseaccount/reveal_controller.js'
+import SchemeController from './houseaccount/scheme_controller.js'
+import SearchController from './houseaccount/search_controller.js'
+import ShortcutsController from './houseaccount/shortcuts_controller.js'
+import ThreadController from './houseaccount/thread_controller.js'
+import TimezoneController from './houseaccount/timezone_controller.js'
+import ToastController from './houseaccount/toast_controller.js'
+import TooltipController from './houseaccount/tooltip_controller.js'
+import WallController from './houseaccount/wall_controller.js'
+import WrittenController from './houseaccount/written_controller.js'
+
+// Guarded: a module runs once, but a host that also loads this file from its own
+// layout on a Turbo visit would otherwise connect every controller a second time.
+if (!window.Stimulus) {
+  window.Stimulus = Application.start()
+  window.Stimulus.register('bookmark', BookmarkController)
+  window.Stimulus.register('clear', ClearController)
+  window.Stimulus.register('combobox', ComboboxController)
+  window.Stimulus.register('density', DensityController)
+  window.Stimulus.register('deselect', DeselectController)
+  window.Stimulus.register('limit', LimitController)
+  window.Stimulus.register('map', MapController)
+  window.Stimulus.register('otp', OtpController)
+  window.Stimulus.register('phone', PhoneController)
+  window.Stimulus.register('placeholder', PlaceholderController)
+  window.Stimulus.register('relative-time', RelativeTimeController)
+  window.Stimulus.register('require', RequireController)
+  window.Stimulus.register('reveal', RevealController)
+  window.Stimulus.register('scheme', SchemeController)
+  window.Stimulus.register('search', SearchController)
+  window.Stimulus.register('shortcuts', ShortcutsController)
+  window.Stimulus.register('thread', ThreadController)
+  window.Stimulus.register('timezone', TimezoneController)
+  window.Stimulus.register('toast', ToastController)
+  window.Stimulus.register('tooltip', TooltipController)
+  window.Stimulus.register('wall', WallController)
+  window.Stimulus.register('written', WrittenController)
+
+  // The browser's confirm() becomes a Bootstrap dialog the module draws on the first ask.
+  window.Turbo.config.forms.confirm = confirm
+}