spina-blocks 0.3.1 → 0.5.0

data/app/models/spina/blocks/account_extension.rb

@@ -7,6 +7,7 @@ module Spina
 
       included do
         after_save :bootstrap_block_categories
+        after_save :bootstrap_custom_blocks
       end
 
       private
@@ -22,6 +23,37 @@ module Spina
             .update(label: category[:label], position: index)
         end
       end
+
+      def bootstrap_custom_blocks
+        theme_config = Spina::Theme.find_by_name(theme)
+        return unless theme_config
+        return unless theme_config.respond_to?(:custom_blocks) && theme_config.custom_blocks.present?
+
+        theme_config.custom_blocks.each do |block_config|
+          category = if block_config[:category].present?
+            Spina::Blocks::Category.find_by(name: block_config[:category])
+          end
+
+          display_name = block_config[:title].presence || block_config[:name].to_s.titleize
+
+          block = Spina::Blocks::Block
+            .where(key: block_config[:name])
+            .first_or_initialize
+
+          block.assign_attributes(
+            name: block.persisted? ? block.name : display_name,
+            block_template: block_config[:block_template],
+            category: category,
+            deletable: false,
+            active: block.persisted? ? block.active : true,
+          )
+
+          # Set key only on new records (it is immutable after creation)
+          block.key = block_config[:name] unless block.persisted?
+
+          block.save!
+        end
+      end
     end
   end
 end

data/app/models/spina/blocks/block.rb

@@ -12,15 +12,41 @@ module Spina
       has_many :page_blocks, class_name: "Spina::Blocks::PageBlock", dependent: :destroy
       has_many :pages, through: :page_blocks, class_name: "Spina::Page"
 
-      validates :name, presence: true
+      before_destroy :ensure_deletable
+
+      validates :name, presence: true, uniqueness: true
       validates :block_template, presence: true
+      validates :key, uniqueness: { allow_nil: true }
+      validate :key_must_not_change, on: :update
 
       scope :active, -> { where(active: true) }
       scope :sorted, -> { order(:position) }
+      scope :deletable, -> { where(deletable: true) }
+      scope :undeletable, -> { where(deletable: false) }
 
       def to_s
         name
       end
+
+      # Whether this block is a system (custom) block with an immutable key
+      def system?
+        key.present?
+      end
+
+      private
+
+      def ensure_deletable
+        unless deletable?
+          errors.add(:base, :undeletable)
+          throw(:abort)
+        end
+      end
+
+      def key_must_not_change
+        if key_was.present? && key_changed?
+          errors.add(:key, :immutable)
+        end
+      end
     end
   end
 end

data/app/models/spina/blocks/inline_block.rb

@@ -0,0 +1,63 @@
+# frozen_string_literal: true
+
+module Spina
+  module Blocks
+    # Duck-typed stand-in for a Spina::Blocks::Block whose content lives inline
+    # in the page (a RepeaterContent) rather than in a persisted block record.
+    #
+    # It exposes just enough of the Block interface for `render_block` and block
+    # template partials to work unchanged: `active?`, `block_template`, and
+    # `content` / `has_content?` delegating to the inline RepeaterContent.
+    class InlineBlock
+      attr_reader :block_template
+
+      def initialize(repeater_content, block_template)
+        @repeater_content = repeater_content
+        @block_template = block_template.to_s
+      end
+
+      def active?
+        true
+      end
+
+      # Mirrors Spina::Partable#content: named lookup returns the part's content,
+      # no argument returns a ContentPresenter.
+      def content(name = nil)
+        repeater_content.content(name)
+      end
+
+      def has_content?(name)
+        repeater_content.has_content?(name)
+      end
+
+      # Kept in step with the content so callers can hand a view context down
+      # explicitly. Without it ContentPresenter has to fall back on
+      # Spina::Current.page, which isn't set everywhere blocks are rendered.
+      def view_context
+        repeater_content.view_context
+      end
+
+      def view_context=(value)
+        repeater_content.view_context = value
+        # Partable memoises its ContentPresenter, capturing the view context
+        # resolved on first use. Drop the memo so a later assignment still takes
+        # effect instead of silently doing nothing.
+        repeater_content.instance_variable_set(:@content_presenter, nil)
+      end
+
+      # Surfaced by render_block's fallback when a block template partial is
+      # missing — naming the template is what makes that visible to an editor.
+      def name
+        block_template
+      end
+
+      def to_s
+        block_template
+      end
+
+      private
+
+      attr_reader :repeater_content
+    end
+  end
+end

