spree_storefront 5.1.5 → 5.1.6

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: '02028729237955d4e7fa92f5d7de7b12abb892d33740dcb1455d87a967753b2b'
-  data.tar.gz: 899264bd8d321ea56406d52d9638fd4940ef65f0d8335d2ecf2daed13880ae41
+  metadata.gz: 783edecada54bb35cbebbf97ff7aeb43d95603e5c4977500a98a7be279837715
+  data.tar.gz: aadf5ffa9a0c1e0974fc79b8d7dd16e48a3764809bea78d7a9ff3f3a67a999e1
 SHA512:
-  metadata.gz: e63beb656c68f126bc5f9335308ca0f75081cf823fbb362b3c466ac9a02871ee3831fbcaf0e3d5f63305c4a46333bd836d7d90f4fe8c5d0d75de8647ba4e5acb
-  data.tar.gz: 53431d7eab3125b7456bda997064a4adb1527a0dd519347b1c124d4a8d87c991a7df309287ddff1902cd2f08a08dd569f2787a4dc036571f825cc1004d780f4a
+  metadata.gz: e4bdedeb09037bce2042c85aaa4f1a7486d18c479e3ff712c9dfaf4db1214d8af3732ddd3ebb0b30526ee4e5c9bfaef14c7fd504611adc49b038c52c45d21477
+  data.tar.gz: db2a5bf2239305047b4594f5a4ead9fabbdae0d3a41fcbb2e7025a30cb9f501b29f2ffaaf8918cdba217b032d258a9eee01bdc92ac27c7dd9f901d072f695c79

data/app/controllers/concerns/spree/cart_methods.rb

@@ -30,11 +30,25 @@ module Spree
     def load_line_items
       @line_items = if @order.nil? || @order.new_record?
                       []
-                    elsif @order.line_items.loaded?
-                      @order.line_items.sort_by(&:created_at).reverse
                     else
-                      @order.line_items.includes(variant: { option_values: [:option_type] }).order(created_at: :desc)
+                      @order.line_items.includes(line_items_includes).order(created_at: :desc)
                     end
     end
+
+    def line_items_includes
+      {
+        variant: [
+          :images,
+          { option_values: [:option_type] },
+          {
+            product: [
+              :variants,
+              :variant_images,
+              { master: :images }
+            ]
+          }
+        ]
+      }
+    end
   end
 end

data/app/controllers/spree/store_controller.rb

@@ -28,7 +28,8 @@ module Spree
 
     helper_method :permitted_products_params, :products_filters_params,
                   :storefront_products_scope, :storefront_products,
-                  :default_products_sort, :default_products_finder_params
+                  :default_products_sort, :default_products_finder_params,
+                  :storefront_products_includes, :storefront_products_finder
 
     helper_method :stored_location
 
@@ -122,6 +123,10 @@ module Spree
       @accurate_title ||= current_store.seo_title.presence || current_store.name
     end
 
+    def storefront_products_finder
+      @storefront_products_finder ||= Spree::Dependencies.products_finder.constantize
+    end
+
     def storefront_products_scope
       @storefront_products_scope ||= current_store.products.active(current_currency)
     end
@@ -155,7 +160,7 @@ module Spree
         finder_params = default_products_finder_params
         finder_params[:sort_by] ||= @taxon&.sort_order || 'manual'
 
-        products_finder = Spree::Dependencies.products_finder.constantize
+        products_finder = storefront_products_finder
         products = products_finder.
                    new(scope: storefront_products_scope, params: finder_params).
                    execute.

data/app/helpers/spree/cart_helper.rb

@@ -30,7 +30,7 @@ module Spree
     def color_options_style_for_line_items(line_items)
       @color_options_style_for_line_items = begin
         colors = line_items.map(&:variant).map do |v|
-          color_option_values = v.option_values.find_all do |ov|
+          color_option_values = v.option_values.includes(:option_type).find_all do |ov|
             ov.option_type.color?
           end
 
@@ -48,7 +48,7 @@ module Spree
     def cart_id(order)
       return 'cart_contents' if order.blank? || order.id.blank? || order.updated_at.blank?
 
-      "cart_contents_#{order.id}_#{order.updated_at.to_i}"
+      "cart_contents_#{order.id}"
     end
   end
 end

data/app/helpers/spree/filters_helper.rb

@@ -8,12 +8,10 @@ module Spree
     end
 
     def products_for_filters_scope(except_filters: [])
-      products_finder = Spree::Dependencies.products_finder.constantize
-
       finder_params = default_products_finder_params
       finder_params[:filter] = finder_params[:filter].except(*except_filters) if except_filters.any?
 
-      products = products_finder.new(scope: storefront_products_scope, params: finder_params).execute
+      products = storefront_products_finder.new(scope: storefront_products_scope, params: finder_params).execute
       current_store.products.where(id: products.unscope(:order).ids)
     end
 

data/app/helpers/spree/page_helper.rb

@@ -12,7 +12,7 @@ module Spree
       page ||= current_page
 
       sections = current_page_preview.present? ? current_page_preview.sections : page.sections
