@vaadin/rich-text-editor 24.0.0-alpha9 → 24.0.0-beta1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vaadin/rich-text-editor",
-  "version": "24.0.0-alpha9",
+  "version": "24.0.0-beta1",
   "publishConfig": {
     "access": "public"
   },
@@ -40,18 +40,18 @@
   ],
   "dependencies": {
     "@polymer/polymer": "^3.0.0",
-    "@vaadin/button": "24.0.0-alpha9",
-    "@vaadin/component-base": "24.0.0-alpha9",
-    "@vaadin/confirm-dialog": "24.0.0-alpha9",
-    "@vaadin/text-field": "24.0.0-alpha9",
-    "@vaadin/tooltip": "24.0.0-alpha9",
-    "@vaadin/vaadin-lumo-styles": "24.0.0-alpha9",
-    "@vaadin/vaadin-material-styles": "24.0.0-alpha9",
-    "@vaadin/vaadin-themable-mixin": "24.0.0-alpha9"
+    "@vaadin/button": "24.0.0-beta1",
+    "@vaadin/component-base": "24.0.0-beta1",
+    "@vaadin/confirm-dialog": "24.0.0-beta1",
+    "@vaadin/text-field": "24.0.0-beta1",
+    "@vaadin/tooltip": "24.0.0-beta1",
+    "@vaadin/vaadin-lumo-styles": "24.0.0-beta1",
+    "@vaadin/vaadin-material-styles": "24.0.0-beta1",
+    "@vaadin/vaadin-themable-mixin": "24.0.0-beta1"
   },
   "devDependencies": {
     "@esm-bundle/chai": "^4.3.4",
-    "@vaadin/testing-helpers": "^0.3.2",
+    "@vaadin/testing-helpers": "^0.4.0",
     "gulp": "^4.0.2",
     "gulp-cli": "^2.3.0",
     "gulp-iconfont": "^11.0.0",
@@ -62,5 +62,5 @@
     "web-types.json",
     "web-types.lit.json"
   ],
-  "gitHead": "cc3f747164041566b300bde4b105d2475649e93f"
+  "gitHead": "c5b48921a62482746df8e46994b37e1490fec27e"
 }

package/src/vaadin-rich-text-editor-toolbar-styles.js

@@ -124,7 +124,7 @@ export const buttonsStyles = css`
   }
 
   [part~='toolbar-button-blockquote']::before {
-    content: '”';
+    content: '\\201D';
     font-size: 2em;
     height: 0.6em;
   }

package/src/vaadin-rich-text-editor.js

@@ -511,6 +511,13 @@ class RichTextEditor extends ElementMixin(ThemableMixin(PolymerElement)) {
     return ['_valueChanged(value, _editor)', '_disabledChanged(disabled, readonly, _editor)'];
   }
 
+  /** @private */
+  get _toolbarButtons() {
+    return Array.from(this.shadowRoot.querySelectorAll('[part="toolbar"] button')).filter((btn) => {
+      return btn.clientHeight > 0;
+    });
+  }
+
   /**
    * @param {string} prop
    * @param {?string} oldVal
@@ -958,13 +965,6 @@ class RichTextEditor extends ElementMixin(ThemableMixin(PolymerElement)) {
     );
   }
 
-  /** @private */
-  get _toolbarButtons() {
-    return Array.from(this.shadowRoot.querySelectorAll('[part="toolbar"] button')).filter((btn) => {
-      return btn.clientHeight > 0;
-    });
-  }
-
   /** @private */
   _clear() {
     this._editor.deleteText(0, this._editor.getLength(), SOURCE.SILENT);

package/theme/lumo/vaadin-rich-text-editor-styles.js

@@ -216,6 +216,32 @@ const richTextEditor = css`
   }
 `;
 
-registerStyles('vaadin-rich-text-editor', [color, typography, richTextEditor], {
+const contentStyles = css`
+  :where(h1, h2, h3, h4, h5, h6) {
+    margin-top: 1.25em;
+  }
+
+  :where(h1) {
+    margin-bottom: 0.75em;
+  }
+
+  :where(h2) {
+    margin-bottom: 0.5em;
+  }
+
+  :where(h3) {
+    margin-bottom: 0.5em;
+  }
+
+  :where(h4) {
+    margin-bottom: 0.5em;
+  }
+
+  :where(h5) {
+    margin-bottom: 0.25em;
+  }
+`;
+
+registerStyles('vaadin-rich-text-editor', [color, typography, richTextEditor, contentStyles], {
   moduleId: 'lumo-rich-text-editor',
 });

package/web-types.json

@@ -1,7 +1,7 @@
 {
   "$schema": "https://json.schemastore.org/web-types",
   "name": "@vaadin/rich-text-editor",
-  "version": "24.0.0-alpha9",
+  "version": "24.0.0-alpha12",
   "description-markup": "markdown",
   "contributions": {
     "html": {

package/web-types.lit.json

@@ -1,7 +1,7 @@
 {
   "$schema": "https://json.schemastore.org/web-types",
   "name": "@vaadin/rich-text-editor",
-  "version": "24.0.0-alpha9",
+  "version": "24.0.0-alpha12",
   "description-markup": "markdown",
   "framework": "lit",
   "framework-config": {