data/app/models/spina/parts/block_reference.rb

@@ -4,13 +4,121 @@ module Spina
   module Parts
     class BlockReference < Base
       include BlockFilterable
+      include AttrJson::NestedAttributes
+
+      BOOLEAN_TYPE = ActiveModel::Type::Boolean.new.freeze
 
       attr_json :block_id, :integer, default: nil
+      # "reference" (default): points at a shared block via block_id / custom_block.
+      # "inline": content is filled in and stored on the page itself.
+      attr_json :mode, :string, default: nil
+      # Inline content, used when mode == "inline". Same shape as a Section's
+      # content: a RepeaterContent holding the block template's parts.
+      attr_json :inline_content, RepeaterContent.to_type, default: nil
+      attr_json_accepts_nested_attributes_for :inline_content
+      # The block template inline content was filled in against, persisted with
+      # the content itself. Part options are a theme-side concern and are only
+      # attached when Spina builds parts for the admin form — parts deserialized
+      # from stored page JSON (i.e. when rendering the site) carry none — so
+      # inline content has to be self-describing to render.
+      attr_json :inline_block_template, :string, default: nil
 
       attr_accessor :options
 
       def content
-        ::Spina::Blocks::Block.active.find_by(id: block_id)
+        return inline_block if inline?
+
+        if custom_block_name.present?
+          custom_block_record
+        else
+          ::Spina::Blocks::Block.active.find_by(id: block_id)
+        end
+      end
+
+      # Whether this reference is filled inline (page-local) instead of pointing
+      # at a shared block. Absent/blank mode is treated as "reference" so existing
+      # parts stay backward compatible.
+      def inline?
+        mode.to_s == "inline"
+      end
+
+      # Whether the theme lets this part be filled in inline. Off unless opted in,
+      # so a reference keeps meaning "pick a shared block" by default.
+      #
+      # This gates the editor only. Content already stored inline keeps rendering
+      # if the option is later removed, rather than vanishing from the site.
+      def inline_allowed?
+        return false if options.blank?
+
+        value = options.key?(:inline) ? options[:inline] : options["inline"]
+        BOOLEAN_TYPE.cast(value) || false
+      end
+
+      # Optional block template restriction from the part's theme options. Filters
+      # the block picker and, when present, is what inline mode fills in against.
+      # Only available where options are attached (the admin form).
+      def block_template_name
+        return if options.blank?
+
+        options[:block_template] || options["block_template"]
+      end
+
+      # Returns the custom_block key from options, supporting both symbol and string keys
+      def custom_block_name
+        return if options.blank?
+
+        options[:custom_block] || options["custom_block"]
+      end
+
+      # Looks up the custom block record by key
+      def custom_block_record
+        return if custom_block_name.blank?
+
+        ::Spina::Blocks::Block.find_by(key: custom_block_name)
+      end
+
+      # Accepts inline content as a JSON string so the form can round-trip
+      # content it cannot render fields for — e.g. the block template is no
+      # longer registered in the theme. Without it the next save would drop
+      # stored content that is still rendering on the site.
+      def inline_content_json=(raw)
+        return if raw.blank?
+
+        parsed = JSON.parse(raw)
+        self.inline_content = parsed if parsed.is_a?(Hash)
+      rescue StandardError
+        # Best-effort restore of a value that arrives from a client-controlled
+        # hidden field: malformed JSON, or a payload naming a part type attr_json
+        # won't build, must leave the stored content alone rather than break the
+        # page save.
+        nil
+      end
+
+      private
+
+      # Wraps inline content so it renders through the same block template partial
+      # as a shared block. Returns nil when nothing has been filled in, so callers
+      # using `render_block(content)` render nothing (matching an empty reference).
+      def inline_block
+        template = inline_block_template.presence || block_template_name.presence
+        # Without a template there is no partial to render; bail out rather than
+        # let render_block fall through to its empty placeholder wrapper.
+        return if template.blank?
+        return if inline_content.blank?
+        return if Array(inline_content.parts).none? { |part| part_filled?(part) }
+
+        ::Spina::Blocks::InlineBlock.new(inline_content, template)
+      end
+
+      # Defers to each part's own `present?`, which Image and Attachment override
+      # to check for an attached blob. The one case `present?` gets wrong here is
+      # a boolean-shaped part deliberately set to false — empty by Rails' rules,
+      # filled by the editor's.
+      def part_filled?(part)
+        value = part.content
+        return true if value == false
+
+        value.present?
       end
     end
   end

