@khanacademy/perseus 4.0.2 → 6.0.0

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 (249) hide show
  1. package/CHANGELOG.md +57 -0
  2. package/dist/components/fixed-to-responsive.d.ts +27 -1
  3. package/dist/components/fixed-to-responsive.js.flow +27 -1
  4. package/dist/components/graph.d.ts +42 -26
  5. package/dist/components/graph.js.flow +42 -28
  6. package/dist/components/graphie.d.ts +34 -22
  7. package/dist/components/graphie.js.flow +37 -24
  8. package/dist/components/highlighting/highlightable-content.d.ts +4 -4
  9. package/dist/components/highlighting/highlightable-content.js.flow +4 -7
  10. package/dist/components/highlighting/ui/highlight-renderer.d.ts +6 -6
  11. package/dist/components/highlighting/ui/highlight-renderer.js.flow +6 -8
  12. package/dist/components/highlighting/ui/highlight-set-renderer.d.ts +5 -5
  13. package/dist/components/highlighting/ui/highlight-set-renderer.js.flow +5 -8
  14. package/dist/components/highlighting/ui/highlight-tooltip.d.ts +2 -2
  15. package/dist/components/highlighting/ui/highlight-tooltip.js.flow +2 -4
  16. package/dist/components/highlighting/ui/highlighting-ui.d.ts +2 -2
  17. package/dist/components/highlighting/ui/highlighting-ui.js.flow +2 -2
  18. package/dist/components/highlighting/ui/selection-tracker.d.ts +5 -5
  19. package/dist/components/highlighting/ui/selection-tracker.js.flow +5 -7
  20. package/dist/components/highlighting/word-indexer.d.ts +2 -2
  21. package/dist/components/highlighting/word-indexer.js.flow +2 -2
  22. package/dist/components/hud.d.ts +8 -14
  23. package/dist/components/hud.js.flow +7 -14
  24. package/dist/components/inline-icon.d.ts +27 -3
  25. package/dist/components/inline-icon.js.flow +26 -3
  26. package/dist/components/lint.d.ts +41 -13
  27. package/dist/components/lint.js.flow +42 -13
  28. package/dist/components/math-output.d.ts +15 -11
  29. package/dist/components/math-output.js.flow +15 -11
  30. package/dist/components/simple-keypad-input.d.ts +1 -1
  31. package/dist/components/simple-keypad-input.js.flow +1 -1
  32. package/dist/components/sortable.d.ts +17 -9
  33. package/dist/components/sortable.js.flow +22 -9
  34. package/dist/components/svg-image.d.ts +5 -3
  35. package/dist/components/svg-image.js.flow +5 -3
  36. package/dist/components/tex-buttons.d.ts +2 -2
  37. package/dist/components/tex-buttons.js.flow +2 -2
  38. package/dist/components/tooltip.d.ts +45 -4
  39. package/dist/components/tooltip.js.flow +44 -31
  40. package/dist/error-boundary.d.ts +4 -4
  41. package/dist/error-boundary.js.flow +4 -6
  42. package/dist/es/index.css +0 -3
  43. package/dist/es/index.js +484 -658
  44. package/dist/es/index.js.map +1 -1
  45. package/dist/index.css +0 -3
  46. package/dist/index.js +488 -655
  47. package/dist/index.js.map +1 -1
  48. package/dist/perseus-types.d.ts +11 -10
  49. package/dist/perseus-types.js.flow +11 -10
  50. package/dist/renderer.d.ts +2 -2
  51. package/dist/renderer.js.flow +1 -3
  52. package/dist/styles/shared.d.ts +0 -1
  53. package/dist/styles/shared.js.flow +0 -1
  54. package/dist/types.d.ts +0 -10
  55. package/dist/types.js.flow +0 -13
  56. package/dist/util/a11y.d.ts +0 -1
  57. package/dist/util/a11y.js.flow +0 -1
  58. package/dist/util/interactive.d.ts +2 -0
  59. package/dist/util/interactive.js.flow +2 -0
  60. package/dist/util.d.ts +3 -3
  61. package/dist/util.js.flow +4 -3
  62. package/dist/widgets/__stories__/test-keypad-context-wrapper.d.ts +2 -2
  63. package/dist/widgets/__stories__/test-keypad-context-wrapper.js.flow +2 -4
  64. package/dist/widgets/expression.d.ts +2 -2
  65. package/dist/widgets/expression.js.flow +2 -2
  66. package/dist/widgets/grapher.d.ts +1 -1
  67. package/dist/widgets/grapher.js.flow +12 -3
  68. package/dist/widgets/interaction/element-container.d.ts +5 -4
  69. package/dist/widgets/interaction/element-container.js.flow +6 -11
  70. package/dist/widgets/label-image/marker.d.ts +4 -4
  71. package/dist/widgets/label-image/marker.js.flow +4 -6
  72. package/dist/widgets/matcher.d.ts +7 -3
  73. package/dist/widgets/matcher.js.flow +7 -3
  74. package/dist/widgets/number-line.d.ts +1 -1
  75. package/dist/widgets/number-line.js.flow +1 -1
  76. package/dist/widgets/numeric-input.d.ts +0 -2
  77. package/dist/widgets/numeric-input.js.flow +0 -4
  78. package/dist/widgets/radio/base-radio.d.ts +7 -1
  79. package/dist/widgets/radio/base-radio.js.flow +7 -1
  80. package/dist/widgets/radio/choice-icon/choice-icon.d.ts +1 -1
  81. package/dist/widgets/radio/choice-icon/choice-icon.js.flow +1 -1
  82. package/dist/widgets/radio/choice-icon/cross-out-line.d.ts +2 -2
  83. package/dist/widgets/radio/choice-icon/cross-out-line.js.flow +2 -2
  84. package/dist/widgets/radio/focus-ring.d.ts +8 -1
  85. package/dist/widgets/radio/focus-ring.js.flow +8 -1
  86. package/dist/widgets/radio/option-status.d.ts +2 -2
  87. package/dist/widgets/radio/option-status.js.flow +2 -2
  88. package/dist/widgets/video-transcript-link.d.ts +1 -1
  89. package/dist/widgets/video-transcript-link.js.flow +1 -1
  90. package/package.json +4 -4
  91. package/src/__stories__/item-renderer.stories.tsx +2 -6
  92. package/src/__stories__/server-item-renderer.stories.tsx +2 -6
  93. package/src/__tests__/__snapshots__/item-renderer.test.tsx.snap +151 -159
  94. package/src/__tests__/__snapshots__/renderer.test.tsx.snap +358 -394
  95. package/src/__tests__/__snapshots__/server-item-renderer.test.tsx.snap +169 -189
  96. package/src/components/__stories__/button-group.stories.tsx +2 -6
  97. package/src/components/__stories__/fixed-to-responsive.stories.tsx +14 -16
  98. package/src/components/__stories__/graph.stories.tsx +3 -5
  99. package/src/components/__stories__/graphie.stories.tsx +3 -5
  100. package/src/components/__stories__/hud.stories.tsx +2 -6
  101. package/src/components/__stories__/icon.stories.tsx +1 -1
  102. package/src/components/__stories__/image-loader.stories.tsx +4 -4
  103. package/src/components/__stories__/info-tip.stories.tsx +2 -6
  104. package/src/components/__stories__/inline-icon.stories.tsx +4 -8
  105. package/src/components/__stories__/input-with-examples.stories.tsx +6 -10
  106. package/src/components/__stories__/lint.stories.tsx +62 -27
  107. package/src/components/__stories__/math-input.stories.tsx +4 -8
  108. package/src/components/__stories__/math-output.stories.tsx +3 -5
  109. package/src/components/__stories__/multi-button-group.stories.tsx +2 -6
  110. package/src/components/__stories__/number-input.stories.tsx +6 -8
  111. package/src/components/__stories__/prop-check-box.stories.tsx +9 -9
  112. package/src/components/__stories__/range-input.stories.tsx +4 -6
  113. package/src/components/__stories__/simple-keypad-input.stories.tsx +2 -4
  114. package/src/components/__stories__/sortable.stories.tsx +20 -20
  115. package/src/components/__stories__/stub-tag-editor.stories.tsx +5 -9
  116. package/src/components/__stories__/svg-image.stories.tsx +10 -18
  117. package/src/components/__stories__/tex.stories.tsx +1 -3
  118. package/src/components/__stories__/text-buttons.stories.tsx +10 -22
  119. package/src/components/__stories__/text-input.stories.tsx +4 -10
  120. package/src/components/__stories__/text-list-editor.stories.tsx +1 -3
  121. package/src/components/__stories__/tooltip.stories.tsx +52 -0
  122. package/src/components/__stories__/zoomable-tex.stories.tsx +6 -4
  123. package/src/components/__stories__/zoomable.stories.tsx +1 -3
  124. package/src/components/__tests__/__snapshots__/sortable.test.tsx.snap +114 -30
  125. package/src/components/__tests__/__snapshots__/sorter.test.tsx.snap +172 -204
  126. package/src/components/__tests__/sortable.test.tsx +54 -16
  127. package/src/components/__tests__/sorter.test.tsx +12 -9
  128. package/src/components/fixed-to-responsive.tsx +43 -38
  129. package/src/components/graph.tsx +95 -81
  130. package/src/components/graphie.tsx +62 -32
  131. package/src/components/highlighting/highlightable-content.tsx +4 -7
  132. package/src/components/highlighting/ui/highlight-renderer.tsx +6 -9
  133. package/src/components/highlighting/ui/highlight-set-renderer.tsx +5 -8
  134. package/src/components/highlighting/ui/highlight-tooltip.tsx +2 -2
  135. package/src/components/highlighting/ui/highlighting-ui.tsx +2 -2
  136. package/src/components/highlighting/ui/selection-tracker.tsx +5 -8
  137. package/src/components/highlighting/word-indexer.tsx +2 -2
  138. package/src/components/hud.tsx +104 -115
  139. package/src/components/inline-icon.tsx +17 -34
  140. package/src/components/input-with-examples.tsx +4 -4
  141. package/src/components/lint.tsx +47 -41
  142. package/src/components/math-output.tsx +17 -11
  143. package/src/components/simple-keypad-input.tsx +4 -4
  144. package/src/components/sortable.tsx +134 -94
  145. package/src/components/svg-image.tsx +10 -11
  146. package/src/components/tex-buttons.tsx +2 -2
  147. package/src/components/tooltip.tsx +189 -171
  148. package/src/components/visibility-observer/__stories__/visibility-observer.stories.tsx +1 -3
  149. package/src/error-boundary.tsx +4 -7
  150. package/src/interactive2/types.ts +2 -2
  151. package/src/multi-items/__stories__/multi-renderer.stories.tsx +1 -1
  152. package/src/multi-items/__tests__/__snapshots__/multi-renderer.test.tsx.snap +708 -764
  153. package/src/multi-items/__tests__/multi-renderer.test.tsx +2 -3
  154. package/src/perseus-types.ts +13 -12
  155. package/src/renderer.tsx +11 -22
  156. package/src/types.ts +0 -18
  157. package/src/util/graphie.ts +3 -3
  158. package/src/util/interactive.ts +18 -5
  159. package/src/util/tex.ts +13 -77
  160. package/src/util.ts +3 -4
  161. package/src/widgets/__stories__/categorizer.stories.tsx +1 -1
  162. package/src/widgets/__stories__/cs-program.stories.tsx +1 -1
  163. package/src/widgets/__stories__/definition.stories.tsx +3 -7
  164. package/src/widgets/__stories__/dropdown.stories.tsx +1 -1
  165. package/src/widgets/__stories__/explanation.stories.tsx +2 -2
  166. package/src/widgets/__stories__/expression.stories.tsx +5 -11
  167. package/src/widgets/__stories__/graded-group-set.stories.tsx +1 -1
  168. package/src/widgets/__stories__/graded-group.stories.tsx +1 -1
  169. package/src/widgets/__stories__/grapher.stories.tsx +7 -21
  170. package/src/widgets/__stories__/group.stories.tsx +1 -1
  171. package/src/widgets/__stories__/iframe.stories.tsx +1 -1
  172. package/src/widgets/__stories__/image.stories.tsx +1 -1
  173. package/src/widgets/__stories__/input-number.stories.tsx +3 -12
  174. package/src/widgets/__stories__/interaction.stories.tsx +1 -1
  175. package/src/widgets/__stories__/interactive-graph.stories.tsx +9 -9
  176. package/src/widgets/__stories__/matcher.stories.tsx +1 -1
  177. package/src/widgets/__stories__/matrix.stories.tsx +1 -1
  178. package/src/widgets/__stories__/number-line.stories.tsx +1 -1
  179. package/src/widgets/__stories__/numeric-input.stories.tsx +3 -5
  180. package/src/widgets/__stories__/orderer.stories.tsx +1 -1
  181. package/src/widgets/__stories__/passage-ref.stories.tsx +2 -2
  182. package/src/widgets/__stories__/passage.stories.tsx +3 -9
  183. package/src/widgets/__stories__/radio.stories.tsx +3 -5
  184. package/src/widgets/__stories__/sorter.stories.tsx +1 -1
  185. package/src/widgets/__stories__/test-keypad-context-wrapper.tsx +2 -4
  186. package/src/widgets/__stories__/transformer.stories.tsx +1 -1
  187. package/src/widgets/__stories__/unit.stories.tsx +1 -3
  188. package/src/widgets/__stories__/video-transcript-link.stories.tsx +2 -6
  189. package/src/widgets/__stories__/video.stories.tsx +1 -1
  190. package/src/widgets/__testdata__/group.testdata.ts +0 -2
  191. package/src/widgets/__tests__/__snapshots__/categorizer.test.ts.snap +717 -773
  192. package/src/widgets/__tests__/__snapshots__/cs-program.test.ts.snap +28 -36
  193. package/src/widgets/__tests__/__snapshots__/definition.test.ts.snap +52 -60
  194. package/src/widgets/__tests__/__snapshots__/dropdown.test.ts.snap +100 -108
  195. package/src/widgets/__tests__/__snapshots__/explanation.test.ts.snap +212 -260
  196. package/src/widgets/__tests__/__snapshots__/graded-group-set-jipt.test.ts.snap +613 -641
  197. package/src/widgets/__tests__/__snapshots__/graded-group-set.test.ts.snap +249 -261
  198. package/src/widgets/__tests__/__snapshots__/graded-group.test.ts.snap +671 -735
  199. package/src/widgets/__tests__/__snapshots__/grapher.test.ts.snap +2676 -2684
  200. package/src/widgets/__tests__/__snapshots__/group.test.tsx.snap +938 -1002
  201. package/src/widgets/__tests__/__snapshots__/iframe.test.ts.snap +28 -36
  202. package/src/widgets/__tests__/__snapshots__/image.test.ts.snap +227 -255
  203. package/src/widgets/__tests__/__snapshots__/input-number.test.ts.snap +353 -357
  204. package/src/widgets/__tests__/__snapshots__/interaction.test.ts.snap +255 -259
  205. package/src/widgets/__tests__/__snapshots__/interactive-graph.test.ts.snap +2401 -2433
  206. package/src/widgets/__tests__/__snapshots__/matcher.test.tsx.snap +600 -756
  207. package/src/widgets/__tests__/__snapshots__/matrix.test.ts.snap +420 -428
  208. package/src/widgets/__tests__/__snapshots__/number-line.test.ts.snap +762 -770
  209. package/src/widgets/__tests__/__snapshots__/numeric-input.test.ts.snap +373 -393
  210. package/src/widgets/__tests__/__snapshots__/orderer.test.ts.snap +116 -148
  211. package/src/widgets/__tests__/__snapshots__/passage-ref.test.ts.snap +289 -301
  212. package/src/widgets/__tests__/__snapshots__/passage.test.tsx.snap +1679 -1711
  213. package/src/widgets/__tests__/__snapshots__/radio.test.ts.snap +2692 -2960
  214. package/src/widgets/__tests__/__snapshots__/video.test.ts.snap +90 -98
  215. package/src/widgets/__tests__/group.test.tsx +0 -2
  216. package/src/widgets/__tests__/matcher.test.tsx +33 -9
  217. package/src/widgets/__tests__/radio/focus-ring.test.tsx +0 -1
  218. package/src/widgets/expression.tsx +12 -9
  219. package/src/widgets/grapher.tsx +3 -3
  220. package/src/widgets/image.tsx +2 -2
  221. package/src/widgets/interaction/element-container.tsx +7 -8
  222. package/src/widgets/interactive-graph.tsx +5 -5
  223. package/src/widgets/label-image/__stories__/answer-choices.stories.tsx +2 -4
  224. package/src/widgets/label-image/__stories__/marker.stories.tsx +9 -19
  225. package/src/widgets/label-image/marker.tsx +4 -4
  226. package/src/widgets/matcher.tsx +43 -24
  227. package/src/widgets/number-line.tsx +1 -1
  228. package/src/widgets/numeric-input.tsx +0 -3
  229. package/src/widgets/passage/passage-markdown.tsx +2 -2
  230. package/src/widgets/radio/__stories__/base-radio.stories.tsx +11 -19
  231. package/src/widgets/radio/__stories__/choice-icon.stories.tsx +9 -11
  232. package/src/widgets/radio/__stories__/choice-none-above.stories.tsx +1 -1
  233. package/src/widgets/radio/__stories__/choice.stories.tsx +4 -4
  234. package/src/widgets/radio/__stories__/focus-ring.stories.tsx +1 -1
  235. package/src/widgets/radio/__stories__/option-status.stories.tsx +2 -4
  236. package/src/widgets/radio/base-radio.tsx +1 -1
  237. package/src/widgets/radio/choice-icon/choice-icon.tsx +5 -5
  238. package/src/widgets/radio/choice-icon/cross-out-line.tsx +1 -3
  239. package/src/widgets/radio/choice-none-above.tsx +2 -2
  240. package/src/widgets/radio/choice.tsx +1 -3
  241. package/src/widgets/radio/focus-ring.tsx +1 -1
  242. package/src/widgets/radio/option-status.tsx +2 -4
  243. package/src/widgets/radio/widget.tsx +0 -1
  244. package/src/widgets/reaction-diagram.tsx +2 -2
  245. package/src/widgets/simulator.tsx +4 -6
  246. package/src/widgets/video-transcript-link.tsx +1 -1
  247. package/{tsconfig.json → tsconfig-build.json} +6 -6
  248. package/tsconfig-build.tsbuildinfo +1 -0
  249. package/tsconfig.tsbuildinfo +0 -1
