acts_as_calculator_editor 0.1.0

data/app/views/acts_as_calculator_editor/formulas/index.html.erb

@@ -0,0 +1,71 @@
+<% content_for :title, "Formulas" %>
+
+<%= render "acts_as_calculator_editor/shared/page_header",
+           title: "Formulas",
+           subtitle: "A formula is an identity; its maths lives on effective-dated versions.",
+           actions: link_to("New formula", new_formula_path, class: button_class(:primary)) %>
+
+<div data-controller="list-filter" class="rounded-lg border border-slate-200 bg-white">
+  <div class="flex flex-wrap items-end gap-3 border-b border-slate-200 p-4">
+    <%# The server-side filter is the real one — it is what a bookmarked URL carries, and the
+        only one that sees rows this page did not render. %>
+    <%= form_with url: formulas_path, method: :get, class: "flex flex-wrap items-end gap-3" do |form| %>
+      <div>
+        <%= form.label :key, "Key", class: label_class %>
+        <%= form.text_field :key, value: params[:key], class: field_class("w-40 font-mono") %>
+      </div>
+      <div>
+        <%= form.label :scope, "Scope", class: label_class %>
+        <%= form.text_field :scope, value: params[:scope], class: field_class("w-40 font-mono") %>
+      </div>
+      <%= form.submit "Filter", class: button_class(:secondary) %>
+    <% end %>
+
+    <div class="ml-auto">
+      <%= label_tag :formula_quick_filter, "Narrow this page", class: label_class %>
+      <%= text_field_tag :formula_quick_filter, nil,
+                         class: field_class("w-56"),
+                         placeholder: "type to filter rows",
+                         autocomplete: "off",
+                         data: { list_filter_target: "query", action: "input->list-filter#filter" } %>
+    </div>
+  </div>
+
+  <div class="overflow-x-auto">
+    <table class="w-full text-sm">
+      <thead class="bg-slate-50 text-left text-xs uppercase tracking-wide text-slate-500">
+        <tr>
+          <%# Scope is a first-class column, never decoration: uniqueness is scoped to
+              [key, scope, owner], so two rows may legitimately read "net_pay". %>
+          <th class="px-4 py-2 font-medium">Key</th>
+          <th class="px-4 py-2 font-medium">Scope</th>
+          <th class="px-4 py-2 font-medium">Owner</th>
+          <th class="px-4 py-2 font-medium">Versions</th>
+          <th class="px-4 py-2"></th>
+        </tr>
+      </thead>
+      <tbody class="divide-y divide-slate-100">
+        <% @formulas.each do |formula| %>
+          <tr id="<%= dom_id(formula) %>" class="hover:bg-slate-50"
+              data-list-filter-target="row">
+            <td class="px-4 py-2 font-mono font-medium text-slate-900"><%= formula.key %></td>
+            <td class="px-4 py-2 font-mono text-slate-600"><%= formula.scope %></td>
+            <td class="px-4 py-2 text-slate-600"><%= formula.owner_type ? "#{formula.owner_type}##{formula.owner_id}" : "global" %></td>
+            <td class="px-4 py-2 text-slate-600"><%= formula.versions.size %></td>
+            <td class="px-4 py-2 text-right">
+              <%= link_to "Show", formula_path(formula), class: "font-medium text-slate-700 hover:text-slate-900" %>
+            </td>
+          </tr>
+        <% end %>
+      </tbody>
+    </table>
+  </div>
+
+  <p class="px-4 py-3 text-sm text-slate-500" data-list-filter-target="empty" hidden>
+    No formulas match that filter.
+  </p>
+
+  <% if @formulas.empty? %>
+    <p class="px-4 py-3 text-sm text-slate-500">No formulas yet.</p>
+  <% end %>
+</div>

data/app/views/acts_as_calculator_editor/formulas/new.html.erb

@@ -0,0 +1,10 @@
+<% content_for :title, "New formula" %>
+
+<%= render "acts_as_calculator_editor/shared/page_header",
+           back_label: "← Formulas", back_path: formulas_path,
+           title: "New formula" %>
+
+<%= render "acts_as_calculator_editor/shared/error_message" %>
+
+<%= render "form", formula: @formula, url: formulas_path, http_method: :post,
+                   submit_label: "Create formula", cancel_path: formulas_path %>