data/app/models/spina/parts/content_block.rb

@@ -0,0 +1,18 @@
+# frozen_string_literal: true
+
+module Spina
+  module Parts
+    class ContentBlock < Base
+      include Partable
+      include AttrJson::NestedAttributes
+
+      attr_json :block_type, :string
+      attr_json :parts, AttrJson::Type::SpinaPartsModel.new, array: true
+      attr_json_accepts_nested_attributes_for :parts
+
+      def find_part(name)
+        (parts || []).find { |part| part.name.to_s == name.to_s }
+      end
+    end
+  end
+end

data/app/models/spina/parts/content_blocks.rb

@@ -0,0 +1,25 @@
+# frozen_string_literal: true
+
+module Spina
+  module Parts
+    class ContentBlocks < Base
+      include AttrJson::NestedAttributes
+
+      attr_json :content, ContentBlock.to_type, array: true
+      attr_json_accepts_nested_attributes_for :content
+
+      attr_accessor :options
+
+      # Returns available content block templates from the theme,
+      # optionally filtered by the :content_block_templates option.
+      def available_templates(theme)
+        templates = theme.content_block_templates || []
+        allowed = options&.dig(:content_block_templates)
+        return templates if allowed.blank?
+
+        allowed_names = Array(allowed).map(&:to_s)
+        templates.select { |t| allowed_names.include?(t[:name].to_s) }
+      end
+    end
+  end
+end

data/app/models/spina/parts/nested_content_blocks.rb

@@ -0,0 +1,15 @@
+# frozen_string_literal: true
+
+module Spina
+  module Parts
+    # Same behavior as ContentBlocks but registered as a separate Part type
+    # with its own Stimulus controller name ("nested-content-blocks").
+    # This avoids Stimulus scope conflicts when used inside Repeaters or
+    # other ContentBlocks containers.
+    #
+    # Use `options[:content_block_templates]` to limit which block types
+    # are available (prevents recursive nesting of the same block type).
+    class NestedContentBlocks < ContentBlocks
+    end
+  end
+end

data/app/views/spina/admin/parts/block_collections/_form.html.erb

@@ -43,7 +43,7 @@
            data-action="input->block-collection#onSearchInput focus->block-collection#onSearchFocus"
            placeholder="Search or add block..."
            autocomplete="off"
-           class="block w-full rounded-md border-gray-300 shadow-sm text-sm focus:border-spina focus:ring-spina" />
+           class="block w-full rounded-md border-gray-300 shadow-xs text-sm focus:border-spina focus:ring-spina" />
 
     <div data-block-collection-target="dropdown"
          style="display:none"
@@ -68,7 +68,7 @@
 
   <%# Selected block list item %>
   <template data-block-collection-target="listItemTemplate">
-    <div class="flex items-center bg-white border border-gray-200 rounded-md px-3 py-2 shadow-sm group" data-block-id="">
+    <div class="flex items-center bg-white border border-gray-200 rounded-md px-3 py-2 shadow-xs group" data-block-id="">
       <button type="button" data-sortable-handle class="mr-2 text-gray-300 hover:text-gray-500 cursor-grab" title="Drag to reorder">
         <svg class="w-4 h-4" fill="currentColor" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512">
           <path d="M432 288H16c-8.8 0-16 7.2-16 16v16c0 8.8 7.2 16 16 16h416c8.8 0 16-7.2 16-16v-16c0-8.8-7.2-16-16-16zm0-112H16c-8.8 0-16 7.2-16 16v16c0 8.8 7.2 16 16 16h416c8.8 0 16-7.2 16-16v-16c0-8.8-7.2-16-16-16z"/>
@@ -84,7 +84,7 @@
           <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M11 5H6a2 2 0 00-2 2v11a2 2 0 002 2h11a2 2 0 002-2v-5m-1.414-9.414a2 2 0 112.828 2.828L11.828 15H9v-2.828l8.586-8.586z"/>
         </svg>
       </a>
-      <button type="button" class="ml-2 text-gray-300 hover:text-red-500 transition-colors"
+      <button type="button" class="ml-2 cursor-pointer text-gray-300 hover:text-red-500 transition-colors"
               data-action="block-collection#remove" data-block-id="" title="Remove">
         <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
           <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"/>
@@ -101,7 +101,7 @@
   <%# Dropdown option (available block) %>
   <template data-block-collection-target="dropdownOptionTemplate">
     <button type="button"