package/src/multi-items/__tests__/__snapshots__/multi-renderer.test.tsx.snap CHANGED
@@ -6,159 +6,236 @@ exports[`multi-item renderer should snapshot: initial render 1`] = `
6
6
  <div
7
7
  id="blurb"
8
8
  >
9
- <span
10
- class="mock-KatexProvider"
9
+ <div
10
+ class="perseus-renderer perseus-renderer-responsive"
11
11
  >
12
12
  <div
13
- class="perseus-renderer perseus-renderer-responsive"
13
+ class="paragraph perseus-paragraph-centered"
14
+ data-perseus-paragraph-index="0"
14
15
  >
15
- <div
16
- class="paragraph perseus-paragraph-centered"
17
- data-perseus-paragraph-index="0"
18
- >
19
-
16
+
20
17
 
21
- </div>
22
18
  </div>
23
- </span>
19
+ </div>
24
20
  </div>
25
21
  <div
26
22
  id="question"
27
23
  >
28
- <span
29
- class="mock-KatexProvider"
24
+ <div
25
+ class="perseus-renderer perseus-renderer-responsive"
30
26
  >
31
27
  <div
32
- class="perseus-renderer perseus-renderer-responsive"
28
+ class="paragraph"
29
+ data-perseus-paragraph-index="0"
33
30
  >
34
31
  <div
35
32
  class="paragraph"
36
- data-perseus-paragraph-index="0"
37
33
  >
38
- <div
39
- class="paragraph"
34
+ Triangle
35
+ <span
36
+ style="white-space: nowrap;"
40
37
  >
41
- Triangle
38
+ <span />
42
39
  <span
43
- style="white-space: nowrap;"
40
+ class="mock-TeX"
44
41
  >
45
- <span />
46
- <span
47
- class="mock-TeX"
48
- >
49
- ABC
50
- </span>
51
- <span />
42
+ ABC
52
43
  </span>
53
- has side lengths of
44
+ <span />
45
+ </span>
46
+ has side lengths of
47
+ <span
48
+ style="white-space: nowrap;"
49
+ >
50
+ <span />
54
51
  <span
55
- style="white-space: nowrap;"
52
+ class="mock-TeX"
56
53
  >
57
- <span />
58
- <span
59
- class="mock-TeX"
60
- >
61
- 12
62
- </span>
63
- <span />
54
+ 12
64
55
  </span>
65
- ,
56
+ <span />
57
+ </span>
58
+ ,
59
+ <span
60
+ style="white-space: nowrap;"
61
+ >
62
+ <span />
66
63
  <span
67
- style="white-space: nowrap;"
64
+ class="mock-TeX"
68
65
  >
69
- <span />
70
- <span
71
- class="mock-TeX"
72
- >
73
- 14
74
- </span>
75
- <span />
66
+ 14
76
67
  </span>
77
- , and
68
+ <span />
69
+ </span>
70
+ , and
71
+ <span
72
+ style="white-space: nowrap;"
73
+ >
74
+ <span />
78
75
  <span
79
- style="white-space: nowrap;"
76
+ class="mock-TeX"
80
77
  >
81
- <span />
82
- <span
83
- class="mock-TeX"
84
- >
85
- 20
86
- </span>
87
- <span />
78
+ 20
88
79
  </span>
89
- . Which of the following triangles is congruent to triangle
80
+ <span />
81
+ </span>
82
+ . Which of the following triangles is congruent to triangle
83
+ <span
84
+ style="white-space: nowrap;"
85
+ >
86
+ <span />
90
87
  <span
91
- style="white-space: nowrap;"
88
+ class="mock-TeX"
92
89
  >
93
- <span />
94
- <span
95
- class="mock-TeX"
96
- >
97
- ABC
98
- </span>
99
- <span />
90
+ ABC
100
91
  </span>
101
- ?
102
- </div>
92
+ <span />
93
+ </span>
94
+ ?
103
95
  </div>
96
+ </div>
97
+ <div
98
+ class="paragraph"
99
+ data-perseus-paragraph-index="1"
100
+ >
104
101
  <div
105
102
  class="paragraph"
106
- data-perseus-paragraph-index="1"
107
103
  >
108
104
  <div
109
- class="paragraph"
105
+ class="perseus-widget-container widget-nohighlight widget-block"
110
106
  >
111
107
  <div
112
- class="perseus-widget-container widget-nohighlight widget-block"
108
+ class="responsiveContainer_vq37gq"
113
109
  >
114
- <div
115
- class="responsiveContainer_vq37gq"
110
+ <fieldset
111
+ class="perseus-widget-radio-fieldset responsiveFieldset_c0l5kf"
116
112
  >
117
- <fieldset
118
- class="perseus-widget-radio-fieldset responsiveFieldset_c0l5kf"
113
+ <legend
114
+ class="perseus-sr-only"
119
115
  >
120
- <legend
121
- class="perseus-sr-only"
122
- >
123
- Choose 1 answer:
124
- </legend>
125
- <div
126
- aria-hidden="true"
127
- class="instructions instructions_125m8j1"
128
- >
129
- Choose 1 answer:
130
- </div>
131
- <ul
132
- class="perseus-widget-radio perseus-rendered-radio radio_1gyjybc-o_O-responsiveRadioContainer_1ybwre2"
133
- style="list-style: none;"
116
+ Choose 1 answer:
117
+ </legend>
118
+ <div
119
+ aria-hidden="true"
120
+ class="instructions instructions_125m8j1"
121
+ >
122
+ Choose 1 answer:
123
+ </div>
124
+ <ul
125
+ class="perseus-widget-radio perseus-rendered-radio radio_1gyjybc-o_O-responsiveRadioContainer_1ybwre2"
126
+ style="list-style: none;"
127
+ >
128
+ <li
129
+ class="aboveScratchpad_1x0jb4k-o_O-item_dswvvi-o_O-responsiveItem_85oyrd perseus-radio-option"
134
130
  >
135
- <li
136
- class="aboveScratchpad_1x0jb4k-o_O-item_dswvvi-o_O-responsiveItem_85oyrd perseus-radio-option"
131
+ <div
132
+ class="description description_psmgei"
133
+ style="flex-direction: column; color: rgb(33, 36, 44);"
137
134
  >
138
135
  <div
139
- class="description description_psmgei"
140
- style="flex-direction: column; color: rgb(33, 36, 44);"
136
+ style="display: flex; flex-direction: row; opacity: 1;"
141
137
  >
142
138
  <div
143
- style="display: flex; flex-direction: row; opacity: 1;"
139
+ class="perseus-sr-only"
140
+ >
141
+ <input
142
+ class="perseus-radio-option-content"
143
+ id="choice-0"
144
+ tabindex="-1"
145
+ type="radio"
146
+ />
147
+ <label
148
+ for="choice-0"
149
+ >
150
+ (Choice A)
151
+  
152
+ <div
153
+ class="perseus-renderer perseus-renderer-responsive"
154
+ >
155
+ <div
156
+ class="paragraph"
157
+ data-perseus-paragraph-index="0"
158
+ >
159
+ <div
160
+ class="paragraph"
161
+ >
162
+ A triangle with side lengths of
163
+ <span
164
+ style="white-space: nowrap;"
165
+ >
166
+ <span />
167
+ <span
168
+ class="mock-TeX"
169
+ >
170
+ 3
171
+ </span>
172
+ <span />
173
+ </span>
174
+ ,
175
+ <span
176
+ style="white-space: nowrap;"
177
+ >
178
+ <span />
179
+ <span
180
+ class="mock-TeX"
181
+ >
182
+ 4
183
+ </span>
184
+ <span />
185
+ </span>
186
+ , and
187
+ <span
188
+ style="white-space: nowrap;"
189
+ >
190
+ <span />
191
+ <span
192
+ class="mock-TeX"
193
+ >
194
+ 5
195
+ </span>
196
+ <span />
197
+ </span>
198
+ </div>
199
+ </div>
200
+ </div>
201
+ </label>
202
+ </div>
203
+ <button
204
+ aria-disabled="false"
205
+ aria-hidden="true"
206
+ class="button_vr44p2-o_O-reset_152ygtm-o_O-link_13xlah4-o_O-inlineStyles_1jvwfht"
207
+ type="button"
144
208
  >
145
209
  <div
146
- class="perseus-sr-only"
210
+ style="display: flex; flex-direction: row; justify-content: center; align-content: center; padding-top: 8px; padding-bottom: 8px; padding-left: 8px;"
147
211
  >
148
- <input
149
- class="perseus-radio-option-content"
150
- id="choice-0"
151
- tabindex="-1"
152
- type="radio"
153
- />
154
- <label
155
- for="choice-0"
212
+ <div
213
+ class="iconWrapper_17y0hv9"
156
214
  >
157
- (Choice A)
158
-  
159
215
  <span
160
- class="mock-KatexProvider"
216
+ class="ring_ya75gi"
217
+ data-test-id="focus-ring"
218
+ style="border-color: transparent; border-radius: 50%;"
161
219
  >
220
+ <div
221
+ class="circle_1tys2th"
222
+ data-is-radio-icon="true"
223
+ data-test-id="choice-icon__library-choice-icon"
224
+ style="border-color: rgba(33,36,44,0.64); color: rgba(33, 36, 44, 0.64); border-radius: 24px;"
225
+ >
226
+ <div
227
+ class="innerWrapper_177sg8x"
228
+ >
229
+ A
230
+ </div>
231
+ </div>
232
+ </span>
233
+ </div>
234
+ <span
235
+ style="padding-left: 12px; text-align: left; flex: 1; padding-top: 4px;"
236
+ >
237
+ <div />
238
+ <div>
162
239
  <div
163
240
  class="perseus-renderer perseus-renderer-responsive"
164
241
  >
@@ -208,132 +285,124 @@ exports[`multi-item renderer should snapshot: initial render 1`] = `
208
285
  </div>
