ckeditor5 1.6.0 → 1.7.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 4936a08e0bc4d84574d2f692c6efe59e683cac2be8d87cc2ef51cdd2ad7846e8
-  data.tar.gz: d1a65da5eb7795fcd85bb258a067afb6990c6f6f7ea6fe5359e11cc767883139
+  metadata.gz: 4325c958e2805d971859c841f0b2694490e35a7e4600e2b8bb60f35672493146
+  data.tar.gz: 23aa528bcbfbec102647898aee0fb4c064e7d16bd051fc4bf45ae94b9ed16fb6
 SHA512:
-  metadata.gz: 9590a33cd9a2caf0c191255d7efa154a7bbbde8857ee8b40bf19cf9ae03411220230cbc5cf1f608aabf1ba3dcb8a49cb9ceb768553a8655efd139c0e9e98c110
-  data.tar.gz: 2d2c6853bf4a09e01da3fb83f44ed711b8ee96de4bd9e2bf0e47c1519b04169507e56e403f012731dd6c402c3e7b8196b3e42cc833d6689c3bc6dbe2e6c5abfc
+  metadata.gz: 7e12e3e13824889463c2500e5d26874c1dd7c1dac6c5dbf1d41b37e5bd66e25b642b92fdbcb943b4f99219302e9184bacc5c8b16902559511c69db2392e2d569
+  data.tar.gz: '090b221f5bebaedac65be2db6a230409537b891bce481258106a575a58555b59fa2a0f55b125ea114115554ecba1b2d0f80845e3b1bea14f6f743af627972810'

data/README.md

