nti_receipt_builder 0.1.0 → 0.1.2

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 4493131823c3d523ede3d5e0c57b77caf81245f191dca1019ba5536cdf1dbc55
-  data.tar.gz: ce594bac64cd068754246e4cf62b90eed741e87c3dc5224dcdd570da267616db
+  metadata.gz: 0b3bc19f642f010633b3d388d30073da350288c55ba6b1a0cd23f83bade30302
+  data.tar.gz: 45c3e8238d843ed65013872971650cbc741c86b5f25e3f08aafaf03360ee4268
 SHA512:
-  metadata.gz: e8b7e1012da9720f4bba538fd3363a93fe4d349c75f6fd8de4c7d66c5dbc094c08b62603e643ebd19579494af386ed9931e9551dab09193cf2becf610006bbce
-  data.tar.gz: 916a9a7b7f8d7101e663227821564cd5d9391352189c95e465e16d5bd41069cbbcef1cfc915c17dcd481a70f7aac3e7ab37112619439b9b4c33adbc16ec5f61b
+  metadata.gz: e03c4aaf3e056d25fd714f2035a273a2f179797d634341cae8e1cef184628f0037175690704c2242edb90782b59b3585ed26273ff280ee93f39dbefa9cdbedb8
+  data.tar.gz: d309119820ba6c10419ee8460498378e12619da854a3ab941f431d0693adb4ba4294795b67d929ac121d53f2cc10118c3846d12f8dad515a9d49e12e18e7982e

data/CHANGELOG.md

@@ -1,8 +1,52 @@
 # Changelog
 
-## [0.1.0] - 2026-08-02
+## [0.1.2] - 2026-08-13
+
+- Paper geometry on the new-template page now reacts to the form. The page mounts `nrb-builder`
+  and targets the paper size, dimension, orientation and height mode fields, so the width and
+  height shown follow the selected preset instead of staying at whatever the model was
+  initialized with. `edit` already had this wiring.
+- Orientation now rewrites the dimensions rather than only the canvas: `settingsChanged` puts the
+  larger value on width for `landscape` and on height for `portrait`, and writes both back to the
+  inputs. Previously the pair was passed through untouched, so switching orientation left the
+  numbers — and the saved record — describing the other orientation.
+- Saved preview opens in a modal over the editor instead of a new tab.
+  `templates/preview.html.erb` is replaced by `templates/preview.turbo_stream.erb`, and the
+  preview link posts for a Turbo Stream. **Hosts overriding `templates/preview.html.erb` must
+  move that override to the Turbo Stream view.**
+- The Print button was the deleted preview page's only appearance, so nothing in the gem's views
+  links to `print` now. The action, route and `templates/print.html.erb` are unchanged — hosts
+  that need the button should add their own link to the `print` action.
+- Renamed the two preview affordances to say which state they render: "Live Preview" is now
+  "Draft Preview" (unsaved form state) and "Preview" is now "Saved Preview" (the persisted
+  record).
+- Canvas zoom in and out are real controls. Both glyphs were inert `<span>`s; they are now
+  buttons wired to `zoomIn`/`zoomOut`, and all three entry points share `setZoom`, which clamps
+  to 0.5–2.0 in 0.1 steps and syncs the range input back to the value.
+- Removed the canvas viewport's `max-height: 70vh` and let the panels size to content, so a tall
+  paper scrolls the page instead of being clipped inside the viewport.
+
+## [0.1.1] - 2026-08-04
 