209
286
  </div>
210
287
  </div>
211
- </span>
212
- </label>
288
+ </div>
289
+ </span>
213
290
  </div>
214
- <button
215
- aria-disabled="false"
216
- aria-hidden="true"
217
- class="button_vr44p2-o_O-reset_152ygtm-o_O-link_13xlah4-o_O-inlineStyles_1jvwfht"
218
- type="button"
291
+ </button>
292
+ </div>
293
+ </div>
294
+ </li>
295
+ <li
296
+ class="aboveScratchpad_1x0jb4k-o_O-item_dswvvi-o_O-responsiveItem_85oyrd perseus-radio-option"
297
+ >
298
+ <div
299
+ class="description description_psmgei"
300
+ style="flex-direction: column; color: rgb(33, 36, 44);"
301
+ >
302
+ <div
303
+ style="display: flex; flex-direction: row; opacity: 1;"
304
+ >
305
+ <div
306
+ class="perseus-sr-only"
307
+ >
308
+ <input
309
+ class="perseus-radio-option-content"
310
+ id="choice-1"
311
+ tabindex="-1"
312
+ type="radio"
313
+ />
314
+ <label
315
+ for="choice-1"
219
316
  >
317
+ (Choice B)
318
+  
220
319
  <div
221
- style="display: flex; flex-direction: row; justify-content: center; align-content: center; padding-top: 8px; padding-bottom: 8px; padding-left: 8px;"
320
+ class="perseus-renderer perseus-renderer-responsive"
222
321
  >
