trusty-cms 7.0.44 → 7.0.46

data/app/assets/stylesheets/admin/assets.scss

@@ -1,3 +1,19 @@
+.ck-content .asset-image-tag {
+  background-color: #dcdcdc;
+  display: inline-flex;
+  align-items: center;
+  padding: 1em;
+  border: 1px dashed #c3c3c3;
+  opacity: 0.85;
+  user-select: none;
+}
+
+.ck-content  .asset-image-tag__label {
+  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
+  font-size: 0.85em;
+  white-space: nowrap;
+}
+
 .search {
   display: grid;
   grid-template-columns: 1fr 1fr;

data/app/javascript/plugins/asset_tags/asset_tag_builder.js

@@ -1,11 +1,16 @@
-import { Plugin } from 'ckeditor5';
+import { Plugin, Widget, toWidget } from 'ckeditor5/src/index.js';
 
 export default class AssetTagBuilder extends Plugin {
+      static get requires() {
+        return [ Widget ];
+      }
+
     init() {
         console.log( 'AssetTagBuilder plugin initialized' );
         // Plugin logic goes here
         this._defineSchema();
         this._defineConverters();
+        this._defineDataNormalization();
     }
 
     _defineSchema() {
@@ -48,6 +53,7 @@ export default class AssetTagBuilder extends Plugin {
             }
         } );
 
+    
         // Data downcast: ensure no inner whitespace like   gets serialized.
         dataDowncast.elementToElement( {
             model: 'assetImage',
@@ -65,7 +71,7 @@ export default class AssetTagBuilder extends Plugin {
                 if ( height ) attrs.height = height;
                 if ( width ) attrs.width = width;
 
-                return writer.createEmptyElement( 'r:asset:image', attrs );
+                return writer.createContainerElement( 'r:asset:image', attrs );
             }
         } );
 
@@ -86,8 +92,78 @@ export default class AssetTagBuilder extends Plugin {
                 if ( height ) attrs.height = height;
                 if ( width ) attrs.width = width;
 
-                return writer.createContainerElement( 'r:asset:image', attrs );
-            }
-        } );
+                const container = writer.createContainerElement('span', {
+                    class: 'asset-image-tag',
+                    'data-asset-id': id,
+                    'data-asset-size': size
+                });
+
+                const label = writer.createUIElement(
+                    'span',
+                    { class: 'asset-image-tag__label' },
+                    function (domDocument) {
+                        const domEl = this.toDomElement(domDocument);
+                        const parts = [
+                        'Asset image',
+                        id ? `#${id}` : '',
+                        size ? `(${size})` : '',
+                        alt ? `— ${alt}` : '',
+                        height ? `height: ${height}` : '',
+                        width ? `width: ${width}` : ''
+                        ].filter(Boolean);
+
+                        domEl.textContent = parts.join(' ');
+                        return domEl;
+                    }
+                );
+
+                writer.insert(writer.createPositionAt(container, 0), label);
+                return toWidget(container, writer, { label: `Asset image ${id ? `#${id}` : ''}` });
+            }            
+        } );       
+
+    }
+
+      _defineDataNormalization() {
+        const editor = this.editor;
+        const processor = editor.data.processor;
+
+        const originalToView = processor.toView.bind( processor );
+        const originalToData = processor.toData.bind( processor );
+
+        // 1) Incoming: <r:asset:image ... /> -> <r:asset:image ...></r:asset:image>
+       processor.toView = (data) => {
+            let normalized = data;
+
+            // 1) Self-closing -> paired
+            normalized = normalized.replace(
+                /<r:asset:image\b([^>]*?)\/>/gi,
+                '<r:asset:image$1></r:asset:image>'
+            );
+
+            // 2) Bare open tag (rare, but happens) -> paired
+            normalized = normalized.replace(
+                /<r:asset:image\b([^>]*?)>(?!\s*<\/r:asset:image>)/gi,
+                '<r:asset:image$1></r:asset:image>'
+            );
+
+            return originalToView(normalized);
+            };
+
+
+        processor.toData = (viewFragment) => {
+            const html = originalToData(viewFragment);
+
+            return html.replace(
+                /<r:asset:image\b([^>]*?)>([\s\S]*?)<\/r:asset:image>/gi,
+                (match, attrs, inner) => {
+                const cleanedInner = inner.replace(
+                    /^(?:\s|&nbsp;|&#160;)+|(?:\s|&nbsp;|&#160;)+$/g,
+                    ''
+                );
+                return `<r:asset:image${attrs} />${cleanedInner}`;
+                }
+            );
+        };
     }
 }

