marksmith 0.1.1 → 0.1.3

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 62a833a3db7da2729cbe8743021710f452973784d3ce79d6612dc37201df3532
-  data.tar.gz: 192191de6e129b9ee26ef2fe7866efdf9d3e2cecd3d6448b8f3255847d1054e4
+  metadata.gz: 138a40e01855d847e9b295185fcf85edc6801e80c9bd94b1d8a55de7efb0b0f7
+  data.tar.gz: d29d99ff35c10fbc9e7deaadc84d7b27fdadb494732364cfda3003c69d397b81
 SHA512:
-  metadata.gz: 872a14aa320e5411628800c95c1ee9a2cb10a1e323af2d893c815fc075b3760f7d302c1410c47c09610828d444a6fde62129b2c8ab9d79127781cca77ea5a602
-  data.tar.gz: cc6358f58b2136dd31e1742bd92d210142eb44e93eaa65376541ed04d6beba08c7b963156de0092777613ec6c2892d90315d3e424b84f01ca45732d4182ce798
+  metadata.gz: 5be1932c6cc7b5054cab6875a38c615977682b4e50f048c1f04ec29df9c46cec911c846e4eb7f2f9413702841b1a801145ea0a91431efd9c7b11c511725c4b09
+  data.tar.gz: 1dd261670a842ca375bc584cf1028b078e4c93d147ee8f0893952704993a741efea93341ea89a6b6b1106e742b1724056684b45a0c0fdd4cf42a9b8ddd1b2eaf

data/README.md

@@ -1,13 +1,20 @@
 # Marksmith
 
