smeditor 0.2.2 → 0.2.3

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: deea7d855b9ea5c7d61a51d82adeb656e3583db0dc9ed8d677345fe2d1bac550
-  data.tar.gz: 99a68a8823548919c2acb1aaea114822b677e33d464cd37a66f42fe4cc802e73
+  metadata.gz: e09edfe28f68de93439fdd0552894387afc89e6eadf4875fb164d1a45aaa7658
+  data.tar.gz: a76689f1341ffd28d5b9e2fa24bf3c6543c40a0b9f8cc83ccc3348c871c41de5
 SHA512:
-  metadata.gz: 6cf34629807ab5b326dff8ddaa85e80bc2f4b5c7de86a233e4d2a9c1196a3151df18af818f658f6826e0f21c7d90317c8f190df1697f5ecc8501c4f24511c9b7
-  data.tar.gz: 3f72f9d9fc819294563dd2519eb07e84dd159432fd2bc8ad6111b0ed125c46790163ef7caae49ae1b76ea7ced5406baf65b1dc9a2350e6115edc15b34c3d57bc
+  metadata.gz: 06f5e3c97c24a257a36d115e3ceebc42f0ab70060c9e5013d81807ac0d77af20a218ea6597972724e1df5492e26733eb382cedf0fbb638ecab90839f86d3d1ab
+  data.tar.gz: 36f25a97de694d48cff314de6bffef35bd6016d2960489601881ad35ef893ce580a3b4a3a4ba86c395e13bca62140b236170d985a6f3bc0f0ebcd19043aca43a

data/CHANGELOG.md

@@ -1,5 +1,11 @@
 # Changelog — smeditor
 
+## 0.2.3
+
+- Added configurable responsive minimum editor heights for desktop, tablet, and mobile.
+- Added per-field `min_height`, `tablet_min_height`, and `mobile_min_height` Rails helper options.
+- Added matching global defaults in `SMEditor.configure`.
+
 ## 0.2.2 — 2026-09-09
 
 - Fixed caret jumps and reordered typing inside the Rails Shadow DOM editor. The core now resolves the live DOM Selection from the editor's own root instead of always using `document.getSelection()`.

data/README.md

@@ -42,6 +42,9 @@ SMEditor.configure do |config|
   config.uploads = :none                 # or :active_storage
   config.upload_path = "/smeditor/uploads"
   config.default_kit = "starter"        # or "full"
+  config.min_height = 320               # desktop, px when numeric
+  config.tablet_min_height = 280        # <= 1024px
+  config.mobile_min_height = 220        # <= 640px
   config.sanitize_output = true
 
   # true by default: the first editor field includes smeditor.js/css.
@@ -61,7 +64,10 @@ end
 <%= form_with model: @article do |form| %>
   <%= form.smeditor_editor :content,
         kit: "full",
-        placeholder: "Write…" %>
+        placeholder: "Write…",
+        min_height: 420,
+        tablet_min_height: 340,
+        mobile_min_height: 260 %>
 
   <%= form.submit %>
 <% end %>
@@ -79,8 +85,14 @@ Available options:
 - `class:`
 - `label:` — editor ARIA label
 - `upload_url:` — custom image upload endpoint
+- `min_height:` — minimum height on desktop (> 1024px)
+- `tablet_min_height:` — minimum height on tablet widths (641-1024px)
+- `mobile_min_height:` — minimum height on phone widths (<= 640px)
 - `include_assets: false` — skip automatic asset tags for this field
 
+Height options accept numbers (treated as pixels) or CSS lengths such as `24rem`,
+`45vh`, or `60dvh`. Per-field values override the initializer defaults.
+
 ### Assets in the layout (optional)
 
 By default the first `smeditor_editor` call includes the packaged assets once.

data/app/assets/javascripts/smeditor.js

