domma-cms 0.66.0 → 0.69.4

package/plugins/contacts/collections/user-contact-groups/schema.json

@@ -1,35 +0,0 @@
-{
-  "slug": "contacts-groups",
-  "title": "Contact Groups",
-  "description": "Groups for the Contacts plugin.",
-  "plugin": "contacts",
-  "fields": [
-    {
-      "name": "name",
-      "label": "Group Name",
-      "type": "text",
-      "required": true
-    }
-  ],
-  "api": {
-    "create": {
-      "enabled": true,
-      "access": "admin"
-    },
-    "read": {
-      "enabled": true,
-      "access": "admin"
-    },
-    "update": {
-      "enabled": false,
-      "access": "admin"
-    },
-    "delete": {
-      "enabled": false,
-      "access": "admin"
-    }
-  },
-  "storage": {
-    "adapter": "file"
-  }
-}

package/plugins/contacts/collections/user-contacts/schema.json

@@ -1,179 +0,0 @@
-{
-  "slug": "contacts-contacts",
-  "title": "Contacts",
-  "description": "Contacts managed by the Contacts plugin.",
-  "plugin": "contacts",
-  "fields": [
-    {
-      "name": "name",
-      "label": "Name",
-      "type": "text",
-      "required": true
-    },
-    {
-      "name": "email",
-      "label": "Email",
-      "type": "text",
-      "required": false
-    },
-    {
-      "name": "phone",
-      "label": "Phone",
-      "type": "text",
-      "required": false
-    },
-    {
-      "name": "groups",
-      "label": "Groups",
-      "type": "text",
-      "required": false
-    },
-    {
-      "name": "notes",
-      "label": "Notes",
-      "type": "textarea",
-      "required": false
-    },
-    {
-      "name": "favourite",
-      "label": "Favourite",
-      "type": "text",
-      "required": false
-    },
-    {
-      "name": "company",
-      "label": "Company",
-      "type": "text",
-      "required": false
-    },
-    {
-      "name": "jobTitle",
-      "label": "Job Title",
-      "type": "text",
-      "required": false
-    },
-    {
-      "name": "website",
-      "label": "Website",
-      "type": "text",
-      "required": false
-    },
-    {
-      "name": "vatNumber",
-      "label": "VAT Number",
-      "type": "text",
-      "required": false
-    },
-    {
-      "name": "companyNumber",
-      "label": "Company Number",
-      "type": "text",
-      "required": false
-    },
-    {
-      "name": "reference",
-      "label": "Their Reference",
-      "type": "text",
-      "required": false
-    },
-    {
-      "name": "billingEmail",
-      "label": "Billing Email",
-      "type": "text",
-      "required": false
-    },
-    {
-      "name": "paymentTerms",
-      "label": "Payment Terms (days)",
-      "type": "number",
-      "required": false
-    },
-    {
-      "name": "currency",
-      "label": "Preferred Currency",
-      "type": "text",
-      "required": false
-    },
-    {
-      "name": "addresses",
-      "label": "Addresses",
-      "type": "json",
-      "required": false
-    },
-    {
-      "name": "emails",
-      "label": "Additional Emails",
-      "type": "json",
-      "required": false
-    },
-    {
-      "name": "phones",
-      "label": "Additional Phones",
-      "type": "json",
-      "required": false
-    },
-    {
-      "name": "accountName",
-      "label": "Account Name",
-      "type": "text",
-      "required": false
-    },
-    {
-      "name": "bankName",
-      "label": "Bank",
-      "type": "text",
-      "required": false
-    },
-    {
-      "name": "sortCode",
-      "label": "Sort Code",
-      "type": "text",
-      "required": false
-    },
-    {
-      "name": "accountNumber",
-      "label": "Account Number",
-      "type": "text",
-      "required": false
-    },
-    {
-      "name": "iban",
-      "label": "IBAN",
-      "type": "text",
-      "required": false
-    },
-    {
-      "name": "bic",
-      "label": "BIC / SWIFT",
-      "type": "text",
-      "required": false
-    },
-    {
-      "name": "userId",
-      "label": "User ID",
-      "type": "text",
-      "required": false
-    }
-  ],
-  "api": {
-    "create": {
-      "enabled": true,
-      "access": "admin"
-    },
-    "read": {
-      "enabled": true,
-      "access": "admin"
-    },
-    "update": {
-      "enabled": false,
-      "access": "admin"
-    },
-    "delete": {
-      "enabled": false,
-      "access": "admin"
-    }
-  },
-  "storage": {
-    "adapter": "file"
-  }
-}