data/app/views/acts_as_calculator_editor/formulas/show.html.erb

@@ -0,0 +1,72 @@
+<% content_for :title, "#{@formula.key} (#{@formula.scope})" %>
+
+<%= render "acts_as_calculator_editor/shared/page_header",
+           back_label: "← Formulas", back_path: formulas_path,
+           title: @formula.key,
+           subtitle: "Scope: #{@formula.scope} · Owner: #{@formula.owner_type ? "#{@formula.owner_type}##{@formula.owner_id}" : 'global'}",
+           actions: capture {
+             concat link_to("Edit identity", edit_formula_path(@formula), class: button_class(:secondary))
+             concat link_to("Publish new version", new_formula_version_path(@formula), class: button_class(:primary))
+           } %>
+
+<%= render "acts_as_calculator_editor/shared/error_message" %>
+
+<section class="mb-8 rounded-lg border border-slate-200 bg-white">
+  <header class="border-b border-slate-200 px-4 py-3">
+    <h2 class="text-sm font-semibold text-slate-900">Versions</h2>
+  </header>
+
+  <%# There is no "edit version" link, and there never should be: once a version is active its
+      expression, dates and number are immutable. "Duplicate" opens a new-version form
+      prefilled from this one, which is what an operator reaching for edit actually wants. %>
+  <div class="overflow-x-auto">
+    <table class="w-full text-sm">
+      <thead class="bg-slate-50 text-left text-xs uppercase tracking-wide text-slate-500">
+        <tr>
+          <th class="px-4 py-2 font-medium">#</th>
+          <th class="px-4 py-2 font-medium">Status</th>
+          <th class="px-4 py-2 font-medium">Effective</th>
+          <th class="px-4 py-2 font-medium">Expression</th>
+          <th class="px-4 py-2"></th>
+        </tr>
+      </thead>
+      <tbody class="divide-y divide-slate-100">
+        <% @versions.each do |version| %>
+          <tr id="<%= dom_id(version) %>" class="hover:bg-slate-50">
+            <td class="px-4 py-2 text-slate-600"><%= version.version_number %></td>
+            <td class="px-4 py-2"><%= status_badge(version.status) %></td>
+            <td class="px-4 py-2 whitespace-nowrap font-mono text-xs text-slate-600">
+              <%= version.effective_from %> → <%= version.effective_to || "open" %>
+            </td>
+            <td class="px-4 py-2">
+              <code class="rounded bg-slate-100 px-1.5 py-0.5 font-mono text-xs text-slate-800"><%= version.expression %></code>
+            </td>
+            <td class="whitespace-nowrap px-4 py-2 text-right">
+              <%= link_to "Show", formula_version_path(@formula, version), class: "font-medium text-slate-700 hover:text-slate-900" %>
+              <%= link_to "Duplicate", new_formula_version_path(@formula, from_version_id: version.id), class: "ml-3 font-medium text-slate-700 hover:text-slate-900" %>
+            </td>
+          </tr>
+        <% end %>
+      </tbody>
+    </table>
+  </div>
+
+  <% if @versions.empty? %>
+    <p class="px-4 py-3 text-sm text-slate-500">No versions yet — this formula cannot calculate until one is published.</p>
+  <% end %>
+</section>
+
+<section class="rounded-lg border border-red-200 bg-red-50 p-4">
+  <h2 class="text-sm font-semibold text-red-900">Delete</h2>
+
+  <% if @versions.any? { |version| version.runs.exists? } %>
+    <%# Said before the click, not after the 409: this delete was always going to fail. %>
+    <p class="mt-1 text-sm text-red-800">This formula has versions with recorded runs, so it cannot be deleted — the audit trail
+       is never removed to make room for a delete. Retire its active version instead.</p>
+  <% else %>
+    <p class="mt-1 mb-3 text-sm text-red-800">Deletes the formula and every version of it.</p>
+    <%= button_to "Delete formula", formula_path(@formula), method: :delete,
+                  class: button_class(:danger),
+                  form: { data: { turbo_confirm: "Delete #{@formula.key} and all its versions?" } } %>
+  <% end %>
+</section>

