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

Comparing version 0.0.0-PR2424-20250111000645 to 0.0.0-PR2425-20250111002724

CHANGELOG.md

 # @khanacademy/wonder-blocks-form
 
-## 0.0.0-PR2424-20250111000645
+## 0.0.0-PR2425-20250111002724
 
 ### Patch Changes
 
--   d8e04857: TextField, TextArea, SearchField: Clear error state when field is cleared and it is not required
+-   d9bc865b: TextField and TextArea: Set `aria-required` if it is required
+-   d9bc865b: TextField and TextArea validation: Always clear error message onChange if instantValidation=false so externally set error state can still be cleared
 
-## 6.0.5
-
-### Patch Changes
-
--   Updated dependencies [7516b239]
-    -   @khanacademy/wonder-blocks-core@11.1.0
-    -   @khanacademy/wonder-blocks-clickable@5.0.5
-    -   @khanacademy/wonder-blocks-icon@5.0.5
-    -   @khanacademy/wonder-blocks-layout@3.0.5
-    -   @khanacademy/wonder-blocks-typography@3.0.5
-
-## 6.0.4
-
-### Patch Changes
-
--   11a0f5c6: No functional changes. Adding prepublishOnly script.
--   Updated dependencies [11a0f5c6]
-    -   @khanacademy/wonder-blocks-typography@3.0.4
-    -   @khanacademy/wonder-blocks-clickable@5.0.4
-    -   @khanacademy/wonder-blocks-layout@3.0.4
-    -   @khanacademy/wonder-blocks-tokens@3.0.1
-    -   @khanacademy/wonder-blocks-core@11.0.1
-    -   @khanacademy/wonder-blocks-icon@5.0.4
-
-## 6.0.3
-
-### Patch Changes
-
--   53b41970: Adding more info about the legend change
-
-## 6.0.2
-
-### Patch Changes
-
--   361cb52b: Adds `width: 100%` to `legend` element to allow expanding it to fill the available space
-
-## 6.0.1
-
-### Patch Changes
-
--   Updated dependencies [d23c9c5f]
-    -   @khanacademy/wonder-blocks-core@11.0.0
-    -   @khanacademy/wonder-blocks-clickable@5.0.3
-    -   @khanacademy/wonder-blocks-icon@5.0.3
-    -   @khanacademy/wonder-blocks-layout@3.0.3
-    -   @khanacademy/wonder-blocks-typography@3.0.3
-
 ## 6.0.0
@@ -57,0 +11,0 @@

dist/es/index.js

@@ -476,4 +476,3 @@ import _extends from '@babel/runtime/helpers/extends';
   legend: {
-    padding: 0,
-    width: "100%"
+    padding: 0
   },
@@ -603,3 +602,2 @@ description: {
 }) => {
-  const prevValue = React.useRef(value);
   const [errorMessage, setErrorMessage] = React.useState(() => validate && value !== "" && !_disabled && validate(value) || null);
@@ -610,7 +608,5 @@ const onChangeValidation = newValue => {
     } else {
-      if (errorMessage) {
-        setErrorMessage(null);
-        if (onValidate) {
-          onValidate(null);
-        }
+      setErrorMessage(null);
+      if (onValidate) {
+        onValidate(null);
       }
@@ -650,11 +646,2 @@ }
   });
