signalk-chiplog 2.10.0 → 2.12.0

package/CHANGELOG.md

@@ -6,6 +6,39 @@ All notable changes to Chiplog are documented here. The format follows
 
 ## [Unreleased]
 
+## [2.12.0] - 2026-10-24
+
+### Added
+
+- **Helm entry beside the chart.** Chartplotters supporting the Plotter Extensions API can open Chiplog from a toolbar
+  button. The iframe panel keeps drafts while hidden and follows the plotter's night mode when available. The standalone
+  tablet app and its offline queue remain available.
+
+### Fixed
+
+- Event and crew deletion confirmations work inside sandboxed plotter panels.
+
+## [2.11.0] - 2026-10-24
+
+### Added
+
+- **Alarms can be left out of the log.** **Log Signal K alarms** turns them off altogether, and **Alarms left out of the
+  log** lists the ones never to record, `*` standing for any characters: `notifications.chartplotter.unknown*` silences
+  a chart plotter raising `unknown114`, `unknown115` and so on. An alarm already in the log is still closed when it
+  clears.
+- **Reconnecting after the server drops out.** When the Signal K server stops answering, or your login expires, the
+  webapp says which in a banner at the bottom of the screen, seen wherever you are on the page, and offers **Reconnect**
+  (with **Sign in** for an expired login, in another tab); once the server answers, pages reload on their own and the
+  banner says when a failed correction can be done again. On the tablet, **Not connected** gets a **Reconnect** button
+  that sends waiting entries at once, and corrections or crew changes that fail offline say so with the same button.
+
+### Changed
+
+- **The online backup sends only what the boat's plan keeps.** When the service says its plan keeps the passages from a
+  date on (Ti Bord's free plan: the last 30 days), older closed passages stay on board and are not sent, and the
+  passages counted for the backup's progress are those of that window. A passage under way is always sent; once the boat
+  is subscribed, everything is sent again, newest first.
+
 ## [2.10.0] - 2026-10-20
 
 ### Added
@@ -462,7 +495,9 @@ First release.
 - REST API under `/plugins/signalk-chiplog/api`, documented in [docs/API.md](docs/API.md).
 - Single SQLite database through Node's built-in `node:sqlite`: no native module to build.
 
-[Unreleased]: https://github.com/ricard33/signalk-chiplog/compare/v2.10.0...HEAD
+[Unreleased]: https://github.com/ricard33/signalk-chiplog/compare/v2.12.0...HEAD
+[2.12.0]: https://github.com/ricard33/signalk-chiplog/compare/v2.11.0...v2.12.0
+[2.11.0]: https://github.com/ricard33/signalk-chiplog/compare/v2.10.0...v2.11.0
 [2.10.0]: https://github.com/ricard33/signalk-chiplog/compare/v2.9.0...v2.10.0
 [2.9.0]: https://github.com/ricard33/signalk-chiplog/compare/v2.8.0...v2.9.0
 [2.8.0]: https://github.com/ricard33/signalk-chiplog/compare/v2.7.0...v2.8.0

package/README.md

@@ -128,7 +128,8 @@ an old value.
 Added to the timeline without anyone touching anything:
 
 - **Alarms** — any Signal K notification reaching `alarm` or `emergency` (man overboard, engine alarm, anchor watch…),
-  and when it clears.
+  and when it clears. They can be turned off altogether, or some left out by name: `notifications.chartplotter.unknown*`
+  skips `unknown114`, `unknown115` and every other path starting that way.
 - **Autopilot** — engaged, disengaged, mode changes.
 - **Wind** — true wind, averaged over 2 minutes, rising above 20 and 30 knots and falling back below them
   (configurable).
@@ -260,6 +261,12 @@ shortcuts beside it; where any date is allowed, the calendar has an _Any date_ b
 
 **Helm entry** in the top bar opens the tablet entry app.
 
+**When the server drops out** — Wi-Fi gone, Signal K restarting — a banner at the bottom of the screen says the server
+does not answer and offers **Reconnect**, wherever you are on the page. Once it answers again, pages reload what they
+were showing, and the banner says when a correction that failed can be done again. If your Signal K login has expired
+instead, the message says so, with **Sign in** opening the admin in another tab: sign in there, come back, and the page
+picks up where you left it.
+
 ### Your own boat in the 3D animation ⛵
 
 The 3D view draws a cartoon sailboat. To see yours instead, use **Boat → Use my own boat…** under the animation and pick
@@ -407,6 +414,10 @@ Keep logging. The header shows **Not connected** and how many entries are waitin
 the time it was made, and sent in order as soon as the server answers again, with the position the track recorded at
 that time. An entry sent just before the connection dropped is never logged twice.
 
+The app tries again by itself every few seconds; **Reconnect** beside **Not connected** tries at once, and sends what is
+waiting if the server answers. A correction or a crew change cannot wait like an entry: if it fails for want of a
+connection, it says so with a **Reconnect** button, to do again once connected.
+
 If the server refuses a waiting entry when it comes back — typically nothing to attach it to — it is shown in red in the
 latest entries, to discard.
 
@@ -426,6 +437,18 @@ Logging needs read/write access. The first time, the app shows **This tablet nee
 To revoke it, delete the device under **Security → Devices**: the tablet asks for access again. **Sign in instead** uses
 a regular Signal K user account.
 
+### From a chartplotter
+
+In a chartplotter supporting the Signal K Plotter Extensions API (such as Freeboard-SK), the **Chiplog** toolbar button
+opens the helm entry app in an iframe panel beside the chart. Closing and reopening it keeps notes and handwriting in
+progress; reloading the plotter still discards unsent drafts. The usual offline queue and Signal K access rights apply.
+The panel follows the plotter's night mode when available, and its night switch also changes the plotter's mode.
+Standalone tablet use remains available at the same address.
+
+The extension is advertised automatically while the plugin is enabled. A server without the resource-provider API can
+still run the standalone apps. Journal and login navigation links are hidden in the extension: sign in through the
+chartplotter, or use the panel's device access request.
+
 ## Configuration 🔧
 
 In the Signal K admin, **Apps & Plugins → Configuration → Chiplog**.
@@ -459,6 +482,8 @@ In the Signal K admin, **Apps & Plugins → Configuration → Chiplog**.
 | Map tiles for the summary                                        | `https://tile.openstreetmap.org/{z}/{x}/{y}.png` | The tiles the summary map is drawn over, e.g. a self-hosted server. Empty draws the track on a plain background.                                                                                             |
 | Logbook language (PDF and summary emails)                        | en                                               | Language of the PDF logbooks on the USB drive and of the summary emails (English or French).                                                                                                                 |
 | Ship's time zone (PDF and summary emails)                        | the server's                                     | Time zone of the PDF logbooks on the USB drive and of the summary emails, e.g. `Europe/Paris`.                                                                                                               |
+| Log Signal K alarms                                              | on                                               | Turn off to leave every alarm out of the log.                                                                                                                                                                |
+| Alarms left out of the log                                       | —                                                | Notification paths never logged; `*` stands for any characters, and the leading `notifications.` may be omitted.                                                                                             |
 | Wind speed thresholds                                            | 20, 30 kn                                        | Logged when the 2-minute average true wind crosses them.                                                                                                                                                     |
 | Barometric drop warning                                          | 4 hPa / 3 h                                      | 0 turns it off.                                                                                                                                                                                              |
 | Log heading changes                                              | on                                               | Turn off to leave heading changes out of the log.                                                                                                                                                            |

package/index.js

@@ -8,6 +8,7 @@ const { INFLUX_DEFAULTS } = require('./lib/influx-history');
 const { createLandmarkFinder, LANDMARK_DEFAULTS } = require('./lib/landmark-finder');
 const { OBSERVATION_DEFAULTS } = require('./lib/observation-recorder');
 const { createPlaceNamer, GEOCODING_DEFAULTS } = require('./lib/place-names');
+const { registerPlotterExtension } = require('./lib/plotter-extension');
 const { PROPULSION_DEFAULTS } = require('./lib/propulsion-detector');
 const { createReplayJob } = require('./lib/replay-job');
 const { createSummaryMailer, SUMMARY_MAIL_DEFAULTS } = require('./lib/summary-mailer');
@@ -314,6 +315,21 @@ module.exports = function (app) {
         description:
           'IANA time zone the PDF logbook on the USB drive and the passage summary emails are kept in, e.g. Europe/Paris. Empty uses the server’s time zone; downloads from the webapp use the browser’s'
       },
+      alarmsEnabled: {
+        type: 'boolean',
+        title: 'Log Signal K alarms',
+        description:
+          'Records every notification reaching alarm or emergency, when raised and when cleared; turn off to leave alarms out of the log',
+        default: EVENT_DEFAULTS.alarmsEnabled
+      },
+      ignoredAlarms: {
+        type: 'array',
+        title: 'Alarms left out of the log',
+        description:
+          'Notification paths never logged, * standing for any characters: notifications.chartplotter.unknown* leaves out unknown114, unknown115 and so on. The leading notifications. may be omitted',
+        items: { type: 'string' },
+        default: EVENT_DEFAULTS.ignoredAlarms
+      },
       windSpeedThresholds: {
         type: 'array',
         title: 'Wind speed thresholds (knots)',
@@ -647,6 +663,10 @@ module.exports = function (app) {
           ? config.logbookLanguage
           : 'en',
         logbookTimeZone: config.logbookTimeZone || null,
+        alarmsEnabled: config.alarmsEnabled ?? EVENT_DEFAULTS.alarmsEnabled,
+        ignoredAlarms: Array.isArray(config.ignoredAlarms)
+          ? config.ignoredAlarms
+          : EVENT_DEFAULTS.ignoredAlarms,
         windSpeedThresholds: config.windSpeedThresholds ?? EVENT_DEFAULTS.windSpeedThresholds,
         pressureDropThreshold: config.pressureDropThreshold ?? EVENT_DEFAULTS.pressureDropThreshold,
         headingChangeEnabled: config.headingChangeEnabled ?? EVENT_DEFAULTS.headingChangeEnabled,
@@ -687,6 +707,8 @@ module.exports = function (app) {
       throw err;
     }
 
+    registerPlotterExtension(app, () => database !== null);
+
     const readSelfPath = (path) => app.getSelfPath(path);
     detector = createPassageDetector({ db: database, readSelfPath, settings });
     const recorder = createTrackRecorder({ db: database, readSelfPath, settings });

package/lib/cloud-sync.js

@@ -160,6 +160,9 @@ function createCloudSync({
   let progress = null;
   // Set by a backup asked for by hand: the next run sends everything in full, costly link or not.
   let fullRequested = false;
+  // The first moment of the logbook the boat's plan keeps on the service, as its sync state last
+  // said (`historyFrom`); null for all of it, and before the service has said anything.
+  let historyFrom = null;
 
   const iso = (ms) => new Date(ms).toISOString();
   const base = () => `${settings.cloudSyncUrl.replace(/\/+$/, '')}/v1/logbooks/${getLogbookId(db)}`;
@@ -260,15 +263,27 @@ function createCloudSync({
     }
   }
 
+  // A passage the service's plan keeps: begun from `historyFrom`, or still under way. The others
+  // stay on board and are not sent; the service keeps no more of them than their hashes anyway.
+  const kept = (row) =>
+    historyFrom === null || row.end_time === null || Date.parse(row.start_time) >= historyFrom;
+
   async function synchronise(costly) {
-    const rows = db.prepare('SELECT * FROM log_entries ORDER BY start_time DESC, id DESC').all();
-    // How many passages are on board: the service tells its owner how far the backup is.
+    const onBoardRows = db
+      .prepare('SELECT * FROM log_entries ORDER BY start_time DESC, id DESC')
+      .all();
+    // How many passages are on board for the service to keep: it tells its owner how far the
+    // backup is. Counted by the window it last gave, the first run by none.
     const state = await call('GET', '/sync-state', undefined, {
-      'x-chiplog-passages': String(rows.length)
+      'x-chiplog-passages': String(onBoardRows.filter(kept).length)
     });
+    const from = typeof state.historyFrom === 'string' ? Date.parse(state.historyFrom) : NaN;
+    historyFrom = Number.isNaN(from) ? null : from;
+    const rows = onBoardRows.filter(kept);
     const remote = state.passages;
     const held = new Map(remote.map((item) => [item.originId, item]));
-    const onBoard = new Set(rows.map((row) => row.id));
+    // Passages left out by the plan are still on board: the service is not told to delete them.
+    const onBoard = new Set(onBoardRows.map((row) => row.id));
     for (const id of cache.keys()) {
       if (!onBoard.has(id)) {
         cache.delete(id);

package/lib/event-watcher.js

@@ -5,6 +5,8 @@ const { CRITICAL_STATES } = require('./events');
 const METRES_PER_SECOND_PER_KNOT = 1852 / 3600;
 
 const EVENT_DEFAULTS = {
+  alarmsEnabled: true,
+  ignoredAlarms: [],
   windSpeedThresholds: [20, 30],
   pressureDropThreshold: 4,
   headingChangeEnabled: true,
@@ -88,8 +90,30 @@ function collectNotifications(node, path, found, depth = 0) {
   }
 }
 
+// A pattern names a notification path, `*` standing for any run of
+// characters (dots included); the leading `notifications.` may be left out.
+function compileAlarmPattern(pattern) {
+  const trimmed = String(pattern).trim();
+  if (trimmed === '') {
+    return null;
+  }
+  const full = trimmed.startsWith('notifications.') ? trimmed : `notifications.${trimmed}`;
+  const source = full
+    .split('*')
+    .map((part) => part.replace(/[.+?^${}()|[\]\\]/g, '\\$&'))
+    .join('.*');
+  return new RegExp(`^${source}$`);
+}
+
+function createAlarmFilter(patterns) {
+  const compiled = (patterns ?? []).map(compileAlarmPattern).filter(Boolean);
+  return (path) => compiled.some((pattern) => pattern.test(path));
+}
+
 function createEventWatcher({ db, readSelfPath, settings, observe, clock = Date.now }) {
   const readFresh = createFreshnessTracker(readSelfPath);
+  const alarmsEnabled = settings.alarmsEnabled ?? EVENT_DEFAULTS.alarmsEnabled;
+  const isIgnoredAlarm = createAlarmFilter(settings.ignoredAlarms);
 
   const seenNotifications = new Map();
   const loggedNotifications = new Map();
@@ -173,6 +197,12 @@ function createEventWatcher({ db, readSelfPath, settings, observe, clock = Date.
 
       const logged = lastLoggedState(path);
       const critical = CRITICAL_STATES.has(state);
+      // Alarms turned off, or this one left out, are not raised in the log;
+      // one already logged is still closed when it clears, so no raise is
+      // left without its end.
+      if (critical && (!alarmsEnabled || isIgnoredAlarm(path))) {
+        continue;
+      }
       // Log a critical state not yet logged, or the end of one that was; a
       // clearing whose alarm never made it into the log is not news.
       const worthLogging = critical ? logged !== state : CRITICAL_STATES.has(logged);
@@ -467,4 +497,4 @@ function createEventWatcher({ db, readSelfPath, settings, observe, clock = Date.
   };
 }
 
-module.exports = { createEventWatcher, EVENT_DEFAULTS, CHECK_INTERVAL_MS };
+module.exports = { createEventWatcher, createAlarmFilter, EVENT_DEFAULTS, CHECK_INTERVAL_MS };

package/lib/plotter-extension.js

@@ -0,0 +1,59 @@
+const { version } = require('../package.json');
+
+const EXTENSION_ID = 'signalk-chiplog';
+
+function buildManifest() {
+  return {
+    name: 'Chiplog — Helm entry',
+    description: 'Log manoeuvres, notes and handwriting without leaving the chart.',
+    version,
+    apiVersion: '1',
+    requires: ['panels.iframe', 'buttons'],
+    optional: ['nightMode'],
+    panels: [
+      {
+        id: 'helm-entry',
+        title: 'Chiplog',
+        type: 'iframe',
+        url: '/signalk-chiplog/entry/?plotterExtension=1',
+        lifecycle: 'keepAlive'
+      }
+    ],
+    buttons: [
+      {
+        id: 'open-helm-entry',
+        title: 'Chiplog',
+        slot: 'mapToolbar',
+        icon: 'edit_note',
+        action: { type: 'togglePanel', panel: 'helm-entry' }
+      }
+    ]
+  };
+}
+
+function registerPlotterExtension(app, isRunning) {
+  // Older servers can still run the standalone logbook and tablet app.
+  if (typeof app.registerResourceProvider !== 'function') {
+    return;
+  }
+  app.registerResourceProvider({
+    type: 'plotterExtensions',
+    methods: {
+      listResources: async () => (isRunning() ? { [EXTENSION_ID]: buildManifest() } : {}),
+      getResource: async (id) => {
+        if (!isRunning() || id !== EXTENSION_ID) {
+          throw new Error(`No such plotterExtensions resource: ${id}`);
+        }
+        return buildManifest();
+      },
+      setResource: async () => {
+        throw new Error('Chiplog plotter extension is read-only');
+      },
+      deleteResource: async () => {
+        throw new Error('Chiplog plotter extension is read-only');
+      }
+    }
+  });
+}
+
+module.exports = { registerPlotterExtension };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "signalk-chiplog",
-  "version": "2.10.0",
+  "version": "2.12.0",
   "description": "Nautical logbook for Signal K: automatic entries, handwritten notes",
   "main": "index.js",
   "files": [
@@ -81,6 +81,7 @@
     "mediabunny": "1.58.0",
     "preact": "^10.29.8",
     "prettier": "^3.9.6",
+    "signalk-plotterext-bus": "^0.21.0",
     "three": "0.186.0"
   }
 }

package/public/app.css

@@ -251,6 +251,51 @@ main {
   border-color: transparent;
 }
 
+.notice-actions {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  gap: 0.75rem;
+}
+
+/* Above the map's controls, wherever the page is scrolled. */
+.connection-toast {
+  position: fixed;
+  left: 50%;
+  bottom: 1rem;
+  z-index: 1100;
+  transform: translateX(-50%);
+  width: min(40rem, calc(100% - 2rem));
+  box-sizing: border-box;
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  justify-content: space-between;
+  gap: 0.5rem 1rem;
+  padding: 0.75rem 1rem;
+  border-radius: var(--radius);
+  background: var(--error-bg);
+  color: var(--text);
+  box-shadow: 0 6px 24px rgba(0, 0, 0, 0.25);
+}
+
+.connection-toast p {
+  margin: 0;
+}
+
+.connection-toast-ok {
+  background: var(--ok-bg);
+}
+
+.connection-toast .toast-close {
+  border: none;
+  background: none;
+  color: inherit;
+  font-size: 1.4rem;
+  line-height: 1;
+  cursor: pointer;
+}
+
 .notice-ok {
   background: var(--ok-bg);
   border-color: transparent;

package/public/entry/entry.css

@@ -749,6 +749,32 @@ input {
   border-radius: var(--radius);
 }
 
+.confirmation-dialog {
+  width: min(40rem, calc(100% - 2rem));
+  max-height: calc(100% - 2rem);
+  padding: 0;
+  border: 0;
+  border-radius: var(--radius);
+  background: var(--surface);
+  color: var(--text);
+}
+
+.confirmation-dialog::backdrop {
+  background: rgb(0 0 0 / 55%);
+}
+
+.confirmation-dialog .sheet {
+  width: 100%;
+}
+
+:root[data-plotter-extension='true'] [data-standalone-link] {
+  display: none;
+}
+
+:root[data-plotter-extension='true'] .entry-main {
+  padding: 0.75rem 0.75rem 9rem;
+}
+
 .sail-grid {
   display: grid;
   grid-template-columns: repeat(auto-fill, minmax(9rem, 1fr));

package/public/entry/js/components/AccessGate.mjs

@@ -63,7 +63,7 @@ export function AccessGate({ onGranted }) {
                 ${t('access.request')}
               </button>`
         }
-        <a class="big-button" href="/admin/#/login">${t('access.signIn')}</a>
+        <a class="big-button" data-standalone-link href="/admin/#/login">${t('access.signIn')}</a>
       </div>
     </section>
   `;

package/public/entry/js/components/CrewDialog.mjs

@@ -1,6 +1,7 @@
 import { html, useState } from '../../../vendor/preact-htm.mjs';
 import { useLocale } from '../../../js/context.mjs';
 import { PencilIcon, TrashIcon } from './Icons.mjs';
+import { confirmAction } from '../confirm.mjs';
 
 // .big-button is a row flex container, so a bare <br/> between its children
 // would not stack them -- wrap name and role in their own column instead.
@@ -83,7 +84,7 @@ export function CrewDialog({
   };
 
   const removeMember = async (member) => {
-    if (!confirm(t('entry.deleteCrewMemberConfirm', { name: member.name }))) {
+    if (!(await confirmAction(t('entry.deleteCrewMemberConfirm', { name: member.name }), t))) {
       return;
     }
     const removed = await onDeleteMember(member.id);

package/public/entry/js/components/Dialogs.mjs

@@ -67,7 +67,7 @@ export function EventDialog({ title, event, bounds, onSave, onCancel }) {
 // say the entry is in, a countdown shows the banner will go on its own, and the
 // two follow-ups are secondary next to it — undoing is the destructive one, and
 // says what it undoes, since on its own "undo" reads as dismissing the banner.
-export function Toast({ toast, timeoutMs, onUndo, onComment, onClose }) {
+export function Toast({ toast, timeoutMs, onUndo, onComment, onClose, onReconnect }) {
   const { t, format } = useLocale();
   if (!toast) {
     return null;
@@ -85,6 +85,14 @@ export function Toast({ toast, timeoutMs, onUndo, onComment, onClose }) {
     return html`
       <div class="toast toast-error" role="alert">
         <span class="toast-text">${toast.message}</span>
+        ${
+          toast.reconnect &&
+          html`<span class="toast-actions">
+            <button type="button" class="tool-button" onClick=${onReconnect}>
+              ${t('connection.reconnect')}
+            </button>
+          </span>`
+        }
         ${close}
       </div>
     `;

package/public/entry/js/components/StatusHeader.mjs

@@ -34,9 +34,40 @@ function passageLine(entry, t, format) {
   });
 }
 
-export function StatusHeader({ state, entry, online, queued, night, onToggleNight }) {
-  const { t, format } = useLocale();
+// While the server does not answer, the connection mark is a button that
+// tries again at once, rather than at the next poll.
+function ConnectionMark({ online, connecting, queued, onReconnect }) {
+  const { t } = useLocale();
   const connection = online ? t('entry.online') : t('entry.offline');
+  const label = queued > 0 ? `${connection} · ${t('entry.queued', { count: queued })}` : connection;
+  if (online) {
+    return html`<span class="connection connection-online">
+      <span class="connection-dot" aria-hidden="true"></span>
+      ${label}
+    </span>`;
+  }
+  return html`
+    <span class="connection connection-offline">
+      <span class="connection-dot" aria-hidden="true"></span>
+      ${label}
+      <button type="button" class="tool-button" disabled=${connecting} onClick=${onReconnect}>
+        ${connecting ? t('entry.reconnecting') : t('connection.reconnect')}
+      </button>
+    </span>
+  `;
+}
+
+export function StatusHeader({
+  state,
+  entry,
+  online,
+  connecting,
+  queued,
+  night,
+  onToggleNight,
+  onReconnect
+}) {
+  const { t, format } = useLocale();
   return html`
     <header class="entry-header">
       <div class="entry-status">
@@ -50,10 +81,12 @@ export function StatusHeader({ state, entry, online, queued, night, onToggleNigh
         }
       </div>
       <div class="entry-tools">
-        <span class=${online ? 'connection connection-online' : 'connection connection-offline'}>
-          <span class="connection-dot" aria-hidden="true"></span>
-          ${queued > 0 ? `${connection} · ${t('entry.queued', { count: queued })}` : connection}
-        </span>
+        <${ConnectionMark}
+          online=${online}
+          connecting=${connecting}
+          queued=${queued}
+          onReconnect=${onReconnect}
+        />
         <button
           type="button"
           class="tool-button"
@@ -62,7 +95,7 @@ export function StatusHeader({ state, entry, online, queued, night, onToggleNigh
         >
           ${t('entry.night')}
         </button>
-        <a class="tool-button" href="../">${t('entry.logbook')}</a>
+        <a class="tool-button" data-standalone-link href="../">${t('entry.logbook')}</a>
       </div>
     </header>
   `;

package/public/entry/js/confirm.mjs

@@ -0,0 +1,42 @@
+// Native confirm() is blocked in plotter-extension sandboxes. An HTML dialog
+// works there, traps focus, supports Escape, and keeps the same confirmation
+// in the standalone app. Text is never interpreted as HTML.
+export function confirmAction(message, t) {
+  return new Promise((resolve) => {
+    const dialog = document.createElement('dialog');
+    dialog.className = 'confirmation-dialog';
+    dialog.setAttribute('aria-label', message);
+    const form = document.createElement('form');
+    form.method = 'dialog';
+    form.className = 'sheet';
+    const text = document.createElement('p');
+    text.textContent = message;
+    const actions = document.createElement('div');
+    actions.className = 'sheet-row';
+    for (const [value, label, className] of [
+      ['cancel', t('common.cancel'), 'big-button'],
+      ['confirm', t('common.delete'), 'big-button danger']
+    ]) {
+      const button = document.createElement('button');
+      button.type = 'submit';
+      button.value = value;
+      button.textContent = label;
+      button.className = className;
+      button.autofocus = value === 'cancel';
+      actions.append(button);
+    }
+    form.append(text, actions);
+    dialog.append(form);
+    dialog.addEventListener(
+      'close',
+      () => {
+        const confirmed = dialog.returnValue === 'confirm';
+        dialog.remove();
+        resolve(confirmed);
+      },
+      { once: true }
+    );
+    document.body.append(dialog);
+    dialog.showModal();
+  });
+}