223
322
  <div
224
- class="iconWrapper_17y0hv9"
323
+ class="paragraph"
324
+ data-perseus-paragraph-index="0"
225
325
  >
226
- <span
227
- class="ring_ya75gi"
228
- data-test-id="focus-ring"
229
- style="border-color: transparent; border-radius: 50%;"
326
+ <div
327
+ class="paragraph"
230
328
  >
231
- <div
232
- class="circle_1tys2th"
233
- data-is-radio-icon="true"
234
- data-test-id="choice-icon__library-choice-icon"
235
- style="border-color: rgba(33,36,44,0.64); color: rgba(33, 36, 44, 0.64); border-radius: 24px;"
329
+ A triangle with side lengths of
330
+ <span
331
+ style="white-space: nowrap;"
236
332
  >
237
- <div
238
- class="innerWrapper_177sg8x"
333
+ <span />
334
+ <span
335
+ class="mock-TeX"
239
336
  >
240
- A
241
- </div>
242
- </div>
243
- </span>
244
- </div>
245
- <span
246
- style="padding-left: 12px; text-align: left; flex: 1; padding-top: 4px;"
247
- >
248
- <div />
249
- <div>
337
+ 6
338
+ </span>
339
+ <span />
340
+ </span>
341
+ ,
250
342
  <span
251
- class="mock-KatexProvider"
343
+ style="white-space: nowrap;"
252
344
  >
253
- <div
254
- class="perseus-renderer perseus-renderer-responsive"
345
+ <span />
346
+ <span
347
+ class="mock-TeX"
255
348
  >
256
- <div
257
- class="paragraph"
258
- data-perseus-paragraph-index="0"
259
- >
260
- <div
261
- class="paragraph"
262
- >
263
- A triangle with side lengths of
264
- <span
265
- style="white-space: nowrap;"
266
- >
267
- <span />
268
- <span
269
- class="mock-TeX"
270
- >
271
- 3
272
- </span>
273
- <span />
274
- </span>
275
- ,
276
- <span
277
- style="white-space: nowrap;"
278
- >
279
- <span />
280
- <span
281
- class="mock-TeX"
282
- >
283
- 4
284
- </span>
285
- <span />
286
- </span>
287
- , and
288
- <span
289
- style="white-space: nowrap;"
290
- >
291
- <span />
292
- <span
293
- class="mock-TeX"
294
- >
295
- 5
296
- </span>
297
- <span />
298
- </span>
299
- </div>
300
- </div>
301
- </div>
349
+ 7
350
+ </span>
351
+ <span />
352
+ </span>
353
+ , and
354
+ <span
355
+ style="white-space: nowrap;"
356
+ >
357
+ <span />
358
+ <span
359
+ class="mock-TeX"
360
+ >
361
+ 10
362
+ </span>
363
+ <span />
302
364
  </span>
303
365
  </div>
304
- </span>
366
+ </div>
305
367
  </div>
306
- </button>
368
+ </label>
307
369
  </div>
308
- </div>
309
- </li>
310
- <li
311
- class="aboveScratchpad_1x0jb4k-o_O-item_dswvvi-o_O-responsiveItem_85oyrd perseus-radio-option"
312
- >
313
- <div
314
- class="description description_psmgei"
315
- style="flex-direction: column; color: rgb(33, 36, 44);"
316
- >
317
- <div
318
- style="display: flex; flex-direction: row; opacity: 1;"
370
+ <button
371
+ aria-disabled="false"
372
+ aria-hidden="true"
373
+ class="button_vr44p2-o_O-reset_152ygtm-o_O-link_13xlah4-o_O-inlineStyles_1jvwfht"
374
+ type="button"
319
375
  >
320
376
  <div
321
- class="perseus-sr-only"
377
+ style="display: flex; flex-direction: row; justify-content: center; align-content: center; padding-top: 8px; padding-bottom: 8px; padding-left: 8px;"
322
378
  >
323
- <input
324
- class="perseus-radio-option-content"
325
- id="choice-1"
326
- tabindex="-1"
327
- type="radio"
328
- />
329
- <label
330
- for="choice-1"
379
+ <div
380
+ class="iconWrapper_17y0hv9"
331
381
  >
332
- (Choice B)
333
-  
334
382
  <span
