@khanacademy/perseus 1.3.4 → 1.3.5

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.
Files changed (20) hide show
  1. package/CHANGELOG.md +7 -0
  2. package/dist/es/index.js +89 -41
  3. package/dist/es/index.js.map +1 -1
  4. package/dist/index.js +89 -41
  5. package/dist/index.js.map +1 -1
  6. package/package.json +1 -1
  7. package/src/__tests__/__snapshots__/item-renderer_test.jsx.snap +1 -1
  8. package/src/__tests__/__snapshots__/server-item-renderer_test.jsx.snap +1 -1
  9. package/src/components/input-with-examples.jsx +12 -13
  10. package/src/index.js +1 -0
  11. package/src/multi-items/__tests__/__snapshots__/multi-renderer_test.js.snap +6 -6
  12. package/src/perseus-types.js +5 -4
  13. package/src/util.js +1 -1
  14. package/src/widgets/__stories__/input-number.stories.jsx +29 -3
  15. package/src/widgets/__tests__/__snapshots__/group_test.jsx.snap +5 -5
  16. package/src/widgets/__tests__/__snapshots__/input-number_test.jsx.snap +1 -1
  17. package/src/widgets/__tests__/__snapshots__/radio_test.jsx.snap +52 -52
  18. package/src/widgets/input-number.jsx +65 -11
  19. package/src/widgets/numeric-input.jsx +3 -0
  20. package/src/widgets/radio/choice.jsx +1 -1
package/package.json CHANGED
@@ -3,7 +3,7 @@
3
3
  "description": "Core Perseus API (includes renderers and widgets)",
4
4
  "author": "Khan Academy",
5
5
  "license": "MIT",
6
- "version": "1.3.4",
6
+ "version": "1.3.5",
7
7
  "publishConfig": {
8
8
  "access": "public"
9
9
  },
package/src/__tests__/__snapshots__/item-renderer_test.jsx.snap CHANGED
@@ -49,7 +49,7 @@ exports[`item renderer should snapshot: initial render 1`] = `
49
49
  autocapitalize="off"
50
50
  autocomplete="off"
51
51
  autocorrect="off"
52
- class="input_1t4b01j-o_O-LabelMedium_1rew30o-o_O-default_1r2dwp3"
52
+ class="input_1t4b01j-o_O-LabelMedium_1rew30o-o_O-default_1r2dwp3-o_O-default_1gznapd-o_O-leftAlign_7jg4r4"
53
53
  id="input-with-examples-aW5wdXQtbnVtYmVyIDE"
54
54
  type="text"
55
55
  value=""
package/src/__tests__/__snapshots__/server-item-renderer_test.jsx.snap CHANGED
@@ -47,7 +47,7 @@ exports[`server item renderer should snapshot: initial render 1`] = `
47
47
  autocapitalize="off"
48
48
  autocomplete="off"
49
49
  autocorrect="off"
50
- class="input_1t4b01j-o_O-LabelMedium_1rew30o-o_O-default_1r2dwp3"
50
+ class="input_1t4b01j-o_O-LabelMedium_1rew30o-o_O-default_1r2dwp3-o_O-default_1gznapd-o_O-leftAlign_7jg4r4"
51
51
  id="input-with-examples-aW5wdXQtbnVtYmVyIDE"
52
52
  type="text"
53
53
  value=""
package/src/components/input-with-examples.jsx CHANGED
@@ -14,11 +14,9 @@ import TextInput from "./text-input.jsx";
14
14
  import Tooltip from "./tooltip.jsx";
15
15
 
16
16
  import type {LinterContextProps} from "../types.js";
17
+ import type {StyleType} from "@khanacademy/wonder-blocks-core";
17
18
 
18
19
  const {captureScratchpadTouchStart} = Util;
19
- const MATH = "math";
20
- const TEXT = "text";
21
- const TEX = "tex";
22
20
 