+[![CI](https://github.com/avo-hq/marksmith/actions/workflows/ci.yml/badge.svg)](https://github.com/avo-hq/marksmith/actions/workflows/ci.yml)
+
 Marksmith is a GitHub-style markdown editor for Rails apps.
 
-It supports Active Storage attachments and comes with a built-in mardown preview renderer.
+It supports Active Storage attachments and comes with a built-in markdown preview renderer.
 
 ![Marksmith logo](./marksmith.png)
 
 ![Marksmith demo](./marksmith.gif)
 
+> [!WARNING]
+> Marksmith is at the initial stage of development. It's nearing a beta release, but the API might change and bugs are expected. Please continue to use the library and report any issues in the GitHub repo.
+
+Temporary live demo here, under the description field: [https://main.avodemo.com/avo/resources/projects/new](https://main.avodemo.com/avo/resources/projects/new)
+
 ## Usage
 
 ```erb
@@ -16,7 +23,7 @@ It supports Active Storage attachments and comes with a built-in mardown preview
 
 ## Installation
 
-### 1. Add `marksmith` to your `Gemfile`
+#### 1. Add `marksmith` to your `Gemfile`
 
 Have Bundler add it by running this command:
 
@@ -33,20 +40,27 @@ Add this line to your application's Gemfile:
 gem "marksmith"
 ```
 
-### 2. Install the NPM package to import the StimulusJS controller.
+#### 2. Install the NPM package to import the StimulusJS controller.
 
-Install the package.
+Install the package from npmjs.org.
 
 ```bash
 $ yarn add @avo-hq/marksmith
 ```
 
-Import and register it in your application.
+Or pin it using importmap.
+
+```bash
+bin/importmap pin @avo-hq/marksmith
+```
+
+Import and register the controllers in your application. The `ListContinuationController` is optional and only needed if you want to have continued lists in your markdown.
 
 ```js
-import { MarksmithController } from '@avo-hq/marksmith'
+import { MarksmithController, ListContinuationController } from '@avo-hq/marksmith'
 
 application.register('marksmith', MarksmithController)
+application.register('list-continuation', ListContinuationController)
 ```
 
 > [!NOTE]
@@ -66,28 +80,78 @@ import { MarksmithController } from '@avo-hq/marksmith/core'
 application.register('marksmith', MarksmithController)
 ```
 
-### 3. Add the style tag to your `application.html` layout
+#### 3. Add the style tag to your `application.html` layout
 
 ```erb
 <%= stylesheet_link_tag "marksmith" %>
 ```
 
-### 4. Use it
+#### 4. Use it
 
 Use a form helper tag or attach it to your form builder.
 
 ```erb
 <%= marksmith_tag :body, value: "### This is important" %>
 or
-<%= @form.marksmith :body %>
+<%= form.marksmith :body %>
 ```
 
-## Options
+## Configuration
+
+Marksmith accepts a few configuration options.
+
+### Field options
 
 The field supports a few of the regular options like `disabled`, `placeholder`, `autofocus`, `style`, `class`, `rows`, `data`, and `value`, but also a custom one.
 
 `extra_preview_params` - Sends extra params to the preview renderer.
 
+`enable_file_uploads` - Whether to enable file uploads.
+
+`upload_url` - The URL to use for file uploads. If not provided, the editor will use the `rails_direct_uploads_url` helper.
+
+```erb
+<%= marksmith_tag :body,
+  disabled: true,
+  placeholder: "Write your best markdown here.",
+  extra_preview_params: { foo: "bar" },
+  enable_file_uploads: true,
+  upload_url: nil
+  %>
+```
+
+### Eject configuration file
+
+Marksmith comes with a default configuration file that you can eject to your app.
+
+```bash
+bin/rails generate marksmith:install
+```
+
+This will create a `config/initializers/marksmith.rb` file in your app.
+
+### Mount path
+
+The engine is mounted by default at `/marksmith`. You can change it by setting `Marksmith.configuration.mount_path` to a different path.
+
+```ruby
+# config/initializers/marksmith.rb
+Marksmith.configure do |config|
+  config.mount_path = "/markdown"
+end
+```
+
+### Mounting the engine
+
+The engine is mounted by default, but you can disable it by setting `Marksmith.configuration.automatically_mount_engine` to `false` and then manually mount the engine in your `routes.rb` file.
+
+```ruby
+# config/routes.rb
+Rails.application.routes.draw do
+  mount Marksmith::Engine => Marksmith.configuration.mount_path
+end
+```
+
 ## Built-in preview renderer
 
 The renderer is powered by [`Redcarpet`](https://github.com/vmg/redcarpet).
@@ -96,15 +160,46 @@ It supports basic styles for headings, `strong`, `italic` and others.
 In your `show.html.erb` view or the place where you want to render the compiled markup use the `marksmithed` helper and it will run the content through the renderer.
 
 ```erb
-<%= marksmithed post.body %>
+<%== marksmithed post.body %>
 ```
 
-## Using with importmap
+> [!WARNING]
+> Using the `<%==` tag will output the raw HTML, so ensure you sanitize the content to avoid XSS attacks.
+>
+> See how we do it [here](https://github.com/avo-hq/avo/blob/main/app/views/marksmith/shared/_rendered_body.html.erb#L2).
+> ```ruby
+> # sample sanitization
+> sanitize(body, tags: %w(table th tr td span) + ActionView::Helpers::SanitizeHelper.sanitizer_vendor.safe_list_sanitizer.allowed_tags.to_a)
+> ```
 
-It should be as simple as running this command and have it pinned in your `importmap.rb` file.
+### Customize the renderer
 
-```bash
-bin/importmap pin @avo-hq/marksmith
+You can customize the renderer by overriding the `Marksmith::Renderer` model.
+
+```ruby
+# app/models/marksmith/renderer.rb
+require "redcarpet"
+
+module Marksmith
+  class Renderer
+    def renderer
+      ::Redcarpet::Markdown.new(
+        ::Redcarpet::Render::HTML,
+        tables: true,
+        lax_spacing: true,
+        fenced_code_blocks: true,
+        space_after_headers: true,
+        hard_wrap: true,
+        autolink: true,
+        strikethrough: true,
+        underline: true,
+        highlight: true,
+        quote: true,
+        with_toc_data: true
+      )
+    end
+  end
+end
 ```
 
 ## Active Storage
@@ -128,6 +223,12 @@ application.register('marksmith', MarksmithController)
 application.register('list-continuation', ListContinuationController)
 ```
 
+## Who uses Marksmith?
+
+- [Avo](https://avohq.io) - Ruby on Rails Code-Based App Builder Framework
+
+*Open a PR and add your project here*
+
 ## Contributing
 
 Contribution directions go here.

data/app/assets/javascripts/list_continuation_controller-full.esm.js

@@ -1,5 +1,5 @@
 /*!
-Marksmith 0.1.1
+Marksmith 0.1.3
 */
 var ListContinuationController = (function () {
     'use strict';

data/app/assets/javascripts/list_continuation_controller-no-stimulus.esm.js

@@ -1,5 +1,5 @@
 /*!
-Marksmith 0.1.1
+Marksmith 0.1.3
 */
 var ListContinuationController = (function (stimulus) {
   'use strict';

data/app/assets/javascripts/marksmith_controller-full.esm.js

@@ -1,5 +1,5 @@
 /*!
-Marksmith 0.1.1
+Marksmith 0.1.3
 */
 var MarksmithController = (function () {
     'use strict';
@@ -2827,10 +2827,15 @@ var MarksmithController = (function () {
         fieldId: String,
         galleryEnabled: { type: Boolean, default: false },
         galleryOpenPath: String,
+        fileUploadsEnabled: { type: Boolean, default: true },
       }
 
       static targets = ['fieldContainer', 'fieldElement', 'previewElement', 'writeTabButton', 'previewTabButton', 'toolbar']
 
+      get #fileUploadsDisabled() {
+        return !this.fileUploadsEnabledValue
+      }
+
       connect() {
         subscribe(this.fieldContainerTarget, { defaultPlainTextPaste: { urlLinks: true } });
       }
@@ -2878,11 +2883,15 @@ var MarksmithController = (function () {
       }
 
       dropUpload(event) {
+        if (this.#fileUploadsDisabled) return
+
         event.preventDefault();
         this.#uploadFiles(event.dataTransfer.files);
       }
 
       pasteUpload(event) {
+        if (this.#fileUploadsDisabled) return
+
         if (!event.clipboardData.files.length) return
 
         event.preventDefault();

data/app/assets/javascripts/marksmith_controller-no-stimulus.esm.js

@@ -1,5 +1,5 @@
 /*!
-Marksmith 0.1.1
+Marksmith 0.1.3
 */
 var MarksmithController = (function (stimulus) {
     'use strict';
@@ -2337,10 +2337,15 @@ var MarksmithController = (function (stimulus) {
         fieldId: String,
         galleryEnabled: { type: Boolean, default: false },
         galleryOpenPath: String,
+        fileUploadsEnabled: { type: Boolean, default: true },
       }
 
       static targets = ['fieldContainer', 'fieldElement', 'previewElement', 'writeTabButton', 'previewTabButton', 'toolbar']
 
+      get #fileUploadsDisabled() {
+        return !this.fileUploadsEnabledValue
+      }
+
       connect() {
         subscribe(this.fieldContainerTarget, { defaultPlainTextPaste: { urlLinks: true } });
       }
@@ -2388,11 +2393,15 @@ var MarksmithController = (function (stimulus) {
       }
 
       dropUpload(event) {
+        if (this.#fileUploadsDisabled) return
+
         event.preventDefault();
         this.#uploadFiles(event.dataTransfer.files);
       }
 
       pasteUpload(event) {
+        if (this.#fileUploadsDisabled) return
+
         if (!event.clipboardData.files.length) return
 
         event.preventDefault();

data/app/assets/stylesheets/marksmith.css

@@ -829,8 +829,8 @@
 .ms\:cursor-pointer {
   cursor: pointer;
 }
-.ms\:resize-y {
-  resize: vertical;
+.ms\:resize-none {
+  resize: none;
 }
 .ms\:flex-col {
   flex-direction: column;

data/app/components/marksmith/markdown_field/edit_component.rb

@@ -1,7 +1,8 @@
 # frozen_string_literal: true
-
-class Marksmith::MarkdownField::EditComponent < Avo::Fields::EditComponent
-  def unique_id
-    [@field.type, @resource&.singular_route_key, @field.id].compact.join("_")
+if defined?(Avo)
+  class Marksmith::MarkdownField::EditComponent < Avo::Fields::EditComponent
+    def unique_id
+      [@field.type, @resource&.singular_route_key, @field.id].compact.join("_")
+    end
   end
 end

data/app/components/marksmith/markdown_field/show_component.rb

@@ -1,4 +1,5 @@
 # frozen_string_literal: true
-
-class Marksmith::MarkdownField::ShowComponent < Avo::Fields::ShowComponent
+if defined?(Avo)
+  class Marksmith::MarkdownField::ShowComponent < Avo::Fields::ShowComponent
+  end
 end

data/app/frontend/entrypoints/javascript/controllers/marksmith_controller.js

@@ -17,10 +17,15 @@ export default class extends Controller {
     fieldId: String,
     galleryEnabled: { type: Boolean, default: false },
     galleryOpenPath: String,
+    fileUploadsEnabled: { type: Boolean, default: true },
   }
 
   static targets = ['fieldContainer', 'fieldElement', 'previewElement', 'writeTabButton', 'previewTabButton', 'toolbar']
 
+  get #fileUploadsDisabled() {
+    return !this.fileUploadsEnabledValue
+  }
+
   connect() {
     subscribe(this.fieldContainerTarget, { defaultPlainTextPaste: { urlLinks: true } })
   }
@@ -68,11 +73,15 @@ export default class extends Controller {
   }
 
   dropUpload(event) {
+    if (this.#fileUploadsDisabled) return
+
     event.preventDefault()
     this.#uploadFiles(event.dataTransfer.files)
   }
 
   pasteUpload(event) {
+    if (this.#fileUploadsDisabled) return
+
     if (!event.clipboardData.files.length) return
 
     event.preventDefault()

data/app/views/marksmith/shared/_editor.html.erb

@@ -13,6 +13,20 @@
     local_assigns[:value] || nil
   end
   extra_preview_params = local_assigns[:extra_preview_params] || {}
+  upload_url = if local_assigns[:upload_url].present?
+    local_assigns[:upload_url]
+  elsif defined?(ActiveStorage)
+    main_app.rails_direct_uploads_url
+  end
+
+  enable_file_uploads = if upload_url.blank?
+      false
+    elsif local_assigns[:enable_file_uploads].nil?
+      true
+    else
+      local_assigns[:enable_file_uploads]
+    end
+
 
   # Used by Avo and other adapters to enable the gallery link.
   gallery_enabled = local_assigns.dig(:gallery, :enabled) || false
@@ -35,8 +49,9 @@
     ",
     unique_selector: ".#{@input_id}", # used to pinpoint the exact element in which to insert the attachment
     marksmith_preview_url_value: marksmith.markdown_previews_path,
+    marksmith_file_uploads_enabled_value: enable_file_uploads,
     marksmith_active_tab_class: "bg-white",
-    marksmith_attach_url_value: main_app.rails_direct_uploads_url,
+    marksmith_attach_url_value: upload_url,
     marksmith_extra_preview_params_value: extra_preview_params.as_json,
     **local_assigns.fetch(:controller_data_attributes, {})
   } do %>
@@ -69,7 +84,7 @@
     <%= content_tag :div, class: "ms:flex ms:flex-1 ms:flex-col ms:size-full", data: { marksmith_target: "fieldContainer" } do %>
       <%= text_area_tag field_name, value,
         id: name,
-        class: class_names("ms:flex ms:flex-1 ms:rounded ms:border-none ms:resize-y ms:focus:outline-none ms:font-mono ms:focus:ring-0 ms:leading-normal ms:p-2 ms:text-sm", classes),
+        class: class_names("ms:flex ms:flex-1 ms:rounded ms:border-none ms:resize-none ms:focus:outline-none ms:font-mono ms:focus:ring-0 ms:leading-normal ms:p-2 ms:text-sm", classes),
         rows: rows,
         data: {
           action: "drop->marksmith#dropUpload paste->marksmith#pasteUpload",
@@ -85,8 +100,10 @@
         <%= link_to "https://docs.github.com/github/writing-on-github/getting-started-with-writing-and-formatting-on-github/basic-writing-and-formatting-syntax", target: "_blank", class: class_names("ms:flex ms:items-center ms:text-neutral-800 ms:no-underline", toolbar_button_classes) do %>
           <%= image_tag asset_path("marksmith/svgs/markdown.svg"), class: "ms:inline ms:size-4 ms:mr-1" %> <%= t("marksmith.markdown_is_supported").humanize %>
         <% end %>
-        <%= button_tag data: { action: "click->marksmith#buttonUpload" }, class: class_names("ms:bg-none ms:border-none ms:bg-transparent ms:text-neutral-600 ms:items-center ms:flex", toolbar_button_classes) do %>
-          <%= image_tag asset_path("marksmith/svgs/paperclip.svg"), class: "ms:inline ms:size-4 ms:mr-1" %> <%= t("marksmith.upload_files").humanize %>
+        <% if enable_file_uploads %>
+          <%= button_tag data: { action: "click->marksmith#buttonUpload" }, class: class_names("ms:bg-none ms:border-none ms:bg-transparent ms:text-neutral-600 ms:items-center ms:flex", toolbar_button_classes) do %>
+            <%= image_tag asset_path("marksmith/svgs/paperclip.svg"), class: "ms:inline ms:size-4 ms:mr-1" %> <%= t("marksmith.upload_files").humanize %>
+          <% end %>
         <% end %>
         <% if gallery_enabled %>
           <%= link_to gallery_full_path, data: { turbo_frame: gallery_turbo_frame }, class: class_names("ms:flex ms:items-center ms:text-neutral-800 ms:no-underline", toolbar_button_classes) do %>

data/lib/generators/marksmith/install_generator.rb

@@ -0,0 +1,15 @@
+require "rails/generators"
+
+module Marksmith
+  module Generators
+    class InstallGenerator < Rails::Generators::Base
+      source_root File.expand_path("templates", __dir__)
+
+      desc "Creates a Marksmith initializer."
+
+      def create_initializer_file
+        template "initializer/marksmith.tt", "config/initializers/marksmith.rb"
+      end
+    end
+  end
+end

data/lib/generators/marksmith/templates/initializer/marksmith.tt

@@ -0,0 +1,4 @@
+# Marksmith.configure do |config|
+#   config.automatically_mount_engine = true
+#   config.mount_path = "/marksmith"
+# end

data/lib/marksmith/configuration.rb

@@ -0,0 +1,16 @@
+module Marksmith
+  class Configuration
+    include ActiveSupport::Configurable
+
+    config_accessor(:automatically_mount_engine) { true }
+    config_accessor(:mount_path) { "/marksmith" }
+  end
+
+  def self.configuration
+    @configuration ||= Configuration.new
+  end
+
+  def self.configure
+    yield configuration
+  end
+end

data/lib/marksmith/engine.rb

@@ -17,6 +17,14 @@ module Marksmith
       end
     end
 
+    initializer "marksmith.routes" do |app|
+      if Marksmith.configuration.automatically_mount_engine
+        app.routes.append do
+          mount Marksmith::Engine => Marksmith.configuration.mount_path
+        end
+      end
+    end
+
     initializer "marksmith.assets.precompile" do |app|
       if Rails.application.config.respond_to?(:assets)
         # The manifest will expose the asset files to the main app.
@@ -24,14 +32,14 @@ module Marksmith
       end
     end
 
+    generators do |app|
+      Rails::Generators.configure! app.config.generators
+    end
+
     initializer "avo-markdown_field.init" do |app|
       if defined?(Avo)
         require "marksmith/fields/markdown_field"
 
-        app.routes.append do
-          mount Marksmith::Engine => "/marksmith"
-        end
-
         ActiveSupport.on_load(:avo_boot) do
           Avo.plugin_manager.register :marksmith_field
 
@@ -45,6 +53,11 @@ module Marksmith
           Avo.asset_manager.register_stimulus_controller "marksmith", "MarksmithController"
           Avo.asset_manager.register_stimulus_controller "list-continuation", "ListContinuationController"
         end
+      else
+        # Ignore the markdown_field components if Avo is not defined
+        app.autoloaders.main.ignore(
+          root.join("app", "components", "marksmith", "markdown_field"),
+        )
       end
     end
   end

data/lib/marksmith/version.rb

@@ -1,3 +1,3 @@
 module Marksmith
-  VERSION = "0.1.1"
+  VERSION = "0.1.3"
 end

data/lib/marksmith.rb

@@ -1,4 +1,5 @@
 require "marksmith/version"
+require "marksmith/configuration"
 require "marksmith/engine"
 
 module Marksmith

metadata

@@ -1,29 +1,29 @@
 --- !ruby/object:Gem::Specification
 name: marksmith
 version: !ruby/object:Gem::Version
-  version: 0.1.1
+  version: 0.1.3
 platform: ruby
 authors:
 - Adrian Marin
 autorequire:
 bindir: bin
 cert_chain: []
-date: 2025-02-03 00:00:00.000000000 Z
+date: 2025-02-14 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
-  name: rails
+  name: activesupport
   requirement: !ruby/object:Gem::Requirement
     requirements:
     - - ">="
       - !ruby/object:Gem::Version
-        version: 7.0.0
+        version: '0'
   type: :runtime
   prerelease: false
   version_requirements: !ruby/object:Gem::Requirement
     requirements:
     - - ">="
       - !ruby/object:Gem::Version
-        version: 7.0.0
+        version: '0'
 - !ruby/object:Gem::Dependency
   name: redcarpet
   requirement: !ruby/object:Gem::Requirement
@@ -84,9 +84,6 @@ files:
 - app/frontend/entrypoints/javascript/controllers/index.js
 - app/frontend/entrypoints/javascript/controllers/list_continuation_controller.js
 - app/frontend/entrypoints/javascript/controllers/marksmith_controller.js
-- app/helpers/marksmith/application_helper.rb
-- app/jobs/marksmith/application_job.rb
-- app/mailers/marksmith/application_mailer.rb
 - app/models/marksmith/application_record.rb
 - app/models/marksmith/renderer.rb
 - app/views/layouts/marksmith/application.html.erb
@@ -96,7 +93,10 @@ files:
 - config/locales/marksmith.en.yml
 - config/routes.rb
 - config/vite.json
+- lib/generators/marksmith/install_generator.rb
+- lib/generators/marksmith/templates/initializer/marksmith.tt
 - lib/marksmith.rb
+- lib/marksmith/configuration.rb
 - lib/marksmith/engine.rb
 - lib/marksmith/fields/markdown_field.rb
 - lib/marksmith/helper.rb

data/app/helpers/marksmith/application_helper.rb

@@ -1,4 +0,0 @@
-module Marksmith
-  module ApplicationHelper
-  end
-end

data/app/jobs/marksmith/application_job.rb

@@ -1,4 +0,0 @@
-module Marksmith
-  class ApplicationJob < ActiveJob::Base
-  end
-end

data/app/mailers/marksmith/application_mailer.rb

@@ -1,6 +0,0 @@
-module Marksmith
-  class ApplicationMailer < ActionMailer::Base
-    default from: "from@example.com"
-    layout "mailer"
-  end
-end