335
- class="mock-KatexProvider"
383
+ class="ring_ya75gi"
384
+ data-test-id="focus-ring"
385
+ style="border-color: transparent; border-radius: 50%;"
336
386
  >
387
+ <div
388
+ class="circle_1tys2th"
389
+ data-is-radio-icon="true"
390
+ data-test-id="choice-icon__library-choice-icon"
391
+ style="border-color: rgba(33,36,44,0.64); color: rgba(33, 36, 44, 0.64); border-radius: 24px;"
392
+ >
393
+ <div
394
+ class="innerWrapper_177sg8x"
395
+ >
396
+ B
397
+ </div>
398
+ </div>
399
+ </span>
400
+ </div>
401
+ <span
402
+ style="padding-left: 12px; text-align: left; flex: 1; padding-top: 4px;"
403
+ >
404
+ <div />
405
+ <div>
337
406
  <div
338
407
  class="perseus-renderer perseus-renderer-responsive"
339
408
  >
@@ -383,132 +452,124 @@ exports[`multi-item renderer should snapshot: initial render 1`] = `
383
452
  </div>
384
453
  </div>
385
454
  </div>
386
- </span>
387
- </label>
455
+ </div>
456
+ </span>
388
457
  </div>
389
- <button
390
- aria-disabled="false"
391
- aria-hidden="true"
392
- class="button_vr44p2-o_O-reset_152ygtm-o_O-link_13xlah4-o_O-inlineStyles_1jvwfht"
393
- type="button"
458
+ </button>
459
+ </div>
460
+ </div>
461
+ </li>
462
+ <li
463
+ class="aboveScratchpad_1x0jb4k-o_O-item_dswvvi-o_O-responsiveItem_85oyrd perseus-radio-option"
464
+ >
465
+ <div
466
+ class="description description_psmgei"
467
+ style="flex-direction: column; color: rgb(33, 36, 44);"
468
+ >
469
+ <div
470
+ style="display: flex; flex-direction: row; opacity: 1;"
471
+ >
472
+ <div
473
+ class="perseus-sr-only"
474
+ >
475
+ <input
476
+ class="perseus-radio-option-content"
477
+ id="choice-2"
478
+ tabindex="-1"
479
+ type="radio"
480
+ />
481
+ <label
482
+ for="choice-2"
394
483
  >
484
+ (Choice C)
485
+  
395
486
  <div
396
- style="display: flex; flex-direction: row; justify-content: center; align-content: center; padding-top: 8px; padding-bottom: 8px; padding-left: 8px;"
487
+ class="perseus-renderer perseus-renderer-responsive"
397
488
  >
398
489
  <div
399
- class="iconWrapper_17y0hv9"
490
+ class="paragraph"
491
+ data-perseus-paragraph-index="0"
400
492
  >
401
- <span
402
- class="ring_ya75gi"
403
- data-test-id="focus-ring"
404
- style="border-color: transparent; border-radius: 50%;"
493
+ <div
494
+ class="paragraph"
405
495
  >
406
- <div
407
- class="circle_1tys2th"
408
- data-is-radio-icon="true"
409
- data-test-id="choice-icon__library-choice-icon"
410
- style="border-color: rgba(33,36,44,0.64); color: rgba(33, 36, 44, 0.64); border-radius: 24px;"
496
+ A triangle with side lengths of
497
+ <span
498
+ style="white-space: nowrap;"
411
499
  >
412
- <div
413
- class="innerWrapper_177sg8x"
500
+ <span />
501
+ <span
502
+ class="mock-TeX"
414
503
  >
415
- B
416
- </div>
417
- </div>
418
- </span>
419
- </div>
420
- <span
421
- style="padding-left: 12px; text-align: left; flex: 1; padding-top: 4px;"
422
- >
423
- <div />
424
- <div>
504
+ 10
505
+ </span>
506
+ <span />
507
+ </span>
508
+ ,
425
509
  <span
426
- class="mock-KatexProvider"
510
+ style="white-space: nowrap;"
427
511
  >
428
- <div
429
- class="perseus-renderer perseus-renderer-responsive"
512
+ <span />
513
+ <span
514
+ class="mock-TeX"
430
515
  >
431
- <div
432
- class="paragraph"
433
- data-perseus-paragraph-index="0"
434
- >
435
- <div
436
- class="paragraph"
437
- >
438
- A triangle with side lengths of
439
- <span
440
- style="white-space: nowrap;"
441
- >
442
- <span />
443
- <span
444
- class="mock-TeX"
445
- >
446
- 6
447
- </span>
448
- <span />
449
- </span>
450
- ,
451
- <span
452
- style="white-space: nowrap;"
453
- >
454
- <span />
455
- <span
456
- class="mock-TeX"
457
- >
458
- 7
459
- </span>
460
- <span />
461
- </span>
462
- , and
463
- <span
464
- style="white-space: nowrap;"
465
- >
466
- <span />
467
- <span
468
- class="mock-TeX"
469
- >
470
- 10
471
- </span>
472
- <span />
473
- </span>
474
- </div>
475
- </div>
476
- </div>
516
+ 12
517
+ </span>
518
+ <span />
519
+ </span>
520
+ , and
521
+ <span
522
+ style="white-space: nowrap;"
523
+ >
524
+ <span />
525
+ <span
526
+ class="mock-TeX"
527
+ >
528
+ 18
529
+ </span>
530
+ <span />
477
531
  </span>
478
532
  </div>
479
- </span>
533
+ </div>
480
534
  </div>
481
- </button>
535
+ </label>
482
536
  </div>
483
- </div>
484
- </li>
485
- <li
486
- class="aboveScratchpad_1x0jb4k-o_O-item_dswvvi-o_O-responsiveItem_85oyrd perseus-radio-option"
487
- >
488
- <div
489
- class="description description_psmgei"
490
- style="flex-direction: column; color: rgb(33, 36, 44);"
491
- >
492
- <div
493
- style="display: flex; flex-direction: row; opacity: 1;"
537
+ <button
538
+ aria-disabled="false"
539
+ aria-hidden="true"
540
+ class="button_vr44p2-o_O-reset_152ygtm-o_O-link_13xlah4-o_O-inlineStyles_1jvwfht"
541
+ type="button"
494
542
  >
495
543
  <div
496
- class="perseus-sr-only"
544
+ style="display: flex; flex-direction: row; justify-content: center; align-content: center; padding-top: 8px; padding-bottom: 8px; padding-left: 8px;"
497
545
  >
498
- <input
499
- class="perseus-radio-option-content"
500
- id="choice-2"
501
- tabindex="-1"
502
- type="radio"
503
- />
504
- <label
505
- for="choice-2"
546
+ <div
547
+ class="iconWrapper_17y0hv9"
506
548
  >
507
- (Choice C)
508
-  
509
549
  <span
510
- class="mock-KatexProvider"
550
+ class="ring_ya75gi"
551
+ data-test-id="focus-ring"
552
+ style="border-color: transparent; border-radius: 50%;"
511
553
  >
554
+ <div
555
+ class="circle_1tys2th"
556
+ data-is-radio-icon="true"
557
+ data-test-id="choice-icon__library-choice-icon"
558
+ style="border-color: rgba(33,36,44,0.64); color: rgba(33, 36, 44, 0.64); border-radius: 24px;"
559
+ >
560
+ <div
561
+ class="innerWrapper_177sg8x"
562
+ >
563
+ C
564
+ </div>
565
+ </div>
566
+ </span>
567
+ </div>
568
+ <span
569
+ style="padding-left: 12px; text-align: left; flex: 1; padding-top: 4px;"
570
+ >
571
+ <div />
572
+ <div>
512
573
  <div
513
574
  class="perseus-renderer perseus-renderer-responsive"
514
575
  >
@@ -558,132 +619,124 @@ exports[`multi-item renderer should snapshot: initial render 1`] = `
558
619
  </div>
559
620
  </div>
560
621
  </div>
561
- </span>
562
- </label>
622
+ </div>
623
+ </span>
563
624
  </div>
564
- <button
565
- aria-disabled="false"
566
- aria-hidden="true"
567
- class="button_vr44p2-o_O-reset_152ygtm-o_O-link_13xlah4-o_O-inlineStyles_1jvwfht"
568
- type="button"
625
+ </button>
626
+ </div>
627
+ </div>
628
+ </li>
629
+ <li
630
+ class="aboveScratchpad_1x0jb4k-o_O-item_dswvvi-o_O-responsiveItem_85oyrd perseus-radio-option"
631
+ >
632
+ <div
633
+ class="description description_psmgei"
634
+ style="flex-direction: column; color: rgb(33, 36, 44);"
635
+ >
636
+ <div
637
+ style="display: flex; flex-direction: row; opacity: 1;"
638
+ >
639
+ <div
640
+ class="perseus-sr-only"
641
+ >
642
+ <input
643
+ class="perseus-radio-option-content"
644
+ id="choice-3"
645
+ tabindex="-1"
646
+ type="radio"
647
+ />
648
+ <label
649
+ for="choice-3"
569
650
  >