data/app/views/acts_as_calculator_editor/lookup_tables/_entry_fields.html.erb

@@ -0,0 +1,24 @@
+<%# `from` and `to` are nullable on both ends — blank means unbounded, not zero — so these
+    are text fields rather than number fields with a default. %>
+<fieldset class="entry-row grid gap-3 rounded-md border border-slate-200 bg-slate-50 p-3 sm:grid-cols-3">
+  <div>
+    <%= label_tag "lookup_table_entries_#{index}_from", "From", class: label_class %>
+    <%= text_field_tag "lookup_table[entries][#{index}][from]", row["from"],
+                       id: "lookup_table_entries_#{index}_from", placeholder: "unbounded",
+                       class: field_class("font-mono"), autocomplete: "off" %>
+  </div>
+
+  <div>
+    <%= label_tag "lookup_table_entries_#{index}_to", "To", class: label_class %>
+    <%= text_field_tag "lookup_table[entries][#{index}][to]", row["to"],
+                       id: "lookup_table_entries_#{index}_to", placeholder: "unbounded",
+                       class: field_class("font-mono"), autocomplete: "off" %>
+  </div>
+
+  <div>
+    <%= label_tag "lookup_table_entries_#{index}_value", "Value", class: label_class %>
+    <%= text_field_tag "lookup_table[entries][#{index}][value]", row["value"],
+                       id: "lookup_table_entries_#{index}_value",
+                       class: field_class("font-mono"), autocomplete: "off" %>
+  </div>
+</fieldset>

data/app/views/acts_as_calculator_editor/lookup_tables/_form.html.erb

@@ -0,0 +1,47 @@
+<%= form_with url: url, method: http_method, html: { class: "space-y-6" } do |form| %>
+  <div class="grid gap-4 rounded-lg border border-slate-200 bg-white p-5 sm:grid-cols-2">
+    <div>
+      <%= label_tag "lookup_table_key", "Key", class: label_class %>
+      <%= text_field_tag "lookup_table[key]", form_values["key"], id: "lookup_table_key",
+                         required: true, readonly: locked, class: field_class("font-mono") %>
+    </div>
+
+    <div>
+      <%= label_tag "lookup_table_scope", "Scope", class: label_class %>
+      <%= text_field_tag "lookup_table[scope]", form_values["scope"], id: "lookup_table_scope",
+                         readonly: locked, class: field_class("font-mono") %>
+    </div>
+
+    <% if locked %>
+      <%# Key and scope are the table's identity, and a formula variable names its table by
+          key. Changing either here would create a second table and leave every formula still
+          reading the old one — so an edit changes brackets only, and a new key is a new table. %>
+      <p class="hint sm:col-span-2 rounded-md border border-amber-200 bg-amber-50 px-3 py-2 text-xs text-amber-900">
+        Key and scope cannot be changed. A formula variable names its table by
+        key, so renaming would leave those formulas reading the old table. Create a new table
+        (the convention is <code class="rounded bg-amber-100 px-1">key_v2</code>) and publish a
+        formula version pointing at it.
+      </p>
+    <% end %>
+  </div>
+
+  <div class="rounded-lg border border-slate-200 bg-white p-5">
+    <h2 class="text-sm font-semibold text-slate-900">Brackets</h2>
+    <p class="mb-4 mt-1 text-xs text-slate-500">Order is the order below, and that order becomes
+       <code class="rounded bg-slate-100 px-1">position</code>. Leave a bound blank for
+       unbounded — blank means unbounded, not zero. A row with all three fields blank is
+       dropped.</p>
+
+    <div class="space-y-3">
+      <% rows = entry_rows + Array.new(3) { { "from" => "", "to" => "", "value" => "" } } %>
+      <% rows.each_with_index do |row, index| %>
+        <%= render "entry_fields", index: index, row: row %>
+      <% end %>
+    </div>
+  </div>
+
+  <div class="flex items-center gap-3">
+    <%= form.submit submit_label, class: button_class(:primary) %>
+    <%= link_to "Cancel", cancel_path, class: button_class(:secondary) %>
+  </div>
+<% end %>