-  React.useEffect(() => {
-    if (!_required && prevValue.current !== value && value.length === 0) {
-      setErrorMessage(null);
-      if (onValidate) {
-        onValidate(null);
-      }
-    }
-    prevValue.current = value;
-  }, [onValidate, _required, value]);
   return {
@@ -740,2 +727,3 @@ errorMessage,
     "aria-disabled": disabled,
+    "aria-required": !!required,
     onChange: handleChange,
@@ -1152,2 +1140,3 @@ onKeyDown: disabled ? undefined : onKeyDown,
     maxLength: maxLength,
+    "aria-required": !!required,
     onClick: disabled ? undefined : onClick,
@@ -1154,0 +1143,0 @@ onKeyDown: disabled ? undefined : onKeyDown,

dist/index.js

@@ -505,4 +505,3 @@ 'use strict';
   legend: {
-    padding: 0,
-    width: "100%"
+    padding: 0
   },
@@ -632,3 +631,2 @@ description: {
 }) => {
-  const prevValue = React__namespace.useRef(value);
   const [errorMessage, setErrorMessage] = React__namespace.useState(() => validate && value !== "" && !_disabled && validate(value) || null);
@@ -639,7 +637,5 @@ const onChangeValidation = newValue => {
     } else {
-      if (errorMessage) {
-        setErrorMessage(null);
-        if (onValidate) {
-          onValidate(null);
-        }
+      setErrorMessage(null);
+      if (onValidate) {
+        onValidate(null);
       }
@@ -679,11 +675,2 @@ }
   });
-  React__namespace.useEffect(() => {
-    if (!_required && prevValue.current !== value && value.length === 0) {
-      setErrorMessage(null);
-      if (onValidate) {
-        onValidate(null);
-      }
-    }
-    prevValue.current = value;
-  }, [onValidate, _required, value]);
   return {
@@ -769,2 +756,3 @@ errorMessage,
     "aria-disabled": disabled,
+    "aria-required": !!required,
     onChange: handleChange,
@@ -1181,2 +1169,3 @@ onKeyDown: disabled ? undefined : onKeyDown,
     maxLength: maxLength,
+    "aria-required": !!required,
     onClick: disabled ? undefined : onClick,
@@ -1183,0 +1172,0 @@ onKeyDown: disabled ? undefined : onKeyDown,

package.json

 {
   "name": "@khanacademy/wonder-blocks-form",
-  "version": "0.0.0-PR2424-20250111000645",
+  "version": "0.0.0-PR2425-20250111002724",
   "design": "v1",
@@ -10,4 +10,3 @@ "description": "Form components for Wonder Blocks.",
   "scripts": {
-    "test": "echo \"Error: no test specified\" && exit 1",
-    "prepublishOnly": "../../utils/publish/package-pre-publish-check.sh"
+    "test": "echo \"Error: no test specified\" && exit 1"
   },
@@ -21,8 +20,8 @@ "author": "",
     "@babel/runtime": "^7.18.6",
-    "@khanacademy/wonder-blocks-clickable": "^5.0.5",
-    "@khanacademy/wonder-blocks-core": "^11.1.0",
-    "@khanacademy/wonder-blocks-icon": "^5.0.5",
-    "@khanacademy/wonder-blocks-layout": "^3.0.5",
-    "@khanacademy/wonder-blocks-tokens": "^3.0.1",
-    "@khanacademy/wonder-blocks-typography": "^3.0.5"
+    "@khanacademy/wonder-blocks-clickable": "^5.0.2",
+    "@khanacademy/wonder-blocks-core": "^10.0.0",
+    "@khanacademy/wonder-blocks-icon": "^5.0.2",
+    "@khanacademy/wonder-blocks-layout": "^3.0.2",
+    "@khanacademy/wonder-blocks-tokens": "^3.0.0",
+    "@khanacademy/wonder-blocks-typography": "^3.0.2"
   },
@@ -29,0 +28,0 @@ "peerDependencies": {

No alert changes

Worsened metrics

Total package byte prevSize

145354

decreased by-1.24%

Lines of code

3745

decreased by-0.58%

Dependency changes

• + Added@khanacademy/wonder-blocks-core@10.0.0(transitive)

• Updated@khanacademy/wonder-blocks-clickable@^5.0.2

• Updated@khanacademy/wonder-blocks-core@^10.0.0

• Updated@khanacademy/wonder-blocks-icon@^5.0.2

• Updated@khanacademy/wonder-blocks-layout@^3.0.2

• Updated@khanacademy/wonder-blocks-tokens@^3.0.0

• Updated@khanacademy/wonder-blocks-typography@^3.0.2