651
+ (Choice D)
652
+  
570
653
  <div
571
- style="display: flex; flex-direction: row; justify-content: center; align-content: center; padding-top: 8px; padding-bottom: 8px; padding-left: 8px;"
654
+ class="perseus-renderer perseus-renderer-responsive"
572
655
  >
573
656
  <div
574
- class="iconWrapper_17y0hv9"
657
+ class="paragraph"
658
+ data-perseus-paragraph-index="0"
575
659
  >
576
- <span
577
- class="ring_ya75gi"
578
- data-test-id="focus-ring"
579
- style="border-color: transparent; border-radius: 50%;"
660
+ <div
661
+ class="paragraph"
580
662
  >
581
- <div
582
- class="circle_1tys2th"
583
- data-is-radio-icon="true"
584
- data-test-id="choice-icon__library-choice-icon"
585
- style="border-color: rgba(33,36,44,0.64); color: rgba(33, 36, 44, 0.64); border-radius: 24px;"
663
+ A triangle with side lengths of
664
+ <span
665
+ style="white-space: nowrap;"
586
666
  >
587
- <div
588
- class="innerWrapper_177sg8x"
667
+ <span />
668
+ <span
669
+ class="mock-TeX"
589
670
  >
590
- C
591
- </div>
592
- </div>
593
- </span>
594
- </div>
595
- <span
596
- style="padding-left: 12px; text-align: left; flex: 1; padding-top: 4px;"
597
- >
598
- <div />
599
- <div>
671
+ 12
672
+ </span>
673
+ <span />
674
+ </span>
675
+ ,
600
676
  <span
601
- class="mock-KatexProvider"
677
+ style="white-space: nowrap;"
602
678
  >
603
- <div
604
- class="perseus-renderer perseus-renderer-responsive"
679
+ <span />
680
+ <span
681
+ class="mock-TeX"
605
682
  >
606
- <div
607
- class="paragraph"
608
- data-perseus-paragraph-index="0"
609
- >
610
- <div
611
- class="paragraph"
612
- >
613
- A triangle with side lengths of
614
- <span
615
- style="white-space: nowrap;"
616
- >
617
- <span />
618
- <span
619
- class="mock-TeX"
620
- >
621
- 10
622
- </span>
623
- <span />
624
- </span>
625
- ,
626
- <span
627
- style="white-space: nowrap;"
628
- >
629
- <span />
630
- <span
631
- class="mock-TeX"
632
- >
633
- 12
634
- </span>
635
- <span />
636
- </span>
637
- , and
638
- <span
639
- style="white-space: nowrap;"
640
- >
641
- <span />
642
- <span
643
- class="mock-TeX"
644
- >
645
- 18
646
- </span>
647
- <span />
648
- </span>
649
- </div>
650
- </div>
651
- </div>
683
+ 14
684
+ </span>
685
+ <span />
686
+ </span>
687
+ , and
688
+ <span
689
+ style="white-space: nowrap;"
690
+ >
691
+ <span />
692
+ <span
693
+ class="mock-TeX"
694
+ >
695
+ 20
696
+ </span>
697
+ <span />
652
698
  </span>
653
699
  </div>
654
- </span>
700
+ </div>
655
701
  </div>
656
- </button>
702
+ </label>
657
703
  </div>
658
- </div>
659
- </li>
660
- <li
661
- class="aboveScratchpad_1x0jb4k-o_O-item_dswvvi-o_O-responsiveItem_85oyrd perseus-radio-option"
662
- >
663
- <div
664
- class="description description_psmgei"
665
- style="flex-direction: column; color: rgb(33, 36, 44);"
666
- >
667
- <div
668
- style="display: flex; flex-direction: row; opacity: 1;"
704
+ <button
705
+ aria-disabled="false"
706
+ aria-hidden="true"
707
+ class="button_vr44p2-o_O-reset_152ygtm-o_O-link_13xlah4-o_O-inlineStyles_1jvwfht"
708
+ type="button"
669
709
  >
670
710
  <div
671
- class="perseus-sr-only"
711
+ style="display: flex; flex-direction: row; justify-content: center; align-content: center; padding-top: 8px; padding-bottom: 8px; padding-left: 8px;"
672
712
  >
673
- <input
674
- class="perseus-radio-option-content"
675
- id="choice-3"
676
- tabindex="-1"
677
- type="radio"
678
- />
679
- <label
680
- for="choice-3"
713
+ <div
714
+ class="iconWrapper_17y0hv9"
681
715
  >
682
- (Choice D)
683
-  
684
716
  <span
685
- class="mock-KatexProvider"
717
+ class="ring_ya75gi"
718
+ data-test-id="focus-ring"
719
+ style="border-color: transparent; border-radius: 50%;"
686
720
  >
721
+ <div
722
+ class="circle_1tys2th"
723
+ data-is-radio-icon="true"
724
+ data-test-id="choice-icon__library-choice-icon"
725
+ style="border-color: rgba(33,36,44,0.64); color: rgba(33, 36, 44, 0.64); border-radius: 24px;"
726
+ >
727
+ <div
728
+ class="innerWrapper_177sg8x"
729
+ >
730
+ D
731
+ </div>
732
+ </div>
733
+ </span>
734
+ </div>
735
+ <span
736
+ style="padding-left: 12px; text-align: left; flex: 1; padding-top: 4px;"
737
+ >
738
+ <div />
739
+ <div>
687
740
  <div
688
741
  class="perseus-renderer perseus-renderer-responsive"
689
742
  >