data/app/views/acts_as_calculator_editor/lookup_tables/edit.html.erb

@@ -0,0 +1,12 @@
+<% content_for :title, "Edit #{@lookup_table.key}" %>
+
+<%= render "acts_as_calculator_editor/shared/page_header",
+           back_label: "← #{@lookup_table.key}", back_path: lookup_table_path(@lookup_table),
+           title: "Edit #{@lookup_table.key}",
+           subtitle: "Brackets only — key and scope are the table's identity." %>
+
+<%= render "acts_as_calculator_editor/shared/error_message" %>
+
+<%= render "form", form_values: @form, entry_rows: @entry_rows, locked: true,
+                   url: lookup_table_path(@lookup_table), http_method: :patch,
+                   submit_label: "Save brackets", cancel_path: lookup_table_path(@lookup_table) %>

data/app/views/acts_as_calculator_editor/lookup_tables/index.html.erb

@@ -0,0 +1,67 @@
+<% content_for :title, "Lookup tables" %>
+
+<%= render "acts_as_calculator_editor/shared/page_header",
+           title: "Lookup tables",
+           subtitle: "Bracket tables a formula variable with source_type \"lookup\" resolves against.",
+           actions: link_to("New lookup table", new_lookup_table_path, class: button_class(:primary)) %>
+
+<div data-controller="list-filter" class="rounded-lg border border-slate-200 bg-white">
+  <div class="flex flex-wrap items-end gap-3 border-b border-slate-200 p-4">
+    <%= form_with url: lookup_tables_path, method: :get, class: "flex flex-wrap items-end gap-3" do |form| %>
+      <div>
+        <%= form.label :key, "Key", class: label_class %>
+        <%= form.text_field :key, value: params[:key], class: field_class("w-40 font-mono") %>
+      </div>
+      <div>
+        <%= form.label :scope, "Scope", class: label_class %>
+        <%= form.text_field :scope, value: params[:scope], class: field_class("w-40 font-mono") %>
+      </div>
+      <%= form.submit "Filter", class: button_class(:secondary) %>
+    <% end %>
+
+    <div class="ml-auto">
+      <%= label_tag :lookup_quick_filter, "Narrow this page", class: label_class %>
+      <%= text_field_tag :lookup_quick_filter, nil,
+                         class: field_class("w-56"),
+                         placeholder: "type to filter rows",
+                         autocomplete: "off",
+                         data: { list_filter_target: "query", action: "input->list-filter#filter" } %>
+    </div>
+  </div>
+
+  <div class="overflow-x-auto">
+    <table class="w-full text-sm">
+      <thead class="bg-slate-50 text-left text-xs uppercase tracking-wide text-slate-500">
+        <tr>
+          <th class="px-4 py-2 font-medium">Key</th>
+          <th class="px-4 py-2 font-medium">Scope</th>
+          <th class="px-4 py-2 font-medium">Owner</th>
+          <th class="px-4 py-2 font-medium">Brackets</th>
+          <th class="px-4 py-2"></th>
+        </tr>
+      </thead>
+      <tbody class="divide-y divide-slate-100">
+        <% @lookup_tables.each do |table| %>
+          <tr id="<%= dom_id(table) %>" class="hover:bg-slate-50"
+              data-list-filter-target="row">
+            <td class="px-4 py-2 font-mono font-medium text-slate-900"><%= table.key %></td>
+            <td class="px-4 py-2 font-mono text-slate-600"><%= table.scope %></td>
+            <td class="px-4 py-2 text-slate-600"><%= table.owner_type ? "#{table.owner_type}##{table.owner_id}" : "global" %></td>
+            <td class="px-4 py-2 text-slate-600"><%= table.entries.size %></td>
+            <td class="px-4 py-2 text-right">
+              <%= link_to "Show", lookup_table_path(table), class: "font-medium text-slate-700 hover:text-slate-900" %>
+            </td>
+          </tr>
+        <% end %>
+      </tbody>
+    </table>
+  </div>
+
+  <p class="px-4 py-3 text-sm text-slate-500" data-list-filter-target="empty" hidden>
+    No lookup tables match that filter.
+  </p>
+
+  <% if @lookup_tables.empty? %>
+    <p class="px-4 py-3 text-sm text-slate-500">No lookup tables yet. A formula variable with source_type "lookup" cannot evaluate without one.</p>
+  <% end %>
+</div>

data/app/views/acts_as_calculator_editor/lookup_tables/new.html.erb

@@ -0,0 +1,11 @@
+<% content_for :title, "New lookup table" %>
+
+<%= render "acts_as_calculator_editor/shared/page_header",
+           back_label: "← Lookup tables", back_path: lookup_tables_path,
+           title: "New lookup table" %>
+
+<%= render "acts_as_calculator_editor/shared/error_message" %>
+
+<%= render "form", form_values: @form, entry_rows: @entry_rows, locked: false,
+                   url: lookup_tables_path, http_method: :post,
+                   submit_label: "Create lookup table", cancel_path: lookup_tables_path %>

data/app/views/acts_as_calculator_editor/lookup_tables/show.html.erb

@@ -0,0 +1,71 @@
+<% content_for :title, "#{@lookup_table.key} (#{@lookup_table.scope})" %>
+
+<%= render "acts_as_calculator_editor/shared/page_header",
+           back_label: "← Lookup tables", back_path: lookup_tables_path,
+           title: @lookup_table.key,
+           subtitle: "Scope: #{@lookup_table.scope} · Owner: #{@lookup_table.owner_type ? "#{@lookup_table.owner_type}##{@lookup_table.owner_id}" : 'global'}",
+           actions: link_to("Edit brackets", edit_lookup_table_path(@lookup_table), class: button_class(:primary)) %>
+
+<%= render "acts_as_calculator_editor/shared/error_message" %>
+
+<section class="mb-8 overflow-x-auto rounded-lg border border-slate-200 bg-white">
+  <header class="border-b border-slate-200 px-4 py-3">
+    <h2 class="text-sm font-semibold text-slate-900">Brackets</h2>
+  </header>
+  <table class="w-full text-sm">
+    <thead class="bg-slate-50 text-left text-xs uppercase tracking-wide text-slate-500">
+      <tr>
+        <th class="px-4 py-2 font-medium">#</th>
+        <th class="px-4 py-2 font-medium">From</th>
+        <th class="px-4 py-2 font-medium">To</th>
+        <th class="px-4 py-2 font-medium">Value</th>
+      </tr>
+    </thead>
+    <tbody class="divide-y divide-slate-100">
+      <% @entries.each do |entry| %>
+        <tr>
+          <td class="px-4 py-2 text-slate-500"><%= entry.position %></td>
+          <td class="px-4 py-2 font-mono text-slate-800"><%= entry.from.nil? ? "unbounded" : entry.from.to_s("F") %></td>
+          <td class="px-4 py-2 font-mono text-slate-800"><%= entry.to.nil? ? "unbounded" : entry.to.to_s("F") %></td>
+          <td class="px-4 py-2 font-mono font-medium text-slate-900"><%= entry.value.to_s("F") %></td>
+        </tr>
+      <% end %>
+    </tbody>
+  </table>
+
+  <% if @entries.empty? %>
+    <p class="px-4 py-3 text-sm text-slate-500">No brackets yet.</p>
+  <% end %>
+</section>
+
+<section class="mb-8 rounded-lg border border-slate-200 bg-white p-4">
+  <h2 class="mb-2 text-sm font-semibold text-slate-900">Used by</h2>
+  <%# Which formula versions would resolve to this table if they ran now — owner shadowing
+      included. An active or retired one here means both editing the brackets and deleting the
+      table are refused, and this is where the operator finds that out. %>
+  <% if @used_by.empty? %>
+    <p class="text-sm text-slate-500">No formula version resolves to this table.</p>
+  <% else %>
+    <ul class="space-y-1 text-sm">
+      <% @used_by.each do |version| %>
+        <li>
+          <%= link_to "#{version.formula.key} v#{version.version_number}",
+                      formula_version_path(version.formula, version),
+                      class: "font-mono font-medium text-slate-800 hover:text-slate-950 underline" %>
+          <%= status_badge(version.status) %>
+        </li>
+      <% end %>
+    </ul>
+  <% end %>
+</section>
+
+<section class="rounded-lg border border-red-200 bg-red-50 p-4">
+  <h2 class="text-sm font-semibold text-red-900">Delete</h2>
+  <p class="mt-1 mb-3 text-sm text-red-800">
+    Refused with a 409 if any active or retired formula version resolves to this table — the
+    brackets past runs were audited against are not removed to make room for a delete.
+  </p>
+  <%= button_to "Delete lookup table", lookup_table_path(@lookup_table), method: :delete,
+                class: button_class(:danger),
+                form: { data: { turbo_confirm: "Delete #{@lookup_table.key}?" } } %>
+</section>