-Initial release, extracted from SalesWiz's receipt builder.
+- Fixed layout edits being silently discarded on save. Serialization hung off
+  `turbo:submit-start`, which Turbo dispatches *after* the `FormSubmission` constructor has
+  snapshotted the request body, so the server re-saved the layout the page was rendered with.
+  The hidden field is now written from `layoutValueChanged` — every add, patch, move, resize and
+  delete reassigns `layoutValue`, so it can't go stale — with a `formdata` handler as a
+  submit-time backstop for a layout mutated in place.
+- Removed `Elements::MAX_ORDER_LINE_COLUMNS`. `LayoutValidator` now enforces only the lower
+  bound, since every column key must already be one of the host's declared collection columns and
+  duplicates are rejected — the host's own vocabulary is the ceiling. A host whose collection is
+  wider than six columns is no longer rejected.
+- Order line table cells wrap instead of truncating. `overflow-wrap: break-word` splits only a
+  word too long for its column on its own, so ordinary text still breaks at spaces.
+- Draft preview no longer trips a host's default-template uniqueness rule. The draft is built
+  with `dup`, which copied `is_default`, so the unsaved copy collided with the record it came
+  from and preview failed on exactly the templates most likely to be previewed. The flag is now
+  cleared on the draft; nothing in the layout or geometry reads it, so the render is unaffected.
+- Draft preview modal widened from `modal-lg` to `modal-xl`.
+
+## [0.1.0] - 2026-08-02
 
 - `NtiReceiptBuilder::Variables` — host-declared receipt vocabulary. `MAPPINGS` supplies keys
   and value methods; label, formatting type and preview sample are derived and overridable per

data/README.md

@@ -150,7 +150,7 @@ that omits it raises `NotImplementedError` instead of running an unscoped query.
 
 The concern provides `new`, `create`, `edit`, `update`, `destroy`, `preview`,
 `render_preview`, `print` and `set_default`. Define any of them in your controller to take
-over — a method on the including class wins. SalesWiz overrides `destroy`, for instance, to
+over — a method on the including class wins. Rails app overrides `destroy`, for instance, to
 archive rather than delete. The navigation hooks `after_create_path`, `after_destroy_path` and
 `after_set_default_path` are overridable too, and worth overriding if you have named routes.
 

data/app/assets/javascripts/nti_receipt_builder/receipt_builder_controller.js