-            class="w-full text-left px-3 py-2 text-sm text-gray-700 hover:bg-gray-100 flex items-center"
+            class="w-full cursor-pointer text-left px-3 py-2 text-sm text-gray-700 hover:bg-gray-100 flex items-center"
             data-action="block-collection#add" data-block-id="">
       <span data-role="title"></span>
     </button>

data/app/views/spina/admin/parts/block_references/_form.html.erb

@@ -1,13 +1,121 @@
-<div class="mt-6">
-  <label class="block text-sm leading-5 font-medium text-gray-700"><%= f.object.title %></label>
-  <% if f.object.hint.present? %>
-    <div class="text-gray-400 text-sm"><%= f.object.hint %></div>
+<%
+  part = f.object
+
+  # Prefer the template the theme binds this part to; fall back to the one the
+  # stored content was filled in against, so dropping the option from the theme
+  # leaves existing inline content editable instead of silently unrenderable.
+  template_name = part.block_template_name.presence || part.inline_block_template.presence
+
+  # Inline mode is opt-in per part, needs a known field set, and never applies to
+  # a fixed system block.
+  inline_parts = []
+  if part.inline_allowed? && part.custom_block_name.blank? && template_name.present?
+    block_template = current_theme.block_templates.find { |bt| bt[:name].to_s == template_name.to_s }
+    inline_parts = block_template&.dig(:parts) || []
+  end
+
+  allow_inline = inline_parts.any?
+  current_mode = part.inline? ? "inline" : "reference"
+
+  # Content filled in inline while the part no longer offers inline editing —
+  # the theme dropped `inline: true`, or its block template is gone. The content
+  # still renders, so offering the block picker here would be a no-op: `content`
+  # returns the inline content regardless of what's selected.
+  inline_not_editable = part.inline? && !allow_inline
+
+  # Mirrors Spina::Pages::TabButtonComponent and the tabs controller's class
+  # lists, so the toggle reads as a Spina tab bar. Applied server-side too, so
+  # the current mode is correct before (and without) Stimulus.
+  tab_button_classes = "block px-3 leading-relaxed py-1 rounded-md hover:text-gray-800 " \
+                       "font-medium text-sm flex items-center whitespace-nowrap"
+  active_classes = "cursor-default text-gray-900 bg-spina-dark/10"
+  inactive_classes = "cursor-pointer bg-transparent text-gray-400 border-transparent"
+%>
+
+<div class="mt-6"
+     data-controller="block-reference-mode"
+     data-block-reference-mode-active="<%= active_classes %>"
+     data-block-reference-mode-inactive="<%= inactive_classes %>">
+  <label class="block text-sm leading-5 font-medium text-gray-700"><%= part.title %></label>
+  <% if part.hint.present? %>
+    <div class="text-gray-400 text-sm"><%= part.hint %></div>
   <% end %>
-  <div class="mt-1">
-    <% blocks = f.object.available_blocks %>
-    <%= f.select :block_id,
-          blocks.map { |b| [b.name, b.id] },
-          {include_blank: t('spina.blocks.select_block')},
-          class: "form-select text-sm w-full shadow-xs" %>
+
+  <% if allow_inline %>
+    <%= f.hidden_field :mode, value: current_mode, data: { block_reference_mode_target: "modeField" } %>
+
+    <div class="mt-2 inline-flex w-auto rounded-md bg-white">
+      <% { "reference" => t("spina.blocks.mode_reference"), "inline" => t("spina.blocks.mode_inline") }.each do |mode_value, label| %>
+        <button type="button"
+                class="<%= tab_button_classes %> <%= mode_value == current_mode ? active_classes : inactive_classes %>"
+                data-mode="<%= mode_value %>"
+                data-block-reference-mode-target="button"
+                data-action="block-reference-mode#switch">
+          <%= label %>
+        </button>
+      <% end %>
+    </div>
+  <% else %>
+    <%= f.hidden_field :mode %>
+
+    <% if part.inline_content.present? %>
+      <%# No field set to render (template gone from the theme), but the content
+          is still stored and may still be rendering — round-trip it verbatim so
+          saving this page doesn't drop it. %>
+      <%= f.hidden_field :inline_block_template %>
+      <%= f.hidden_field :inline_content_json, value: part.inline_content.as_json.to_json %>
+    <% end %>
+  <% end %>
+
+  <%# ---- Reference pane: pick a shared block (or show a fixed custom block) ----
+      Always rendered, so switching modes stays client-side. %>
+  <div class="<%= allow_inline ? "mt-4" : "mt-1" %>"
+       data-block-reference-mode-target="referencePane"
+       <%= "hidden" if allow_inline && current_mode != "reference" %>>
+    <% if inline_not_editable %>
+      <span class="text-sm text-gray-400"><%= t("spina.blocks.inline_not_editable") %></span>
+    <% elsif part.custom_block_name.present? %>
+      <% custom_block = part.custom_block_record %>
+      <% if custom_block %>
+        <%= link_to custom_block.name,
+              spina.edit_blocks_admin_block_path(custom_block),
+              class: "inline-flex items-center text-sm font-medium text-spina-primary hover:underline" %>
+      <% else %>
+        <span class="text-sm text-red-500"><%= t('spina.blocks.custom_block_not_found') %></span>
+      <% end %>
+    <% else %>
+      <% blocks = part.available_blocks %>
+      <%= f.select :block_id,
+            blocks.map { |b| [b.name, b.id] },
+            {include_blank: t('spina.blocks.select_block')},
+            class: "form-select text-sm w-full shadow-xs" %>
+    <% end %>
   </div>