package/plugins/contacts/config.js

@@ -1,6 +0,0 @@
-export default {
-    scope: 'user',
-    maxPerUser: 5000,
-    // storage.adapter: 'mongodb' uses config/connections.json; 'file' uses local JSON
-    storage: {adapter: 'file'}
-};

package/plugins/contacts/plugin.json

@@ -1,36 +0,0 @@
-{
-  "name": "contacts",
-  "displayName": "Contacts",
-  "version": "1.0.0",
-  "description": "Contact manager with groups, favourites, search, and import/export.",
-  "author": "Darryl Waterhouse",
-  "date": "2026-03-24",
-  "icon": "users",
-  "admin": {
-    "css": [
-      "admin/css/index.css"
-    ],
-    "sidebar": [
-      {
-        "id": "contacts",
-        "text": "Contacts",
-        "icon": "users",
-        "url": "#/plugins/contacts",
-        "section": "#/plugins/contacts"
-      }
-    ],
-    "routes": [
-      {
-        "path": "/plugins/contacts",
-        "view": "plugin-contacts",
-        "title": "Contacts - Domma CMS"
-      }
-    ],
-    "views": {
-      "plugin-contacts": {
-        "entry": "contacts/admin/views/contacts.js?v=25e5dae4",
-        "exportName": "contactsView"
-      }
-    }
-  }
-}

package/plugins/demo-viewer/config.js

@@ -1,4 +0,0 @@
-export default {
-    basePath: '/public/demos',
-    defaultHeight: '500px'
-};

package/plugins/demo-viewer/plugin.js

@@ -1,36 +0,0 @@
-/**
- * Demo Viewer Plugin
- *
- * Registers a [demo] shortcode that embeds interactive Domma JS demos via iframe.
- *
- * Usage:
- *   [demo src="elements/accordion" /]
- *   [demo src="effects/ambient" height="600px" title="Ambient Effect" /]
- */
-
-export default async function demoViewerPlugin(fastify, opts) {
-    const {hooks, settings} = opts;
-    const basePath = settings.basePath || '/public/demos';
-    const defaultHeight = settings.defaultHeight || '500px';
-
-    hooks.registerShortcode('demo', (attrStr, body, context) => {
-        const attrs = context.parseShortcodeAttrs(attrStr);
-        const src = attrs.src || '';
-        const height = attrs.height || defaultHeight;
-        const title = attrs.title || '';
-        const iframeSrc = `${basePath}/${src}.html`;
-
-        const titleBar = title
-            ? `<div class="demo-viewer-title">${context.escapeAttr(title)}</div>`
-            : '';
-
-        return `<div class="demo-viewer">${titleBar}<iframe src="${context.escapeAttr(iframeSrc)}" style="width:100%;height:${context.escapeAttr(height)};border:none;border-radius:var(--dm-radius, 8px);background:var(--dm-surface, #1a1a2e);" loading="lazy" allowfullscreen></iframe></div>`;
-    }, {priority: 5});
-
-    hooks.registerSanitizeRules({
-        tags: ['iframe'],
-        attributes: {
-            iframe: ['src', 'height', 'width', 'style', 'loading', 'allowfullscreen']
-        }
-    });
-}

package/plugins/demo-viewer/plugin.json

