@khanacademy/wonder-blocks-form - npm Package Compare versions

Comparing version 3.1.0 to 3.1.1

CHANGELOG.md

 # @khanacademy/wonder-blocks-form
 
+## 3.1.1
+
+### Patch Changes
+
+-   c13dc28e: Don't wrap Choices in a Fragment to so that each child has a 'key' prop
+
 ## 3.1.0
@@ -4,0 +10,0 @@

dist/es/index.js

@@ -573,3 +573,3 @@ import _extends from '@babel/runtime/helpers/extends';
       const checked = selectedValues.includes(value);
-      return React.createElement(React.Fragment, null, React.cloneElement(child, {
+      return React.cloneElement(child, {
         checked: checked,
@@ -583,3 +583,3 @@ error: !!errorMessage,
         variant: "checkbox"
-      }));
+      });
     })));
@@ -628,3 +628,3 @@ }
       const checked = selectedValue === value;
-      return React.createElement(React.Fragment, null, React.cloneElement(child, {
+      return React.cloneElement(child, {
         checked: checked,
@@ -638,3 +638,3 @@ error: !!errorMessage,
         variant: "radio"
-      }));
+      });
     })));
@@ -641,0 +641,0 @@ }

package.json

 {
   "name": "@khanacademy/wonder-blocks-form",
-  "version": "3.1.0",
+  "version": "3.1.1",
   "design": "v1",
@@ -5,0 +5,0 @@ "description": "Form components for Wonder Blocks.",

src/components/checkbox-group.js

@@ -159,20 +159,12 @@ // @flow
                         const checked = selectedValues.includes(value);
-                        return (
-                            <React.Fragment>
-                                {React.cloneElement(child, {
-                                    checked: checked,
-                                    error: !!errorMessage,
-                                    groupName: groupName,
-                                    id: `${groupName}-${value}`,
-                                    key: value,
-                                    onChange: () =>
-                                        this.handleChange(value, checked),
-                                    style: [
-                                        index > 0 && styles.defaultLineGap,
-                                        style,
-                                    ],
-                                    variant: "checkbox",
-                                })}
-                            </React.Fragment>
-                        );
+                        return React.cloneElement(child, {
+                            checked: checked,
+                            error: !!errorMessage,
+                            groupName: groupName,
+                            id: `${groupName}-${value}`,
+                            key: value,
+                            onChange: () => this.handleChange(value, checked),
+                            style: [index > 0 && styles.defaultLineGap, style],
+                            variant: "checkbox",
+                        });
                     })}
@@ -179,0 +171,0 @@ </View>

src/components/radio-group.js

@@ -149,19 +149,12 @@ // @flow
                         const checked = selectedValue === value;
-                        return (
-                            <React.Fragment>
-                                {React.cloneElement(child, {
-                                    checked: checked,
-                                    error: !!errorMessage,
-                                    groupName: groupName,
-                                    id: `${groupName}-${value}`,
-                                    key: value,
-                                    onChange: () => this.handleChange(value),
-                                    style: [
-                                        index > 0 && styles.defaultLineGap,
-                                        style,
-                                    ],
-                                    variant: "radio",
-                                })}
-                            </React.Fragment>
-                        );
+                        return React.cloneElement(child, {
+                            checked: checked,
+                            error: !!errorMessage,
+                            groupName: groupName,
+                            id: `${groupName}-${value}`,
+                            key: value,
+                            onChange: () => this.handleChange(value),
+                            style: [index > 0 && styles.defaultLineGap, style],
+                            variant: "radio",
+                        });
                     })}
@@ -168,0 +161,0 @@ </View>

No alert changes

Worsened metrics

Total package byte prevSize

331105

decreased by-0.28%

Lines of code

8512

decreased by-0.18%

No dependency changes