@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/widgets/__tests__/__snapshots__/matrix.test.ts.snap CHANGED
@@ -2,521 +2,513 @@
2
2
 
3
3
  exports[`matrix widget should snapshot on mobile: first mobile render 1`] = `
4
4
  <div>
5
- <span
6
- class="mock-KatexProvider"
5
+ <div
6
+ class="perseus-renderer perseus-renderer-responsive"
7
7
  >
8
8
  <div
9
- class="perseus-renderer perseus-renderer-responsive"
9
+ class="paragraph"
10
+ data-perseus-paragraph-index="0"
10
11
  >
11
12
  <div
12
13
  class="paragraph"
13
- data-perseus-paragraph-index="0"
14
14
  >
15
- <div
16
- class="paragraph"
17
- >
18
- <strong>
19
- Perform the row operation,
15
+ <strong>
16
+ Perform the row operation,
17
+ <span
18
+ style="white-space: nowrap;"
19
+ >
20
+ <span />
20
21
  <span
21
- style="white-space: nowrap;"
22
+ class="mock-TeX"
22
23
  >
23
- <span />
24
- <span
25
- class="mock-TeX"
26
- >
27
- R_3 \\leftrightarrow R_2
28
- </span>
29
- <span />
24
+ R_3 \\leftrightarrow R_2
30
25
  </span>
31
- , on the following matrix.
32
- </strong>
33
- </div>
26
+ <span />
27
+ </span>
28
+ , on the following matrix.
29
+ </strong>
34
30
  </div>
31
+ </div>
32
+ <div
33
+ class="paragraph perseus-paragraph-centered"
34
+ data-perseus-paragraph-index="1"
35
+ >
35
36
  <div
36
- class="paragraph perseus-paragraph-centered"
37
- data-perseus-paragraph-index="1"
37
+ class="perseus-block-math"
38
+ style="margin-left: -16px; margin-right: -16px;"
38
39
  >
39
40
  <div
40
- class="perseus-block-math"
41
- style="margin-left: -16px; margin-right: -16px;"
41
+ class="perseus-block-math-inner"
42
+ style="overflow-x: auto; overflow-y: hidden; margin-top: -10px; margin-bottom: -10px; transform: translate3d(0,0,0); padding: 10px 16px 10px 16px;"
42
43
  >
43
- <div
44
- class="perseus-block-math-inner"
45
- style="overflow-x: auto; overflow-y: hidden; margin-top: -10px; margin-bottom: -10px; transform: translate3d(0,0,0); padding: 10px 16px 10px 16px;"
44
+ <span
45
+ style="display: block; width: 100%; transform: scale(1, 1) translate(0, 8px); transform-origin: 0 0; opacity: 0;"
46
46
  >
47
47
  <span
48
- style="display: block; width: 100%; transform: scale(1, 1) translate(0, 8px); transform-origin: 0 0; opacity: 0;"
48
+ class="mock-TeX"
49
49
  >
50
- <span
51
- class="mock-TeX"
52
- >
53
- \\left[\\begin{array} {ccc}
50
+ \\left[\\begin{array} {ccc}
54
51
  5 & -2 & 1 & 1 \\\\
55
52
  3 & 0 & 0 & -2 \\\\
56
53
  1 & 1 & 7 & -3 \\end{array} \\right]
57
- </span>
58
54
  </span>
59
- </div>
55
+ </span>
60
56
  </div>
61
57
  </div>
58
+ </div>
59
+ <div
60
+ class="paragraph"
61
+ data-perseus-paragraph-index="2"
62
+ >
62
63
  <div
63
64
  class="paragraph"
64
- data-perseus-paragraph-index="2"
65
65
  >
66
66
  <div
67
- class="paragraph"
67
+ class="perseus-widget-container widget-nohighlight widget-block"
68
68
  >
69
69
  <div
70
- class="perseus-widget-container widget-nohighlight widget-block"
70
+ class="perseus-matrix"
71
71
  >
72
+
72
73
  <div
73
- class="perseus-matrix"
74
+ class="matrix-input"
74
75
  >
75
-
76
76
  <div
77
- class="matrix-input"
77
+ class="matrix-bracket bracket-left"
78
+ style="height: 36px;"
79
+ />
80
+ <div
81
+ class="matrix-bracket bracket-right"
82
+ style="height: 36px; left: 46px;"
83
+ />
84
+ <div
85
+ class="matrix-row"
78
86
  >
79
- <div
80
- class="matrix-bracket bracket-left"
81
- style="height: 36px;"
82
- />
83
- <div
84
- class="matrix-bracket bracket-right"
85
- style="height: 36px; left: 46px;"
86
- />
87
- <div
88
- class="matrix-row"
87
+ <span
88
+ class="matrix-input-field"
89
+ >
90
+ <input
91
+ autocapitalize="off"
92
+ autocomplete="off"
93
+ autocorrect="off"
94
+ class="input_1t4b01j-o_O-LabelMedium_1rew30o-o_O-default_1r2dwp3-o_O-input_1qo22fw"
95
+ id="input-13"
96
+ type="text"
97
+ value=""
98
+ />
99
+ </span>
100
+ <span
101
+ class="matrix-input-field"
102
+ >
103
+ <input
104
+ autocapitalize="off"
105
+ autocomplete="off"
106
+ autocorrect="off"
107
+ class="input_1t4b01j-o_O-LabelMedium_1rew30o-o_O-default_1r2dwp3-o_O-input_1simu8f"
108
+ id="input-14"
109
+ type="text"
110
+ value=""
111
+ />
112
+ </span>
113
+ <span
114
+ class="matrix-input-field"
115
+ >
116
+ <input
117
+ autocapitalize="off"
118
+ autocomplete="off"
119
+ autocorrect="off"
120
+ class="input_1t4b01j-o_O-LabelMedium_1rew30o-o_O-default_1r2dwp3-o_O-input_1simu8f"
121
+ id="input-15"
122
+ type="text"
123
+ value=""
124
+ />
125
+ </span>
126
+ <span
127
+ class="matrix-input-field"
128
+ >
129
+ <input
130
+ autocapitalize="off"
131
+ autocomplete="off"
132
+ autocorrect="off"
133
+ class="input_1t4b01j-o_O-LabelMedium_1rew30o-o_O-default_1r2dwp3-o_O-input_1simu8f"
134
+ id="input-16"
135
+ type="text"
136
+ value=""
137
+ />
138
+ </span>
139
+ </div>
140
+ <div
141
+ class="matrix-row"
142
+ >
143
+ <span
144
+ class="matrix-input-field"
145
+ >
146
+ <input
147
+ autocapitalize="off"
148
+ autocomplete="off"
149
+ autocorrect="off"
150
+ class="input_1t4b01j-o_O-LabelMedium_1rew30o-o_O-default_1r2dwp3-o_O-input_1simu8f"
151
+ id="input-17"
152
+ type="text"
153
+ value=""
154
+ />
155
+ </span>
156
+ <span
157
+ class="matrix-input-field"
89
158
  >
90
- <span
91
- class="matrix-input-field"
92
- >
93
- <input
94
- autocapitalize="off"
95
- autocomplete="off"
96
- autocorrect="off"
97
- class="input_1t4b01j-o_O-LabelMedium_1rew30o-o_O-default_1r2dwp3-o_O-input_1qo22fw"
98
- id="input-13"
99
- type="text"
100
- value=""
101
- />
102
- </span>
103
- <span
104
- class="matrix-input-field"
105
- >
106
- <input
107
- autocapitalize="off"
108
- autocomplete="off"
109
- autocorrect="off"
110
- class="input_1t4b01j-o_O-LabelMedium_1rew30o-o_O-default_1r2dwp3-o_O-input_1simu8f"
111
- id="input-14"
112
- type="text"
113
- value=""
114
- />
115
- </span>
116
- <span
117
- class="matrix-input-field"
118
- >
119
- <input
120
- autocapitalize="off"
121
- autocomplete="off"
122
- autocorrect="off"
123
- class="input_1t4b01j-o_O-LabelMedium_1rew30o-o_O-default_1r2dwp3-o_O-input_1simu8f"
124
- id="input-15"
125
- type="text"
126
- value=""
127
- />
128
- </span>
129
- <span
130
- class="matrix-input-field"
131
- >
132
- <input
133
- autocapitalize="off"
134
- autocomplete="off"
135
- autocorrect="off"
136
- class="input_1t4b01j-o_O-LabelMedium_1rew30o-o_O-default_1r2dwp3-o_O-input_1simu8f"
137
- id="input-16"
138
- type="text"
139
- value=""
140
- />
141
- </span>
142
- </div>
143
- <div
144
- class="matrix-row"
159
+ <input
160
+ autocapitalize="off"
161
+ autocomplete="off"
162
+ autocorrect="off"
163
+ class="input_1t4b01j-o_O-LabelMedium_1rew30o-o_O-default_1r2dwp3-o_O-input_1simu8f"
164
+ id="input-18"
165
+ type="text"
166
+ value=""
167
+ />
168
+ </span>
169
+ <span
170
+ class="matrix-input-field"
145
171
  >
146
- <span
147
- class="matrix-input-field"
148
- >
149
- <input
150
- autocapitalize="off"
151
- autocomplete="off"
152
- autocorrect="off"
153
- class="input_1t4b01j-o_O-LabelMedium_1rew30o-o_O-default_1r2dwp3-o_O-input_1simu8f"
154
- id="input-17"
155
- type="text"
156
- value=""
157
- />
158
- </span>
159
- <span
160
- class="matrix-input-field"
161
- >
162
- <input
163
- autocapitalize="off"
164
- autocomplete="off"
165
- autocorrect="off"
166
- class="input_1t4b01j-o_O-LabelMedium_1rew30o-o_O-default_1r2dwp3-o_O-input_1simu8f"
167
- id="input-18"
168
- type="text"
169
- value=""
170
- />
171
- </span>
172
- <span
173
- class="matrix-input-field"
174
- >
175
- <input
176
- autocapitalize="off"
177
- autocomplete="off"
178
- autocorrect="off"
179
- class="input_1t4b01j-o_O-LabelMedium_1rew30o-o_O-default_1r2dwp3-o_O-input_1simu8f"
180
- id="input-19"
181
- type="text"
182
- value=""
183
- />
184
- </span>
185
- <span
186
- class="matrix-input-field"
187
- >
188
- <input
189
- autocapitalize="off"
190
- autocomplete="off"
191
- autocorrect="off"
192
- class="input_1t4b01j-o_O-LabelMedium_1rew30o-o_O-default_1r2dwp3-o_O-input_1simu8f"
193
- id="input-20"
194
- type="text"
195
- value=""
196
- />
197
- </span>
198
- </div>
199
- <div
200
- class="matrix-row"
172
+ <input
173
+ autocapitalize="off"
174
+ autocomplete="off"
175
+ autocorrect="off"
176
+ class="input_1t4b01j-o_O-LabelMedium_1rew30o-o_O-default_1r2dwp3-o_O-input_1simu8f"
177
+ id="input-19"
178
+ type="text"
179
+ value=""
180
+ />
181
+ </span>
182
+ <span
183
+ class="matrix-input-field"
201
184
  >
202
- <span
203
- class="matrix-input-field"
204
- >
205
- <input
206
- autocapitalize="off"
207
- autocomplete="off"
208
- autocorrect="off"
209
- class="input_1t4b01j-o_O-LabelMedium_1rew30o-o_O-default_1r2dwp3-o_O-input_1simu8f"
210
- id="input-21"
211
- type="text"
212
- value=""
213
- />
214
- </span>
215
- <span
216
- class="matrix-input-field"
217
- >
218
- <input
219
- autocapitalize="off"
220
- autocomplete="off"
221
- autocorrect="off"
222
- class="input_1t4b01j-o_O-LabelMedium_1rew30o-o_O-default_1r2dwp3-o_O-input_1simu8f"
223
- id="input-22"
224
- type="text"
225
- value=""
226
- />
227
- </span>
228
- <span
229
- class="matrix-input-field"
230
- >
231
- <input
232
- autocapitalize="off"
233
- autocomplete="off"
234
- autocorrect="off"
235
- class="input_1t4b01j-o_O-LabelMedium_1rew30o-o_O-default_1r2dwp3-o_O-input_1simu8f"
236
- id="input-23"
237
- type="text"
238
- value=""
239
- />
240
- </span>
241
- <span
242
- class="matrix-input-field"
243
- >
244
- <input
245
- autocapitalize="off"
246
- autocomplete="off"
247
- autocorrect="off"
248
- class="input_1t4b01j-o_O-LabelMedium_1rew30o-o_O-default_1r2dwp3-o_O-input_1simu8f"
249
- id="input-24"
250
- type="text"
251
- value=""
252
- />
253
- </span>
254
- </div>
185
+ <input
186
+ autocapitalize="off"
187
+ autocomplete="off"
188
+ autocorrect="off"
189
+ class="input_1t4b01j-o_O-LabelMedium_1rew30o-o_O-default_1r2dwp3-o_O-input_1simu8f"
190
+ id="input-20"
191
+ type="text"
192
+ value=""
193
+ />
194
+ </span>
195
+ </div>
196
+ <div
197
+ class="matrix-row"
198
+ >
199
+ <span
200
+ class="matrix-input-field"
201
+ >
202
+ <input
203
+ autocapitalize="off"
204
+ autocomplete="off"
205
+ autocorrect="off"
206
+ class="input_1t4b01j-o_O-LabelMedium_1rew30o-o_O-default_1r2dwp3-o_O-input_1simu8f"
207
+ id="input-21"
208
+ type="text"
209
+ value=""
210
+ />
211
+ </span>
212
+ <span
213
+ class="matrix-input-field"
214
+ >
215
+ <input
216
+ autocapitalize="off"
217
+ autocomplete="off"
218
+ autocorrect="off"
219
+ class="input_1t4b01j-o_O-LabelMedium_1rew30o-o_O-default_1r2dwp3-o_O-input_1simu8f"
220
+ id="input-22"
221
+ type="text"
222
+ value=""
223
+ />
224
+ </span>
225
+ <span
226
+ class="matrix-input-field"
227
+ >
228
+ <input
229
+ autocapitalize="off"
230
+ autocomplete="off"
231
+ autocorrect="off"
232
+ class="input_1t4b01j-o_O-LabelMedium_1rew30o-o_O-default_1r2dwp3-o_O-input_1simu8f"
233
+ id="input-23"
234
+ type="text"
235
+ value=""
236
+ />
237
+ </span>
238
+ <span
239
+ class="matrix-input-field"
240
+ >
241
+ <input
242
+ autocapitalize="off"
243
+ autocomplete="off"
244
+ autocorrect="off"
245
+ class="input_1t4b01j-o_O-LabelMedium_1rew30o-o_O-default_1r2dwp3-o_O-input_1simu8f"
246
+ id="input-24"
247
+ type="text"
248
+ value=""
249
+ />
250
+ </span>
255
251
  </div>
256
-
257
252
  </div>
253
+
258
254
  </div>
259
255
  </div>
260
256
  </div>
261
257
  </div>
262
- </span>
258
+ </div>
263
259
  </div>
264
260
  `;
265
261
 
266
262
  exports[`matrix widget should snapshot: first render 1`] = `
267
263
  <div>
268
- <span
269
- class="mock-KatexProvider"
264
+ <div
265
+ class="perseus-renderer perseus-renderer-responsive"
270
266
  >
271
267
  <div
272
- class="perseus-renderer perseus-renderer-responsive"
268
+ class="paragraph"
269
+ data-perseus-paragraph-index="0"
273
270
  >
274
271
  <div
275
272
  class="paragraph"
276
- data-perseus-paragraph-index="0"
277
273
  >
278
- <div
279
- class="paragraph"
280
- >
281
- <strong>
282
- Perform the row operation,
274
+ <strong>
275
+ Perform the row operation,
276
+ <span
277
+ style="white-space: nowrap;"
278
+ >
279
+ <span />
283
280
  <span
284
- style="white-space: nowrap;"
281
+ class="mock-TeX"
285
282
  >
286
- <span />
287
- <span
288
- class="mock-TeX"
289
- >
290
- R_3 \\leftrightarrow R_2
291
- </span>
292
- <span />
283
+ R_3 \\leftrightarrow R_2
293
284
  </span>
294
- , on the following matrix.
295
- </strong>
296
- </div>
285
+ <span />
286
+ </span>
287
+ , on the following matrix.
288
+ </strong>
297
289
  </div>
290
+ </div>
291
+ <div
292
+ class="paragraph perseus-paragraph-centered"
293
+ data-perseus-paragraph-index="1"
294
+ >
298
295
  <div
299
- class="paragraph perseus-paragraph-centered"
300
- data-perseus-paragraph-index="1"
296
+ class="perseus-block-math"
301
297
  >
302
298
  <div
303
- class="perseus-block-math"
299
+ class="perseus-block-math-inner"
300
+ style="overflow-x: auto; overflow-y: hidden; padding-top: 10px; padding-bottom: 10px; margin-top: -10px; margin-bottom: -10px;"
304
301
  >
305
- <div
306
- class="perseus-block-math-inner"
307
- style="overflow-x: auto; overflow-y: hidden; padding-top: 10px; padding-bottom: 10px; margin-top: -10px; margin-bottom: -10px;"
302
+ <span
303
+ class="mock-TeX"
308
304
  >
309
- <span
310
- class="mock-TeX"
311
- >
312
- \\left[\\begin{array} {ccc}
305
+ \\left[\\begin{array} {ccc}
313
306
  5 & -2 & 1 & 1 \\\\
314
307
  3 & 0 & 0 & -2 \\\\
315
308
  1 & 1 & 7 & -3 \\end{array} \\right]
316
- </span>
317
- </div>
309
+ </span>
318
310
  </div>
319
311
  </div>
312
+ </div>
313
+ <div
314
+ class="paragraph"
315
+ data-perseus-paragraph-index="2"
316
+ >
320
317
  <div
321
318
  class="paragraph"
322
- data-perseus-paragraph-index="2"
323
319
  >
324
320
  <div
325
- class="paragraph"
321
+ class="perseus-widget-container widget-nohighlight widget-block"
326
322
  >
327
323
  <div
328
- class="perseus-widget-container widget-nohighlight widget-block"
324
+ class="perseus-matrix"
329
325
  >
326
+
330
327
  <div
331
- class="perseus-matrix"
328
+ class="matrix-input"
332
329
  >
333
-
334
330
  <div
335
- class="matrix-input"
331
+ class="matrix-bracket bracket-left"
332
+ style="height: 36px;"
333
+ />
334
+ <div
335
+ class="matrix-bracket bracket-right"
336
+ style="height: 36px; left: 46px;"
337
+ />
338
+ <div
339
+ class="matrix-row"
340
+ >
341
+ <span
342
+ class="matrix-input-field"
343
+ >
344
+ <input
345
+ autocapitalize="off"
346
+ autocomplete="off"
347
+ autocorrect="off"
348
+ class="input_1t4b01j-o_O-LabelMedium_1rew30o-o_O-default_1r2dwp3-o_O-input_1qo22fw"
349
+ id="input-1"
350
+ type="text"
351
+ value=""
352
+ />
353
+ </span>
354
+ <span
355
+ class="matrix-input-field"
356
+ >
357
+ <input
358
+ autocapitalize="off"
359
+ autocomplete="off"
360
+ autocorrect="off"
361
+ class="input_1t4b01j-o_O-LabelMedium_1rew30o-o_O-default_1r2dwp3-o_O-input_1simu8f"
362
+ id="input-2"
363
+ type="text"
364
+ value=""
365
+ />
366
+ </span>
367
+ <span
368
+ class="matrix-input-field"
369
+ >
370
+ <input
371
+ autocapitalize="off"
372
+ autocomplete="off"
373
+ autocorrect="off"
374
+ class="input_1t4b01j-o_O-LabelMedium_1rew30o-o_O-default_1r2dwp3-o_O-input_1simu8f"
375
+ id="input-3"
376
+ type="text"
377
+ value=""
378
+ />
379
+ </span>
380
+ <span
381
+ class="matrix-input-field"
382
+ >
383
+ <input
384
+ autocapitalize="off"
385
+ autocomplete="off"
386
+ autocorrect="off"
387
+ class="input_1t4b01j-o_O-LabelMedium_1rew30o-o_O-default_1r2dwp3-o_O-input_1simu8f"
388
+ id="input-4"
389
+ type="text"
390
+ value=""
391
+ />
392
+ </span>
393
+ </div>
394
+ <div
395
+ class="matrix-row"
336
396
  >
337
- <div
338
- class="matrix-bracket bracket-left"
339
- style="height: 36px;"
340
- />
341
- <div
342
- class="matrix-bracket bracket-right"
343
- style="height: 36px; left: 46px;"
344
- />
345
- <div
346
- class="matrix-row"
397
+ <span
398
+ class="matrix-input-field"
399
+ >
400
+ <input
401
+ autocapitalize="off"
402
+ autocomplete="off"
403
+ autocorrect="off"
404
+ class="input_1t4b01j-o_O-LabelMedium_1rew30o-o_O-default_1r2dwp3-o_O-input_1simu8f"
405
+ id="input-5"
406
+ type="text"
407
+ value=""
408
+ />
409
+ </span>
410
+ <span
411
+ class="matrix-input-field"
412
+ >
413
+ <input
414
+ autocapitalize="off"
415
+ autocomplete="off"
416
+ autocorrect="off"
417
+ class="input_1t4b01j-o_O-LabelMedium_1rew30o-o_O-default_1r2dwp3-o_O-input_1simu8f"
418
+ id="input-6"
419
+ type="text"
420
+ value=""
421
+ />
422
+ </span>
423
+ <span
424
+ class="matrix-input-field"
425
+ >
426
+ <input
427
+ autocapitalize="off"
428
+ autocomplete="off"
429
+ autocorrect="off"
430
+ class="input_1t4b01j-o_O-LabelMedium_1rew30o-o_O-default_1r2dwp3-o_O-input_1simu8f"
431
+ id="input-7"
432
+ type="text"
433
+ value=""
434
+ />
435
+ </span>
436
+ <span
437
+ class="matrix-input-field"
438
+ >
439
+ <input
440
+ autocapitalize="off"
441
+ autocomplete="off"
442
+ autocorrect="off"
443
+ class="input_1t4b01j-o_O-LabelMedium_1rew30o-o_O-default_1r2dwp3-o_O-input_1simu8f"
444
+ id="input-8"
445
+ type="text"
446
+ value=""
447
+ />
448
+ </span>
449
+ </div>
450
+ <div
451
+ class="matrix-row"
452
+ >
453
+ <span
454
+ class="matrix-input-field"
455
+ >
456
+ <input
457
+ autocapitalize="off"
458
+ autocomplete="off"
459
+ autocorrect="off"
460
+ class="input_1t4b01j-o_O-LabelMedium_1rew30o-o_O-default_1r2dwp3-o_O-input_1simu8f"
461
+ id="input-9"
462
+ type="text"
463
+ value=""
464
+ />
465
+ </span>
466
+ <span
467
+ class="matrix-input-field"
347
468
  >
348
- <span
349
- class="matrix-input-field"
350
- >
351
- <input
352
- autocapitalize="off"
353
- autocomplete="off"
354
- autocorrect="off"
355
- class="input_1t4b01j-o_O-LabelMedium_1rew30o-o_O-default_1r2dwp3-o_O-input_1qo22fw"
356
- id="input-1"
357
- type="text"
358
- value=""
359
- />
360
- </span>
361
- <span
362
- class="matrix-input-field"
363
- >
364
- <input
365
- autocapitalize="off"
366
- autocomplete="off"
367
- autocorrect="off"
368
- class="input_1t4b01j-o_O-LabelMedium_1rew30o-o_O-default_1r2dwp3-o_O-input_1simu8f"
369
- id="input-2"
370
- type="text"
371
- value=""
372
- />
373
- </span>
374
- <span
375
- class="matrix-input-field"
376
- >
377
- <input
378
- autocapitalize="off"
379
- autocomplete="off"
380
- autocorrect="off"
381
- class="input_1t4b01j-o_O-LabelMedium_1rew30o-o_O-default_1r2dwp3-o_O-input_1simu8f"
382
- id="input-3"
383
- type="text"
384
- value=""
385
- />
386
- </span>
387
- <span
388
- class="matrix-input-field"
389
- >
390
- <input
391
- autocapitalize="off"
392
- autocomplete="off"
393
- autocorrect="off"
394
- class="input_1t4b01j-o_O-LabelMedium_1rew30o-o_O-default_1r2dwp3-o_O-input_1simu8f"
395
- id="input-4"
396
- type="text"
397
- value=""
398
- />
399
- </span>
400
- </div>
401
- <div
402
- class="matrix-row"
469
+ <input
470
+ autocapitalize="off"
471
+ autocomplete="off"
472
+ autocorrect="off"
473
+ class="input_1t4b01j-o_O-LabelMedium_1rew30o-o_O-default_1r2dwp3-o_O-input_1simu8f"
474
+ id="input-10"
475
+ type="text"
476
+ value=""
477
+ />
478
+ </span>
479
+ <span
480
+ class="matrix-input-field"
403
481
  >
404
- <span
405
- class="matrix-input-field"
406
- >
407
- <input
408
- autocapitalize="off"
409
- autocomplete="off"
410
- autocorrect="off"
411
- class="input_1t4b01j-o_O-LabelMedium_1rew30o-o_O-default_1r2dwp3-o_O-input_1simu8f"
412
- id="input-5"
413
- type="text"
414
- value=""
415
- />
416
- </span>
417
- <span
418
- class="matrix-input-field"
419
- >
420
- <input
421
- autocapitalize="off"
422
- autocomplete="off"
423
- autocorrect="off"
424
- class="input_1t4b01j-o_O-LabelMedium_1rew30o-o_O-default_1r2dwp3-o_O-input_1simu8f"
425
- id="input-6"
426
- type="text"
427
- value=""
428
- />
429
- </span>
430
- <span
431
- class="matrix-input-field"
432
- >
433
- <input
434
- autocapitalize="off"
435
- autocomplete="off"
436
- autocorrect="off"
437
- class="input_1t4b01j-o_O-LabelMedium_1rew30o-o_O-default_1r2dwp3-o_O-input_1simu8f"
438
- id="input-7"
439
- type="text"
440
- value=""
441
- />
442
- </span>
443
- <span
444
- class="matrix-input-field"
445
- >
446
- <input
447
- autocapitalize="off"
448
- autocomplete="off"
449
- autocorrect="off"
450
- class="input_1t4b01j-o_O-LabelMedium_1rew30o-o_O-default_1r2dwp3-o_O-input_1simu8f"
451
- id="input-8"
452
- type="text"
453
- value=""
454
- />
455
- </span>
456
- </div>
457
- <div
458
- class="matrix-row"
482
+ <input
483
+ autocapitalize="off"
484
+ autocomplete="off"
485
+ autocorrect="off"
486
+ class="input_1t4b01j-o_O-LabelMedium_1rew30o-o_O-default_1r2dwp3-o_O-input_1simu8f"
487
+ id="input-11"
488
+ type="text"
489
+ value=""
490
+ />
491
+ </span>
492
+ <span
493
+ class="matrix-input-field"
459
494
  >
460
- <span
461
- class="matrix-input-field"
462
- >
463
- <input
464
- autocapitalize="off"
465
- autocomplete="off"
466
- autocorrect="off"
467
- class="input_1t4b01j-o_O-LabelMedium_1rew30o-o_O-default_1r2dwp3-o_O-input_1simu8f"
468
- id="input-9"
469
- type="text"
470
- value=""
471
- />
472
- </span>
473
- <span
474
- class="matrix-input-field"
475
- >
476
- <input
477
- autocapitalize="off"
478
- autocomplete="off"
479
- autocorrect="off"
480
- class="input_1t4b01j-o_O-LabelMedium_1rew30o-o_O-default_1r2dwp3-o_O-input_1simu8f"
481
- id="input-10"
482
- type="text"
483
- value=""
484
- />
485
- </span>
486
- <span
487
- class="matrix-input-field"
488
- >
489
- <input
490
- autocapitalize="off"
491
- autocomplete="off"
492
- autocorrect="off"
493
- class="input_1t4b01j-o_O-LabelMedium_1rew30o-o_O-default_1r2dwp3-o_O-input_1simu8f"
494
- id="input-11"
495
- type="text"
496
- value=""
497
- />
498
- </span>
499
- <span
500
- class="matrix-input-field"
501
- >
502
- <input
503
- autocapitalize="off"
504
- autocomplete="off"
505
- autocorrect="off"
506
- class="input_1t4b01j-o_O-LabelMedium_1rew30o-o_O-default_1r2dwp3-o_O-input_1simu8f"
507
- id="input-12"
508
- type="text"
509
- value=""
510
- />
511
- </span>
512
- </div>
495
+ <input
496
+ autocapitalize="off"
497
+ autocomplete="off"
498
+ autocorrect="off"
499
+ class="input_1t4b01j-o_O-LabelMedium_1rew30o-o_O-default_1r2dwp3-o_O-input_1simu8f"
500
+ id="input-12"
501
+ type="text"
502
+ value=""
503
+ />
504
+ </span>
513
505
  </div>
514
-
515
506
  </div>
507
+
516
508
  </div>
517
509
  </div>
518
510
  </div>
519
511
  </div>
520
- </span>
512
+ </div>
521
513
  </div>
522
514
  `;