@vaadin/rich-text-editor 25.0.0-beta4 → 25.0.0-beta5
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.
- package/package.json +13 -13
- package/src/styles/vaadin-rich-text-editor-base-styles.js +15 -9
- package/src/styles/vaadin-rich-text-editor-popup-overlay-base-styles.js +18 -1
- package/src/vaadin-rich-text-editor-popup.js +1 -1
- package/src/vaadin-rich-text-editor.js +2 -2
- package/web-types.json +1 -1
- package/web-types.lit.json +1 -1
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@vaadin/rich-text-editor",
|
|
3
|
-
"version": "25.0.0-
|
|
3
|
+
"version": "25.0.0-beta5",
|
|
4
4
|
"publishConfig": {
|
|
5
5
|
"access": "public"
|
|
6
6
|
},
|
|
@@ -35,22 +35,22 @@
|
|
|
35
35
|
],
|
|
36
36
|
"dependencies": {
|
|
37
37
|
"@open-wc/dedupe-mixin": "^1.3.0",
|
|
38
|
-
"@vaadin/a11y-base": "25.0.0-
|
|
39
|
-
"@vaadin/button": "25.0.0-
|
|
40
|
-
"@vaadin/component-base": "25.0.0-
|
|
41
|
-
"@vaadin/confirm-dialog": "25.0.0-
|
|
42
|
-
"@vaadin/overlay": "25.0.0-
|
|
43
|
-
"@vaadin/text-field": "25.0.0-
|
|
44
|
-
"@vaadin/tooltip": "25.0.0-
|
|
45
|
-
"@vaadin/vaadin-themable-mixin": "25.0.0-
|
|
38
|
+
"@vaadin/a11y-base": "25.0.0-beta5",
|
|
39
|
+
"@vaadin/button": "25.0.0-beta5",
|
|
40
|
+
"@vaadin/component-base": "25.0.0-beta5",
|
|
41
|
+
"@vaadin/confirm-dialog": "25.0.0-beta5",
|
|
42
|
+
"@vaadin/overlay": "25.0.0-beta5",
|
|
43
|
+
"@vaadin/text-field": "25.0.0-beta5",
|
|
44
|
+
"@vaadin/tooltip": "25.0.0-beta5",
|
|
45
|
+
"@vaadin/vaadin-themable-mixin": "25.0.0-beta5",
|
|
46
46
|
"lit": "^3.0.0"
|
|
47
47
|
},
|
|
48
48
|
"devDependencies": {
|
|
49
49
|
"@vaadin/a11y-base": "25.0.0-alpha17",
|
|
50
|
-
"@vaadin/chai-plugins": "25.0.0-
|
|
51
|
-
"@vaadin/test-runner-commands": "25.0.0-
|
|
50
|
+
"@vaadin/chai-plugins": "25.0.0-beta5",
|
|
51
|
+
"@vaadin/test-runner-commands": "25.0.0-beta5",
|
|
52
52
|
"@vaadin/testing-helpers": "^2.0.0",
|
|
53
|
-
"@vaadin/vaadin-lumo-styles": "25.0.0-
|
|
53
|
+
"@vaadin/vaadin-lumo-styles": "25.0.0-beta5",
|
|
54
54
|
"sinon": "^21.0.0"
|
|
55
55
|
},
|
|
56
56
|
"cvdlName": "vaadin-rich-text-editor",
|
|
@@ -58,5 +58,5 @@
|
|
|
58
58
|
"web-types.json",
|
|
59
59
|
"web-types.lit.json"
|
|
60
60
|
],
|
|
61
|
-
"gitHead": "
|
|
61
|
+
"gitHead": "ba59e1404cc4bef2dd685476247f758eb28c9922"
|
|
62
62
|
}
|
|
@@ -13,10 +13,6 @@ import { icons } from './vaadin-rich-text-editor-base-icons.js';
|
|
|
13
13
|
|
|
14
14
|
const base = css`
|
|
15
15
|
:host {
|
|
16
|
-
background: var(--vaadin-rich-text-editor-background, var(--vaadin-background-color));
|
|
17
|
-
border: var(--vaadin-input-field-border-width, 1px) solid
|
|
18
|
-
var(--vaadin-input-field-border-color, var(--vaadin-border-color));
|
|
19
|
-
border-radius: var(--vaadin-input-field-border-radius, var(--vaadin-radius-m));
|
|
20
16
|
box-sizing: border-box;
|
|
21
17
|
display: flex;
|
|
22
18
|
flex-direction: column;
|
|
@@ -41,7 +37,11 @@ const base = css`
|
|
|
41
37
|
flex-direction: column;
|
|
42
38
|
max-height: inherit;
|
|
43
39
|
min-height: inherit;
|
|
44
|
-
|
|
40
|
+
background: var(--vaadin-rich-text-editor-background, var(--vaadin-background-color));
|
|
41
|
+
border: var(--vaadin-input-field-border-width, 1px) solid
|
|
42
|
+
var(--vaadin-input-field-border-color, var(--vaadin-border-color));
|
|
43
|
+
border-radius: var(--vaadin-input-field-border-radius, var(--vaadin-radius-m));
|
|
44
|
+
outline-offset: calc(var(--vaadin-input-field-border-width, 1px) * -1);
|
|
45
45
|
contain: paint;
|
|
46
46
|
}
|
|
47
47
|
|
|
@@ -94,7 +94,10 @@ export const content = css`
|
|
|
94
94
|
line-height: var(--vaadin-rich-text-editor-content-line-height, inherit);
|
|
95
95
|
outline: none;
|
|
96
96
|
overflow-y: auto;
|
|
97
|
-
padding: var(
|
|
97
|
+
padding: var(
|
|
98
|
+
--vaadin-rich-text-editor-content-padding,
|
|
99
|
+
var(--vaadin-padding-block-container) var(--vaadin-padding-inline-container)
|
|
100
|
+
);
|
|
98
101
|
tab-size: calc(var(--_item-indent) * 2);
|
|
99
102
|
text-align: left;
|
|
100
103
|
white-space: pre-wrap;
|
|
@@ -132,7 +135,7 @@ export const content = css`
|
|
|
132
135
|
border-radius: var(--vaadin-radius-s);
|
|
133
136
|
white-space: pre-wrap;
|
|
134
137
|
margin-block: var(--vaadin-padding-s);
|
|
135
|
-
padding: var(--vaadin-padding-container);
|
|
138
|
+
padding: var(--vaadin-padding-block-container) var(--vaadin-padding-inline-container);
|
|
136
139
|
}
|
|
137
140
|
|
|
138
141
|
/* lists */
|
|
@@ -360,7 +363,7 @@ export const content = css`
|
|
|
360
363
|
|
|
361
364
|
blockquote {
|
|
362
365
|
border-inline-start: 4px solid var(--vaadin-border-color-secondary);
|
|
363
|
-
margin: var(--vaadin-padding-container);
|
|
366
|
+
margin: var(--vaadin-padding-block-container) var(--vaadin-padding-inline-container);
|
|
364
367
|
padding-inline-start: var(--vaadin-padding-s);
|
|
365
368
|
}
|
|
366
369
|
|
|
@@ -412,7 +415,10 @@ const toolbar = css`
|
|
|
412
415
|
cursor: var(--vaadin-clickable-cursor);
|
|
413
416
|
flex-shrink: 0;
|
|
414
417
|
font: inherit;
|
|
415
|
-
padding: var(
|
|
418
|
+
padding: var(
|
|
419
|
+
--vaadin-rich-text-editor-toolbar-button-padding,
|
|
420
|
+
var(--vaadin-padding-block-container) var(--vaadin-padding-inline-container)
|
|
421
|
+
);
|
|
416
422
|
position: relative;
|
|
417
423
|
}
|
|
418
424
|
|
|
@@ -13,7 +13,10 @@ import { overlayStyles } from '@vaadin/overlay/src/styles/vaadin-overlay-base-st
|
|
|
13
13
|
|
|
14
14
|
export const richTextEditorPopupOverlay = css`
|
|
15
15
|
[part='overlay'] {
|
|
16
|
-
padding: var(
|
|
16
|
+
padding: var(
|
|
17
|
+
--vaadin-rich-text-editor-overlay-padding,
|
|
18
|
+
var(--vaadin-padding-block-container) var(--vaadin-padding-inline-container)
|
|
19
|
+
);
|
|
17
20
|
}
|
|
18
21
|
|
|
19
22
|
[part='content'] {
|
|
@@ -23,6 +26,7 @@ export const richTextEditorPopupOverlay = css`
|
|
|
23
26
|
}
|
|
24
27
|
|
|
25
28
|
[part='content'] ::slotted(button) {
|
|
29
|
+
background-color: var(--_btn-background);
|
|
26
30
|
border: var(--vaadin-rich-text-editor-overlay-color-option-border-width, 1px) solid
|
|
27
31
|
var(--vaadin-rich-text-editor-overlay-color-option-border-color, transparent);
|
|
28
32
|
border-radius: var(--vaadin-rich-text-editor-overlay-color-option-border-radius, 9999px);
|
|
@@ -33,6 +37,19 @@ export const richTextEditorPopupOverlay = css`
|
|
|
33
37
|
width: var(--vaadin-rich-text-editor-overlay-color-option-width, 1lh);
|
|
34
38
|
}
|
|
35
39
|
|
|
40
|
+
[part='content'] ::slotted(button:first-of-type) {
|
|
41
|
+
background-color: transparent;
|
|
42
|
+
border-color: var(--vaadin-border-color-secondary);
|
|
43
|
+
background-image: repeating-linear-gradient(
|
|
44
|
+
135deg,
|
|
45
|
+
transparent 0%,
|
|
46
|
+
transparent 47%,
|
|
47
|
+
red 50%,
|
|
48
|
+
transparent 53%,
|
|
49
|
+
transparent 100%
|
|
50
|
+
);
|
|
51
|
+
}
|
|
52
|
+
|
|
36
53
|
[part='content'] ::slotted(button:focus-visible) {
|
|
37
54
|
outline: var(--vaadin-focus-ring-width) solid var(--vaadin-focus-ring-color);
|
|
38
55
|
outline-offset: 1px;
|
|
@@ -110,7 +110,7 @@ class RichTextEditorPopup extends PolylitMixin(LitElement) {
|
|
|
110
110
|
html`
|
|
111
111
|
${colors.map(
|
|
112
112
|
(color) => html`
|
|
113
|
-
<button data-color="${color}" style="background: ${color}" @click="${this._onColorClick}"></button>
|
|
113
|
+
<button data-color="${color}" style="--_btn-background: ${color}" @click="${this._onColorClick}"></button>
|
|
114
114
|
`,
|
|
115
115
|
)}
|
|
116
116
|
`,
|
|
@@ -428,7 +428,7 @@ class RichTextEditor extends RichTextEditorMixin(
|
|
|
428
428
|
|
|
429
429
|
<vaadin-rich-text-editor-popup
|
|
430
430
|
slot="color-popup"
|
|
431
|
-
.colors="${this.colorOptions}"
|
|
431
|
+
.colors="${['#000000', ...[...this.colorOptions].filter((c) => c !== '#000000')]}"
|
|
432
432
|
.opened="${this._colorEditing}"
|
|
433
433
|
@color-selected="${this.__onColorSelected}"
|
|
434
434
|
@opened-changed="${this.__onColorEditingChanged}"
|
|
@@ -436,7 +436,7 @@ class RichTextEditor extends RichTextEditorMixin(
|
|
|
436
436
|
|
|
437
437
|
<vaadin-rich-text-editor-popup
|
|
438
438
|
slot="background-popup"
|
|
439
|
-
.colors="${this.colorOptions}"
|
|
439
|
+
.colors="${['#ffffff', ...[...this.colorOptions].filter((c) => c !== '#ffffff')]}"
|
|
440
440
|
.opened="${this._backgroundEditing}"
|
|
441
441
|
@color-selected="${this.__onBackgroundSelected}"
|
|
442
442
|
@opened-changed="${this.__onBackgroundEditingChanged}"
|
package/web-types.json
CHANGED
package/web-types.lit.json
CHANGED