@@ -1,9 +0,0 @@
-{
-  "name": "demo-viewer",
-  "displayName": "Demo Viewer",
-  "version": "1.0.0",
-  "description": "Embeds interactive Domma JS demos via iframe shortcode",
-  "author": "Domma",
-  "date": "2026-03-31",
-  "icon": "play-circle"
-}

package/plugins/invoice/admin/css/index.css

@@ -1 +0,0 @@
-.invoice-hidden{display:none!important}.invoice-editor{align-items:flex-start}.invoice-editor-main{flex:1;min-width:0}.invoice-editor-side{width:300px;flex-shrink:0}@media(max-width:900px){.invoice-editor{flex-wrap:wrap}.invoice-editor-side{width:100%}}.invoice-num,.invoice-line-total{font-variant-numeric:tabular-nums}#line-items-table th{font-weight:600;font-size:.85em}#line-items-table td{vertical-align:middle}#line-items-table .form-input{padding:.35rem .5rem}#line-items-table th.invoice-col-desc{width:44%}#line-items-table th.invoice-col-qty{width:13%;text-align:right}#line-items-table th.invoice-col-price{width:17%;text-align:right}#line-items-table th.invoice-col-total{width:18%;text-align:right}#line-items-table th.invoice-col-remove{width:8%}#line-items-table td.invoice-line-total{text-align:right}#line-items-table input[type=number]{text-align:right;font-variant-numeric:tabular-nums}.li-remove{font-size:1.1em;line-height:1;padding:.15rem .5rem;min-width:1.9rem}.invoice-number-link{font-weight:600}.invoice-row-actions{display:flex;gap:.4rem}#invoices-table td .invoice-num{display:block;text-align:right}#invoices-table th:nth-child(5){text-align:right}#invoices-table th:last-child,#invoices-table td:last-child{text-align:right;width:3rem}.invoice-party-form{display:flex;flex-direction:column;gap:.75rem;padding:.5rem}.invoice-party-actions{display:flex;justify-content:flex-end;gap:.75rem;margin-top:.75rem}.stat-icon--danger{background:color-mix(in srgb,var(--dm-danger) 15%,transparent);color:var(--dm-danger)}.invoice-col-date,.invoice-col-method{width:22%}#payments-table th{font-weight:600;font-size:.85em}#payments-table td{vertical-align:middle}#payments-table td.invoice-line-total,#payments-table th.invoice-col-total{text-align:right}.invoice-balance strong{color:var(--dm-warning)}.invoice-balance.is-settled strong{color:var(--dm-success)}.invoice-toolbar .card-body{padding:.75rem 1rem}.invoice-toolbar-row{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}.invoice-toolbar-row--sub{margin-top:.6rem;padding-top:.6rem;border-top:1px solid var(--dm-border);font-size:.85rem}.invoice-toolbar-spacer{flex:1 1 auto}.invoice-search{position:relative;display:flex;align-items:center;flex:1 1 260px;min-width:200px}.invoice-search>[data-icon],.invoice-search>svg{position:absolute;left:.6rem;color:var(--dm-text-muted);pointer-events:none}.invoice-search .form-input{padding-left:2rem}.invoice-filter-narrow{width:auto;min-width:9rem}.invoice-field{display:flex;align-items:center;gap:.35rem;color:var(--dm-text-muted);white-space:nowrap}.invoice-field .form-input{width:auto}.invoice-check{display:flex;align-items:center;gap:.35rem;white-space:nowrap;cursor:pointer}.invoice-matches{white-space:nowrap}.invoice-hint{margin:-.25rem 0 .75rem}.invoice-row-menu{font-size:1.1rem;line-height:1;padding:.15rem .55rem}.invoice-settings{padding:.25rem}.invoice-settings .tab-panel{padding-top:.75rem}.invoice-settings-form{margin-bottom:.5rem}.invoice-settings-inline{display:flex;align-items:center;gap:.5rem;margin-bottom:.5rem}.invoice-settings-inline .form-label{margin:0;white-space:nowrap}.invoice-settings-inline .form-select{width:auto;min-width:12rem}.invoice-panel-head{display:flex;align-items:center;justify-content:flex-end;gap:.5rem;margin-bottom:.5rem;flex-wrap:wrap}.invoice-number-preview{font-family:var(--dm-font-mono, monospace);color:var(--dm-text-muted);margin-bottom:.25rem}.invoice-slideover-resizer{padding:0;position:absolute;left:0;top:0;bottom:0;width:6px;cursor:col-resize;z-index:2;background:transparent}.invoice-slideover-resizer:hover,.is-resizing>.invoice-slideover-resizer{background:var(--dm-primary);opacity:.7}.is-resizing{user-select:none;transition:none!important}.invoice-media-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:.6rem}.invoice-media-tile{display:flex;flex-direction:column;align-items:center;gap:.3rem;padding:.5rem;border:1px solid var(--dm-border);border-radius:var(--dm-radius-md, 8px);background:var(--dm-surface);cursor:pointer}.invoice-media-tile:hover{border-color:var(--dm-primary)}.invoice-media-tile img{max-width:100%;max-height:72px;object-fit:contain}.invoice-media-tile span{font-size:.7rem;color:var(--dm-text-muted);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.invoice-logo-frame{display:flex;align-items:center;justify-content:center;min-height:110px;padding:.75rem;border:1px dashed var(--dm-border);border-radius:var(--dm-radius-md, 8px);background:var(--dm-background-alt)}.invoice-logo-preview{max-height:90px;max-width:100%;object-fit:contain}.invoice-media-row{display:flex;gap:.5rem;align-items:center}.invoice-media-row .form-input{flex:1 1 auto;min-width:0}.invoice-media-pick{flex:0 0 auto}.invoice-picker-filters{display:flex;gap:.5rem;margin-bottom:.6rem}.invoice-picker-filters .form-input{flex:1 1 auto}.invoice-picker-filters .form-select{width:auto}.invoice-picker-list{display:flex;flex-direction:column;gap:.2rem;max-height:60vh;overflow-y:auto}.invoice-picker-row{display:flex;align-items:baseline;gap:.6rem;width:100%;padding:.4rem .6rem;border:1px solid transparent;border-radius:var(--dm-radius-sm, 6px);background:transparent;text-align:left;cursor:pointer}.invoice-picker-row:hover{background:var(--dm-hover-bg, var(--dm-background-alt))}.invoice-picker-row.is-chosen{border-color:var(--dm-primary);background:color-mix(in srgb,var(--dm-primary) 10%,transparent)}.invoice-picker-name{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.invoice-picker-mail{color:var(--dm-text-muted);font-size:.8rem;white-space:nowrap}.invoice-picker-count{flex:1 1 auto}.invoice-recipient-actions{display:flex;gap:.5rem;margin-top:.35rem}.invoice-receiver-row{display:flex;gap:.5rem;align-items:center}.invoice-receiver-row .form-select{flex:1 1 auto;min-width:0}#kpi-outstanding{font-size:1.4rem;line-height:1.2;font-variant-numeric:tabular-nums}@media(max-width:1500px){#kpi-outstanding{font-size:1.15rem}}.invoice-empty{margin:.75rem 0 0;padding:.85rem 1rem;border:1px dashed var(--dm-border);border-radius:var(--dm-radius-md, 8px);text-align:center}.dm-plugin-body .card-header--quiet{background:transparent;border-bottom:0;padding:.65rem 1rem 0;min-height:0}.dm-plugin-body .card-header--quiet+.card-body{padding-top:.5rem}.invoice-cap{display:inline-flex;align-items:center;font-size:.7rem;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--dm-text-muted)}.invoice-kpi{cursor:pointer;transition:border-color .15s,transform .15s}.invoice-kpi:hover{border-color:var(--dm-primary);transform:translateY(-1px)}.invoice-kpi:active{transform:none}.invoice-setup{border-color:var(--dm-primary);margin-bottom:.75rem}.invoice-setup .card-body{display:flex;flex-direction:column;gap:.4rem}.invoice-setup p{margin:0}#btn-new-invoice:disabled{opacity:.5;cursor:not-allowed}.invoice-template-picker{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:.5rem;margin-bottom:.75rem}.invoice-template-card{display:flex;flex-direction:column;align-items:flex-start;gap:.2rem;padding:.6rem .75rem;text-align:left;background:var(--dm-surface);border:1px solid var(--dm-border);border-radius:var(--dm-radius-md, 8px);cursor:pointer}.invoice-template-card:hover{border-color:var(--dm-primary)}.invoice-template-card.is-chosen{border-color:var(--dm-primary);background:color-mix(in srgb,var(--dm-primary) 10%,transparent)}.invoice-template-name{font-size:.85rem}.invoice-template-desc{font-size:.72rem;color:var(--dm-text-muted);line-height:1.35}.invoice-template-tag{font-size:.6rem;margin-top:.15rem}.invoice-template-preview{width:100%;height:60vh;min-height:320px;border:1px solid var(--dm-border);border-radius:var(--dm-radius-md, 8px);background:#fff}.invoice-template-preview.is-loading{opacity:.5}

