keystone_ui-pages 0.1.0

data/config/routes.rb

@@ -0,0 +1,31 @@
+# frozen_string_literal: true
+
+KeystoneUi::Pages::Engine.routes.draw do
+  namespace :manage do
+    resources :pages, only: %i[index new create show] do
+      post :publish, on: :member
+      resources :elements, only: %i[create update] do
+        post :bind, on: :member
+      end
+      resources :sections, only: %i[create]
+      resources :columns, only: %i[create]
+      resources :rows, only: %i[create]
+      resources :nodes, only: %i[update destroy] do
+        post :move, on: :member
+        post :duplicate, on: :member
+        post :condition, on: :member
+      end
+      resource :document, only: %i[update]
+      post :sample, to: "samples#update"
+      post :undo, to: "edit_history#undo"
+      post :redo, to: "edit_history#redo"
+      resource :live, only: %i[show]
+      resource :pdf, only: %i[show]
+      resources :versions, only: %i[index show] do
+        post :restore, on: :member
+      end
+    end
+  end
+
+  get ":slug", to: "pages#show", as: :page
+end

data/db/migrate/20261014120000_create_keystone_ui_pages_pages.rb

@@ -0,0 +1,17 @@
+# frozen_string_literal: true
+
+class CreateKeystoneUiPagesPages < ActiveRecord::Migration[7.1]
+  def change
+    create_table :keystone_ui_pages_pages do |t|
+      t.string :name, null: false
+      t.string :slug, null: false
+      t.json :document, null: false
+      t.references :owner, polymorphic: true
+
+      t.timestamps
+    end
+
+    add_index :keystone_ui_pages_pages, [ :owner_type, :owner_id, :slug ], unique: true,
+      name: "index_keystone_ui_pages_pages_on_owner_and_slug"
+  end
+end

data/db/migrate/20261014120001_create_keystone_ui_pages_versions.rb

@@ -0,0 +1,18 @@
+# frozen_string_literal: true
+
+class CreateKeystoneUiPagesVersions < ActiveRecord::Migration[7.1]
+  def change
+    create_table :keystone_ui_pages_versions do |t|
+      t.references :page, null: false, foreign_key: { to_table: :keystone_ui_pages_pages }
+      t.integer :number, null: false
+      t.json :document, null: false
+      t.string :status, null: false
+
+      t.timestamps
+    end
+
+    add_index :keystone_ui_pages_versions, [ :page_id, :number ], unique: true
+    add_index :keystone_ui_pages_versions, :page_id, unique: true, where: "status = 'live'",
+      name: "index_keystone_ui_pages_versions_on_one_live_per_page"
+  end
+end

data/db/migrate/20261015130000_create_keystone_ui_pages_pdfs.rb

@@ -0,0 +1,14 @@
+# frozen_string_literal: true
+
+class CreateKeystoneUiPagesPdfs < ActiveRecord::Migration[7.1]
+  def change
+    create_table :keystone_ui_pages_pdfs do |t|
+      t.references :version, null: false, foreign_key: { to_table: :keystone_ui_pages_versions }
+      t.string :values_digest, null: false
+
+      t.timestamps
+    end
+
+    add_index :keystone_ui_pages_pdfs, [ :version_id, :values_digest ], unique: true
+  end
+end

data/db/migrate/20261016120000_add_edit_history_to_keystone_ui_pages_pages.rb

@@ -0,0 +1,8 @@
+# frozen_string_literal: true
+
+class AddEditHistoryToKeystoneUiPagesPages < ActiveRecord::Migration[7.1]
+  def change
+    add_column :keystone_ui_pages_pages, :undo_history, :json
+    add_column :keystone_ui_pages_pages, :undone_changes, :json
+  end
+end

data/lib/keystone_ui/pages/catalog.rb

@@ -0,0 +1,29 @@
+# frozen_string_literal: true
+
+module KeystoneUi
+  module Pages
+    class Catalog
+      Element = Data.define(:key, :name, :component, :fields, :body, :icon, :group, :align)
+
+      def initialize
+        @elements = {}
+      end
+
+      def register(key:, name:, component:, fields:, body: nil, icon: nil, group: nil, align: nil)
+        @elements[key.to_sym] = Element.new(key: key.to_sym, name: name, component: component, fields: fields, body: body, icon: icon, group: group, align: align)
+      end
+
+      def leave_out(*keys)
+        keys.each { |key| @elements.delete(key.to_sym) }
+      end
+
+      def elements
+        @elements.values
+      end
+
+      def find(key)
+        @elements[key.to_sym]
+      end
+    end
+  end
+end

