panda-editor 0.6.0 → 0.8.3

data/lib/panda/editor/asset_loader.rb

@@ -1,13 +1,13 @@
 # frozen_string_literal: true
 
-require 'net/http'
-require 'json'
+require "net/http"
+require "json"
 
 module Panda
   module Editor
     class AssetLoader
-      GITHUB_RELEASES_URL = 'https://api.github.com/repos/tastybamboo/panda-editor/releases/latest'
-      ASSET_CACHE_DIR = Rails.root.join('tmp', 'panda_editor_assets')
+      GITHUB_RELEASES_URL = "https://api.github.com/repos/tastybamboo/panda-editor/releases/latest"
+      ASSET_CACHE_DIR = Rails.root.join("tmp", "panda_editor_assets")
 
       class << self
         def load_assets
@@ -22,7 +22,7 @@ module Panda
           if use_compiled_assets?
             compiled_javascript_url
           else
-            '/assets/panda/editor/application.js'
+            "/assets/panda/editor/application.js"
           end
         end
 
@@ -30,7 +30,7 @@ module Panda
           if use_compiled_assets?
             compiled_stylesheet_url
           else
-            '/assets/panda/editor/application.css'
+            "/assets/panda/editor/application.css"
           end
         end
 
@@ -39,7 +39,7 @@ module Panda
         def use_compiled_assets?
           Rails.env.production? ||
             Rails.env.test? ||
-            ENV['PANDA_EDITOR_USE_COMPILED_ASSETS'] == 'true'
+            ENV["PANDA_EDITOR_USE_COMPILED_ASSETS"] == "true"
         end
 
         def load_compiled_assets
@@ -52,23 +52,23 @@ module Panda
 
         def load_development_assets
           {
-            javascript: '/assets/panda/editor/application.js',
-            stylesheet: '/assets/panda/editor/application.css'
+            javascript: "/assets/panda/editor/application.js",
+            stylesheet: "/assets/panda/editor/application.css"
           }
         end
 
         def compiled_javascript_url
-          asset_path = find_latest_asset('js')
+          asset_path = find_latest_asset("js")
           asset_path ? "/panda-editor-assets/#{File.basename(asset_path)}" : nil
         end
 
         def compiled_stylesheet_url
-          asset_path = find_latest_asset('css')
+          asset_path = find_latest_asset("css")
           asset_path ? "/panda-editor-assets/#{File.basename(asset_path)}" : nil
         end
 
         def find_latest_asset(extension)
-          pattern = Rails.root.join('public', 'panda-editor-assets', "panda-editor-*.#{extension}")
+          pattern = Rails.root.join("public", "panda-editor-assets", "panda-editor-*.#{extension}")
           Dir.glob(pattern).max_by { |f| File.mtime(f) }
         end
 
@@ -79,18 +79,18 @@ module Panda
         end
 
         def assets_exist?
-          js_exists = Dir.glob(Rails.root.join('public', 'panda-editor-assets', 'panda-editor-*.js')).any?
-          css_exists = Dir.glob(Rails.root.join('public', 'panda-editor-assets', 'panda-editor-*.css')).any?
+          js_exists = Dir.glob(Rails.root.join("public", "panda-editor-assets", "panda-editor-*.js")).any?
+          css_exists = Dir.glob(Rails.root.join("public", "panda-editor-assets", "panda-editor-*.css")).any?
           js_exists && css_exists
         end
 
         def download_assets_from_github
-          Rails.logger.info '[Panda Editor] Downloading assets from GitHub releases...'
+          Rails.logger.info "[Panda Editor] Downloading assets from GitHub releases..."
 
           begin
             release_data = fetch_latest_release
-            download_release_assets(release_data['assets'])
-          rescue StandardError => e
+            download_release_assets(release_data["assets"])
+          rescue => e
             Rails.logger.error "[Panda Editor] Failed to download assets: #{e.message}"
             use_fallback_assets
           end
@@ -100,30 +100,30 @@ module Panda
           uri = URI(GITHUB_RELEASES_URL)
           response = Net::HTTP.get_response(uri)
 
-          raise "GitHub API returned #{response.code}" unless response.code == '200'
+          raise "GitHub API returned #{response.code}" unless response.code == "200"
 
           JSON.parse(response.body)
         end
 
         def download_release_assets(assets)
           assets.each do |asset|
-            next unless asset['name'].match?(/panda-editor.*\.(js|css)$/)
+            next unless asset["name"].match?(/panda-editor.*\.(js|css)$/)
 
             download_asset(asset)
           end
         end
 
         def download_asset(asset)