23
21
  type Props = {|
24
22
  type: "math" | "text" | "tex",
@@ -34,7 +32,7 @@ type Props = {|
34
32
  onFocus: () => void,
35
33
  onBlur: () => void,
36
34
  disabled: boolean,
37
- style?: $FlowFixMe,
35
+ style?: StyleType,
38
36
  id: string,
39
37
  linterContext: LinterContextProps,
40
38
  |};
@@ -56,7 +54,7 @@ type State = {|
56
54
 
57
55
  class InputWithExamples extends React.Component<Props, State> {
58
56
  static defaultProps: DefaultProps = {
59
- type: TEXT,
57
+ type: "text",
60
58
  shouldShowExamples: true,
61
59
  onFocus: function () {},
62
60
  onBlur: function () {},
@@ -77,7 +75,7 @@ class InputWithExamples extends React.Component<Props, State> {
77
75
  _getInputClassName: () => string = () => {
78
76
  // <MathOutput> is a special component that manages its own class and
79
77
  // state, as it's a <span> that wants to act like an <input>.
80
- if (this.props.type === TEX) {
78
+ if (this.props.type === "tex") {
81
79
  return this.props.className;
82
80
  }
83
81
 
@@ -108,7 +106,7 @@ class InputWithExamples extends React.Component<Props, State> {
108
106
  style: this.props.style,
109
107
  };
110
108
 
111
- if (this.props.type === TEX) {
109
+ if (this.props.type === "tex") {
112
110
  return inputProps;
113
111
  }
114
112
 
@@ -119,7 +117,7 @@ class InputWithExamples extends React.Component<Props, State> {
119
117
  });
120
118
 
121
119
  // And add final props that are MATH- and TEXT-specific
122
- if (this.props.type === MATH) {
120
+ if (this.props.type === "math") {
123
121
  return _.extend(
124
122
  {
125
123
  buttonSet: this.props.buttonSet,
@@ -129,7 +127,7 @@ class InputWithExamples extends React.Component<Props, State> {
129
127
  inputProps,
130
128
  );
131
129
  }
132
- if (this.props.type === TEXT) {
130
+ if (this.props.type === "text") {
133
131
  return _.extend(
134
132
  {
135
133
  autoCapitalize: "off",
@@ -144,16 +142,17 @@ class InputWithExamples extends React.Component<Props, State> {
144
142
 
145
143
  _getComponentForInputType: () => $FlowFixMe = () => {
146
144
  switch (this.props.type) {
147
- case TEX:
145
+ case "tex":
148
146
  return MathOutput;
149
147
 
150
- case MATH:
148
+ case "math":
151
149
  return MathInput;
152
150
 
153
- case TEXT:
151
+ case "text":
154
152
  return TextInput;
155
153
 
156
154
  default:
155
+ (this.props.type: empty);
157
156
  return null;
158
157
  }
159
158
  };
@@ -169,7 +168,7 @@ class InputWithExamples extends React.Component<Props, State> {
169
168
 
170
169
  // Static rendering, which doesn't include the 'tooltip' logic that the
171
170
  // other types require, and is hence handled separately.
172
- if (this.props.type === TEX) {
171
+ if (this.props.type === "tex") {
173
172
  return input;
174
173
  }
175
174
 
package/src/index.js CHANGED
@@ -121,6 +121,7 @@ export type {
121
121
  WidgetExports,
122
122
  WidgetInfo,
123
123
  } from "./types.js";
124
+ export type {ParsedValue} from "./util.js";
124
125
  export type {
125
126
  MathFormat,
126
127
  InputNumberWidget,
package/src/multi-items/__tests__/__snapshots__/multi-renderer_test.js.snap CHANGED
@@ -215,7 +215,7 @@ exports[`multi-item renderer should snapshot: initial render 1`] = `
215
215
  aria-disabled="false"
216
216
  aria-hidden="true"
217
217
  aria-label=""
218
- class="button_vr44p2-o_O-reset_152ygtm-o_O-link_13xlah4-o_O-inlineStyles_1msdppf"
218
+ class="button_vr44p2-o_O-reset_152ygtm-o_O-link_13xlah4-o_O-inlineStyles_1jvwfht"
219
219
  tabindex="0"
220
220
  type="button"
221
221
  >
@@ -392,7 +392,7 @@ exports[`multi-item renderer should snapshot: initial render 1`] = `
392
392
  aria-disabled="false"
393
393
  aria-hidden="true"
394
394
  aria-label=""
395
- class="button_vr44p2-o_O-reset_152ygtm-o_O-link_13xlah4-o_O-inlineStyles_1msdppf"
395
+ class="button_vr44p2-o_O-reset_152ygtm-o_O-link_13xlah4-o_O-inlineStyles_1jvwfht"
396
396
  tabindex="0"
397
397
  type="button"
398
398
  >
@@ -569,7 +569,7 @@ exports[`multi-item renderer should snapshot: initial render 1`] = `
569
569
  aria-disabled="false"
570
570
  aria-hidden="true"
571
571
  aria-label=""
572
- class="button_vr44p2-o_O-reset_152ygtm-o_O-link_13xlah4-o_O-inlineStyles_1msdppf"
572
+ class="button_vr44p2-o_O-reset_152ygtm-o_O-link_13xlah4-o_O-inlineStyles_1jvwfht"
573
573
  tabindex="0"
574
574
  type="button"
575
575
  >
@@ -746,7 +746,7 @@ exports[`multi-item renderer should snapshot: initial render 1`] = `
746
746
  aria-disabled="false"
747
747
  aria-hidden="true"
748
748
  aria-label=""
749
- class="button_vr44p2-o_O-reset_152ygtm-o_O-link_13xlah4-o_O-inlineStyles_1msdppf"
749
+ class="button_vr44p2-o_O-reset_152ygtm-o_O-link_13xlah4-o_O-inlineStyles_1jvwfht"
750
750
  tabindex="0"
751
751
  type="button"
752
752
  >
@@ -923,7 +923,7 @@ exports[`multi-item renderer should snapshot: initial render 1`] = `
923
923
  aria-disabled="false"
924
924
  aria-hidden="true"
925
925
  aria-label=""
926
- class="button_vr44p2-o_O-reset_152ygtm-o_O-link_13xlah4-o_O-inlineStyles_1msdppf"
926
+ class="button_vr44p2-o_O-reset_152ygtm-o_O-link_13xlah4-o_O-inlineStyles_1jvwfht"
927
927
  tabindex="0"
928
928
  type="button"
929
929
  >
@@ -1040,7 +1040,7 @@ exports[`multi-item renderer should snapshot: initial render 1`] = `
1040
1040
  autocapitalize="off"
1041
1041
  autocomplete="off"
1042
1042
  autocorrect="off"
1043
- class="input_1t4b01j-o_O-LabelMedium_1rew30o-o_O-default_1r2dwp3"
1043
+ class="input_1t4b01j-o_O-LabelMedium_1rew30o-o_O-default_1r2dwp3-o_O-default_1gznapd-o_O-leftAlign_7jg4r4"
1044
1044
  id="input-with-examples-aW5wdXQtbnVtYmVyIDE"
1045
1045
  type="text"
1046
1046
  value=""
package/src/perseus-types.js CHANGED
@@ -1404,12 +1404,13 @@ export type PerseusVideoWidgetOptions = {|
1404
1404
  export type PerseusInputNumberWidgetOptions = {|
1405
1405
  answerType?:
1406
1406
  | "number"
1407
- | "percent"
1407
+ | "decimal"
1408
1408
  | "integer"
1409
- | "improper"
1410
1409
  | "rational"
1411
- | "pi"
1412
- | "decimal",
1410
+ | "improper"
1411
+ | "mixed"
1412
+ | "percent"
1413
+ | "pi",
1413
1414
  inexact?: boolean,
1414
1415
  maxError?: number | string,
1415
1416
  rightAlign?: boolean,
package/src/util.js CHANGED
@@ -20,7 +20,7 @@ type WordAndPosition = {|
20
20
 
21
21
  type RNG = () => number;
22
22
 
23
- type ParsedValue = {|
23
+ export type ParsedValue = {|
24
24
  value: number,
25
25
  exact: boolean,
26
26
  |};
package/src/widgets/__stories__/input-number.stories.jsx CHANGED
@@ -31,7 +31,10 @@ export default {
31
31
  control: {type: "number"},
32
32
  },
33
33
  simplify: {
34
- control: {type: "select", options: ["optional", "required"]},
34
+ control: {
35
+ type: "select",
36
+ options: ["required", "optional", "enforced"],
37
+ },
35
38
  },
36
39
  answerType: {
37
40
  control: {
@@ -49,7 +52,10 @@ export default {
49
52
  },
50
53
  },
51
54
  size: {
52
- control: {type: "select", options: ["normal", "large"]},
55
+ control: {type: "select", options: ["normal", "small"]},
56
+ },
57
+ rightAlign: {
58
+ control: {type: "boolean"},
53
59
  },
54
60
  },
55
61
  };
@@ -66,7 +72,13 @@ const updateWidgetOptions = (
66
72
  return {
67
73
  ...question,
68
74
  widgets: {
69
- [widgetId]: {...widget, options},
75
+ [widgetId]: {
76
+ ...widget,
77
+ options: {
78
+ ...widget.options,
79
+ ...options,
80
+ },
81
+ },
70
82
  },
71
83
  };
72
84
  };
@@ -88,3 +100,17 @@ export const Percent = (args: InputNumberOptions): React.Node => {
88
100
  return <RendererWithDebugUI question={question} />;
89
101
  };
90
102
  Percent.args = question3.widgets["input-number 1"].options;
103
+
104
+ export const RationalWithSatStyling = (
105
+ args: InputNumberOptions,
106
+ ): React.Node => {
107
+ const question = updateWidgetOptions(question1, "input-number 1", args);
108
+ return (
109
+ <RendererWithDebugUI
110
+ question={question}
111
+ apiOptions={{satStyling: true}}
112
+ reviewMode={true}
113
+ />
114
+ );
115
+ };
116
+ Rational.args = question1.widgets["input-number 1"].options;
package/src/widgets/__tests__/__snapshots__/group_test.jsx.snap CHANGED
@@ -194,7 +194,7 @@ exports[`group widget should snapshot: initial render 1`] = `
194
194
  aria-disabled="false"
195
195
  aria-hidden="true"
196
196
  aria-label=""
197
- class="button_vr44p2-o_O-reset_152ygtm-o_O-link_13xlah4-o_O-inlineStyles_1msdppf"
197
+ class="button_vr44p2-o_O-reset_152ygtm-o_O-link_13xlah4-o_O-inlineStyles_1jvwfht"
198
198
  tabindex="0"
199
199
  type="button"
200
200
  >
@@ -319,7 +319,7 @@ exports[`group widget should snapshot: initial render 1`] = `
319
319
  aria-disabled="false"
320
320
  aria-hidden="true"
321
321
  aria-label=""
322
- class="button_vr44p2-o_O-reset_152ygtm-o_O-link_13xlah4-o_O-inlineStyles_1msdppf"
322
+ class="button_vr44p2-o_O-reset_152ygtm-o_O-link_13xlah4-o_O-inlineStyles_1jvwfht"
323
323
  tabindex="0"
324
324
  type="button"
325
325
  >
@@ -444,7 +444,7 @@ exports[`group widget should snapshot: initial render 1`] = `
444
444
  aria-disabled="false"
445
445
  aria-hidden="true"
446
446
  aria-label=""
447
- class="button_vr44p2-o_O-reset_152ygtm-o_O-link_13xlah4-o_O-inlineStyles_1msdppf"
447
+ class="button_vr44p2-o_O-reset_152ygtm-o_O-link_13xlah4-o_O-inlineStyles_1jvwfht"
448
448
  tabindex="0"
449
449
  type="button"
450
450
  >
@@ -569,7 +569,7 @@ exports[`group widget should snapshot: initial render 1`] = `
569
569
  aria-disabled="false"
570
570
  aria-hidden="true"
571
571
  aria-label=""
572
- class="button_vr44p2-o_O-reset_152ygtm-o_O-link_13xlah4-o_O-inlineStyles_1msdppf"
572
+ class="button_vr44p2-o_O-reset_152ygtm-o_O-link_13xlah4-o_O-inlineStyles_1jvwfht"
573
573
  tabindex="0"
574
574
  type="button"
575
575
  >
@@ -694,7 +694,7 @@ exports[`group widget should snapshot: initial render 1`] = `
694
694
  aria-disabled="false"
695
695
  aria-hidden="true"
696
696
  aria-label=""
697
- class="button_vr44p2-o_O-reset_152ygtm-o_O-link_13xlah4-o_O-inlineStyles_1msdppf"
697
+ class="button_vr44p2-o_O-reset_152ygtm-o_O-link_13xlah4-o_O-inlineStyles_1jvwfht"
698
698
  tabindex="0"
699
699
  type="button"
700
700
  >
package/src/widgets/__tests__/__snapshots__/input-number_test.jsx.snap CHANGED
@@ -169,7 +169,7 @@ exports[`rendering static renders: static render 1`] = `
169
169
  class="perseus-widget-container widget-nohighlight widget-inline-block"
170
170
  >
171
171
  <span
172
- class="math-output perseus-input perseus-interactive perseus-input-size-small"
172
+ class="math-output perseus-input perseus-interactive"
173
173
  >
174
174
  <div
175
175
  style="text-align: center;"