data/app/views/acts_as_calculator_editor/shared/_error_message.html.erb

@@ -0,0 +1,12 @@
+<%# `PartialSupersedeError` and `LookupTableInUseError` are shown verbatim on purpose: their
+    messages name the exact date range that would be orphaned, or the formula versions
+    blocking an edit, and both suggest a fix. Replacing them with "Something went wrong"
+    throws away the only part of the failure an operator can act on.
+
+    `whitespace-pre-line` because those messages are multi-line and the line breaks are where
+    the list of blocking versions lives. %>
+<% if @error_message.present? %>
+  <div class="editor-error mb-6 rounded-md border border-red-200 bg-red-50 px-4 py-3" role="alert">
+    <p class="whitespace-pre-line text-sm text-red-800"><%= @error_message %></p>
+  </div>
+<% end %>

data/app/views/acts_as_calculator_editor/shared/_export_panel.html.erb

@@ -0,0 +1,52 @@
+<%# GET /export — an import-shaped JSON document (_workspace/03_rails_report.md §3, §4).
+
+    A plain <form method="get">, not a Turbo Stream and not a fetch: the response is a file
+    download, and Turbo has no way to render one. `data-turbo="false"` keeps Turbo Drive from
+    intercepting the navigation, which would otherwise leave the operator on the page with
+    nothing saved. A GET form serialises its fields into the query string, which is exactly
+    the shape the endpoint documents. %>
+<details class="relative">
+  <summary class="<%= button_class(:secondary) %> cursor-pointer list-none">Export JSON</summary>
+
+  <div class="absolute right-0 z-20 mt-2 w-80 rounded-lg border border-slate-200 bg-white p-4 shadow-lg">
+    <%= form_with url: export_path, method: :get, data: { turbo: false } do |form| %>
+      <p class="mb-3 text-xs text-slate-500">
+        Downloads lookup tables, formulas and templates in the order
+        <code class="rounded bg-slate-100 px-1">ImportDefinitions</code> applies them, so the
+        file re-imports cleanly.
+      </p>
+
+      <div class="mb-3">
+        <%= form.label :key, "Key (optional)", class: label_class %>
+        <%= form.text_field :key, value: params[:key], class: field_class, placeholder: "all keys" %>
+      </div>
+
+      <div class="mb-3">
+        <%= form.label :scope, "Scope (optional)", class: label_class %>
+        <%= form.text_field :scope, value: params[:scope], class: field_class, placeholder: "all scopes" %>
+      </div>
+
+      <div class="mb-3">
+        <%= form.label :disposition, "Delivery", class: label_class %>
+        <%= form.select :disposition,
+                        [ [ "Download the file", "attachment" ], [ "Open in a browser tab", "inline" ] ],
+                        {}, class: field_class %>
+      </div>
+
+      <label class="mb-3 flex items-start gap-2 text-sm text-slate-700">
+        <%= form.check_box :full_history, { class: "mt-0.5 rounded border-slate-300" }, "true", nil %>
+        <span>
+          Every formula version
+          <%# Flagged in the Rails report §7.2 and worth surfacing here rather than letting an
+              operator infer it: the flag widens the formulas section only. %>
+          <span class="<%= hint_class %>">
+            Templates always export their current version only — replaying a full template
+            history would undo a rollback on re-import.
+          </span>
+        </span>
+      </label>
+
+      <%= form.submit "Export", class: "#{button_class(:primary)} w-full" %>
+    <% end %>
+  </div>
+</details>

data/app/views/acts_as_calculator_editor/shared/_flash.html.erb

@@ -0,0 +1,8 @@
+<% if flash.any? %>
+  <div class="mx-auto max-w-6xl px-6 pt-4">
+    <% flash.each do |kind, message| %>
+      <% tone = kind.to_s == "alert" ? "border-red-200 bg-red-50 text-red-800" : "border-emerald-200 bg-emerald-50 text-emerald-800" %>
+      <p class="flash flash-<%= kind %> mb-2 rounded-md border px-4 py-3 text-sm <%= tone %>" role="status"><%= message %></p>
+    <% end %>
+  </div>
+<% end %>

data/app/views/acts_as_calculator_editor/shared/_page_header.html.erb

@@ -0,0 +1,16 @@
+<%# Shared page heading: title, optional subtitle, optional back link, optional action slot. %>
+<div class="mb-6 flex flex-wrap items-end justify-between gap-4">
+  <div>
+    <% if local_assigns[:back_label].present? %>
+      <%= link_to back_label, back_path, class: "text-sm text-slate-500 hover:text-slate-900" %>
+    <% end %>
+    <h1 class="mt-1 text-2xl font-semibold tracking-tight text-slate-900"><%= title %></h1>
+    <% if local_assigns[:subtitle].present? %>
+      <p class="mt-1 text-sm text-slate-500"><%= subtitle %></p>
+    <% end %>
+  </div>
+
+  <% if local_assigns[:actions].present? %>
+    <div class="flex items-center gap-2"><%= actions %></div>
+  <% end %>
+</div>

data/app/views/acts_as_calculator_editor/shared/error.html.erb

@@ -0,0 +1,11 @@
+<% content_for :title, "Calculator editor — error" %>
+
+<h1 class="mb-6 text-2xl font-semibold tracking-tight">That didn't work</h1>
+
+<%= render "acts_as_calculator_editor/shared/error_message" %>
+
+<% if @error_type.present? %>
+  <p class="editor-error-type mb-6 font-mono text-xs text-slate-500"><%= @error_type %></p>
+<% end %>
+
+<p><%= link_to "Back to formulas", formulas_path, class: button_class(:secondary) %></p>

data/app/views/acts_as_calculator_editor/templates/_form.html.erb