-          uri = URI(asset['browser_download_url'])
+          uri = URI(asset["browser_download_url"])
           response = Net::HTTP.get_response(uri)
 
-          return unless response.code == '200'
+          return unless response.code == "200"
 
-          save_asset(asset['name'], response.body)
+          save_asset(asset["name"], response.body)
         end
 
         def save_asset(filename, content)
-          dir = Rails.root.join('public', 'panda-editor-assets')
+          dir = Rails.root.join("public", "panda-editor-assets")
           FileUtils.mkdir_p(dir)
 
           File.write(dir.join(filename), content)
@@ -131,17 +131,17 @@ module Panda
         end
 
         def use_fallback_assets
-          Rails.logger.warn '[Panda Editor] Using fallback embedded assets'
+          Rails.logger.warn "[Panda Editor] Using fallback embedded assets"
           # Copy embedded assets from gem to public directory
           copy_embedded_assets
         end
 
         def copy_embedded_assets
-          source_dir = Panda::Editor::Engine.root.join('public', 'panda-editor-assets')
-          dest_dir = Rails.root.join('public', 'panda-editor-assets')
+          source_dir = Panda::Editor::Engine.root.join("public", "panda-editor-assets")
+          dest_dir = Rails.root.join("public", "panda-editor-assets")
 
           FileUtils.mkdir_p(dest_dir)
-          FileUtils.cp_r(Dir.glob(source_dir.join('*')), dest_dir)
+          FileUtils.cp_r(Dir.glob(source_dir.join("*")), dest_dir)
         end
       end
     end

data/lib/panda/editor/blocks/alert.rb

@@ -5,13 +5,13 @@ module Panda
     module Blocks
       class Alert < Base
         def render
-          message = sanitize(data['message'])
-          type = data['type'] || 'primary'
+          message = sanitize(data["message"])
+          type = data["type"] || "primary"
 
           html_safe(
             "<div class=\"#{alert_classes(type)} p-4 mb-4 rounded-lg\">" \
               "#{message}" \
-            '</div>'
+            "</div>"
           )
         end
 
@@ -19,13 +19,13 @@ module Panda
 
         def alert_classes(type)
           case type
-          when 'primary' then 'bg-blue-100 text-blue-800'
-          when 'secondary' then 'bg-gray-100 text-gray-800'
-          when 'success' then 'bg-green-100 text-green-800'
-          when 'danger' then 'bg-red-100 text-red-800'
-          when 'warning' then 'bg-yellow-100 text-yellow-800'
-          when 'info' then 'bg-indigo-100 text-indigo-800'
-          else 'bg-blue-100 text-blue-800'
+          when "primary" then "bg-blue-100 text-blue-800"
+          when "secondary" then "bg-gray-100 text-gray-800"
+          when "success" then "bg-green-100 text-green-800"
+          when "danger" then "bg-red-100 text-red-800"
+          when "warning" then "bg-yellow-100 text-yellow-800"
+          when "info" then "bg-sky-100 text-sky-800"
+          else "bg-blue-100 text-blue-800"
           end
         end
       end

data/lib/panda/editor/blocks/base.rb

@@ -15,7 +15,7 @@ module Panda
         end
 
         def render
-          ''
+          ""
         end
 
         protected

data/lib/panda/editor/blocks/header.rb

@@ -5,8 +5,8 @@ module Panda
     module Blocks
       class Header < Base
         def render
-          content = sanitize(data['text'])
-          level = data['level'] || 2
+          content = sanitize(data["text"])
+          level = data["level"] || 2
           html_safe("<h#{level}>#{content}</h#{level}>")
         end
       end

data/lib/panda/editor/blocks/image.rb

@@ -5,19 +5,19 @@ module Panda
     module Blocks
       class Image < Base
         def render
-          url = data['url']
-          caption = sanitize(data['caption'])
-          with_border = data['withBorder']
-          with_background = data['withBackground']
-          stretched = data['stretched']
+          url = data["url"]
+          caption = sanitize(data["caption"])
+          with_border = data["withBorder"]
+          with_background = data["withBackground"]
+          stretched = data["stretched"]
 
-          css_classes = ['prose']
-          css_classes << 'border' if with_border
-          css_classes << 'bg-gray-100' if with_background
-          css_classes << 'w-full' if stretched
+          css_classes = ["prose"]
+          css_classes << "border" if with_border
+          css_classes << "bg-gray-100" if with_background
+          css_classes << "w-full" if stretched
 
           html_safe(<<~HTML)
