Project

General

Profile

Actions
Copy link

Feature #103242

open

Import IndentBlock from ckeditor5-indent

Added by Sven Wappler about 2 months ago. Updated about 1 month ago.

Status:
New
Priority:
Should have
Assignee:
-
Category:
RTE (rtehtmlarea + ckeditor)
Target version:
-
Start date:
2024-03-01
Due date:
% Done:

0%

Estimated time:
PHP Version:
Tags:
ckeditor5 indent
Complexity:
easy
Sprint Focus:

Description

To be able to use custom classes for blocks like

indentBlock:
  classes:
    - 'ps-2'
    - 'ps-3'
    - 'ps-4'

I think in file Build/Sources/TypeScript/rte_ckeditor/ckeditor5.ts instead of

  { module: '@ckeditor/ckeditor5-indent', exports: ['Indent'] },

it should be
  { module: '@ckeditor/ckeditor5-indent', exports: ['Indent','IndentBlock'] },
Actions
Copy link
 #1

Updated by Timo Webler about 2 months ago

I can confirm, that these change will active the plugin.

I tried to activate the plugin via configuration, but that doesn't work.

  importModules:
    - { 'module': '@ckeditor/ckeditor5-indent', 'exports': ["IndentBlock"] }

Maybe the import of user modules before the default modules can fix the problem. https://github.com/TYPO3/typo3/blob/3cf86c37dac28c4a440fc2b15b12c1ea132e0934/Build/Sources/TypeScript/rte_ckeditor/ckeditor5.ts#L190C11-L190C30

Actions
Copy link
 #2

Updated by wini2 no-lastname-given about 1 month ago ยท Edited

Maybe I'm wrong but the indentblock is not shipped with TYPO3 - at least I can't find the typescript-pendant https://github.com/ckeditor/ckeditor5/blob/eab01dfbcf/packages/ckeditor5-indent/src/indentblock.ts#L28 in https://github.com/TYPO3/typo3/tree/main/typo3/sysext/rte_ckeditor/Resources/Public/Contrib/%40ckeditor.

Addendum: 

editor:
  config:
    importModules:
      ...
      - { 'module': '@ckeditor/ckeditor5-indent', 'exports': [ 'IndentBlock' ] }

indeed does the trick; sets 40px for each indentation level to the tag (style="40px"). The value seem to come from ckeditor5-indent.js.

For the usage of classes 

indentBlock:
  classes:
    - 'ps-2'
    - 'ps-3'
    - 'ps-4'

works for me.

If the style-attr. is used, DB-Storage/FE-Output it needs to be added in processing.yaml

allowAttributes: [class, id, title, dir, lang, xml:lang, itemscope, itemtype, itemprop, style ]
Actions
Copy link

Also available in: Atom PDF