+
+  <%# ---- Inline pane: fill the block template's fields on the page itself ---- %>
+  <% if allow_inline %>
+    <%
+      inline_rc = part.inline_content ||
+                  Spina::Parts::RepeaterContent.new(name: part.name, title: part.title)
+    %>
+    <div class="mt-4"
+         data-block-reference-mode-target="inlinePane"
+         <%= "hidden" if current_mode != "inline" %>>
+      <%# Persisted with the content so rendering doesn't depend on theme options. %>
+      <%= f.hidden_field :inline_block_template, value: template_name %>
+
+      <%= f.fields_for :inline_content, inline_rc do |ff| %>
+        <%= ff.hidden_field :name, value: part.name %>
+        <%= ff.hidden_field :title, value: part.title %>
+
+        <%= ff.fields_for :parts, build_parts(ff.object, inline_parts) do |fff| %>
+          <%= fff.hidden_field :type, value: fff.object.class.name %>
+          <%= fff.hidden_field :name %>
+          <%= fff.hidden_field :title %>
+
+          <%= render "spina/admin/parts/#{parts_partial_namespace(fff.object.class.to_s)}/form", f: fff %>
+        <% end %>
+      <% end %>
+    </div>
+  <% end %>
 </div>

data/app/views/spina/admin/parts/content_blocks/_fields.html.erb

@@ -0,0 +1,57 @@
+<%#
+  Renders form fields for a single ContentBlock item.
+  Looks up the content_block_template by block_type to determine which parts to render.
+
+  Accepts an optional `stimulus_controller` local to support nested contexts.
+  Defaults to "content-blocks".
+%>
+<% sc = local_assigns[:stimulus_controller] || "content-blocks" %>
+<% template_config = current_theme.content_block_templates&.find { |t| t[:name].to_s == f.object.block_type.to_s } || {} %>
+<% template_title = template_config[:title] || f.object.block_type&.titleize || "Block" %>
+<% parts = template_config[:parts] || [] %>
+
+<div class="border border-gray-200 rounded-md bg-white shadow-xs"
+     data-<%= sc %>-target="block"
+     data-block-type="<%= f.object.block_type %>">
+
+  <%= f.hidden_field :name %>
+  <%= f.hidden_field :block_type %>
+
+  <%# Header: drag handle, type label (clickable to collapse), delete with confirm %>
+  <div class="flex items-center px-4 py-3 border-b border-gray-100 bg-gray-50 rounded-t-md cursor-pointer select-none"
+       data-action="click-><%= sc %>#toggleCollapse">
+    <button type="button" data-sortable-handle
+            class="mr-3 text-gray-300 hover:text-gray-500 cursor-grab">
+      <svg class="w-4 h-4" fill="currentColor" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512">
+        <path d="M432 288H16c-8.8 0-16 7.2-16 16v16c0 8.8 7.2 16 16 16h416c8.8 0 16-7.2 16-16v-16c0-8.8-7.2-16-16-16zm0-112H16c-8.8 0-16 7.2-16 16v16c0 8.8 7.2 16 16 16h416c8.8 0 16-7.2 16-16v-16c0-8.8-7.2-16-16-16z"/>
+      </svg>
+    </button>
+
+    <span class="flex-1 text-sm font-medium text-gray-700"><%= template_title %></span>
+
+    <button type="button"
+            class="ml-3 cursor-pointer text-gray-300 hover:text-red-500 transition-colors"
+            data-action="click-><%= sc %>#removeBlock:stop"
+            title="<%= t('spina.content_blocks.remove') %>">
+      <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"/>
+      </svg>
+    </button>
+  </div>
+
+  <%# Content: form fields for this block's parts %>
+  <div class="px-4 pb-4" data-<%= sc %>-target="blockContent">
+    <% if parts.any? %>
+      <%= f.fields_for :parts, build_parts(f.object, parts) do |ff| %>
+        <%= ff.hidden_field :title %>
+        <%= ff.hidden_field :type, value: ff.object.class %>
+        <%= ff.hidden_field :name %>
+        <%= render "spina/admin/parts/#{parts_partial_namespace(ff.object.class.to_s)}/form", f: ff %>
+      <% end %>
+    <% else %>
+      <p class="text-sm text-gray-400 italic mt-4">
+        <%= t('spina.content_blocks.no_template_found', type: f.object.block_type) %>
+      </p>
+    <% end %>
+  </div>
+</div>

