katalyst-content 1.1.1 → 2.0.0

data/app/components/katalyst/content/editor_component.html.erb

@@ -0,0 +1,9 @@
+<%= form_with(model: container, url:, scope:, **html_attributes) do %>
+  <%# Hidden input ensures that if the container is empty then the controller receives an empty array. %>
+  <input type="hidden" name="<%= attributes_scope %>[id]">
+  <%= render Katalyst::Content::Editor::ErrorsComponent.new(container:) %>
+
+  <%= render Katalyst::Content::Editor::TableComponent.new(container:) do |list| %>
+    <%= container.draft_items.each { |item| list.with_item(item) } %>
+  <% end %>
+<% end %>

data/app/components/katalyst/content/editor_component.rb

@@ -0,0 +1,49 @@
+# frozen_string_literal: true
+
+module Katalyst
+  module Content
+    class EditorComponent < Editor::BaseComponent
+      ACTIONS = <<~ACTIONS.gsub(/\s+/, " ").freeze
+        submit->#{CONTAINER_CONTROLLER}#reindex
+        content:drop->#{CONTAINER_CONTROLLER}#drop
+        content:reindex->#{CONTAINER_CONTROLLER}#reindex
+        content:reset->#{CONTAINER_CONTROLLER}#reset
+      ACTIONS
+
+      attr_reader :url, :scope
+
+      def initialize(container:, url: [:admin, container], scope: :container, **)
+        super(container:, **)
+
+        @url   = url
+        @scope = scope
+      end
+
+      def status_bar
+        Editor::StatusBarComponent.new(container:)
+      end
+
+      def new_items
+        Editor::NewItemsComponent.new(container:)
+      end
+
+      def item(item:)
+        Editor::ItemComponent.new(container:, item:)
+      end
+
+      def errors
+        Editor::ErrorsComponent.new(container:)
+      end
+
+      def default_html_attributes
+        {
+          id:   container_form_id,
+          data: {
+            controller: CONTAINER_CONTROLLER,
+            action:     ACTIONS,
+          },
+        }
+      end
+    end
+  end
+end

data/app/controllers/katalyst/content/items_controller.rb

@@ -20,9 +20,10 @@ module Katalyst
       def create
         @item = item = @container.items.build(item_params)
         if item.save
-          render :update, locals: { item: item, previous: @container.items.build(type: item.type) }
+          editor = Katalyst::Content::EditorComponent.new(container: @item.container, item: @item)
+          render :update, locals: { editor:, item:, previous: @container.items.build(type: item.type) }
         else
-          render :new, status: :unprocessable_entity, locals: { item: item }
+          render :new, status: :unprocessable_entity, locals: { item: }
         end
       end
 
@@ -32,7 +33,9 @@ module Katalyst
         if @item.valid?
           previous = @item
           @item    = @item.dup.tap(&:save!)
-          render locals: { item: @item, previous: previous }
+          editor   = Katalyst::Content::EditorComponent.new(container: @item.container, item: @item)
+
+          render locals: { editor:, item: @item, previous: }
         else
           render :edit, status: :unprocessable_entity, locals: { item: @item }
         end

data/app/helpers/katalyst/content/editor_helper.rb

@@ -3,60 +3,16 @@
 module Katalyst
   module Content
     module EditorHelper
-      def content_editor_new_items(container:)
-        Katalyst::Content.config.items.map do |item_class|
-          item_class = item_class.safe_constantize if item_class.is_a?(String)
-          item_class.new(container: container)
-        end
-      end
-
-      def content_editor_container(container:, **options, &block)
-        Editor::Container.new(self, container).build(options, &block)
-      end
-
-      def content_editor_list(container:, items: container.draft_items, **options)
-        Editor::List.new(self, container).build(options) do |list|
-          list.items(*items) if items.present?
-        end
-      end
-
-      # Generate items without their list wrapper, similar to form_with/fields
-      def content_editor_items(item:, container: item.container)
-        Editor::List.new(self, container).items(item)
-      end
-
-      # Generate a turbo stream fragment that will show structural errors to the user.
-      def content_editor_errors(container:, **options)
-        turbo_stream.replace(dom_id(container, :errors),
-                             Editor::Errors.new(self, container).build(**options))
-      end
+      using Katalyst::HtmlAttributes::HasHtmlAttributes
 
-      # Gene
-      def content_editor_new_item(item:, container: item.container, **options, &block)
-        Editor::NewItem.new(self, container).build(item, **options, &block)
-      end
-
-      def content_editor_item(item:, container: item.container, **options, &block)
-        Editor::Item.new(self, container).build(item, **options, &block)
-      end
-
-      def content_editor_status_bar(container:, **options)
-        Editor::StatusBar.new(self, container).build(**options)
-      end
-
-      def content_editor_rich_text_options(options = {})
-        defaults = {
+      def content_editor_rich_text_attributes(attributes = {})
+        {
           data: {
             direct_upload_url: direct_uploads_url,
             controller:        "content--editor--trix",
             action:            "trix-initialize->content--editor--trix#trixInitialize",
           },
-        }
-        defaults.deep_merge(options)
-      end
-
-      def content_editor_image_field(...)
-        Editor::ImageField.new(self, item.container).build(...)
+        }.merge_html(attributes)
       end
 
       # When rendering item forms do not include the controller namespace prefix (katalyst/content)

data/app/helpers/katalyst/content/frontend_helper.rb

@@ -51,9 +51,9 @@ module Katalyst
         self.item     = item
       end
 
-      def render(**options, &block)
-        content_tag tag, **default_options(**options) do
-          content_tag :div, &block
+      def render(**, &)
+        content_tag tag, **default_options(**) do
+          content_tag(:div, &)
         end
       end
 

data/app/javascript/content/application.js

@@ -0,0 +1,35 @@
+import ContainerController from "./editor/container_controller";
+import ItemController from "./editor/item_controller";
+import ListController from "./editor/list_controller";
+import NewItemController from "./editor/new_item_controller";
+import StatusBarController from "./editor/status_bar_controller";
+import TrixController from "./editor/trix_controller";
+
+const Definitions = [
+  {
+    identifier: "content--editor--container",
+    controllerConstructor: ContainerController,
+  },
+  {
+    identifier: "content--editor--item",
+    controllerConstructor: ItemController,
+  },
+  {
+    identifier: "content--editor--list",
+    controllerConstructor: ListController,
+  },
+  {
+    identifier: "content--editor--new-item",
+    controllerConstructor: NewItemController,
+  },
+  {
+    identifier: "content--editor--status-bar",
+    controllerConstructor: StatusBarController,
+  },
+  {
+    identifier: "content--editor--trix",
+    controllerConstructor: TrixController,
+  },
+];
+
+export { Definitions as default };

data/app/{assets/javascripts/utils → javascript}/content/editor/container.js

@@ -1,4 +1,4 @@
-import Item from "utils/content/editor/item";
+import Item from "./item";
 
 /**
  * @param nodes {NodeList}

data/app/{assets/javascripts/controllers → javascript}/content/editor/container_controller.js

@@ -1,8 +1,8 @@
 import { Controller } from "@hotwired/stimulus";
 
-import Item from "utils/content/editor/item";
-import Container from "utils/content/editor/container";
-import RulesEngine from "utils/content/editor/rules-engine";
+import Item from "./item";
+import Container from "./container";
+import RulesEngine from "./rules_engine";
 
 export default class ContainerController extends Controller {
   static targets = ["container"];

data/app/{assets/javascripts/controllers → javascript}/content/editor/item_controller.js

@@ -1,5 +1,5 @@
 import { Controller } from "@hotwired/stimulus";
-import Item from "utils/content/editor/item";
+import Item from "./item";
 
 export default class ItemController extends Controller {
   get item() {

data/app/{assets/javascripts/controllers → javascript}/content/editor/list_controller.js

@@ -82,7 +82,10 @@ export default class ListController extends Controller {
   }
 
   dropTarget(e) {
-    return e && e.closest("[data-controller='content--editor--list'] > *");
+    return (
+      e.closest("[data-controller='content--editor--list'] > *") ||
+      e.closest("[data-controller='content--editor--list']")
+    );
   }
 
   reindex() {
@@ -95,7 +98,10 @@ export default class ListController extends Controller {
 }
 
 function swap(target, item) {
-  if (target && target !== item) {
+  if (!target) return;
+  if (target === item) return;
+
+  if (target.nodeName === "LI") {
     const positionComparison = target.compareDocumentPosition(item);
     if (positionComparison & Node.DOCUMENT_POSITION_FOLLOWING) {
       target.insertAdjacentElement("beforebegin", item);
@@ -103,4 +109,8 @@ function swap(target, item) {
       target.insertAdjacentElement("afterend", item);
     }
   }
+
+  if (target.nodeName === "OL") {
+    target.appendChild(item);
+  }
 }

data/app/models/katalyst/content/types/nodes_type.rb

@@ -27,13 +27,13 @@ module Katalyst
         # Deserialize a params-style array, e.g. "0" => { ... }
         def deserialize_params(value)
           value.map do |index, attributes|
-            Node.new(index: index, **attributes)
+            Node.new(index:, **attributes)
           end.select(&:id).sort_by(&:index)
         end
 
         def deserialize_array(value)
           value.map.with_index do |attributes, index|
-            Node.new(index: index, **attributes)
+            Node.new(index:, **attributes)
           end.select(&:id).sort_by(&:index)
         end
       end

data/app/views/active_storage/blobs/_blob.html.erb

@@ -1,6 +1,6 @@
 <figure class="attachment attachment--<%= blob.representable? ? "preview" : "file" %> attachment--<%= blob.filename.extension %>">
   <% if blob.representable? %>
-    <%= image_tag main_app.url_for(blob.representation(resize_to_limit: local_assigns[:in_gallery] ? [ 800, 600 ] : [ 1024, 768 ])) %>
+    <%= image_tag main_app.url_for(blob.representation(resize_to_limit: local_assigns[:in_gallery] ? [800, 600] : [1024, 768])) %>
   <% end %>
 
   <figcaption class="attachment__caption">

data/app/views/katalyst/content/asides/_aside.html+form.erb

@@ -1,6 +1,6 @@
 <%= form_with model: aside, scope: :item, url: path do |form| %>
-  <%= render "hidden_fields", form: form %>
-  <%= render "form_errors", form: form %>
+  <%= render "hidden_fields", form: %>
+  <%= render "form_errors", form: %>
 
   <div class="field">
     <%= form.label :heading %>

data/app/views/katalyst/content/columns/_column.html+form.erb

@@ -1,6 +1,6 @@
 <%= form_with model: column, scope: :item, url: path do |form| %>
-  <%= render "hidden_fields", form: form %>
-  <%= render "form_errors", form: form %>
+  <%= render "hidden_fields", form: %>
+  <%= render "form_errors", form: %>
 
   <div class="field">
     <%= form.label :heading %>

data/app/views/katalyst/content/contents/_content.html+form.erb

@@ -1,6 +1,6 @@
 <%= form_with model: content, scope: :item, url: path do |form| %>
-  <%= render "hidden_fields", form: form %>
-  <%= render "form_errors", form: form %>
+  <%= render "hidden_fields", form: %>
+  <%= render "form_errors", form: %>
 
   <div class="field">
     <%= form.label :heading %>
@@ -24,7 +24,7 @@
 
   <div class="field">
     <%= form.label :content %>
-    <%= form.rich_text_area :content, content_editor_rich_text_options %>
+    <%= form.rich_text_area :content, content_editor_rich_text_attributes %>
   </div>
 
   <%= form.submit "Done" %>

data/app/views/katalyst/content/figures/_figure.html+form.erb

@@ -1,6 +1,6 @@
 <%= form_with model: figure, scope: :item, url: path do |form| %>
-  <%= render "hidden_fields", form: form %>
-  <%= render "form_errors", form: form %>
+  <%= render "hidden_fields", form: %>
+  <%= render "form_errors", form: %>
 
   <div class="field">
     <%= form.label :image %>

data/app/views/katalyst/content/groups/_group.html+form.erb

@@ -1,6 +1,6 @@
 <%= form_with model: group, scope: :item, url: path do |form| %>
-  <%= render "hidden_fields", form: form %>
-  <%= render "form_errors", form: form %>
+  <%= render "hidden_fields", form: %>
+  <%= render "form_errors", form: %>
 
   <div class="field">
     <%= form.label :heading %>

data/app/views/katalyst/content/items/_item.html+form.erb

@@ -1,6 +1,6 @@
 <%= form_with model: item, scope: :item, url: path do |form| %>
-  <%= render "hidden_fields", form: form %>
-  <%= render "form_errors", form: form %>
+  <%= render "hidden_fields", form: %>
+  <%= render "form_errors", form: %>
 
   <div class="field">
     <%= form.label :heading %>

data/app/views/katalyst/content/items/update.turbo_stream.erb

@@ -1,7 +1,7 @@
 <%= turbo_stream.replace "content--editor--item-frame" do %>
-  <%= render "katalyst/content/editor/new_items", container: item.container %>
+  <%= render editor.new_items %>
 <% end %>
 
 <%= turbo_stream.replace dom_id(previous) do %>
-  <%= render "katalyst/content/editor/item", item: item %>
+  <%= render editor.item(item:) %>
 <% end %>

data/app/views/katalyst/content/sections/_section.html+form.erb

@@ -1,6 +1,6 @@
 <%= form_with model: section, scope: :item, url: path do |form| %>
-  <%= render "hidden_fields", form: form %>
-  <%= render "form_errors", form: form %>
+  <%= render "hidden_fields", form: %>
+  <%= render "form_errors", form: %>
 
   <div class="field">
     <%= form.label :heading %>

data/config/importmap.rb

@@ -1,8 +1,3 @@
 # frozen_string_literal: true
 
-pin "trix"
-pin "@rails/actiontext", to: "actiontext.js"
-
-pin_all_from Katalyst::Content::Engine.root.join("app/assets/javascripts"),
-             # preload in tests so that we don't start clicking before controllers load
-             preload: Rails.env.test?
+pin "@katalyst/content", to: "katalyst/content.js", preload: true

data/lib/katalyst/content.rb

@@ -2,7 +2,6 @@
 
 require "katalyst/content/config"
 require "katalyst/content/engine"
-require "katalyst/content/version"
 
 module Katalyst
   module Content

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: katalyst-content
 version: !ruby/object:Gem::Version
-  version: 1.1.1
+  version: 2.0.0
 platform: ruby
 authors:
 - Katalyst Interactive
 autorequire:
 bindir: bin
 cert_chain: []
-date: 2023-11-14 00:00:00.000000000 Z
+date: 2023-12-05 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: active_storage_validations
@@ -24,6 +24,34 @@ dependencies:
     - - ">="
       - !ruby/object:Gem::Version
         version: '0'
+- !ruby/object:Gem::Dependency
+  name: katalyst-html-attributes
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: '0'
+  type: :runtime
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: '0'
+- !ruby/object:Gem::Dependency
+  name: view_component
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: '0'
+  type: :runtime
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: '0'
 description:
 email:
 - developers@katalyst.com.au
@@ -33,16 +61,11 @@ extra_rdoc_files: []
 files:
 - LICENSE.txt
 - README.md
+- app/assets/builds/katalyst/content.esm.js
+- app/assets/builds/katalyst/content.js
+- app/assets/builds/katalyst/content.min.js
+- app/assets/builds/katalyst/content.min.js.map
 - app/assets/config/katalyst-content.js
-- app/assets/javascripts/controllers/content/editor/container_controller.js
-- app/assets/javascripts/controllers/content/editor/item_controller.js
-- app/assets/javascripts/controllers/content/editor/list_controller.js
-- app/assets/javascripts/controllers/content/editor/new_item_controller.js
-- app/assets/javascripts/controllers/content/editor/status_bar_controller.js
-- app/assets/javascripts/controllers/content/editor/trix_controller.js
-- app/assets/javascripts/utils/content/editor/container.js
-- app/assets/javascripts/utils/content/editor/item.js
-- app/assets/javascripts/utils/content/editor/rules-engine.js
 - app/assets/stylesheets/katalyst/content/_index.scss
 - app/assets/stylesheets/katalyst/content/editor/_figure.scss
 - app/assets/stylesheets/katalyst/content/editor/_icon.scss
@@ -52,18 +75,37 @@ files:
 - app/assets/stylesheets/katalyst/content/editor/_new-items.scss
 - app/assets/stylesheets/katalyst/content/editor/_status-bar.scss
 - app/assets/stylesheets/katalyst/content/editor/_trix-rails.scss
+- app/components/katalyst/content/editor/base_component.rb
+- app/components/katalyst/content/editor/errors_component.html.erb
+- app/components/katalyst/content/editor/errors_component.rb
+- app/components/katalyst/content/editor/item_component.html.erb
+- app/components/katalyst/content/editor/item_component.rb
+- app/components/katalyst/content/editor/new_item_component.html.erb
+- app/components/katalyst/content/editor/new_item_component.rb
+- app/components/katalyst/content/editor/new_items_component.html.erb
+- app/components/katalyst/content/editor/new_items_component.rb
+- app/components/katalyst/content/editor/row_component.html.erb
+- app/components/katalyst/content/editor/row_component.rb
+- app/components/katalyst/content/editor/status_bar_component.rb
+- app/components/katalyst/content/editor/table_component.html.erb
+- app/components/katalyst/content/editor/table_component.rb
+- app/components/katalyst/content/editor_component.html.erb
+- app/components/katalyst/content/editor_component.rb
 - app/controllers/katalyst/content/application_controller.rb
 - app/controllers/katalyst/content/direct_uploads_controller.rb
 - app/controllers/katalyst/content/items_controller.rb
-- app/helpers/katalyst/content/editor/base.rb
-- app/helpers/katalyst/content/editor/container.rb
-- app/helpers/katalyst/content/editor/errors.rb
-- app/helpers/katalyst/content/editor/item.rb
-- app/helpers/katalyst/content/editor/list.rb
-- app/helpers/katalyst/content/editor/new_item.rb
-- app/helpers/katalyst/content/editor/status_bar.rb
 - app/helpers/katalyst/content/editor_helper.rb
 - app/helpers/katalyst/content/frontend_helper.rb
+- app/javascript/content/application.js
+- app/javascript/content/editor/container.js
+- app/javascript/content/editor/container_controller.js
+- app/javascript/content/editor/item.js
+- app/javascript/content/editor/item_controller.js
+- app/javascript/content/editor/list_controller.js
+- app/javascript/content/editor/new_item_controller.js
+- app/javascript/content/editor/rules_engine.js
+- app/javascript/content/editor/status_bar_controller.js
+- app/javascript/content/editor/trix_controller.js
 - app/models/concerns/katalyst/content/container.rb
 - app/models/concerns/katalyst/content/garbage_collection.rb
 - app/models/concerns/katalyst/content/has_tree.rb
@@ -85,10 +127,6 @@ files:
 - app/views/katalyst/content/columns/_column.html.erb
 - app/views/katalyst/content/contents/_content.html+form.erb
 - app/views/katalyst/content/contents/_content.html.erb
-- app/views/katalyst/content/editor/_item.html.erb
-- app/views/katalyst/content/editor/_list_item.html.erb
-- app/views/katalyst/content/editor/_new_item.html.erb
-- app/views/katalyst/content/editor/_new_items.html.erb
 - app/views/katalyst/content/figures/_figure.html+form.erb
 - app/views/katalyst/content/figures/_figure.html.erb
 - app/views/katalyst/content/groups/_group.html+form.erb
@@ -112,7 +150,6 @@ files:
 - lib/katalyst/content.rb
 - lib/katalyst/content/config.rb
 - lib/katalyst/content/engine.rb
-- lib/katalyst/content/version.rb
 - spec/factories/katalyst/content/items.rb
 homepage: https://github.com/katalyst/content
 licenses:
@@ -127,7 +164,7 @@ required_ruby_version: !ruby/object:Gem::Requirement
   requirements:
   - - ">="
     - !ruby/object:Gem::Version
-      version: '3.0'
+      version: '3.2'
 required_rubygems_version: !ruby/object:Gem::Requirement
   requirements:
   - - ">="

data/app/helpers/katalyst/content/editor/container.rb

@@ -1,43 +0,0 @@
-# frozen_string_literal: true
-
-module Katalyst
-  module Content
-    module Editor
-      class Container < Base
-        ACTIONS = <<~ACTIONS.gsub(/\s+/, " ").freeze
-          submit->#{CONTAINER_CONTROLLER}#reindex
-          content:drop->#{CONTAINER_CONTROLLER}#drop
-          content:reindex->#{CONTAINER_CONTROLLER}#reindex
-          content:reset->#{CONTAINER_CONTROLLER}#reset
-        ACTIONS
-
-        def build(options)
-          form_with(model: container, **default_options(id: container_form_id, **options)) do |form|
-            concat hidden_input
-            concat errors
-            concat(capture { yield form })
-          end
-        end
-
-        private
-
-        def errors
-          Editor::Errors.new(self, container).build
-        end
-
-        # Hidden input ensures that if the container is empty then the controller
-        # receives an empty array.
-        def hidden_input
-          tag.input(type: "hidden", name: "#{attributes_scope}[id]")
-        end
-
-        def default_options(options)
-          add_option(options, :data, :controller, CONTAINER_CONTROLLER)
-          add_option(options, :data, :action, ACTIONS)
-
-          options
-        end
-      end
-    end
-  end
-end

data/app/helpers/katalyst/content/editor/errors.rb

@@ -1,24 +0,0 @@
-# frozen_string_literal: true
-
-module Katalyst
-  module Content
-    module Editor
-      class Errors < Base
-        def build(**options)
-          turbo_frame_tag dom_id(container, :errors) do
-            next unless container.errors.any?
-
-            tag.div(class: "content-errors", **options) do
-              tag.h2("Errors in content") +
-                tag.ul(class: "errors") do
-                  container.errors.each do |error|
-                    concat(tag.li(error.message))
-                  end
-                end
-            end
-          end
-        end
-      end
-    end
-  end
-end