package/plugins/invoice/admin/templates/editor.html

@@ -1,220 +0,0 @@
-<!--
-  Every value on this screen is bound. The view builds an observable per field
-  and one computed per derived number, then calls M.applyBindings once - there
-  is no render function, and no path by which the DOM and the totals can drift.
-  The heading is removed by the admin's plugin shell (dedupeHeading), so nothing
-  per-record is bound to it.
--->
-<div class="view-header">
-  <h1>Invoice</h1>
-  <div class="view-header-actions">
-    <button id="btn-print" type="button" class="btn btn-secondary" data-if="isEdit.value" data-on-click="openPrint">
-      <span data-icon="printer"></span> Print
-    </button>
-    <button id="btn-pdf" type="button" class="btn btn-secondary" data-if="canPdf.value" data-on-click="downloadPdf">
-      <span data-icon="download"></span> Download PDF
-    </button>
-    <button id="btn-send" type="button" class="btn btn-secondary" data-if="isEdit.value" data-on-click="sendInvoice">
-      <span data-icon="mail"></span> Send
-    </button>
-    <button id="btn-save" type="button" class="btn btn-primary" data-on-click="save">
-      <span data-icon="save"></span> Save
-    </button>
-  </div>
-</div>
-
-<div class="flex gap-4 invoice-editor">
-
-  <div class="invoice-editor-main">
-
-    <div class="card mb-3">
-      <div class="card-body">
-        <div class="grid grid-cols-2 gap-3">
-          <div>
-            <label class="form-label" for="f-number" data-help="Leave it blank and one is allocated when you save - per prefix, per year, never reused.">Invoice Number</label>
-            <input id="f-number" type="text" class="form-input font-mono" data-model="number.value" placeholder="auto-generated">
-            <div class="text-muted text-sm">Leave blank to auto-number</div>
-          </div>
-          <div>
-            <label class="form-label" for="f-status">Status</label>
-            <select id="f-status" class="form-select" data-model="status.value">
-              <option value="draft">Draft</option>
-              <option value="sent">Sent</option>
-              <option value="paid">Paid</option>
-              <option value="overdue">Overdue</option>
-              <option value="cancelled">Cancelled</option>
-            </select>
-          </div>
-          <div>
-            <label class="form-label" for="f-issue-date">Issue Date</label>
-            <!-- E.datePicker attaches to these; it writes ISO into the input and
-                 fires input/change, so data-model keeps working. -->
-            <input id="f-issue-date" type="text" class="form-input" data-model="issueDate.value">
-          </div>
-          <div>
-            <label class="form-label" for="f-due-date" data-help="Filled in from your payment terms. Past this date a sent invoice reports itself overdue.">Due Date</label>
-            <input id="f-due-date" type="text" class="form-input" data-model="dueDate.value">
-          </div>
-          <div>
-            <label class="form-label" for="f-issuer" data-help="Which of your businesses is raising this. Manage them under the cog, in Issuers.">Issuer</label>
-            <select id="f-issuer" class="form-select"
-                    data-options="issuers.value"
-                    data-options-text="label"
-                    data-options-value="id"
-                    data-options-caption="'- select -'"
-                    data-model="issuerId.value"></select>
-          </div>
-          <div>
-            <label class="form-label" for="f-receiver" data-help="Who you are billing. From Contacts imports one, with its company name, billing address and VAT number.">Receiver</label>
-            <div class="invoice-receiver-row">
-              <select id="f-receiver" class="form-select"
-                      data-options="receivers.value"
-                      data-options-text="label"
-                      data-options-value="id"
-                      data-options-caption="'- select -'"
-                      data-model="receiverId.value"></select>
-              <button type="button" class="btn btn-sm btn-outline" data-if="canImport.value"
-                      data-on-click="importReceiver" title="Create a receiver from a contact">
-                From Contacts
-              </button>
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-
-    <div class="card mb-3">
-      <div class="card-header card-header--quiet flex justify-between items-center">
-        <span class="invoice-cap" data-help="Prices are NET - VAT is applied once, to the total. Right-click a row to duplicate, move or remove it.">Line items</span>
-        <button id="btn-add-line" type="button" class="btn btn-sm btn-outline" data-on-click="addLine">
-          <span data-icon="plus"></span> Add Line
-        </button>
-      </div>
-      <div class="card-body">
-        <table class="table mb-0" id="line-items-table">
-          <thead>
-            <tr>
-              <th class="invoice-col-desc">Description</th>
-              <th class="invoice-col-qty">Qty</th>
-              <th class="invoice-col-price">Unit (net)</th>
-              <th class="invoice-col-total">Total</th>
-              <th class="invoice-col-remove"></th>
-            </tr>
-          </thead>
-          <!-- key=id is required: it is what keeps a row's own input focused
-               and uncommitted while the row above it is deleted. -->
-          <tbody id="line-items-body" data-each="lineItems.value key=id">
-            <tr>
-              <td><input type="text" class="form-input" data-model="description.value" placeholder="Description"></td>
-              <td><input type="number" class="form-input" min="0" step="0.01" data-model="quantity.value"></td>
-              <td><input type="number" class="form-input" min="0" step="0.01" data-model="unitPrice.value"></td>
-              <td class="invoice-line-total" data-bind-text="lineTotalText.value"></td>
-              <td>
-                <button type="button" class="btn btn-sm btn-ghost li-remove" title="Remove"
-                        data-on-click="$parent.removeLine($data)">&times;</button>
-              </td>
-            </tr>
-          </tbody>
-        </table>
-      </div>
-    </div>
-
-    <div class="card mb-3" data-if="isEdit.value">
-      <div class="card-header card-header--quiet flex justify-between items-center">
-        <span class="invoice-cap" data-help="Money received against this invoice. Settle the balance and the status moves to paid on its own.">Payments</span>
-        <button id="btn-record-payment" type="button" class="btn btn-sm btn-outline" data-on-click="recordPayment">
-          <span data-icon="plus"></span> Record Payment
-        </button>
-      </div>
-      <div class="card-body">
-        <table class="table mb-0" id="payments-table" data-if="hasPayments.value">
-          <thead>
-            <tr>
-              <th class="invoice-col-date">Date</th>
-              <th class="invoice-col-method">Method</th>
-              <th>Reference</th>
-              <th class="invoice-col-total">Amount</th>
-              <th class="invoice-col-remove"></th>
-            </tr>
-          </thead>
-          <tbody id="payments-body" data-each="payments.value key=id">
-            <tr>
-              <td data-bind-text="dateText"></td>
-              <td data-bind-text="methodText"></td>
-              <td data-bind-text="reference"></td>
-              <td class="invoice-line-total" data-bind-text="amountText.value"></td>
-              <td>
-                <button type="button" class="btn btn-sm btn-ghost li-remove" title="Remove"
-                        data-on-click="$parent.removePayment($data)">&times;</button>
-              </td>
-            </tr>
-          </tbody>
-        </table>
-        <p class="text-muted text-sm mb-0" data-if="noPayments.value">Nothing recorded against this invoice yet.</p>
-      </div>
-    </div>
-
-    <div class="card mb-3">
-      <div class="card-header card-header--quiet"><span class="invoice-cap" data-help="Printed on the invoice under the totals. Payment instructions, a purchase order number, a thank you.">Notes</span></div>
-      <div class="card-body">
-        <textarea id="f-notes" class="form-textarea" rows="3" data-model="notes.value"
-                  placeholder="Optional notes printed on the invoice"></textarea>
-      </div>
-    </div>
-  </div>
-
-  <div class="invoice-editor-side">
-
-    <div class="card mb-3">
-      <div class="card-header card-header--quiet"><span class="invoice-cap">Totals</span></div>
-      <div class="card-body">
-        <div class="flex justify-between mb-2">
-          <span class="text-muted">Subtotal</span>
-          <span class="invoice-num" data-bind-text="subtotalText.value"></span>
-        </div>
-        <div class="flex justify-between mb-2" id="vat-row" data-if="vatEnabled.value">
-          <span class="text-muted">VAT (<span data-bind-text="vatRate.value"></span>%)</span>
-          <span class="invoice-num" data-bind-text="vatText.value"></span>
-        </div>
-        <hr>
-        <div class="flex justify-between">
-          <strong>Total</strong>
-          <strong class="invoice-num" data-bind-text="totalText.value"></strong>
-        </div>
-        <div class="flex justify-between mt-2" data-if="hasPayments.value">
-          <span class="text-muted">Paid</span>
-          <span class="invoice-num" data-bind-text="paidText.value"></span>
-        </div>
-        <div class="flex justify-between mt-1 invoice-balance" data-if="hasPayments.value" data-bind-class="settled.value && 'is-settled'">
-          <strong data-bind-text="balanceLabel.value"></strong>
-          <strong class="invoice-num" data-bind-text="balanceText.value"></strong>
-        </div>
-      </div>
-    </div>
-
-    <div class="card mb-3">
-      <div class="card-header card-header--quiet"><span class="invoice-cap" data-help="One rate for the whole invoice, applied to the net total. Switch it off for a non-VAT invoice.">VAT</span></div>
-      <div class="card-body">
-        <!-- .form-checkbox is a WRAPPER in Domma; the class that styles the box
-             itself is .form-check-input (appearance:none, primary fill, tick). -->
-        <label class="form-check mb-2" for="f-vat-enabled">
-          <input id="f-vat-enabled" type="checkbox" class="form-check-input" data-model="vatEnabled.value">
-          <span class="form-check-label">Apply VAT</span>
-        </label>
-        <label class="form-label" for="f-vat-rate">Rate %</label>
-        <input id="f-vat-rate" type="number" min="0" max="100" step="0.01" class="form-input" data-model="vatRate.value">
-      </div>
-    </div>
-
-    <div class="card mb-3">
-      <div class="card-header card-header--quiet"><span class="invoice-cap" data-help="Set per invoice. The default for new ones lives under the cog, in Defaults.">Currency</span></div>
-      <div class="card-body">
-        <select id="f-currency" class="form-select" data-model="currency.value">
-          <option value="GBP">GBP - British Pound</option>
-          <option value="EUR">EUR - Euro</option>
-          <option value="USD">USD - US Dollar</option>
-        </select>
-      </div>
-    </div>
-  </div>
-</div>