@@ -233,17 +233,32 @@ export default class extends Controller {
   // Settings panel reactivity
 
   settingsChanged() {
-    if (!this.hasNrbCanvasOutlet) return
-    const canvas = this.nrbCanvasOutlet
-
-    if (this.hasWidthInputTarget) {
-      const value = parseFloat(this.widthInputTarget.value)
-      if (!Number.isNaN(value)) canvas.widthMmValue = value
-    }
-    if (this.hasHeightInputTarget) {
-      const value = parseFloat(this.heightInputTarget.value)
-      if (!Number.isNaN(value)) canvas.heightMmValue = value
+    const canvas = this.hasNrbCanvasOutlet ? this.nrbCanvasOutlet : null
+
+    const widthInput = this.hasWidthInputTarget ? parseFloat(this.widthInputTarget.value) : NaN
+    const heightInput = this.hasHeightInputTarget ? parseFloat(this.heightInputTarget.value) : NaN
+    const orientation = this.hasOrientationSelectTarget ? this.orientationSelectTarget.value : "portrait"
+
+    let widthValue = widthInput
+    let heightValue = heightInput
+
+    if (!Number.isNaN(widthValue) && !Number.isNaN(heightValue)) {
+      if (orientation === "landscape") {
+        widthValue = Math.max(widthInput, heightInput)
+        heightValue = Math.min(widthInput, heightInput)
+      } else {
+        widthValue = Math.min(widthInput, heightInput)
+        heightValue = Math.max(widthInput, heightInput)
+      }
     }
+
+    if (this.hasWidthInputTarget && !Number.isNaN(widthValue)) this.widthInputTarget.value = String(widthValue)
+    if (this.hasHeightInputTarget && !Number.isNaN(heightValue)) this.heightInputTarget.value = String(heightValue)
+
+    if (!canvas) return
+
+    if (this.hasWidthInputTarget && !Number.isNaN(widthValue)) canvas.widthMmValue = widthValue
+    if (this.hasHeightInputTarget && !Number.isNaN(heightValue)) canvas.heightMmValue = heightValue
     if (this.hasHeightModeSelectTarget) canvas.heightModeValue = this.heightModeSelectTarget.value
     if (this.hasMarginTopInputTarget) canvas.marginTopMmValue = parseFloat(this.marginTopInputTarget.value) || 0
     if (this.hasMarginRightInputTarget) canvas.marginRightMmValue = parseFloat(this.marginRightInputTarget.value) || 0

data/app/assets/javascripts/nti_receipt_builder/receipt_canvas_controller.js

@@ -2,6 +2,9 @@ import { Controller } from "@hotwired/stimulus"
 
 const PX_PER_MM_AT_100 = 96 / 25.4
 const MIN_ELEMENT_DIMENSION_MM = 1.0
+const MIN_ZOOM = 0.5
+const MAX_ZOOM = 2.0
+const ZOOM_STEP = 0.1
 // Keep in sync with NtiReceiptBuilder::Presenters::Collection.
 const MM_PER_PT = 0.3528
 const LINE_HEIGHT_FACTOR = 1.25
@@ -99,11 +102,25 @@ export default class extends Controller {
   }
 
   zoomChanged(event) {
-    this.zoomValue = parseFloat(event.target.value)
+    this.setZoom(parseFloat(event.target.value))
+  }
+
+  zoomIn() {
+    this.setZoom(this.zoomValue + ZOOM_STEP)
+  }
+
+  zoomOut() {
+    this.setZoom(this.zoomValue - ZOOM_STEP)
+  }
+
+  setZoom(value) {
+    const nextValue = Math.min(MAX_ZOOM, Math.max(MIN_ZOOM, value))
+    this.zoomValue = Number(nextValue.toFixed(1))
   }
 
   zoomValueChanged(value) {
     if (this.hasZoomLabelTarget) this.zoomLabelTarget.textContent = `${Math.round(value * 100)}%`
+    if (this.hasZoomRangeTarget) this.zoomRangeTarget.value = String(value)
     this.applyZoom()
   }
 

data/app/assets/stylesheets/nti_receipt_builder.css

@@ -47,9 +47,10 @@
   background: #fff;
   border: 1px solid rgba(31, 41, 55, 0.06);
   box-shadow: 0 1.25rem 2.5rem -1.5rem rgba(31, 41, 55, 0.25);
+  height: auto;
 }
 .nrb-receipt-panel .card-title { margin-bottom: 0.85rem; }
-.nrb-receipt-panel--canvas { display: flex; flex-direction: column; gap: 1rem; }
+.nrb-receipt-panel--canvas { display: flex; flex-direction: column; gap: 1rem; height: auto; }
 .nrb-receipt-hint { font-size: 0.82rem; margin: 0.5rem 0 0; }
 
 /* ---- Elements palette (draggable variable/block buttons) ---- */
@@ -103,7 +104,6 @@
 .nrb-receipt-viewport {
   flex: 1 1 auto;
   min-height: 28rem;
-  max-height: 70vh;
   overflow: auto;
   padding: 2rem;
   background: rgba(31, 41, 55, 0.03);
@@ -236,3 +236,12 @@
 .nrb-receipt-overflow-banner { margin-bottom: 1.25rem; }
 .nrb-receipt-preview-modal .nrb-receipt-preview-frame { max-height: 65vh; overflow-y: auto; }
 
+.btn-xs {
+  padding: 0.15rem 0.4rem;
+  border:none;
+  box-shadow: none;
+}
+
+.material-symbols-outlined{
+  font-size: 18px;
+}

data/app/controllers/concerns/nti_receipt_builder/templates_controller.rb

@@ -84,6 +84,11 @@ module NtiReceiptBuilder
 
       @draft = @receipt_template.dup
       @draft.assign_attributes(form.attributes.except(:lock_version))
+      # A preview is never anyone's default. `dup` copies the flag, so a host enforcing one
+      # default per owner saw the unsaved draft collide with the very record it was copied from,
+      # and Live Preview failed on precisely the templates most likely to be previewed. Clearing
+      # it cannot change the render — nothing in the layout or geometry reads it.
+      @draft.is_default = false
 
       if !form.valid?
         @render_result = nil

data/app/views/nti_receipt_builder/templates/_canvas.html.erb

@@ -12,11 +12,17 @@
   <div class="nrb-receipt-toolbar">
     <h3 class="card-title mb-0">Canvas</h3>
     <div class="nrb-receipt-zoom">
-      <span class="material-symbols-outlined">zoom_out</span>
+      <button type="button" class="btn btn-xs" aria-label="Zoom out"
+          data-action="click->nrb-canvas#zoomOut">
+        <span class="material-symbols-outlined" aria-hidden="true">zoom_out</span>
+      </button>
       <input type="range" min="0.5" max="2" step="0.1" value="1"
           data-nrb-canvas-target="zoomRange"
           data-action="input->nrb-canvas#zoomChanged">
-      <span class="material-symbols-outlined">zoom_in</span>
+      <button type="button" class="btn btn-xs" aria-label="Zoom in"
+          data-action="click->nrb-canvas#zoomIn">
+        <span class="material-symbols-outlined" aria-hidden="true">zoom_in</span>
+      </button>
       <span class="nrb-receipt-zoom-label" data-nrb-canvas-target="zoomLabel">100%</span>
     </div>
   </div>

data/app/views/nti_receipt_builder/templates/edit.html.erb

@@ -26,11 +26,11 @@
       <span class="text-secondary"><%= @receipt_template.paper_width_mm %>mm × <%= @receipt_template.paper_height_mm %>mm</span>
     </div>
     <div class="d-flex justify-content-end gap-2">
-      <%= f.button 'Live Preview', type: 'submit', class: 'btn btn-outline-secondary',
+      <%= f.button 'Draft Preview', type: 'submit', class: 'btn btn-outline-secondary',
           formaction: url_for(action: :render_preview, id: @receipt_template.id), formmethod: :post %>
       <%= link_to url_for(action: :preview, id: @receipt_template.id),
-          class: 'btn btn-outline-secondary', target: '_blank', rel: 'noopener' do %>
-        <span class="material-symbols-outlined pe-1">visibility</span>Preview
+          class: 'btn btn-outline-secondary', data: { turbo_stream: true, turbo_method: :post } do %>
+        <span class="material-symbols-outlined pe-1">visibility</span>Saved Preview
       <% end %>
       <%= link_to 'Back to Templates', url_for(action: :index), class: 'btn btn-secondary' %>
       <%= f.submit 'Save', class: 'btn btn-primary' %>

data/app/views/nti_receipt_builder/templates/new.html.erb

@@ -1,6 +1,10 @@
 <%= content_for :title, 'New Receipt Template' %>
 
-<%= form_with model: @receipt_template, url: url_for(action: :create), scope: :receipt_template do |f| %>
+<%= form_with model: @receipt_template, url: url_for(action: :create), scope: :receipt_template,
+    data: {
+      controller: 'nrb-builder',
+      nrb_builder_presets_value: NtiReceiptBuilder::Template::PAPER_PRESETS.to_json
+    } do |f| %>
   <h3 class="card-title">Receipt Template</h3>
   <div id="errors">
     <% if @errors.present? %>
@@ -20,7 +24,11 @@
         <%= f.select :paper_size_key,
             NtiReceiptBuilder::Template::PAPER_PRESETS.map { |key, preset| [preset[:label], key] },
             {},
-            class: 'form-select' %>
+            class: 'form-select',
+            data: {
+              nrb_builder_target: 'paperSizeSelect',
+              action: 'change->nrb-builder#paperPresetChanged'
+            } %>
       </div>
 
       <div class="row g-3">
@@ -30,7 +38,11 @@
             <%= f.number_field :paper_width_mm, step: 0.1,
                 min: NtiReceiptBuilder::Template::MIN_PAPER_DIMENSION_MM,
                 max: NtiReceiptBuilder::Template::MAX_PAPER_DIMENSION_MM,
-                class: 'form-control' %>
+                class: 'form-control',
+                data: {
+                  nrb_builder_target: 'widthInput',
+                  action: 'input->nrb-builder#settingsChanged'
+                } %>
           </div>
         </div>
         <div class="col">
@@ -39,7 +51,11 @@
             <%= f.number_field :paper_height_mm, step: 0.1,
                 min: NtiReceiptBuilder::Template::MIN_PAPER_DIMENSION_MM,
                 max: NtiReceiptBuilder::Template::MAX_PAPER_DIMENSION_MM,
-                class: 'form-control' %>
+                class: 'form-control',
+                data: {
+                  nrb_builder_target: 'heightInput',
+                  action: 'input->nrb-builder#settingsChanged'
+                } %>
           </div>
         </div>
       </div>
@@ -51,7 +67,11 @@
             <%= f.select :orientation,
                 NtiReceiptBuilder::Template::ORIENTATIONS.map { |value| [value.titleize, value] },
                 {},
-                class: 'form-select' %>
+                class: 'form-select',
+                data: {
+                  nrb_builder_target: 'orientationSelect',
+                  action: 'change->nrb-builder#settingsChanged'
+                } %>
           </div>
         </div>
         <div class="col">
@@ -60,7 +80,11 @@
             <%= f.select :height_mode,
                 [['Fixed Height', 'fixed'], ['Grows With Content', 'content']],
                 {},
-                class: 'form-select' %>
+                class: 'form-select',
+                data: {
+                  nrb_builder_target: 'heightModeSelect',
+                  action: 'change->nrb-builder#settingsChanged'
+                } %>
           </div>
         </div>
       </div>

data/app/views/nti_receipt_builder/templates/preview.turbo_stream.erb

@@ -0,0 +1,22 @@
+<%= turbo_stream.open_modal size: 'modal-xl' do %>
+  <div class="modal-header">
+    <h1 class="modal-title">Saved Preview</h1>
+    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+  </div>
+
+  <div class="modal-body nrb-receipt-preview-modal">
+    <% if @render_result.overflow? %>
+      <%= render 'nti_receipt_builder/render/overflow_banner' %>
+    <% end %>
+
+    <div class="nrb-receipt-preview-frame">
+      <%= render 'nti_receipt_builder/render/paper',
+          receipt_template: @receipt_template,
+          render_result: @render_result %>
+    </div>
+  </div>
+
+  <div class="modal-footer">
+    <button type="button" class="btn btn-primary" data-bs-dismiss="modal">Close</button>
+  </div>
+<% end %>

data/app/views/nti_receipt_builder/templates/render_preview.turbo_stream.erb

@@ -1,6 +1,6 @@
-<%= turbo_stream.open_modal size: 'modal-lg' do %>
+<%= turbo_stream.open_modal size: 'modal-xl' do %>
   <div class="modal-header">
-    <h1 class="modal-title">Live Preview</h1>
+    <h1 class="modal-title">Draft Preview</h1>
     <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
   </div>
   <div class="modal-body nrb-receipt-preview-modal">

data/lib/nti_receipt_builder/version.rb

@@ -1,5 +1,5 @@
 # frozen_string_literal: true
 
 module NtiReceiptBuilder
-  VERSION = '0.1.0'
+  VERSION = '0.1.2'
 end

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: nti_receipt_builder
 version: !ruby/object:Gem::Version
-  version: 0.1.0
+  version: 0.1.2
 platform: ruby
 authors:
 - Den Meralpis
@@ -120,7 +120,7 @@ files:
 - app/views/nti_receipt_builder/templates/create.turbo_stream.erb
 - app/views/nti_receipt_builder/templates/edit.html.erb
 - app/views/nti_receipt_builder/templates/new.html.erb
-- app/views/nti_receipt_builder/templates/preview.html.erb
+- app/views/nti_receipt_builder/templates/preview.turbo_stream.erb
 - app/views/nti_receipt_builder/templates/print.html.erb
 - app/views/nti_receipt_builder/templates/render_preview.turbo_stream.erb
 - app/views/nti_receipt_builder/templates/update.turbo_stream.erb

data/app/views/nti_receipt_builder/templates/preview.html.erb

@@ -1,24 +0,0 @@
-<% content_for :title, "Preview: #{@receipt_template.name}" %>
-<% content_for :cardless, true %>
-
-<div class="nrb-receipt-topbar">
-  <div>
-    <span class="nrb-receipt-topbar-name"><%= @receipt_template.name %></span>
-    <span class="text-secondary"><%= @receipt_template.paper_width_mm %>mm &times; <%= @receipt_template.paper_height_mm %>mm</span>
-  </div>
-  <div class="d-flex justify-content-end gap-2">
-    <%= link_to url_for(action: :print, id: @receipt_template.id),
-        class: 'btn btn-outline-secondary', target: '_blank', rel: 'noopener' do %>
-      <span class="material-symbols-outlined pe-1">print</span>Print
-    <% end %>
-    <%= link_to 'Back to Editor', url_for(action: :edit, id: @receipt_template.id), class: 'btn btn-secondary' %>
-  </div>
-</div>
-
-<% if @render_result.overflow? %>
-  <%= render 'nti_receipt_builder/render/overflow_banner' %>
-<% end %>
-
-<div class="nrb-receipt-preview-frame">
-  <%= render 'nti_receipt_builder/render/paper', receipt_template: @receipt_template, render_result: @render_result %>
-</div>