@@ -733,132 +786,124 @@ exports[`multi-item renderer should snapshot: initial render 1`] = `
733
786
  </div>
734
787
  </div>
735
788
  </div>
736
- </span>
737
- </label>
789
+ </div>
790
+ </span>
738
791
  </div>
739
- <button
740
- aria-disabled="false"
741
- aria-hidden="true"
742
- class="button_vr44p2-o_O-reset_152ygtm-o_O-link_13xlah4-o_O-inlineStyles_1jvwfht"
743
- type="button"
792
+ </button>
793
+ </div>
794
+ </div>
795
+ </li>
796
+ <li
797
+ class="aboveScratchpad_1x0jb4k-o_O-item_dswvvi-o_O-responsiveItem_85oyrd perseus-radio-option"
798
+ >
799
+ <div
800
+ class="description description_psmgei"
801
+ style="flex-direction: column; color: rgb(33, 36, 44);"
802
+ >
803
+ <div
804
+ style="display: flex; flex-direction: row; opacity: 1;"
805
+ >
806
+ <div
807
+ class="perseus-sr-only"
808
+ >
809
+ <input
810
+ class="perseus-radio-option-content"
811
+ id="choice-4"
812
+ tabindex="-1"
813
+ type="radio"
814
+ />
815
+ <label
816
+ for="choice-4"
744
817
  >
818
+ (Choice E)
819
+  
745
820
  <div
746
- style="display: flex; flex-direction: row; justify-content: center; align-content: center; padding-top: 8px; padding-bottom: 8px; padding-left: 8px;"
821
+ class="perseus-renderer perseus-renderer-responsive"
747
822
  >
748
823
  <div
749
- class="iconWrapper_17y0hv9"
824
+ class="paragraph"
825
+ data-perseus-paragraph-index="0"
750
826
  >
751
- <span
752
- class="ring_ya75gi"
753
- data-test-id="focus-ring"
754
- style="border-color: transparent; border-radius: 50%;"
827
+ <div
828
+ class="paragraph"
755
829
  >
756
- <div
757
- class="circle_1tys2th"
758
- data-is-radio-icon="true"
759
- data-test-id="choice-icon__library-choice-icon"
760
- style="border-color: rgba(33,36,44,0.64); color: rgba(33, 36, 44, 0.64); border-radius: 24px;"
830
+ A triangle with side lengths of
831
+ <span
832
+ style="white-space: nowrap;"
761
833
  >
762
- <div
763
- class="innerWrapper_177sg8x"
834
+ <span />
835
+ <span
836
+ class="mock-TeX"
764
837
  >
765
- D
766
- </div>
767
- </div>
768
- </span>
769
- </div>
770
- <span
771
- style="padding-left: 12px; text-align: left; flex: 1; padding-top: 4px;"
772
- >
773
- <div />
774
- <div>
838
+ 24
839
+ </span>
840
+ <span />
841
+ </span>
842
+ ,
775
843
  <span
776
- class="mock-KatexProvider"
844
+ style="white-space: nowrap;"
777
845
  >
778
- <div
779
- class="perseus-renderer perseus-renderer-responsive"
846
+ <span />
847
+ <span
848
+ class="mock-TeX"
780
849
  >
781
- <div
782
- class="paragraph"
783
- data-perseus-paragraph-index="0"
784
- >
785
- <div
786
- class="paragraph"
787
- >
788
- A triangle with side lengths of
789
- <span
790
- style="white-space: nowrap;"
791
- >
792
- <span />
793
- <span
794
- class="mock-TeX"
795
- >
796
- 12
797
- </span>
798
- <span />
799
- </span>
800
- ,
801
- <span
802
- style="white-space: nowrap;"
803
- >
804
- <span />
805
- <span
806
- class="mock-TeX"
807
- >
808
- 14
809
- </span>
810
- <span />
811
- </span>
812
- , and
813
- <span
814
- style="white-space: nowrap;"
815
- >
816
- <span />
817
- <span
818
- class="mock-TeX"
819
- >
820
- 20
821
- </span>
822
- <span />
823
- </span>
824
- </div>
825
- </div>
826
- </div>
850
+ 28
851
+ </span>
852
+ <span />
853
+ </span>
854
+ , and
855
+ <span
856
+ style="white-space: nowrap;"
857
+ >
858
+ <span />
859
+ <span
860
+ class="mock-TeX"
861
+ >
862
+ 40
863
+ </span>
864
+ <span />
827
865
  </span>
828
866
  </div>
829
- </span>
867
+ </div>
830
868
  </div>
831
- </button>
869
+ </label>
832
870
  </div>
833
- </div>
834
- </li>
835
- <li
836
- class="aboveScratchpad_1x0jb4k-o_O-item_dswvvi-o_O-responsiveItem_85oyrd perseus-radio-option"
837
- >
838
- <div
839
- class="description description_psmgei"
840
- style="flex-direction: column; color: rgb(33, 36, 44);"
841
- >
842
- <div
843
- style="display: flex; flex-direction: row; opacity: 1;"
871
+ <button
872
+ aria-disabled="false"
873
+ aria-hidden="true"
874
+ class="button_vr44p2-o_O-reset_152ygtm-o_O-link_13xlah4-o_O-inlineStyles_1jvwfht"
875
+ type="button"
844
876
  >
845
877
  <div
846
- class="perseus-sr-only"
878
+ style="display: flex; flex-direction: row; justify-content: center; align-content: center; padding-top: 8px; padding-bottom: 8px; padding-left: 8px;"
847
879
  >
848
- <input
849
- class="perseus-radio-option-content"
850
- id="choice-4"
851
- tabindex="-1"
852
- type="radio"
853
- />
854
- <label
855
- for="choice-4"
880
+ <div
881
+ class="iconWrapper_17y0hv9"
856
882
  >
857
- (Choice E)
858
-  
859
883
  <span
860
- class="mock-KatexProvider"
884
+ class="ring_ya75gi"
885
+ data-test-id="focus-ring"
886
+ style="border-color: transparent; border-radius: 50%;"
861
887
  >
888
+ <div
889
+ class="circle_1tys2th"
890
+ data-is-radio-icon="true"
891
+ data-test-id="choice-icon__library-choice-icon"
892
+ style="border-color: rgba(33,36,44,0.64); color: rgba(33, 36, 44, 0.64); border-radius: 24px;"
893
+ >
894
+ <div
895
+ class="innerWrapper_177sg8x"
896
+ >
897
+ E
898
+ </div>
899
+ </div>
900
+ </span>
901
+ </div>
902
+ <span
903
+ style="padding-left: 12px; text-align: left; flex: 1; padding-top: 4px;"
904
+ >
905
+ <div />
906
+ <div>
862
907
  <div
863
908
  class="perseus-renderer perseus-renderer-responsive"
864
909
  >
@@ -908,270 +953,173 @@ exports[`multi-item renderer should snapshot: initial render 1`] = `
908
953
  </div>
909
954
  </div>
910
955
  </div>
911
- </span>
912
- </label>
913
- </div>
914
- <button
915
- aria-disabled="false"
916
- aria-hidden="true"
917
- class="button_vr44p2-o_O-reset_152ygtm-o_O-link_13xlah4-o_O-inlineStyles_1jvwfht"
918
- type="button"
919
- >
920
- <div
921
- style="display: flex; flex-direction: row; justify-content: center; align-content: center; padding-top: 8px; padding-bottom: 8px; padding-left: 8px;"
922
- >
923
- <div
924
- class="iconWrapper_17y0hv9"
925
- >
926
- <span
927
- class="ring_ya75gi"
928
- data-test-id="focus-ring"
929
- style="border-color: transparent; border-radius: 50%;"
930
- >
931
- <div
932
- class="circle_1tys2th"
933
- data-is-radio-icon="true"
934
- data-test-id="choice-icon__library-choice-icon"
935
- style="border-color: rgba(33,36,44,0.64); color: rgba(33, 36, 44, 0.64); border-radius: 24px;"
936
- >
937
- <div
938
- class="innerWrapper_177sg8x"
939
- >
940
- E
941
- </div>
942
- </div>
943
- </span>
944
956
  </div>
945
- <span
946
- style="padding-left: 12px; text-align: left; flex: 1; padding-top: 4px;"
947
- >
948
- <div />
949
- <div>
950
- <span
951
- class="mock-KatexProvider"
952
- >
953
- <div
954
- class="perseus-renderer perseus-renderer-responsive"
955
- >
956
- <div
957
- class="paragraph"
958
- data-perseus-paragraph-index="0"
959
- >
960
- <div
961
- class="paragraph"
962
- >
963
- A triangle with side lengths of
964
- <span
965
- style="white-space: nowrap;"
966
- >
967
- <span />
968
- <span
969
- class="mock-TeX"
970
- >
971
- 24
972
- </span>
973
- <span />
974
- </span>
975
- ,
976
- <span
977
- style="white-space: nowrap;"
978
- >
979
- <span />
980
- <span
981
- class="mock-TeX"
982
- >
983
- 28
984
- </span>
985
- <span />
986
- </span>
987
- , and
988
- <span
989
- style="white-space: nowrap;"
990
- >
991
- <span />
992
- <span
993
- class="mock-TeX"
994
- >
995
- 40
996
- </span>
997
- <span />
998
- </span>
999
- </div>
1000
- </div>
1001
- </div>
1002
- </span>
1003
- </div>
1004
- </span>
1005
- </div>
1006
- </button>
1007
- </div>
957
+ </span>
958
+ </div>
959
+ </button>
1008
960
  </div>
1009
- </li>
1010
- </ul>
1011
- </fieldset>
1012
- </div>
961
+ </div>
962
+ </li>
963
+ </ul>
964
+ </fieldset>
1013
965
  </div>
1014
966
  </div>
1015
967
  </div>
968
+ </div>
969
+ <div
970
+ class="paragraph"
971
+ data-perseus-paragraph-index="2"
972
+ >
1016
973
  <div
1017
974
  class="paragraph"
1018
- data-perseus-paragraph-index="2"
1019
975
  >
976
+ Enter the number 3 into this field:
1020
977
  <div
1021
- class="paragraph"
978
+ class="perseus-widget-container widget-nohighlight widget-inline-block"
1022
979
  >
1023
- Enter the number 3 into this field:
1024
- <div
1025
- class="perseus-widget-container widget-nohighlight widget-inline-block"
1026
- >
1027
- <span>
1028
- <div>
1029
- <input
1030
- autocapitalize="off"
1031
- autocomplete="off"
1032
- autocorrect="off"
1033
- class="input_1t4b01j-o_O-LabelMedium_1rew30o-o_O-default_1r2dwp3-o_O-default_1gznapd-o_O-leftAlign_7jg4r4"
1034
- id="input-with-examples-aW5wdXQtbnVtYmVyIDE"
1035
- type="text"
1036
- value=""
1037
- />
1038
- </div>
980
+ <span>
981
+ <div>
982
+ <input
983
+ autocapitalize="off"
984
+ autocomplete="off"
985
+ autocorrect="off"
986
+ class="input_1t4b01j-o_O-LabelMedium_1rew30o-o_O-default_1r2dwp3-o_O-default_1gznapd-o_O-leftAlign_7jg4r4"
987
+ id="input-with-examples-aW5wdXQtbnVtYmVyIDE"
988
+ type="text"
989
+ value=""
990
+ />
991
+ </div>
992
+ <div
993
+ style="position: relative; height: 0px; display: none;"
994
+ >
1039
995
  <div
