@kitconcept/volto-light-theme 3.3.0 → 3.3.1

package/.changelog.draft

@@ -1,12 +1,7 @@
-## 3.3.0 (2024-04-26)
-
-### Feature
-
-- Make font-weights, font-sizes and font-heights overrideable adding the `!default` thingy @erral [#371](https://github.com/kitconcept/volto-light-theme/pull/371)
+## 3.3.1 (2024-05-30)
 
 ### Bugfix
 
-- Fix event title margin bottom. @iFlameing [#357](https://github.com/kitconcept/volto-light-theme/pull/357)
-- Fix Image block in grid is not working @iRohitSingh [#376](https://github.com/kitconcept/volto-light-theme/pull/376)
+- Fix image grid clossure issues in inlined JSX method when selecting an image after uploading another image in another grid element @sneridagh [#389](https://github.com/kitconcept/volto-light-theme/pull/389)
 
 

package/.release-it.json

@@ -3,7 +3,8 @@
     "after:bump": [
       "pipx run towncrier build --draft --yes --version ${version} > .changelog.draft",
       "pipx run towncrier build --yes --version ${version}",
-      "cp ../../README.md ./ && cp CHANGELOG.md ../../CHANGELOG.md"
+      "cp ../../README.md ./ && cp CHANGELOG.md ../../CHANGELOG.md",
+      "git add ../../CHANGELOG.md"
     ],
     "after:release": "rm .changelog.draft"
   },

package/CHANGELOG.md

@@ -8,6 +8,12 @@
 
 <!-- towncrier release notes start -->
 
+## 3.3.1 (2024-05-30)
+
+### Bugfix
+
+- Fix image grid clossure issues in inlined JSX method when selecting an image after uploading another image in another grid element @sneridagh [#389](https://github.com/kitconcept/volto-light-theme/pull/389)
+
 ## 3.3.0 (2024-04-26)
 
 ### Feature

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kitconcept/volto-light-theme",
-  "version": "3.3.0",
+  "version": "3.3.1",
   "description": "Volto Light Theme by kitconcept",
   "main": "src/index.js",
   "types": "src/types/index.d.ts",

package/src/components/Blocks/Image/Edit.jsx

@@ -240,6 +240,23 @@ class Edit extends Component {
 
   node = React.createRef();
 
+  // START CUSTOMIZATION - Add custom dataAdapter
+  // It has to be a class method because if used directly we have closure issues while
+  // passing arguments to the dataAdapter function
+  onSelectItem = (url, item) => {
+    const dataAdapter =
+      this.props.blocksConfig[this.props.data['@type']].dataAdapter;
+    dataAdapter({
+      block: this.props.block,
+      data: this.props.data,
+      onChangeBlock: this.props.onChangeBlock,
+      id: 'url',
+      value: url,
+      item,
+    });
+  };
+  // END CUSTOMIZATION - Add custom dataAdapter
+
   /**
    * Render method.
    * @method render
@@ -247,11 +264,10 @@ class Edit extends Component {
    */
   render() {
     const Image = config.getComponent({ name: 'Image' }).component;
-    const { block, data, onChangeBlock } = this.props;
+    const { data } = this.props;
     const placeholder =
       this.props.data.placeholder ||
       this.props.intl.formatMessage(messages.ImageBlockInputPlaceholder);
-    const dataAdapter = this.props.blocksConfig[data['@type']].dataAdapter;
 
     return (
       <div
@@ -365,16 +381,7 @@ class Edit extends Component {
                                 e.stopPropagation();
                                 e.preventDefault();
                                 this.props.openObjectBrowser({
-                                  onSelectItem: (url, item) => {
-                                    dataAdapter({
-                                      block,
-                                      data,
-                                      onChangeBlock,
-                                      id: 'url',
-                                      value: url,
-                                      item,
-                                    });
-                                  },
+                                  onSelectItem: this.onSelectItem,
                                 });
                               }}
                             >