data/app/javascript/trusty_cms/ckeditor5.js

@@ -46,7 +46,7 @@ const defaultStyleDefinitions = [
             }
         ]
 
-import AssetTagBuilder from '../plugins/asset_tags/asset_tags';        
+import AssetTagBuilder from '../plugins/asset_tags/asset_tag_builder';        
 
 import {
     ClassicEditor,
@@ -112,9 +112,7 @@ import {
     TextTransformation,
     TodoList,
     Underline
-} from 'ckeditor5';
-
-import "ckeditor5/ckeditor5.css";
+} from 'ckeditor5/src/index.js';
 
 
 const editorConfig = {
@@ -145,7 +143,6 @@ const editorConfig = {
             'code',
             'removeFormat',
             '|',
-            'specialCharacters',
             'horizontalLine',
             'link',
             'bookmark',
@@ -370,6 +367,8 @@ editorElements.forEach((editorElement) => {
             if (!hiddenInput) {
                 return;
             }
+
+            editor.setData(hiddenInput.value || '');
             editor.ui.focusTracker.on( 'change:isFocused', ( evt, name, isFocused ) => {
                 if ( !isFocused ) {
                     editor.plugins.get( 'SourceEditing' ).updateEditorData()

data/app/views/admin/page_parts/_page_part.html.haml

@@ -14,5 +14,4 @@
       .editor-container.editor-container_classic-editor.editor-container_include-style.editor-container_include-fullscreen#editor-container
         .editor-container__editor
           %div{ id: "editor_#{ page_part.name.to_slug }", data: { part: page_part.name.to_slug } }
-            = page_part.content.to_s.html_safe # rubocop:disable Rails/OutputSafety
           = hidden_field_tag :page_part, page_part.content || '', name: "page[parts_attributes][#{ page_part_counter }][content]", id: "part_#{ page_part.name.to_slug }_content"

data/app/views/layouts/application.html.haml

@@ -37,11 +37,10 @@
 
     - stylesheet_overrides.each do |stylesheet|
       = stylesheet_link_tag stylesheet
-
     - javascript_overrides.each do |javascript|
       = javascript_include_tag javascript
 
-    = stylesheet_link_tag href="trusty_cms/ckeditor5"
+    = stylesheet_link_tag 'ckeditor5/dist/ckeditor5.css'
     = csrf_meta_tags
     
     :javascript

data/lib/trusty_cms/version.rb

@@ -1,3 +1,3 @@
 module TrustyCms
-  VERSION = '7.0.44'.freeze
+  VERSION = '7.0.46'.freeze
 end

data/package.json

@@ -33,7 +33,7 @@
   },
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1",
-    "build": "esbuild app/javascript/trusty_cms/ckeditor5.js --bundle --sourcemap --outdir=app/assets/builds/trusty_cms --public-path=/assets",
+    "build": "esbuild app/javascript/trusty_cms/ckeditor5.js --bundle --sourcemap --outdir=app/assets/builds/trusty_cms --public-path=/assets --loader:.svg=text",
     "build:watch": "npm run build -- --watch"
   },
   "keywords": [],

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: trusty-cms
 version: !ruby/object:Gem::Version
-  version: 7.0.44
+  version: 7.0.46
 platform: ruby
 authors:
 - TrustyCms CMS dev team
 autorequire:
 bindir: bin
 cert_chain: []
-date: 2025-12-08 00:00:00.000000000 Z
+date: 2026-01-27 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: activestorage-validator
@@ -819,7 +819,6 @@ files:
 - app/helpers/site_helper.rb
 - app/helpers/sites_helper.rb
 - app/javascript/plugins/asset_tags/asset_tag_builder.js
-- app/javascript/plugins/asset_tags/asset_tags.js
 - app/javascript/trusty_cms/ckeditor5.js
 - app/mailers/application_mailer.rb
 - app/mailers/devise_mailer.rb

data/app/javascript/plugins/asset_tags/asset_tags.js

@@ -1,8 +0,0 @@
-import AssetTagBuilder from './asset_tag_builder';
-import { Plugin } from 'ckeditor5';
-
-export default class AssetTags extends Plugin {
-  static get requires() {
-    return [ AssetTagBuilder ];
-  }
-}