@khanacademy/wonder-blocks-form 7.1.0 → 7.1.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +13 -0
- package/dist/index.js +32 -23
- package/package.json +8 -8
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,18 @@
|
|
|
1
1
|
# @khanacademy/wonder-blocks-form
|
|
2
2
|
|
|
3
|
+
## 7.1.1
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- ee8d95a: Rollback rollup version from v4 to v2 to prevent an issue with CJS builds in unit tests
|
|
8
|
+
- Updated dependencies [ee8d95a]
|
|
9
|
+
- @khanacademy/wonder-blocks-clickable@6.1.1
|
|
10
|
+
- @khanacademy/wonder-blocks-core@12.1.1
|
|
11
|
+
- @khanacademy/wonder-blocks-icon@5.1.1
|
|
12
|
+
- @khanacademy/wonder-blocks-layout@3.1.1
|
|
13
|
+
- @khanacademy/wonder-blocks-tokens@4.2.1
|
|
14
|
+
- @khanacademy/wonder-blocks-typography@3.1.1
|
|
15
|
+
|
|
3
16
|
## 7.1.0
|
|
4
17
|
|
|
5
18
|
### Minor Changes
|
package/dist/index.js
CHANGED
|
@@ -1,5 +1,7 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
+
|
|
3
5
|
var _extends = require('@babel/runtime/helpers/extends');
|
|
4
6
|
var React = require('react');
|
|
5
7
|
var _objectWithoutPropertiesLoose = require('@babel/runtime/helpers/objectWithoutPropertiesLoose');
|
|
@@ -12,7 +14,10 @@ var wonderBlocksIcon = require('@khanacademy/wonder-blocks-icon');
|
|
|
12
14
|
var checkIcon = require('@phosphor-icons/core/bold/check-bold.svg');
|
|
13
15
|
var minusIcon = require('@phosphor-icons/core/bold/minus-bold.svg');
|
|
14
16
|
|
|
15
|
-
function
|
|
17
|
+
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
18
|
+
|
|
19
|
+
function _interopNamespace(e) {
|
|
20
|
+
if (e && e.__esModule) return e;
|
|
16
21
|
var n = Object.create(null);
|
|
17
22
|
if (e) {
|
|
18
23
|
Object.keys(e).forEach(function (k) {
|
|
@@ -25,11 +30,15 @@ function _interopNamespaceDefault(e) {
|
|
|
25
30
|
}
|
|
26
31
|
});
|
|
27
32
|
}
|
|
28
|
-
n
|
|
33
|
+
n["default"] = e;
|
|
29
34
|
return Object.freeze(n);
|
|
30
35
|
}
|
|
31
36
|
|
|
32
|
-
var
|
|
37
|
+
var _extends__default = /*#__PURE__*/_interopDefaultLegacy(_extends);
|
|
38
|
+
var React__namespace = /*#__PURE__*/_interopNamespace(React);
|
|
39
|
+
var _objectWithoutPropertiesLoose__default = /*#__PURE__*/_interopDefaultLegacy(_objectWithoutPropertiesLoose);
|
|
40
|
+
var checkIcon__default = /*#__PURE__*/_interopDefaultLegacy(checkIcon);
|
|
41
|
+
var minusIcon__default = /*#__PURE__*/_interopDefaultLegacy(minusIcon);
|
|
33
42
|
|
|
34
43
|
const _excluded$7 = ["checked", "disabled", "error", "groupName", "id", "testId"];
|
|
35
44
|
function mapCheckedToAriaChecked(value) {
|
|
@@ -54,7 +63,7 @@ const CheckboxCore = React__namespace.forwardRef(function CheckboxCore(props, re
|
|
|
54
63
|
id,
|
|
55
64
|
testId
|
|
56
65
|
} = props,
|
|
57
|
-
sharedProps =
|
|
66
|
+
sharedProps = _objectWithoutPropertiesLoose__default["default"](props, _excluded$7);
|
|
58
67
|
const innerRef = React__namespace.useRef(null);
|
|
59
68
|
React__namespace.useEffect(() => {
|
|
60
69
|
if (innerRef.current != null) {
|
|
@@ -68,7 +77,7 @@ const CheckboxCore = React__namespace.forwardRef(function CheckboxCore(props, re
|
|
|
68
77
|
const defaultStyle = [sharedStyles$1.inputReset, sharedStyles$1.default, !disabled && stateStyles.default, disabled && sharedStyles$1.disabled];
|
|
69
78
|
const checkboxIcon = React__namespace.createElement(wonderBlocksIcon.PhosphorIcon, {
|
|
70
79
|
color: disabled ? wonderBlocksTokens.semanticColor.icon.disabled : wonderBlocksTokens.semanticColor.icon.inverse,
|
|
71
|
-
icon: checked ?
|
|
80
|
+
icon: checked ? checkIcon__default["default"] : minusIcon__default["default"],
|
|
72
81
|
size: "small",
|
|
73
82
|
style: [sharedStyles$1.checkboxIcon, {
|
|
74
83
|
width: checkSize,
|
|
@@ -76,7 +85,7 @@ const CheckboxCore = React__namespace.forwardRef(function CheckboxCore(props, re
|
|
|
76
85
|
}]
|
|
77
86
|
});
|
|
78
87
|
const ariaChecked = mapCheckedToAriaChecked(checked);
|
|
79
|
-
return React__namespace.createElement(React__namespace.Fragment, null, React__namespace.createElement(StyledInput$2,
|
|
88
|
+
return React__namespace.createElement(React__namespace.Fragment, null, React__namespace.createElement(StyledInput$2, _extends__default["default"]({}, sharedProps, {
|
|
80
89
|
ref: node => {
|
|
81
90
|
innerRef.current = node;
|
|
82
91
|
if (typeof ref === "function") {
|
|
@@ -214,10 +223,10 @@ const RadioCore = React__namespace.forwardRef(function RadioCore(props, ref) {
|
|
|
214
223
|
id,
|
|
215
224
|
testId
|
|
216
225
|
} = props,
|
|
217
|
-
sharedProps =
|
|
226
|
+
sharedProps = _objectWithoutPropertiesLoose__default["default"](props, _excluded$6);
|
|
218
227
|
const stateStyles = _generateStyles(checked, error);
|
|
219
228
|
const defaultStyle = [sharedStyles.inputReset, sharedStyles.default, !disabled && stateStyles.default, disabled && sharedStyles.disabled];
|
|
220
|
-
return React__namespace.createElement(React__namespace.Fragment, null, React__namespace.createElement(StyledInput$1,
|
|
229
|
+
return React__namespace.createElement(React__namespace.Fragment, null, React__namespace.createElement(StyledInput$1, _extends__default["default"]({}, sharedProps, {
|
|
221
230
|
type: "radio",
|
|
222
231
|
"aria-invalid": error,
|
|
223
232
|
checked: checked != null ? checked : undefined,
|
|
@@ -357,7 +366,7 @@ const ChoiceInternal = React__namespace.forwardRef(function ChoiceInternal(props
|
|
|
357
366
|
className,
|
|
358
367
|
variant
|
|
359
368
|
} = props,
|
|
360
|
-
coreProps =
|
|
369
|
+
coreProps = _objectWithoutPropertiesLoose__default["default"](props, _excluded$5);
|
|
361
370
|
const handleClick = () => {
|
|
362
371
|
if (variant === "radio" && checked) {
|
|
363
372
|
return;
|
|
@@ -395,7 +404,7 @@ const ChoiceInternal = React__namespace.forwardRef(function ChoiceInternal(props
|
|
|
395
404
|
}, React__namespace.createElement(wonderBlocksCore.View, {
|
|
396
405
|
style: styles$4.wrapper,
|
|
397
406
|
tabIndex: -1
|
|
398
|
-
}, React__namespace.createElement(ChoiceCore,
|
|
407
|
+
}, React__namespace.createElement(ChoiceCore, _extends__default["default"]({}, coreProps, {
|
|
399
408
|
id: uniqueId,
|
|
400
409
|
checked: checked,
|
|
401
410
|
"aria-describedby": descriptionId,
|
|
@@ -433,7 +442,7 @@ const Checkbox = React__namespace.forwardRef(function Checkbox(props, ref) {
|
|
|
433
442
|
disabled = false,
|
|
434
443
|
error = false
|
|
435
444
|
} = props;
|
|
436
|
-
return React__namespace.createElement(ChoiceInternal,
|
|
445
|
+
return React__namespace.createElement(ChoiceInternal, _extends__default["default"]({}, props, {
|
|
437
446
|
variant: "checkbox",
|
|
438
447
|
disabled: disabled,
|
|
439
448
|
error: error,
|
|
@@ -447,8 +456,8 @@ const Radio = React__namespace.forwardRef(function Radio(props, ref) {
|
|
|
447
456
|
disabled = false,
|
|
448
457
|
error = false
|
|
449
458
|
} = props,
|
|
450
|
-
otherProps =
|
|
451
|
-
return React__namespace.createElement(ChoiceInternal,
|
|
459
|
+
otherProps = _objectWithoutPropertiesLoose__default["default"](props, _excluded$4);
|
|
460
|
+
return React__namespace.createElement(ChoiceInternal, _extends__default["default"]({}, otherProps, {
|
|
452
461
|
variant: "radio",
|
|
453
462
|
disabled: disabled,
|
|
454
463
|
error: error,
|
|
@@ -464,7 +473,7 @@ const Choice = React__namespace.forwardRef(function Choice(props, ref) {
|
|
|
464
473
|
onChange = () => {},
|
|
465
474
|
variant
|
|
466
475
|
} = props,
|
|
467
|
-
remainingProps =
|
|
476
|
+
remainingProps = _objectWithoutPropertiesLoose__default["default"](props, _excluded$3);
|
|
468
477
|
const getChoiceComponent = variant => {
|
|
469
478
|
if (variant === "checkbox") {
|
|
470
479
|
return Checkbox;
|
|
@@ -473,7 +482,7 @@ const Choice = React__namespace.forwardRef(function Choice(props, ref) {
|
|
|
473
482
|
}
|
|
474
483
|
};
|
|
475
484
|
const ChoiceComponent = getChoiceComponent(variant);
|
|
476
|
-
return React__namespace.createElement(ChoiceComponent,
|
|
485
|
+
return React__namespace.createElement(ChoiceComponent, _extends__default["default"]({}, remainingProps, {
|
|
477
486
|
checked: checked,
|
|
478
487
|
disabled: disabled,
|
|
479
488
|
onChange: onChange,
|
|
@@ -691,7 +700,7 @@ const TextField = props => {
|
|
|
691
700
|
onFocus,
|
|
692
701
|
onBlur
|
|
693
702
|
} = props,
|
|
694
|
-
otherProps =
|
|
703
|
+
otherProps = _objectWithoutPropertiesLoose__default["default"](props, _excluded$2);
|
|
695
704
|
const {
|
|
696
705
|
errorMessage,
|
|
697
706
|
onBlurValidation,
|
|
@@ -723,7 +732,7 @@ const TextField = props => {
|
|
|
723
732
|
};
|
|
724
733
|
return React__namespace.createElement(wonderBlocksCore.Id, {
|
|
725
734
|
id: id
|
|
726
|
-
}, uniqueId => React__namespace.createElement(StyledInput,
|
|
735
|
+
}, uniqueId => React__namespace.createElement(StyledInput, _extends__default["default"]({
|
|
727
736
|
style: [styles$2.input, wonderBlocksTypography.styles.LabelMedium, styles$2.default, !disabled && styles$2.defaultFocus, disabled && styles$2.disabled, hasError && styles$2.error, style],
|
|
728
737
|
id: uniqueId,
|
|
729
738
|
type: type,
|
|
@@ -811,7 +820,7 @@ const styles$2 = aphrodite.StyleSheet.create({
|
|
|
811
820
|
}
|
|
812
821
|
}
|
|
813
822
|
});
|
|
814
|
-
var TextField$1 = React__namespace.forwardRef((props, ref) => React__namespace.createElement(TextField,
|
|
823
|
+
var TextField$1 = React__namespace.forwardRef((props, ref) => React__namespace.createElement(TextField, _extends__default["default"]({}, props, {
|
|
815
824
|
forwardedRef: ref
|
|
816
825
|
})));
|
|
817
826
|
|
|
@@ -964,14 +973,14 @@ class LabeledTextField extends React__namespace.Component {
|
|
|
964
973
|
ariaDescribedby,
|
|
965
974
|
name
|
|
966
975
|
} = _this$props,
|
|
967
|
-
otherProps =
|
|
976
|
+
otherProps = _objectWithoutPropertiesLoose__default["default"](_this$props, _excluded$1);
|
|
968
977
|
return React__namespace.createElement(wonderBlocksCore.Id, {
|
|
969
978
|
id: id
|
|
970
979
|
}, uniqueId => React__namespace.createElement(FieldHeading, {
|
|
971
980
|
id: uniqueId,
|
|
972
981
|
testId: testId,
|
|
973
982
|
style: style,
|
|
974
|
-
field: React__namespace.createElement(TextField$1,
|
|
983
|
+
field: React__namespace.createElement(TextField$1, _extends__default["default"]({
|
|
975
984
|
id: `${uniqueId}-field`,
|
|
976
985
|
"aria-describedby": ariaDescribedby ? ariaDescribedby : `${uniqueId}-error`,
|
|
977
986
|
"aria-required": required ? "true" : "false",
|
|
@@ -1003,7 +1012,7 @@ LabeledTextField.defaultProps = {
|
|
|
1003
1012
|
type: "text",
|
|
1004
1013
|
disabled: false
|
|
1005
1014
|
};
|
|
1006
|
-
var labeledTextField = React__namespace.forwardRef((props, ref) => React__namespace.createElement(LabeledTextField,
|
|
1015
|
+
var labeledTextField = React__namespace.forwardRef((props, ref) => React__namespace.createElement(LabeledTextField, _extends__default["default"]({}, props, {
|
|
1007
1016
|
forwardedRef: ref
|
|
1008
1017
|
})));
|
|
1009
1018
|
|
|
@@ -1041,7 +1050,7 @@ const TextArea = React__namespace.forwardRef(function TextArea(props, ref) {
|
|
|
1041
1050
|
error,
|
|
1042
1051
|
instantValidation = true
|
|
1043
1052
|
} = props,
|
|
1044
|
-
otherProps =
|
|
1053
|
+
otherProps = _objectWithoutPropertiesLoose__default["default"](props, _excluded);
|
|
1045
1054
|
const {
|
|
1046
1055
|
errorMessage,
|
|
1047
1056
|
onBlurValidation,
|
|
@@ -1072,7 +1081,7 @@ const TextArea = React__namespace.forwardRef(function TextArea(props, ref) {
|
|
|
1072
1081
|
style: [{
|
|
1073
1082
|
width: "100%"
|
|
1074
1083
|
}, rootStyle]
|
|
1075
|
-
}, React__namespace.createElement(StyledTextarea,
|
|
1084
|
+
}, React__namespace.createElement(StyledTextarea, _extends__default["default"]({
|
|
1076
1085
|
id: uniqueId,
|
|
1077
1086
|
"data-testid": testId,
|
|
1078
1087
|
ref: ref,
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@khanacademy/wonder-blocks-form",
|
|
3
|
-
"version": "7.1.
|
|
3
|
+
"version": "7.1.1",
|
|
4
4
|
"design": "v1",
|
|
5
5
|
"description": "Form components for Wonder Blocks.",
|
|
6
6
|
"main": "dist/index.js",
|
|
@@ -13,12 +13,12 @@
|
|
|
13
13
|
},
|
|
14
14
|
"dependencies": {
|
|
15
15
|
"@babel/runtime": "^7.24.5",
|
|
16
|
-
"@khanacademy/wonder-blocks-clickable": "6.1.
|
|
17
|
-
"@khanacademy/wonder-blocks-core": "12.1.
|
|
18
|
-
"@khanacademy/wonder-blocks-icon": "5.1.
|
|
19
|
-
"@khanacademy/wonder-blocks-layout": "3.1.
|
|
20
|
-
"@khanacademy/wonder-blocks-tokens": "4.2.
|
|
21
|
-
"@khanacademy/wonder-blocks-typography": "3.1.
|
|
16
|
+
"@khanacademy/wonder-blocks-clickable": "6.1.1",
|
|
17
|
+
"@khanacademy/wonder-blocks-core": "12.1.1",
|
|
18
|
+
"@khanacademy/wonder-blocks-icon": "5.1.1",
|
|
19
|
+
"@khanacademy/wonder-blocks-layout": "3.1.1",
|
|
20
|
+
"@khanacademy/wonder-blocks-tokens": "4.2.1",
|
|
21
|
+
"@khanacademy/wonder-blocks-typography": "3.1.1"
|
|
22
22
|
},
|
|
23
23
|
"peerDependencies": {
|
|
24
24
|
"@phosphor-icons/core": "^2.0.2",
|
|
@@ -26,7 +26,7 @@
|
|
|
26
26
|
"react": "18.2.0"
|
|
27
27
|
},
|
|
28
28
|
"devDependencies": {
|
|
29
|
-
"@khanacademy/wb-dev-build-settings": "2.1.
|
|
29
|
+
"@khanacademy/wb-dev-build-settings": "2.1.1"
|
|
30
30
|
},
|
|
31
31
|
"scripts": {
|
|
32
32
|
"test": "echo \"Error: no test specified\" && exit 1"
|