@@ -476,6 +476,15 @@ function bootMount(mount) {
     const root = shadowRootFor(mount);
     const shell = document.createElement("div");
     shell.className = "smeditor";
+    const responsiveHeights = [
+        ["--sme-editor-min-height", mount.dataset.smeditorMinHeight],
+        ["--sme-editor-min-height-tablet", mount.dataset.smeditorTabletMinHeight],
+        ["--sme-editor-min-height-mobile", mount.dataset.smeditorMobileMinHeight],
+    ];
+    for (const [property, value] of responsiveHeights) {
+        if (value)
+            shell.style.setProperty(property, value);
+    }
     const surface = document.createElement("div");
     surface.className = "smeditor-editor";
     surface.setAttribute("aria-label", mount.dataset.smeditorLabel || "Rich text editor");

data/app/assets/stylesheets/smeditor.css

@@ -79,6 +79,11 @@
 
   /* Indent step (block-level indentation) */
   --sme-indent-step: 24px;
+
+  /* Responsive editor surface height. Rails can override these per field. */
+  --sme-editor-min-height: 320px;
+  --sme-editor-min-height-tablet: 280px;
+  --sme-editor-min-height-mobile: 220px;
 }
 
 /* ---------------------------------------------------------------------------
@@ -366,7 +371,7 @@
   padding: var(--sme-space-4);
   font-size: var(--sme-text-base);
   line-height: var(--sme-leading);
-  min-height: 8em;
+  min-height: var(--sme-editor-min-height, 320px);
   outline: none;
 }
 
@@ -1186,7 +1191,19 @@
   font-size: 11px;
 }
 
+@media (max-width: 1024px) {
+  .smeditor-content,
+  .smeditor-editor {
+    min-height: var(--sme-editor-min-height-tablet, 280px);
+  }
+}
+
 @media (max-width: 640px) {
+  .smeditor-content,
+  .smeditor-editor {
+    min-height: var(--sme-editor-min-height-mobile, 220px);
+  }
+
   .smeditor-toolbar {
     gap: 4px;
     padding: var(--sme-space-2);

data/lib/generators/smeditor/templates/initializer.rb

@@ -14,6 +14,12 @@ SMEditor.configure do |config|
   # "starter" gives the MVP toolbar; "full" enables the larger extension set.
   config.default_kit = "starter"
 
+  # Responsive minimum editor height. Numeric values are pixels. You can also
+  # use CSS lengths such as "24rem" or "45vh".
+  config.min_height = 320
+  config.tablet_min_height = 280
+  config.mobile_min_height = 220
+
   # Stored editor HTML is sanitized before public rendering.
   config.sanitize_output = true
 

data/lib/smeditor/rails/config.rb

@@ -23,6 +23,13 @@ module SMEditor
     # Include the packaged JS/CSS automatically with the first editor field.
     # Set false when the host app calls `smeditor_assets` in its layout.
     attr_accessor :auto_include_assets
+    # Default minimum editor heights. They are responsive by viewport width:
+    # desktop (> 1024px), tablet (641-1024px), and mobile (<= 640px).
+    # Numeric values are interpreted as pixels; CSS lengths such as "24rem"
+    # and "45vh" are accepted too.
+    attr_accessor :min_height
+    attr_accessor :tablet_min_height
+    attr_accessor :mobile_min_height
     # Hard ceiling on an uploaded file, in bytes. The endpoint is reachable
     # by anyone who can reach the host app unless the controller is
     # subclassed with authentication, so it refuses anything larger.
@@ -42,6 +49,9 @@ module SMEditor
       @default_kit = "starter"
       @upload_path = "/smeditor/uploads"
       @auto_include_assets = true
+      @min_height = "320px"
+      @tablet_min_height = "280px"
+      @mobile_min_height = "220px"
       @max_upload_size = 10 * 1024 * 1024
       @allowed_upload_types = %w[
         image/png image/jpeg image/gif image/webp image/avif image/bmp

data/lib/smeditor/rails/form_helper.rb

@@ -23,7 +23,8 @@ module SMEditor
       # form    - a Rails FormBuilder
       # method  - the model attribute (stored as an HTML string)
       # options - :kit ("starter" | "full"), :class, :placeholder,
-      #           :upload_url, :label, :include_assets
+      #           :upload_url, :label, :include_assets, :min_height,
+      #           :tablet_min_height, :mobile_min_height
       def smeditor_editor(form, method, options = {})
         object = form.object
         current = object.respond_to?(method) ? object.public_send(method) : nil
@@ -31,6 +32,9 @@ module SMEditor
         upload_url = options.fetch(:upload_url, smeditor_upload_url)
         include_assets = options.fetch(:include_assets, SMEditor.config.auto_include_assets)
         stylesheet_url = asset_path("smeditor.css")
+        min_height = smeditor_css_length(options.fetch(:min_height, SMEditor.config.min_height), :min_height)
+        tablet_min_height = smeditor_css_length(options.fetch(:tablet_min_height, SMEditor.config.tablet_min_height), :tablet_min_height)
+        mobile_min_height = smeditor_css_length(options.fetch(:mobile_min_height, SMEditor.config.mobile_min_height), :mobile_min_height)
 
         hidden = form.hidden_field(
           method,
@@ -49,6 +53,9 @@ module SMEditor
             smeditor_upload_url: upload_url,
             smeditor_label: options[:label],
             smeditor_stylesheet: stylesheet_url,
+            smeditor_min_height: min_height,
+            smeditor_tablet_min_height: tablet_min_height,
+            smeditor_mobile_min_height: mobile_min_height,
           }.compact,
         )
 
@@ -60,6 +67,15 @@ module SMEditor
 
       private
 
+      CSS_LENGTH = %r{\A(?:0|(?:\d+(?:\.\d+)?)(?:px|rem|em|vh|dvh|svh|vw|%))\z}.freeze
+
+      def smeditor_css_length(value, option_name)
+        normalized = value.is_a?(Numeric) ? "#{value}px" : value.to_s.strip
+        return normalized if normalized.match?(CSS_LENGTH)
+
+        raise ArgumentError, "#{option_name} must be a number (pixels) or a CSS length such as 320px, 24rem, or 45vh"
+      end
+
       def smeditor_upload_url
         SMEditor.config.upload_path if SMEditor.config.uploads == :active_storage
       end

data/lib/smeditor/rails/version.rb

@@ -2,6 +2,6 @@
 
 module SMEditor
   module Rails
-    VERSION = "0.2.2"
+    VERSION = "0.2.3"
   end
 end

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: smeditor
 version: !ruby/object:Gem::Version
-  version: 0.2.2
+  version: 0.2.3
 platform: ruby
 authors:
 - SMEditor contributors
@@ -96,7 +96,7 @@ metadata:
   source_code_uri: https://github.com/sCruze/smeditor/tree/main/gems/smeditor
   changelog_uri: https://github.com/sCruze/smeditor/blob/main/gems/smeditor/CHANGELOG.md
   bug_tracker_uri: https://github.com/sCruze/smeditor/issues
-  documentation_uri: https://rubydoc.info/gems/smeditor/0.2.2
+  documentation_uri: https://rubydoc.info/gems/smeditor/0.2.3
   rubygems_mfa_required: 'true'
 rdoc_options: []
 require_paths: