@khanacademy/perseus 1.1.1 → 1.2.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 (48) hide show
  1. package/CHANGELOG.md +20 -0
  2. package/dist/es/index.css +2 -2
  3. package/dist/es/index.js +14997 -15079
  4. package/dist/es/index.js.map +1 -1
  5. package/dist/index.css +2 -2
  6. package/dist/index.js +15033 -15113
  7. package/dist/index.js.map +1 -1
  8. package/dist/strings.js +1 -0
  9. package/package.json +7 -7
  10. package/src/__stories__/hints-renderer.stories.jsx +52 -0
  11. package/src/__tests__/__snapshots__/renderer_test.jsx.snap +21 -3
  12. package/src/components/highlighting/ui/highlight-tooltip.jsx +29 -23
  13. package/src/components/highlighting/ui/selection-tracker.jsx +17 -28
  14. package/src/hints-renderer.jsx +13 -4
  15. package/src/mixins/__tests__/widget-prop-blacklist_test.js +23 -0
  16. package/src/mixins/widget-prop-blacklist.js +15 -1
  17. package/src/multi-items/__tests__/__snapshots__/multi-renderer_test.js.snap +30 -10
  18. package/src/styles/articles.less +0 -2
  19. package/src/styles/perseus-renderer.less +1 -1
  20. package/src/styles/widgets/passage.less +1 -0
  21. package/src/types.js +1 -1
  22. package/src/widgets/__tests__/__snapshots__/dropdown_test.jsx.snap +16 -2
  23. package/src/widgets/__tests__/__snapshots__/graded-group-set-jipt_test.jsx.snap +3 -3
  24. package/src/widgets/__tests__/__snapshots__/graded-group-set_test.jsx.snap +7 -1
  25. package/src/widgets/__tests__/__snapshots__/graded-group_test.jsx.snap +2 -2
  26. package/src/widgets/__tests__/__snapshots__/group_test.jsx.snap +30 -10
  27. package/src/widgets/__tests__/__snapshots__/passage-ref_test.jsx.snap +3 -3
  28. package/src/widgets/__tests__/__snapshots__/passage_test.jsx.snap +6 -6
  29. package/src/widgets/__tests__/__snapshots__/radio_test.jsx.snap +300 -218
  30. package/src/widgets/__tests__/radio/base-radio_test.jsx +90 -6
  31. package/src/widgets/__tests__/radio/choice-icon_test.jsx +74 -0
  32. package/src/widgets/__tests__/radio/choice_test.jsx +39 -30
  33. package/src/widgets/__tests__/radio_test.jsx +228 -22
  34. package/src/widgets/graded-group-set.jsx +8 -1
  35. package/src/widgets/graded-group.jsx +2 -1
  36. package/src/widgets/passage-ref.jsx +21 -5
  37. package/src/widgets/passage.jsx +3 -1
  38. package/src/widgets/radio/__stories__/base-radio.stories.jsx +7 -3
  39. package/src/widgets/radio/base-radio.jsx +3 -1
  40. package/src/widgets/radio/choice-icon/cross-out-line.jsx +3 -2
  41. package/src/widgets/radio/choice-icon/library-choice-icon.jsx +17 -6
  42. package/src/widgets/radio/choice.jsx +2 -1
  43. package/src/components/new-tooltip/README.md +0 -3
  44. package/src/components/new-tooltip/__stories__/new-tooltip.stories.jsx +0 -665
  45. package/src/components/new-tooltip/__tests__/style-constants_test.js +0 -8
  46. package/src/components/new-tooltip/new-tooltip.jsx +0 -155
  47. package/src/components/new-tooltip/style-constants.js +0 -13
  48. package/src/components/new-tooltip/types.js +0 -183
@@ -47,7 +47,13 @@ exports[`graded group widget should snapshot 1`] = `
47
47
  aria-label="Skip to Problem 1a"
48
48
  class="indicator_1ezvcme-o_O-selectedIndicator_1v68a6x"
49
49
  role="button"
50
- />
50
+ >
51
+ <span
52
+ class="srOnly_19bpjuy"
53
+ >
54
+ Current
55
+ </span>
56
+ </div>
51
57
  <div
52
58
  aria-label="Skip to Problem 1b"
53
59
  class="indicator_1ezvcme"
@@ -36,7 +36,7 @@ exports[`graded-group should snapshot: initial render (mobile: false) 1`] = `
36
36
  class="perseus-graded-group"
37
37
  >
38
38
  <div
39
- class="title_6pk9ag"
39
+ class="title_1lagzkb"
40
40
  >
41
41
  Metabolic strategies of bacteria
42
42
  </div>
@@ -525,7 +525,7 @@ exports[`graded-group should snapshot: initial render (mobile: true) 1`] = `
525
525
  class="gradedGroup_14sgdtb perseus-graded-group"
526
526
  >
527
527
  <div
528
- class="title_6pk9ag"
528
+ class="title_1lagzkb"
529
529
  >
530
530
  Metabolic strategies of bacteria
531
531
  </div>
@@ -197,7 +197,7 @@ exports[`group widget should snapshot: initial render 1`] = `
197
197
  type="button"
198
198
  >
199
199
  <div
200
- style="display: flex; flex-direction: row; justify-content: center; align-content: center; padding-top: 8px; padding-bottom: 8px;"
200
+ style="display: flex; flex-direction: row; justify-content: center; align-content: center; padding-top: 8px; padding-bottom: 8px; padding-left: 8px;"
201
201
  >
202
202
  <div
203
203
  class="iconWrapper_17y0hv9"
@@ -213,7 +213,11 @@ exports[`group widget should snapshot: initial render 1`] = `
213
213
  data-test-id="choice-icon__library-choice-icon"
214
214
  style="border-color: rgba(33,36,44,0.64); color: rgba(33, 36, 44, 0.64); border-radius: 24px;"
215
215
  >
216
- A
216
+ <div
217
+ class="innerWrapper_177sg8x"
218
+ >
219
+ A
220
+ </div>
217
221
  </div>
218
222
  </span>
219
223
  </div>
@@ -316,7 +320,7 @@ exports[`group widget should snapshot: initial render 1`] = `
316
320
  type="button"
317
321
  >
318
322
  <div
319
- style="display: flex; flex-direction: row; justify-content: center; align-content: center; padding-top: 8px; padding-bottom: 8px;"
323
+ style="display: flex; flex-direction: row; justify-content: center; align-content: center; padding-top: 8px; padding-bottom: 8px; padding-left: 8px;"
320
324
  >
321
325
  <div
322
326
  class="iconWrapper_17y0hv9"
@@ -332,7 +336,11 @@ exports[`group widget should snapshot: initial render 1`] = `
332
336
  data-test-id="choice-icon__library-choice-icon"
333
337
  style="border-color: rgba(33,36,44,0.64); color: rgba(33, 36, 44, 0.64); border-radius: 24px;"
334
338
  >
335
- B
339
+ <div
340
+ class="innerWrapper_177sg8x"
341
+ >
342
+ B
343
+ </div>
336
344
  </div>
337
345
  </span>
338
346
  </div>
@@ -435,7 +443,7 @@ exports[`group widget should snapshot: initial render 1`] = `
435
443
  type="button"
436
444
  >
437
445
  <div
438
- style="display: flex; flex-direction: row; justify-content: center; align-content: center; padding-top: 8px; padding-bottom: 8px;"
446
+ style="display: flex; flex-direction: row; justify-content: center; align-content: center; padding-top: 8px; padding-bottom: 8px; padding-left: 8px;"
439
447
  >
440
448
  <div
441
449
  class="iconWrapper_17y0hv9"
@@ -451,7 +459,11 @@ exports[`group widget should snapshot: initial render 1`] = `
451
459
  data-test-id="choice-icon__library-choice-icon"
452
460
  style="border-color: rgba(33,36,44,0.64); color: rgba(33, 36, 44, 0.64); border-radius: 24px;"
453
461
  >
454
- C
462
+ <div
463
+ class="innerWrapper_177sg8x"
464
+ >
465
+ C
466
+ </div>
455
467
  </div>
456
468
  </span>
457
469
  </div>
@@ -554,7 +566,7 @@ exports[`group widget should snapshot: initial render 1`] = `
554
566
  type="button"
555
567
  >
556
568
  <div
557
- style="display: flex; flex-direction: row; justify-content: center; align-content: center; padding-top: 8px; padding-bottom: 8px;"
569
+ style="display: flex; flex-direction: row; justify-content: center; align-content: center; padding-top: 8px; padding-bottom: 8px; padding-left: 8px;"
558
570
  >
559
571
  <div
560
572
  class="iconWrapper_17y0hv9"
@@ -570,7 +582,11 @@ exports[`group widget should snapshot: initial render 1`] = `
570
582
  data-test-id="choice-icon__library-choice-icon"
571
583
  style="border-color: rgba(33,36,44,0.64); color: rgba(33, 36, 44, 0.64); border-radius: 24px;"
572
584
  >
573
- D
585
+ <div
586
+ class="innerWrapper_177sg8x"
587
+ >
588
+ D
589
+ </div>
574
590
  </div>
575
591
  </span>
576
592
  </div>
@@ -673,7 +689,7 @@ exports[`group widget should snapshot: initial render 1`] = `
673
689
  type="button"
674
690
  >
675
691
  <div
676
- style="display: flex; flex-direction: row; justify-content: center; align-content: center; padding-top: 8px; padding-bottom: 8px;"
692
+ style="display: flex; flex-direction: row; justify-content: center; align-content: center; padding-top: 8px; padding-bottom: 8px; padding-left: 8px;"
677
693
  >
678
694
  <div
679
695
  class="iconWrapper_17y0hv9"
@@ -689,7 +705,11 @@ exports[`group widget should snapshot: initial render 1`] = `
689
705
  data-test-id="choice-icon__library-choice-icon"
690
706
  style="border-color: rgba(33,36,44,0.64); color: rgba(33, 36, 44, 0.64); border-radius: 24px;"
691
707
  >
692
- E
708
+ <div
709
+ class="innerWrapper_177sg8x"
710
+ >
711
+ E
712
+ </div>
693
713
  </div>
694
714
  </span>
695
715
  </div>
@@ -55,7 +55,7 @@ exports[`passage-ref widget should render with invalid reference 1`] = `
55
55
  <div>
56
56
  <div>
57
57
  <div
58
- class="measurer_1ugaxv"
58
+ class="measurer_vtwrnx"
59
59
  >
60
60
  <div>
61
61
  <div
@@ -200,7 +200,7 @@ exports[`passage-ref widget should render with multi-line reference 1`] = `
200
200
  <div>
201
201
  <div>
202
202
  <div
203
- class="measurer_1ugaxv"
203
+ class="measurer_vtwrnx"
204
204
  >
205
205
  <div>
206
206
  <div
@@ -350,7 +350,7 @@ exports[`passage-ref widget should render with single-line reference 1`] = `
350
350
  <div>
351
351
  <div>
352
352
  <div
353
- class="measurer_1ugaxv"
353
+ class="measurer_vtwrnx"
354
354
  >
355
355
  <div>
356
356
  <div
@@ -219,7 +219,7 @@ exports[`passage widget should snapshot multiple passages (mobile: false) 1`] =
219
219
  <div>
220
220
  <div>
221
221
  <div
222
- class="measurer_1ugaxv"
222
+ class="measurer_vtwrnx"
223
223
  >
224
224
  <div>
225
225
  <div
@@ -711,7 +711,7 @@ exports[`passage widget should snapshot multiple passages (mobile: false) 1`] =
711
711
  <div>
712
712
  <div>
713
713
  <div
714
- class="measurer_1ugaxv"
714
+ class="measurer_vtwrnx"
715
715
  >
716
716
  <div>
717
717
  <div
@@ -1090,7 +1090,7 @@ exports[`passage widget should snapshot multiple passages (mobile: true) 1`] = `
1090
1090
  <div>
1091
1091
  <div>
1092
1092
  <div
1093
- class="measurer_1ugaxv"
1093
+ class="measurer_vtwrnx"
1094
1094
  >
1095
1095
  <div>
1096
1096
  <div
@@ -1582,7 +1582,7 @@ exports[`passage widget should snapshot multiple passages (mobile: true) 1`] = `
1582
1582
  <div>
1583
1583
  <div>
1584
1584
  <div
1585
- class="measurer_1ugaxv"
1585
+ class="measurer_vtwrnx"
1586
1586
  >
1587
1587
  <div>
1588
1588
  <div
@@ -1840,7 +1840,7 @@ exports[`passage widget should snapshot simple passage (mobile: false) 1`] = `
1840
1840
  <div>
1841
1841
  <div>
1842
1842
  <div
1843
- class="measurer_1ugaxv"
1843
+ class="measurer_vtwrnx"
1844
1844
  >
1845
1845
  <div>
1846
1846
  <div
@@ -1941,7 +1941,7 @@ exports[`passage widget should snapshot simple passage (mobile: true) 1`] = `
1941
1941
  <div>
1942
1942
  <div>
1943
1943
  <div
1944
- class="measurer_1ugaxv"
1944
+ class="measurer_vtwrnx"
1945
1945
  >
1946
1946
  <div>
1947
1947
  <div