data/lib/keystone_ui/pages/document.rb

@@ -0,0 +1,29 @@
+# frozen_string_literal: true
+
+require "securerandom"
+
+module KeystoneUi
+  module Pages
+    module Document
+      SCHEMA_VERSION = 1
+
+      module_function
+
+      def blank
+        { "schema_version" => SCHEMA_VERSION, "sections" => [ section ] }
+      end
+
+      def section
+        { "id" => SecureRandom.uuid, "rows" => [ row ] }
+      end
+
+      def row
+        { "id" => SecureRandom.uuid, "columns" => [ column ] }
+      end
+
+      def column
+        { "id" => SecureRandom.uuid, "elements" => [] }
+      end
+    end
+  end
+end

data/lib/keystone_ui/pages/engine.rb

@@ -0,0 +1,25 @@
+# frozen_string_literal: true
+
+require "rails"
+require "keystone_ui"
+require "keystone_ui-react"
+require "keystone_ui/react/mount_helper"
+
+module KeystoneUi
+  module Pages
+    class Engine < ::Rails::Engine
+      isolate_namespace KeystoneUi::Pages
+
+      initializer "keystone_ui_pages.host_helper" do
+        ActiveSupport.on_load(:action_view) { include KeystoneUi::Pages::HostHelper }
+      end
+
+      initializer "keystone_ui_pages.tailwind" do
+        KeystoneUi.configuration.tailwind_sources << root.join("app/views/**/*.erb").to_s
+        KeystoneUi.configuration.tailwind_sources << root.join("app/helpers/**/*.rb").to_s
+        KeystoneUi.configuration.tailwind_sources << root.join("app/javascript/**/*.{js,jsx}").to_s
+        KeystoneUi.configuration.tailwind_sources << root.join("lib/keystone_ui/pages/**/*.rb").to_s
+      end
+    end
+  end
+end

data/lib/keystone_ui/pages/keystone_elements.rb

