@kvass/rich-text 1.4.13 → 1.4.15

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -5,7 +5,7 @@ on:
5
5
  - master
6
6
  jobs:
7
7
  deploy:
8
- runs-on: ubuntu-20.04
8
+ runs-on: ubuntu-latest
9
9
  steps:
10
10
  - uses: actions/checkout@v3
11
11
  - uses: actions/setup-node@v3
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@kvass/rich-text",
3
- "version": "1.4.13",
3
+ "version": "1.4.15",
4
4
  "description": "rich text component for kvass",
5
5
  "main": "index.js",
6
6
  "scripts": {
package/src/Component.vue CHANGED
@@ -32,7 +32,9 @@
32
32
  v-for="(item, index) in getCommands('bubble')"
33
33
  :key="'bubble' + index"
34
34
  class="richtext__bubble-button"
35
- :class="{ 'is-active': editor.isActive(item.stateKey) }"
35
+ :class="{
36
+ 'is-active': editor.isActive(item.isActiveKey || item.stateKey, item.commandProps),
37
+ }"
36
38
  :disabled="disabled || item.disabled"
37
39
  @click="
38
40
  item.customFunc
@@ -55,7 +57,9 @@
55
57
  v-for="(item, index) in getCommands('menu')"
56
58
  :key="'menubar' + index"
57
59
  type="button"
58
- :class="{ 'is-active': editor.isActive(item.stateKey) }"
60
+ :class="{
61
+ 'is-active': editor.isActive(item.isActiveKey || item.stateKey, item.commandProps),
62
+ }"
59
63
  :disabled="disabled || item.disabled"
60
64
  @click="
61
65
  item.customFunc
@@ -80,6 +84,7 @@ import StarterKit from '@tiptap/starter-kit'
80
84
 
81
85
  const DefaultCommands = [
82
86
  'heading',
87
+ 'heading-h3',
83
88
  'bold',
84
89
  'italic',
85
90
  'superscript',
@@ -133,21 +138,35 @@ export default {
133
138
  },
134
139
  computed: {
135
140
  availableCommands() {
141
+ const language = this._i18n.locale
142
+
136
143
  return [
137
144
  {
138
145
  stateKey: 'heading',
139
146
  commandKey: 'toggleHeading',
140
147
  commandProps: { level: 2 },
141
- icon: ['far', 'heading'],
148
+ icon: ['far', 'h2'],
149
+ appearance: {
150
+ menu: true,
151
+ bubble: false,
152
+ },
153
+ },
154
+ {
155
+ stateKey: 'heading-h3',
156
+ isActiveKey: 'heading',
157
+ commandKey: 'toggleHeading',
158
+ commandProps: { level: 3 },
159
+ icon: ['far', 'h3'],
142
160
  appearance: {
143
161
  menu: true,
144
162
  bubble: false,
145
163
  },
146
164
  },
165
+
147
166
  {
148
167
  stateKey: 'bold',
149
168
  commandKey: 'toggleBold',
150
- icon: ['far', 'bold'],
169
+ icon: ['far', language === 'fr' ? 'g' : 'bold'],
151
170
  appearance: {
152
171
  menu: true,
153
172
  bubble: true,
@@ -329,6 +348,14 @@ export default {
329
348
  border-radius: var(--border-radius, 3px);
330
349
  }
331
350
 
351
+ h2 {
352
+ font-size: 1.5em !important;
353
+ }
354
+ h3 {
355
+ font-size: 1.17em !important;
356
+ margin: 0;
357
+ }
358
+
332
359
  &__editor {
333
360
  flex-grow: 1;
334
361