@@ -0,0 +1,124 @@
+<%# Both body editors are rendered, and the `template-editor` controller decides which one is
+    visible and which one carries `name="template[body]"` — see the controller for why
+    swapping the name (rather than `disabled`) is what keeps the browser from submitting two
+    values. docs/lexxy-decision.md §4b: a `text` template's body is not HTML, so it keeps a
+    plain textarea; forcing Lexxy onto it would be the same HTML round-trip mistake the
+    formula field exists to avoid. %>
+<%= form_with url: templates_path, method: :post, scope: :template,
+              html: { class: "space-y-6" },
+              data: {
+                controller: "template-editor",
+                template_editor_auto_preview_value: "true"
+              } do |form| %>
+
+  <div class="grid gap-4 rounded-lg border border-slate-200 bg-white p-5 sm:grid-cols-3">
+    <div>
+      <%= form.label :key, "Key", class: label_class %>
+      <%= form.text_field :key, value: form_values["key"], required: true, class: field_class("font-mono") %>
+    </div>
+
+    <div>
+      <%= form.label :scope, "Scope", class: label_class %>
+      <%= form.text_field :scope, value: form_values["scope"], class: field_class("font-mono"),
+                          placeholder: ActsAsCalculator::DEFAULT_SCOPE %>
+    </div>
+
+    <div>
+      <%= form.label :format, "Format", class: label_class %>
+      <%= form.select :format, ActsAsCalculator::Template::FORMATS,
+                      { selected: form_values["format"] },
+                      class: field_class,
+                      data: {
+                        template_editor_target: "format",
+                        action: "change->template-editor#formatChanged"
+                      } %>
+      <span class="<%= hint_class %>">
+        <strong>html</strong> gets the rich text editor. <strong>text</strong> keeps a plain
+        textarea — its body is not HTML.
+      </span>
+    </div>
+  </div>
+
+  <div class="rounded-lg border border-slate-200 bg-white p-5">
+    <%= form.label :body, "Body (Liquid)", class: label_class %>
+
+    <%# --- format: html -> Lexxy ------------------------------------------------------
+        `lexxy_rich_text_area_tag` is the TAG-level helper: it takes a raw name and a raw
+        String, touches no ActionText model, and needs no `has_rich_text`
+        (docs/lexxy-decision.md §1). The element is form-associated
+        (`static formAssociated = true` + `ElementInternals.setFormValue`), so it submits
+        under its own `name` with no hidden input to sync.
+
+        The two blank data attributes are load-bearing. The helper assigns them with `||=`,
+        which short-circuits — supplying any truthy-or-present value means
+        `main_app.rails_direct_uploads_url` and `main_app.rails_service_blob_url` are never
+        evaluated, so a host that has not mounted ActiveStorage routes does not blow up here.
+        With `attachments: "false"` the JS never reads them either. %>
+    <div data-template-editor-target="htmlPane">
+      <%= lexxy_rich_text_area_tag "template[body]", form_values["body"],
+                                   id: "template_body",
+                                   attachments: "false",
+                                   class: "lexxy-content aac-lexxy",
+                                   data: {
+                                     direct_upload_url: "",
+                                     blob_url_template: "",
+                                     template_editor_target: "htmlInput",
+                                     action: "lexxy:change->template-editor#bodyChanged"
+                                   } do %>
+        <%= render "lexxy_toolbar" %>
+      <% end %>
+    </div>
+
+    <%# --- format: text -> plain textarea --------------------------------------------- %>
+    <div data-template-editor-target="textPane" hidden>
+      <%= text_area_tag "template[body]", form_values["body"],
+                        id: "template_body_text",
+                        rows: 14,
+                        spellcheck: false,
+                        class: field_class("font-mono text-sm"),
+                        data: {
+                          template_editor_target: "textInput",
+                          action: "input->template-editor#bodyChanged"
+                        } %>
+    </div>
+
+    <p class="<%= hint_class %>">
+      Liquid tags such as <code>{{ result.value | currency: '$' }}</code> and
+      <code>{% if %}</code> are plain text to the editor. Splitting one across bold or italic
+      breaks it — the preview below parses in strict mode and will say so, with a line number.
+    </p>
+  </div>
+
+  <div class="flex items-center gap-3">
+    <%= form.submit "Publish version", class: button_class(:primary) %>
+
+    <%# Same form, different action: preview posts the body being typed to a renderer that
+        needs no persisted row, so there is no "save a draft first" step.
+
+        `formnovalidate` so a preview works before `key` has been filled in — without it,
+        `requestSubmit` from the debounced auto-preview silently fails the required-field
+        check and the pane never updates.
+
+        This button is a SIBLING of the editors, and the frame it targets is a sibling too.
+        Keep it that way: if `template_preview` ever wraps the editor, Turbo tears down and
+        rebuilds <lexxy-editor> on every preview and the operator loses cursor position and
+        the entire undo stack. %>
+    <%= form.button "Preview", formaction: preview_templates_path, formmethod: :post,
+                    formnovalidate: true, name: nil,
+                    class: button_class(:secondary),
+                    data: {
+                      turbo_frame: "template_preview",
+                      template_editor_target: "previewButton"
+                    } %>
+
+    <span class="text-xs text-slate-500">Preview refreshes as you type.</span>
+  </div>
+<% end %>
+
+<div class="mt-6">
+  <%= turbo_frame_tag "template_preview" do %>
+    <div class="rounded-lg border border-dashed border-slate-300 bg-white p-5 text-sm text-slate-500">
+      Preview appears here.
+    </div>
+  <% end %>
+</div>