@@ -0,0 +1,109 @@
+# frozen_string_literal: true
+
+module KeystoneUi
+  module Pages
+    module KeystoneElements
+      module_function
+
+      def register(catalog)
+        catalog.register(key: :button, name: "Button", component: :ui_button, icon: :cursor, group: "Basics", align: "start",
+          fields: [ { key: :label, label: "Label", default: "Button" }, { key: :href, label: "Address" } ])
+        catalog.register(key: :progress, name: "Progress", component: :ui_progress, icon: :progress, group: "Data",
+          fields: [ { key: :value, label: "Value", kind: :number, default: "0" }, { key: :max, label: "Out of", kind: :number, default: "100" }, { key: :label, label: "Label", kind: :text, default: "Progress" } ])
+        catalog.register(key: :alert, name: "Alert", component: :ui_alert, icon: :alert, group: "Text",
+          fields: [ { key: :message, label: "Message", kind: :long_text, default: "Something worth knowing." }, { key: :title, label: "Title", kind: :text },
+                    { key: :type, label: "Type", kind: :one_of, options: %w[info success warning error], default: "info" },
+                    { key: :dismissible, label: "Can be dismissed", kind: :yes_or_no } ])
+        catalog.register(key: :code, name: "Code", component: :ui_code, icon: :code, group: "Text", body: :code,
+          fields: [ { key: :code, label: "Code", kind: :long_text, default: "puts \"Hello\"" }, { key: :language, label: "Language", kind: :text },
+                    { key: :caption, label: "Caption", kind: :text } ])
+        catalog.register(key: :heading, name: "Heading", component: :ui_heading, icon: :heading, group: "Text",
+          fields: [ { key: :text, label: "Text", kind: :text, default: "Heading" },
+                    { key: :size, label: "Size", kind: :one_of, options: %w[sm md lg], default: "md" },
+                    { key: :note, label: "Note", kind: :text } ])
+        catalog.register(key: :label, name: "Label", component: :ui_caption, icon: :tag, group: "Text",
+          fields: [ { key: :text, label: "Text", kind: :text, default: "Label" } ])
+        catalog.register(key: :paragraph, name: "Paragraph", component: :ui_paragraph, icon: :text, group: "Text",
+          fields: [ { key: :text, label: "Text", kind: :long_text, default: "Write the text of this paragraph here." } ])
+        catalog.register(key: :hero, name: "Hero", component: :ui_hero, icon: :heading, group: "Text",
+          fields: [ { key: :title, label: "Title", kind: :text, default: "Headline" },
+                    { key: :subtitle, label: "Subtitle", kind: :long_text },
+                    { key: :badge, label: "Badge", kind: :text },
+                    { key: :layout, label: "Layout", kind: :one_of, options: %w[split centered], default: "split" },
+                    { key: :height, label: "Height", kind: :one_of, options: %w[content tall full_screen], default: "tall",
+                      classes: { "content" => "[&_.ks-hero]:min-h-0", "tall" => "[&_.ks-hero]:min-h-[28rem]", "full_screen" => "[&_.ks-hero]:min-h-screen" } } ])
+        catalog.register(key: :cta_banner, name: "Call to action", component: :ui_cta_banner, icon: :megaphone, group: "Content", body: :text,
+          fields: [ { key: :title, label: "Title", kind: :text, default: "Ready to start?" },
+                    { key: :subtitle, label: "Subtitle", kind: :text },
+                    { key: :text, label: "Text", kind: :long_text } ])
+        catalog.register(key: :card, name: "Card", component: :ui_card, icon: :card, group: "Content",
+          fields: [ { key: :title, label: "Title", kind: :text, default: "Card title" },
+                    { key: :summary, label: "Summary", kind: :long_text },
+                    { key: :link, label: "Link", kind: :address, default: "#" },
+                    { key: :cta, label: "Link text", kind: :text, default: "Read more" } ])
+        catalog.register(key: :stat_card, name: "Stat", component: :ui_stat_card, icon: :chart, group: "Data",
+          fields: [ { key: :label, label: "Label", kind: :text, default: "Label" },
+                    { key: :value, label: "Value", kind: :text, default: "0" },
+                    { key: :suffix, label: "Suffix", kind: :text },
+                    { key: :variant, label: "Tone", kind: :one_of, options: %w[neutral success danger warning info], default: "neutral" },
+                    { key: :note, label: "Note", kind: :text },
+                    { key: :plain, label: "Plain", kind: :yes_or_no },
+                    { key: :fallback, label: "When missing", kind: :text, default: "N/A" } ])
+        catalog.register(key: :figure, name: "Figure", component: :ui_figure, icon: :number, group: "Data",
+          fields: [ { key: :text, label: "Text", kind: :text, default: "0" },
+                    { key: :tone, label: "Tone", kind: :one_of, options: %w[neutral success danger], default: "neutral" } ])
+        catalog.register(key: :info, name: "Info", component: :ui_info, icon: :info, group: "Text", body: :detail,
+          fields: [ { key: :summary, label: "Summary", kind: :text, default: "More information" },
+                    { key: :detail, label: "Detail", kind: :long_text } ])
+        catalog.register(key: :badge, name: "Badge", component: :ui_badge, icon: :tag, group: "Basics", align: "start",
+          fields: [ { key: :label, label: "Label", kind: :text, default: "Badge" },
+                    { key: :variant, label: "Tone", kind: :one_of, options: %w[neutral success danger warning info], default: "neutral" } ])
+        catalog.register(key: :copy_button, name: "Copy button", component: :ui_copy_button, icon: :copy, group: "Basics", align: "start",
+          fields: [ { key: :text, label: "Text to copy", kind: :text },
+                    { key: :label, label: "Label", kind: :text, default: "Copy" } ])
+        catalog.register(key: :feature_grid, name: "Feature grid", component: :ui_feature_grid, icon: :card, group: "Content",
+          fields: [ { key: :title, label: "Title", kind: :text, default: "Why teams choose us" },
+                    { key: :subtitle, label: "Subtitle", kind: :text },
+                    { key: :features, label: "Features", kind: :list,
+                      entry: [ { key: :title, label: "Title", kind: :text }, { key: :description, label: "Description", kind: :long_text },
+                               { key: :icon, label: "Icon", kind: :text, hidden: true,
+                                 default: '<svg viewBox="0 0 24 24" class="size-6 fill-none stroke-current stroke-2"><path d="M5 12l5 5L20 7"/></svg>' } ],
+                      default: [ { "title" => "Fast", "description" => "Pages load quickly." },
+                                 { "title" => "Clear", "description" => "Every page reads plainly." },
+                                 { "title" => "Yours", "description" => "Built from your own components." } ] } ])
+        catalog.register(key: :accordion, name: "Accordion", component: :ui_accordion, icon: :code, group: "Text",
+          fields: [ { key: :items, label: "Questions", kind: :list,
+                      entry: [ { key: :question, label: "Question", kind: :text }, { key: :answer, label: "Answer", kind: :long_text } ],
+                      default: [ { "question" => "What is this?", "answer" => "A question visitors often ask." },
+                                 { "question" => "How does it work?", "answer" => "The answer opens below its question." } ] } ])
+        catalog.register(key: :data_table, name: "Table", component: :ui_data_table, icon: :card, group: "Data",
+          fields: [ { key: :items, label: "Rows", kind: :data,
+                      default: [ { "name" => "First row", "status" => "Open" }, { "name" => "Second row", "status" => "Closed" } ] },
+                    { key: :columns, label: "Columns", kind: :list, as: :pairs,
+                      entry: [ { key: :key, label: "Key", kind: :text }, { key: :label, label: "Heading", kind: :text },
+                               { key: :align, label: "Align", kind: :one_of, options: %w[start end] } ],
+                      default: [ { "key" => "name", "label" => "Name" }, { "key" => "status", "label" => "Status" } ] },
+                    { key: :group_by, label: "Group rows by key", kind: :text, as: :key },
+                    { key: :group_totals, label: "Group subtotals", kind: :data },
+                    { key: :total, label: "Total row", kind: :data } ])
+        catalog.register(key: :value_list, name: "Label and value list", component: :ui_value_list, icon: :list, group: "Data",
+          fields: [ { key: :rows, label: "Rows", kind: :list,
+                      entry: [ { key: :label, label: "Label", kind: :text }, { key: :value, label: "Value", kind: :text },
+                               { key: :note, label: "Note", kind: :text }, { key: :total, label: "Total", kind: :yes_or_no },
+                               { key: :fallback, label: "When missing", kind: :text, default: "N/A" } ],
+                      default: [ { "label" => "Prepared by", "value" => "Your team" },
+                                 { "label" => "Prepared for", "value" => "Your client" },
+                                 { "label" => "Issued", "value" => "1 October" } ] },
+                    { key: :align, label: "Values", kind: :one_of, options: %w[start end], default: "start" } ])
+        catalog.register(key: :bar_chart, name: "Bar chart", component: :ui_bar_chart, icon: :bars, group: "Data",
+          fields: [ { key: :bars, label: "Bars", kind: :data,
+                      default: [ { "label" => "Mon", "value" => "3" }, { "label" => "Tue", "value" => "5" }, { "label" => "Wed", "value" => "2" },
+                                 { "label" => "Sat", "value" => "1", "shaded" => true } ] },
+                    { key: :show_values, label: "Show values", kind: :yes_or_no, default: "true" } ])
+        catalog.register(key: :line_chart, name: "Line chart", component: :ui_line_chart, icon: :chart, group: "Data",
+          fields: [ { key: :series, label: "Series", kind: :data, default: [ { "name" => "Visits", "data" => [ 3, 5, 4, 7 ] } ] },
+                    { key: :labels, label: "Labels", kind: :data, default: %w[Mon Tue Wed Thu] } ])
+      end
+    end
+  end
+end