data/app/views/spina/admin/parts/content_blocks/_form.html.erb

@@ -0,0 +1,73 @@
+<%#
+  Admin form for Spina::Parts::ContentBlocks.
+  Renders an ordered list of typed content blocks with add/remove/reorder.
+%>
+<% available_templates = f.object.available_templates(current_theme) %>
+
+<div class="mt-6" data-controller="content-blocks">
+  <label class="block text-sm leading-5 font-medium text-gray-700"><%= f.object.title %></label>
+  <% if f.object.hint.present? %>
+    <div class="text-gray-400 text-sm mb-2"><%= f.object.hint %></div>
+  <% end %>
+
+  <%# List of existing content blocks %>
+  <div data-content-blocks-target="list" class="space-y-3 mb-4">
+    <% (f.object.content || []).each do |content_block| %>
+      <%= f.fields_for :content, [content_block], child_index: content_block.object_id do |ff| %>
+        <%= render "spina/admin/parts/content_blocks/fields", f: ff %>
+      <% end %>
+    <% end %>
+  </div>
+
+  <%# Empty state %>
+  <div data-content-blocks-target="emptyMessage"
+       class="text-sm text-gray-400 italic py-3 text-center"
+       style="<%= (f.object.content || []).any? ? 'display:none' : '' %>">
+    <%= t('spina.content_blocks.empty') %>
+  </div>
+
+  <%# Add block button with type picker dropdown %>
+  <% if available_templates.any? %>
+    <div class="relative">
+      <button type="button"
+              class="btn btn-default text-sm"
+              data-action="content-blocks#toggleTypeMenu">
+        <svg class="w-4 h-4 mr-1.5 inline-block" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+          <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 6v6m0 0v6m0-6h6m-6 0H6"/>
+        </svg>
+        <%= t('spina.content_blocks.add_block') %>
+      </button>
+
+      <div data-content-blocks-target="typeMenu"
+           class="absolute z-10 mt-1 w-56 bg-white border border-gray-200 rounded-md shadow-lg py-1"
+           style="display:none">
+        <% available_templates.each do |template| %>
+          <button type="button"
+                  class="w-full cursor-pointer text-left px-4 py-2 text-sm text-gray-700 hover:bg-gray-100"
+                  data-action="content-blocks#addBlock"
+                  data-block-type="<%= template[:name] %>">
+            <%= template[:title] || template[:name].titleize %>
+          </button>
+        <% end %>
+      </div>
+    </div>
+  <% end %>
+
+  <%# Pre-rendered templates for each block type (used by Stimulus to clone) %>
+  <% available_templates.each do |template| %>
+    <%
+      content_block = Spina::Parts::ContentBlock.new(
+        name: f.object.name,
+        block_type: template[:name].to_s
+      )
+      child_index_placeholder = content_block.object_id.to_s
+    %>
+    <template data-content-blocks-target="blockTemplate"
+              data-block-type="<%= template[:name] %>"
+              data-child-index="<%= child_index_placeholder %>">
+      <%= f.fields_for(:content, [content_block], child_index: child_index_placeholder) do |ff| %>
+        <%= render "spina/admin/parts/content_blocks/fields", f: ff %>
+      <% end %>
+    </template>
+  <% end %>
+</div>