@khanacademy/perseus 1.3.0 → 1.3.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 +8 -0
- package/dist/es/index.js +7 -12
- package/dist/es/index.js.map +1 -1
- package/dist/index.js +7 -12
- package/dist/index.js.map +1 -1
- package/package.json +2 -2
- package/src/index.js +1 -0
- package/src/multi-items/__tests__/__snapshots__/multi-renderer_test.js.snap +21 -11
- package/src/widgets/__tests__/__snapshots__/group_test.jsx.snap +21 -11
- package/src/widgets/__tests__/__snapshots__/radio_test.jsx.snap +221 -117
- package/src/widgets/radio/__stories__/sat-styles.stories.jsx +191 -0
- package/src/widgets/radio/base-radio.jsx +1 -2
- package/src/widgets/radio/choice.jsx +4 -10
package/CHANGELOG.md
CHANGED
package/dist/es/index.js
CHANGED
|
@@ -27348,7 +27348,7 @@ function Choice(props) {
|
|
|
27348
27348
|
|
|
27349
27349
|
var satCorrectChoice = apiOptions.satStyling && reviewMode && correct;
|
|
27350
27350
|
var satIncorrectChecked = apiOptions.satStyling && reviewMode && !correct && checked;
|
|
27351
|
-
var descriptionClassName = classNames("description", satCorrectChoice && "sat-correct", satIncorrectChecked && "sat-incorrect", css(!apiOptions.satStyling && styles$o.description, apiOptions.satStyling && styles$o.satDescription, satCorrectChoice &&
|
|
27351
|
+
var descriptionClassName = classNames("description", satCorrectChoice && "sat-correct", satIncorrectChecked && "sat-incorrect", css(!apiOptions.satStyling && styles$o.description, apiOptions.satStyling && styles$o.satDescription, satCorrectChoice && checked && styles$o.satDescriptionCorrectChecked, satIncorrectChecked && styles$o.satDescriptionIncorrectChecked));
|
|
27352
27352
|
var rationaleClassName = classNames("perseus-radio-rationale-content", css(styles$o.rationale, !apiOptions.satStyling && styles$o.nonSatRationale, apiOptions.satStyling && styles$o.satReviewRationale)); // We want to show the choices as dimmed out when the choices are
|
|
27353
27353
|
// disabled. However, we don't want to do this in the SAT product and
|
|
27354
27354
|
// we also don't want to do this when we're in review mode in the
|
|
@@ -27362,12 +27362,12 @@ function Choice(props) {
|
|
|
27362
27362
|
style: {
|
|
27363
27363
|
dispay: "flex",
|
|
27364
27364
|
flexDirection: "column"
|
|
27365
|
-
}
|
|
27365
|
+
},
|
|
27366
|
+
className: descriptionClassName
|
|
27366
27367
|
}, /*#__PURE__*/React.createElement("div", {
|
|
27367
27368
|
style: {
|
|
27368
27369
|
display: "flex",
|
|
27369
27370
|
flexDirection: "row",
|
|
27370
|
-
width: "100%",
|
|
27371
27371
|
opacity: showDimmed ? 0.5 : 1.0
|
|
27372
27372
|
}
|
|
27373
27373
|
}, /*#__PURE__*/React.createElement("div", {
|
|
@@ -27386,7 +27386,8 @@ function Choice(props) {
|
|
|
27386
27386
|
},
|
|
27387
27387
|
onChange: () => {},
|
|
27388
27388
|
disabled: disabled || apiOptions.staticRender || apiOptions.readOnly,
|
|
27389
|
-
tabIndex: -1
|
|
27389
|
+
tabIndex: -1,
|
|
27390
|
+
className: ClassNames.RADIO.OPTION_CONTENT
|
|
27390
27391
|
}), /*#__PURE__*/React.createElement("label", {
|
|
27391
27392
|
htmlFor: choiceId
|
|
27392
27393
|
}, a11yText, " \xA0 ", content)), /*#__PURE__*/React.createElement(Clickable, {
|
|
@@ -27398,7 +27399,6 @@ function Choice(props) {
|
|
|
27398
27399
|
crossedOut: false
|
|
27399
27400
|
});
|
|
27400
27401
|
},
|
|
27401
|
-
className: descriptionClassName,
|
|
27402
27402
|
disabled: disabled || apiOptions.staticRender || apiOptions.readOnly,
|
|
27403
27403
|
style: {
|
|
27404
27404
|
flex: 1
|
|
@@ -27531,16 +27531,12 @@ var styles$o = StyleSheet.create({
|
|
|
27531
27531
|
boxSizing: "border-box",
|
|
27532
27532
|
cursor: "pointer",
|
|
27533
27533
|
marginLeft: 0,
|
|
27534
|
-
padding: "17px 14px"
|
|
27535
|
-
},
|
|
27536
|
-
satDescriptionCorrect: {
|
|
27537
|
-
color: satCorrectColor
|
|
27534
|
+
padding: "17px 14px 17px 0"
|
|
27538
27535
|
},
|
|
27539
27536
|
satDescriptionCorrectChecked: {
|
|
27540
27537
|
backgroundColor: satCorrectBackgroundColor
|
|
27541
27538
|
},
|
|
27542
27539
|
satDescriptionIncorrectChecked: {
|
|
27543
|
-
color: satIncorrectColor,
|
|
27544
27540
|
backgroundColor: satIncorrectBackgroundColor
|
|
27545
27541
|
},
|
|
27546
27542
|
rationale: {
|
|
@@ -27894,8 +27890,7 @@ var styles$n = StyleSheet.create({
|
|
|
27894
27890
|
}
|
|
27895
27891
|
},
|
|
27896
27892
|
radio: {
|
|
27897
|
-
|
|
27898
|
-
width: "100%"
|
|
27893
|
+
padding: 0
|
|
27899
27894
|
},
|
|
27900
27895
|
responsiveRadioContainer: {
|
|
27901
27896
|
borderBottom: "1px solid ".concat(radioBorderColor$1),
|