data/lib/keystone_ui/pages/operations.rb

@@ -0,0 +1,246 @@
+# frozen_string_literal: true
+
+require "digest"
+require "json"
+require "securerandom"
+require "keystone_ui/pages"
+require "keystone_ui/pages/document"
+require "keystone_ui/pages/values"
+
+module KeystoneUi
+  module Pages
+    class InvalidDocument < StandardError; end
+
+    module Operations
+      WIDTHS = %w[1/1 3/4 2/3 1/2 1/3 1/4].freeze
+      ARRANGEMENTS = {
+        section: { "spacing" => %w[sm md lg] },
+        row: { "gap" => %w[sm md lg xl] },
+        column: { "wide" => WIDTHS, "narrow" => WIDTHS, "align" => %w[top center bottom] },
+        element: { "align" => %w[stretch start center end] }
+      }.freeze
+      DEFAULTS = {
+        section: { "spacing" => "md" },
+        row: { "gap" => "md" },
+        column: { "narrow" => "1/1", "align" => "top" },
+        element: { "align" => "stretch" }
+      }.freeze
+      SHARES = { 1 => "1/1", 2 => "1/2", 3 => "1/3", 4 => "1/4" }.freeze
+
+      module_function
+
+      def add(document, key, column_id:, catalog: Pages.catalog)
+        defined(catalog, key)
+        copied(document).tap do |changed|
+          column(changed, column_id)["elements"] << { "id" => SecureRandom.uuid, "key" => key.to_s, "fields" => {} }
+        end
+      end
+
+      def add_section(document)
+        copied(document).tap { |changed| changed["sections"] << Document.section }
+      end
+
+      def add_row(document, section_id:)
+        copied(document).tap { |changed| node(changed, section_id)["rows"] << Document.row }
+      end
+
+      def add_column(document, row_id:)
+        copied(document).tap { |changed| node(changed, row_id)["columns"] << Document.column }
+      end
+
+      def arrange(document, node_id:, setting:, value:)
+        offered_arrangement(kind(document, node_id), setting.to_s, value)
+        copied(document).tap do |changed|
+          node(changed, node_id)[setting.to_s] = value
+          fitting(changed, setting.to_s) if %w[wide narrow].include?(setting.to_s)
+        end
+      end
+
+      def fitting(document, screen)
+        document["sections"].each.with_index(1) do |section, section_number|
+          section["rows"].each.with_index(1) do |row, row_number|
+            next if row["columns"].sum { |column| Rational(column[screen] || "0") } <= 1
+
+            raise InvalidDocument, "Row #{row_number} of section #{section_number} is wider than the page on #{screen} screens"
+          end
+        end
+      end
+
+      def offered_arrangement(kind, setting, value)
+        return if ARRANGEMENTS.fetch(kind).fetch(setting, []).include?(value)
+
+        raise InvalidDocument, "A #{kind}'s #{setting} cannot be #{value}"
+      end
+
+      def kind(document, node_id)
+        sections = document["sections"]
+        return :section if sections.any? { |section| section["id"] == node_id }
+        return :row if sections.flat_map { |section| section["rows"] }.any? { |row| row["id"] == node_id }
+        return :column if column(document, node_id)
+
+        :element
+      end
+
+      def move(document, node_id:, into:, position:)
+        present(document, node_id)
+        outside(document, node_id, into)
+        copied(document).tap do |changed|
+          moved = node(changed, node_id)
+          parent_list(changed, node_id).delete(moved)
+          children(changed, into).insert(position.to_i, moved)
+        end
+      end
+
+      def outside(document, node_id, into)
+        return unless inside(node(document, node_id)).any? { |child| child["id"] == into }
+
+        raise InvalidDocument, "A #{kind(document, node_id)} cannot be moved into something inside it"
+      end
+
+      def inside(node)
+        children = node.values_at("rows", "columns", "elements").compact.flatten
+        children + children.flat_map { |child| inside(child) }
+      end
+
+      def present(document, node_id)
+        node(document, node_id) or raise InvalidDocument, "Nothing in this page has the id #{node_id}"
+      end
+
+      def parent_list(document, node_id)
+        lists(document).find { |list| list.any? { |child| child["id"] == node_id } }
+      end
+
+      def lists(document)
+        sections = document["sections"]
+        rows = sections.flat_map { |section| section["rows"] }
+        [ sections ] + sections.map { |section| section["rows"] } + rows.map { |row| row["columns"] } + columns(document).map { |column| column["elements"] }
+      end
+
+      def children(document, parent_id)
+        return document["sections"] if parent_id.nil?
+
+        parent = node(document, parent_id)
+        parent["rows"] || parent["columns"] || parent["elements"]
+      end
+
+      def duplicate(document, node_id:)
+        present(document, node_id)
+        copied(document).tap do |changed|
+          siblings = parent_list(changed, node_id)
+          original = siblings.find { |child| child["id"] == node_id }
+          siblings.insert(siblings.index(original) + 1, renewed(copied(original)))
+        end
+      end
+
+      def renewed(node)
+        node.merge("id" => SecureRandom.uuid).tap do |copy|
+          %w[rows columns elements].each { |list| copy[list] = copy[list].map { |child| renewed(child) } if copy.key?(list) }
+        end
+      end
+
+      def remove(document, node_id:)
+        present(document, node_id)
+        held = held_elements(node(document, node_id))
+        raise InvalidDocument, "This #{kind(document, node_id)} holds #{held} #{held == 1 ? 'element' : 'elements'}, so it cannot be removed" if held.positive?
+
+        copied(document).tap { |changed| parent_list(changed, node_id).reject! { |child| child["id"] == node_id } }
+      end
+
+      def held_elements(node)
+        return 0 if node.key?("key")
+        return node["elements"].size if node.key?("elements")
+
+        (node["rows"] || node["columns"]).sum { |child| held_elements(child) }
+      end
+
+      def show_when(document, node_id:, name:, equals:)
+        raise InvalidDocument, "A column cannot be shown or hidden by a value" if kind(document, node_id) == :column
+        return copied(document).tap { |changed| node(changed, node_id).delete("show_when") } if name.blank?
+
+        raise InvalidDocument, "No value is named #{name}" unless Values.label(name)
+
+        copied(document).tap do |changed|
+          node(changed, node_id)["show_when"] = { "value" => name.to_s, "equals" => equals.to_s }
+        end
+      end
+
+      def bind(document, element_id:, field:, name:, fallback: nil, catalog: Pages.catalog)
+        raise InvalidDocument, "No value is named #{name}" unless Values.label(name)
+
+        copied(document).tap do |changed|
+          element = element(changed, element_id)
+          offered(defined(catalog, element["key"]), field)
+          element["fields"][field.to_s] = { "value" => name.to_s, "fallback" => fallback }
+        end
+      end
+
+      def set(document, element_id:, field:, value:, catalog: Pages.catalog)
+        copied(document).tap do |changed|
+          element = element(changed, element_id)
+          offered(defined(catalog, element["key"]), field)
+          element["fields"][field.to_s] = value
+        end
+      end
+
+      def check(document, catalog: Pages.catalog)
+        elements(document).each do |element|
+          definition = defined(catalog, element["key"])
+          element["fields"].each_key { |field| offered(definition, field) }
+        end
+        document
+      end
+
+      def digest(document)
+        Digest::SHA256.hexdigest(JSON.generate(sorted(document)))
+      end
+
+      def sorted(value)
+        case value
+        when Hash then value.sort_by { |key, _| key.to_s }.to_h { |key, nested| [ key, sorted(nested) ] }
+        when Array then value.map { |nested| sorted(nested) }
+        else value
+        end
+      end
+
+      def defined(catalog, key)
+        catalog.find(key) or raise InvalidDocument, "No element is registered as #{key}"
+      end
+
+      def offered(definition, field)
+        return if definition.fields.any? { |offered| offered[:key].to_s == field.to_s }
+
+        raise InvalidDocument, "The #{definition.key} element has no #{field} field"
+      end
+
+      def copied(document)
+        JSON.parse(JSON.generate(document))
+      end
+
+      def nodes(document)
+        sections = document["sections"]
+        rows = sections.flat_map { |section| section["rows"] }
+        sections + rows + columns(document) + elements(document)
+      end
+
+      def node(document, node_id)
+        nodes(document).find { |node| node["id"] == node_id }
+      end
+
+      def columns(document)
+        document["sections"].flat_map { |section| section["rows"] }.flat_map { |row| row["columns"] }
+      end
+
+      def column(document, column_id)
+        columns(document).find { |column| column["id"] == column_id }
+      end
+
+      def elements(document)
+        columns(document).flat_map { |column| column["elements"] }
+      end
+
+      def element(document, element_id)
+        elements(document).find { |element| element["id"] == element_id }
+      end
+    end
+  end
+end