-            <figure class="#{css_classes.join(' ')}">
+            <figure class="#{css_classes.join(" ")}">
               <img src="#{url}" alt="#{caption}" />
               #{caption_element(caption)}
             </figure>
@@ -27,7 +27,7 @@ module Panda
         private
 
         def caption_element(caption)
-          return '' if caption.blank?
+          return "" if caption.blank?
 
           "<figcaption>#{caption}</figcaption>"
         end

data/lib/panda/editor/blocks/list.rb

@@ -5,10 +5,11 @@ module Panda
     module Blocks
       class List < Base
         def render
-          list_type = data['style'] == 'ordered' ? 'ol' : 'ul'
+          style = data["style"] || data[:style]
+          list_type = (style == "ordered") ? "ol" : "ul"
           html_safe(
             "<#{list_type}>" \
-            "#{render_items(data['items'])}" \
+            "#{render_items(data["items"] || data[:items] || [])}" \
             "</#{list_type}>"
           )
         end
@@ -16,15 +17,33 @@ module Panda
         private
 
         def render_items(items)
+          return "" unless items.is_a?(Array)
+
           items.map do |item|
-            content = item.is_a?(Hash) ? item['content'] : item
-            nested = item.is_a?(Hash) && item['items'].present? ? render_nested(item['items']) : ''
-            "<li>#{sanitize(content)}#{nested}</li>"
+            content = extract_content(item)
+            nested_items = extract_nested_items(item)
+            nested = nested_items.present? ? render_nested(nested_items) : ""
+            "<li>#{sanitize(content.to_s)}#{nested}</li>"
           end.join
         end
 
+        def extract_content(item)
+          return item unless item.is_a?(Hash)
+
+          # Handle both string and symbol keys
+          item["content"] || item[:content] || ""
+        end
+
+        def extract_nested_items(item)
+          return [] unless item.is_a?(Hash)
+
+          # Handle both string and symbol keys
+          item["items"] || item[:items] || []
+        end
+
         def render_nested(items)
-          self.class.new({ 'items' => items, 'style' => data['style'] }).render
+          style = data["style"] || data[:style]
+          self.class.new({"items" => items, "style" => style}).render
         end
       end
     end

data/lib/panda/editor/blocks/paragraph.rb

@@ -1,14 +1,16 @@
 # frozen_string_literal: true
 
+require "cgi"
+
 module Panda
   module Editor
     module Blocks
       class Paragraph < Base
         def render
-          content = sanitize(data['text'])
-          return '' if content.blank?
+          content = sanitize(data["text"])
+          return "" if content.blank?
 
-          content = inject_footnotes(content) if data['footnotes'].present?
+          content = inject_footnotes(content) if data["footnotes"].present?
 
           html_safe("<p>#{content}</p>")
         end
@@ -16,13 +18,13 @@ module Panda
         private
 
         def inject_footnotes(text)
-          return text unless data['footnotes'].is_a?(Array)
+          return text unless data["footnotes"].is_a?(Array)
 
           # Sort footnotes by position in descending order to avoid position shifts
-          footnotes = data['footnotes'].sort_by { |fn| -fn['position'].to_i }
+          footnotes = data["footnotes"].sort_by { |fn| -fn["position"].to_i }
 
           footnotes.each do |footnote|
-            position = footnote['position'].to_i
+            position = footnote["position"].to_i
             # Skip if position is beyond text length
             next if position.negative? || position > text.length
 
@@ -30,8 +32,11 @@ module Panda
             footnote_number = register_footnote(footnote)
             next unless footnote_number
 
-            # Create footnote marker
-            marker = "<sup id=\"fnref:#{footnote_number}\"><a href=\"#fn:#{footnote_number}\" class=\"footnote\">#{footnote_number}</a></sup>"
+            # Get processed content for tooltip
+            tooltip_content = get_tooltip_content(footnote["id"])
+
+            # Create footnote marker with tooltip support
+            marker = create_footnote_marker(footnote_number, tooltip_content)
 
             # Insert marker at position
             text.insert(position, marker)
@@ -44,10 +49,36 @@ module Panda
           return nil unless options[:footnote_registry]
 
           options[:footnote_registry].add(
-            id: footnote['id'],
-            content: footnote['content']
+            id: footnote["id"],
+            content: footnote["content"]
           )
         end
+
+        def get_tooltip_content(footnote_id)
+          return nil unless options[:footnote_registry]
+
+          options[:footnote_registry].get_content(footnote_id)
+        end
+
+        def create_footnote_marker(number, tooltip_content)
+          # Strip HTML tags for title attribute (simple tooltip fallback)
+          plain_content = tooltip_content ? strip_html(tooltip_content) : nil
+
+          # Build marker with tooltip support
+          if tooltip_content
+            # Include both title attribute (native browser tooltip) and data attribute (for custom tooltips)
+            escaped_content = CGI.escapeHTML(tooltip_content)
+            escaped_title = CGI.escapeHTML(plain_content || "")
+            %(<sup id="fnref:#{number}" class="footnote-ref" data-footnote-content="#{escaped_content}" title="#{escaped_title}"><a href="#fn:#{number}" class="footnote">#{number}</a></sup>)
+          else
+            # Fallback without tooltip
+            %(<sup id="fnref:#{number}"><a href="#fn:#{number}" class="footnote">#{number}</a></sup>)
+          end
+        end
+
+        def strip_html(html)
+          html.gsub(/<\/?[^>]*>/, "")
+        end
       end
     end
   end

data/lib/panda/editor/blocks/quote.rb

@@ -5,15 +5,15 @@ module Panda
     module Blocks
       class Quote < Base
         def render
-          text = data['text']
-          caption = data['caption']
-          alignment = data['alignment'] || 'left'
+          text = data["text"]
+          caption = data["caption"]
+          alignment = data["alignment"] || "left"
 
           # Build the HTML structure
           html = "<figure class=\"text-#{alignment}\">" \
             "<blockquote>#{wrap_text_in_p(text)}</blockquote>" \
             "#{caption_element(caption)}" \
-            '</figure>'
+            "</figure>"
 
           # Return raw HTML - validation will be handled by the main renderer if enabled
           html_safe(html)
@@ -24,7 +24,7 @@ module Panda
         def wrap_text_in_p(text)
           # Only wrap in <p> if it's not already wrapped
           text = sanitize(text)
-          if text.start_with?('<p>') && text.end_with?('</p>')
+          if text.start_with?("<p>") && text.end_with?("</p>")
             text
           else
             "<p>#{text}</p>"
@@ -32,7 +32,7 @@ module Panda
         end
 
         def caption_element(caption)
-          return '' if caption.blank?
+          return "" if caption.blank?
 
           "<figcaption>#{sanitize(caption)}</figcaption>"
         end

data/lib/panda/editor/blocks/table.rb

@@ -5,8 +5,8 @@ module Panda
     module Blocks
       class Table < Base
         def render
-          content = data['content']
-          with_headings = data['withHeadings']
+          content = data["content"]
+          with_headings = data["withHeadings"]
 
           html_safe(<<~HTML)
             <div class="overflow-x-auto">
@@ -25,10 +25,10 @@ module Panda
 
           while index < content.length
             rows << if index.zero? && with_headings
-                      render_header_row(content[index])
-                    else
-                      render_data_row(content[index])
-                    end
+              render_header_row(content[index])
+            else
+              render_data_row(content[index])
+            end
             index += 1
           end
 

data/lib/panda/editor/content.rb

@@ -1,6 +1,6 @@
 # frozen_string_literal: true
 
-require 'json'
+require "json"
 
 module Panda
   module Editor
@@ -36,21 +36,24 @@ module Panda
       end
 
       def generate_cached_content
-        renderer_options = { autolink_urls: true }
+        renderer_options = {
+          autolink_urls: true,
+          custom_renderers: Panda::Editor.config.custom_renderers
+        }
 
         if content.is_a?(String)
           begin
             parsed_content = JSON.parse(content)
-            self.cached_content = if parsed_content.is_a?(Hash) && parsed_content['blocks'].present?
-                                    Panda::Editor::Renderer.new(parsed_content, renderer_options).render
-                                  else
-                                    content
-                                  end
+            self.cached_content = if parsed_content.is_a?(Hash) && parsed_content["blocks"].present?
+              Panda::Editor::Renderer.new(parsed_content, renderer_options).render
+            else
+              content
+            end
           rescue JSON::ParserError
             # If it's not JSON, treat it as plain text
             self.cached_content = content
           end
-        elsif content.is_a?(Hash) && content['blocks'].present?
+        elsif content.is_a?(Hash) && content["blocks"].present?
           # Process EditorJS content
           self.cached_content = Panda::Editor::Renderer.new(content, renderer_options).render
         else

data/lib/panda/editor/engine.rb

@@ -1,7 +1,11 @@
 # frozen_string_literal: true
 
-require 'rails'
-require 'sanitize'
+require "rails"
+require "sanitize"
+
+# Ensure panda-core is loaded first (provides ModuleRegistry)
+require "panda/core"
+require "panda/core/engine" if defined?(Rails)
 
 module Panda
   module Editor
@@ -14,21 +18,37 @@ module Panda
 
       # Eager load converter classes
       config.to_prepare do
-        require 'panda/editor/markdown_to_editor_js_converter'
-        require 'panda/editor/html_to_editor_js_converter'
+        require "panda/editor/markdown_to_editor_js_converter"
+        require "panda/editor/html_to_editor_js_converter"
       end
 
-      initializer 'panda_editor.assets' do |app|
+      initializer "panda_editor.assets" do |app|
         next unless app.config.respond_to?(:assets)
 
-        app.config.assets.paths << root.join('app/javascript')
-        app.config.assets.paths << root.join('public')
+        app.config.assets.paths << root.join("app/javascript")
+        app.config.assets.paths << root.join("public")
         app.config.assets.precompile += %w[panda/editor/*.js panda/editor/*.css]
       end
 
-      initializer 'panda_editor.importmap', before: 'importmap' do |app|
-        app.config.importmap.paths << root.join('config/importmap.rb') if app.config.respond_to?(:importmap)
+      # Create a separate importmap for panda-editor
+      # This keeps the engine's JavaScript separate from the app's importmap
+      # Admin uses panda_core_javascript helper which reads from ModuleRegistry
+      initializer "panda_editor.importmap", before: "importmap" do |app|
+        Panda::Editor.importmap = Importmap::Map.new.tap do |map|
+          map.draw(Panda::Editor::Engine.root.join("config/importmap.rb"))
+        end
       end
     end
   end
 end
+
+# Register with ModuleRegistry so admin can access the importmap
+Panda::Core::ModuleRegistry.register(
+  gem_name: "panda-editor",
+  engine: "Panda::Editor::Engine",
+  paths: {
+    views: "app/views/panda/editor/**/*.erb",
+    components: "app/components/panda/editor/**/*.{rb,erb,js}",
+    javascripts: "app/javascript/panda/editor/**/*.js"
+  }
+)

data/lib/panda/editor/footnote_registry.rb

@@ -1,6 +1,6 @@
 # frozen_string_literal: true
 
-require 'redcarpet'
+require "redcarpet"
 
 module Panda
   module Editor
@@ -19,7 +19,7 @@ module Panda
         return @footnote_ids[id] if @footnote_ids[id]
 
         # Add new footnote
-        @footnotes << { id: id, content: content }
+        @footnotes << {id: id, content: content}
         number = @footnotes.length
 
         # Cache the number for this ID
@@ -29,7 +29,7 @@ module Panda
       end
 
       def render_sources_section
-        return '' if @footnotes.empty?
+        return "" if @footnotes.empty?
 
         footnote_items = @footnotes.map.with_index do |footnote, index|
           number = index + 1
@@ -67,6 +67,11 @@ module Panda
         @footnotes.any?
       end
 
+      def get_content(id)
+        footnote = @footnotes.find { |fn| fn[:id] == id }
+        footnote ? process_content(footnote[:content]) : nil
+      end
+
       private
 
       def process_content(content)
@@ -88,7 +93,7 @@ module Panda
           no_images: true,
           no_styles: true,
           safe_links_only: true,
-          link_attributes: { target: '_blank', rel: 'noopener noreferrer' }
+          link_attributes: {target: "_blank", rel: "noopener noreferrer"}
         )
 
         markdown = Redcarpet::Markdown.new(
@@ -127,7 +132,7 @@ module Panda
             url
           else
             # Add protocol if missing
-            full_url = url.start_with?('www.') ? "https://#{url}" : url
+            full_url = url.start_with?("www.") ? "https://#{url}" : url
             %(<a href="#{full_url}" target="_blank" rel="noopener noreferrer">#{url}</a>)
           end
         end

data/lib/panda/editor/html_to_editor_js_converter.rb

@@ -95,7 +95,7 @@ module Panda
       end
 
       def list_block(node)
-        style = node.name == "ol" ? "ordered" : "unordered"
+        style = (node.name == "ol") ? "ordered" : "unordered"
         items = node.css("li").map { |li| li.inner_html.strip }
 
         {