-      sections_html = sections.includes(:links, { asset_attachment: :blob }, { blocks: [:rich_text_text, :links] }).map do |section|
+      sections_html = sections.includes(:links, :rich_text_text, :rich_text_description, { asset_attachment: :blob }, { blocks: [:rich_text_text, :links] }).map do |section|
         render_section(section, variables)
       end.join.html_safe
 

data/app/helpers/spree/taxons_helper.rb

@@ -0,0 +1,19 @@
+module Spree
+  module TaxonsHelper
+    # @param taxon [Spree::Taxon]
+    # @return [ActiveRecord::Relation<Spree::Product>] products for the taxon
+    def taxon_products(taxon)
+      @products_cache ||= {}
+      @products_cache[taxon.id] ||= begin
+        finder_params = {
+          store: current_store,
+          filter: { taxons: taxon.id },
+          currency: current_currency,
+          sort_by: 'default'
+        }
+
+        storefront_products_finder.new(scope: current_store.products.includes(storefront_products_includes), params: finder_params).execute
+      end
+    end
+  end
+end

data/app/helpers/spree/theme_helper.rb

@@ -65,14 +65,14 @@ module Spree
     #
     # @return [Boolean] whether the page builder is enabled
     def page_builder_enabled?
-      @page_builder_enabled ||= (current_theme_preview.present? || current_page_preview.present?) && params[:page_builder] == 'true'
+      @page_builder_enabled ||= current_theme_preview.present? || current_page_preview.present?
     end
 
     # Returns the theme layout sections, eg. header, footer, etc.
     #
     # @return [Hash] the theme layout sections
     def theme_layout_sections