@@ -73,6 +73,7 @@ Voilà! You have CKEditor 5 integrated with your Rails application. 🎉
       - [`gpl` method](#gpl-method)
       - [`license_key(key)` method](#license_keykey-method)
       - [`premium` method](#premium-method)
+      - [`editable_height(height)` method](#editable_heightheight-method)
       - [`translations(*languages)` method](#translationslanguages-method)
       - [`ckbox` method](#ckbox-method)
       - [`type(type)` method](#typetype-method)
@@ -271,6 +272,20 @@ CKEditor5::Rails.configure do
 end
 ```
 
+#### `editable_height(height)` method
+
+Defines the height of the editor. The example below shows how to set the height to `300px`:
+
+```rb
+# config/initializers/ckeditor5.rb
+
+CKEditor5::Rails.configure do
+  # ... other configuration
+
+  editable_height 300
+end
+```
+
 #### `translations(*languages)` method
 
 Defines the translations of CKEditor 5. You can pass the language codes as arguments. The example below shows how tell integration to fetch Polish and Spanish translations:
@@ -808,6 +823,18 @@ If you want to override the configuration of the editor specified in default or
 <%= ckeditor5_editor extra_config: { toolbar: [:Bold, :Italic] }, style: 'width: 600px' %>
 ```
 
+It's possible to define the height of the editor by passing the `editable_height` keyword argument with the value in pixels:
+
+```erb
+<!-- app/views/demos/index.html.erb -->
+
+<% content_for :head do %>
+  <%= ckeditor5_assets %>
+<% end %>
+
+<%= ckeditor5_editor editable_height: 300 %>
+```
+
 ### Multiroot editor 🌳
 
 The multiroot editor allows you to create an editor with multiple editable areas. It's useful when you want to create a CMS with multiple editable areas on a single page.

data/lib/ckeditor5/rails/assets/webcomponent.mjs

@@ -228,6 +228,7 @@ class CKEditorComponent extends HTMLElement {
       this.instance = instance;
 
       this.#setupContentSync();
+      this.#setupEditableHeight();
 
       this.instancePromise.resolve(this.instance);
     } catch (err) {
@@ -236,10 +237,18 @@ class CKEditorComponent extends HTMLElement {
     }
   }
 
+  /**
+   * Checks if current editor is classic type
+   *
+   * @returns {boolean}
+   */
+  isClassic() {
+    return this.getAttribute('type') === 'ClassicEditor';
+  }
+
   /**
    * Checks if current editor is multiroot type
    *
-   * @private
    * @returns {boolean}
    */
   isMultiroot() {
@@ -249,7 +258,6 @@ class CKEditorComponent extends HTMLElement {
   /**
    * Checks if current editor is decoupled type
    *
-   * @private
    * @returns {boolean}
    */
   isDecoupled() {
@@ -259,7 +267,6 @@ class CKEditorComponent extends HTMLElement {
   /**
    * Checks if current editor has watchdog enabled
    *
-   * @private
    * @returns {boolean}
    */
   hasWatchdog() {
@@ -378,6 +385,28 @@ class CKEditorComponent extends HTMLElement {
     });
   }
 
+  /**
+   * Sets up editable height for ClassicEditor
+   *
+   * @private
+   */
+  #setupEditableHeight() {
+    if (!this.isClassic()) {
+      return;
+    }
+
+    const { instance } = this;
+    const height = Number.parseInt(this.getAttribute('editable-height'), 10);
+
+    if (Number.isNaN(height)) {
+      return;
+    }
+
+    instance.editing.view.change((writer) => {
+      writer.setStyle('height', `${height}px`, instance.editing.view.document.getRoot());
+    });
+  }
+
   /**
    * Loads translation modules
    *

data/lib/ckeditor5/rails/editor/helpers.rb

@@ -8,26 +8,34 @@ module CKEditor5::Rails
   module Editor::Helpers
     class EditorContextError < StandardError; end
     class PresetNotFoundError < ArgumentError; end
+    class InvalidEditableHeightError < ArgumentError; end
 
-    def ckeditor5_editor(
+    def ckeditor5_editor( # rubocop:disable Metrics/ParameterLists
       config: nil, extra_config: {},
       type: nil, preset: nil,
       initial_data: nil, watchdog: true,
+      editable_height: nil,
       **html_attributes, &block
     )
       validate_editor_input!(initial_data, block)
+
       controller_context = validate_and_get_editor_context!
 
       preset = resolve_editor_preset(preset || controller_context[:preset])
       config = build_editor_config(preset, config, extra_config, initial_data)
       type ||= preset.type
 
+      validated_height = validate_editable_height(type, editable_height) || preset.editable_height
       editor_props = Editor::Props.new(
         controller_context, type, config,
         watchdog: watchdog
       )
 
-      render_editor_component(editor_props, html_attributes, &block)
+      render_editor_component(
+        editor_props,
+        html_attributes.merge(validated_height ? { 'editable-height' => validated_height } : {}),
+        &block
+      )
     end
 
     def ckeditor5_editable(name = nil, **kwargs, &block)
@@ -83,5 +91,23 @@ module CKEditor5::Rails
     def render_editor_component(props, html_attributes, &block)
       tag.send(:'ckeditor-component', **props.to_attributes, **html_attributes, &block)
     end
+
+    def validate_editable_height(type, height)
+      return nil if height.nil?
+
+      unless type == :classic
+        raise InvalidEditableHeightError,
+              'editable_height can be used only with ClassicEditor'
+      end
+
+      case height
+      when String, /^\d+px$/ then height
+      when Integer, /^\d+$/ then "#{height}px"
+      else
+        raise InvalidEditableHeightError,
+              "editable_height must be an integer representing pixels or string ending with 'px'\n" \
+              "(e.g. 500 or '500px'). Got: #{height.inspect}"
+      end
+    end
   end
 end

data/lib/ckeditor5/rails/presets/preset_builder.rb

@@ -13,6 +13,7 @@ module CKEditor5::Rails
         @license_key = nil
         @type = :classic
         @ckbox = nil
+        @editable_height = nil
         @config = {
           plugins: [],
           toolbar: []
@@ -32,6 +33,12 @@ module CKEditor5::Rails
         }
       end
 
+      def editable_height(height = nil)
+        return @editable_height if height.nil?
+
+        @editable_height = height
+      end
+
       def ckbox(version = nil, theme: :lark)
         return @ckbox if version.nil?
 

data/lib/ckeditor5/rails/version.rb

@@ -2,6 +2,6 @@
 
 module CKEditor5
   module Rails
-    VERSION = '1.6.0'
+    VERSION = '1.7.0'
   end
 end

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: ckeditor5
 version: !ruby/object:Gem::Version
-  version: 1.6.0
+  version: 1.7.0
 platform: ruby
 authors:
 - Mateusz Bagiński
@@ -9,7 +9,7 @@ authors:
 autorequire:
 bindir: bin
 cert_chain: []
-date: 2024-11-11 00:00:00.000000000 Z
+date: 2024-11-12 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: rails