trestle 0.10.0.pre2 → 0.10.1

data/frontend/css/layout/_sidebar.scss

@@ -3,6 +3,8 @@
 .app-wrapper {
   --sidebar-width: #{$sidebar-width};
   --sidebar-width-collapsed: #{$sidebar-width-collapsed};
+  --sidebar-padding: #{$sidebar-padding};
+  --sidebar-padding-collapsed: #{$sidebar-padding-collapsed};
   --sidebar-transition-duration: #{$sidebar-transition-duration};
   --sidebar-transition-timing: ease-out;
   --sidebar-bg: #{$sidebar-bg};
@@ -69,7 +71,7 @@
   display: flex;
   align-items: center;
 
-  padding: 0.5rem 0.875rem;
+  padding: var(--sidebar-padding);
 
   font-size: 1.25rem;
   font-weight: 500;
@@ -100,6 +102,8 @@
   display: flex;
   flex-direction: column;
 
+  position: relative;
+
   overflow-x: hidden;
   overflow-y: auto;
 
@@ -176,7 +180,7 @@
 
   .app-sidebar-title {
     justify-content: center;
-    padding: 0.5rem 0.25rem;
+    padding: var(--sidebar-padding-collapsed);
 
     // Match right margin with navbar toggler width:
     // (margin + border + font-size * icon-width + padding)
@@ -200,7 +204,7 @@
       width: var(--sidebar-width-collapsed);
       flex-basis: var(--sidebar-width-collapsed);
 
-      padding: 0.5rem 0.25rem;
+      padding: var(--sidebar-padding-collapsed);
       justify-content: center;
 
       img {
@@ -231,7 +235,7 @@
         width: var(--sidebar-width);
         flex-basis: var(--sidebar-width);
 
-        padding: 0.5rem 0.25rem;
+        padding: var(--sidebar-padding);
         justify-content: flex-start;
 
         img {
@@ -267,7 +271,7 @@
         width: var(--sidebar-width-collapsed);
         flex-basis: var(--sidebar-width-collapsed);
 
-        padding: 0.5rem 0.25rem;
+        padding: var(--sidebar-padding-collapsed);
         justify-content: center;
 
         img {

data/frontend/css/variables/_trestle.scss

@@ -61,6 +61,9 @@ $sidebar-mobile-toggle-active-border:       $sidebar-mobile-toggle-border-width
 $sidebar-width:           15.625rem;
 $sidebar-width-collapsed: 3.5rem;
 
+$sidebar-padding:           0.5rem 0.875rem;
+$sidebar-padding-collapsed: 0.5rem 0.25rem;
+
 $sidebar-transition-duration: 200ms;
 
 

data/frontend/js/controllers/confirm_delete_controller.js

@@ -3,9 +3,9 @@ import ConfirmController from './confirm_controller'
 import { i18n } from '../core/i18n'
 
 export default class extends ConfirmController {
-  static values = {
-    confirmLabel: i18n['trestle.confirmation.delete'] || 'Delete'
-  }
-
   static defaultConfirmClass = 'btn-danger'
+
+  get confirmLabel () {
+    return this.confirmLabelValue || i18n.t('trestle.confirmation.delete', { defaultValue: 'Delete' })
+  }
 }

data/frontend/js/controllers/flatpickr_controller.js

@@ -23,7 +23,7 @@ export default class extends ApplicationController {
   }
 
   setup (selectedDates, dateStr, instance) {
-    this._createClearButton(instance)
+    this.#createClearButton(instance)
   }
 
   get options () {
@@ -33,7 +33,7 @@ export default class extends ApplicationController {
     }
   }
 
-  _createClearButton (instance) {
+  #createClearButton (instance) {
     if (this.element.dataset.allowClear) {
       const clearButton = document.createElement('button')
 

data/frontend/js/controllers/gallery_controller.js

@@ -1,6 +1,8 @@
 import LightboxController from './lightbox_controller'
 
 export default class extends LightboxController {
+  static targets = ["image"]
+
   get options () {
     return {
       ...super.options,

data/frontend/js/controllers/lightbox_controller.js

@@ -26,8 +26,6 @@ const VideoIframeUrl = {
 }
 
 export default class extends ApplicationController {
-  static targets = ["image"]
-
   static values = {
     animationType: { type: String, default: 'zoom' },
     animationDuration: { type: Number, default: 150 },
@@ -111,7 +109,7 @@ export default class extends ApplicationController {
       itemData.type = 'html'
       itemData.html = `<video controls><source src="${itemData.src}"></video>`
 
-      this.setDefaultVideoDimensions(itemData)
+      this.#setDefaultVideoDimensions(itemData)
     }
 
     return itemData
@@ -128,7 +126,7 @@ export default class extends ApplicationController {
         itemData.type = 'html'
         itemData.html = `<iframe src="${src}" allowfullscreen></iframe>`
 
-        this.setDefaultVideoDimensions(itemData)
+        this.#setDefaultVideoDimensions(itemData)
       }
     }
 
@@ -153,7 +151,7 @@ export default class extends ApplicationController {
     }
   }
 
-  setDefaultVideoDimensions(itemData) {
+  #setDefaultVideoDimensions(itemData) {
     itemData.w ||= this.defaultVideoWidthValue
     itemData.h ||= this.defaultVideoHeightValue
   }

data/frontend/js/controllers/modal_trigger_controller.js

@@ -26,7 +26,7 @@ export default class extends ApplicationController {
       .then((modal) => {
         this.modal = modal
 
-        const modalController = this._getModalController(modal)
+        const modalController = this.#getModalController(modal)
         modalController.modalTrigger = this
 
         this.dispatch('loaded', { detail: modal })
@@ -68,7 +68,7 @@ export default class extends ApplicationController {
     return this.element.nodeName === 'A'
   }
 
-  _getModalController (modal) {
+  #getModalController (modal) {
     return this.application.getControllerForElementAndIdentifier(modal, 'modal')
   }
 }

data/frontend/js/controllers/sidebar_controller.js

@@ -5,6 +5,10 @@ import cookie from '../core/cookie'
 export default class extends ApplicationController {
   static targets = ["inner"]
 
+  static values = {
+    scrollMargin: { type: Number, default: 100 }
+  }
+
   connect () {
     this.scrollToActive()
   }
@@ -25,9 +29,15 @@ export default class extends ApplicationController {
   }
 
   scrollToActive () {
-    const active = this.element.getElementsByClassName('active')[0]
-    if (active && this.hasInnerTarget) {
-      this.innerTarget.scrollTop = active.offsetTop - 100
+    if (!this.hasInnerTarget) return
+
+    const active = this.element.querySelector('.active')
+    if (!active) return
+
+    // Check if bottom of active element is outside of visible navigation height (plus scroll margin)
+    const activeOffset = active.offsetTop + active.offsetHeight + this.scrollMarginValue
+    if (activeOffset > this.innerTarget.clientHeight) {
+      this.innerTarget.scrollTop = activeOffset - this.innerTarget.clientHeight
     }
   }
 }

data/frontend/js/controllers/tab_errors_controller.js

@@ -20,7 +20,7 @@ export default class extends ApplicationController {
     const errorCount = pane.querySelectorAll(this.errorSelectorValue).length
 
     if (errorCount > 0) {
-      const badge = this._createErrorBadge(errorCount)
+      const badge = this.#createErrorBadge(errorCount)
       link.appendChild(badge)
     }
   }
@@ -34,7 +34,7 @@ export default class extends ApplicationController {
     })
   }
 
-  _createErrorBadge (count) {
+  #createErrorBadge (count) {
     const badge = document.createElement('span')
 
     badge.classList.add('badge', 'badge-danger', 'badge-pill')

data/frontend/js/core/backdrop.js

@@ -12,6 +12,10 @@ const CLASS_NAME_SHOW = 'show'
 const CLASS_NAME_LOADING = 'loading'
 
 export default class Backdrop {
+  #config
+  #element
+  #isAppended
+
   static getInstance () {
     if (!this.instance) {
       this.instance = new Backdrop()
@@ -21,31 +25,31 @@ export default class Backdrop {
   }
 
   constructor () {
-    this._config = Default
-    this._element = null
-    this._isAppended = false
+    this.#config = Default
+    this.#element = null
+    this.#isAppended = false
   }
 
   show (callback) {
-    this._append()
+    this.#append()
 
-    if (this._config.isAnimated) {
-      reflow(this._getElement())
+    if (this.#config.isAnimated) {
+      reflow(this.#getElement())
     }
 
-    this._getElement().classList.add(CLASS_NAME_SHOW)
+    this.#getElement().classList.add(CLASS_NAME_SHOW)
 
-    this._emulateAnimation(() => {
+    this.#emulateAnimation(() => {
       execute(callback)
     })
   }
 
   hide (callback) {
     if (Modal.existing.length === 0) {
-      this._getElement().classList.remove(CLASS_NAME_SHOW)
+      this.#getElement().classList.remove(CLASS_NAME_SHOW)
     }
 
-    this._emulateAnimation(() => {
+    this.#emulateAnimation(() => {
       this.dispose()
       execute(callback)
       Modal.restorePrevious()
@@ -53,48 +57,46 @@ export default class Backdrop {
   }
 
   dispose () {
-    if (!this._isAppended) {
+    if (!this.#isAppended) {
       return
     }
 
     if (Modal.existing.length === 0) {
-      this._element.remove()
-      this._isAppended = false
+      this.#element.remove()
+      this.#isAppended = false
     }
   }
 
   loading (isLoading) {
-    const el = this._getElement()
+    const el = this.#getElement()
     el.classList[isLoading ? 'add' : 'remove'](CLASS_NAME_LOADING)
   }
 
-  // Private
-
-  _getElement () {
-    if (!this._element) {
+  #getElement () {
+    if (!this.#element) {
       const backdrop = document.createElement('div')
-      backdrop.className = this._config.className
-      if (this._config.isAnimated) {
+      backdrop.className = this.#config.className
+      if (this.#config.isAnimated) {
         backdrop.classList.add(CLASS_NAME_FADE)
       }
 
-      this._element = backdrop
+      this.#element = backdrop
     }
 
-    return this._element
+    return this.#element
   }
 
-  _append () {
-    if (this._isAppended) {
+  #append () {
+    if (this.#isAppended) {
       return
     }
 
-    document.body.append(this._getElement())
+    document.body.append(this.#getElement())
 
-    this._isAppended = true
+    this.#isAppended = true
   }
 
-  _emulateAnimation (callback) {
-    executeAfterTransition(callback, this._getElement(), this._config.isAnimated)
+  #emulateAnimation (callback) {
+    executeAfterTransition(callback, this.#getElement(), this.#config.isAnimated)
   }
 }

data/frontend/js/core/error_modal.js

@@ -33,33 +33,31 @@ export default class ErrorModal {
   }
 
   show () {
-    this._append(this._buildModal())
+    this.#append(this.#buildModal())
   }
 
-  // Private
-
-  _buildModal () {
-    const el = this._buildWrapper()
+  #buildModal () {
+    const el = this.#buildWrapper()
     el.querySelector('.modal-title').textContent = this.title
 
-    const iframe = this._buildIframe(this.content)
+    const iframe = this.#buildIframe(this.content)
     el.querySelector('.modal-body').append(iframe)
 
     return el
   }
 
-  _buildWrapper () {
+  #buildWrapper () {
     return new DOMParser().parseFromString(TEMPLATE(), 'text/html').body.childNodes[0]
   }
 
-  _buildIframe () {
+  #buildIframe () {
     const iframe = document.createElement('iframe')
     iframe.className = 'error-iframe'
     iframe.srcdoc = this.content
     return iframe
   }
 
-  _append (el) {
+  #append (el) {
     document.getElementById('modal').append(el)
   }
 }

data/frontend/js/core/fetch.js

@@ -13,6 +13,7 @@ export function fetchWithErrorHandling (url, options = {}) {
     .catch(response => {
       const title = `${response.status} (${response.statusText})`
       response.text().then(content => ErrorModal.show({ title, content }))
+      throw response
     })
 }
 
@@ -29,4 +30,5 @@ export function fetchTurboStream (url, options = {}) {
   return fetchWithErrorHandling(url, options)
     .then(response => response.text())
     .then(html => renderStreamMessage(html))
+    .catch(() => { /* Error already handled */ })
 }

data/lib/trestle/admin.rb

@@ -14,6 +14,7 @@ module Trestle
         super
       end
     end
+    ruby2_keywords :method_missing if respond_to?(:ruby2_keywords, true)
 
     def respond_to_missing?(name, include_private=false)
       self.class.respond_to?(name, include_private) || super
@@ -118,8 +119,14 @@ module Trestle
         "#{name.underscore}/admin"
       end
 
-      def path(action=root_action, options={})
-        Engine.routes.url_for(options.merge(controller: controller_namespace, action: action, only_path: true))
+      def path(action=nil, options={})
+        defaults = {
+          controller: controller_namespace,
+          action: action || root_action,
+          only_path: true
+        }
+
+        Engine.routes.url_for(defaults.merge(options))
       end
 
       def to_param(*)

data/lib/trestle/configuration.rb

@@ -91,6 +91,9 @@ module Trestle
     # Default adapter class used by all admin resources
     option :default_adapter, Adapters.compose(Adapters::ActiveRecordAdapter, Adapters::DraperAdapter)
 
+    # List of Stimulus controllers to add to forms by default
+    option :default_form_controllers, %w(keyboard-submit form-loading form-error)
+
     # Register a custom form field class
     def form_field(name, field)
       Form::Builder.register(name, field)

data/lib/trestle/engine.rb

@@ -17,7 +17,7 @@ module Trestle
     initializer "trestle.automount" do |app|
       if Trestle.config.automount
         app.routes.prepend do
-          mount Trestle::Engine => Trestle.config.path
+          mount Trestle::Engine, at: Trestle.config.path
         end
       end
     end

data/lib/trestle/evaluation_context.rb

@@ -5,20 +5,18 @@ module Trestle
   # both the Adapter/Navigation instance, as well as the controller/view from where they are invoked.
   module EvaluationContext
   protected
-    def self.ruby2_keywords(*)
-    end unless respond_to?(:ruby2_keywords, true)
-
     # Missing methods are called on the given context if available.
     #
     # We include private methods as methods such as current_user
     # are usually declared as private or protected.
-    ruby2_keywords def method_missing(name, *args, &block)
+    def method_missing(name, *args, &block)
       if context_responds_to?(name)
         @context.send(name, *args, &block)
       else
         super
       end
     end
+    ruby2_keywords :method_missing if respond_to?(:ruby2_keywords, true)
 
     def respond_to_missing?(name, include_private=false)
       context_responds_to?(name) || super

data/lib/trestle/form/automatic.rb

@@ -16,7 +16,7 @@ module Trestle
                     if associated_instance = instance.public_send(attribute.association_name)
                       admin_link_to format_value(associated_instance), associated_instance
                     else
-                      content_tag(:span, I18n.t("admin.format.blank"), class: "blank")
+                      tag.span(I18n.t("admin.format.blank"), class: "blank")
                     end
                   end
                 else

data/lib/trestle/form/field.rb

@@ -3,7 +3,7 @@ module Trestle
     class Field
       attr_reader :builder, :template, :name, :options, :block
 
-      delegate :admin, :content_tag, :concat, :safe_join, :icon, to: :template
+      delegate :admin, :tag, :content_tag, :concat, :safe_join, :icon, to: :template
 
       def initialize(builder, template, name, options={}, &block)
         @builder, @template, @name, @block = builder, template, name, block

data/lib/trestle/form/fields/check_box.rb

@@ -19,7 +19,7 @@ module Trestle
           wrapper_class = options.delete(:class)
           wrapper_class = default_wrapper_class if wrapper_class.empty?
 
-          content_tag(:div, class: wrapper_class) do
+          tag.div(class: wrapper_class) do
             safe_join([
               builder.raw_check_box(name, options.merge(class: input_class), checked_value, unchecked_value),
               builder.label(name, options[:label] || admin.human_attribute_name(name), class: label_class, value: (checked_value if options[:multiple]))

data/lib/trestle/form/fields/collection_check_boxes.rb

@@ -18,7 +18,7 @@ module Trestle
             if block
               block.call(b)
             else
-              content_tag(:div, class: default_wrapper_class) do
+              tag.div(class: default_wrapper_class) do
                 b.check_box(class: input_class) + b.label(class: label_class) { b.text }
               end
             end

data/lib/trestle/form/fields/collection_radio_buttons.rb

@@ -18,7 +18,7 @@ module Trestle
             if block
               block.call(b)
             else
-              content_tag(:div, class: default_wrapper_class) do
+              tag.div(class: default_wrapper_class) do
                 b.radio_button(class: input_class) + b.label(class: label_class) { b.text }
               end
             end

data/lib/trestle/form/fields/date_select.rb

@@ -11,7 +11,7 @@ module Trestle
         end
 
         def field
-          content_tag(:div, class: "date-select") do
+          tag.div(class: "date-select") do
             builder.raw_date_select(name, options, html_options, &block)
           end
         end

data/lib/trestle/form/fields/datetime_select.rb

@@ -11,7 +11,7 @@ module Trestle
         end
 
         def field
-          content_tag(:div, class: "datetime-select") do
+          tag.div(class: "datetime-select") do
             builder.raw_datetime_select(name, options, html_options, &block)
           end
         end

data/lib/trestle/form/fields/form_control.rb

@@ -12,7 +12,7 @@ module Trestle
 
         def input_group
           if @prepend || @append
-            content_tag(:div, class: "input-group") do
+            tag.div(class: "input-group") do
               concat input_group_addon(@prepend) if @prepend
               concat yield
               concat input_group_addon(@append) if @append
@@ -24,7 +24,7 @@ module Trestle
 
         def input_group_addon(addon)
           if addon[:wrap]
-            content_tag(:span, addon[:content], class: "input-group-text")
+            tag.span(addon[:content], class: "input-group-text")
           else
             addon[:content]
           end

data/lib/trestle/form/fields/form_group.rb

@@ -12,7 +12,7 @@ module Trestle
         end
 
         def render
-          content_tag(:div, options.except(*WRAPPER_OPTIONS)) do
+          tag.div(**options.except(*WRAPPER_OPTIONS)) do
             concat label if name && options[:label] != false
             concat template.capture(&block) if block
             concat help_message if options[:help]
@@ -30,13 +30,13 @@ module Trestle
             message = options[:help]
           end
 
-          content_tag(:p, message, class: classes)
+          tag.p(message, class: classes)
         end
 
         def error_messages
-          content_tag(:ul, class: "invalid-feedback") do
+          tag.ul(class: "invalid-feedback") do
             safe_join(errors.map { |error|
-              content_tag(:li, safe_join([icon("fa fa-warning"), error], " "))
+              tag.li(safe_join([icon("fa fa-warning"), error], " "))
             }, "\n")
           end
         end

data/lib/trestle/form/fields/radio_button.rb

@@ -20,7 +20,7 @@ module Trestle
           wrapper_class = options.delete(:class)
           wrapper_class = default_wrapper_class if wrapper_class.empty?
 
-          content_tag(:div, class: wrapper_class) do
+          tag.div(class: wrapper_class) do
             safe_join([
               builder.raw_radio_button(name, tag_value, options.merge(class: input_class)),
               builder.label(name, options[:label] || tag_value.to_s.humanize, value: tag_value, class: label_class)

data/lib/trestle/form/fields/static_field.rb

@@ -18,7 +18,7 @@ module Trestle
           if block
             template.capture(&block)
           else
-            content_tag(:p, value || default_value, class: "form-control-static")
+            tag.p(value || default_value, class: "form-control-static")
           end
         end
 

data/lib/trestle/form/fields/time_select.rb

@@ -11,7 +11,7 @@ module Trestle
         end
 
         def field
-          content_tag(:div, class: "time-select") do
+          tag.div(class: "time-select") do
             builder.raw_time_select(name, options, html_options, &block)
           end
         end

data/lib/trestle/form/renderer.rb

@@ -4,9 +4,6 @@ require "action_view/helpers"
 module Trestle
   class Form
     class Renderer
-      def self.ruby2_keywords(*)
-      end unless respond_to?(:ruby2_keywords, true)
-
       include ::ActionView::Context
       include ::ActionView::Helpers::CaptureHelper
 
@@ -14,7 +11,7 @@ module Trestle
       include Hook::Helpers
 
       # Whitelisted helpers will concatenate their result to the output buffer when called.
-      WHITELISTED_HELPERS = [:row, :col, :render, :tab, :table, :divider, :h1, :h2, :h3, :h4, :h5, :h6, :card, :panel, :well]
+      WHITELISTED_HELPERS = [:row, :col, :render, :tab, :table, :divider, :h1, :h2, :h3, :h4, :h5, :h6, :card, :panel, :well, :turbo_frame_tag]
 
       # Raw block helpers will pass their block argument directly to the method without wrapping it in a new output buffer.
       RAW_BLOCK_HELPERS = [:table, :toolbar]
@@ -46,7 +43,7 @@ module Trestle
         concat(result)
       end
 
-      ruby2_keywords def method_missing(name, *args, &block)
+      def method_missing(name, *args, &block)
         target = @form.respond_to?(name) ? @form : @template
 
         if block_given? && !RAW_BLOCK_HELPERS.include?(name)
@@ -63,6 +60,7 @@ module Trestle
           result
         end
       end
+      ruby2_keywords :method_missing if respond_to?(:ruby2_keywords, true)
 
       def respond_to_missing?(name, include_all=false)
         @form.respond_to?(name, include_all) ||