data/lib/keystone_ui/pages/pdf_document.rb

@@ -0,0 +1,17 @@
+# frozen_string_literal: true
+
+module KeystoneUi
+  module Pages
+    module PdfDocument
+      module_function
+
+      def html(version, values: {})
+        KeystoneUi::Pages::PagesController.render(template: "keystone_ui/pages/pdfs/show", layout: false, assigns: { version: version, values: values, stylesheet: stylesheet })
+      end
+
+      def stylesheet
+        Rails.application.assets.load_path.find(Pages.pdf_stylesheet)&.content.to_s.dup.force_encoding(Encoding::UTF_8)
+      end
+    end
+  end
+end

data/lib/keystone_ui/pages/pdfs.rb

@@ -0,0 +1,20 @@
+# frozen_string_literal: true
+
+require "keystone_ui/pages/operations"
+require "keystone_ui/pages/pdf_document"
+require "keystone_ui/pages/printer"
+
+module KeystoneUi
+  module Pages
+    module Pdfs
+      module_function
+
+      def for(page, values: {})
+        version = page.versions.live.first
+        digest = Operations.digest(values.to_h.stringify_keys)
+        Pdf.find_by(version: version, values_digest: digest) || Pdf.create!(version: version, values_digest: digest,
+          file: { io: StringIO.new(Printer.pdf(PdfDocument.html(version, values: values))), filename: "#{page.slug}.pdf", content_type: "application/pdf" })
+      end
+    end
+  end
+end