1040
- style="position: relative; height: 0px; display: none;"
996
+ class="tooltipContainer"
997
+ style="position: absolute; left: 0px;"
1041
998
  >
1042
999
  <div
1043
- class="tooltipContainer"
1044
- style="position: absolute; left: 0px;"
1000
+ style="display: block; position: relative; visibility: visible; left: 0px; top: -1px; width: 12px; height: 11px; margin-top: -1px; margin-bottom: -2px; z-index: 10;"
1045
1001
  >
1046
1002
  <div
1047
- style="display: block; position: relative; visibility: visible; left: 0px; top: -1px; width: 12px; height: 11px; margin-top: -1px; margin-bottom: -2px; z-index: 10;"
1048
- >
1049
- <div
1050
- style="display: block; height: 0px; width: 0px; position: absolute; left: 0px; top: -1px; border-right: 12px solid transparent; border-bottom: 12px solid #ccc;"
1051
- />
1052
- <div
1053
- style="display: block; height: 0px; width: 0px; position: absolute; left: 1px; top: 1px; border-right: 10px solid transparent; border-bottom: 10px solid white;"
1054
- />
1055
- </div>
1003
+ style="display: block; height: 0px; width: 0px; position: absolute; left: 0px; top: -1px; border-right: 12px solid transparent; border-bottom: 12px solid #ccc;"
1004
+ />
1005
+ <div
1006
+ style="display: block; height: 0px; width: 0px; position: absolute; left: 1px; top: 1px; border-right: 10px solid transparent; border-bottom: 10px solid white;"
1007
+ />
1008
+ </div>
1009
+ <div
1010
+ class="perseus-formats-tooltip preview-measure"
1011
+ style="position: relative; top: 0px; left: 0px; border: 1px solid #ccc; box-shadow: 0 1px 3px #ccc; z-index: 9;"
1012
+ >
1056
1013
  <div
1057
- class="perseus-formats-tooltip preview-measure"
1058
- style="position: relative; top: 0px; left: 0px; border: 1px solid #ccc; box-shadow: 0 1px 3px #ccc; z-index: 9;"
1014
+ id="input-with-examples-aW5wdXQtbnVtYmVyIDE"
1059
1015
  >
1060
1016
  <div
1061
- id="input-with-examples-aW5wdXQtbnVtYmVyIDE"
1017
+ class="perseus-renderer perseus-renderer-responsive"
1062
1018
  >
1063
- <span
1064
- class="mock-KatexProvider"
1019
+ <div
1020
+ class="paragraph"
1021
+ data-perseus-paragraph-index="0"
1065
1022
  >
1066
- <div
1067
- class="perseus-renderer perseus-renderer-responsive"
1068
- >
1069
- <div
1070
- class="paragraph"
1071
- data-perseus-paragraph-index="0"
1072
- >
1073
- <ul>
1074
- <li>
1075
- <strong>
1076
- Your answer should be
1077
- </strong>
1078
- </li>
1079
- <li>
1080
- an integer, like
1081
- <span
1082
- style="white-space: nowrap;"
1083
- >
1084
- <span />
1085
- <span
1086
- class="mock-TeX"
1087
- >
1088
- 6
1089
- </span>
1090
- <span />
1091
- </span>
1092
- </li>
1093
- <li>
1094
- an
1095
- <em>
1096
- exact
1097
- </em>
1098
- decimal, like
1099
- <span
1100
- style="white-space: nowrap;"
1101
- >
1102
- <span />
1103
- <span
1104
- class="mock-TeX"
1105
- >
1106
- 0.75
1107
- </span>
1108
- <span />
1109
- </span>
1110
- </li>
1111
- <li>
1112
- a
1113
- <em>
1114
- simplified proper
1115
- </em>
1116
- fraction, like
1117
- <span
1118
- style="white-space: nowrap;"
1119
- >
1120
- <span />
1121
- <span
1122
- class="mock-TeX"
1123
- >
1124
- 3/5
1125
- </span>
1126
- <span />
1127
- </span>
1128
- </li>
1129
- <li>
1130
- a
1131
- <em>
1132
- simplified improper
1133
- </em>
1134
- fraction, like
1135
- <span
1136
- style="white-space: nowrap;"
1137
- >
1138
- <span />
1139
- <span
1140
- class="mock-TeX"
1141
- >
1142
- 7/4
1143
- </span>
1144
- <span />
1145
- </span>
1146
- </li>
1147
- <li>
1148
- a mixed number, like
1149
- <span
1150
- style="white-space: nowrap;"
1151
- >
1152
- <span />
1153
- <span
1154
- class="mock-TeX"
1155
- >
1156
- 1\\ 3/4
1157
- </span>
1158
- <span />
1159
- </span>
1160
- </li>
1161
- </ul>
1162
- </div>
1163
- </div>
1164
- </span>
1023
+ <ul>
1024
+ <li>
1025
+ <strong>
1026
+ Your answer should be
1027
+ </strong>
1028
+ </li>
1029
+ <li>
1030
+ an integer, like
1031
+ <span
1032
+ style="white-space: nowrap;"
1033
+ >
1034
+ <span />
1035
+ <span
1036
+ class="mock-TeX"
1037
+ >
1038
+ 6
1039
+ </span>
1040
+ <span />
1041
+ </span>
1042
+ </li>
1043
+ <li>
1044
+ an
1045
+ <em>
1046
+ exact
1047
+ </em>
1048
+ decimal, like
1049
+ <span
1050
+ style="white-space: nowrap;"
1051
+ >
1052
+ <span />
1053
+ <span
1054
+ class="mock-TeX"
1055
+ >
1056
+ 0.75
1057
+ </span>
1058
+ <span />
1059
+ </span>
1060
+ </li>
1061
+ <li>
1062
+ a
1063
+ <em>
1064
+ simplified proper
1065
+ </em>
1066
+ fraction, like
1067
+ <span
1068
+ style="white-space: nowrap;"
1069
+ >
1070
+ <span />
1071
+ <span
1072
+ class="mock-TeX"
1073
+ >
1074
+ 3/5
1075
+ </span>
1076
+ <span />
1077
+ </span>
1078
+ </li>
1079
+ <li>
1080
+ a
1081
+ <em>
1082
+ simplified improper
1083
+ </em>
1084
+ fraction, like
1085
+ <span
1086
+ style="white-space: nowrap;"
1087
+ >
1088
+ <span />
1089
+ <span
1090
+ class="mock-TeX"
1091
+ >
1092
+ 7/4
1093
+ </span>
1094
+ <span />
1095
+ </span>
1096
+ </li>
1097
+ <li>
1098
+ a mixed number, like
1099
+ <span
1100
+ style="white-space: nowrap;"
1101
+ >
1102
+ <span />
1103
+ <span
1104
+ class="mock-TeX"
1105
+ >
1106
+ 1\\ 3/4
1107
+ </span>
1108
+ <span />
1109
+ </span>
1110
+ </li>
1111
+ </ul>
1112
+ </div>
1165
1113
  </div>
1166
1114
  </div>
1167
1115
  </div>
1168
1116
  </div>
1169
- </span>
1170
- </div>
1117
+ </div>
1118
+ </span>
1171
1119
  </div>
1172
1120
  </div>
1173
1121
  </div>
1174
- </span>
1122
+ </div>
1175
1123
  </div>
1176
1124
  <div
1177
1125
  id="hints"
@@ -1194,24 +1142,20 @@ exports[`multi-item renderer should snapshot: initial render 1`] = `
1194
1142
  >
1195
1143
  1 / 3
1196
1144
  </span>
1197
- <span
1198
- class="mock-KatexProvider"
1145
+ <div
1146
+ class="perseus-renderer perseus-renderer-responsive"
1199
1147
  >
1200
1148
  <div
1201
- class="perseus-renderer perseus-renderer-responsive"
1149
+ class="paragraph"
1150
+ data-perseus-paragraph-index="0"
1202
1151
  >
1203
1152
  <div
1204
1153
  class="paragraph"
1205
- data-perseus-paragraph-index="0"
1206
1154
  >
1207
- <div
1208
- class="paragraph"
1209
- >
1210
- If two triangles are congruent, then they have the same side lengths and angle measures.
1211
- </div>
1155
+ If two triangles are congruent, then they have the same side lengths and angle measures.
1212
1156
  </div>
1213
1157
  </div>
1214
- </span>
1158
+ </div>
1215
1159
  </div>
1216
1160
  </div>
1217
1161
  </div>