Merge pull request #106 from eea/develop

fix block style on slate, ref #278618

Author: razvanMiu

CHANGELOG.md

@@ -4,6 +4,14 @@ All notable changes to this project will be documented in this file. Dates are d
 
 Generated by [`auto-changelog`](https://github.com/CookPete/auto-changelog).
 
+### [7.2.0](https://github.com/eea/volto-block-style/compare/7.1.0...7.2.0) - 11 November 2024
+
+#### :hammer_and_wrench: Others
+
+- fix sonarqube bugs [Miu Razvan - [`8f72687`](https://github.com/eea/volto-block-style/commit/8f726879960ac699b5c1028297c462de5c1818d0)]
+- update [Miu Razvan - [`2c2197e`](https://github.com/eea/volto-block-style/commit/2c2197ea01db9f2def9549133669634d9aa94023)]
+- bump version [Miu Razvan - [`3d74398`](https://github.com/eea/volto-block-style/commit/3d7439854251974afe831370d45ebaf9d01b77a1)]
+- fix block style on slate, ref #278618 [Miu Razvan - [`ce9982d`](https://github.com/eea/volto-block-style/commit/ce9982df68c8ce9a1f60cf72178060e1ddce480f)]
 ### [7.1.0](https://github.com/eea/volto-block-style/compare/7.0.0...7.1.0) - 3 June 2024
 
 #### :hammer_and_wrench: Others

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@eeacms/volto-block-style",
-  "version": "7.1.0",
+  "version": "7.2.0",
   "description": "volto-block-style: Volto add-on",
   "main": "src/index.js",
   "author": "European Environment Agency: IDM2 A-Team",

src/StyleWrapper/StyleWrapperView.jsx

@@ -161,6 +161,8 @@ const StyleWrapperView = (props) => {
         medium: size === 'm',
         small: size === 's',
         'drop-cap': isDropCap,
+        [`has--fontSize--${inlineStyles['fontSize']}`]:
+          !!inlineStyles['fontSize'] && mode === 'edit',
       },
     ),
     id: customId,

src/Widgets/Slider.jsx

@@ -84,8 +84,11 @@ export class Slider extends Component {
         this.setValue(val, triggeredByUser, i);
         positions[i] = this.determinePosition(val);
       });
-      this.setState({
-        position: positions,
+      this.setState((prevState) => {
+        const positions = [...prevState.position];
+        return {
+          position: positions,
+        };
       });
     } else {
       this.setValue(value, triggeredByUser);
@@ -211,11 +214,13 @@ export class Slider extends Component {
 
   setValuePosition(value, triggeredByUser, knobIndex) {
     if (this.props.multiple) {
-      const positions = [...this.state.position];
-      positions[knobIndex] = this.determinePosition(value);
       this.setValue(value, triggeredByUser, knobIndex);
-      this.setState({
-        position: positions,
+      this.setState((prevState) => {
+        const positions = [...prevState.position];
+        positions[knobIndex] = this.determinePosition(value);
+        return {
+          position: positions,
+        };
       });
     } else {
       this.setValue(value, triggeredByUser);
@@ -227,10 +232,12 @@ export class Slider extends Component {
 
   setPosition(position, knobIndex) {
     if (this.props.multiple) {
-      const newPosition = [...this.state.position];
-      newPosition[knobIndex] = position;
-      this.setState({
-        position: newPosition,
+      this.setState((prevState) => {
+        const newPosition = [...prevState.position];
+        newPosition[knobIndex] = position;
+        return {
+          position: newPosition,
+        };
       });
     } else {
       this.setState({

src/index.js

@@ -64,6 +64,11 @@ const applyConfig = (config) => {
     blocksConfig[name] = applyStyleWrapperToBlock(blocksConfig[name]);
   });
 
+  config.settings.integratesBlockStyles = [
+    ...(config.settings.integratesBlockStyles || []),
+    'slate',
+  ];
+
   config.widgets.widget.style_select = StyleSelectWidget;
   config.widgets.widget.style_align = AlignWidget; // avoid conflict for now
   config.widgets.widget.style_stretch = StretchWidget; // Make stretch widget

src/styles.less

@@ -119,6 +119,18 @@
   }
 }
 
+.styled[class*='has--fontSize'] {
+  h1,
+  h2,
+  h3,
+  h4,
+  h5,
+  h6,
+  p {
+    font-size: inherit;
+  }
+}
+
 .styled-with-bg {
   padding: @styledPadding;
 }