data/lib/keystone_ui/pages/printer.rb

@@ -0,0 +1,43 @@
+# frozen_string_literal: true
+
+require "open3"
+require "tmpdir"
+require "keystone_ui/pages"
+
+module KeystoneUi
+  module Pages
+    class PrintFailed < StandardError; end
+
+    module Printer
+      USUAL_PLACES = [
+        "/usr/bin/google-chrome", "/usr/bin/google-chrome-stable", "/usr/bin/chromium", "/usr/bin/chromium-browser",
+        "/Applications/Google Chrome.app/Contents/MacOS/Google Chrome", "/Applications/Chromium.app/Contents/MacOS/Chromium"
+      ].freeze
+
+      module_function
+
+      def pdf(html)
+        Dir.mktmpdir do |folder|
+          page = File.join(folder, "page.html")
+          printed = File.join(folder, "page.pdf")
+          File.write(page, html)
+          printed_by_chrome(page, printed)
+          File.binread(printed)
+        end
+      end
+
+      def chrome
+        Pages.chrome_path.presence || ENV["CHROME_BIN"].presence || USUAL_PLACES.find { |place| File.executable?(place) }
+      end
+
+      def printed_by_chrome(page, printed)
+        raise PrintFailed, "No Chrome or Chromium was found to print the PDF. Install one, or name it with KeystoneUi::Pages.chrome_path or CHROME_BIN." if chrome.nil?
+
+        _output, errors, _status = Open3.capture3(chrome.to_s, "--headless=new", "--disable-gpu", "--use-mock-keychain", "--password-store=basic", "--no-pdf-header-footer", "--print-to-pdf=#{printed}", "file://#{page}")
+        raise PrintFailed, "Chrome at #{chrome} could not print the page: #{errors.strip}" unless File.size?(printed)
+      rescue SystemCallError => error
+        raise PrintFailed, "Chrome at #{chrome} could not be started: #{error.message}"
+      end
+    end
+  end
+end

data/lib/keystone_ui/pages/values.rb

@@ -0,0 +1,28 @@
+# frozen_string_literal: true
+
+module KeystoneUi
+  module Pages
+    module Values
+      class << self
+        attr_writer :names
+        attr_accessor :provider, :chooser
+
+        def names
+          @names ||= {}
+        end
+
+        def label(name)
+          names[name.to_s]
+        end
+
+        def samples_for(page)
+          chooser ? chooser.call(page).to_a : []
+        end
+
+        def sample(page, choice)
+          provider ? provider.call(page, choice).to_h.stringify_keys : {}
+        end
+      end
+    end
+  end
+end

data/lib/keystone_ui/pages/version.rb

@@ -0,0 +1,7 @@
+# frozen_string_literal: true
+
+module KeystoneUi
+  module Pages
+    VERSION = "0.1.0"
+  end
+end