-      @theme_layout_sections ||= current_theme_or_preview.sections.includes(:links, { asset_attachment: :blob },
+      @theme_layout_sections ||= current_theme_or_preview.sections.includes(:links, :rich_text_text, :rich_text_description, { asset_attachment: :blob },
                                                                             { blocks: [:rich_text_text, :links] }).all.each_with_object({}) do |section, hash|
         hash[section.type.to_s.demodulize.underscore] = section
       end

data/app/javascript/spree/storefront/application.js

@@ -57,6 +57,7 @@ const controllers = [
   'slideover-account',
   'slideover',
   'sticky-button',
+  'textarea-autogrow',
   'toggle-menu',
   'turbo-stream-form',
   'wished-item',
@@ -73,6 +74,7 @@ const manifest = {
   "reveal": "stimulus-reveal-controller",
   "scroll-to": "stimulus-scroll-to",
   "read-more": "stimulus-read-more",
+  "textarea-autogrow": "stimulus-textarea-autogrow"
 }
 
 import { lazyLoadControllersFromManifest } from "spree/storefront/helpers/lazy_load_controllers_with_manifest"
@@ -137,6 +139,14 @@ document.addEventListener('turbo:submit-end', () => {
   Turbo.navigator.delegate.adapter.progressBar.hide()
 })
 
+// fix for Safari buggy behavior with lazy loaded turbo frames
+document.addEventListener("turbo:before-fetch-request", (event) => {
+  const frame = event.target.closest("turbo-frame");
+  if (frame && frame.id) {
+    event.detail.fetchOptions.headers["Turbo-Frame"] = frame.id;
+  }
+});
+
 function replaceCsrfMetaTags() {
   const csrfMetaTagsTemplate = document.querySelector('template#csrf_meta_tags')
   if (!csrfMetaTagsTemplate) return

data/app/views/spree/checkout/_payment_methods.html.erb

@@ -54,11 +54,7 @@
     <% end %>
   <% end %>
 
-  <p class="text-xs mt-2 mb-4">
-    <%= Spree.t('storefront.checkout.by_placing_this_order_you_agree_to') %>
-    <%= link_to Spree.t(:terms_of_service), policy_path('terms_of_service'), target: :_blank, class: 'text-primary' %><%= I18n.t('support.array.two_words_connector') %>
-    <%= link_to Spree.t(:privacy_policy), policy_path('privacy_policy'), target: :_blank, class: 'text-primary' %>.
-  </p>
+  <%= render 'spree/checkout/terms_and_conditions' %>
 
   <div class="flex justify-end w-full">
     <button type="submit"

data/app/views/spree/checkout/_special_instructions.html.erb

@@ -4,7 +4,7 @@
       <%= I18n.t('activerecord.attributes.spree/order.special_instructions') %>
     </h5>
     <div class="form-group">
-      <%= form.text_area :special_instructions, class: 'w-full text-input', rows: 2, placeholder: Spree.t('storefront.checkout.special_instructions_placeholder') %>
+      <%= form.text_area :special_instructions, class: 'w-full text-input', rows: 2, placeholder: Spree.t('storefront.checkout.special_instructions_placeholder'), data: { controller: 'textarea-autogrow' } %>
     </div>
   </div>
 <% end %>

data/app/views/spree/checkout/_terms_and_conditions.html.erb

@@ -0,0 +1,5 @@
+  <p id="payment-and-conditions" class="text-xs mt-2 mb-4">
+    <%= Spree.t('storefront.checkout.by_placing_this_order_you_agree_to') %>
+    <%= link_to Spree.t(:terms_of_service), policy_path('terms_of_service'), target: :_blank, class: 'text-primary' %><%= I18n.t('support.array.two_words_connector') %>
+    <%= link_to Spree.t(:privacy_policy), policy_path('privacy_policy'), target: :_blank, class: 'text-primary' %>.
+  </p>

data/app/views/spree/shared/_head.html.erb

@@ -14,6 +14,8 @@
 <%= render 'spree/shared/css_variables' %>
 <%= render 'spree/shared/fonts' %>
 
+<script async src="https://ga.jspm.io/npm:es-module-shims@1.8.2/dist/es-module-shims.js" data-turbo-track="reload"></script>
+
 <%= javascript_importmap_tags "application-spree-storefront" %>
 <% if Rails.application.importmap.packages["application"].present? %>
   <%= javascript_import_module_tag "application" %>

data/app/views/spree/shared/_products.html.erb

@@ -1 +1,5 @@
-<%= render partial: 'spree/products/product', collection: products, cached: ->(product) { product_cache_key(product) } %>
+<% unless page_builder_enabled? %>
+  <%= render partial: 'spree/products/product', collection: products, cached: ->(product) { product_cache_key(product) } %>
+<% else %>
+  <%= render partial: 'spree/products/product', collection: products %>
+<% end %>

data/app/views/themes/default/spree/orders/_summary.html.erb

@@ -1,5 +1,5 @@
 <%= turbo_frame_tag :cart_summary do %>
-  <% if order.line_items.any? %>
+  <% if order.item_count.positive? %>
     <div class="cart-summary-container p-4">
       <p class="text-center lg:text-right text-sm mb-3">
         <%= Spree.t('storefront.cart.shipping_and_taxes_calculated_at_checkout') %>

data/app/views/themes/default/spree/page_sections/_featured_taxon.html.erb

@@ -1,116 +1,119 @@
-<div style='<%= section_styles(section) %>' class='animate-fadeIn'>
-  <div class='page-container'>
-    <% heading_size = case section.preferred_heading_size
-                      when 'small' then 'text-base font-medium'
-                      when 'medium' then 'text-lg lg:text-xl font-medium'
-                      when 'large' then 'text-xl lg:text-2xl font-medium'
-                      end %>
-    <% if section.taxon&.page_builder_image&.attached? && section.preferred_show_taxon_image %>
-      <% desktop_slides_amount = 2.5 %>
-      <% section_with_image = true %>
-      <% arrows_on_top = false %>
-    <% else %>
-      <% desktop_slides_amount = 4 %>
-      <% section_with_image = false %>
-      <% arrows_on_top = true %>
-    <% end %>
-    <% if section.preferred_heading.present? %>
-      <div class='mb-8 flex justify-between items-end'>
-        <div class="md:basis-2/5">
-          <h3
-            class='<%= heading_size %> featured-taxon--title font-medium text-<%= section.preferred_heading_alignment %>'
-            data-title="<%= section.preferred_heading.downcase %>"
-            style='<%= section_heading_styles(section) %>'>
-            <% if section.taxon.present? %>
-              <%= link_to section.preferred_heading, spree_storefront_resource_url(section.taxon), data: { turbo_frame: "_top" } %>
-            <% else %>
-              <%= section.preferred_heading %>
-            <% end %>
-          </h3>
+<% cache_unless page_builder_enabled?, [spree_base_cache_key, section.cache_key_with_version, loaded.to_b] do %>
+  <div style='<%= section_styles(section) %>' class='animate-fadeIn'>
+    <div class='page-container'>
+      <% heading_size = case section.preferred_heading_size
+                        when 'small' then 'text-base font-medium'
+                        when 'medium' then 'text-lg lg:text-xl font-medium'
+                        when 'large' then 'text-xl lg:text-2xl font-medium'
+                        end %>
+      <% if section.taxon&.page_builder_image&.attached? && section.preferred_show_taxon_image %>
+        <% desktop_slides_amount = 2.5 %>
+        <% section_with_image = true %>
+        <% arrows_on_top = false %>
+      <% else %>
+        <% desktop_slides_amount = 4 %>
+        <% section_with_image = false %>
+        <% arrows_on_top = true %>
+      <% end %>
+      <% if section.preferred_heading.present? %>
+        <div class='mb-8 flex justify-between items-end'>
+          <div class="md:basis-2/5">
+            <h3
+              class='<%= heading_size %> featured-taxon--title font-medium text-<%= section.preferred_heading_alignment %>'
+              data-title="<%= section.preferred_heading.downcase %>"
+              style='<%= section_heading_styles(section) %>'>
+              <% if section.taxon.present? %>
+                <%= link_to section.preferred_heading, spree_storefront_resource_url(section.taxon), data: { turbo_frame: "_top" } %>
+              <% else %>
+                <%= section.preferred_heading %>
+              <% end %>
+            </h3>
 
-          <% if section.description_to_use.present? %>
-            <div class='pt-4 text-<%= section.preferred_description_alignment %>'>
-              <%= section.description_to_use %>
-            </div>
+            <% if section.description_to_use.present? %>
+              <div class='pt-4 text-<%= section.preferred_description_alignment %>'>
+                <%= section.description_to_use %>
+              </div>
+            <% end %>
+          </div>
+          <% if section.taxon.present? %>
+            <%= link_to spree_storefront_resource_url(section.taxon), class: class_names(section.preferred_button_style == "primary" ? "btn-primary" : "btn-secondary", " text-center hidden md:inline-block"), data: { turbo_frame: '_top' } do %>
+              <%= section.preferred_button_text %>
+            <% end %>
           <% end %>
         </div>
-        <% if section.taxon.present? %>
-          <%= link_to spree_storefront_resource_url(section.taxon), class: class_names(section.preferred_button_style == "primary" ? "btn-primary" : "btn-secondary", " text-center hidden md:inline-block"), data: { turbo_frame: '_top' } do %>
-            <%= section.preferred_button_text %>
-          <% end %>
-        <% end %>
-      </div>
-    <% end %>
-    <% if loaded && section.taxon.present? %>
-      <% if section.products(current_currency).any? %>
-        <div class='grid grid-cols-1 lg:grid-cols-12 gap-4 lg:gap-6'>
-          <% if section_with_image %>
-            <div class='lg:col-span-5'>
-              <%= link_to spree.nested_taxons_path(section.taxon), data: { turbo_frame: "_top" } do %>
-                <%= spree_image_tag(section.taxon.page_builder_image, height: 500, width: 500, class: 'h-full w-full object-cover object-center', loading: :lazy) %>
-              <% end %>
+      <% end %>
+      <% if loaded && section.taxon.present? %>
+        <% taxon_products = taxon_products(section.taxon).limit(section.preferred_max_products_to_show) %>
+        <% if taxon_products.any? %>
+          <div class='grid grid-cols-1 lg:grid-cols-12 gap-4 lg:gap-6'>
+            <% if section_with_image %>
+              <div class='lg:col-span-5'>
+                <%= link_to spree.nested_taxons_path(section.taxon), data: { turbo_frame: "_top" } do %>
+                  <%= spree_image_tag(section.taxon.page_builder_image, height: 500, width: 500, class: 'h-full w-full object-cover object-center', loading: :lazy) %>
+                <% end %>
+              </div>
+            <% end %>
+            <div class='<%= section_with_image ? "lg:col-span-7" : "lg:col-span-12" %>'>
+              <%= render 'spree/products/swiper', products: taxon_products, desktop_slides: desktop_slides_amount, pagination: 'bottom', arrows_on_top: arrows_on_top, section: section %>
             </div>
-          <% end %>
-          <div class='<%= section_with_image ? "lg:col-span-7" : "lg:col-span-12" %>'>
-            <%= render 'spree/products/swiper', products: section.products(current_currency).first(section.preferred_max_products_to_show), desktop_slides: desktop_slides_amount, pagination: 'bottom', arrows_on_top: arrows_on_top, section: section %>
           </div>
-        </div>
-      <% end %>
-    <% else %>
-      <div class='grid grid-cols-1 md:grid-cols-12 gap-4 md:gap-6'>
-        <% if section_with_image %>
-          <div class='md:col-span-5 w-full aspect-1 md:h-[536px] bg-accent'></div>
         <% end %>
-        <div class='<%= section_with_image ? "md:col-span-7" : "md:col-span-12" %> flex justify-between flex-col overflow-hidden'>
+      <% else %>
+        <div class='grid grid-cols-1 md:grid-cols-12 gap-4 md:gap-6'>
           <% if section_with_image %>
-            <div class='grid gap-4 md:gap-6 grid-cols-8 md:grid-cols-5'>
-              <div class='col-span-6 md:col-span-2'>
-                <div class='aspect-1 bg-accent w-full'></div>
-                <div class='h-6 mt-2 w-32 bg-accent rounded'></div>
-                <div class='h-8 mt-2 w-16 bg-accent rounded'></div>
-              </div>
-              <div class='col-span-2 flex flex-col h-full overflow-hidden'>
-                <div class='h-full md:aspect-1 bg-accent w-full'></div>
-                <div class='h-6 mt-2 w-32 bg-accent rounded shrink-0'></div>
-                <div class='h-8 mt-2 w-16 bg-accent rounded shrink-0'></div>
-              </div>
-              <div class='hidden md:block'>
-                <div class='aspect-[1/2] bg-accent w-full'></div>
-                <div class='h-6 mt-2 w-32 bg-accent rounded'></div>
-                <div class='h-8 mt-2 w-16 bg-accent rounded'></div>
-              </div>
-            </div>
-            <div class='md:flex <%= section.preferred_show_more_button ? "justify-between" : "justify-end" %> items-end'>
-              <div class='bg-accent h-12 rounded-full w-full md:w-56 mt-8 md:order-1 hidden md:block'></div>
-              <div class='<%= section.preferred_show_more_button ? "" : "hidden" %> bg-accent h-12 rounded-button w-full md:w-72 mt-6'></div>
-            </div>
-          <% else %>
-            <div class='grid gap-4 md:gap-6 grid-cols-8 relative'>
-              <div class='col-span-6 md:col-span-2'>
-                <div class='aspect-1 bg-accent w-full'></div>
-                <div class='h-6 mt-2 w-32 bg-accent rounded'></div>
-                <div class='h-8 mt-2 w-16 bg-accent rounded'></div>
-              </div>
-              <div class='col-span-2 md:col-span-2 flex flex-col'>
-                <div class='aspect-[1/3] md:aspect-1 bg-accent w-full flex-1'></div>
-                <div class='h-6 mt-2 w-32 bg-accent rounded'></div>
-                <div class='h-8 mt-2 w-16 bg-accent rounded'></div>
+            <div class='md:col-span-5 w-full aspect-1 md:h-[536px] bg-accent'></div>
+          <% end %>
+          <div class='<%= section_with_image ? "md:col-span-7" : "md:col-span-12" %> flex justify-between flex-col overflow-hidden'>
+            <% if section_with_image %>
+              <div class='grid gap-4 md:gap-6 grid-cols-8 md:grid-cols-5'>
+                <div class='col-span-6 md:col-span-2'>
+                  <div class='aspect-1 bg-accent w-full'></div>
+                  <div class='h-6 mt-2 w-32 bg-accent rounded'></div>
+                  <div class='h-8 mt-2 w-16 bg-accent rounded'></div>
+                </div>
+                <div class='col-span-2 flex flex-col h-full overflow-hidden'>
+                  <div class='h-full md:aspect-1 bg-accent w-full'></div>
+                  <div class='h-6 mt-2 w-32 bg-accent rounded shrink-0'></div>
+                  <div class='h-8 mt-2 w-16 bg-accent rounded shrink-0'></div>
+                </div>
+                <div class='hidden md:block'>
+                  <div class='aspect-[1/2] bg-accent w-full'></div>
+                  <div class='h-6 mt-2 w-32 bg-accent rounded'></div>
+                  <div class='h-8 mt-2 w-16 bg-accent rounded'></div>
+                </div>
               </div>
-              <div class='col-span-2 hidden md:block'>
-                <div class='aspect-1 bg-accent w-full'></div>
-                <div class='h-6 mt-2 w-32 bg-accent rounded'></div>
-                <div class='h-8 mt-2 w-16 bg-accent rounded'></div>
+              <div class='md:flex <%= section.preferred_show_more_button ? "justify-between" : "justify-end" %> items-end'>
+                <div class='bg-accent h-12 rounded-full w-full md:w-56 mt-8 md:order-1 hidden md:block'></div>
+                <div class='<%= section.preferred_show_more_button ? "" : "hidden" %> bg-accent h-12 rounded-button w-full md:w-72 mt-6'></div>
               </div>
-              <div class='col-span-2 hidden md:block'>
-                <div class='aspect-1 bg-accent w-full'></div>
-                <div class='h-6 mt-2 w-32 bg-accent rounded'></div>
-                <div class='h-8 mt-2 w-16 bg-accent rounded'></div>
+            <% else %>
+              <div class='grid gap-4 md:gap-6 grid-cols-8 relative'>
+                <div class='col-span-6 md:col-span-2'>
+                  <div class='aspect-1 bg-accent w-full'></div>
+                  <div class='h-6 mt-2 w-32 bg-accent rounded'></div>
+                  <div class='h-8 mt-2 w-16 bg-accent rounded'></div>
+                </div>
+                <div class='col-span-2 md:col-span-2 flex flex-col'>
+                  <div class='aspect-[1/3] md:aspect-1 bg-accent w-full flex-1'></div>
+                  <div class='h-6 mt-2 w-32 bg-accent rounded'></div>
+                  <div class='h-8 mt-2 w-16 bg-accent rounded'></div>
+                </div>
+                <div class='col-span-2 hidden md:block'>
+                  <div class='aspect-1 bg-accent w-full'></div>
+                  <div class='h-6 mt-2 w-32 bg-accent rounded'></div>
+                  <div class='h-8 mt-2 w-16 bg-accent rounded'></div>
+                </div>
+                <div class='col-span-2 hidden md:block'>
+                  <div class='aspect-1 bg-accent w-full'></div>
+                  <div class='h-6 mt-2 w-32 bg-accent rounded'></div>
+                  <div class='h-8 mt-2 w-16 bg-accent rounded'></div>
+                </div>
               </div>
-            </div>
-            <div class="md:hidden w-full block rounded-button bg-accent h-12 mt-8"></div>
-          <% end %>
+              <div class="md:hidden w-full block rounded-button bg-accent h-12 mt-8"></div>
+            <% end %>
+          </div>
         </div>
-      </div>
-    <% end %>
+      <% end %>
+    </div>
   </div>
-</div>
+<% end %>

data/app/views/themes/default/spree/page_sections/_header.html.erb

@@ -1,6 +1,6 @@
 <% layout = section.preferred_layout %>
 <header
-  class='sticky has-[.currency-and-locale-modal:not(.hidden)]:relative top-0 z-50 has-[.currency-and-locale-modal:not(.hidden)]:z-[unset] header-<%= layout %>'
+  class='header-<%= layout %>'
   data-controller='header toggle-menu slideover <%= "slideover-account" if show_account_pane? %>'
   data-toggle-menu-class='hamburger-visible'
   data-slideover-invisible-class='translate-x-full,opacity-0'
@@ -13,7 +13,7 @@
   <nav
     aria-label='Top'
     style="<%= section_styles(section) %>"
-    class="transition-transform duration-300 relative">
+    class="relative transition-transform duration-300">
     <div class='page-container'>
       <div class='flex items-center<%= " lg:items-end" if layout == "logo-centered" %> <%= " lg:items-center" unless layout == "logo-centered" %> justify-between '>
         <% unless layout == 'logo-centered' %>
@@ -21,15 +21,14 @@
             <%= render 'spree/shared/logo', logo: section.logo, height: section.preferred_desktop_logo_height %>
           </div>
         <% end %>
-
         <div class='flex -order-1 flex-1 <%= " lg:flex-none lg:order-1 z-10 lg:mr-8" unless layout == "logo-centered" %>'>
           <!-- Mobile menu toggle, controls the 'mobileMenuOpen' state. -->
           <button
             type='button'
             data-action='click->toggle-menu#toggle touch->toggle-menu#toggle'
-            class='lg:hidden relative w-6'
+            class='relative w-6 lg:hidden'
             data-toggle-menu-target='button'
-          >
+            >
             <span class='sr-only'><%= Spree.t(:toggle_menu) %></span>
             <div
               class='absolute top-0'
@@ -42,39 +41,37 @@
               <%= render 'spree/shared/icons/close', color: section.preferred_text_color %>
             </div>
           </button>
-
           <!-- Search button -->
           <div class='<%= "lg:relative" unless layout == "logo-centered" %> flex'>
             <button
-              class='ml-4 lg:ml-0 flex items-center'
+              class='flex items-center ml-4 lg:ml-0'
               id='open-search'
               data-action='click->toggle-menu#hide touch->toggle-menu#hide'
-            >
+              >
               <%= render 'spree/shared/icons/search', color: section.preferred_text_color %>
               <span class='hidden lg:block ml-2 text-sm !leading-6 uppercase'><%= Spree.t(:search) %></span>
             </button>
           </div>
         </div>
-
         <div class='flex items-center flex-col<%= " lg:flex-1" unless layout == "logo-centered" %> header-nav-container'>
           <!-- Logo -->
           <div class='<%= "flex lg:pb-4" if layout == "logo-centered" %><%= "lg:hidden" unless layout == "logo-centered" %>' id='header-logo'>
             <%= render 'spree/shared/logo', logo: section.logo, height: section.preferred_desktop_logo_height %>
           </div>
-
           <!-- Desktop Menu -->
           <% if layout == 'nav-centered' %>
             <div
               class='hidden lg:flex absolute top-px left-1/2 -translate-x-1/2 justify-center w-[calc(100%-29rem)] overflow-auto'
             >
-          <% end %>
-          <div class='hidden lg:flex<%= " w-full px-12" if layout == "left" %>'>
-            <div class='flex flex-wrap justify-center h-full mx-4'>
-              <%= render 'spree/page_sections/nav/desktop', section: section %>
+            <% end %>
+            <div class='hidden lg:flex<%= " w-full px-12" if layout == "left" %>'>
+              <div class='flex flex-wrap justify-center mx-4 h-full'>
+                <%= render 'spree/page_sections/nav/desktop', section: section %>
+              </div>
             </div>
           </div>
-        </div>
-        <% if layout == 'nav-centered' %></div><% end %>
+          <% if layout == 'nav-centered' %></div>
+        <% end %>
         <div
           class='flex items-center gap-4 flex-1 justify-end<%= " lg:flex-none order-2" unless layout == "logo-centered" %>'
         >
@@ -99,16 +96,15 @@
                   </span>
                 <% end %>
               <% end %>
-              <%= turbo_frame_tag :settings_modal, src: spree.settings_path, loading: :eager  %>
+              <%= turbo_frame_tag :settings_modal, src: spree.settings_path, loading: :lazy  %>
             </div>
           <% end %>
-
           <!-- Desktop Account -->
           <div class='hidden lg:flex'>
             <% if show_account_pane? %>
               <button
                 data-action='click->slideover-account#toggle click@window->slideover-account#hide click->toggle-menu#hide touch->toggle-menu#hide'
-              >
+                >
                 <%= render 'spree/shared/icons/account', color: section.preferred_text_color, section: section %>
               </button>
             <% else %>
@@ -117,7 +113,6 @@
               <% end %>
             <% end %>
           </div>
-
           <% if show_account_pane? %>
             <%= form_with url: spree.account_wishlist_path, method: :get, data: { turbo_stream: true } do %>
               <button
@@ -132,18 +127,17 @@
               <%= render 'spree/shared/wishlist_icon', background_color: section.preferred_background_color %>
             <% end %>
           <% end %>
-
           <!-- Cart -->
           <div
             data-action='click->toggle-menu#hide touch->toggle-menu#hide'
-          >
+            >
             <%= render 'spree/shared/cart_icon' %>
           </div>
         </div>
       </div>
     </div>
     <div
-      class='hide-on-load h-0 opacity-0 pointer-events-none'
+      class='h-0 opacity-0 pointer-events-none hide-on-load'
       data-toggle-menu-target='toggleable'
       role='dialog'
       aria-modal='true'
@@ -161,6 +155,5 @@
   <% if show_account_pane? %>
     <%= render 'spree/shared/account_pane', section: section %>
   <% end %>
-
   <%= render 'spree/shared/search', section: section, logo: section.logo, logo_height: section.preferred_desktop_logo_height %>
 </header>

data/app/views/themes/default/spree/page_sections/nav/_desktop.html.erb

@@ -4,7 +4,13 @@
     <% main_link = presenter.main_link %>
     <% next unless main_link.present? %>
     <div class="header--nav-item group" <%= block_attributes(block, allowed_styles: ['padding-top', 'padding-bottom']) %>>
-      <%= active_link_to spree_storefront_resource_url(main_link.linkable || main_link), data: { title: main_link.label.downcase.strip }, class: "shrink-0 menu-item header--nav-link px-4 py-1", class_active: "menu-item--active", target: main_link.open_in_new_tab.presence && "_blank", rel: main_link.open_in_new_tab.presence && "noopener noreferrer" do %>
+      <%= active_link_to spree_storefront_resource_url(main_link.linkable || main_link),
+          active: main_link.linkable.present? && main_link.linkable.is_a?(Spree::Pages::Homepage) ? :exclusive : :inclusive,
+          data: { title: main_link.label.downcase.strip },
+          class: "shrink-0 menu-item header--nav-link px-4 py-1",
+          class_active: "menu-item--active",
+          target: main_link.open_in_new_tab.presence && "_blank",
+          rel: main_link.open_in_new_tab.presence && "noopener noreferrer" do %>
         <span class="group-hover:border-b-[1.5px] group-hover:border-b-accent"><%= main_link.label %></span>
       <% end %>
       <% if presenter.columns.any? %>
@@ -42,7 +48,14 @@
   <% end %>
 <% else %>
   <% section.links.each do |link| %>
-    <%= active_link_to spree_storefront_resource_url(link.linkable || link), data: { title: link.label.downcase.strip }, class: "shrink-0 menu-item header--nav-link px-4 py-1 focus:mx-0 focus:px-4", class_active: "menu-item--active", target: link.open_in_new_tab.presence && "_blank", rel: link.open_in_new_tab.presence && "noopener noreferrer", **link_attributes(link, as_html: false) do %>
+    <%= active_link_to spree_storefront_resource_url(link.linkable || link),
+        active: link.linkable.present? && link.linkable.is_a?(Spree::Pages::Homepage) ? :exclusive : :inclusive,
+        data: { title: link.label.downcase.strip },
+        class: "shrink-0 menu-item header--nav-link px-4 py-1 focus:mx-0 focus:px-4",
+        class_active: "menu-item--active",
+        target: link.open_in_new_tab.presence && "_blank",
+        rel: link.open_in_new_tab.presence && "noopener noreferrer",
+        **link_attributes(link, as_html: false) do %>
       <span><%= link.label %></span>
     <% end %>
   <% end %>

data/app/views/themes/default/spree/page_sections/nav/_mobile.html.erb

@@ -123,7 +123,7 @@
                   </span>
                 <% end %>
               <% end %>
-              <%= turbo_frame_tag :settings_modal, src: spree.settings_path, loading: :eager  %>
+              <%= turbo_frame_tag :settings_modal, src: spree.settings_path, loading: :lazy  %>
             </div>
           </div>
         <% end %>

data/app/views/themes/default/spree/shared/_cart_pane.html.erb

@@ -33,8 +33,8 @@
         <span class='sr-only'><%= Spree.t('storefront.cart.items_in_cart') %>, <%= Spree.t('storefront.cart.view_bag') %></span>
       </span>
     </div>
-    <div class='flex-1 h-0 overflow-y-auto'>
-      <%= turbo_frame_tag cart_id(order), class: 'cart-contents', src: spree.cart_path, data: { turbo_permanent: true } %>
+    <div class='flex-1 h-0 overflow-y-auto' id="cart-pane-container" data-turbo-permanent>
+      <%= turbo_frame_tag cart_id(order), class: 'cart-contents', src: spree.cart_path, loading: :lazy %>
     </div>
   </div>
 </div>

data/app/views/themes/default/spree/shared/_line_item_options.html.erb

@@ -1,4 +1,6 @@
-<% line_item.variant.option_values.select { |ov| ov.option_type.color? }.each do |option| %>
+<% options = line_item.variant.option_values.includes(:option_type) %>
+
+<% options.select { |ov| ov.option_type.color? }.each do |option| %>
   <div>
     <input class="hidden color-input" value="<%= option.name %>" >
     <div class="label-container h-[30px] border border-default p-0.5 inline-flex items-center hover:border-dashed hover:border-primary">
@@ -9,7 +11,7 @@
     </div>
   </div>
 <% end %>
-<% line_item.variant.option_values.reject { |ov| ov.option_type.color? }.each do |option| %>
+<% options.reject { |ov| ov.option_type.color? }.each do |option| %>
   <div>
     <div class="h-[30px] border border-default px-2 inline-flex items-center hover:border-dashed hover:border-primary text-sm">
       <%= option.presentation %>

data/lib/generators/spree/storefront/install/templates/application.tailwind.css

@@ -38,6 +38,10 @@ html {
   -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
 }
 
+body .section-header {
+  @apply sticky top-0 z-50;
+}
+
 .trix-content a {
   text-decoration: underline;
 }
@@ -198,14 +202,8 @@ textarea.text-input {
   padding-bottom: 0.75rem;
   color: var(--button-text-color, var(--button-text));
   outline-offset: 0.5rem;
-  transition-property:
-    color,
-    background-color,
-    border-color,
-    text-decoration-color,
-    fill,
-    stroke,
-    -webkit-text-decoration-color;
+  transition-property: color, background-color, border-color,
+    text-decoration-color, fill, stroke, -webkit-text-decoration-color;
   transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
   transition-duration: 150ms;
 }
@@ -405,7 +403,7 @@ textarea.text-input {
   h4,
   h5,
   h6 {
-    @apply text-xl pb-1;
+    @apply pb-1 text-xl;
   }
 }
 
@@ -1669,7 +1667,7 @@ html[aria-busy="true"] .hide-on-load {
   h4,
   h5,
   h6 {
-    @apply text-xl font-medium my-4;
+    @apply my-4 text-xl font-medium;
   }
 
   li {
@@ -1704,7 +1702,7 @@ html[aria-busy="true"] .hide-on-load {
   }
 
   .attachment__caption {
-    @apply text-center text-neutral-600 italic;
+    @apply italic text-center text-neutral-600;
   }
 }
 

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: spree_storefront
 version: !ruby/object:Gem::Version
-  version: 5.1.5
+  version: 5.1.6
 platform: ruby
 authors:
 - Vendo Connect Inc.
 autorequire:
 bindir: bin
 cert_chain: []
-date: 2025-08-06 00:00:00.000000000 Z
+date: 2025-09-18 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: spree_core
@@ -16,14 +16,14 @@ dependencies:
     requirements:
     - - ">="
       - !ruby/object:Gem::Version
-        version: 5.1.5
+        version: 5.1.6
   type: :runtime
   prerelease: false
   version_requirements: !ruby/object:Gem::Requirement
     requirements:
     - - ">="
       - !ruby/object:Gem::Version
-        version: 5.1.5
+        version: 5.1.6
 - !ruby/object:Gem::Dependency
   name: active_link_to
   requirement: !ruby/object:Gem::Requirement
@@ -250,6 +250,7 @@ files:
 - app/helpers/spree/products_helper.rb
 - app/helpers/spree/storefront_helper.rb
 - app/helpers/spree/storefront_locale_helper.rb
+- app/helpers/spree/taxons_helper.rb
 - app/helpers/spree/theme_helper.rb
 - app/helpers/spree/turbo_helper.rb
 - app/helpers/spree/turbo_stream_actions_helper.rb
@@ -314,6 +315,7 @@ files:
 - app/views/spree/checkout/_delivery.html.erb
 - app/views/spree/checkout/_delivery_backorder_notice.html.erb
 - app/views/spree/checkout/_delivery_shipping_rate.html.erb
+- app/views/spree/checkout/_footer.html.erb
 - app/views/spree/checkout/_line_item.html.erb
 - app/views/spree/checkout/_line_items.html.erb
 - app/views/spree/checkout/_missing_all_line_items.html.erb
@@ -327,6 +329,7 @@ files:
 - app/views/spree/checkout/_special_instructions.html.erb
 - app/views/spree/checkout/_store_credit.html.erb
 - app/views/spree/checkout/_summary.html.erb
+- app/views/spree/checkout/_terms_and_conditions.html.erb
 - app/views/spree/checkout/_user_account.html.erb
 - app/views/spree/checkout/apply_coupon_code.turbo_stream.erb
 - app/views/spree/checkout/apply_store_credit.turbo_stream.erb
@@ -391,7 +394,6 @@ files:
 - app/views/themes/default/spree/account/profile/edit.html.erb
 - app/views/themes/default/spree/account/store_credits/_store_credit_event.html.erb
 - app/views/themes/default/spree/account/store_credits/index.html.erb
-- app/views/themes/default/spree/checkout/_footer.html.erb
 - app/views/themes/default/spree/checkout/complete.html.erb
 - app/views/themes/default/spree/contacts/new.html.erb
 - app/views/themes/default/spree/orders/_cart.html.erb
@@ -560,9 +562,9 @@ licenses:
 - AGPL-3.0-or-later
 metadata:
   bug_tracker_uri: https://github.com/spree/spree/issues
-  changelog_uri: https://github.com/spree/spree/releases/tag/v5.1.5
+  changelog_uri: https://github.com/spree/spree/releases/tag/v5.1.6
   documentation_uri: https://docs.spreecommerce.org/
-  source_code_uri: https://github.com/spree/spree/tree/v5.1.5
+  source_code_uri: https://github.com/spree/spree/tree/v5.1.6
 post_install_message:
 rdoc_options: []
 require_paths: