ckeditor5 1.0.3 → 1.0.4
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/README.md +129 -46
- data/lib/ckeditor5/rails/editor/props_plugin.rb +5 -3
- data/lib/ckeditor5/rails/presets.rb +14 -8
- data/lib/ckeditor5/rails/version.rb +1 -1
- metadata +1 -1
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA256:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: 23e478e9988398f0612c2831798b5cd7a2abb9e6f21a8777e22964fe97974041
|
4
|
+
data.tar.gz: 817dfd3d0a94ef227c8e5845636468cf2aec54dbd19127f09feccd2c65d818cd
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: 00d576237488fcf65f5ceb1df860f1a2c6a31beccfc4361d57253ae014998072f083f282f66d4d0114e5eb8f50f3c838c56e172ded14bd559dbfe2b6d7c0abf4
|
7
|
+
data.tar.gz: a76c84be02f3c76acd8c4a39505264677ab34e3b4536887e1309da41417846346cee2f86718fef8e64f897acd4f5488f373def7c2299a49ca5ac8397ae296cf9
|
data/README.md
CHANGED
@@ -16,29 +16,19 @@ Add this line to your application's Gemfile:
|
|
16
16
|
gem 'ckeditor5'
|
17
17
|
```
|
18
18
|
|
19
|
-
##
|
19
|
+
## Presets
|
20
20
|
|
21
|
-
|
21
|
+
Presets are predefined configurations of CKEditor 5, allowing quick setup with specific features. The gem includes a `:default` preset with common features like bold, italic, underline, and link for the classic editor.
|
22
22
|
|
23
|
-
|
23
|
+
You can override the default preset or create your own by defining a new preset in the `config/initializers/ckeditor5.rb` file using the `config.presets.define` method.
|
24
24
|
|
25
|
-
|
26
|
-
# config/initializers/ckeditor5.rb
|
27
|
-
|
28
|
-
CKEditor5::Rails::Engine.configure do |config|
|
29
|
-
config.presets.override :default do |preset|
|
30
|
-
preset.menubar visible: false
|
31
|
-
end
|
32
|
-
end
|
33
|
-
```
|
34
|
-
|
35
|
-
Create new preset:
|
25
|
+
The example below shows how to define a custom preset with a classic editor and a custom toolbar:
|
36
26
|
|
37
27
|
```rb
|
38
28
|
# config/initializers/ckeditor5.rb
|
39
29
|
|
40
30
|
CKEditor5::Rails::Engine.configure do |config|
|
41
|
-
config.presets.define :custom
|
31
|
+
config.presets.define :custom
|
42
32
|
shape :classic
|
43
33
|
|
44
34
|
menubar
|
@@ -59,58 +49,151 @@ CKEditor5::Rails::Engine.configure do |config|
|
|
59
49
|
:TextTransformation, :TodoList, :Underline, :Undo, :Base64UploadAdapter
|
60
50
|
end
|
61
51
|
end
|
52
|
+
```
|
53
|
+
|
54
|
+
In order to override existing presets, you can use the `config.presets.override` method. The method takes the name of the preset you want to override and a block with the new configuration. In example below, we override the `:default` preset to hide the menubar.
|
55
|
+
|
56
|
+
```rb
|
57
|
+
# config/initializers/ckeditor5.rb
|
58
|
+
|
59
|
+
CKEditor5::Rails::Engine.configure do |config|
|
60
|
+
config.presets.override :default do
|
61
|
+
menubar visible: false
|
62
|
+
end
|
63
|
+
end
|
64
|
+
```
|
65
|
+
|
66
|
+
You can generate your preset using the CKEditor 5 [online builder](https://ckeditor.com/ckeditor-5/online-builder/). After generating the configuration, you can copy it to the `config/initializers/ckeditor5.rb` file.
|
67
|
+
|
68
|
+
### Available Configuration Methods
|
69
|
+
|
70
|
+
#### `shape(type)` method
|
71
|
+
|
72
|
+
Defines the type of editor. Available options:
|
73
|
+
|
74
|
+
- `:classic` - standard editor
|
75
|
+
- `:inline` - inline editor
|
76
|
+
- `:balloon` - balloon editor
|
77
|
+
- `:multiroot` - editor with multiple editing areas
|
78
|
+
|
79
|
+
The example below shows how to define a multiroot editor:
|
80
|
+
|
81
|
+
```rb
|
82
|
+
config.presets.define :custom do
|
83
|
+
shape :multiroot
|
84
|
+
end
|
85
|
+
```
|
86
|
+
|
87
|
+
#### `plugins(*names)` method
|
88
|
+
|
89
|
+
Defines the plugins to be included in the editor. You can specify multiple plugins by passing their names as arguments.
|
90
|
+
|
91
|
+
```rb
|
92
|
+
config.presets.define :custom do
|
93
|
+
plugins :Bold, :Italic, :Underline, :Link
|
94
|
+
end
|
95
|
+
```
|
96
|
+
|
97
|
+
#### `toolbar(*items, should_group_when_full: true)` method
|
98
|
+
|
99
|
+
Defines the toolbar items. You can use predefined items like `:undo`, `:redo`, `:|` or specify custom items. There are a few special items:
|
62
100
|
|
63
|
-
|
101
|
+
- `:_` - breakpoint
|
102
|
+
- `:|` - separator
|
64
103
|
|
65
|
-
|
104
|
+
The `should_group_when_full` keyword argument determines whether the toolbar should group items when there is not enough space. It's set to `true` by default.
|
105
|
+
|
106
|
+
```rb
|
107
|
+
config.presets.define :custom do
|
108
|
+
# ... other configuration
|
109
|
+
|
110
|
+
toolbar :undo, :redo, :|, :heading, :|, :bold, :italic, :underline, :|,
|
111
|
+
:link, :insertImage, :ckbox, :mediaEmbed, :insertTable, :blockQuote, :|,
|
112
|
+
:bulletedList, :numberedList, :todoList, :outdent, :indent
|
113
|
+
end
|
66
114
|
```
|
67
115
|
|
68
|
-
|
116
|
+
Keep in mind that the order of items is important, and you should install the corresponding plugins. You can find the list of available plugins in the [CKEditor 5 documentation](https://ckeditor.com/docs/ckeditor5/latest/framework/architecture/plugins.html).
|
69
117
|
|
70
|
-
|
118
|
+
Defines the toolbar items. You can use predefined items like `:undo`, `:redo`, `:|` or specify custom items. There are few special items:
|
71
119
|
|
72
|
-
|
73
|
-
-
|
74
|
-
|
120
|
+
- `:_` - breakpoint
|
121
|
+
- `:|` - separator
|
122
|
+
|
123
|
+
```rb
|
124
|
+
config.presets.define :custom do
|
125
|
+
# ... other configuration
|
126
|
+
|
127
|
+
toolbar :undo, :redo, :|, :heading, :|, :bold, :italic, :underline, :|,
|
128
|
+
:link, :insertImage, :ckbox, :mediaEmbed, :insertTable, :blockQuote, :|,
|
129
|
+
:bulletedList, :numberedList, :todoList, :outdent, :indent
|
130
|
+
end
|
75
131
|
```
|
76
132
|
|
77
|
-
|
133
|
+
Keep in mind that the order of items is important, and you should install the corresponding plugins. You can find the list of available plugins in the [CKEditor 5 documentation](https://ckeditor.com/docs/ckeditor5/latest/framework/architecture/plugins.html).
|
134
|
+
|
135
|
+
#### `menubar(visible: true)` method
|
136
|
+
|
137
|
+
Defines the visibility of the menubar. By default, it's set to `true`.
|
78
138
|
|
79
|
-
```
|
80
|
-
|
81
|
-
|
139
|
+
```rb
|
140
|
+
config.presets.define :custom do
|
141
|
+
# ... other configuration
|
142
|
+
|
143
|
+
toolbar :undo, :redo, :|, :heading, :|, :bold, :italic, :underline, :|,
|
144
|
+
:link, :insertImage, :ckbox, :mediaEmbed, :insertTable, :blockQuote, :|,
|
145
|
+
:bulletedList, :numberedList, :todoList, :outdent, :indent
|
146
|
+
end
|
82
147
|
```
|
83
148
|
|
84
|
-
####
|
149
|
+
#### `language(ui, content:)` method
|
85
150
|
|
86
|
-
|
151
|
+
Defines the language of the editor. You can pass the language code as an argument. Keep in mind that the UI and content language can be different. The example below shows how to set the Polish language for the UI and content:
|
87
152
|
|
88
|
-
```
|
89
|
-
|
90
|
-
|
153
|
+
```rb
|
154
|
+
config.presets.define :custom do
|
155
|
+
language :pl
|
156
|
+
end
|
157
|
+
```
|
158
|
+
|
159
|
+
In order to set the language for the content, you can pass the `content` keyword argument:
|
160
|
+
|
161
|
+
```rb
|
162
|
+
config.presets.define :custom do
|
163
|
+
language :en, content: :pl
|
164
|
+
end
|
165
|
+
```
|
166
|
+
|
167
|
+
#### `configure(name, value)` method
|
168
|
+
|
169
|
+
Allows you to set custom configuration options. You can pass the name of the option and its value as arguments. The example below show how to set the default protocol for the link plugin to `https://`:
|
170
|
+
|
171
|
+
```rb
|
172
|
+
config.presets.define :custom do
|
173
|
+
configure :link, {
|
174
|
+
defaultProtocol: 'https://'
|
175
|
+
}
|
176
|
+
end
|
91
177
|
```
|
92
178
|
|
93
|
-
|
179
|
+
#### `plugin(name, premium:, import_name:)` method
|
94
180
|
|
95
|
-
|
181
|
+
Defines a plugin to be included in the editor. You can pass the name of the plugin as an argument. The `premium` keyword argument determines whether the plugin is premium. The `import_name` keyword argument specifies the name of the package to import the plugin from.
|
96
182
|
|
97
|
-
|
98
|
-
- content_for :head
|
99
|
-
= ckeditor5_assets version: '43.2.0' # Optional: translations: [ :pl, :es ]
|
183
|
+
The example below show how to import Bold plugin from the `ckeditor5` npm package:
|
100
184
|
|
101
|
-
|
185
|
+
```rb
|
186
|
+
config.presets.define :custom do
|
187
|
+
plugin :Bold
|
188
|
+
end
|
102
189
|
```
|
103
190
|
|
104
|
-
|
191
|
+
In order to import a plugin from a custom package, you can pass the `import_name` keyword argument:
|
105
192
|
|
106
|
-
```
|
107
|
-
|
108
|
-
|
109
|
-
|
110
|
-
= ckeditor5_editable 'editable-a' do
|
111
|
-
| This is a toolbar editable
|
112
|
-
br
|
113
|
-
= ckeditor5_editable 'editable-b'
|
193
|
+
```rb
|
194
|
+
config.presets.define :custom do
|
195
|
+
plugin :YourPlugin, import_name: 'your-package'
|
196
|
+
end
|
114
197
|
```
|
115
198
|
|
116
199
|
## License
|
@@ -4,9 +4,11 @@ module CKEditor5::Rails::Editor
|
|
4
4
|
class PropsPlugin
|
5
5
|
delegate :to_h, to: :import_meta
|
6
6
|
|
7
|
-
def initialize(name, premium: false)
|
7
|
+
def initialize(name, premium: false, import_name: nil)
|
8
8
|
@name = name
|
9
9
|
@premium = premium
|
10
|
+
@import_name = import_name
|
11
|
+
@import_name ||= premium ? 'ckeditor5-premium-features' : 'ckeditor5'
|
10
12
|
end
|
11
13
|
|
12
14
|
def self.normalize(plugin)
|
@@ -19,12 +21,12 @@ module CKEditor5::Rails::Editor
|
|
19
21
|
|
20
22
|
private
|
21
23
|
|
22
|
-
attr_reader :name, :premium
|
24
|
+
attr_reader :name, :premium, :import_name
|
23
25
|
|
24
26
|
def import_meta
|
25
27
|
::CKEditor5::Rails::Assets::JSImportMeta.new(
|
26
28
|
import_as: name,
|
27
|
-
import_name:
|
29
|
+
import_name: import_name
|
28
30
|
)
|
29
31
|
end
|
30
32
|
end
|
@@ -80,20 +80,26 @@ module CKEditor5::Rails
|
|
80
80
|
}
|
81
81
|
end
|
82
82
|
|
83
|
-
def toolbar(*items)
|
84
|
-
@config[:toolbar] =
|
83
|
+
def toolbar(*items, should_group_when_full: true)
|
84
|
+
@config[:toolbar] = {
|
85
|
+
items: items,
|
86
|
+
shouldNotGroupWhenFull: !should_group_when_full
|
87
|
+
}
|
85
88
|
end
|
86
89
|
|
87
|
-
def plugin(name,
|
88
|
-
@config[:plugins] << Editor::PropsPlugin.new(name,
|
90
|
+
def plugin(name, **kwargs)
|
91
|
+
@config[:plugins] << Editor::PropsPlugin.new(name, **kwargs)
|
89
92
|
end
|
90
93
|
|
91
|
-
def plugins(*names,
|
92
|
-
names.each { |name| plugin(name,
|
94
|
+
def plugins(*names, **kwargs)
|
95
|
+
names.each { |name| plugin(name, **kwargs) }
|
93
96
|
end
|
94
97
|
|
95
|
-
def language(
|
96
|
-
@config[:language] =
|
98
|
+
def language(ui, content: ui) # rubocop:disable Naming/MethodParameterName
|
99
|
+
@config[:language] = {
|
100
|
+
ui: ui,
|
101
|
+
content: content
|
102
|
+
}
|
97
103
|
end
|
98
104
|
end
|
99
105
|
end
|